.about-band {



      position: relative;   /* 2026-08-19: contain #eqz so quiz appears IN PLACE */
      padding: 36px 0 64px;



    }







    .about {



      display: grid;



      grid-template-columns: minmax(0, 0.92fr) minmax(280px, 0.58fr);



      gap: 20px;



      align-items: start;



      padding: clamp(22px, 4vw, 34px);



      border: 1px solid rgba(0, 223, 246, 0.22);



      border-radius: var(--radius);



      background:



        linear-gradient(135deg, rgba(255, 255, 255, 0.82), rgba(245, 251, 255, 0.72)),



        linear-gradient(135deg, rgba(0, 223, 246, 0.08), rgba(255, 0, 127, 0.06));



      box-shadow: 0 16px 44px rgba(0, 104, 255, 0.09);



    }







    .about h2 {



      margin: 0;



      font-size: 2.32rem;



      line-height: 1.06;



    }







    .about p {



      margin: 16px 0 0;



      color: #526683;



      line-height: 1.76;



    }



    .about p a {

      color: #0a8aa0;

      text-decoration: none;

      transition: color .15s;

      display: inline-flex;

      align-items: center;

      gap: 3px;

    }

    .about p a::after {

      content: "";

      width: 0.85em;

      height: 0.85em;

      opacity: 0.6;

      background-color: currentColor;

      -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E") no-repeat center/contain;

              mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E") no-repeat center/contain;

    }

    .about p a:hover {

      color: #007a8a;

      text-decoration: underline;

      text-underline-offset: 2px;

    }

    .about p a:hover::after {

      opacity: 1;

    }







    .about-list {



      display: grid;



      grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));



      gap: 10px;



      align-content: start;



      margin: 0;



      padding: 0;



      list-style: none;



    }







    .about-list li {



      padding: 0;



      border: 1px solid rgba(7, 19, 47, 0.09);



      border-radius: var(--radius);



      background: rgba(255, 255, 255, 0.68);



      overflow: hidden;



      transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;



    }







    .about-list li:hover {



      transform: translateY(-2px);



      border-color: rgba(0, 223, 246, 0.46);



      box-shadow: 0 14px 30px rgba(0, 104, 255, 0.1);



    }







    .about-link {



      display: grid;



      grid-template-columns: minmax(0, 1fr) 24px;



      gap: 12px;



      align-items: center;



      min-height: 52px;



      padding: 13px 14px;



      color: #102348;



      font-weight: 740;



      line-height: 1.45;



      text-decoration: none;



    }







    .about-arrow {



      display: grid;



      width: 24px;



      height: 24px;



      place-items: center;



      color: #102348;



      font-size: 1.2rem;



      line-height: 1;



    }







    .about-list li:hover .about-arrow {



      color: #0051cf;



    }







    footer {



      padding: 28px 0 38px;



      border-top: 1px solid rgba(7, 19, 47, 0.08);



      color: var(--muted);



      font-size: 0.9rem;



    }







    .footer-inner {



      display: grid;



      grid-template-columns: 1fr auto;



      align-items: center;



      gap: 18px;



    }



    .footer-inner > span:first-child {



      text-align: left;



    }



    .footer-inner > span:last-child {



      text-align: right;



    }



    .footer-inner > .footer-links {



      justify-content: flex-start;



    }



    .footer-links {



      display: flex;



      gap: 36px;



      justify-content: center;



    }



    .footer-links a {



      color: inherit;



      font-size: 0.82rem;



      text-decoration: none;



    }



    .footer-links a:hover {



      text-decoration: underline;



    }