/* ============================================================
   Leap Learning — Brand Design Book 2026
   Sky Blue #7acdec · Sunny Orange #fbb835 · White · Ink #273238
   Nunito: 900 headlines · 800 subheads/buttons · 700 emphasis · 600 body
   Direction: minimal, professional, photography-led.
   Orange = action only. Sky = accent only. White carries the page.
   ============================================================ */
:root{
  --sky:#7acdec;
  --sky-tint:#f2fafd;
  --orange:#fbb835;
  --orange-deep:#eda51e;
  --sky-deep:#5cc2e7;
  --white:#ffffff;
  --ink:#273238;
  --ink-70:#4d5a62;
  --ink-40:#8b969c;
  --line:#e6edf0;
  --maxw:1340px;
  --r:14px;
  --shadow:0 8px 28px rgba(39,50,56,.08);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Nunito',system-ui,sans-serif;font-weight:600;
  color:var(--ink);background:var(--white);line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px}
h1,h2{font-weight:900;line-height:1.15;letter-spacing:-.015em}
h3{font-weight:800;line-height:1.3}
.eyebrow{
  font-weight:800;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-70);display:flex;align-items:center;gap:10px;margin-bottom:14px;
}
.eyebrow::before{content:"";width:26px;height:3px;background:var(--sky);border-radius:2px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  font-family:inherit;font-weight:800;font-size:.98rem;
  padding:.85em 1.7em;border-radius:999px;border:0;cursor:pointer;
  transition:background .15s,color .15s,border-color .15s,box-shadow .15s;
}
:focus-visible{outline:3px solid var(--sky);outline-offset:2px;border-radius:6px}
.btn-primary{background:var(--sky);color:var(--ink)}
.btn-primary:hover{background:var(--sky-deep)}
.btn-outline{background:transparent;color:var(--ink);border:2px solid var(--ink)}
.btn-outline:hover{background:var(--orange);border-color:var(--orange);color:var(--ink)}

/* ---------------- Main header (floating, rounded) ---------------- */
header.main{
  position:sticky;top:14px;z-index:100;background:transparent;
  padding:0 20px;
}
.nav{
  display:flex;align-items:center;height:72px;gap:28px;
  max-width:var(--maxw);margin:0 auto;background:var(--white);
  border:1px solid var(--line);border-radius:999px;
  box-shadow:0 6px 24px rgba(39,50,56,.09);
  padding:0 12px 0 26px;
}
.brand-lockup{height:42px;width:auto}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;font-size:1.08rem;letter-spacing:.03em}
.brand svg{width:38px;height:38px;flex:none}
nav.menu{display:flex;align-items:center;gap:6px;margin-left:auto}
nav.menu > .item > a,
nav.menu > .item > button{
  font-family:inherit;font-weight:800;font-size:.95rem;color:var(--ink);
  background:none;border:0;cursor:pointer;padding:10px 14px;border-radius:8px;
  display:flex;align-items:center;gap:6px;transition:background .15s,color .15s;
}
nav.menu > .item > a:hover,
nav.menu > .item > button:hover{background:var(--sky-tint)}
.item{position:relative}
.item .chev{width:10px;height:10px;transition:transform .2s}
.item .chev path{stroke:var(--ink);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.dropdown{
  position:absolute;top:calc(100% + 10px);left:0;min-width:240px;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--shadow);padding:8px;
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .18s,transform .18s,visibility .18s;
}
.item:hover > .dropdown,
.item:focus-within > .dropdown,
.item.open > .dropdown{opacity:1;visibility:visible;transform:none}
.item:hover .chev,
.item.open .chev{transform:rotate(180deg)}
.dropdown a{
  display:block;padding:10px 14px;border-radius:9px;font-weight:700;font-size:.93rem;
  color:var(--ink-70);transition:background .12s,color .12s;
}
.dropdown a:hover{background:var(--sky-tint);color:var(--ink)}
.dropdown .soon-item{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:10px 14px;border-radius:9px;font-weight:700;font-size:.93rem;
  color:var(--ink-40);cursor:default;
}
.dropdown .soon-tag{
  font-size:.66rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-40);background:var(--sky-tint);padding:3px 9px;border-radius:999px;flex:none;
}
.dropdown .flag{
  display:inline-block;margin-left:8px;font-size:.68rem;font-weight:800;
  letter-spacing:.06em;text-transform:uppercase;color:var(--ink);
  background:var(--orange);padding:2px 8px;border-radius:999px;
}
.nav > .btn{margin-left:6px;padding:.7em 1.4em;font-size:.92rem}
.lang-item .globe{width:17px;height:17px;fill:none;stroke:var(--ink);stroke-width:1.8;stroke-linecap:round}
.lang-menu{min-width:200px;right:0;left:auto}
.lang-menu .active{display:flex;justify-content:space-between;align-items:center;color:var(--ink)}
.lang-menu .tick{color:var(--sky);font-weight:900}
.lang-menu .soon{display:block;padding:10px 14px;font-size:.82rem;font-weight:700;color:var(--ink-40)}
.menu-toggle{display:none;margin-left:auto;background:none;border:0;cursor:pointer;padding:8px}
.menu-toggle svg{width:26px;height:26px;stroke:var(--ink);stroke-width:2.4;stroke-linecap:round}

/* ---------------- Hero (full-screen photo) ---------------- */
.hero{
  position:relative;margin-top:-86px;min-height:100svh;
  display:flex;align-items:center;overflow:hidden;
}
.hero .bg{
  position:absolute;inset:0;background-size:cover;
  background-position:62% center;background-repeat:no-repeat;
}
.hero .wrap{position:relative;width:100%;padding-top:120px;padding-bottom:72px}
.hero-copy{max-width:520px}
.hero-copy .lead{text-shadow:0 1px 3px rgba(255,255,255,.55)}
.hero-copy .btn{text-shadow:none}
.hero h1{font-size:clamp(1.9rem,3.6vw,2.9rem);color:var(--white);text-shadow:0 2px 16px rgba(39,50,56,.45),0 1px 3px rgba(39,50,56,.35)}
.hero h1 .underline{position:relative;white-space:nowrap}
.hero h1 .underline::after{
  content:"";position:absolute;left:0;right:0;bottom:.04em;height:.28em;
  background:var(--sky);z-index:-1;border-radius:3px;opacity:.55;
}
.hero p.lead{margin:18px 0 28px;font-size:1.02rem;color:var(--ink);max-width:27em}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap}

/* ---------------- Sections ---------------- */
section{padding:96px 0}
.section-head{max-width:620px;margin-bottom:56px}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center}
.section-head.center .eyebrow{justify-content:center}
.section-head h2{font-size:clamp(1.8rem,3.6vw,2.5rem)}
.section-head p{margin-top:14px;color:var(--ink-70);font-size:1.05rem}



/* ---------------- Our reach ---------------- */
.reach{background:linear-gradient(180deg,var(--white) 0%,var(--sky-tint) 40%,var(--white) 100%);overflow:hidden}
.reach-head{margin-bottom:22px}
.reach-head h2{font-size:clamp(1.8rem,3.6vw,2.5rem);max-width:12em}
.reach-head h2 .hl{color:var(--sky)}
.stat-chips{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:44px}
.chip{
  display:flex;align-items:center;gap:12px;background:var(--white);
  border:1px solid var(--line);border-radius:999px;padding:10px 22px 10px 12px;
  box-shadow:0 6px 20px rgba(39,50,56,.06);
}
.chip .ci{
  width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;
}
.chip .ci svg{width:20px;height:20px;fill:none;stroke:var(--white);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.chip .cn{font-weight:900;font-size:1.25rem;line-height:1.1}
.chip .cl{font-weight:700;font-size:.8rem;color:var(--ink-40)}
.reach-filter{display:flex;justify-content:flex-start;margin:0 0 26px}
.filter-pill{
  display:inline-flex;align-items:center;gap:10px;background:var(--white);
  border:1px solid var(--line);border-radius:999px;padding:8px 10px 8px 18px;
  box-shadow:0 6px 20px rgba(39,50,56,.06);
}
.filter-pill > svg{width:17px;height:17px;fill:none;stroke:var(--ink-40);stroke-width:1.8;stroke-linecap:round}
.filter-pill label{font-weight:800;font-size:.85rem;color:var(--ink-40)}
.filter-pill select{
  font-family:inherit;font-weight:800;font-size:.95rem;color:var(--ink);
  border:0;background:var(--sky-tint);border-radius:999px;padding:.5em 1em;cursor:pointer;outline-offset:2px;
}
.chip .cn,.chip .cl{transition:opacity .18s}
.chips-fade .cn,.chips-fade .cl{opacity:0}
.mapwrap{position:relative;max-width:1100px;margin:0 auto}
.dotmap{width:100%;height:auto}
.pin{
  transition:opacity .35s ease,transform .35s ease,border-color .35s ease;
  position:absolute;transform:translate(-50%,-100%);
  width:70px;height:70px;border-radius:50%;border:4px solid var(--orange);
  overflow:hidden;background:var(--white);box-shadow:0 8px 22px rgba(39,50,56,.18);
}
.pin::after{
  content:"";position:absolute;left:50%;bottom:-13px;transform:translateX(-50%);
  border:7px solid transparent;border-top-color:var(--orange);
}
.pin img{width:100%;height:100%;object-fit:cover}
.pin .ph-ic{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--sky-tint)}
.pin .ph-ic svg{width:22px;height:22px;stroke:var(--ink-40);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.pin.lg{width:86px;height:86px}
.pin.sm{width:56px;height:56px;border-width:3px}
.pin-dim{opacity:.14}
.pin-active{transform:translate(-50%,-100%) scale(1.18);z-index:2;border-color:var(--sky)}

/* ---------------- Testimonials marquee ---------------- */
.testi{padding-top:56px}
.marquee{overflow:hidden;position:relative;padding:16px 0 26px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}
.track{display:flex;gap:26px;width:max-content;animation:slide 55s linear infinite}
.marquee:hover .track{animation-play-state:paused}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  .marquee{overflow-x:auto;-webkit-mask-image:none;mask-image:none}
  .track{animation:none}
}
.quote{
  width:320px;flex:none;border-radius:20px;padding:26px 26px 22px;
  box-shadow:0 10px 26px rgba(39,50,56,.07);border:1px solid rgba(39,50,56,.05);
}
.quote:nth-child(4n+1){background:var(--sky-tint);transform:rotate(-1.2deg)}
.quote:nth-child(4n+2){background:#fef3da;transform:rotate(1deg)}
.quote:nth-child(4n+3){background:var(--white);transform:rotate(-.6deg)}
.quote:nth-child(4n){background:#eaf7fc;transform:rotate(1.3deg)}
.quote .qm{font-size:2.4rem;font-weight:900;line-height:.6;color:var(--sky);opacity:.55;display:block;margin-bottom:12px}
.quote p{font-size:.93rem;font-weight:700;color:var(--ink);line-height:1.55}
.quote .who{margin-top:16px;padding-top:14px;border-top:1px solid rgba(39,50,56,.1)}
.quote .who b{display:block;font-weight:800;font-size:.9rem}
.quote .who span{font-size:.78rem;font-weight:700;color:var(--ink-40)}

/* Intro: physical + digital */
.intro .wrap{display:grid;grid-template-columns:1.02fr .98fr;gap:56px;align-items:center}
.intro p{color:var(--ink-70);font-size:1.05rem;margin-top:14px;max-width:30em}
.intro p + p{margin-top:12px}
.video-frame{
  position:relative;border-radius:20px;overflow:hidden;
  border:1px solid var(--line);box-shadow:var(--shadow);background:var(--ink);
}
.video-frame::before{content:"";display:block;padding-top:56.25%}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-poster{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;cursor:pointer;background:var(--ink)}
.video-poster img{width:100%;height:100%;object-fit:cover;opacity:.92;transition:opacity .2s,transform .3s}
.video-poster:hover img{opacity:1;transform:scale(1.02)}
.play-btn{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:76px;height:76px;border-radius:50%;background:var(--sky);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 30px rgba(39,50,56,.35);
  transition:background .15s,transform .2s;
}
.video-poster:hover .play-btn{background:var(--orange);transform:translate(-50%,-50%) scale(1.06)}
.play-btn svg{width:30px;height:30px;fill:var(--ink);margin-left:3px}

/* What we do */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.tile{
  border:1px solid var(--line);border-radius:20px;padding:34px 30px;
  transition:box-shadow .2s,transform .2s;background:var(--white);
}
.tile:hover{box-shadow:var(--shadow);transform:translateY(-4px)}
.tile .ic{
  width:52px;height:52px;border-radius:14px;background:var(--sky-tint);
  display:flex;align-items:center;justify-content:center;margin-bottom:22px;
}
.tile .ic svg{width:26px;height:26px;stroke:var(--ink);stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
.tile h3{font-size:1.15rem;margin-bottom:10px}
.tile p{color:var(--ink-70);font-size:.96rem}

/* Approach */
.approach{background:var(--sky-tint)}
.approach .wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center}
.steps{display:grid;gap:14px}
.step{
  display:flex;gap:20px;background:var(--white);border:1px solid var(--line);
  border-radius:16px;padding:22px 24px;align-items:flex-start;
}
.step .n{
  flex:none;width:38px;height:38px;border-radius:50%;background:var(--ink);color:var(--white);
  font-weight:900;font-size:1rem;display:flex;align-items:center;justify-content:center;
}
.step h3{font-size:1.05rem}
.step p{color:var(--ink-70);font-size:.93rem;margin-top:3px}

/* Solutions */
.sol-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.sol{
  border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--white);
  display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s;
}
.sol:hover{box-shadow:var(--shadow);transform:translateY(-4px)}
.sol .photo{border:0;border-radius:0;border-bottom:1px solid var(--line)}
.sol .photo::before{padding-top:56%}
.sol .body{padding:26px 28px 30px;display:flex;flex-direction:column;gap:10px;flex:1}
.sol .kicker{
  align-self:flex-start;font-size:.7rem;font-weight:800;letter-spacing:.1em;
  text-transform:uppercase;background:var(--orange);color:var(--ink);
  padding:3px 10px;border-radius:999px;
}
.sol h3{font-size:1.2rem}
.sol p{color:var(--ink-70);font-size:.95rem;flex:1}
.sol .more{font-weight:800;font-size:.9rem;display:inline-flex;align-items:center;gap:6px;color:var(--ink)}
.sol .more svg{width:14px;height:14px;stroke:var(--ink);stroke-width:2.4;fill:none;stroke-linecap:round;transition:transform .15s}
.sol:hover .more svg{transform:translateX(4px)}
.sol.wide{grid-column:span 1}

/* Impact */
.impact .wrap{
  border:1px solid var(--line);border-radius:24px;padding:64px 48px;
  display:grid;grid-template-columns:repeat(4,1fr);gap:32px;text-align:center;
  background:linear-gradient(180deg,var(--white),var(--sky-tint));
}
.impact .num{font-size:clamp(2rem,4vw,2.9rem);font-weight:900}
.impact .num em{font-style:normal;color:var(--sky)}
.impact .lbl{color:var(--ink-70);font-weight:700;font-size:.92rem;margin-top:4px}

/* Download CTA — white, matching other sections */
.cta{background:var(--white);color:var(--ink)}
.cta .wrap{display:grid;gap:40px;align-items:center}
.cta h2{font-size:clamp(2rem,4.2vw,3rem);line-height:1.12}
.cta p{margin:18px 0 34px;color:var(--ink-70);font-size:1.08rem;max-width:26em;font-weight:700}
.cta-buttons{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;max-width:640px}
.store{
  display:flex;align-items:center;gap:16px;background:var(--white);
  border:2px solid var(--line);border-radius:18px;padding:18px 24px;
  box-shadow:0 8px 22px rgba(39,50,56,.07);
  transition:transform .18s,box-shadow .18s,border-color .18s;
}
.store:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(39,50,56,.14);border-color:var(--sky)}
.store svg{width:30px;height:30px;fill:var(--ink);flex:none}
.store .b{font-size:1.08rem}
.store .s{font-size:.68rem;font-weight:700;color:var(--ink-40);letter-spacing:.04em}
.store .b{font-weight:800;font-size:1rem;line-height:1.15;color:var(--ink)}


/* ---------------- Leap believes (Curious-Learning-style card) ---------------- */
.believes-sec{
  background:linear-gradient(180deg,var(--white) 0%,var(--white) 46%,#0b0e10 46%,#0b0e10 100%);
  padding-bottom:110px;
}
.believes{
  background:var(--sky);border-radius:40px;padding:56px 56px 60px;
  border:12px solid var(--white);
  box-shadow:0 20px 50px rgba(39,50,56,.18);
}
.believes .pill{
  display:inline-block;background:var(--white);border-radius:999px;
  padding:16px 36px;font-weight:900;font-size:clamp(1.5rem,3vw,2.1rem);
  color:var(--ink);box-shadow:0 8px 22px rgba(39,50,56,.12);margin-bottom:44px;
}
.belief{padding:11px 0 11px 12px}
.belief p{font-size:clamp(1rem,1.9vw,1.2rem);font-weight:700;color:var(--ink)}
.belief p b{font-weight:900}

/* ---------------- Footer (black, minimal) ---------------- */
footer{background:#0b0e10;color:var(--white);padding:84px 0 36px}
.foot-top{display:flex;justify-content:space-between;align-items:flex-start;gap:56px;flex-wrap:wrap}
.foot-id{display:flex;align-items:center;gap:20px}
.foot-id img{width:76px;height:76px}
.foot-id .tag{font-weight:900;font-size:clamp(1.5rem,3vw,2.1rem);line-height:1.15;letter-spacing:-.01em}
.foot-news{max-width:400px;width:100%}
.foot-news h4{font-weight:800;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:14px}
.news-form{display:flex;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:5px;transition:border-color .2s}
.news-form:focus-within{border-color:var(--sky)}
.news-form input{
  flex:1;min-width:0;background:none;border:0;outline:none;color:var(--white);
  font-family:inherit;font-weight:700;font-size:.92rem;padding:0 18px;
}
.news-form input::placeholder{color:rgba(255,255,255,.35)}
.news-form button{
  font-family:inherit;font-weight:800;font-size:.9rem;color:var(--ink);
  background:var(--sky);border:0;border-radius:999px;padding:.75em 1.5em;cursor:pointer;
  transition:background .15s;flex:none;
}
.news-form button:hover{background:var(--orange)}
.foot-rule{height:1px;background:rgba(255,255,255,.12);margin:52px 0 30px}
.foot-mid{display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap}
.offices{display:flex;gap:36px;flex-wrap:wrap}
.office{display:flex;gap:10px;align-items:flex-start;font-weight:700;font-size:.9rem;color:rgba(255,255,255,.65)}
.office svg{width:16px;height:16px;flex:none;margin-top:3px;stroke:var(--sky);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.office b{display:block;color:var(--white);font-weight:800}
.foot-social{display:flex;gap:14px;align-items:center}
.foot-social a{
  width:54px;height:54px;border:2px solid rgba(255,255,255,.9);border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  transition:background .18s,border-color .18s,transform .18s,box-shadow .18s;
}
.foot-social a:hover,.foot-social a:focus-visible{
  background:var(--sky);border-color:var(--sky);transform:translateY(-4px) scale(1.06);
  box-shadow:0 10px 24px rgba(122,205,236,.35);
}
.foot-social a:hover svg{fill:var(--ink)}
.foot-social svg{width:22px;height:22px;fill:var(--white);transition:fill .18s}
.social-label{
  font-weight:800;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--white);margin-bottom:14px;text-align:right;
}
.foot-bottom{
  margin-top:30px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-size:.84rem;color:rgba(255,255,255,.4);font-weight:700;
}
.foot-bottom a{color:rgba(255,255,255,.55);transition:color .12s}
.foot-bottom a:hover{color:var(--white)}
@media (min-width:1600px){
  :root{--maxw:1440px}
}
/* ---------------- In-page screens ---------------- */
.page-hero{position:relative;background:var(--sky-tint);padding:150px 0 70px;border-bottom:1px solid var(--line);overflow:hidden}
.page-hero .ph-bg{position:absolute;inset:0;background-size:cover;background-position:center}
.page-hero .ph-bg::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,14,16,.04) 0%,rgba(11,14,16,.18) 40%,rgba(11,14,16,.70) 100%),
             linear-gradient(90deg,rgba(11,14,16,.35) 0%,rgba(11,14,16,0) 60%);
}
.page-hero.has-img h1,.page-hero.has-img p,.page-hero.has-img .eyebrow{text-shadow:0 1px 2px rgba(0,0,0,.35)}
/* per-page background focal point */
.page-hero.hero-leap-app .ph-bg{background-position:right center}
.page-hero.has-img{min-height:66svh;display:flex;align-items:flex-end;padding:170px 0 56px;border-bottom:0}
.page-hero .wrap{position:relative;z-index:1}
.page-hero .eyebrow,.page-hero h1,.page-hero p{text-align:left;margin-left:0;margin-right:auto}
.page-hero.has-img .eyebrow,.page-hero.has-img h1,.page-hero.has-img p{margin-left:0}
.page-hero h1{max-width:15em}
.page-hero p{max-width:32em}
.page-hero.has-img .wrap{position:relative;z-index:1;max-width:none;margin-left:0;padding-left:40px;padding-right:32px}
.page-hero.has-img h1{color:var(--white)}
.page-hero.has-img p{color:rgba(255,255,255,.88)}
.page-hero.has-img .eyebrow{color:var(--white)}
.page-hero.has-img .eyebrow::before{background:var(--orange)}
.page-hero h1{font-size:clamp(2rem,4vw,3rem)}
.page-body{padding:76px 0 104px;min-height:32vh}
.page-empty{
  border:2px dashed var(--line);border-radius:24px;padding:64px 40px;text-align:center;
  color:var(--ink-40);font-weight:700;
}
.page-empty b{display:block;color:var(--ink);font-weight:900;font-size:1.1rem;margin-bottom:8px}
nav.menu a.current{background:var(--sky-tint);color:var(--ink)}

.page-hero p{margin-top:14px;color:var(--ink-70);font-size:1.08rem;max-width:38em;font-weight:700}
.sec{margin-bottom:64px}
.sec h2{font-size:clamp(1.4rem,2.6vw,1.9rem);margin-bottom:8px}
.sec > p{color:var(--ink-70);font-size:1rem;max-width:46em}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:26px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:26px}
.box{border:1px solid var(--line);border-radius:20px;padding:28px 26px;background:var(--white)}
.box h3{font-size:1.08rem;margin-bottom:8px}
.box p{color:var(--ink-70);font-size:.95rem}
.box ul{display:grid;gap:9px;margin-top:12px}
.box li{display:flex;gap:10px;color:var(--ink-70);font-size:.95rem;font-weight:700}
.box li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--sky);flex:none;margin-top:8px}
.tint{background:var(--sky-tint);border-color:transparent}
.warm{background:#fef6e6;border-color:transparent}
.warm li::before{background:var(--orange)}
.kv{display:flex;gap:14px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--line)}
.kv:last-child{border-bottom:0}
.kv b{flex:none;width:190px;font-weight:900;font-size:.95rem}
.kv span{color:var(--ink-70);font-size:.96rem;font-weight:700}
.note{border-left:4px solid var(--orange);background:#fef6e6;border-radius:0 14px 14px 0;padding:20px 24px;color:var(--ink-70);font-weight:700;font-size:.96rem}
.page-empty{border:2px dashed var(--line);border-radius:24px;padding:64px 40px;text-align:center;color:var(--ink-40);font-weight:700}
.page-empty b{display:block;color:var(--ink);font-weight:900;font-size:1.1rem;margin-bottom:8px}
.page-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px}
.cmp{margin-top:26px;overflow-x:auto;border:1px solid var(--line);border-radius:20px}
.cmp table{border-collapse:collapse;width:100%;min-width:720px}
.cmp th,.cmp td{text-align:left;padding:16px 18px;border-bottom:1px solid var(--line);font-size:.93rem;color:var(--ink-70);vertical-align:top}
.cmp thead th{background:var(--sky-tint);color:var(--ink);font-weight:900;font-size:.95rem}
.cmp tbody tr:last-child td{border-bottom:0}
.cmp td b{color:var(--ink)}


/* ================= Leap Lab — graphical page ================= */
.lab-band{
  background:linear-gradient(135deg,var(--sky-tint) 0%,#fdf3e0 100%);
  border-radius:26px;padding:34px;margin-bottom:64px;
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
}
.lab-stat{background:var(--white);border-radius:18px;padding:22px 20px;box-shadow:0 6px 18px rgba(39,50,56,.06)}
.lab-stat .n{font-size:clamp(1.7rem,3.2vw,2.4rem);font-weight:900;line-height:1}
.lab-stat .l{font-weight:700;color:var(--ink-70);font-size:.88rem;margin-top:6px}
.lab-stat.b .n{color:var(--sky)} .lab-stat.o .n{color:var(--orange)}

.split-media{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center}
.ph-img{
  position:relative;border:2px dashed var(--line);border-radius:22px;background:var(--sky-tint);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  color:var(--ink-40);font-weight:700;font-size:.85rem;text-align:center;padding:24px;min-height:260px;
}
.ph-img svg{width:34px;height:34px;stroke:var(--ink-40);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.ph-img.tall{min-height:340px}
.ph-img.wide{min-height:200px}

/* station map */
.stationmap{background:var(--white);border:1px solid var(--line);border-radius:24px;padding:34px 30px;margin-top:26px}
.smrow{margin-bottom:26px}
.smrow:last-child{margin-bottom:0}
.smrow h4{font-weight:900;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-40);margin-bottom:14px}
.dots{display:flex;gap:12px;flex-wrap:wrap}
.dot-st{
  width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;
  font-weight:900;color:var(--white);font-size:1.05rem;box-shadow:0 6px 14px rgba(39,50,56,.14);
}
.dot-st.logic{width:auto;padding:0 22px;background:var(--ink)}

/* numbered flow */
.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:26px}
.fstep{background:var(--white);border:1px solid var(--line);border-radius:20px;padding:26px 22px;position:relative}
.fstep .fn{
  width:38px;height:38px;border-radius:50%;background:var(--sky);color:var(--ink);
  display:flex;align-items:center;justify-content:center;font-weight:900;margin-bottom:16px;
}
.fstep:nth-child(even) .fn{background:var(--orange)}
.fstep p{color:var(--ink-70);font-size:.93rem;font-weight:700}

/* room option cards with floor plans */
.rooms{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:26px}
.room{border:1px solid var(--line);border-radius:22px;overflow:hidden;background:var(--white);transition:box-shadow .2s,transform .2s}
.room:hover{box-shadow:var(--shadow);transform:translateY(-4px)}
.room .plan{background:var(--sky-tint);padding:22px;display:flex;justify-content:center}
.room .plan svg{width:100%;max-width:210px;height:auto}
.room .rb{padding:22px 24px 26px}
.room h3{font-size:1.02rem;margin-bottom:6px}
.room p{color:var(--ink-70);font-size:.92rem}

/* tablet scale */
.tabscale{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:16px}
.tabscale i{
  width:26px;height:34px;border-radius:5px;border:2px solid var(--sky);background:var(--sky-tint);display:block;
}
.tabscale i.off{border-color:var(--line);background:var(--white)}
.tabscale span{font-weight:800;font-size:.85rem;color:var(--ink-70);margin-left:8px}

/* who does what */
.who{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:26px}
.who-card{border-radius:22px;padding:30px 28px}
.who-card.a{background:var(--sky);color:var(--ink)}
.who-card.b{background:var(--orange);color:var(--ink)}
.who-card h3{font-size:1.1rem;margin-bottom:12px}
.who-card p{font-weight:700;font-size:.95rem}
.who-card .tick{display:flex;gap:10px;margin-top:12px;font-weight:700;font-size:.93rem;align-items:flex-start}
.who-card .tick svg{width:18px;height:18px;flex:none;margin-top:3px;stroke:var(--ink);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round}

/* pricing cards */
.price{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:26px}
.pcard{border:1px solid var(--line);border-radius:22px;padding:30px 26px;background:var(--white)}
.pcard .pi{width:46px;height:46px;border-radius:14px;background:var(--sky-tint);display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.pcard .pi svg{width:22px;height:22px;stroke:var(--ink);stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
.pcard h3{font-size:1.02rem;margin-bottom:8px}
.pcard p{color:var(--ink-70);font-size:.93rem}

/* gallery strip */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:26px}

@media (max-width:1000px){
  .lab-band{grid-template-columns:1fr 1fr}
  .split-media,.who,.price,.rooms,.gallery{grid-template-columns:1fr}
  .flow{grid-template-columns:1fr 1fr}
}
@media (max-width:720px){
  .lab-band{grid-template-columns:1fr 1fr;padding:20px}
  .flow{grid-template-columns:1fr}
  
  
  
}


/* ---- How it works: journey ---- */














/* ---- Room options v2 ---- */
.rooms{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:26px}
.room{border:1px solid var(--line);border-radius:24px;overflow:hidden;background:var(--white);display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s,border-color .2s}
.room:hover{box-shadow:var(--shadow);transform:translateY(-4px);border-color:var(--sky)}
.room .rtag{
  font-weight:800;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;
  padding:12px 22px;background:var(--sky-tint);color:var(--ink-70);border-bottom:1px solid var(--line);
}
.room .plan{padding:24px 22px;display:flex;justify-content:center;background:var(--white)}
.room .plan svg{width:100%;max-width:230px;height:auto}
.room .rb{padding:0 24px 26px;flex:1}
.room h3{font-size:1.05rem;margin-bottom:6px}
.room p{color:var(--ink-70);font-size:.93rem}
.legend{display:flex;gap:20px;flex-wrap:wrap;margin-top:22px;justify-content:center}
.legend span{display:flex;align-items:center;gap:8px;font-weight:800;font-size:.82rem;color:var(--ink-70)}
.legend i{width:14px;height:14px;border-radius:4px;display:block}


/* ================= Buy a licence ================= */
.lic-wrap{display:grid;grid-template-columns:1.25fr .75fr;gap:32px;margin-top:28px;align-items:start}
.lic-panel{border:1px solid var(--line);border-radius:24px;background:var(--white);padding:32px 30px}
.lic-step{margin-bottom:30px}
.lic-step:last-child{margin-bottom:0}
.lic-step .sh{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.lic-step .sn{
  width:28px;height:28px;border-radius:50%;background:var(--ink);color:var(--white);
  font-weight:900;font-size:.8rem;display:flex;align-items:center;justify-content:center;flex:none;
}
.lic-step h3{font-size:1.02rem}
.lic-select{
  width:100%;font-family:inherit;font-weight:800;font-size:1rem;color:var(--ink);
  background:var(--white);border:2px solid var(--line);border-radius:14px;
  padding:14px 16px;cursor:pointer;transition:border-color .15s;
}
.lic-select:hover,.lic-select:focus{border-color:var(--sky);outline:none}
.subj-list{display:grid;gap:12px}
.subj{
  display:flex;align-items:center;gap:14px;border:2px solid var(--line);border-radius:16px;
  padding:16px 18px;cursor:pointer;transition:border-color .15s,background .15s;
}
.subj:hover{border-color:var(--sky);background:var(--sky-tint)}
.subj.on{border-color:var(--sky);background:var(--sky-tint)}
.subj input{position:absolute;opacity:0;pointer-events:none}
.subj .cb{
  width:24px;height:24px;border-radius:8px;border:2px solid var(--line);flex:none;
  display:flex;align-items:center;justify-content:center;background:var(--white);transition:background .15s,border-color .15s;
}
.subj.on .cb{background:var(--sky);border-color:var(--sky)}
.subj .cb svg{width:14px;height:14px;stroke:var(--ink);stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.subj.on .cb svg{opacity:1}
.subj .info{flex:1}
.subj .info b{display:block;font-weight:900;font-size:1rem}
.subj .info span{color:var(--ink-70);font-weight:700;font-size:.86rem}
.subj .amt{font-weight:900;font-size:1.02rem;white-space:nowrap}
.subj .amt em{font-style:normal;font-weight:700;font-size:.78rem;color:var(--ink-40);display:block;text-align:right}
.subj.dis{opacity:.45;pointer-events:none}

.lic-field{display:grid;gap:12px}
.lic-input{
  width:100%;font-family:inherit;font-weight:700;font-size:.98rem;color:var(--ink);
  border:2px solid var(--line);border-radius:14px;padding:13px 16px;outline:none;transition:border-color .15s;
}
.lic-input:focus{border-color:var(--sky)}
.lic-input::placeholder{color:var(--ink-40)}
.lic-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}

/* summary */
.lic-sum{
  border:1px solid var(--line);border-radius:24px;padding:28px 26px;background:var(--sky-tint);
  position:sticky;top:110px;
}
.lic-sum h3{font-size:1.05rem;margin-bottom:16px}
.sum-line{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px dashed rgba(39,50,56,.16);font-weight:700;font-size:.93rem;color:var(--ink-70)}
.sum-line b{color:var(--ink);font-weight:800}
.sum-empty{color:var(--ink-40);font-weight:700;font-size:.92rem;padding:10px 0}
.sum-total{display:flex;justify-content:space-between;align-items:baseline;margin-top:18px;padding-top:16px;border-top:2px solid rgba(39,50,56,.18)}
.sum-total span{font-weight:800;font-size:.95rem}
.sum-total b{font-weight:900;font-size:1.7rem}
.sum-note{color:var(--ink-70);font-weight:700;font-size:.8rem;margin-top:8px}
.lic-sum .btn{width:100%;justify-content:center;margin-top:20px}
.lic-sum .btn[disabled]{opacity:.45;cursor:not-allowed}
.trial-card{border:2px dashed var(--sky);border-radius:20px;padding:22px 24px;margin-top:20px;background:var(--white)}
.trial-card h4{font-weight:900;font-size:1rem;margin-bottom:6px}
.trial-card p{color:var(--ink-70);font-weight:700;font-size:.9rem;margin-bottom:14px}

/* success */
.lic-done{border:1px solid var(--line);border-radius:24px;padding:40px 34px;background:var(--white);text-align:center}
.lic-done .ok{
  width:64px;height:64px;border-radius:50%;background:var(--sky);margin:0 auto 20px;
  display:flex;align-items:center;justify-content:center;
}
.lic-done .ok svg{width:30px;height:30px;stroke:var(--ink);stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round}
.lic-done h3{font-size:1.4rem;margin-bottom:8px}
.lic-done > p{color:var(--ink-70);font-weight:700;max-width:34em;margin:0 auto}
.code-box{background:var(--sky-tint);border-radius:18px;padding:24px;margin:24px auto 0;max-width:440px;text-align:left}
.code-row{margin-bottom:16px}
.code-row:last-child{margin-bottom:0}
.code-row label{display:block;font-weight:800;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-40);margin-bottom:6px}
.code-val{
  display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--white);
  border:1px solid var(--line);border-radius:12px;padding:12px 14px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:700;font-size:1.02rem;letter-spacing:.04em;
}
.code-val button{
  font-family:inherit;font-weight:800;font-size:.78rem;color:var(--ink);background:var(--sky);
  border:0;border-radius:999px;padding:.45em 1em;cursor:pointer;flex:none;
}
.code-val button:hover{background:var(--orange)}
.demo-flag{
  margin-top:22px;border-left:4px solid var(--orange);background:#fef6e6;border-radius:0 12px 12px 0;
  padding:16px 20px;text-align:left;color:var(--ink-70);font-weight:700;font-size:.88rem;
}
@media (max-width:1000px){
  .lic-wrap{grid-template-columns:1fr}
  .lic-sum{position:static}
}
@media (max-width:720px){
  .lic-row{grid-template-columns:1fr}
}


/* ---- Licence modal ---- */
.lic-teaser{
  border:1px solid var(--line);border-radius:24px;padding:34px 32px;margin-top:26px;
  background:linear-gradient(135deg,var(--sky-tint) 0%,#fef6e6 100%);
  display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap;
}
.lic-teaser h3{font-size:1.25rem;margin-bottom:6px}
.lic-teaser p{color:var(--ink-70);font-weight:700;font-size:.96rem;max-width:34em}
.lic-teaser .acts{display:flex;gap:12px;flex-wrap:wrap}
.modal-back{
  position:fixed;inset:0;background:rgba(11,14,16,.55);z-index:200;
  display:flex;align-items:flex-start;justify-content:center;padding:40px 20px;overflow-y:auto;
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
}
.modal-back[hidden]{display:none}
.modal{
  background:var(--white);border-radius:26px;width:100%;max-width:960px;
  box-shadow:0 30px 80px rgba(11,14,16,.4);position:relative;overflow:hidden;
  animation:pop .22s ease;
}
@keyframes pop{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.modal-head{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:24px 28px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--white);z-index:2;
}
.modal-head h3{font-size:1.15rem}
.modal-head p{color:var(--ink-70);font-weight:700;font-size:.88rem;margin-top:2px}
.modal-close{
  width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--white);
  cursor:pointer;flex:none;display:flex;align-items:center;justify-content:center;transition:background .15s;
}
.modal-close:hover{background:var(--sky-tint)}
.modal-close svg{width:18px;height:18px;stroke:var(--ink);stroke-width:2.4;fill:none;stroke-linecap:round}
.modal-body{padding:28px}
.modal .lic-wrap{margin-top:0}
.modal .lic-panel{border:0;padding:0}
.modal .lic-sum{position:static}


/* info cards icons */
.grid2 .box .ic{width:46px;height:46px;border-radius:13px;background:var(--sky-tint);display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.grid2 .box .ic svg{width:24px;height:24px;fill:none;stroke:var(--ink);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.grid2 .box:nth-child(2) .ic{background:#fef6e6}
.grid2 .box:nth-child(4) .ic{background:#fef6e6}
/* safety block */
.safety{display:grid;grid-template-columns:auto 1fr;gap:34px;align-items:center;background:var(--sky-tint);border-radius:24px;padding:36px 34px;margin-top:8px}
.safety-ring{width:150px;height:150px;flex:none}
.safety h3{font-size:1.2rem;margin-bottom:10px}
.safety p{color:var(--ink-70);font-size:.98rem;max-width:44em}
.safety p + p{margin-top:10px}
@media (max-width:1000px){
  .grid2[style*="repeat(4"]{grid-template-columns:1fr 1fr !important}
  .safety{grid-template-columns:1fr;text-align:center;justify-items:center}
}
@media (max-width:720px){
  .grid2[style*="repeat(4"]{grid-template-columns:1fr !important}
}


/* ---- Redrawn loop ---- */
.loopwrap{margin-top:26px}
.loop-lane{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:14px;align-items:stretch}
.loop-node{border:1px solid var(--line);border-radius:20px;padding:26px 22px;background:var(--white);text-align:center;box-shadow:0 6px 18px rgba(39,50,56,.06)}
.loop-node.cls{background:var(--sky-tint);border-color:transparent}
.loop-node.home{background:#fef6e6;border-color:transparent}
.loop-node.back{background:var(--sky-tint);border-color:transparent}
.loop-node .ln-ic{width:52px;height:52px;border-radius:15px;background:var(--white);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;box-shadow:0 4px 12px rgba(39,50,56,.1)}
.loop-node .ln-ic svg{width:26px;height:26px;fill:none;stroke:var(--ink);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.loop-node b{display:block;font-size:1.05rem;font-weight:900;margin-bottom:6px}
.loop-node span{color:var(--ink-70);font-size:.9rem;font-weight:700}
.loop-arrow{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.loop-arrow svg{width:40px;height:24px}
.loop-arrow em{font-style:normal;font-weight:800;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40)}
.loop-note{display:flex;gap:16px;align-items:center;margin-top:20px;background:var(--white);border:2px dashed var(--sky);border-radius:20px;padding:20px 24px}
.loop-note .ln-ic{width:46px;height:46px;border-radius:13px;background:var(--sky-tint);display:flex;align-items:center;justify-content:center;flex:none}
.loop-note .ln-ic svg{width:24px;height:24px;fill:var(--orange)}
.loop-note div:last-child{font-weight:700;color:var(--ink-70);font-size:.96rem}
.loop-note b{color:var(--ink)}
@media (max-width:900px){
  .loop-lane{grid-template-columns:1fr}
  .loop-arrow{transform:rotate(90deg);margin:2px 0}
}


/* ---- Payment step ---- */
.pay-wrap{display:grid;grid-template-columns:1.3fr .7fr;gap:26px;align-items:start}
.pay-card{border:1px solid var(--line);border-radius:18px;padding:24px 24px 26px}
.pay-methods{display:flex;gap:10px;margin-bottom:22px;flex-wrap:wrap}
.pay-tab{display:flex;align-items:center;gap:8px;border:2px solid var(--line);border-radius:12px;padding:10px 16px;font-weight:800;font-size:.88rem;cursor:pointer;transition:border-color .15s,background .15s}
.pay-tab.on{border-color:var(--sky);background:var(--sky-tint)}
.pay-tab svg{width:20px;height:20px}
.pay-field{margin-bottom:14px}
.pay-field label{display:block;font-weight:800;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-40);margin-bottom:6px}
.pay-input{width:100%;font-family:inherit;font-weight:700;font-size:.98rem;border:2px solid var(--line);border-radius:12px;padding:13px 14px;outline:none;transition:border-color .15s}
.pay-input:focus{border-color:var(--sky)}
.pay-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pay-back{background:none;border:0;font-family:inherit;font-weight:800;font-size:.9rem;color:var(--ink-70);cursor:pointer;padding:0;margin-bottom:18px;display:inline-flex;align-items:center;gap:6px}
.pay-back svg{width:16px;height:16px;stroke:var(--ink-70);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.pay-secure{display:flex;align-items:center;gap:8px;color:var(--ink-40);font-weight:700;font-size:.82rem;margin-top:14px}
.pay-secure svg{width:15px;height:15px;stroke:var(--ink-40);stroke-width:1.8;fill:none}
.pay-sum-card{border:1px solid var(--line);border-radius:18px;padding:22px;background:var(--sky-tint)}

/* ---- Solution closing band (below content) ---- */
.next-band{background:var(--ink);color:var(--white);border-radius:26px;padding:44px 40px;margin-top:20px;display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap}
.next-band h3{font-size:1.5rem;margin-bottom:6px}
.next-band p{color:rgba(255,255,255,.72);font-weight:700;font-size:.98rem;max-width:32em}
.next-band .btn-outline{border-color:var(--white);color:var(--white)}
.next-band .btn-outline:hover{background:var(--white);color:var(--ink)}
@media (max-width:720px){.pay-wrap{grid-template-columns:1fr}}

/* ---------------- Motion ---------------- */
@media (prefers-reduced-motion:no-preference){
  .reveal{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease}
  .reveal.in{opacity:1;transform:none}
}

/* ---------------- Responsive ---------------- */
@media (max-width:1000px){
  .approach .wrap,.cta .wrap,.intro .wrap{grid-template-columns:1fr;gap:44px}
  .pin{width:52px;height:52px;border-width:3px}
  .pin.lg{width:64px;height:64px}
  .pin.sm{width:42px;height:42px}
  .quote{width:270px}
  .grid2,.grid3{grid-template-columns:1fr}
  .kv{flex-direction:column;gap:4px}
  .kv b{width:auto}
  .cta-buttons{grid-template-columns:1fr;max-width:none}

  .believes{padding:34px 24px 38px;border-radius:28px}
  .social-label{text-align:left}
  .grid-3,.sol-grid{grid-template-columns:1fr 1fr}
  .impact .wrap{grid-template-columns:1fr 1fr;padding:44px 32px}
}
@media (max-width:1199px){
  .grid-3,.sol-grid{grid-template-columns:1fr}
  .menu-toggle{display:block}
  .brand-lockup{height:34px}
  header.main{padding:0 12px;top:10px}
  .nav{height:62px;padding:0 8px 0 18px;gap:14px}
  .menu-toggle{display:block}
  /* Mobile menu: solid full-width panel anchored under the header */
  header.main nav.menu{
    display:none;position:fixed;top:78px;left:12px;right:12px;
    background:#ffffff !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;
    flex-direction:column;align-items:stretch;gap:0;
    padding:8px 0 !important;border:1px solid var(--line);border-radius:18px !important;
    box-shadow:0 18px 50px rgba(20,30,40,.22);
    max-height:calc(100dvh - 96px);overflow-y:auto;overflow-x:hidden;
    z-index:1200;-webkit-overflow-scrolling:touch;
  }
  header.main nav.menu.open{display:flex}
  /* Each top-level row */
  nav.menu > .item{width:100%}
  nav.menu > .item > a,
  nav.menu > .item > button{
    width:100%;display:flex;align-items:center;justify-content:space-between;
    padding:15px 20px;border-radius:0;border:0;border-bottom:1px solid var(--line);
    background:transparent;font-size:1.02rem;color:var(--ink);text-align:left;
  }
  nav.menu > .item:last-child > a,
  nav.menu > .item:last-child > button{border-bottom:0}
  nav.menu > .item > a:hover,
  nav.menu > .item > button:hover{background:#f4f8fb}
  /* Submenus expand inline, indented, tinted */
  .dropdown{
    position:static;opacity:1;visibility:visible;transform:none;
    border:0;box-shadow:none;display:none;padding:4px 0;background:#f7fafc;
  }
  .item.open > .dropdown{display:block}
  .item:hover > .dropdown{display:none}
  .item.open:hover > .dropdown{display:block}
  .dropdown a,.dropdown .soon-item{
    display:flex;align-items:center;padding:12px 20px 12px 34px;
    border-bottom:1px solid rgba(0,0,0,.04);color:var(--ink);font-size:.98rem;
  }
  .dropdown a:last-child,.dropdown .soon-item:last-child{border-bottom:0}
  /* Header CTA button visible in the menu, full width */
  .nav > .btn{display:none}
  /* Chevron sits on the right of the row */
  nav.menu .chev{margin-left:auto}
  section{padding:64px 0}
  .hero{min-height:94svh}
  .hero .bg{background-position:66% 30%}
  .hero .wrap{display:flex;align-items:flex-end;min-height:94svh;padding-top:130px;padding-bottom:28px}
  .hero-copy{max-width:none}
  
}

.ladder-rung{
  padding:10px 18px;border-radius:10px;font-weight:800;font-size:.92rem;
  text-align:center;font-family:Nunito,sans-serif;
  transition:transform .15s;
}
.ladder-rung:hover{transform:scale(1.04)}

/* Enquiry modal */
.enquiry-modal{max-width:520px;width:94vw}
.enq-form{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.enq-field{display:flex;flex-direction:column;gap:4px}
.enq-field.full{grid-column:1/-1}
.enq-field label{font-size:.82rem;font-weight:700;color:var(--ink)}
.enq-field input,.enq-field textarea{
  border:1.5px solid var(--line);border-radius:10px;padding:10px 14px;
  font-family:Nunito,sans-serif;font-size:.95rem;background:var(--white);
  transition:border-color .15s;
}
.enq-field input:focus,.enq-field textarea:focus{outline:none;border-color:var(--sky)}
.enq-field textarea{resize:vertical}
.enq-form .btn{margin-top:6px}
.enq-note{grid-column:1/-1;text-align:center;font-size:.8rem;color:var(--ink-40);margin:0}
.enq-success{text-align:center;padding:40px 20px}
.enq-success h3{color:var(--sky);margin-bottom:8px}
@media(max-width:600px){.enq-form{grid-template-columns:1fr}}

.page-hero.hero-fc .ph-bg{background-position:center 40%}













/* ===== About pages: shared editorial system ===== */
.about-head{padding:150px 0 0}
.about-label{display:block;font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-40);margin-bottom:14px}
.about-title{font-size:clamp(2.2rem,5vw,3.4rem);font-weight:900;letter-spacing:-.015em;line-height:1.05;padding-bottom:24px;border-bottom:1px solid var(--line)}

.abx-open{padding:44px 0 8px;max-width:46em}
.abx-huge{font-size:clamp(1.35rem,2.4vw,1.8rem);font-weight:900;line-height:1.25;letter-spacing:-.01em;max-width:22em}
.abx-openp{margin-top:14px;font-size:1.02rem;line-height:1.65;color:var(--ink-70);font-weight:600;max-width:38em}

.abx-quote{margin:56px 0;padding:36px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.abx-quote p{font-size:clamp(1.2rem,2.2vw,1.6rem);font-weight:900;line-height:1.4;max-width:32em}
.abx-quote span{display:inline-block;margin-top:14px;font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-40)}

.abx-label{display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--sky-deep)}
.abx-mark{width:44px;height:44px;margin-bottom:16px}
.abx-mark svg{width:100%;height:100%}

.abx-duo{display:grid;grid-template-columns:1fr 1fr;gap:56px;margin:56px 0;padding:44px 0;border-bottom:1px solid var(--line)}
.abx-duo-col .abx-label{margin-bottom:12px}
.abx-duo-text{margin-top:8px;font-size:1.05rem;font-weight:700;line-height:1.55;max-width:26em;color:var(--ink-70)}

.abx-rows{margin:56px 0 0}
.abx-rows-head{padding-bottom:16px}
.abx-row{display:grid;grid-template-columns:150px 1fr;gap:28px;padding:26px 0;border-top:1px solid var(--line);align-items:start}
.abx-row-key{font-weight:900;font-size:1.05rem;color:var(--ink)}
.abx-row-num{font-weight:900;font-size:1rem;color:var(--ink-40);letter-spacing:.06em}
.abx-row h3{font-size:1.12rem;font-weight:900;margin-bottom:6px}
.abx-row p{color:var(--ink-70);font-weight:600;font-size:1rem;line-height:1.6;max-width:44em}

.abx-band{margin:64px 0;background:var(--sky-tint);border-radius:24px;padding:44px 46px}
.abx-band p{font-size:clamp(1.08rem,1.8vw,1.35rem);font-weight:800;line-height:1.45;max-width:32em;color:var(--ink)}

.abx-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:48px 0 8px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.abx-stat{padding:34px 10px;text-align:center;border-left:1px solid var(--line)}
.abx-stat:first-child{border-left:0}
.abx-stat b{display:block;font-size:clamp(1.9rem,3.6vw,2.8rem);font-weight:900;color:var(--ink)}
.abx-stat span{display:inline-block;margin-top:4px;font-size:.82rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-40)}

.abx-toc{margin:64px 0 0;padding-top:36px;border-top:1px solid var(--line)}
.abx-toc-flow{display:flex;align-items:stretch;gap:22px;margin-top:22px}
.abx-toc-step{flex:1}
.abx-toc-step b{display:block;font-size:1.15rem;font-weight:900;margin-bottom:8px}
.abx-toc-step p{color:var(--ink-70);font-weight:600;font-size:.98rem;line-height:1.55}
.abx-toc-sep{width:1px;background:var(--line);flex:none}

.abx-strip{margin:64px 0;padding:36px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.abx-ladder{display:flex;gap:6px;margin-top:18px}
.abx-ladder i{flex:1;height:34px;border-radius:8px}
.abx-strip-note{margin-top:16px;color:var(--ink-70);font-weight:600;font-size:.98rem;max-width:36em}

.abx-close{margin:64px 0 8px;text-align:center}
.abx-close-line{font-size:clamp(1.05rem,1.8vw,1.3rem);font-weight:800;margin-bottom:22px;color:var(--ink)}

@media(max-width:820px){
  .about-head{padding-top:120px}
  .abx-duo{grid-template-columns:1fr;gap:36px}
  .abx-row{grid-template-columns:1fr;gap:8px}
  .abx-toc-flow{flex-direction:column}
  .abx-toc-sep{width:auto;height:1px}
  .abx-stats{grid-template-columns:1fr 1fr}
  .abx-stat:nth-child(3){border-left:0;border-top:1px solid var(--line)}
  .abx-stat:nth-child(4){border-top:1px solid var(--line)}
  .abx-band{padding:32px 26px}
}

/* About refinements */
.abx-rule{display:block;width:44px;height:5px;border-radius:3px;margin-bottom:16px}
.page-body.about-mode{padding-top:24px}
.abx-open{padding-top:36px}

/* About figures */
.abx-figure{margin:44px 0;border:1px solid var(--line);border-radius:24px;padding:34px 36px;background:linear-gradient(180deg,#fbfdfe,#f4f9fb)}
.abx-figure > svg{width:100%;height:auto;display:block}
.abx-figcap{margin-top:18px;color:var(--ink-70);font-weight:600;font-size:.96rem;max-width:40em;text-align:center;margin-left:auto;margin-right:auto}
.ladder-fig svg{max-height:340px}
.split-fig{display:grid;grid-template-columns:220px 1fr;gap:40px;align-items:center}
.split-donut svg{width:100%;max-width:200px;margin:0 auto;display:block}
.split-legend div{display:flex;align-items:center;gap:12px;font-weight:800;font-size:1rem;margin-bottom:12px}
.split-legend .dot{width:16px;height:16px;border-radius:50%;flex:none}
.split-legend p{color:var(--ink-70);font-weight:600;font-size:.98rem;margin-top:8px;line-height:1.55}
@media(max-width:820px){
  .abx-figure{padding:22px 20px}
  .split-fig{grid-template-columns:1fr;gap:24px}
}

.toc-cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:20px}
.toc-cap-grid p{color:var(--ink-70);font-weight:600;font-size:.96rem;line-height:1.55}
.toc-cap-grid b{color:var(--ink);font-weight:900}
@media(max-width:820px){.toc-cap-grid{grid-template-columns:1fr}}

/* What we do: 3-step cards */
.wwd3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin:40px 0;position:relative}
.wwd3-card{border:1px solid var(--line);border-radius:24px;padding:32px 28px;background:var(--white);position:relative;transition:box-shadow .18s,transform .18s}
.wwd3-card:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.wwd3-step{display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-40);margin-bottom:18px}
.wwd3-ic{width:60px;height:60px;border-radius:18px;background:var(--sky-tint);display:flex;align-items:center;justify-content:center;margin-bottom:20px}
.wwd3-ic svg{width:30px;height:30px;stroke:var(--ink);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.wwd3-card:nth-child(2) .wwd3-ic{background:#fff5e2}
.wwd3-card:nth-child(3) .wwd3-ic{background:#eef7e6}
.wwd3-card h3{font-size:1.25rem;font-weight:900;margin-bottom:8px}
.wwd3-card p{color:var(--ink-70);font-weight:600;font-size:1rem;line-height:1.55}
@media(max-width:820px){.wwd3{grid-template-columns:1fr}}

/* full-bleed slot for the moved reach section */
.bleed-slot{width:100vw;margin-left:calc(50% - 50vw);margin-top:24px;margin-bottom:24px}
.page-body{overflow-x:clip}

/* Team grid — square photos, Curious Learning style */
.tm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin:44px 0}
.tm-card{display:flex;flex-direction:column;align-items:stretch;text-align:left;gap:0;background:none;border:0;padding:0;cursor:pointer;font-family:Nunito,sans-serif}
.tm-photo{width:100%;aspect-ratio:1/1;border-radius:16px;overflow:hidden;background:var(--sky-tint);display:flex;align-items:center;justify-content:center;margin-bottom:14px;transition:transform .2s,box-shadow .2s}
.tm-card:hover .tm-photo{transform:translateY(-4px);box-shadow:var(--shadow)}
.tm-photo img{width:100%;height:100%;object-fit:cover;display:block}
.tm-ph-ph{font-weight:900;font-size:2.4rem;color:var(--sky-deep)}
.tm-name{font-weight:900;font-size:1.14rem;color:var(--ink);line-height:1.2}
.tm-role{font-weight:700;font-size:.95rem;color:var(--ink-70);margin-top:4px;line-height:1.35}
.tm-meta{font-weight:700;font-size:.85rem;color:var(--ink-40);margin-top:6px}
@media(max-width:820px){.tm-grid{grid-template-columns:1fr 1fr;gap:28px}}
@media(max-width:520px){.tm-grid{grid-template-columns:1fr;gap:24px}}

/* Partner cards */
.pt-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin:44px 0}
.pt-card{border:1px solid var(--line);border-radius:22px;padding:28px 30px;background:var(--white);transition:box-shadow .18s,transform .18s}
.pt-card:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.pt-head{display:flex;align-items:center;gap:16px;margin-bottom:14px}
.pt-mono{width:54px;height:54px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:1.1rem;letter-spacing:.03em;flex:none}
.pt-head h3{font-size:1.2rem;font-weight:900;line-height:1.15}
.pt-tag{display:inline-block;font-size:.8rem;font-weight:800;color:var(--ink-40);margin-top:3px}
.pt-card > p{color:var(--ink-70);font-weight:600;font-size:.98rem;line-height:1.6}
@media(max-width:820px){.pt-grid{grid-template-columns:1fr;gap:20px}}

/* Resources */
.res-chips{display:flex;gap:10px;flex-wrap:wrap;margin:36px 0 8px}
.res-chip{font-family:Nunito,sans-serif;font-weight:800;font-size:.9rem;color:var(--ink-70);background:var(--white);border:1px solid var(--line);border-radius:999px;padding:9px 20px;cursor:pointer;transition:all .15s}
.res-chip:hover{background:var(--sky-tint);color:var(--ink)}
.res-chip.on{background:var(--ink);border-color:var(--ink);color:var(--white)}
.res-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin:32px 0 8px}
.res-card{border:1.5px dashed var(--line);border-radius:22px;padding:0 0 26px;overflow:hidden;background:var(--white)}
.res-thumb{height:150px;background:linear-gradient(160deg,#fbfdfe,#f1f7fa);display:flex;align-items:center;justify-content:center;margin-bottom:20px}
.res-thumb svg{width:44px;height:44px;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.res-tag{display:inline-block;font-size:.76rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:5px 14px;border-radius:999px;margin:0 26px 12px}
.res-card h3{font-size:1.15rem;font-weight:900;margin:0 26px 6px;color:var(--ink-40)}
.res-card p{margin:0 26px;color:var(--ink-40);font-weight:600;font-size:.94rem;line-height:1.55}
@media(max-width:900px){.res-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.res-grid{grid-template-columns:1fr}}

/* Norwegian hero: black headline, no dark veil, and illustration pushed down below header */
.hero h1{color:var(--ink)!important;text-shadow:none!important}
.hero .lead{color:var(--ink-70)!important;text-shadow:none!important}
.hero .veil{display:none!important}


/* NO hero: keep image behind header, shift subject down so it doesn't clash with nav */
.hero .bg{background-position:right 78%!important;background-size:cover!important}
@media(max-width:820px){
  .hero .bg{background-position:center 70%!important}
}

/* NO header: subtle glass backdrop so text and chevrons stay legible over the illustration */
header.main nav.menu{background:rgba(255,255,255,.75);backdrop-filter:saturate(1.2) blur(10px);-webkit-backdrop-filter:saturate(1.2) blur(10px);border-radius:999px;padding:6px 14px}
header.main nav.menu > .item > a,
header.main nav.menu > .item > button{color:var(--ink)!important;text-shadow:none!important}
header.main nav.menu .chev{stroke:var(--ink)!important;opacity:.8}
header.main nav.menu > .item > a:hover,
header.main nav.menu > .item > button:hover{color:var(--sky-deep)!important}

/* Norwegian intro slider (replaces YouTube video) */
.intro-slider{position:relative;overflow:hidden;background:#0e1a20}
.slider-track{position:absolute;inset:0;width:100%;height:100%}
.slider-slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .55s ease}
.slider-slide.active{opacity:1}
.slider-arrow{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.9);border:0;color:var(--ink);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(0,0,0,.2);transition:background .15s,transform .15s;z-index:2}
.slider-arrow:hover{background:#fff;transform:translateY(-50%) scale(1.06)}
.slider-arrow svg{width:22px;height:22px}
.slider-prev{left:14px}
.slider-next{right:14px}
.slider-dots{position:absolute;bottom:14px;left:0;right:0;display:flex;justify-content:center;gap:8px;z-index:2}
.slider-dot{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.55);border:0;padding:0;cursor:pointer;transition:background .18s,transform .18s}
.slider-dot:hover{background:rgba(255,255,255,.85)}
.slider-dot.active{background:#fff;transform:scale(1.25)}
@media(max-width:520px){
  .slider-arrow{width:40px;height:40px}
  .slider-prev{left:8px}
  .slider-next{right:8px}
}

/* Lek og lær section */
.playlearn{padding:104px 0;background:var(--white)}
.playlearn .wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.playlearn-head{max-width:660px;margin-bottom:56px}
.playlearn-head .eyebrow{display:inline-block;font-size:.74rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--sky-deep);margin-bottom:14px}
.playlearn-head h2{font-size:clamp(1.9rem,3.6vw,2.7rem);font-weight:900;line-height:1.1;letter-spacing:-.01em;margin-bottom:16px}
.playlearn-lead{font-size:clamp(1.05rem,1.6vw,1.2rem);line-height:1.6;color:var(--ink-70);font-weight:600}
.playlearn-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.pl-card{background:var(--white);border-radius:22px;padding:32px 28px;border:1px solid var(--line);transition:transform .18s,box-shadow .18s}
.pl-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(39,50,56,.08)}
.pl-ic{width:60px;height:60px;border-radius:16px;display:flex;align-items:center;justify-content:center;margin-bottom:20px}
.pl-ic svg{width:30px;height:30px}
.pl-card h3{font-size:1.15rem;font-weight:900;margin-bottom:10px;color:var(--ink)}
.pl-card p{color:var(--ink-70);font-weight:600;font-size:.98rem;line-height:1.55}
.playlearn-cta{display:flex;gap:14px;justify-content:center;margin-top:56px;flex-wrap:wrap}
@media(max-width:1000px){.playlearn-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.playlearn-grid{grid-template-columns:1fr}.playlearn{padding:72px 0}}


.inline-link{color:var(--sky-deep);font-weight:800;text-decoration:underline;text-underline-offset:2px}
.inline-link:hover{color:var(--ink)}

/* Leap Lab — station lists + mini eyebrow */
.mini-eyebrow{display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:10px}
.station-list{margin:18px 0 0;padding:0;list-style:none;counter-reset:st}
.station-list li{position:relative;padding:9px 0 9px 44px;border-bottom:1px solid var(--line);font-weight:700;color:var(--ink);line-height:1.4}
.station-list li:last-child{border-bottom:0}
.station-list li:before{counter-increment:st;content:counter(st);position:absolute;left:0;top:7px;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:900;color:#fff}
.station-blue li:before{background:#2979ff}
.station-green li:before{background:#8bc34a}

/* Voksenopplæring section */
.adultlit{padding:96px 0;background:var(--white)}
.adultlit .wrap{max-width:1160px;margin:0 auto;padding:0 20px}
.adultlit-inner{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;background:linear-gradient(135deg,#eaf7fc 0%,#f4fafd 60%,#fff5e2 100%);border-radius:28px;padding:52px 56px}
.adultlit-copy .eyebrow{display:inline-block;font-size:.74rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--sky-deep);margin-bottom:14px}
.adultlit-copy h2{font-size:clamp(1.7rem,3vw,2.3rem);font-weight:900;line-height:1.12;margin-bottom:16px;color:var(--ink)}
.adultlit-copy p{color:var(--ink-70);font-weight:600;line-height:1.62;margin-bottom:14px}
.adultlit-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:22px}
.adultlit-art{display:flex;justify-content:center}
.adultlit-art svg{width:100%;max-width:300px;height:auto}
@media(max-width:820px){
  .adultlit-inner{grid-template-columns:1fr;gap:28px;padding:36px 28px}
  .adultlit-art{order:-1;max-width:220px;margin:0 auto}
}

/* Voksenopplæring photo */
.adultlit-art img{max-height:420px;box-shadow:0 14px 34px rgba(39,50,56,.14)}
@media(max-width:820px){.adultlit-art img{max-height:320px}}

.adultlit-art img{max-height:420px;box-shadow:0 14px 34px rgba(39,50,56,.14)}

/* =====================================================================
   RESPONSIVE SYSTEM — tokens, container, fluid type, adaptive grids
   (single source of truth; applies at every width)
   ===================================================================== */
:root{
  --fs-h1: clamp(1.9rem, 1.15rem + 2.8vw, 3.2rem);
  --fs-h2: clamp(1.55rem, 1.05rem + 2vw, 2.6rem);
  --fs-h3: clamp(1.05rem, .95rem + .45vw, 1.3rem);
  --fs-lead: clamp(1rem, .9rem + .45vw, 1.2rem);
  --fs-body: clamp(.95rem, .9rem + .25vw, 1.05rem);
  --fs-eyebrow: clamp(.76rem, .7rem + .22vw, .84rem);
  --sp-section: clamp(3.25rem, 1.75rem + 5vw, 6.5rem);
  --sp-gap: clamp(.9rem, .55rem + 1.3vw, 1.75rem);
  --pad-card: clamp(1.15rem, .8rem + 1.6vw, 2rem);
  --gutter: clamp(1.1rem, 4vw, 2.25rem);
  --radius: 20px;
  --tap: 44px;
}
*,*::before,*::after{box-sizing:border-box}
img,svg,video{max-width:100%;height:auto}
p,h1,h2,h3,h4,li,a,span,dd,dt{overflow-wrap:anywhere}

/* Container */
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.playlearn .wrap,.adultlit .wrap{padding-inline:var(--gutter)}

/* Fluid type */
h1{font-size:var(--fs-h1);line-height:1.08}
h2{font-size:var(--fs-h2);line-height:1.15}
h3{font-size:var(--fs-h3)}
.lead,.playlearn-lead,.abx-openp{font-size:var(--fs-lead)}
.eyebrow,.about-label,.abx-label,.mini-eyebrow,.wwd3-step,.pt-tag,.s{font-size:var(--fs-eyebrow)}
.tm-meta{font-size:.8rem}

/* Spacing scale */
section{padding-block:var(--sp-section)}
.playlearn,.adultlit,.intro,.reach,.download,.believes{padding-block:var(--sp-section)}

/* Touch targets & focus */
.btn{min-height:var(--tap)}
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--sky-deep);outline-offset:3px;border-radius:8px}

/* Adaptive grids — columns come from available space, not device names */
.g-1{display:grid;grid-template-columns:1fr}
.g-2,.grid2,.split-media,.wwd-open-grid,.adultlit-inner,.wwd-stage{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.g-3,.grid3,.rooms,.price,.gallery,.grid-3,.sol-grid,.wwd3,.res-grid,.wwd-fits-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}
.g-4,.flow,.playlearn-grid,.lab-band{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,max(210px,22%)),1fr))}
.abx-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr))}
.tm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,max(155px,21%)),1fr))}
.g-2,.g-3,.g-4,.grid2,.grid3,.rooms,.price,.gallery,.grid-3,.sol-grid,.wwd3,.res-grid,.flow,.playlearn-grid,.lab-band,.tm-grid,.wwd-fits-grid{gap:var(--sp-gap)}
.gap-sm{gap:.9rem}.gap-lg{gap:clamp(1.5rem,3vw,2.5rem)}.mt-lg{margin-top:2rem}.center{text-align:center}
.split-media,.wwd-open-grid,.adultlit-inner{gap:clamp(1.5rem,3.5vw,3.5rem);align-items:center}
.adultlit-inner{padding:clamp(1.5rem,4vw,3.5rem)}
.split-media .ph-img.tall{min-height:min(60vw,320px)}

/* Cards */
.pl-card,.wwd-fit-card,.box,.card,.room,.price-card,.tm-card,.quote,.sol-card{padding:var(--pad-card)}


@media (min-width: 700px){}

/* Media */
.slider-track{position:absolute;inset:0}
.intro-slider,.video-frame{min-height:min(56vw,320px)}
.station-list li{padding-left:44px}

/* Testimonial strip: auto-scroll with pointer; swipe with touch/narrow */
@media (hover:none), (max-width: 700px){
  .marquee{overflow-x:auto;-webkit-mask-image:none;mask-image:none;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:8px 0 22px}
  .marquee .track{animation:none;width:max-content;gap:14px;padding:0 var(--gutter)}
  .quote{width:min(82vw,320px);scroll-snap-align:center}
}

/* Licence modal fits any screen */
.modal{width:min(94vw,560px);max-height:88dvh;overflow-y:auto}

/* Footer */
@media (max-width: 700px){footer .wrap,.footer-grid{grid-template-columns:1fr;gap:1.6rem}}

/* Ultrawide: keep content readable, hero art contained */
@media (min-width: 1800px){
  :root{--maxw:1440px}
  .hero .wrap{max-width:1440px}
}

/* Hero — narrow/medium screens get their own composition (one screen, CTAs in thumb zone) */
@media (max-width: 900px){
  .hero{position:relative;display:block;height:100svh;min-height:0;max-height:100svh;overflow:hidden;margin-top:-62px;padding:0}
  .hero .bg{position:absolute;inset:0;z-index:0}
  .hero::after{display:none}
  .hero .wrap{position:absolute;left:0;right:0;top:auto;bottom:calc(18px + env(safe-area-inset-bottom,0px));display:block;min-height:0;padding:0 var(--gutter);margin:0;z-index:2}
  .hero-copy{position:relative;z-index:2;max-width:none}
  .hero h1{font-size:clamp(1.5rem,6.4vw,2.1rem);margin:0 0 .5rem}
  .hero .lead{font-size:clamp(.85rem,3.4vw,1rem);line-height:1.4;margin:0}
  .hero-ctas{position:static;display:flex;flex-direction:row;gap:10px;margin:.9rem 0 0}
  .hero-ctas .btn{flex:1 1 0;width:auto;padding:.85em .6em;font-size:clamp(.88rem,3.4vw,1rem);white-space:nowrap;box-shadow:0 8px 22px rgba(20,30,40,.18)}
  .hero-ctas .btn-outline{background:rgba(255,255,255,.92)}
}
@media (max-width: 900px) and (max-height: 640px){
  .hero h1{font-size:1.4rem}.hero .lead{font-size:.8rem}.hero-ctas .btn{padding:.7em .5em}
}
@media (min-width: 601px) and (max-width: 900px){
  .hero .wrap{bottom:28px}
  .hero-ctas{max-width:560px}
}

@media (max-width: 900px){
  
  .hero .bg{background-size:cover !important;background-position:center 22% !important}
  .hero::after{content:"";display:block;position:absolute;inset:auto 0 0 0;height:58%;z-index:1;pointer-events:none;
    background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.72) 38%,rgba(255,255,255,.92) 100%)}
}


.store .s,.playlearn-head .eyebrow,.adultlit-copy .eyebrow{font-size:var(--fs-eyebrow)}

/* Mid-range laptops: keep hero copy in the clear area left of the illustration */
@media (min-width: 901px) and (max-width: 1280px){
  .hero-copy{max-width:min(44vw,500px)}
  .hero h1{font-size:clamp(1.7rem,2.7vw,2.5rem)}
  .hero .lead{font-size:clamp(.9rem,1.1vw,1.05rem)}
}

/* Footer */
footer{background:var(--ink);color:#e6edf0;padding-block:clamp(2.5rem,5vw,4rem) 1.5rem}
.foot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:clamp(1.5rem,3vw,2.5rem)}
.foot-id img{height:40px;width:auto;background:#fff;padding:6px 12px;border-radius:12px}
.foot-tag{margin-top:.9rem;color:#b9c6cc;max-width:32ch;line-height:1.5}
.foot-col h4{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:#9fb0b8;margin:0 0 .8rem}
.foot-col a{display:block;color:#e6edf0;text-decoration:none;padding:.25rem 0;font-weight:700}
.foot-col a:hover{color:var(--sky)}
.foot-col p{margin:0 0 .6rem;line-height:1.55;color:#d3dde2}
.foot-col p a{display:inline;padding:0}
.foot-social{display:flex;gap:.6rem;margin-bottom:.8rem}
.foot-social a{width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;padding:0}
.foot-social a:hover{background:var(--sky)}
.foot-social svg{width:20px;height:20px;fill:currentColor}
.foot-small{font-size:.82rem;color:#9fb0b8}
.foot-bottom{display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;justify-content:space-between;border-top:1px solid rgba(255,255,255,.12);margin-top:2rem;padding-top:1.1rem;font-size:.82rem;color:#9fb0b8}
.foot-bottom a{color:#e6edf0}

/* Collections / resources */
.coll-link{display:block;padding:.55rem 0;border-bottom:1px solid var(--line);font-weight:800;color:var(--ink);text-decoration:none}
.coll-link:last-child{border-bottom:0}.coll-link:hover{color:var(--sky-deep)}
.box .mini-eyebrow{display:block;margin-bottom:.35rem;color:var(--sky-deep)}
.reach-lead{max-width:62ch;color:var(--ink-70);font-weight:600;margin-top:.6rem}
.cn-text{font-size:.95rem !important;line-height:1.2}
/* Bokstavkongen */
.bk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,150px),1fr));gap:.7rem;margin-top:1.2rem}
.bk-item{display:flex;align-items:center;gap:.7rem;padding:.7rem .85rem;border:1px solid var(--line);border-radius:14px;text-decoration:none;color:var(--ink);font-weight:700;font-size:.92rem;line-height:1.25;background:#fff;min-height:var(--tap)}
.bk-item:hover{border-color:var(--sky-deep);box-shadow:var(--shadow)}
.bk-letter{flex:none;width:38px;height:38px;border-radius:10px;background:var(--sky-tint);color:var(--sky-deep);display:flex;align-items:center;justify-content:center;font-weight:900;font-size:1.2rem;text-transform:uppercase}
.bk-note h3{margin-top:0}
/* Reduced motion */
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation:none !important;transition:none !important}.reveal{opacity:1;transform:none}}
/* Nav active state */
nav.menu > .item > a[aria-current="page"],nav.menu > .item.active > button{color:var(--sky-deep)}

.bk-teaser{background:var(--white)}
.bk-teaser-inner{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:clamp(1.5rem,3.5vw,3.5rem);align-items:center;background:var(--sky-tint);border-radius:28px;padding:clamp(1.5rem,4vw,3.5rem)}
.bk-teaser-inner .eyebrow{display:inline-block;color:var(--sky-deep);margin-bottom:.8rem}
.bk-teaser-inner p{color:var(--ink-70);font-weight:600;line-height:1.6;margin:0 0 1.2rem;max-width:58ch}
.bk-teaser-letters{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;width:min(100%,360px);margin:0 auto}
.bk-teaser-letters span{aspect-ratio:1;border-radius:18px;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:clamp(1.6rem,4vw,2.4rem);background:#fff;box-shadow:var(--shadow);color:var(--ink)}
.bk-teaser-letters span:nth-child(1),.bk-teaser-letters span:nth-child(5){color:var(--sky-deep)}
.bk-teaser-letters span:nth-child(3),.bk-teaser-letters span:nth-child(4){color:var(--orange)}

/* Navigation: never wrap; tighten on laptops */
nav.menu a,nav.menu button,nav.menu span{white-space:nowrap;overflow-wrap:normal}
nav.menu > .item > a,nav.menu > .item > button{font-size:clamp(.88rem,.75rem + .35vw,1rem)}
@media (min-width:1200px) and (max-width:1440px){nav.menu{gap:2px}nav.menu > .item > a,nav.menu > .item > button{padding-inline:.6rem}}
nav.menu > .item > a.current{background:none;box-shadow:inset 0 -2px 0 var(--sky-deep);border-radius:0}
nav.menu > .item.active > button{box-shadow:inset 0 -2px 0 var(--sky-deep);border-radius:0}

.nav > .btn{white-space:nowrap}
@media (min-width:1200px) and (max-width:1440px){.nav > .btn{padding:.6em .95em;font-size:.9rem}}
nav.menu > .item > button{display:inline-flex;align-items:center;gap:.3rem}
nav.menu .chev{flex:none;width:12px;height:12px}

.bk-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,132px),1fr))}
.bk-item{font-size:.95rem}
/* Page hero: gradient veil — image colours visible, text readable at the bottom */

/* ===== Colour scheme: this site is designed light. Prevent OS/in-app dark mode
   from inverting text/background and making content unreadable. ===== */
:root{color-scheme:light}
html{background:#fff}
@media (prefers-color-scheme: dark){
  html,body{background:#fff !important;color:var(--ink) !important}
  /* keep our own dark surfaces (footer/ink hero) intact, but stop UA re-tinting text */
  input,textarea,select{background:#fff;color:var(--ink)}
}
/* Windows/Android high-contrast / forced-colors: keep brand colours legible */
@media (forced-colors: active){
  .btn-primary{forced-color-adjust:none}
}

/* Hero trust line */
.hero-trust{margin:.7rem 0 0;font-size:.85rem;font-weight:700;color:var(--ink-70)}
@media (max-width:900px){.hero-trust{font-size:.78rem;margin-top:.5rem}}
/* Audience cards */
.audience{background:var(--white)}
.audience-head{max-width:60ch;margin-bottom:clamp(1.2rem,3vw,2rem)}
.audience-head .eyebrow{display:inline-block;color:var(--sky-deep);margin-bottom:.6rem}
.audience-head p{color:var(--ink-70);font-weight:600;margin:.4rem 0 0}
.audience-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:var(--sp-gap)}
.aud-card{display:flex;flex-direction:column;background:var(--sky-tint);border-radius:22px;padding:var(--pad-card)}
.aud-tag{display:inline-block;align-self:flex-start;font-size:.74rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--sky-deep);background:#fff;padding:.3rem .65rem;border-radius:999px;margin-bottom:.9rem}
.aud-card h3{margin:0 0 .5rem}
.aud-card p{color:var(--ink-70);font-weight:600;line-height:1.55;margin:0 0 1.1rem;flex:1}
.aud-card .btn{align-self:flex-start}
.aud-link{display:inline-block;margin-top:.8rem;font-weight:800;color:var(--ink);text-decoration:none}
.aud-link:hover{color:var(--sky-deep)}
/* Buy steps */
.buysteps{background:var(--white)}
.buysteps-inner{background:var(--ink);color:#fff;border-radius:28px;padding:clamp(1.6rem,4vw,3.5rem);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(1.5rem,3.5vw,3rem);align-items:start}
.buysteps-head .eyebrow{display:inline-block;color:var(--sky);margin-bottom:.6rem}
.buysteps-head h2{color:#fff;margin:0 0 .6rem}
.buysteps-head p{color:rgba(255,255,255,.78);font-weight:600;line-height:1.55;margin:0}
.buysteps-list{list-style:none;margin:0;padding:0;display:grid;gap:.9rem}
.buysteps-list li{display:flex;gap:.9rem;align-items:flex-start}
.bs-num{flex:none;width:36px;height:36px;border-radius:50%;background:var(--sky);color:var(--ink);font-weight:900;display:flex;align-items:center;justify-content:center}
.buysteps-list h3{color:#fff;margin:0 0 .15rem;font-size:1.05rem}
.buysteps-list p{color:rgba(255,255,255,.75);font-weight:600;margin:0;line-height:1.45}
.buysteps-cta{display:flex;flex-wrap:wrap;gap:.7rem;align-items:center;grid-column:1/-1}
.buysteps-cta .btn-outline{color:#fff;border-color:rgba(255,255,255,.6)}
.buysteps-cta .btn-outline:hover{background:rgba(255,255,255,.1)}
.buysteps-note{width:100%;margin:.2rem 0 0;font-size:.85rem;color:rgba(255,255,255,.7);font-weight:600}

/* ===== Journey / step list (badge + number left, text right) ===== */
.journey{position:relative;margin-top:2rem;display:flex;flex-direction:column;gap:1.5rem}
.journey::before{content:"";position:absolute;left:27px;top:12px;bottom:12px;width:3px;border-radius:2px;background:linear-gradient(180deg,var(--sky),var(--orange));z-index:0}
.jline{display:none}
.jstep{position:relative;z-index:1;display:grid;grid-template-columns:56px 1fr;column-gap:1rem;align-items:start}
.jstep .jmark{position:relative;width:56px;height:56px;flex:none}
.jstep .jbadge{width:56px;height:56px;border-radius:16px;background:#fff;border:2px solid var(--line);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(39,50,56,.08)}
.jstep .jbadge svg{width:28px;height:28px;fill:none;stroke:var(--ink);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.jstep .jn{position:absolute;top:-8px;left:-8px;width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;font-weight:900;font-size:.8rem;display:flex;align-items:center;justify-content:center;z-index:2}
.jstep .jtext{padding-top:.15rem}
.jstep h3{font-size:1.12rem;margin:0 0 .3rem}
.jstep p{color:var(--ink-70);font-size:.97rem;margin:0;max-width:52ch;line-height:1.55}
.jstep .jmedia{margin-top:.9rem}
.jstep:nth-child(1) .jbadge{border-color:var(--sky)}
.jstep:nth-child(2) .jbadge{border-color:var(--orange)}
.jstep:nth-child(3) .jbadge{border-color:var(--sky)}
.jstep:nth-child(4) .jbadge{border-color:var(--orange)}
@media (max-width:520px){
  .jstep{grid-template-columns:48px 1fr;column-gap:.8rem}
  .jstep .jmark,.jstep .jbadge{width:48px;height:48px}
  .jstep .jbadge svg{width:24px;height:24px}
  .journey::before{left:23px}
}