/* ARVO — lms page styles.
   Build output. Rules are in ORIGINAL SOURCE ORDER and declarations are
   byte-identical to the source pages
   (shipped separately as arvo-website-source.zip). Only provably-dead rules were cut.
   Order is load-bearing on this site — do not sort, merge or share
   these files between pages. See README.md. */

/* ============================================
     ARVO BRAND TOKENS
     ============================================ */:root{
    --teal:        #007e7f;
    --teal-light:  #00a4a5;
    --teal-dark:   #003d3e;
    --orange:      #f8a32c;
    --orange-deep: #f47a20;
    --cream:       #faf7ed;
    --peach:       #ffdeb0;
    --cream-warm:  #fdf3e3;
    --gray-50:     #f1f1f1;
    --ink:         #003d3e;
    --ink-soft:    rgba(0, 61, 62, 0.7);
    --ink-mute:    rgba(0, 61, 62, 0.55);

    /* Product accent assignments — used inside product cards & connection band */
    --aep-accent:    #00a4a5;       /* teal-light: curriculum / substance */
    --pulse-accent:  #f8a32c;       /* orange: pulse, signal */
    --ops-accent:    #003d3e;       /* teal-dark: operations / institutional */
    --stack-accent:  #003d3e;       /* dark teal: foundation */

    --r-sm: 12px;
    --r-md: 20px;
    --r-lg: 32px;
    --r-xl: 48px;

    --shadow-sm: 0 4px 16px rgba(0, 61, 62, 0.06);
    --shadow-md: 0 12px 32px rgba(0, 61, 62, 0.08);
    --shadow-lg: 0 24px 60px rgba(0, 61, 62, 0.12);

    --max: 1240px;
    --pad: clamp(20px, 4vw, 48px);
  }*{ box-sizing: border-box; margin: 0; padding: 0; }html{ scroll-behavior: smooth; }/* Floating ambient circles — subtle for institutional page */.page-floats{
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
  }.page-float{
    position: absolute;
    border-radius: 50%;
    opacity: 0;
    animation: floatDrift linear infinite;
  }@keyframes floatDrift {
    0%   { transform: translateY(110vh) rotate(0deg); opacity: 0; }
    5%   { opacity: 1; }
    90%  { opacity: 1; }
    100% { transform: translateY(-10vh) rotate(360deg); opacity: 0; }
  }.pf-1{ width: 14px; height: 14px; background: rgba(248,163,44,0.08); left: 10%;  animation-duration: 32s; animation-delay: 0s; }.pf-2{ width: 10px; height: 10px; background: rgba(0,126,127,0.06);  left: 25%; animation-duration: 38s; animation-delay: 6s; }.pf-3{ width: 18px; height: 18px; background: rgba(255,222,176,0.12); left: 40%; animation-duration: 34s; animation-delay: 10s; }.pf-4{ width: 8px;  height: 8px;  background: rgba(248,163,44,0.08); left: 55%; animation-duration: 30s; animation-delay: 3s; }.pf-5{ width: 12px; height: 12px; background: rgba(0,164,165,0.06);  left: 70%; animation-duration: 40s; animation-delay: 14s; }.pf-6{ width: 16px; height: 16px; background: rgba(248,163,44,0.06); left: 85%; animation-duration: 36s; animation-delay: 8s; }@media (prefers-reduced-motion: reduce) {.page-floats{ display: none; }}@media (max-width: 768px) {.pf-3, .pf-5{ display: none; }}body{
    font-family: "Poppins", sans-serif;
    background: var(--cream);
    color: var(--ink);
    font-weight: 400;
    line-height: 1.55;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
  }::selection{ background: var(--orange); color: var(--teal-dark); }/* TYPOGRAPHY *//* LAYOUT */.container{
    max-width: var(--max);
    margin: 0 auto;
    padding: 0 var(--pad);
  }section{ position: relative; }/* BUTTONS */.btn{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 28px;
    border-radius: 999px;
    font-family: inherit;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 0.02em;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
    white-space: nowrap;
  }.btn-primary{
    background: var(--orange);
    color: var(--teal-dark);
    box-shadow: 0 6px 0 var(--orange-deep), 0 12px 24px rgba(244, 122, 32, 0.25);
  }.btn-primary:hover{
    transform: translateY(-2px);
    box-shadow: 0 8px 0 var(--orange-deep), 0 16px 28px rgba(244, 122, 32, 0.3);
  }.btn-primary:active{
    transform: translateY(4px);
    box-shadow: 0 2px 0 var(--orange-deep);
  }.btn-ghost{
    background: transparent;
    color: var(--teal-dark);
    border: 2px solid var(--teal-dark);
  }.btn-ghost:hover{
    background: var(--teal-dark);
    color: #fff;
  }.btn-arrow svg{ transition: transform .25s ease; }.btn:hover .btn-arrow svg{ transform: translateX(4px); }/* NAVIGATION */.nav{
    position: sticky;
    top: 0;
    background: rgba(250, 247, 237, 0.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    z-index: 100;
    border-bottom: 1px solid rgba(0, 61, 62, 0.06);
  }.nav-inner{
    max-width: 1280px;
    margin: 0 auto;
    padding: 16px clamp(20px, 4vw, 48px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
  }.logo{
    width: 92px;
    height: 30px;
    flex-shrink: 0;
  }.logo svg{ width: 100%; height: 100%; }.logo:hover{ opacity: 0.85; }.nav-links{
    display: flex;
    gap: 32px;
    list-style: none;
    align-items: center;
  }.nav-links a{
    color: var(--teal-dark);
    text-decoration: none;
    font-weight: 500;
    font-size: 15px;
    position: relative;
    padding: 6px 0;
    transition: color .2s ease;
    display: inline-flex;
    align-items: center;
    gap: 4px;
  }.nav-links a:hover{ color: var(--teal); }.nav-links a.active{ color: var(--teal); font-weight: 600; }/* Dropdown trigger — caret rotates on hover *//* Products dropdown — rich treatment with name + tagline *//* Override .nav-links a inline-flex — dropdown items must stack vertically *//* Simple dropdowns — single-line items for Plans, For Schools, etc. */.nav-cta{ display: flex; gap: 12px; align-items: center; }.nav-cta .btn{ padding: 12px 22px; font-size: 14px; }/* ============================================
     MOBILE NAV — hamburger + drawer
     ============================================ */.nav-toggle{
    display: none;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    color: var(--teal-dark);
  }.nav-toggle svg{
    width: 24px;
    height: 24px;
    transition: transform .2s ease;
  }.nav-toggle .icon-close{ display: none; }.nav.is-open .nav-toggle .icon-open{ display: none; }.nav.is-open .nav-toggle .icon-close{ display: block; }.mobile-drawer{
    display: none;
    background: var(--cream);
    border-bottom: 1px solid rgba(0, 61, 62, 0.08);
    padding: 8px 0 24px;
    max-height: calc(100vh - 64px);
    overflow-y: auto;
  }.nav.is-open .mobile-drawer{ display: block; }.mobile-drawer .container{
    display: flex;
    flex-direction: column;
    gap: 4px;
  }.md-section{
    padding: 14px 0 8px;
    border-top: 1px solid rgba(0, 61, 62, 0.08);
  }.md-section:first-of-type{ border-top: none; }.md-section-label{
    font-size: 11px;
    font-weight: 800;
    color: var(--ink-mute);
    text-transform: uppercase;
    letter-spacing: 0.14em;
    padding: 4px 14px;
    margin-bottom: 4px;
  }.md-link{
    display: block;
    padding: 12px 14px;
    color: var(--teal-dark);
    text-decoration: none;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    transition: background .15s ease;
  }.md-link:hover, .md-link:active{ background: var(--peach); }.md-cta{
    margin-top: 12px;
    padding: 0 14px;
  }.md-cta .btn{
    width: 100%;
    justify-content: center;
  }@media (max-width: 900px) {.nav-toggle{ display: inline-flex; }.nav-cta{ display: none; }}@media (max-width: 900px) {.nav-links{ display: none; }}/* ============================================
     SMALL MOBILE — ≤480px tuning
     ============================================ *//* ============================================
     SHARED — reveal, tick bullets, polish
     ============================================ */.rv{ opacity: 0; transform: translateY(26px); transition: opacity .7s cubic-bezier(.2,.65,.3,1), transform .7s cubic-bezier(.2,.65,.3,1); transition-delay: var(--rv-delay, 0s); }.rv.is-in{ opacity: 1; transform: none; }.rv .eyebrow::before{ transform: scaleX(0); transform-origin: left; transition: transform .6s cubic-bezier(.2,.65,.3,1) .15s; }.rv.is-in .eyebrow::before{ transform: scaleX(1); }.nav{ transition: box-shadow .3s ease; }.nav.is-scrolled{ box-shadow: 0 8px 30px rgba(0, 61, 62, 0.09); }@keyframes riseIn { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }@keyframes ambientFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }@media (prefers-reduced-motion: reduce) {.rv{ opacity: 1; transform: none; transition: none; }.rv .eyebrow::before{ transform: none; transition: none; }}/* ============================================
     SECTION 7 — Final CTA
     ============================================ */.cta-card .btn-primary{
    background: var(--teal-dark);
    color: var(--cream);
    box-shadow: 0 6px 0 #002425;
  }.cta-card .btn-primary:hover{ box-shadow: 0 8px 0 #002425; }.cta-card .btn-ghost{
    color: var(--teal-dark);
    border-color: var(--teal-dark);
  }.cta-card .btn-ghost:hover{
    background: var(--teal-dark);
    color: #fff;
  }/* ============================================
     FOOTER
     ============================================ *//* ============================================
     FOOTER (canonical — all pages)
     ============================================ */footer{
    background: var(--teal-dark);
    color: rgba(250, 247, 237, 0.7);
    padding: 60px 0 32px;
    position: relative;
    overflow: visible;
  }.footer-grid{
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr 1fr;
    gap: 36px;
    margin-bottom: 48px;
  }@media (max-width: 980px) {.footer-grid{ grid-template-columns: 1fr 1fr 1fr; }}@media (max-width: 800px) {.footer-grid{ grid-template-columns: 1fr 1fr; }}@media (max-width: 480px) {.footer-grid{ grid-template-columns: 1fr; }}.footer-social{
    display: flex;
    gap: 10px;
    margin-top: 22px;
  }.footer-social a{
    width: 36px; height: 36px;
    border-radius: 50%;
    background: rgba(250, 247, 237, 0.08);
    color: rgba(250, 247, 237, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .2s ease;
  }.footer-social a:hover{
    background: var(--orange);
    color: var(--teal-dark);
    transform: translateY(-2px);
  }footer h5{
    color: var(--cream);
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 18px;
  }footer ul{ list-style: none; }footer li{ margin-bottom: 10px; }footer a{
    color: rgba(250, 247, 237, 0.7);
    text-decoration: none;
    font-size: 14px;
    transition: color .2s ease;
  }footer a:hover{ color: var(--orange); }footer .footer-product{
    display: block;
    margin-bottom: 18px;
  }footer .footer-product .fp-name{
    display: block;
    color: var(--cream);
    font-weight: 700;
    font-size: 14px;
    margin-bottom: 2px;
  }footer .footer-product .fp-tag{
    display: block;
    color: rgba(250, 247, 237, 0.5);
    font-size: 12px;
    font-style: italic;
  }footer .footer-logo{
    display: inline-block;
    margin-bottom: 16px;
    height: 36px;
  }footer .footer-logo svg{
    height: 100%;
    width: auto;
    display: block;
  }footer .footer-logo svg .lg-mark{ fill: var(--cream); }footer .footer-logo svg .lg-tick{ fill: var(--orange); }footer .footer-tag{
    font-size: 14px;
    color: rgba(250, 247, 237, 0.6);
    line-height: 1.6;
    max-width: 320px;
  }.footer-bottom{
    padding-top: 28px;
    border-top: 1px solid rgba(250, 247, 237, 0.1);
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    font-size: 13px;
  }
.footer-bottom a{
    color: inherit;
    border-bottom: 1px solid rgba(250, 247, 237, 0.28);
    transition: color .2s ease, border-color .2s ease;
  }
.footer-bottom a:hover{
    color: var(--orange);
    border-bottom-color: var(--orange);
  }
/* Mascot — sits in the right gutter, vertically centered with the footer columns */.footer-mascot{
    position: absolute;
    right: clamp(24px, 5vw, 80px);
    top: 50%;
    transform: translateY(-50%);
    width: 118px;
    height: auto;
    transform-origin: 50% 50%;
    animation: mascotWave 3.5s ease-in-out 0.5s infinite;
    pointer-events: none;
    z-index: 2;
  }@keyframes mascotWave {
    0%, 100%   { transform: translateY(-50%) rotate(0deg); }
    25%        { transform: translateY(-50%) rotate(-4deg); }
    75%        { transform: translateY(-50%) rotate(4deg); }
  }@media (max-width: 1100px) {.footer-mascot{ width: 92px; right: 16px; }}@media (max-width: 800px) {.footer-mascot{ display: none; }}@media (prefers-reduced-motion: reduce) {.footer-mascot{ animation: none; transform: translateY(-50%); }}.md-cat{
    display: block;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--ink-mute);
    margin-top: 2px;
  }.footer-mascot{ animation: ambientFloat 6s ease-in-out infinite; }@media (prefers-reduced-motion: reduce) {.footer-mascot{ animation: none; }}/* ============================================
     LMS HERO — the ARVO Pulse reveal
     ============================================ */@keyframes pulseDot { 0%,100%{ transform:scale(1); opacity:1;} 50%{ transform:scale(1.45); opacity:.6;} }/* Live lesson card — the dark candy stage *//* ============================================
     DIAGNOSIS — dark turn, the parts problem
     ============================================ *//* ============================================
     RHYTHM — the six-beat relay loop
     ============================================ */@keyframes relayRun { 0%{ left:4%; } 15%{ left:20%; } 30%{ left:36%; } 48%{ left:52%; } 65%{ left:68%; } 82%{ left:84%; } 95%,100%{ left:92%; opacity:1; } }/* ============================================
     ENGINE ROOM — generators + calendar
     ============================================ *//* ============================================
     FOUR VIEWS — intro strip
     ============================================ *//* Shared view section chrome */.v-split .lead{ margin-bottom: 20px; }/* Teachers — classroom card + app/portal duo *//* Students — progress stage *//* Parents — three moments *//* Leaders — the Console */.console{ background: var(--cream); border-radius: var(--r-lg); padding: clamp(18px, 2vw, 26px); box-shadow: 0 8px 0 rgba(0,0,0,0.3), var(--shadow-lg); position:relative; z-index:1; }/* ============================================
     PAYOFF — two doors + the plan (peach)
     ============================================ */.payoff{ background: linear-gradient(165deg, var(--cream-warm) 0%, var(--peach) 100%); padding: clamp(88px, 11vw, 140px) 0; position:relative; overflow:hidden; }.door-cta .btn{ width:100%; justify-content:center; }.doors{ display:grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: clamp(36px, 4.5vw, 54px); }.door{ background: #fff; border-radius: var(--r-lg); padding: clamp(26px, 3vw, 38px); box-shadow: 0 8px 0 rgba(0,61,62,0.14); position:relative; }.door .pill-tag{ margin-bottom: 16px; }.door.d1 .pill-tag{ background: rgba(248,163,44,0.16); color: var(--orange-deep); }.door.d2 .pill-tag{ background: rgba(0,126,127,0.09); color: var(--teal); }.door h3{ font-size: clamp(21px, 2.2vw, 29px); font-weight: 800; letter-spacing: -0.015em; line-height: 1.15; color: var(--teal-dark); margin-bottom: 12px; }.door p{ font-size: 14.5px; color: var(--ink-soft); line-height: 1.65; margin-bottom: 16px; }.door .best-for{ font-size: 12.5px; color: var(--ink); background: var(--cream); border-radius: 12px; padding: 11px 14px; }.door .best-for b{ color: var(--teal-dark); }.door .bill-chip{ font-size: 10.5px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--teal-dark); background: var(--peach); border-radius: 999px; padding: 6px 13px; }/* ============================================
     XSELL — the exam handshake
     ============================================ *//* Placeholder slots — honest stand-ins until real product screens arrive *//* ============================================
     TAGGED — the spine thesis (dark)
     ============================================ */.tagged{ background: var(--teal-dark); color: var(--cream); padding: clamp(84px, 10vw, 132px) 0; position:relative; overflow:hidden; }.tagged::before{ content:""; position:absolute; top:-160px; right:-140px; width:480px; height:480px; border-radius:50%;
    background: radial-gradient(circle, rgba(248,163,44,0.13) 0%, transparent 65%); pointer-events:none; }.tagged .eyebrow{ color: var(--orange); }.tagged .sec-h{ color: var(--cream); }.tagged .lead{ color: rgba(250,247,237,0.72); max-width: 680px; }/* BEND — bespoke fit rows */.bend .seg{ background: rgba(0,61,62,0.08); }.bend .seg button{ color: var(--ink-mute); }.bend .seg button.on{ color: var(--teal-dark); }.bend .check .clab{ color: var(--teal-dark); }.bend .check:not(.on) .clab{ color: var(--ink-mute); }.bend .check .cbox{ box-shadow: 0 4px 0 rgba(0,61,62,0.18); }.bend .check.on .cbox{ box-shadow: 0 4px 0 var(--orange-deep); }.b-chip{ font-size:10.5px; font-weight:800; letter-spacing:0.04em; color:var(--teal-dark); background:rgba(0,126,127,0.10); border-radius:999px; padding:6px 12px; }/* candy bricks (split/merge) *//* content faders (choose) — interactive */.seg{ display:inline-flex; background:rgba(0,36,37,0.45); border-radius:999px; padding:5px; margin-bottom:24px; }.seg button{ font-family:inherit; border:0; cursor:pointer; font-size:12px; font-weight:800; letter-spacing:0.06em; padding:9px 18px; border-radius:999px; color:rgba(250,247,237,0.6); background:transparent; }.seg button.on{ background:var(--orange); color:var(--teal-dark); box-shadow:0 4px 0 var(--orange-deep); }.check{ display:flex; align-items:center; gap:12px; cursor:pointer; border:0; background:none; font-family:inherit; padding:0; text-align:left; }.check .cbox{ width:30px; height:30px; flex:none; border-radius:10px; background:#fff; box-shadow: 0 4px 0 rgba(0,0,0,0.25); display:grid; place-items:center; font-size:15px; font-weight:900; color:transparent; transition: background .15s; }.check.on .cbox{ background: var(--orange); color: var(--teal-dark); box-shadow: 0 4px 0 var(--orange-deep); }.check .clab{ font-size:14px; font-weight:800; color: var(--cream); }.check:not(.on) .clab{ color: rgba(250,247,237,0.45); text-decoration: line-through; }.desk{ display: grid; grid-template-columns: auto 1fr; gap: clamp(28px,4vw,52px); align-items: center; }.desk .b-card{ min-width: 230px; }.desk-preview .b-chip{ background: var(--peach); }
/* ============ FLAT SCREENS — device on the canvas, no stage, no shadow ============ */



.flat-frame .flat-phone .scr{ border-radius: 24px; overflow:hidden; background: var(--cream); }
.flat-frame .flat-phone .scr img{ display:block; width:100%; }



.flat-frame.is-pair .pair-phone .scr{ border-radius: 19px; overflow:hidden; background: var(--cream); }
.flat-frame.is-pair .pair-phone .scr img{ display:block; width:100%; }




@media (prefers-reduced-motion: no-preference){
  @keyframes flatRise { from { opacity:0; transform: translateY(16px); } to { opacity:1; transform:none; } }
  .sf-panel.enter .flat-frame > *:first-child{ animation: flatRise .5s cubic-bezier(.2,.75,.25,1) .08s both; }
  .sf-panel.enter .flat-cap{ animation: flatRise .5s cubic-bezier(.2,.75,.25,1) .2s both; }
}
/* ============================================
     STAR FEATURES — rail & stage
     ============================================ */.star-feats{ background: var(--cream-warm); padding: clamp(80px, 10vw, 126px) 0; position: relative; overflow: clip; }.star-feats::before{ content:""; position:absolute; top:-170px; right:-150px; width:520px; height:520px; border-radius:50%;
     background: radial-gradient(circle, rgba(248,163,44,0.12) 0%, transparent 65%); pointer-events:none; }.sf-rail{ display: grid; gap: 12px; position: sticky; top: 96px; }.sf-stop{ display: flex; gap: 14px; align-items: flex-start; text-align: left; font-family: inherit; border: 0; cursor: pointer;
     background: #fff; border-radius: 18px; padding: 15px 17px; box-shadow: 0 6px 0 rgba(0,61,62,0.12); transition: transform .18s ease; }.sf-stop:hover{ transform: translateY(-2px); }.sf-stop .n{ width: 30px; height: 30px; flex: none; border-radius: 50%; background: var(--cream); color: var(--teal-dark);
     display: grid; place-items: center; font-size: 12px; font-weight: 900; }.sf-stop b{ display: block; font-size: 15px; font-weight: 800; color: var(--teal-dark); margin-bottom: 3px; }.sf-stop span:not(.n){ font-size: 12px; color: var(--ink-mute); line-height: 1.45; display: block; }.sf-stop.active{ background: var(--teal-dark); box-shadow: 0 6px 0 #002425; }.sf-stop.active .n{ background: var(--orange); }.sf-stop.active b{ color: var(--cream); }.sf-stop.active span:not(.n){ color: rgba(250,247,237,0.65); }.sf-rail .sf-mascot{ width: clamp(130px, 12vw, 185px); justify-self: center; margin-top: clamp(18px, 2.5vw, 34px); animation: ambientFloat 5s ease-in-out infinite; }@media (prefers-reduced-motion: reduce){.sf-rail .sf-mascot{ animation: none; }}.sf-panel[hidden]{ display: none !important; }@media (max-width: 980px) {.sf-rail{ position: static; display: flex; gap: 10px; overflow-x: auto; padding-bottom: 8px; scrollbar-width: thin; }.sf-stop{ flex: 0 0 auto; min-width: 210px; }.sf-rail .sf-mascot{ display: none; }}/* ============================================
     MOTION POLISH — industry-standard micro-interactions
     ============================================ */@media (prefers-reduced-motion: no-preference) {/* panel & state switches: fade-rise */@keyframes panelIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }.sf-panel.enter, .split-stage.enter{ animation: panelIn .34s cubic-bezier(.2,.7,.25,1) both; }/* rail stops: smooth state change */.sf-stop{ transition: transform .18s ease, background-color .22s ease, box-shadow .22s ease; }.sf-stop b, .sf-stop span:not(.n), .sf-stop .n{ transition: color .22s ease, background-color .22s ease; }/* checkbox tick pop */@keyframes tickPop { 0% { transform: scale(.8); } 55% { transform: scale(1.14); } 100% { transform: scale(1); } }.check .cbox{ transition: background-color .18s ease, box-shadow .18s ease; }.check.pop .cbox{ animation: tickPop .28s cubic-bezier(.3,1.4,.5,1); }/* tag pills soft entrance */@keyframes chipIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }.desk-preview .b-chip{ animation: chipIn .22s ease both; }/* hero fan: staggered rise-settle once revealed */@keyframes fanRise1 { from { opacity:0; transform: translateX(-158%) translateY(46px) rotate(-11deg); } to { opacity:1; transform: translateX(-158%) rotate(-7deg); } }@keyframes fanRise2 { from { opacity:0; transform: translateX(-50%) translateY(52px) rotate(6deg); } to { opacity:1; transform: translateX(-50%) rotate(2deg); } }@keyframes fanRise3 { from { opacity:0; transform: translateX(58%) translateY(46px) rotate(12deg); } to { opacity:1; transform: translateX(58%) rotate(7deg); } }.hb-fan.is-in .f1{ animation: fanRise1 .65s cubic-bezier(.2,.75,.25,1) .05s both; }.hb-fan.is-in .f2{ animation: fanRise2 .65s cubic-bezier(.2,.75,.25,1) .18s both; }.hb-fan.is-in .f3{ animation: fanRise3 .65s cubic-bezier(.2,.75,.25,1) .31s both; }/* hero stickers: settle pop */@keyframes settlePop { 0% { opacity:0; transform: translateY(10px) scale(.92) rotate(var(--stick-r,0deg)); } 70% { opacity:1; transform: translateY(-2px) scale(1.03) rotate(var(--stick-r,0deg)); } 100% { opacity:1; transform: rotate(var(--stick-r,0deg)); } }.rv.is-in .hb-stickers .stick, .hb-stickers.is-in .stick{ animation: settlePop .5s cubic-bezier(.25,1.1,.35,1) both; }/* buttons: press feel */.btn, .seg button, .sf-stop{ will-change: transform; }.btn:active, .sf-stop:active{ transform: translateY(2px); }}/* ============================================
     FEATURE SECTIONS — calendar / generators / tutor
     ============================================ *//* ============================================
     WINDOWS — every role gets its view
     ============================================ *//* featured pair card — real portal + mobile test */.pair-shot .phone{ position:absolute; right: 0; bottom: 0; width: clamp(120px, 12vw, 158px); z-index: 2; }.phone{ border-radius: 30px; padding: 8px; background:#fff; border:1px solid rgba(0,61,62,0.14); box-shadow: none; transform: rotate(3deg); }.stage-phone .scr{ border-radius: 23px; overflow: hidden; background: var(--teal-dark); }.stage-phone .scr img{ display:block; width: 100%; }.phone .scr{ border-radius: 23px; overflow: hidden; background: var(--cream); }.phone .scr img{ display:block; width: 100%; }/* ============================================
     CONSOLE SECTION — the investment view (dark)
     ============================================ */.console-sec .lead{ color: rgba(250,247,237,0.72); }/* ============================================
     DIRECTION B SKIN — centered hero + candy doubled
     ============================================ */.hero-b{ position:relative; overflow:hidden; text-align:center; padding: clamp(48px,5vw,72px) 0 0; background:
     radial-gradient(circle at 12% 18%, rgba(248,163,44,0.18) 0%, transparent 30%),
     radial-gradient(circle at 88% 72%, rgba(0,164,165,0.16) 0%, transparent 32%), var(--cream); }.hero-b h1{ font-size: clamp(42px, 6.4vw, 84px); font-weight:900; letter-spacing:-0.03em; line-height:0.98; color:var(--teal-dark); }.hero-b h1 .pop{ color:var(--orange); display:inline-block; }.hero-b .hb-sub{ font-size: clamp(15px,1.5vw,17.5px); font-weight:500; color:var(--ink-soft); max-width:600px; margin:18px auto 30px; line-height:1.65; }.hb-ctas{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-bottom:36px; }.hb-fan .f2{ transform: translateX(-50%) rotate(2deg); z-index:2; }/* level badges for features *//* browser-chrome window inside candy stages *//* tagged specimen *//* ============================================
     LMS RESPONSIVE
     ============================================ */@media (max-width: 980px) {.doors{ grid-template-columns: 1fr; }}/* ============================================
   WHO GETS WHAT — stakeholder roll-call (v92.0)
   ============================================ */.swx{ padding: clamp(84px, 10vw, 128px) 0 clamp(64px, 8vw, 100px); }.swx-band{ background:#fff; border:1px solid rgba(0,61,62,0.14); border-radius:20px; overflow:hidden; scroll-margin-top:84px; }.swx-head{ width:100%; display:flex; align-items:center; gap:12px; padding:16px 20px; border:0; font-family:inherit; cursor:pointer; text-align:left; color:#fff; }.swx-sp .swx-head{ background: var(--teal-light); }.swx-tc .swx-head{ background: var(--orange-deep); }.swx-ow .swx-head{ background: var(--teal-dark); }.swx-head:focus-visible{ outline:3px solid var(--orange); outline-offset:-3px; }.swx-band.open .swx-arrow{ transform:rotate(180deg); background:#fff; color:var(--teal-dark); border-color:#fff; }.swx-band.open .swx-chips{ display:none; }.swx-band.open .swx-body{ display:block; }@media (max-width: 860px){.swx-head{ padding:15px 16px; }}
    /* v93.18 hero — fold-peek */
    .hero-b{padding-bottom:0;}
    .hero-b h1 .l2{display:block;font-size:clamp(24px,3vw,40px);letter-spacing:-0.02em;margin-top:8px;}
    
    
    
    
    
    
    
    
    
    .bw{border-radius:16px 16px 0 0;overflow:hidden;border:1px solid rgba(0,61,62,.16);border-bottom:none;background:#fff;}
    .bw-bar{display:flex;align-items:center;gap:8px;background:var(--cream-warm);border-bottom:1px solid rgba(0,61,62,.10);padding:10px 16px;}
    .bw-bar i{width:10px;height:10px;border-radius:50%;background:rgba(0,61,62,.18);}
    .bw-bar span{flex:1;text-align:center;font-size:12px;font-weight:800;color:var(--ink-mute);letter-spacing:.04em;}
    .bw img{display:block;width:100%;height:auto;}
    

  
    .hero-b{padding-top:clamp(64px,7vw,104px);}
    .hero-b h1{font-size:clamp(38px,5.2vw,66px);margin-bottom:clamp(28px,3.2vw,40px);}
    .hero-b .hb-ctas{margin-bottom:clamp(44px,4.8vw,68px);}
    .hero-b .hb-statstrip{margin-bottom:clamp(48px,5.5vw,80px);}
    .hero-b .hb-statkicker{margin-bottom:clamp(32px,3.8vw,50px);}
  
    /* v93.18 what-is */
    .whatis{background:var(--cream-warm, #fdf3e3);padding:clamp(64px,7.5vw,104px) 24px;}
    .whatis .wi-grid{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:1.6fr 1fr;gap:clamp(30px,4vw,70px);align-items:center;}
    .wi-kick{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--teal);margin-bottom:18px;}
    .wi-kick::before{content:"";width:26px;height:3px;background:var(--orange);border-radius:2px;}
    .whatis h2{font-size:clamp(30px,4vw,50px);font-weight:900;letter-spacing:-0.025em;line-height:1.08;color:var(--teal-dark);}
    .whatis h2 .pop{color:var(--orange);}
    .wi-def{font-size:clamp(16px,1.7vw,19px);line-height:1.7;color:rgba(0,61,62,.7);font-weight:600;margin-top:20px;max-width:560px;}
    .wi-side{display:flex;justify-content:center;}
    .wi-mascot{width:clamp(140px,15vw,200px);transform:rotate(-4deg);}
    @media (max-width:640px){ .whatis .wi-grid{grid-template-columns:1fr;} .wi-mascot{display:none;} }

  
    /* v93.18 star-feats S1 */
    .star-feats{background:var(--cream, #faf7ed);padding:clamp(64px,7.5vw,104px) 24px;}
    
    
    .sf-head h2 .pop{color:var(--orange);}
    
    
    
    .sf-tab .n{color:var(--orange);margin-right:8px;font-weight:900;}
    .sf-tab.on{background:var(--teal-dark);border-color:var(--teal-dark);color:#fff;}
    
    
    .sf-stage.enter{animation:sfIn .38s ease;}
    @keyframes sfIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
    
    
    
    
    
    .frow .no{font-size:12px;font-weight:900;color:var(--orange-deep);min-width:26px;}
    
    
    

  
    /* v93.18 console flagship C1 */
    .console-x{background:#022b2c;padding:clamp(64px,7.5vw,108px) 24px;color:#fff;}
    .cx-wrap{max-width:1120px;margin:0 auto;}
    
    .cx-kick{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--peach,#ffdeb0);margin-bottom:16px;}
    .cx-live{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:6px 14px;font-size:11px;font-weight:800;letter-spacing:.1em;color:#fff;}
    .cx-live i{width:8px;height:8px;border-radius:50%;background:var(--orange);animation:cxPulse 1.6s infinite;}
    @keyframes cxPulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.4;transform:scale(.75);}}
    .console-x h2{font-size:clamp(30px,4.2vw,54px);font-weight:900;letter-spacing:-0.025em;line-height:1.06;color:#fff;margin-top:16px;}
    .console-x h2 .pop{color:var(--orange);}
    .cx-lead{font-size:clamp(15px,1.6vw,18px);line-height:1.7;color:rgba(255,255,255,.78);font-weight:500;max-width:560px;margin-top:16px;}
    .cx-lead b{color:#fff;}
    
    
    
    
    .cx-bw{border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.16);background:var(--teal-dark);}
    .cx-bw .bw-bar{background:rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.10);}
    .cx-bw .bw-bar i{background:rgba(255,255,255,.22);}
    .cx-bw .bw-bar span{color:rgba(255,255,255,.6);}
    
    
    
    
    
    
    

  
    /* v93.18 payoff F2 + final CTA */
    .payoff-x{background:var(--cream-warm,#fdf3e3);padding:clamp(64px,7.5vw,104px) 24px clamp(40px,5vw,64px);}
    .f2-head{max-width:1000px;margin:0 auto 30px;text-align:center;}
    .f2-head h2{font-size:clamp(28px,4vw,50px);font-weight:900;letter-spacing:-0.025em;line-height:1.08;color:var(--teal-dark);}
    .f2-head h2 .pop{color:var(--orange);}
    .f2-lead{max-width:620px;margin:14px auto 0;font-size:clamp(15px,1.5vw,17px);line-height:1.7;color:rgba(0,61,62,.7);font-weight:500;}
    .f2-tbl{max-width:1000px;margin:0 auto;background:#fff;border:1px solid rgba(0,61,62,.14);border-radius:24px;overflow:hidden;}
    .f2-row{display:grid;grid-template-columns:.9fr 1fr 1fr;border-bottom:1px solid rgba(0,61,62,.10);}
    .f2-row:last-child{border-bottom:none;}
    .f2-cell{padding:18px 22px;font-size:13.5px;line-height:1.55;color:rgba(0,61,62,.7);font-weight:500;}
    .f2-row .f2-cell:nth-child(2){background:rgba(0,126,127,.06);border-left:1px solid rgba(0,61,62,.10);border-right:1px solid rgba(0,61,62,.10);}
    .f2-hdr .f2-cell{padding-top:24px;}
    .f2-hdr b{display:block;font-size:17px;font-weight:900;color:var(--teal-dark);}
    .f2-hdr .pr{font-size:12px;font-weight:800;color:var(--orange-deep);}
    .f2-side{font-weight:800;color:var(--teal-dark);}
    .f2-both{background:var(--teal-dark);}
    .f2-both .f2-cell{color:rgba(255,255,255,.85);}
    .f2-both .f2-side{color:#fff;}
    .f2-both .f2-cell:nth-child(2){background:transparent;border-left:none;border-right:none;}
    .f2-span{grid-column:2/4;}
    .f2-note{max-width:1000px;margin:18px auto 0;text-align:center;font-size:12.5px;font-weight:700;color:rgba(0,61,62,.6);}
    .final-x{background:var(--cream-warm,#fdf3e3);padding:0 24px clamp(72px,8vw,116px);}
    .fx-band{max-width:1000px;margin:0 auto;background:var(--peach,#ffdeb0);border-radius:26px;padding:clamp(24px,3vw,38px) clamp(24px,3.4vw,44px);display:flex;align-items:center;gap:clamp(18px,2.6vw,36px);}
    .fx-mascot{width:clamp(72px,7vw,104px);flex:0 0 auto;transform:rotate(4deg);}
    .fx-copy{flex:1;}
.fx-copy .fx-sub{margin:10px 0 0;font-size:clamp(14px,1.5vw,16px);line-height:1.55;color:var(--ink-mute,#4b5b5b);}
    .fx-copy h2{font-size:clamp(21px,2.6vw,32px);font-weight:900;letter-spacing:-0.02em;line-height:1.12;color:var(--teal-dark);}
    .fx-copy h2 .pop{color:var(--orange-deep);}
    .fx-copy p{font-size:13.5px;line-height:1.6;color:rgba(0,61,62,.7);font-weight:500;margin-top:8px;}
    .btn-dark{background:var(--teal-dark);color:#fff;box-shadow:0 6px 0 #01201f;flex:0 0 auto;}
    @media (max-width:640px){
      .f2-row{grid-template-columns:1fr;}
      .f2-hdr{display:none;}
      .f2-row .f2-cell:nth-child(2){border-left:none;border-right:none;}
      .f2-side{padding-bottom:4px;font-size:12px;text-transform:uppercase;letter-spacing:.1em;border-bottom:none;}
      .f2-cell[data-door]::before{content:attr(data-door) " · ";font-weight:900;color:var(--teal);}
      .f2-cell[data-door]{padding-top:8px;}
      .f2-span{grid-column:auto;}
      .fx-band{flex-direction:column;text-align:center;}
    }

  
    /* mobile door-grouped stack */
    .f2-mstack{display:none;}
    @media (max-width:640px){
      .f2-tbl{display:none;}
      .f2-mstack{display:flex;flex-direction:column;gap:14px;max-width:520px;margin:0 auto;}
      .f2-mdoor{border-radius:20px;padding:22px 20px;}
      .f2-mdoor{background:#fff;border:1px solid rgba(0,61,62,.14);}
      .f2-mdoor.md1{background:#fff;border:2px solid var(--teal);}
      .f2-mdoor.mboth{background:var(--teal-dark);border-color:var(--teal-dark);}
      .f2-mdoor .dk{display:block;font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--teal-dark);margin-bottom:2px;}
      .f2-mdoor .pr{display:inline-block;font-size:12px;font-weight:800;color:var(--orange-deep);margin-bottom:10px;}
      .f2-mdoor p{font-size:13.5px;line-height:1.6;font-weight:500;color:rgba(0,61,62,.7);margin-top:8px;}
      .f2-mdoor p b{font-weight:900;color:var(--teal-dark);}
      .f2-mdoor.mboth .dk{color:#fff;}
      .f2-mdoor.mboth p{color:rgba(255,255,255,.85);}
    }

  
/* v93.20 master-matrix swx */
.mxs{padding:clamp(56px,6.5vw,92px) 24px;background:var(--cream-warm,#fdf3e3);}
.mxs .mxh{text-align:center;max-width:780px;margin:0 auto clamp(24px,3vw,38px);}
.mxs .mxk{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#007e7f;margin-bottom:14px;}
.mxs .mxk::before{content:"";width:26px;height:3px;background:#f8a32c;border-radius:2px;}
.mxs h2{font-size:clamp(26px,3.8vw,46px);font-weight:900;letter-spacing:-.025em;line-height:1.06;color:#003d3e;}
.mxs h2 .mxpop{color:#f8a32c;}
.mxs .mxsub{font-size:clamp(13px,1.45vw,16px);color:rgba(0,61,62,.7);font-weight:500;margin-top:12px;}
.mx{max-width:980px;margin:0 auto;background:#fff;border:1px solid rgba(0,61,62,.12);border-radius:22px;overflow:hidden;}
.mx-hdr{display:grid;grid-template-columns:2fr repeat(3,1fr);background:#003d3e;}
.mx-hdr .c{color:#fff;font-weight:900;font-size:12px;text-align:center;padding:14px 8px;display:flex;flex-direction:column;gap:4px;align-items:center;}
.mx-hdr .c i{width:22px;height:5px;border-radius:3px;font-style:normal;}
.mx-hdr .c:first-child{align-items:flex-start;padding-left:18px;font-size:10px;letter-spacing:.08em;color:rgba(255,255,255,.6);}
.mx .i-sp{background:#00a4a5;} .mx .i-t{background:#f47a20;} .mx .i-a{background:#4cc9ca;}
.mx-grp{display:flex;align-items:center;justify-content:space-between;background:#fdf3e3;border-bottom:1px solid rgba(0,61,62,.10);width:100%;border-left:none;border-right:none;border-top:none;font-family:inherit;cursor:pointer;}
.mx-grp .g{font-size:11.5px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:#003d3e;padding:14px 18px;text-align:left;}
.mx-grp .n{font-size:11px;font-weight:800;color:rgba(0,61,62,.55);padding-right:16px;display:flex;align-items:center;gap:8px;}
.mx-grp .chev{width:24px;height:24px;border-radius:50%;background:#003d3e;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:11px;}
.mx-body[hidden]{display:none;}
.mx-row{display:grid;grid-template-columns:2fr repeat(3,1fr);align-items:center;border-bottom:1px solid rgba(0,61,62,.07);}
.mx-row:last-child{border-bottom:none;}
.mx-row .f{padding:11px 18px;font-size:12.5px;font-weight:800;color:#003d3e;}
.mx-row .d{text-align:center;}
.mx-row .d i{display:inline-block;width:10px;height:10px;border-radius:50%;font-style:normal;}
.mx-row .d .no{display:inline-block;width:14px;height:2px;border-radius:2px;background:rgba(0,61,62,.12);}
.mx .d-sp{background:#00a4a5;} .mx .d-t{background:#f47a20;} .mx .d-a{background:#007e7f;}
@media (max-width:760px){
.mx-hdr .c{font-size:10px;padding:12px 4px;}
.mx-row .f{font-size:11.5px;padding:10px 12px;}
}
/* ===== v93.29 · interaction layer (sitewide, conscious) =====
   Only interactive things move: links, buttons, cards that link or expand, matrix rows, tabs.
   200ms ease-out; 1-2px lifts; no blurred shadows; reduced-motion switches all of it off. */
:root{ --ix-ease:cubic-bezier(.2,.65,.3,1); --ix-t:.2s; }
a,button{ transition:color var(--ix-t) var(--ix-ease), background-color var(--ix-t) var(--ix-ease), border-color var(--ix-t) var(--ix-ease), transform var(--ix-t) var(--ix-ease), box-shadow var(--ix-t) var(--ix-ease); }
/* buttons: lift on hover, press on active */
.btn:hover{ transform:translateY(-1px); }
.btn:active{ transform:translateY(3px); transition-duration:.08s; }
.btn-primary:hover{ box-shadow:0 9px 0 var(--orange-deep); }
.btn-primary:active{ box-shadow:0 5px 0 var(--orange-deep); }
.btn-ghost:hover{ background:rgba(0,61,62,.06); color:var(--teal-dark); }
/* nav links: underline grows in */
.nav a:not(.btn){ position:relative; }
.nav a:not(.btn)::after{ content:""; position:absolute; left:0; right:0; bottom:-4px; height:2px; background:var(--orange); transform:scaleX(0); transform-origin:left; transition:transform var(--ix-t) var(--ix-ease); }
.nav a:not(.btn):hover::after, .nav a:not(.btn).active::after{ transform:scaleX(1); }
/* cards and tiles: slight lift + firmer border */
.au-card, .ttp-card, .id-ln, .plan-door, .hd-card, .dv-card, .pp-card, .fm-card, .plan-card, .c1-card, .sd-chip, .b-chip{ transition:transform var(--ix-t) var(--ix-ease), border-color var(--ix-t) var(--ix-ease), background-color var(--ix-t) var(--ix-ease); }
/* lift only what is clickable: expandable cards, and cards that contain a link */
.au-card:hover, .plan-door:has(a):hover, .hd-card:has(a):hover, .dv-card:has(a):hover, .pp-card:has(a):hover, .fm-card:has(a):hover, .plan-card:has(a):hover, .c1-card:has(a):hover{ transform:translateY(-3px); border-color:rgba(0,61,62,.3); }
/* image cards: gentle zoom on the picture only */
.au-media.is-img img{ transition:transform .35s var(--ix-ease); }
.au-card:hover .au-media.is-img img{ transform:scale(1.03); }
.au-expand{ transition:background-color var(--ix-t) var(--ix-ease), color var(--ix-t) var(--ix-ease); }
.au-card:hover .au-expand{ background:var(--orange); border-color:var(--orange); }
/* matrix rows and group headers */
.mx-row{ transition:background-color var(--ix-t) var(--ix-ease); }
.mx-row:hover{ background:rgba(248,163,44,.08); }
.mx-grp{ transition:background-color var(--ix-t) var(--ix-ease); }
.mx-grp:hover{ background:#fbe9cf; }
.mx-grp .chev{ transition:transform var(--ix-t) var(--ix-ease); }
.mx-grp:hover .chev{ transform:translateY(1px); }
/* tabs / toggles */

.au-toggle button:not(.on):hover{ background:rgba(0,61,62,.06); }
/* focus ring, consistent */
a:focus-visible, button:focus-visible{ outline:3px solid var(--orange); outline-offset:3px; border-radius:6px; }
@media (hover:none){ .btn:hover, .au-card:hover, .plan-door:hover, .hd-card:hover, .dv-card:hover, .pp-card:hover, .fm-card:hover, .plan-card:hover, .c1-card:hover{ transform:none; } }
@media (prefers-reduced-motion:reduce){ a,button,.au-card,.ttp-card,.id-ln,.plan-door,.hd-card,.dv-card,.pp-card,.fm-card,.plan-card,.c1-card,.au-media.is-img img,.mx-row,.mx-grp,.mx-grp .chev,.nav a::after{ transition:none!important; } .btn:hover,.au-card:hover,.ttp-card:hover,.plan-door:hover,.hd-card:hover,.dv-card:hover,.pp-card:hover,.fm-card:hover,.plan-card:hover,.c1-card:hover{ transform:none; } .au-card:hover .au-media.is-img img{ transform:none; } }

/* v93.30 · library + tools · open stages */
.lf2-head{background:var(--cream);padding:clamp(64px,8vw,104px) 0 clamp(36px,4.5vw,56px);text-align:center}
.lf2-head h2{font-size:clamp(30px,3.8vw,48px);font-weight:900;letter-spacing:-.025em;line-height:1.07;margin-top:14px;color:var(--teal-dark)}
.lf2-head h2 .pop{color:var(--orange)}
.lf2-lead{font-size:15.5px;font-weight:500;color:rgba(0,61,62,.62);line-height:1.6;max-width:640px;margin:14px auto 0}
.lf2-aud{padding:clamp(52px,6.5vw,84px) 0}
.lf2-aud.students{background:var(--cream-warm)}
.lf2-aud.teachers{background:var(--cream)}
.lf2-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(34px,5vw,80px);align-items:center}
.lf2-aud.teachers .lf2-grid{grid-template-columns:1.05fr 1fr}
.lf2-aud h3{font-size:clamp(24px,2.6vw,34px);font-weight:900;letter-spacing:-.02em;color:var(--teal-dark);line-height:1.1}
.lf2-aud h3 em{font-style:normal;color:var(--teal)}
.lf2-aud.teachers h3 em{color:var(--orange-deep)}
.lf2-kick{font-size:11.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;margin-bottom:12px;display:block}
.lf2-aud.students .lf2-kick{color:var(--teal)}
.lf2-aud.teachers .lf2-kick{color:var(--orange-deep)}
.lf2-list{margin-top:22px;border-top:1px solid rgba(0,61,62,.14)}
.lf2-li{display:flex;justify-content:space-between;gap:18px;align-items:baseline;padding:13px 0;border-bottom:1px solid rgba(0,61,62,.14)}
.lf2-li b{font-size:15.5px;font-weight:700;color:var(--teal-dark)}
.lf2-li span{font-size:12.5px;font-weight:500;color:rgba(0,61,62,.62);text-align:right}
.lf2-svis{position:relative;height:clamp(360px,34vw,480px)}
.lf2-svis .phone{position:absolute;left:50%;transform:translateX(-58%);bottom:0;width:clamp(200px,17vw,250px);background:#fff;border:1px solid rgba(0,61,62,.14);border-radius:30px;padding:8px;box-shadow:0 8px 0 rgba(0,61,62,.16);z-index:2}
.lf2-svis .phone .scr{border-radius:22px;overflow:hidden}
.lf2-svis .phone img{display:block;width:100%}
.lf2-svis .books{position:absolute;left:2%;bottom:0;display:flex;align-items:flex-end;z-index:1}
.lf2-svis .books img{height:clamp(120px,11vw,160px);width:auto;border-radius:5px;box-shadow:0 5px 0 rgba(0,61,62,.15)}
.lf2-svis .books img:nth-child(1){transform:rotate(-6deg) translateX(8px)}
.lf2-svis .books img:nth-child(2){transform:rotate(3deg);z-index:1}
.lf2-svis .kid{position:absolute;right:0;bottom:0;height:clamp(200px,19vw,270px);z-index:3}
.lf2-tvis{position:relative;height:clamp(360px,34vw,480px)}
.lf2-tvis img{position:absolute;border-radius:10px;box-shadow:0 7px 0 rgba(0,61,62,.15);border:1px solid rgba(0,61,62,.08)}
.lf2-tvis img:nth-child(1){left:0;bottom:6%;width:52%;transform:rotate(-5deg);z-index:1}
.lf2-tvis img:nth-child(2){left:26%;bottom:0;width:56%;height:auto;max-height:100%;object-fit:cover;object-position:top;transform:rotate(2deg);z-index:3}
.lf2-tvis img:nth-child(3){right:0;bottom:10%;width:48%;height:auto;max-height:88%;object-fit:cover;object-position:top;transform:rotate(7deg);z-index:2}
.lf2-floor{background:#062f2e;padding:20px 0}
/* v93.68 — content examples. Card component ported verbatim from publications .au-card. */
.exrow-h{display:block;font-size:12px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:var(--orange-deep);margin-top:clamp(38px,4.4vw,56px)}
.lf2-aud.students .exrow-h{color:var(--teal)}
.exrow{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:18px}
.exrow .au-card{flex:0 1 calc(20% - 11.2px)}
.exrow .au-card{background:#fff;border:1px solid rgba(0,61,62,.12);border-radius:18px;overflow:hidden;display:flex;flex-direction:column}
.exrow .au-media{height:clamp(150px,12vw,180px);position:relative;background:var(--teal-dark)}
.exrow .au-media iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.exrow .au-media.is-img{background:#fff;border-bottom:1px solid rgba(0,61,62,.1);cursor:zoom-in}
.exrow .au-media.is-img img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.exrow .au-tx{padding:14px 15px 16px}
.exrow .au-tx b{display:block;font-size:14.5px;font-weight:900;color:var(--teal-dark)}
.exrow .au-tx p{font-size:12.5px;font-weight:600;color:var(--ink-soft);line-height:1.5;margin-top:5px}
.au-expand{position:absolute;right:10px;bottom:10px;font:600 11px/1 Poppins;letter-spacing:.06em;text-transform:uppercase;color:#003d3e;background:#fff;border:1px solid rgba(0,61,62,.18);border-radius:999px;padding:7px 11px;cursor:pointer}
/* v93.74 — backdrop raised from .82 and blurred: a Vimeo card behind read as a hard dark rectangle through the scrim. */
.au-lb{position:fixed;inset:0;background:rgba(0,36,37,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:none;align-items:center;justify-content:center;z-index:1000;padding:24px}
.au-lb.on{display:flex}
.au-lb img{max-width:min(1100px,96vw);max-height:92vh;width:auto;height:auto;border-radius:12px;background:#fff}
.au-lb-x{position:absolute;top:18px;right:18px;width:42px;height:42px;border-radius:50%;background:#fff;border:0;font:700 18px/42px Poppins;color:#003d3e;cursor:pointer}
/* v93.73 — document pager. Only shown when data-full carries >1 page. */
.au-lb-stage{position:relative;display:inline-flex;max-width:100%}
.au-lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:#fff;border:0;font:700 21px/44px Poppins;color:#003d3e;cursor:pointer;display:none;padding:0}
.au-lb.multi .au-lb-nav{display:block}
.au-lb-nav.prev{left:-62px}.au-lb-nav.next{right:-62px}
.au-lb-nav[disabled]{opacity:.3;cursor:default}
.au-lb-count{position:absolute;bottom:-46px;left:50%;transform:translateX(-50%);background:#fff;border-radius:999px;padding:8px 15px;font:700 12px/1 Poppins;letter-spacing:.1em;color:#003d3e;display:none;white-space:nowrap}
.au-lb.multi .au-lb-count{display:block}
.au-lb.multi img{max-width:min(1000px,74vw);max-height:80vh}
@media(max-width:820px){.au-lb.multi img{max-width:min(1000px,86vw);max-height:76vh}.au-lb-nav{top:auto;bottom:-56px;transform:none;width:40px;height:40px;font:700 19px/40px Poppins}.au-lb-nav.prev{left:calc(50% - 78px)}.au-lb-nav.next{right:calc(50% - 78px)}.au-lb-count{bottom:-51px}}
@media(max-width:1200px){.exrow .au-card{flex-basis:calc(33.333% - 9.34px)}}
@media(max-width:900px){.exrow .au-card{flex-basis:calc(50% - 7px)}}
@media(max-width:560px){.exrow .au-card{flex-basis:100%}.exrow .au-media{height:210px}}
.lf2-floor p{text-align:center;font-size:clamp(14px,1.4vw,16.5px);font-weight:700;color:var(--peach)}
.lf2-floor p em{font-style:normal;color:#fff}
.lf2-tools{background:var(--cream-warm);padding:clamp(56px,7vw,92px) 0 clamp(64px,8vw,100px)}
.lf2-thead{text-align:center;max-width:680px;margin:0 auto clamp(40px,5vw,64px)}
.lf2-thead h2{font-size:clamp(30px,3.8vw,48px);font-weight:900;letter-spacing:-.025em;line-height:1.07;margin-top:14px;color:var(--teal-dark)}
.lf2-thead h2 .pop{color:var(--orange)}
.lf2-trow{display:grid;grid-template-columns:0.85fr 1.35fr;gap:clamp(30px,4.5vw,70px);align-items:center}
.lf2-trow+.lf2-trow{margin-top:clamp(52px,6.5vw,84px)}
.lf2-trow.flip{grid-template-columns:1.35fr 0.85fr}
.lf2-trow.flip .t-copy{order:2}
.lf2-trow .no{font-size:13px;font-weight:800;color:var(--orange-deep);letter-spacing:.14em;text-transform:uppercase;display:block;margin-bottom:10px}
.lf2-trow h3{font-size:clamp(24px,2.7vw,36px);font-weight:900;letter-spacing:-.02em;color:var(--teal-dark);line-height:1.08}
.lf2-trow p{font-size:15px;font-weight:500;color:rgba(0,61,62,.62);line-height:1.65;margin-top:12px;max-width:420px}
.lf2-trow .bw{box-shadow:0 8px 0 rgba(0,61,62,.12)}
@media (max-width:900px){
  .lf2-grid,.lf2-aud.teachers .lf2-grid{grid-template-columns:1fr}
  .lf2-tvis{height:clamp(300px,62vw,480px)}
  .lf2-svis{height:auto;margin-top:26px}
  .lf2-svis .phone{position:relative;left:50%;bottom:auto;display:block}
  .lf2-svis .kid{height:190px}
  .lf2-trow,.lf2-trow.flip{grid-template-columns:1fr}
  .lf2-trow.flip .t-copy{order:0}
}

/* v93.30 · console simplified: definition + one picture */
.cx2-top{text-align:center;max-width:760px;margin:0 auto clamp(30px,3.5vw,46px)}
.cx2-top .cx-lead{margin-left:auto;margin-right:auto;max-width:640px}
.cx2-screen{max-width:940px;margin:0 auto}
.cx2-screen .cx-bw{box-shadow:0 10px 0 rgba(0,0,0,.35)}

/* v93.30 · matrix header surface marks */
.mx-surf{display:inline-flex;align-items:center;gap:5px;font-size:9px;font-weight:600;letter-spacing:.04em;color:rgba(255,255,255,.62);margin-top:3px}
.mx-surf svg{width:13px;height:13px;stroke:rgba(255,255,255,.62);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mx-surf svg+svg{margin-left:6px}
@media (max-width:640px){.mx-surf{display:none}}

/* v93.30 · matrix: owners column out, owners band in (M-2 / P-2) */
.mxs .mx-hdr{grid-template-columns:2fr 1fr 1fr}
.mxs .mx-row{grid-template-columns:2fr 1fr 1fr}
.mx-own{max-width:980px;margin:16px auto 0;background:#fff;border:1px solid rgba(0,61,62,.14);border-radius:18px;overflow:hidden}
.mo-top{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;background:var(--teal-dark);padding:13px 18px}
.mo-top b{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#fff;display:inline-flex;align-items:center;gap:9px}
.mo-top b i{width:22px;height:5px;border-radius:3px;background:var(--teal-light)}
.mo-surf{display:inline-flex;align-items:center;gap:5px;font-size:9.5px;font-weight:600;color:rgba(255,255,255,.62)}
.mo-surf svg{width:13px;height:13px;fill:none;stroke:rgba(255,255,255,.62);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mx-own ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:2px 28px;padding:6px 18px 12px}
.mx-own li{display:flex;gap:9px;align-items:baseline;font-size:13px;font-weight:600;color:var(--teal-dark);padding:7px 0;border-top:1px solid rgba(0,61,62,.14)}
.mx-own li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--teal-light);flex:none;transform:translateY(1px)}
@media(max-width:700px){.mx-own ul{grid-template-columns:1fr}}


.hx1-kick{display:block;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin-bottom:14px;}
.hx1-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(28px,4vw,64px);align-items:center;padding-top:clamp(30px,4vw,60px);padding-bottom:clamp(40px,5vw,80px);}
.hx1-copy{text-align:left;}
.hero-b.hx1 h1{font-size:clamp(42px,4.6vw,68px);}
.hx1-sub{font-size:clamp(15px,1.5vw,17.5px);font-weight:500;color:var(--ink-soft);line-height:1.65;margin:18px 0 30px;max-width:480px;}
.hero-b.hx1 .hb-ctas{justify-content:flex-start;margin-bottom:26px;}

/* v93.71 — hero figure row: figure large, qualifier small */
.hx1-figs{display:flex;gap:14px;flex-wrap:wrap;align-items:baseline;}
.hx1-figs span{display:flex;align-items:baseline;gap:5px;}
.hx1-figs b{font-size:18.5px;font-weight:900;color:var(--teal-dark);letter-spacing:-.02em;white-space:nowrap;}
.hx1-figs em{font-style:normal;font-size:11.5px;font-weight:700;color:var(--ink-soft);white-space:nowrap;}
@media (max-width:1024px){.hx1-figs{justify-content:center;}}
@media (max-width:560px){.hx1-figs{gap:10px;}.hx1-figs b{font-size:17px;}.hx1-figs em{font-size:11px;}}
.hx1-stage{position:relative;}
.hx1-main{margin:0;}
.hx1-card{position:absolute;background:#fff;border:1px solid rgba(0,61,62,.12);border-radius:16px;padding:14px 18px;box-shadow:0 5px 0 rgba(0,61,62,.14);}
.hx1-card b{display:block;font-size:14px;font-weight:800;color:var(--teal-dark);}
.hx1-card span{font-size:12.5px;font-weight:600;color:var(--ink-soft);}
.hx1-c1{top:-18px;right:-14px;}
.hx1-c2{bottom:-20px;left:-16px;}
@media (max-width:1024px){
.hx1-grid{grid-template-columns:1fr;gap:34px;}
.hx1-copy{text-align:center;}
.hx1-sub{margin:18px auto 28px;}
.hero-b.hx1 .hb-ctas{justify-content:center;}
.hx1-c1{top:-14px;right:6px;}
.hx1-c2{bottom:-16px;left:6px;}
}
@media (max-width:640px){
.hx1-card{padding:10px 14px;border-radius:13px;}
.hx1-card b{font-size:12.5px;}
.hx1-card span{font-size:11px;}
.hx1-c1{top:-12px;right:0;}
.hx1-c2{bottom:-14px;left:0;}
}

/* v93.46g — sitewide law: buttons center at mobile */
@media (max-width: 700px){
.btn{ display:flex; align-items:center; justify-content:center; width:max-content; max-width:100%; margin-left:auto; margin-right:auto; }
.hb-ctas .btn, .hero-cta .btn{ margin-left:0; margin-right:0; }
.md-cta{ display:flex; flex-direction:column; gap:12px; }
.md-cta .btn{ width:100%; }
}
/* v93.46h — LMS hero stat strip: even 2x2 at mobile */

/* v93.46i — students visual stacks above the list at mobile */
@media (max-width: 900px){
.lf2-aud.students .lf2-svis{ order:-1; margin-top:0; margin-bottom:26px; }
}/* v93.57 — hero peek: zoomed detail (direction D) */