:root {
      color-scheme: dark;
      --night: #020711;
      --night-soft: #071525;
      --cyan: #6cddff;
      --ice: #eafaff;
      --paper: #eef5f8;
      --paper-bright: #f9fcfd;
      --line-dark: rgba(102, 210, 255, .18);
      --line-light: rgba(28, 111, 151, .16);
      --shell: min(100% - 64px, 1480px);
    }

    * { box-sizing: border-box; }

    html {
      min-width: 320px;
      scroll-behavior: smooth;
      background: var(--night);
    }

    body {
      min-width: 320px;
      margin: 0;
      overflow-x: hidden;
      color: #eaf4ff;
      background: var(--night);
      font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      font-weight: 400;
      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
    }

    button, input, a { font: inherit; }
    img { max-width: 100%; }
    a { color: inherit; }
    main { overflow: clip; }

    .page-top-anchor {
      position: absolute;
      top: 0;
      left: 0;
      width: 1px;
      height: 1px;
      pointer-events: none;
    }

    .skip-link {
      position: fixed;
      top: 10px;
      left: 10px;
      z-index: 1000;
      padding: 10px 14px;
      color: #06111d;
      border-radius: 8px;
      background: #dff9ff;
      transform: translateY(-150%);
      transition: transform .2s ease;
    }

    .skip-link:focus { transform: translateY(0); }

    .site-header {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 100;
      height: 90px;
      min-height: 90px;
      max-height: 90px;
      padding: 28px clamp(28px, 3vw, 48px) 0;
      display: flex;
      align-items: flex-start;
      isolation: isolate;
      opacity: 0;
      transform: translateY(-10px);
      animation: headerIn .9s ease .15s forwards;
    }

    .site-header::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      pointer-events: none;
      opacity: 0;
      background: linear-gradient(180deg, rgba(248, 252, 255, .97) 0%, rgba(243, 249, 253, .88) 72%, rgba(243, 249, 253, 0) 100%);
      box-shadow: 0 12px 36px rgba(43, 83, 117, .08);
      -webkit-backdrop-filter: blur(18px) saturate(130%);
      backdrop-filter: blur(18px) saturate(130%);
      transition: opacity .55s ease;
    }

    .site-header.is-light::before { opacity: 1; }

    .mini-logo {
      margin: 9px 58px 0 0;
      flex: 0 0 auto;
      color: #bfeeff;
      background: linear-gradient(105deg, #68cfff 0%, #bfefff 17%, #fff 29%, #68cfff 46%, #e9fbff 64%, #70d6ff 82%, #d6f7ff 100%);
      background-size: 240% 100%;
      background-position: 0% 50%;
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      font-size: 15px;
      font-weight: 500;
      line-height: 18px;
      letter-spacing: .08em;
      text-decoration: none;
      white-space: nowrap;
      opacity: .9;
      filter: drop-shadow(0 0 8px rgba(73, 190, 255, .34));
      transition: opacity .25s ease, filter .35s ease;
      animation: miniLogoShimmer 9s ease-in-out infinite alternate;
    }

    .mini-logo:hover,
    .mini-logo:focus-visible {
      opacity: 1;
      filter: drop-shadow(0 0 11px rgba(82, 203, 255, .62));
    }

    .site-header.is-light .mini-logo {
      filter: brightness(.56) saturate(1.5) drop-shadow(0 2px 7px rgba(18, 99, 160, .16));
    }

    .main-nav {
      min-height: 38px;
      display: flex;
      align-items: center;
      gap: clamp(28px, 3.25vw, 54px);
    }

    .main-nav a,
    .header-actions a {
      color: rgba(220, 233, 247, .72);
      text-decoration: none;
      font-size: 12px;
      transition: color .25s ease, border-color .25s ease, background .25s ease, box-shadow .25s ease;
    }

    .main-nav a:hover,
    .main-nav a:focus-visible { color: #eef8ff; }
    .site-header.is-light .main-nav a { color: rgba(24, 47, 70, .7); }
    .site-header.is-light .main-nav a:hover,
    .site-header.is-light .main-nav a:focus-visible { color: #0869b5; }

    .header-actions {
      margin-left: auto;
      display: flex;
      align-items: center;
      gap: 27px;
    }

    .header-actions a {
      min-width: 142px;
      height: 36px;
      padding-inline: 16px;
      border: 1px solid rgba(44, 147, 255, .38);
      border-radius: 10px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #e9f8ff;
      background: linear-gradient(180deg, rgba(26, 113, 201, .82), rgba(9, 62, 119, .92));
      box-shadow: inset 0 1px rgba(255, 255, 255, .1), 0 0 22px rgba(17, 119, 233, .14);
      white-space: nowrap;
    }

    .header-actions a:hover,
    .header-actions a:focus-visible {
      color: #fff;
      border-color: rgba(76, 177, 255, .66);
      box-shadow: 0 0 24px rgba(20, 127, 255, .2);
    }

    .site-header.is-light .header-actions a {
      color: #f8fcff;
      border-color: rgba(18, 110, 181, .28);
      background: linear-gradient(180deg, #1782d1, #0d65aa);
      box-shadow: 0 8px 24px rgba(18, 105, 171, .2), inset 0 1px rgba(255, 255, 255, .2);
    }

    .menu-toggle {
      position: relative;
      width: 40px;
      height: 40px;
      margin: -2px 0 0 10px;
      padding: 0;
      flex: 0 0 40px;
      display: none;
      border: 1px solid rgba(91, 193, 238, .34);
      border-radius: 11px;
      color: #8edfff;
      background: rgba(4, 15, 29, .68);
      box-shadow: inset 0 0 18px rgba(39, 151, 217, .08), 0 8px 24px rgba(0, 0, 0, .14);
      -webkit-backdrop-filter: blur(12px) saturate(130%);
      backdrop-filter: blur(12px) saturate(130%);
      cursor: pointer;
      -webkit-tap-highlight-color: transparent;
      transition: color .35s ease, border-color .35s ease, background .55s ease, box-shadow .35s ease;
    }

    .menu-toggle span {
      position: absolute;
      left: 10px;
      width: 18px;
      height: 1px;
      border-radius: 2px;
      background: currentColor;
      box-shadow: 0 0 7px currentColor;
      transform-origin: center;
      transition: top .32s ease, opacity .24s ease, transform .32s cubic-bezier(.2, .72, .2, 1);
    }

    .menu-toggle span:nth-child(1) { top: 12px; }
    .menu-toggle span:nth-child(2) { top: 19px; }
    .menu-toggle span:nth-child(3) { top: 26px; }
    .site-header.is-menu-open .menu-toggle span:nth-child(1) { top: 19px; transform: rotate(45deg); }
    .site-header.is-menu-open .menu-toggle span:nth-child(2) { opacity: 0; transform: scaleX(.2); }
    .site-header.is-menu-open .menu-toggle span:nth-child(3) { top: 19px; transform: rotate(-45deg); }

    .menu-toggle:hover,
    .menu-toggle:focus-visible,
    .site-header.is-menu-open .menu-toggle {
      color: #e4faff;
      border-color: rgba(112, 221, 255, .7);
      box-shadow: inset 0 0 20px rgba(52, 171, 232, .14), 0 0 20px rgba(36, 168, 235, .18);
    }

    .site-header.is-light .menu-toggle {
      color: #166d95;
      border-color: rgba(32, 115, 153, .28);
      background: rgba(248, 252, 253, .84);
    }

    .menu-toggle:focus-visible { outline: 1px solid currentColor; outline-offset: 4px; }

    .news-hero {
      position: relative;
      min-height: 760px;
      overflow: hidden;
      isolation: isolate;
      background:
        radial-gradient(circle at 76% 34%, rgba(7, 112, 214, .25), transparent 30%),
        radial-gradient(circle at 19% 77%, rgba(33, 153, 206, .12), transparent 27%),
        linear-gradient(145deg, #020711 0%, #071525 56%, #020912 100%);
    }

    .news-hero::before {
      content: "NEWSROOM";
      position: absolute;
      left: -2vw;
      bottom: -3.5vw;
      z-index: -2;
      color: transparent;
      -webkit-text-stroke: 1px rgba(116, 215, 250, .05);
      font-size: clamp(120px, 18vw, 310px);
      font-weight: 650;
      line-height: .75;
      letter-spacing: -.085em;
      white-space: nowrap;
    }

    .hero-circuit {
      position: absolute;
      inset: 0;
      z-index: -1;
      width: 100%;
      height: 100%;
      pointer-events: none;
      opacity: .66;
    }

    .hero-circuit path {
      fill: none;
      stroke: rgba(74, 172, 231, .18);
      stroke-width: 1;
      vector-effect: non-scaling-stroke;
    }

    .hero-circuit .current {
      stroke: #adf0ff;
      stroke-width: 1.5;
      stroke-dasharray: 1.5 98.5;
      filter: drop-shadow(0 0 5px rgba(92, 220, 255, .9));
      animation: currentRun 5.8s linear infinite;
    }

    .hero-circuit circle {
      fill: #bdf2ff;
      filter: drop-shadow(0 0 6px rgba(98, 221, 255, .85));
      animation: nodePulse 3.2s ease-in-out infinite;
    }

    .hero-shell {
      width: var(--shell);
      min-height: 760px;
      margin: 0 auto;
      padding: 128px 0 82px;
      display: grid;
      grid-template-columns: minmax(0, .82fr) minmax(460px, 1.18fr);
      align-items: center;
      gap: clamp(52px, 7vw, 112px);
    }

    .breadcrumbs {
      margin-bottom: 56px;
      display: flex;
      align-items: center;
      gap: 12px;
      color: rgba(170, 207, 228, .48);
      font-size: 9px;
      letter-spacing: .15em;
      text-transform: uppercase;
    }

    .breadcrumbs a { text-decoration: none; transition: color .25s ease; }
    .breadcrumbs a:hover { color: #d9f6ff; }
    .breadcrumbs i { width: 24px; height: 1px; background: linear-gradient(90deg, rgba(100, 204, 244, .6), transparent); }

    .hero-kicker {
      display: flex;
      align-items: center;
      gap: 13px;
      color: rgba(114, 215, 252, .64);
      font-size: 9px;
      letter-spacing: .23em;
      text-transform: uppercase;
    }

    .hero-kicker::before {
      content: "";
      width: 31px;
      height: 1px;
      background: linear-gradient(90deg, #61d7ff, transparent);
      box-shadow: 0 0 8px rgba(80, 210, 255, .4);
    }

    .hero-title {
      max-width: 710px;
      margin: 23px 0 0;
      color: #effaff;
      font-size: clamp(62px, 8vw, 126px);
      font-weight: 300;
      line-height: .88;
      letter-spacing: -.075em;
    }

    .hero-title em { display: block; color: #74d9f8; font-style: normal; }

    .hero-lead {
      max-width: 580px;
      margin: 34px 0 0;
      color: rgba(188, 215, 231, .66);
      font-size: clamp(14px, 1.1vw, 17px);
      line-height: 1.75;
    }

    .hero-statline {
      margin-top: 38px;
      padding-top: 21px;
      display: flex;
      align-items: center;
      gap: 18px;
      color: rgba(139, 194, 220, .48);
      border-top: 1px solid rgba(91, 190, 235, .15);
      font-size: 9px;
      letter-spacing: .15em;
      text-transform: uppercase;
    }

    .hero-statline strong { color: #8ce8ff; font-size: 13px; font-weight: 500; }

    .hero-feature {
      position: relative;
      min-height: 530px;
      overflow: hidden;
      isolation: isolate;
      border: 1px solid rgba(96, 197, 240, .22);
      border-radius: 20px;
      background: #0b1d2b;
      box-shadow: 0 36px 100px rgba(0, 0, 0, .38), inset 0 1px rgba(255, 255, 255, .04);
      text-decoration: none;
      transform: translateZ(0);
    }

    .hero-feature::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
      background:
        linear-gradient(180deg, rgba(2, 8, 16, .02) 20%, rgba(2, 9, 17, .18) 48%, rgba(2, 8, 15, .94) 100%),
        linear-gradient(90deg, rgba(3, 12, 22, .18), transparent 66%);
    }

    .hero-feature::after {
      content: "";
      position: absolute;
      inset: 15px;
      z-index: 3;
      pointer-events: none;
      border: 1px solid rgba(208, 246, 255, .16);
      border-radius: 13px;
      opacity: .72;
      transition: opacity .4s ease, transform .5s ease;
    }

    .hero-feature img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
      object-position: center 38%;
      filter: saturate(.8) contrast(1.04);
      transition: transform 1.2s cubic-bezier(.2, .72, .2, 1), filter .7s ease;
    }

    .hero-feature:hover img,
    .hero-feature:focus-visible img { transform: scale(1.045); filter: saturate(.98) contrast(1.03); }
    .hero-feature:hover::after,
    .hero-feature:focus-visible::after { opacity: 1; transform: scale(.99); }
    .hero-feature:focus-visible { outline: 1px solid #8de8ff; outline-offset: 5px; }

    .hero-feature-index {
      position: absolute;
      top: 34px;
      left: 34px;
      z-index: 4;
      min-height: 28px;
      padding: 0 11px;
      display: inline-flex;
      align-items: center;
      color: #dff8ff;
      border: 1px solid rgba(126, 220, 250, .28);
      border-radius: 999px;
      background: rgba(3, 15, 25, .5);
      -webkit-backdrop-filter: blur(12px);
      backdrop-filter: blur(12px);
      font-size: 8px;
      letter-spacing: .17em;
      text-transform: uppercase;
    }

    .hero-feature-copy {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 4;
      padding: clamp(30px, 3.2vw, 50px);
    }

    .hero-feature-meta {
      margin-bottom: 15px;
      display: flex;
      align-items: center;
      gap: 12px;
      color: rgba(200, 233, 245, .64);
      font-size: 8px;
      letter-spacing: .17em;
      text-transform: uppercase;
    }

    .hero-feature-meta::before {
      content: "";
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: #83e6ff;
      box-shadow: 0 0 12px rgba(87, 216, 255, .8);
    }

    .hero-feature h2 {
      max-width: 720px;
      margin: 0;
      color: #f1fbff;
      font-size: clamp(28px, 3vw, 49px);
      font-weight: 300;
      line-height: 1.02;
      letter-spacing: -.05em;
    }

    .hero-feature-more {
      margin-top: 21px;
      display: flex;
      align-items: center;
      gap: 13px;
      color: rgba(221, 246, 255, .72);
      font-size: 9px;
      letter-spacing: .13em;
      text-transform: uppercase;
    }

    .hero-feature-more::after {
      content: "";
      width: 42px;
      height: 1px;
      background: linear-gradient(90deg, currentColor, transparent);
      transition: width .35s ease;
    }

    .hero-feature:hover .hero-feature-more::after { width: 66px; }

    .theme-bridge {
      position: relative;
      height: 145px;
      overflow: hidden;
      background: linear-gradient(180deg, #020912 0%, #263c49 21%, #a8bdc6 55%, #eef5f8 100%);
    }

    .theme-bridge svg { position: absolute; inset: 0; width: 100%; height: 100%; }
    .theme-bridge path { fill: none; stroke: rgba(187, 239, 252, .38); stroke-width: 1; vector-effect: non-scaling-stroke; }
    .theme-bridge .bridge-current { stroke: #eaffff; stroke-width: 1.5; stroke-dasharray: 2 98; filter: drop-shadow(0 0 5px rgba(103, 221, 255, .72)); animation: currentRun 4.8s linear infinite; }

    .news-feed {
      position: relative;
      padding: clamp(82px, 9vw, 132px) 0 clamp(120px, 13vw, 190px);
      color-scheme: light;
      color: #153247;
      background:
        radial-gradient(circle at 87% 9%, rgba(21, 130, 181, .1), transparent 25%),
        radial-gradient(circle at 11% 65%, rgba(47, 122, 164, .07), transparent 30%),
        linear-gradient(180deg, #eef5f8 0%, #fbfcfd 38%, #edf4f7 100%);
    }

    .news-feed::before {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      opacity: .44;
      background-image:
        linear-gradient(rgba(26, 104, 143, .05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(26, 104, 143, .05) 1px, transparent 1px);
      background-size: 52px 52px;
      -webkit-mask-image: radial-gradient(ellipse 78% 65% at 50% 39%, #000, transparent);
      mask-image: radial-gradient(ellipse 78% 65% at 50% 39%, #000, transparent);
    }

    .section-shell { position: relative; z-index: 2; width: var(--shell); margin: 0 auto; }

    .feed-heading {
      margin-bottom: clamp(46px, 6vw, 82px);
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(300px, .52fr);
      align-items: end;
      gap: clamp(40px, 7vw, 110px);
    }

    .section-kicker {
      margin-bottom: 18px;
      display: flex;
      align-items: center;
      gap: 12px;
      color: rgba(23, 101, 137, .62);
      font-size: 9px;
      font-weight: 600;
      letter-spacing: .22em;
      text-transform: uppercase;
    }

    .section-kicker::before {
      content: "";
      width: 29px;
      height: 1px;
      background: linear-gradient(90deg, #1683b3, transparent);
    }

    .feed-title {
      margin: 0;
      color: #153247;
      font-size: clamp(48px, 6.2vw, 94px);
      font-weight: 300;
      line-height: .94;
      letter-spacing: -.067em;
    }

    .feed-title em { color: #1076a4; font-style: normal; }

    .feed-intro {
      margin: 0;
      color: rgba(38, 72, 91, .68);
      font-size: clamp(14px, 1.1vw, 17px);
      line-height: 1.72;
    }

    .news-toolbar {
      position: sticky;
      top: 82px;
      z-index: 20;
      margin-bottom: 34px;
      padding: 14px;
      display: grid;
      grid-template-columns: 1fr auto;
      align-items: center;
      gap: 18px;
      border: 1px solid rgba(26, 106, 143, .14);
      border-radius: 16px;
      background: rgba(245, 250, 252, .84);
      box-shadow: 0 18px 48px rgba(44, 88, 109, .09), inset 0 1px rgba(255, 255, 255, .8);
      -webkit-backdrop-filter: blur(18px) saturate(130%);
      backdrop-filter: blur(18px) saturate(130%);
    }

    .news-filters { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }

    .news-filter {
      min-height: 36px;
      padding: 0 14px;
      border: 1px solid transparent;
      border-radius: 999px;
      color: rgba(30, 75, 97, .56);
      background: transparent;
      font-size: 8px;
      letter-spacing: .13em;
      text-transform: uppercase;
      cursor: pointer;
      transition: color .25s ease, border-color .25s ease, background .25s ease, box-shadow .25s ease;
    }

    .news-filter:hover,
    .news-filter:focus-visible,
    .news-filter.is-active {
      color: #0a638b;
      border-color: rgba(19, 115, 156, .2);
      background: rgba(255, 255, 255, .76);
      box-shadow: 0 7px 20px rgba(39, 102, 132, .08);
    }

    .news-filter:focus-visible { outline: 1px solid #1684af; outline-offset: 2px; }

    .news-search {
      position: relative;
      width: min(280px, 25vw);
      min-width: 210px;
    }

    .news-search::before {
      content: "";
      position: absolute;
      left: 15px;
      top: 50%;
      width: 10px;
      height: 10px;
      border: 1px solid rgba(27, 101, 135, .46);
      border-radius: 50%;
      transform: translateY(-60%);
      pointer-events: none;
    }

    .news-search::after {
      content: "";
      position: absolute;
      left: 25px;
      top: 23px;
      width: 6px;
      height: 1px;
      background: rgba(27, 101, 135, .46);
      transform: rotate(45deg);
      transform-origin: left center;
      pointer-events: none;
    }

    .news-search input {
      width: 100%;
      height: 42px;
      padding: 0 15px 0 38px;
      color: #163d52;
      border: 1px solid rgba(27, 105, 141, .15);
      border-radius: 11px;
      outline: 0;
      background: rgba(255, 255, 255, .58);
      font-size: 11px;
      transition: border-color .25s ease, background .25s ease, box-shadow .25s ease;
    }

    .news-search input::placeholder { color: rgba(41, 81, 101, .43); }
    .news-search input:focus { border-color: rgba(20, 117, 158, .34); background: rgba(255, 255, 255, .9); box-shadow: 0 0 0 3px rgba(28, 129, 170, .07); }

    .feed-status {
      margin-bottom: 18px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      color: rgba(37, 76, 95, .48);
      font-size: 8px;
      letter-spacing: .15em;
      text-transform: uppercase;
    }

    .feed-status::after { content: ""; height: 1px; flex: 1; background: linear-gradient(90deg, rgba(26, 106, 143, .14), transparent); }

    .news-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      grid-auto-flow: dense;
      gap: 18px;
    }

    .news-card {
      position: relative;
      min-height: 440px;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      color: #17364a;
      border: 1px solid rgba(24, 102, 139, .13);
      border-radius: 15px;
      background: rgba(255, 255, 255, .6);
      box-shadow: 0 19px 56px rgba(40, 82, 103, .07);
      text-decoration: none;
      transition: transform .42s cubic-bezier(.2, .75, .2, 1), border-color .3s ease, box-shadow .4s ease;
      content-visibility: auto;
      contain-intrinsic-size: auto 440px;
    }

    .news-card[hidden] { display: none; }

    .news-card::before {
      content: "";
      position: absolute;
      left: 24px;
      top: 0;
      z-index: 5;
      width: 42px;
      height: 2px;
      background: #1a82ad;
      box-shadow: 0 0 9px rgba(26, 130, 173, .3);
      transition: width .4s ease;
    }

    .news-card:hover,
    .news-card:focus-visible {
      z-index: 3;
      border-color: rgba(23, 119, 160, .3);
      box-shadow: 0 28px 74px rgba(30, 89, 117, .14);
      transform: translateY(-7px);
    }

    .news-card:hover::before { width: 92px; }
    .news-card:focus-visible { outline: 1px solid #1684af; outline-offset: 4px; }

    .news-card-media {
      position: relative;
      height: 205px;
      margin: 0;
      overflow: hidden;
      flex: 0 0 auto;
      background: #d9e6eb;
    }

    .news-card-media::before,
    .news-card-media::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 2;
      pointer-events: none;
    }

    .news-card-media::before {
      opacity: .19;
      background-image:
        linear-gradient(rgba(226, 247, 255, .5) 1px, transparent 1px),
        linear-gradient(90deg, rgba(226, 247, 255, .5) 1px, transparent 1px);
      background-size: 18px 18px;
      -webkit-mask-image: linear-gradient(180deg, #000, transparent 78%);
      mask-image: linear-gradient(180deg, #000, transparent 78%);
    }

    .news-card-media::after { background: linear-gradient(180deg, transparent 52%, rgba(6, 30, 45, .2)); }

    .news-card-media img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
      filter: saturate(.78) contrast(1.03);
      transition: transform .9s cubic-bezier(.2, .72, .2, 1), filter .55s ease;
    }

    .news-card--portrait .news-card-media img { object-position: center 35%; }
    .news-card:hover .news-card-media img,
    .news-card:focus-visible .news-card-media img { transform: scale(1.055); filter: saturate(.98) contrast(1.03); }

    .news-card-copy {
      min-height: 235px;
      padding: 25px 27px 27px;
      display: flex;
      flex: 1;
      flex-direction: column;
    }

    .news-card-meta {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      color: rgba(34, 80, 102, .48);
      font-size: 8px;
      letter-spacing: .14em;
      text-transform: uppercase;
    }

    .news-card-category { color: #1379a3; font-weight: 600; }

    .news-card h3 {
      margin: 24px 0 0;
      color: #16384d;
      font-size: clamp(20px, 1.65vw, 27px);
      font-weight: 400;
      line-height: 1.17;
      letter-spacing: -.04em;
    }

    .news-card p {
      margin: 16px 0 0;
      color: rgba(43, 78, 96, .63);
      font-size: 12px;
      line-height: 1.62;
    }

    .news-card-more {
      margin-top: auto;
      padding-top: 22px;
      display: flex;
      align-items: center;
      gap: 11px;
      color: rgba(35, 81, 103, .55);
      font-size: 8px;
      letter-spacing: .14em;
      text-transform: uppercase;
    }

    .news-card-more::after {
      content: "";
      width: 30px;
      height: 1px;
      background: linear-gradient(90deg, currentColor, transparent);
      transition: width .35s ease;
    }

    .news-card:hover .news-card-more::after { width: 52px; }

    .news-card--wide {
      grid-column: span 2;
      min-height: 365px;
      display: grid;
      grid-template-columns: minmax(250px, .88fr) minmax(0, 1.12fr);
      contain-intrinsic-size: auto 365px;
    }

    .news-card--wide .news-card-media { height: 100%; min-height: 365px; }
    .news-card--wide .news-card-copy { min-height: 365px; padding: clamp(29px, 3vw, 46px); }
    .news-card--wide h3 { max-width: 650px; font-size: clamp(27px, 2.7vw, 43px); }
    .news-card--wide p { max-width: 610px; font-size: 13px; }

    .feed-empty {
      margin: 38px 0 0;
      padding: 44px;
      color: rgba(31, 72, 92, .62);
      border: 1px dashed rgba(24, 105, 143, .2);
      border-radius: 14px;
      text-align: center;
      font-size: 14px;
    }

    .feed-empty[hidden] { display: none; }

    .feed-more-row {
      margin-top: 44px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .feed-more {
      min-width: 190px;
      min-height: 50px;
      padding: 0 22px;
      border: 1px solid rgba(21, 112, 152, .22);
      border-radius: 12px;
      color: #135f82;
      background: rgba(255, 255, 255, .68);
      box-shadow: 0 16px 40px rgba(40, 91, 115, .08);
      font-size: 9px;
      letter-spacing: .13em;
      text-transform: uppercase;
      cursor: pointer;
      transition: transform .3s ease, border-color .3s ease, background .3s ease, box-shadow .3s ease;
    }

    .feed-more:hover,
    .feed-more:focus-visible { transform: translateY(-3px); border-color: rgba(20, 118, 160, .42); background: #fff; box-shadow: 0 20px 48px rgba(32, 92, 119, .13); }
    .feed-more:focus-visible { outline: 1px solid #1684af; outline-offset: 3px; }
    .feed-more[hidden] { display: none; }

    .news-cta {
      position: relative;
      min-height: 560px;
      overflow: hidden;
      isolation: isolate;
      display: grid;
      place-items: center;
      background:
        radial-gradient(circle at 50% 42%, rgba(12, 109, 199, .2), transparent 36%),
        linear-gradient(145deg, #020711 0%, #071525 58%, #030a12 100%);
    }

    .news-cta::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      opacity: .5;
      background-image:
        linear-gradient(rgba(73, 175, 226, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(73, 175, 226, .055) 1px, transparent 1px);
      background-size: 44px 44px;
      -webkit-mask-image: radial-gradient(circle at 50% 48%, #000, transparent 70%);
      mask-image: radial-gradient(circle at 50% 48%, #000, transparent 70%);
    }

    .cta-inner {
      width: min(100% - 48px, 1060px);
      padding: 90px 0;
      text-align: center;
    }

    .cta-kicker { color: rgba(120, 218, 255, .66); font-size: 9px; letter-spacing: .23em; text-transform: uppercase; }

    .cta-title {
      max-width: 980px;
      margin: 22px auto 0;
      color: #effaff;
      font-size: clamp(48px, 6.8vw, 100px);
      font-weight: 300;
      line-height: .94;
      letter-spacing: -.07em;
    }

    .cta-title em { display: block; color: #75d8f7; font-style: normal; }

    .cta-text { max-width: 620px; margin: 28px auto 0; color: rgba(196, 220, 235, .62); font-size: 15px; line-height: 1.72; }

    .cta-actions { margin-top: 36px; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 13px; }

    .cta-button {
      min-height: 50px;
      padding: 0 22px;
      display: inline-flex;
      align-items: center;
      gap: 24px;
      color: #effaff;
      border: 1px solid rgba(83, 197, 242, .35);
      border-radius: 11px;
      background: linear-gradient(180deg, rgba(20, 111, 192, .76), rgba(7, 55, 105, .9));
      box-shadow: 0 18px 44px rgba(0, 0, 0, .25);
      font-size: 10px;
      letter-spacing: .07em;
      text-decoration: none;
      transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;
    }

    .cta-button::after { content: "↗"; color: #a9efff; font-size: 16px; }
    .cta-button--quiet { color: rgba(212, 235, 246, .66); border-color: transparent; background: transparent; box-shadow: none; }
    .cta-button:hover,
    .cta-button:focus-visible { transform: translateY(-3px); border-color: rgba(109, 225, 255, .68); box-shadow: 0 22px 52px rgba(3, 85, 151, .24); }

    [data-reveal] {
      opacity: 0;
      transform: translateY(28px);
      transition: opacity .75s ease, transform .85s cubic-bezier(.2, .75, .2, 1);
    }

    [data-reveal].is-visible { opacity: 1; transform: translateY(0); }

    .site-footer {
      --footer-steel: #236f8b;
      --footer-ice: #173f54;
      position: relative;
      min-height: 100vh;
      overflow: hidden;
      isolation: isolate;
      color-scheme: light;
      color: #18384b;
      background:
        linear-gradient(180deg, #718b98 0, rgba(151, 176, 187, .96) 30px, rgba(214, 230, 236, .92) 72px, rgba(239, 247, 249, .58) 112px, transparent 156px),
        radial-gradient(circle at 17% 31%, rgba(25, 135, 178, .13), transparent 31%),
        radial-gradient(circle at 84% 68%, rgba(55, 113, 147, .1), transparent 34%),
        linear-gradient(146deg, #f5fafb 0%, #e7f1f5 48%, #f0f7f9 100%);
      border-top: 1px solid rgba(166, 225, 241, .34);
      box-shadow: inset 0 1px rgba(240, 253, 255, .5);
    }

    .site-footer::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -2;
      pointer-events: none;
      opacity: .62;
      background-image:
        linear-gradient(rgba(28, 106, 141, .07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(28, 106, 141, .07) 1px, transparent 1px),
        repeating-linear-gradient(135deg, transparent 0 38px, rgba(29, 103, 138, .022) 38px 39px);
      background-size: 44px 44px, 44px 44px, auto;
      -webkit-mask-image: linear-gradient(180deg, #000 0, rgba(0, 0, 0, .82) 60%, transparent 100%);
      mask-image: linear-gradient(180deg, #000 0, rgba(0, 0, 0, .82) 60%, transparent 100%);
    }

    .site-footer::after {
      content: "FLEXCORE";
      position: absolute;
      right: clamp(18px, 3vw, 52px);
      bottom: clamp(20px, 3.5vh, 42px);
      z-index: -1;
      pointer-events: none;
      color: transparent;
      -webkit-text-stroke: 1px rgba(32, 100, 130, .065);
      font-size: clamp(88px, 11.5vw, 190px);
      font-weight: 600;
      line-height: 1;
      letter-spacing: -.085em;
      white-space: nowrap;
    }

    .footer-signal { position: absolute; top: 0; left: 5.2vw; right: 5.2vw; z-index: 3; height: 92px; overflow: hidden; pointer-events: none; }
    .footer-signal::before { content: ""; position: absolute; top: 0; left: 50%; width: 1px; height: 53px; background: linear-gradient(180deg, rgba(196, 239, 249, .92), rgba(30, 131, 169, .32)); box-shadow: 0 0 13px rgba(72, 187, 219, .34); }
    .footer-signal-rail { position: absolute; top: 53px; left: 0; width: 100%; height: 1px; background: linear-gradient(90deg, transparent, rgba(28, 121, 158, .2) 11%, rgba(51, 145, 178, .54) 50%, rgba(28, 121, 158, .2) 89%, transparent); }
    .footer-signal-rail::before,
    .footer-signal-rail::after { content: ""; position: absolute; top: 0; width: clamp(70px, 10vw, 150px); height: 1px; opacity: .92; background: linear-gradient(90deg, transparent, #effcff 50%, transparent); filter: drop-shadow(0 0 6px rgba(59, 169, 202, .7)); animation: footerSignalRun 7.5s linear infinite; }
    .footer-signal-rail::after { animation-delay: -3.75s; }
    .footer-signal-node { position: absolute; top: 47px; left: 50%; width: 13px; height: 13px; border: 1px solid rgba(42, 133, 166, .72); border-radius: 50%; background: #eff8fa; box-shadow: 0 0 0 6px rgba(42, 130, 163, .055), 0 0 18px rgba(47, 149, 181, .3); transform: translateX(-50%); }
    .footer-signal-node::after { content: ""; position: absolute; inset: 3px; border-radius: inherit; background: #247c9c; box-shadow: 0 0 8px rgba(42, 145, 179, .55); animation: footerNodePulse 2.8s ease-in-out infinite; }

    .footer-inner {
      position: relative;
      z-index: 2;
      width: min(100%, 1600px);
      min-height: 100vh;
      margin: 0 auto;
      padding: clamp(116px, 14vh, 158px) clamp(30px, 5.2vw, 82px) clamp(34px, 4.5vh, 56px);
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: clamp(46px, 6vh, 74px);
    }

    .footer-main { display: grid; grid-template-columns: minmax(340px, .82fr) minmax(560px, 1.18fr); gap: clamp(64px, 8vw, 132px); align-items: start; }
    .footer-brand { min-width: 0; overflow: visible; }
    .footer-kicker { margin: 0 0 16px; display: flex; align-items: center; gap: 11px; color: rgba(48, 91, 109, .58); font-size: 9px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; }
    .footer-kicker::before { content: ""; width: 24px; height: 1px; background: linear-gradient(90deg, var(--footer-steel), transparent); box-shadow: 0 0 7px rgba(48, 141, 174, .2); }

    .footer-wordmark {
      width: fit-content;
      padding: .08em .035em .14em 0;
      display: inline-block;
      overflow: visible;
      color: var(--footer-ice);
      background: linear-gradient(108deg, #173f54 0%, #6f9bab 34%, #245f78 58%, #89afbc 78%, #173f54 100%);
      background-size: 230% 100%;
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      filter: drop-shadow(0 12px 30px rgba(49, 108, 130, .1));
      font-size: clamp(48px, 5.1vw, 84px);
      font-weight: 500;
      line-height: 1;
      letter-spacing: -.075em;
      white-space: nowrap;
      text-decoration: none;
      animation: footerWordmarkFlow 10s ease-in-out infinite alternate;
    }

    .footer-tagline { max-width: 470px; margin: 30px 0 0; color: rgba(48, 78, 92, .75); font-size: clamp(14px, 1.1vw, 17px); line-height: 1.7; }
    .footer-accreditation { width: fit-content; max-width: 100%; margin-top: 24px; padding: 10px 13px 10px 11px; display: inline-flex; align-items: center; gap: 9px; color: rgba(42, 84, 102, .75); border: 1px solid rgba(34, 111, 141, .18); border-radius: 999px; background: rgba(255, 255, 255, .48); font-size: 9px; letter-spacing: .09em; line-height: 1.35; text-decoration: none; text-transform: uppercase; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
    .footer-accreditation::before { content: ""; width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%; background: #277f9f; box-shadow: 0 0 10px rgba(43, 141, 174, .42); animation: footerNodePulse 2.8s ease-in-out infinite; }

    .footer-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(26px, 3.3vw, 54px); }
    .footer-column { position: relative; min-width: 0; padding-top: 19px; border-top: 1px solid rgba(29, 104, 134, .18); }
    .footer-column::before { content: ""; position: absolute; top: -1px; left: 0; width: 34px; height: 1px; background: #277c9c; box-shadow: 0 0 8px rgba(41, 137, 170, .3); transition: width .45s ease; }
    .footer-column:hover::before { width: min(100%, 88px); }
    .footer-column-title { margin: 0 0 21px; color: rgba(47, 86, 102, .58); font-size: 9px; font-weight: 500; letter-spacing: .19em; text-transform: uppercase; }
    .footer-links { margin: 0; padding: 0; display: grid; gap: 13px; list-style: none; }
    .footer-links a,
    .footer-links span { width: fit-content; max-width: 100%; display: inline-flex; align-items: center; gap: 8px; color: rgba(38, 70, 84, .78); font-size: 12px; line-height: 1.45; text-decoration: none; }
    .footer-links a { transition: color .28s ease, transform .28s ease; }
    .footer-links a::after { content: ""; width: 13px; height: 1px; opacity: 0; background: currentColor; transform: translateX(-8px); transition: opacity .28s ease, transform .28s ease; }
    .footer-links a:hover,
    .footer-links a:focus-visible { color: #0a4865; transform: translateX(3px); }
    .footer-links a:hover::after,
    .footer-links a:focus-visible::after { opacity: .58; transform: translateX(0); }
    .footer-links .footer-contact-primary { color: #153f54; font-size: 14px; letter-spacing: -.015em; }
    .footer-links .footer-hours { color: rgba(61, 91, 103, .58); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }

    .footer-meta { margin-top: auto; display: grid; gap: 25px; }
    .footer-location { padding: 24px 0; display: flex; align-items: center; justify-content: space-between; gap: 28px; border-top: 1px solid rgba(29, 104, 134, .15); border-bottom: 1px solid rgba(29, 104, 134, .15); }
    .footer-address { display: flex; align-items: center; gap: 13px; color: rgba(35, 73, 90, .78); font-size: clamp(13px, 1.05vw, 16px); line-height: 1.45; text-decoration: none; }
    .footer-address::before { content: ""; width: 9px; height: 9px; flex: 0 0 9px; border: 1px solid #337e99; border-radius: 50%; box-shadow: 0 0 0 5px rgba(48, 132, 162, .05), 0 0 10px rgba(51, 139, 169, .18); }
    .footer-location-meta { display: flex; align-items: center; gap: 15px; color: rgba(55, 83, 95, .54); font-size: 9px; letter-spacing: .15em; text-transform: uppercase; white-space: nowrap; }
    .footer-location-meta::before { content: ""; width: 34px; height: 1px; background: linear-gradient(90deg, transparent, rgba(35, 112, 141, .4)); }
    .footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 24px; color: rgba(59, 85, 96, .52); font-size: 9px; letter-spacing: .1em; line-height: 1.5; text-transform: uppercase; }
    .footer-legal { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 18px; }
    .footer-to-top { display: inline-flex; align-items: center; gap: 12px; color: rgba(39, 77, 94, .7); text-decoration: none; }
    .footer-to-top::after { content: ""; width: 8px; height: 8px; border-top: 1px solid currentColor; border-left: 1px solid currentColor; transform: translateY(2px) rotate(45deg); transition: transform .3s ease; }
    .footer-to-top:hover::after { transform: translateY(-3px) rotate(45deg); }

    @keyframes headerIn { to { opacity: 1; transform: translateY(0); } }
    @keyframes miniLogoShimmer { to { background-position: 100% 50%; } }
    @keyframes currentRun { to { stroke-dashoffset: -100; } }
    @keyframes nodePulse { 50% { opacity: .35; } }
    @keyframes footerSignalRun { from { left: -14%; } to { left: 100%; } }
    @keyframes footerNodePulse { 50% { opacity: .36; transform: scale(.65); } }
    @keyframes footerWordmarkFlow { to { background-position: 100% 50%; } }

    @media (max-width: 1180px) {
      :root { --shell: min(100% - 48px, 1480px); }
      .mini-logo { margin-right: 34px; }
      .main-nav { gap: 24px; }
      .hero-shell { grid-template-columns: minmax(0, .74fr) minmax(420px, 1fr); gap: 46px; }
      .hero-title { font-size: clamp(58px, 8vw, 96px); }
      .news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .footer-main { grid-template-columns: minmax(280px, .7fr) minmax(540px, 1.3fr); gap: 58px; }
    }

    @media (max-width: 960px) {
      .hero-shell { padding-top: 130px; grid-template-columns: 1fr; gap: 58px; }
      .hero-copy { max-width: 760px; }
      .hero-feature { min-height: 560px; }
      .feed-heading { grid-template-columns: 1fr; gap: 24px; }
      .feed-intro { max-width: 690px; }
      .news-toolbar { position: relative; top: auto; grid-template-columns: 1fr; }
      .news-search { width: 100%; min-width: 0; }
      .news-card--wide { grid-column: span 2; }
      .footer-main { grid-template-columns: 1fr; }
      .footer-brand { max-width: 650px; }
    }

    @media (max-width: 860px) {
      .main-nav {
        position: absolute;
        top: 76px;
        left: 18px;
        right: 18px;
        z-index: 2;
        min-height: 0;
        padding: 9px;
        display: grid;
        gap: 0;
        overflow: hidden;
        border: 1px solid rgba(83, 184, 232, .25);
        border-radius: 18px;
        background:
          linear-gradient(rgba(62, 166, 222, .045) 1px, transparent 1px),
          linear-gradient(90deg, rgba(62, 166, 222, .045) 1px, transparent 1px),
          rgba(3, 12, 24, .95);
        background-size: 24px 24px, 24px 24px, auto;
        box-shadow: 0 22px 60px rgba(0, 0, 0, .34), inset 0 1px rgba(255, 255, 255, .04);
        -webkit-backdrop-filter: blur(22px) saturate(135%);
        backdrop-filter: blur(22px) saturate(135%);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(-10px) scale(.985);
        transform-origin: 80% 0;
        transition: opacity .28s ease, transform .38s cubic-bezier(.2, .78, .2, 1), visibility 0s linear .38s, background .7s ease, border-color .7s ease;
      }

      .main-nav::before { content: ""; position: absolute; top: 0; left: 18px; right: 18px; height: 1px; background: linear-gradient(90deg, transparent, rgba(119, 226, 255, .8), transparent); box-shadow: 0 0 12px rgba(85, 211, 255, .42); }
      .site-header.is-menu-open .main-nav { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0) scale(1); transition-delay: 0s; }
      .main-nav a { min-height: 48px; padding: 0 14px; display: flex; align-items: center; border-bottom: 1px solid rgba(102, 178, 218, .12); font-size: 12px; letter-spacing: .045em; }
      .main-nav a:last-child { border-bottom: 0; }
      .site-header.is-light .main-nav { border-color: rgba(25, 111, 158, .2); background: linear-gradient(rgba(21, 112, 160, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(21, 112, 160, .045) 1px, transparent 1px), rgba(245, 250, 252, .96); background-size: 24px 24px, 24px 24px, auto; box-shadow: 0 22px 60px rgba(25, 71, 99, .16), inset 0 1px rgba(255, 255, 255, .7); }
      .menu-toggle { display: block; }
      .mini-logo { margin-right: 0; }
      .header-actions { gap: 10px; }
    }

    @media (max-width: 700px) {
      :root { --shell: min(100% - 32px, 1480px); }
      .news-hero { min-height: auto; }
      .hero-shell { min-height: auto; padding: 116px 0 76px; gap: 46px; }
      .breadcrumbs { margin-bottom: 38px; }
      .hero-title { font-size: clamp(54px, 17vw, 78px); }
      .hero-lead { margin-top: 26px; font-size: 14px; }
      .hero-statline { align-items: flex-start; flex-direction: column; gap: 8px; }
      .hero-feature { min-height: 470px; border-radius: 16px; }
      .hero-feature-index { top: 24px; left: 24px; }
      .hero-feature-copy { padding: 28px 25px; }
      .hero-feature h2 { font-size: 29px; }
      .theme-bridge { height: 120px; }
      .news-feed { padding-block: 82px 115px; }
      .feed-heading { margin-bottom: 38px; }
      .feed-title { font-size: clamp(46px, 14vw, 66px); }
      .news-toolbar { margin-inline: -2px; padding: 11px; }
      .news-filters { gap: 5px; }
      .news-filter { min-height: 34px; padding-inline: 11px; font-size: 7px; }
      .news-grid { grid-template-columns: 1fr; gap: 14px; }
      .news-card,
      .news-card--wide { grid-column: auto; min-height: 410px; display: flex; contain-intrinsic-size: auto 410px; }
      .news-card--wide .news-card-media,
      .news-card-media { width: 100%; height: 190px; min-height: 190px; }
      .news-card--wide .news-card-copy,
      .news-card-copy { min-height: 220px; padding: 23px 22px 24px; }
      .news-card--wide h3,
      .news-card h3 { margin-top: 20px; font-size: 24px; }
      .news-card--wide p,
      .news-card p { font-size: 12px; }
      .news-cta { min-height: 520px; }
      .cta-inner { width: min(100% - 32px, 1060px); padding-block: 78px; }
      .cta-title { font-size: clamp(46px, 14vw, 68px); }
      .footer-inner { padding-inline: 20px; }
      .footer-columns { grid-template-columns: 1fr; gap: 32px; }
      .footer-location { align-items: flex-start; flex-direction: column; gap: 15px; }
      .footer-location-meta { white-space: normal; }
      .footer-bottom { align-items: flex-start; flex-direction: column; }
      .site-footer::after { right: 16px; bottom: 18px; font-size: 17vw; }
    }

    @media (max-width: 620px) {
      .site-header { height: 74px; min-height: 74px; max-height: 74px; padding: 19px 18px 0; }
      .header-actions .primary { min-width: 124px; height: 34px; padding-inline: 12px; font-size: 11px; }
      .main-nav { top: 66px; left: 10px; right: 10px; }
    }

    @media (max-width: 450px) {
      .header-actions .primary { min-width: 112px; padding-inline: 9px; font-size: 10px; }
      .hero-feature { min-height: 440px; }
      .hero-feature h2 { font-size: 26px; }
      .news-filter { padding-inline: 9px; }
      .feed-empty { padding: 32px 20px; }
      .footer-wordmark { font-size: clamp(46px, 15vw, 60px); }
      .footer-accreditation { align-items: flex-start; border-radius: 16px; }
    }

    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      *, *::before, *::after { animation-duration: .01ms !important; animation-delay: 0ms !important; animation-iteration-count: 1 !important; }
      [data-reveal] { opacity: 1; transform: none; transition: none; }
      .hero-feature img,
      .news-card,
      .news-card-media img { transition: none; }
    }
  
    body:has(dialog[open]) { overflow: hidden; }
    .is-page-loading { overflow: hidden; }
    .video-loader { position: fixed; inset: 0; z-index: 2000; display: grid; place-items: center; color: #e7f9ff; background: radial-gradient(circle at 50% 45%, rgba(27, 143, 198, .2), transparent 28%), linear-gradient(145deg, #020812, #071a29 64%, #020811); opacity: 1; visibility: visible; transition: opacity .55s ease, visibility 0s linear 0s; }
    .video-loader::before { content: ""; position: absolute; inset: 0; opacity: .45; background-image: linear-gradient(rgba(91, 205, 244, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(91, 205, 244, .045) 1px, transparent 1px); background-size: 38px 38px; -webkit-mask-image: radial-gradient(circle at center, #000, transparent 72%); mask-image: radial-gradient(circle at center, #000, transparent 72%); }
    .video-loader.is-hidden { opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .55s ease, visibility 0s linear .55s; }
    .video-loader-inner { position: relative; width: min(80vw, 330px); display: grid; justify-items: center; text-align: center; }
    .video-loader-core { position: relative; width: 84px; height: 84px; border: 1px solid rgba(113, 221, 255, .5); border-radius: 21px; display: grid; place-items: center; color: #c7f5ff; background: radial-gradient(circle, rgba(86, 207, 244, .2), rgba(4, 27, 43, .94) 68%); box-shadow: inset 0 0 28px rgba(71, 193, 235, .13), 0 0 34px rgba(51, 188, 237, .15); animation: videoLoaderPulse 2.6s ease-in-out infinite; }
    .video-loader-core::before { content: ""; position: absolute; inset: -15px; border: 1px solid rgba(103, 211, 247, .13); border-radius: 28px; transform: rotate(45deg); }
    .video-loader-core::after { content: ""; width: 0; height: 0; margin-left: 4px; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-left: 12px solid currentColor; filter: drop-shadow(0 0 7px #6cddff); }
    .video-loader-line { position: relative; width: 100%; height: 1px; margin: 30px 0 18px; overflow: hidden; background: linear-gradient(90deg, transparent, rgba(104, 220, 255, .62), transparent); }
    .video-loader-line::after { content: ""; position: absolute; top: -1px; left: -24%; width: 24%; height: 3px; background: linear-gradient(90deg, transparent, #e6fbff, transparent); filter: drop-shadow(0 0 6px #6cddff); animation: videoLoaderCurrent 1.7s linear infinite; }
    .video-loader-title { margin: 0; font-size: 15px; font-weight: 430; letter-spacing: .055em; }
    .video-loader-note { margin: 9px 0 0; color: rgba(164, 214, 230, .48); font-size: 8px; letter-spacing: .18em; text-transform: uppercase; }

    .video-hero { min-height: 820px; }
    .video-hero::before { content: "LEARN"; }
    .video-hero .hero-shell { position: relative; min-height: 820px; padding-top: 124px; padding-bottom: 82px; grid-template-columns: minmax(430px, .9fr) minmax(520px, 1.1fr); gap: clamp(52px, 7vw, 112px); }
    .video-hero .hero-copy { position: relative; z-index: 2; }
    .video-hero .breadcrumbs { position: relative; z-index: 3; pointer-events: auto; }
    .video-hero .breadcrumbs a { position: relative; z-index: 1; min-height: 24px; display: inline-flex; align-items: center; pointer-events: auto; cursor: pointer; }
    .video-hero .breadcrumbs i { flex: 0 0 24px; pointer-events: none; }
    .video-hero .hero-title { max-width: 720px; font-size: clamp(54px, 5.7vw, 82px); line-height: .92; }
    .video-hero .hero-title em { color: #87e4ff; font-style: normal; }
    .video-hero .hero-lead { max-width: 650px; }
    .video-hero .hero-statline { max-width: 560px; padding-top: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 0; border-top: 1px solid rgba(104, 210, 250, .13); }
    .video-stat { padding: 18px 16px 0 0; }
    .video-stat + .video-stat { padding-left: 22px; border-left: 1px solid rgba(104, 210, 250, .1); }
    .video-stat strong { display: block; color: #e0f8ff; font-size: 26px; font-weight: 410; line-height: 1; letter-spacing: -.04em; }
    .video-stat span { margin-top: 8px; display: block; color: rgba(158, 203, 220, .46); font-size: 8px; line-height: 1.45; letter-spacing: .12em; text-transform: uppercase; }

    .video-hero-art { position: relative; z-index: 1; width: min(100%, 780px); aspect-ratio: 3 / 2; margin-left: auto; overflow: hidden; isolation: isolate; border: 1px solid rgba(117, 220, 255, .28); border-radius: 27px; display: block; color: #e9faff; background: #03101c; box-shadow: inset 0 1px rgba(255, 255, 255, .08), 0 38px 100px rgba(0, 0, 0, .42), 0 0 55px rgba(27, 147, 213, .1); text-decoration: none; transform: perspective(1600px) rotateY(-3.2deg) rotateX(1deg); transform-origin: 50% 50%; transition: transform .75s cubic-bezier(.2, .75, .2, 1), border-color .45s ease, box-shadow .55s ease; }
    .video-hero-art::before { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: .42; background: repeating-linear-gradient(0deg, transparent 0 3px, rgba(111, 223, 255, .028) 3px 4px), linear-gradient(135deg, rgba(126, 223, 250, .045), transparent 35%, rgba(1, 10, 18, .18)); mix-blend-mode: screen; }
    .video-hero-art::after { content: ""; position: absolute; top: -28%; left: -45%; z-index: 3; width: 24%; height: 158%; pointer-events: none; opacity: .5; background: linear-gradient(90deg, transparent, rgba(206, 248, 255, .22), transparent); filter: blur(5px); transform: rotate(15deg); animation: videoArtSweep 9s ease-in-out infinite; }
    .video-hero-art img { width: 100%; height: 100%; display: block; object-fit: cover; opacity: .96; filter: saturate(.82) contrast(1.045) brightness(.9); transform: scale(1.006); transition: filter .55s ease, opacity .55s ease, transform 1.05s cubic-bezier(.2, .72, .2, 1); }
    .video-art-frame { position: absolute; inset: 10px; z-index: 4; pointer-events: none; border: 1px solid rgba(180, 238, 253, .1); border-radius: 19px; box-shadow: inset 0 0 55px rgba(2, 19, 31, .12); }
    .video-art-badge { position: absolute; top: 20px; left: 20px; z-index: 5; min-height: 34px; padding: 0 13px; border: 1px solid rgba(142, 228, 250, .24); border-radius: 10px; display: inline-flex; align-items: center; gap: 9px; color: rgba(222, 248, 253, .8); background: rgba(3, 20, 33, .62); box-shadow: inset 0 1px rgba(255, 255, 255, .06); -webkit-backdrop-filter: blur(11px) saturate(125%); backdrop-filter: blur(11px) saturate(125%); font-size: 7px; letter-spacing: .13em; text-transform: uppercase; }
    .video-art-badge::before { content: ""; width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%; background: #92eaff; box-shadow: 0 0 10px rgba(99, 220, 255, .82); animation: nodePulse 3s ease-in-out infinite; }
    .video-hero-art:hover { border-color: rgba(136, 230, 255, .52); box-shadow: inset 0 1px rgba(255, 255, 255, .1), 0 45px 110px rgba(0, 0, 0, .46), 0 0 70px rgba(31, 164, 224, .16); transform: perspective(1600px) rotateY(0) rotateX(0) translateY(-7px); }
    .video-hero-art:hover img { opacity: 1; filter: saturate(.94) contrast(1.035) brightness(.96); transform: scale(1.025); }
    .video-hero-art:focus-visible { outline: 1px solid #9cecff; outline-offset: 6px; }

    .lesson-section { position: relative; padding-bottom: clamp(92px, 9vw, 144px); color: #173f52; background: #edf5f7; }
    .lesson-section::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .42; background-image: radial-gradient(rgba(25, 104, 139, .17) .7px, transparent .7px); background-size: 30px 30px; -webkit-mask-image: linear-gradient(90deg, #000, transparent 28%, transparent 72%, #000); mask-image: linear-gradient(90deg, #000, transparent 28%, transparent 72%, #000); }
    .lesson-section .section-shell { position: relative; z-index: 1; }
    .lesson-section .feed-heading { padding-bottom: 0; }
    .lesson-toolbar { margin-bottom: 34px; padding: 14px; border: 1px solid rgba(30, 107, 139, .14); border-radius: 18px; display: grid; grid-template-columns: minmax(260px, .75fr) minmax(520px, 1.25fr); align-items: center; gap: 18px; background: rgba(255, 255, 255, .52); box-shadow: 0 17px 45px rgba(45, 86, 105, .06); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
    .lesson-search { position: relative; min-height: 46px; }
    .lesson-search::before { content: ""; position: absolute; left: 17px; top: 50%; width: 12px; height: 12px; border: 1px solid #407e98; border-radius: 50%; transform: translateY(-58%); pointer-events: none; }
    .lesson-search::after { content: ""; position: absolute; left: 28px; top: 28px; width: 6px; height: 1px; background: #407e98; transform: rotate(45deg); pointer-events: none; }
    .lesson-search input { width: 100%; height: 46px; padding: 0 18px 0 43px; border: 1px solid rgba(33, 112, 146, .16); border-radius: 12px; outline: 0; color: #173f52; background: rgba(248, 252, 253, .82); font-size: 11px; transition: border-color .25s ease, box-shadow .25s ease; }
    .lesson-search input:focus { border-color: rgba(22, 132, 177, .45); box-shadow: 0 0 0 4px rgba(32, 143, 185, .07); }
    .lesson-filters { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 7px; }
    .lesson-filter { min-height: 36px; padding: 0 13px; border: 1px solid transparent; border-radius: 10px; color: rgba(41, 83, 101, .62); background: transparent; font-size: 9px; cursor: pointer; transition: color .25s ease, border-color .25s ease, background .25s ease; }
    .lesson-filter:hover, .lesson-filter:focus-visible, .lesson-filter.is-active { color: #145f7c; border-color: rgba(28, 113, 149, .17); background: rgba(255, 255, 255, .8); }
    .lesson-filter.is-active { box-shadow: 0 8px 20px rgba(33, 95, 120, .08); }
    .docs-layout { display: grid; grid-template-columns: 270px minmax(0, 1fr); align-items: start; gap: clamp(30px, 4.5vw, 72px); }
    .catalog-index { position: sticky; top: 112px; padding: 21px 18px 18px; border: 1px solid rgba(29, 106, 139, .14); border-radius: 18px; background: rgba(248, 252, 253, .65); box-shadow: 0 18px 48px rgba(38, 83, 103, .06); -webkit-backdrop-filter: blur(15px); backdrop-filter: blur(15px); }
    .catalog-index-head { padding: 0 6px 15px; border-bottom: 1px solid rgba(32, 106, 137, .12); display: flex; align-items: center; justify-content: space-between; gap: 15px; color: rgba(47, 87, 104, .55); font-size: 8px; letter-spacing: .16em; text-transform: uppercase; }
    .catalog-index-head b { color: #14799f; font-size: 9px; font-weight: 500; }
    .catalog-index-list { margin: 12px 0 0; padding: 0; display: grid; gap: 2px; list-style: none; }
    .catalog-index a { min-height: 38px; padding: 6px; border-radius: 9px; display: grid; grid-template-columns: 25px 1fr; align-items: center; gap: 7px; color: rgba(36, 74, 91, .71); text-decoration: none; font-size: 10px; line-height: 1.25; transition: color .25s ease, background .25s ease, transform .25s ease; }
    .catalog-index a span { color: rgba(27, 120, 156, .42); font-size: 7px; letter-spacing: .08em; }
    .catalog-index a:hover, .catalog-index a:focus-visible { color: #125c78; background: rgba(255, 255, 255, .8); transform: translateX(3px); }
    .catalog-index-note { margin: 15px 5px 2px; padding-top: 15px; border-top: 1px solid rgba(32, 106, 137, .1); color: rgba(49, 87, 101, .52); font-size: 8px; line-height: 1.55; }
    .catalog-main { min-width: 0; }
    .catalog-status { min-height: 26px; margin: 0 0 14px; display: flex; align-items: center; justify-content: space-between; gap: 20px; color: rgba(51, 86, 101, .53); font-size: 8px; letter-spacing: .13em; text-transform: uppercase; }
    .catalog-status::after { content: ""; width: 52px; height: 1px; background: linear-gradient(90deg, rgba(29, 119, 153, .38), transparent); }
    .lesson-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
    .lesson-card { position: relative; min-height: 340px; overflow: hidden; border: 1px solid rgba(26, 103, 135, .15); border-radius: 20px; display: flex; flex-direction: column; color: #173f52; background: rgba(250, 253, 254, .79); box-shadow: 0 16px 45px rgba(34, 78, 98, .065); text-decoration: none; content-visibility: auto; contain-intrinsic-size: 340px; transition: transform .45s cubic-bezier(.2, .72, .2, 1), border-color .35s ease, box-shadow .45s ease; }
    .lesson-card:hover, .lesson-card:focus-visible { border-color: rgba(24, 125, 165, .31); box-shadow: 0 24px 58px rgba(33, 88, 112, .12); transform: translateY(-7px); }
    .lesson-card-media { position: relative; height: 168px; overflow: hidden; background: radial-gradient(circle at 70% 30%, rgba(74, 178, 212, .24), transparent 36%), linear-gradient(145deg, #071a28, #0a2b3e); }
    .lesson-card-media::before { content: ""; position: absolute; inset: 0; z-index: 1; opacity: .45; background-image: linear-gradient(rgba(118, 214, 245, .075) 1px, transparent 1px), linear-gradient(90deg, rgba(118, 214, 245, .075) 1px, transparent 1px); background-size: 25px 25px; }
    .lesson-card-media::after { content: ""; position: absolute; inset: 0; z-index: 2; background: linear-gradient(135deg, rgba(3, 18, 29, .22), rgba(20, 105, 139, .06) 48%, rgba(3, 18, 29, .48)), linear-gradient(180deg, transparent 45%, rgba(4, 18, 29, .5)); }
    .lesson-card-media img { width: 100%; height: 100%; display: block; object-fit: cover; opacity: .72; filter: saturate(.45) contrast(1.08) brightness(.8) hue-rotate(3deg); transform: scale(1.03); transition: opacity .5s ease, filter .5s ease, transform .7s cubic-bezier(.2, .72, .2, 1); }
    .lesson-card:hover .lesson-card-media img { opacity: .88; filter: saturate(.7) contrast(1.05) brightness(.9); transform: scale(1.075); }
    .lesson-play { position: absolute; left: 50%; top: 50%; z-index: 3; width: 58px; height: 58px; border: 1px solid rgba(179, 239, 255, .52); border-radius: 18px; display: grid; place-items: center; color: #ddfaff; background: rgba(4, 24, 37, .68); box-shadow: 0 0 0 8px rgba(125, 221, 247, .035), 0 13px 35px rgba(0, 0, 0, .22); -webkit-backdrop-filter: blur(11px); backdrop-filter: blur(11px); transform: translate(-50%, -50%); transition: transform .4s ease, border-color .3s ease, background .3s ease; }
    .lesson-play::before { content: ""; width: 0; height: 0; margin-left: 4px; border-top: 7px solid transparent; border-bottom: 7px solid transparent; border-left: 11px solid currentColor; }
    .lesson-card:hover .lesson-play { border-color: rgba(192, 246, 255, .82); background: rgba(9, 56, 78, .76); transform: translate(-50%, -50%) scale(1.08); }
    .lesson-card-index { position: absolute; top: 14px; left: 15px; z-index: 3; min-width: 36px; height: 25px; padding: 0 8px; border: 1px solid rgba(173, 234, 250, .2); border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; color: rgba(210, 245, 253, .72); background: rgba(3, 20, 32, .58); font-size: 7px; letter-spacing: .12em; -webkit-backdrop-filter: blur(9px); backdrop-filter: blur(9px); }
    .lesson-card-copy { min-height: 170px; padding: 20px 21px 19px; display: flex; flex-direction: column; }
    .lesson-card-meta { display: flex; align-items: center; justify-content: space-between; gap: 15px; color: rgba(44, 92, 111, .48); font-size: 7px; letter-spacing: .14em; text-transform: uppercase; }
    .lesson-card-meta span:first-child { color: #237999; }
    .lesson-card h3 { margin: 15px 0 0; color: #173f52; font-size: clamp(17px, 1.35vw, 22px); font-weight: 430; line-height: 1.12; letter-spacing: -.035em; }
    .lesson-card p { margin: 11px 0 0; display: -webkit-box; overflow: hidden; color: rgba(51, 82, 96, .66); font-size: 10px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
    .lesson-card-action { margin-top: auto; padding-top: 15px; display: flex; align-items: center; gap: 10px; color: #1b7394; font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }
    .lesson-card-action::after { content: ""; width: 25px; height: 1px; background: linear-gradient(90deg, currentColor, transparent); transition: width .35s ease; }
    .lesson-card:hover .lesson-card-action::after { width: 44px; }
    .catalog-empty { margin: 35px 0 0; padding: 35px; border: 1px dashed rgba(35, 113, 146, .2); border-radius: 18px; color: rgba(43, 80, 96, .62); text-align: center; font-size: 12px; }

    .video-cta .cta-inner { max-width: 1120px; }
    .video-cta .cta-title { max-width: 890px; }

    .lesson-dialog { width: min(1480px, calc(100vw - 36px)); height: min(920px, calc(100dvh - 36px)); max-width: none; max-height: none; margin: auto; padding: 0; overflow: hidden; border: 1px solid rgba(112, 219, 250, .27); border-radius: 24px; color: #eaf8fc; background: #071827; box-shadow: 0 42px 130px rgba(0, 0, 0, .48); }
    .lesson-dialog::backdrop { background: rgba(1, 8, 14, .8); -webkit-backdrop-filter: blur(12px) saturate(115%); backdrop-filter: blur(12px) saturate(115%); }
    .lesson-modal-shell { position: relative; height: 100%; display: grid; grid-template-columns: 296px minmax(0, 1fr); grid-template-rows: 62px minmax(0, 1fr); overflow: hidden; }
    /* Neutralizes the legacy global `header { height: 488px; }` rule for every modal header. */
    .lesson-dialog header { height: auto; min-height: 0; max-height: none; }
    .lesson-dialog .lesson-modal-top { position: relative; z-index: 6; grid-column: 1 / -1; height: 62px; min-height: 62px; max-height: 62px; padding: 0 16px 0 22px; border-bottom: 1px solid rgba(104, 209, 246, .13); display: flex; align-items: center; gap: 15px; background: linear-gradient(180deg, #0a2538, #071a29); }
    .lesson-modal-brand { display: flex; align-items: center; gap: 15px; color: rgba(184, 230, 243, .67); font-size: 8px; letter-spacing: .16em; text-transform: uppercase; }
    .lesson-modal-logo { color: #bfeeff; background: linear-gradient(105deg, #68cfff 0%, #bfefff 17%, #fff 29%, #68cfff 46%, #e9fbff 64%, #70d6ff 82%, #d6f7ff 100%); background-size: 240% 100%; background-position: 0 50%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; font-size: 15px; font-weight: 500; line-height: 18px; letter-spacing: .08em; text-transform: none; white-space: nowrap; filter: drop-shadow(0 0 8px rgba(73, 190, 255, .34)); animation: miniLogoShimmer 9s ease-in-out infinite alternate; }
    .lesson-modal-brand-label { color: rgba(184, 230, 243, .67); }
    .lesson-modal-current { min-width: 0; margin-left: auto; color: rgba(174, 221, 235, .48); font-size: 8px; letter-spacing: .1em; white-space: nowrap; text-transform: uppercase; }
    .lesson-menu-toggle, .lesson-modal-close { position: relative; width: 38px; height: 38px; padding: 0; border: 1px solid rgba(111, 212, 246, .19); border-radius: 11px; display: grid; place-items: center; color: #9ce8ff; background: rgba(23, 83, 112, .13); cursor: pointer; transition: color .25s ease, border-color .25s ease, background .25s ease; }
    .lesson-menu-toggle { display: none; }
    .lesson-menu-toggle::before { content: ""; width: 15px; height: 11px; border-top: 1px solid currentColor; border-bottom: 1px solid currentColor; box-shadow: inset 0 5px transparent, 0 -5px transparent; background: linear-gradient(currentColor, currentColor) center / 15px 1px no-repeat; }
    .lesson-modal-close::before, .lesson-modal-close::after { content: ""; position: absolute; width: 15px; height: 1px; background: currentColor; }
    .lesson-modal-close::before { transform: rotate(45deg); }
    .lesson-modal-close::after { transform: rotate(-45deg); }
    .lesson-menu-toggle:hover, .lesson-modal-close:hover { color: #e7fbff; border-color: rgba(135, 228, 253, .42); background: rgba(36, 116, 148, .2); }
    .lesson-modal-nav { min-height: 0; padding: 18px 13px 24px; overflow-x: hidden; overflow-y: auto; color-scheme: light; border-right: 1px solid rgba(29, 104, 135, .18); background: radial-gradient(circle at 12% 4%, rgba(71, 166, 197, .13), transparent 27%), linear-gradient(rgba(25, 109, 144, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(25, 109, 144, .045) 1px, transparent 1px), linear-gradient(155deg, #dcebef, #edf5f7 58%, #dfecef); background-size: auto, 26px 26px, 26px 26px, auto; box-shadow: inset -18px 0 38px rgba(37, 93, 116, .045); scrollbar-width: thin; scrollbar-color: rgba(34, 119, 153, .28) transparent; }
    .modal-nav-label { margin: 0 7px 14px; color: rgba(34, 77, 95, .62); font-size: 8px; font-weight: 600; letter-spacing: .17em; text-transform: uppercase; }
    .modal-lesson-list { position: relative; display: grid; gap: 6px; }
    .modal-lesson-list::before { content: ""; position: absolute; top: 24px; bottom: 24px; left: 24px; z-index: 0; width: 1px; background: linear-gradient(180deg, transparent, rgba(24, 123, 160, .26) 8%, rgba(24, 123, 160, .26) 92%, transparent); box-shadow: 0 0 7px rgba(37, 139, 177, .1); }
    .modal-lesson-button { --lesson-accent: #1886ad; position: relative; z-index: 1; width: 100%; min-height: 58px; padding: 8px 11px 8px 8px; overflow: hidden; border: 1px solid rgba(31, 108, 139, .13); border-radius: 12px; display: grid; grid-template-columns: 35px 1fr; align-items: center; gap: 10px; color: #244e60; background: rgba(255, 255, 255, .58); box-shadow: inset 0 1px rgba(255, 255, 255, .8), 0 7px 18px rgba(42, 87, 105, .045); text-align: left; cursor: pointer; transition: color .25s ease, border-color .25s ease, background .25s ease, box-shadow .3s ease, transform .3s cubic-bezier(.2, .72, .2, 1); }
    .modal-lesson-button[data-area="start"] { --lesson-accent: #1596ae; }
    .modal-lesson-button[data-area="catalog"] { --lesson-accent: #167fa9; }
    .modal-lesson-button[data-area="sales"] { --lesson-accent: #2b8098; }
    .modal-lesson-button[data-area="content"] { --lesson-accent: #3978a0; }
    .modal-lesson-button[data-area="system"] { --lesson-accent: #557498; }
    .modal-lesson-index { position: relative; z-index: 2; width: 29px; height: 29px; border: 1px solid rgba(24, 126, 166, .28); border-radius: 50%; display: grid; place-items: center; color: var(--lesson-accent); background: #edf8fa; box-shadow: 0 0 0 4px rgba(231, 244, 247, .9), 0 4px 12px rgba(35, 105, 133, .09); font-size: 8px; font-weight: 650; letter-spacing: .08em; }
    .modal-lesson-copy { position: relative; z-index: 2; min-width: 0; display: grid; gap: 4px; }
    .modal-lesson-copy b { overflow: hidden; color: inherit; font-size: 11px; font-weight: 570; line-height: 1.24; text-overflow: ellipsis; }
    .modal-lesson-copy small { color: rgba(45, 89, 106, .5); font-size: 6px; font-weight: 600; letter-spacing: .14em; line-height: 1; text-transform: uppercase; }
    .modal-lesson-button:hover, .modal-lesson-button:focus-visible { color: #123f53; border-color: rgba(24, 119, 155, .28); background: rgba(255, 255, 255, .86); box-shadow: inset 0 1px #fff, 0 12px 25px rgba(38, 91, 113, .1); transform: translateX(4px); }
    .modal-lesson-button:focus-visible { outline: 1px solid rgba(22, 118, 156, .52); outline-offset: 2px; }
    .modal-lesson-button.is-active { color: #17485c; border-color: rgba(35, 131, 168, .27); background: linear-gradient(135deg, rgba(78, 174, 206, .22), rgba(42, 132, 165, .1)), rgba(255, 255, 255, .7); box-shadow: inset 2px 0 rgba(35, 151, 190, .72), inset 0 1px rgba(255, 255, 255, .72), 0 10px 24px rgba(25, 91, 117, .1); transform: translateX(2px); }
    .modal-lesson-button.is-active::after { content: ""; position: absolute; top: -25%; left: -38%; z-index: 1; width: 24%; height: 150%; pointer-events: none; opacity: .3; background: linear-gradient(90deg, transparent, rgba(231, 252, 255, .5), transparent); filter: blur(4px); transform: rotate(12deg); animation: modalLessonCurrent 6.8s ease-in-out infinite; }
    .modal-lesson-button.is-active .modal-lesson-index { color: #156d8c; border-color: rgba(46, 145, 180, .35); background: #e6f6f9; box-shadow: 0 0 0 4px rgba(111, 205, 229, .09), 0 0 13px rgba(62, 168, 199, .18); }
    .modal-lesson-button.is-active .modal-lesson-copy small { color: rgba(34, 91, 112, .58); }
    .lesson-modal-main { min-width: 0; min-height: 0; overflow-y: auto; color: #173f52; background: radial-gradient(circle at 84% 4%, rgba(89, 174, 203, .11), transparent 24%), #eef5f7; scroll-behavior: smooth; scrollbar-width: thin; scrollbar-color: rgba(34, 121, 157, .3) transparent; }
    .lesson-modal-content { width: min(100% - 72px, 1000px); margin: 0 auto; padding: 58px 0 68px; }
    .lesson-doc-head { padding-bottom: 35px; border-bottom: 1px solid rgba(33, 107, 137, .14); }
    .lesson-doc-kicker { margin: 0 0 14px; display: flex; align-items: center; gap: 11px; color: #2381a4; font-size: 8px; letter-spacing: .19em; text-transform: uppercase; }
    .lesson-doc-kicker::before { content: ""; width: 26px; height: 1px; background: linear-gradient(90deg, currentColor, transparent); }
    .lesson-doc-title { max-width: 820px; margin: 0; color: #153c4e; font-size: clamp(34px, 4.2vw, 64px); font-weight: 390; line-height: .98; letter-spacing: -.055em; }
    .lesson-doc-meta { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 8px; }
    .lesson-doc-meta span { min-height: 29px; padding: 0 10px; border: 1px solid rgba(32, 116, 150, .14); border-radius: 8px; display: inline-flex; align-items: center; color: rgba(41, 87, 105, .59); background: rgba(255, 255, 255, .52); font-size: 7px; letter-spacing: .12em; text-transform: uppercase; }
    .lesson-video { position: relative; margin: 38px 0 42px; overflow: hidden; border: 1px solid rgba(41, 120, 151, .18); border-radius: 20px; background: #061724; box-shadow: 0 25px 60px rgba(28, 73, 92, .16); }
    .lesson-video::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(216, 248, 255, .045), inset 0 -60px 90px rgba(2, 15, 24, .1); }
    .lesson-video iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; display: block; }
    .transcript-label { margin: 0 0 27px; display: flex; align-items: center; gap: 15px; color: rgba(37, 88, 108, .58); font-size: 8px; letter-spacing: .17em; text-transform: uppercase; }
    .transcript-label::after { content: ""; height: 1px; flex: 1; background: linear-gradient(90deg, rgba(35, 112, 142, .22), transparent); }
    .lesson-transcript { color: #284e5f; font-size: clamp(13px, 1vw, 15px); line-height: 1.78; }
    .lesson-transcript p { max-width: 810px; margin: 0 0 15px; }
    .lesson-transcript ul, .lesson-transcript ol { max-width: 810px; margin: 7px 0 22px; padding-left: 22px; }
    .lesson-transcript li { margin: 7px 0; padding-left: 3px; }
    .lesson-transcript strong, .lesson-transcript b { color: #153f52; }
    .lesson-intro-only { padding: 26px 28px; border: 1px solid rgba(35, 115, 148, .15); border-radius: 16px; color: rgba(43, 83, 99, .68); background: rgba(255, 255, 255, .55); }
    .lesson-shot { width: min(100%, 900px); margin: 34px auto 38px; padding: 0; border: 0; display: block; color: inherit; background: transparent; text-align: left; cursor: zoom-in; perspective: 1500px; }
    .lesson-shot-frame { position: relative; overflow: hidden; border: 1px solid rgba(33, 112, 145, .2); border-radius: 18px; display: block; background: #082131; box-shadow: 0 25px 56px rgba(28, 72, 90, .15); transform: rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg)); transform-style: preserve-3d; transition: transform .2s ease, border-color .35s ease, box-shadow .35s ease; }
    .lesson-shot-frame::before { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: .63; background: linear-gradient(135deg, rgba(4, 31, 47, .2), rgba(117, 213, 230, .045) 45%, rgba(4, 28, 43, .2)), linear-gradient(180deg, rgba(226, 248, 252, .035), transparent 28%, rgba(4, 28, 43, .14)); box-shadow: inset 0 0 0 1px rgba(220, 249, 255, .04), inset 0 -55px 90px rgba(3, 22, 34, .11); }
    .lesson-shot-frame::after { content: "+"; position: absolute; right: 14px; bottom: 14px; z-index: 3; width: 36px; height: 36px; border: 1px solid rgba(164, 230, 247, .23); border-radius: 10px; display: grid; place-items: center; color: rgba(227, 249, 254, .75); background: rgba(4, 24, 36, .7); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font-size: 17px; font-weight: 300; }
    .lesson-shot img { width: 100%; height: auto; display: block; opacity: .94; filter: saturate(.62) contrast(1.055) brightness(.9) hue-rotate(3deg); transition: filter .45s ease, opacity .45s ease, transform .55s ease; }
    .lesson-shot:hover .lesson-shot-frame, .lesson-shot:focus-visible .lesson-shot-frame { border-color: rgba(32, 131, 169, .4); box-shadow: 0 31px 70px rgba(25, 79, 101, .2); }
    .lesson-shot:hover img { opacity: 1; filter: saturate(.74) contrast(1.045) brightness(.95) hue-rotate(2deg); }
    .lesson-shot-caption { margin: 10px 4px 0; display: flex; align-items: center; gap: 10px; color: rgba(49, 86, 100, .47); font-size: 7px; letter-spacing: .12em; text-transform: uppercase; }
    .lesson-shot-caption::before { content: ""; width: 18px; height: 1px; background: #3484a1; opacity: .45; }
    .lesson-doc-nav { margin-top: 52px; padding-top: 25px; border-top: 1px solid rgba(33, 107, 137, .14); display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .lesson-step { min-height: 64px; padding: 12px 15px; border: 1px solid rgba(31, 109, 141, .14); border-radius: 13px; display: flex; align-items: center; gap: 13px; color: #25566a; background: rgba(255, 255, 255, .5); text-align: left; cursor: pointer; transition: border-color .25s ease, background .25s ease, transform .25s ease; }
    .lesson-step:last-child { justify-content: flex-end; text-align: right; }
    .lesson-step:hover { border-color: rgba(28, 123, 161, .3); background: rgba(255, 255, 255, .8); transform: translateY(-2px); }
    .lesson-step i { width: 8px; height: 8px; flex: 0 0 8px; border-bottom: 1px solid currentColor; border-left: 1px solid currentColor; transform: rotate(45deg); }
    .lesson-step:last-child i { order: 2; transform: rotate(225deg); }
    .lesson-step span { display: block; color: rgba(47, 91, 107, .48); font-size: 7px; letter-spacing: .12em; text-transform: uppercase; }
    .lesson-step b { margin-top: 5px; display: block; font-size: 10px; font-weight: 460; }

    .shot-dialog { width: min(94vw, 1540px); max-width: none; max-height: 92dvh; margin: auto; padding: 0; overflow: visible; border: 0; color: #e7faff; background: transparent; }
    .shot-dialog::backdrop { background: rgba(1, 8, 13, .91); -webkit-backdrop-filter: blur(13px) saturate(112%); backdrop-filter: blur(13px) saturate(112%); }
    .shot-dialog-figure { position: relative; margin: 0; padding: 42px 0 0; display: grid; justify-items: center; }
    .shot-dialog-image-wrap { position: relative; max-height: calc(92dvh - 70px); overflow: auto; border: 1px solid rgba(120, 220, 247, .27); border-radius: 18px; background: #071d2b; box-shadow: 0 38px 110px rgba(0, 0, 0, .55); }
    .shot-dialog-image-wrap::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(135deg, rgba(4, 29, 43, .16), rgba(112, 213, 232, .035) 48%, rgba(3, 23, 36, .18)), linear-gradient(180deg, rgba(226, 249, 253, .03), transparent 30%, rgba(3, 22, 34, .12)); box-shadow: inset 0 0 0 1px rgba(220, 249, 255, .035); }
    .shot-dialog img { max-width: 100%; height: auto; display: block; opacity: .96; filter: saturate(.62) contrast(1.055) brightness(.9) hue-rotate(3deg); }
    .shot-dialog-close { position: absolute; right: 0; top: 0; width: 35px; height: 35px; padding: 0; border: 1px solid rgba(130, 224, 249, .3); border-radius: 10px; display: grid; place-items: center; color: #b8effb; background: rgba(7, 31, 46, .82); cursor: pointer; }
    .shot-dialog-close::before, .shot-dialog-close::after { content: ""; position: absolute; width: 14px; height: 1px; background: currentColor; }
    .shot-dialog-close::before { transform: rotate(45deg); }
    .shot-dialog-close::after { transform: rotate(-45deg); }

    @keyframes videoLoaderPulse { 50% { transform: scale(.94); box-shadow: inset 0 0 34px rgba(71, 193, 235, .18), 0 0 46px rgba(51, 188, 237, .23); } }
    @keyframes videoLoaderCurrent { to { left: 105%; } }
    @keyframes videoArtSweep { 0%, 16% { left: -45%; } 62%, 100% { left: 128%; } }
    @keyframes modalLessonCurrent { 0%, 18% { left: -38%; } 64%, 100% { left: 128%; } }

    @media (max-width: 1180px) {
      .video-hero .hero-shell { grid-template-columns: minmax(370px, .85fr) minmax(430px, 1.15fr); gap: 44px; }
      .docs-layout { grid-template-columns: 235px minmax(0, 1fr); gap: 30px; }
      .lesson-card { min-height: 330px; }
    }

    @media (max-width: 980px) {
      .video-hero .hero-shell { grid-template-columns: 1fr; padding-top: 135px; }
      .video-hero-art { width: min(100%, 760px); margin-inline: auto; }
      .lesson-toolbar { grid-template-columns: 1fr; }
      .lesson-filters { justify-content: flex-start; }
      .docs-layout { grid-template-columns: 1fr; }
      .catalog-index { position: relative; top: auto; }
      .catalog-index-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .lesson-modal-shell { grid-template-columns: 260px minmax(0, 1fr); }
      .lesson-modal-content { width: min(100% - 48px, 920px); }
    }

    @media (max-width: 760px) {
      .video-hero { min-height: 0; }
      .video-hero .hero-shell { min-height: 0; padding-top: 118px; padding-bottom: 70px; }
      .video-hero .hero-title { font-size: clamp(43px, 13vw, 62px); }
      .video-hero .hero-statline { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .video-stat + .video-stat { padding-left: 12px; }
      .video-stat strong { font-size: 22px; }
      .video-stat span { font-size: 6px; }
      .video-hero-art { border-radius: 20px; transform: none; }
      .video-hero-art:hover { transform: translateY(-4px); }
      .video-art-frame { inset: 7px; border-radius: 14px; }
      .video-art-badge { top: 14px; left: 14px; }
      .lesson-toolbar { margin-bottom: 24px; padding: 11px; }
      .lesson-filters { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 3px; scrollbar-width: none; }
      .lesson-filter { white-space: nowrap; }
      .catalog-index-list { grid-template-columns: 1fr; }
      .lesson-grid { grid-template-columns: 1fr; }
      .lesson-card { min-height: 320px; }
      .lesson-dialog { width: 100vw; height: 100dvh; border: 0; border-radius: 0; }
      .lesson-modal-shell { grid-template-columns: 1fr; grid-template-rows: 58px minmax(0, 1fr); }
      .lesson-dialog .lesson-modal-top { height: 58px; min-height: 58px; max-height: 58px; padding-inline: 12px; }
      .lesson-modal-brand-label { display: none; }
      .lesson-modal-current { overflow: hidden; text-overflow: ellipsis; }
      .lesson-menu-toggle { display: grid; }
      .lesson-modal-nav { position: absolute; left: 0; top: 58px; bottom: 0; z-index: 5; width: min(88vw, 330px); border-right-color: rgba(117, 221, 250, .2); box-shadow: 30px 0 80px rgba(0, 0, 0, .38); opacity: 0; visibility: hidden; transform: translateX(-102%); transition: opacity .3s ease, visibility 0s linear .3s, transform .38s cubic-bezier(.2, .72, .2, 1); }
      .lesson-modal-shell.is-nav-open .lesson-modal-nav { opacity: 1; visibility: visible; transform: translateX(0); transition-delay: 0s; }
      .lesson-modal-shell.is-nav-open::after { content: ""; position: absolute; inset: 58px 0 0; z-index: 4; background: rgba(2, 10, 17, .55); }
      .lesson-modal-content { width: min(100% - 32px, 900px); padding: 38px 0 50px; }
      .lesson-doc-title { font-size: clamp(34px, 10vw, 48px); }
      .lesson-video { margin-top: 28px; border-radius: 14px; }
      .lesson-transcript { font-size: 13px; }
      .lesson-shot { margin-block: 27px 30px; }
      .lesson-shot-frame { border-radius: 13px; transform: none !important; }
      .lesson-doc-nav { grid-template-columns: 1fr; }
      .lesson-step:last-child { justify-content: flex-start; text-align: left; }
      .lesson-step:last-child i { order: 0; }
      .shot-dialog { width: calc(100vw - 20px); }
    }

    @media (max-width: 480px) {
      .video-hero .hero-statline { grid-template-columns: 1fr; }
      .video-stat { padding: 12px 0; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid rgba(104, 210, 250, .09); }
      .video-stat + .video-stat { padding-left: 0; border-left: 0; }
      .video-stat span { margin: 0; }
      .video-art-badge { top: 10px; left: 10px; min-height: 29px; padding-inline: 10px; font-size: 6px; }
      .catalog-index { padding: 17px 13px 14px; }
      .lesson-card-media { height: 154px; }
      .lesson-card-copy { padding: 18px; }
      .lesson-modal-current { max-width: 90px; }
      .lesson-doc-meta { gap: 6px; }
      .lesson-doc-meta span { font-size: 6px; }
    }

    @media (prefers-reduced-motion: reduce) {
      .video-hero-art, .video-hero-art img, .lesson-card, .lesson-shot-frame, .lesson-shot img { transition: none; transform: none !important; }
    }