/* Hero: centred heading block (v2 layout restored) + store badge styles */
#website .book-hero .book-intro{gap:12px!important;max-width:820px!important}
#website .hero-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:99px;background:#fff;border:1px solid #dfe6da;box-shadow:0 2px 8px rgba(23,63,45,.06);font:600 12px/1.4 Inter,sans-serif!important;letter-spacing:.08em!important;text-transform:uppercase;color:#173f2d!important}
#website .hero-pill i{width:8px;height:8px;border-radius:50%;background:#2f8a57;box-shadow:0 0 0 4px rgba(47,138,87,.18)}
#website .book-hero h1.hero-headline{font-size:clamp(32px,3.6vw,50px)!important;line-height:1.08!important;letter-spacing:-.03em!important;font-weight:700!important;max-width:19ch;margin:0 auto!important}
#website .book-hero h1.hero-headline em{font:inherit!important;font-style:normal!important;letter-spacing:inherit!important;color:#173f2d;background:linear-gradient(transparent 62%,#f3d9a4 62%,#f3d9a4 92%,transparent 92%);padding:0 .06em}
#website .book-hero .hero-sub{max-width:560px!important;font-size:18px!important;line-height:1.55!important;color:#4a5347!important}
#website .hero-trust{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:0}
#website .hero-trust li{display:flex;flex-direction:column;align-items:center;padding:4px 22px;border-left:1px solid #dcd6c6}
#website .hero-trust li:first-child{border-left:0}
#website .hero-trust b{font:700 14px/1.3 var(--font-head,Inter,sans-serif);color:#1f2a22}
#website .hero-trust span{font-size:12px;color:#5c6456}
#website .book-hero .book-levels{color:#5c6456!important}

/* Store badges (Get Tuuteez section) */
.store-badges{display:flex;flex-wrap:wrap;gap:10px}
.store-badge{position:relative;display:inline-flex;align-items:center;gap:10px;min-width:168px;padding:8px 16px 8px 12px;border-radius:12px;background:#111;color:#fff!important;text-decoration:none!important;border:1px solid #333;transition:transform .15s,box-shadow .15s}
.store-badge:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.18)}
.store-badge:focus-visible{outline:3px solid #d5a14b;outline-offset:3px}
.store-badge svg{width:26px;height:26px;flex:none}
.store-badge span{display:flex;flex-direction:column;line-height:1.1;text-align:left}
.store-badge small{font:500 10px Inter,sans-serif;color:#ddd}
.store-badge b{font:600 17px var(--font-head,Inter,sans-serif);color:#fff}
.store-badge .soon{position:absolute;top:-8px;right:-8px;padding:2px 7px;border-radius:99px;background:#f3d9a4;color:#3d2a00;font:700 10px Inter,sans-serif;font-style:normal}
.store-badge.live .soon{display:none}
#website .get-stores{margin-top:12px}
#website .platform-options{display:flex;flex-direction:column;gap:6px}

@media(min-width:1024px){#website .book-hero .book-scene{height:clamp(250px,calc(100svh - 520px),440px)!important}}
@media(max-width:760px){
  #website .book-hero h1.hero-headline{font-size:32px!important}
  #website .book-hero .hero-sub{font-size:15.5px!important}
  #website .hero-pill{font-size:10.5px!important;letter-spacing:.06em!important;white-space:nowrap}
  #website .hero-trust{display:grid;grid-template-columns:repeat(3,1fr);width:100%}
  #website .hero-trust li{padding:2px 6px;text-align:center}
  #website .hero-trust b{font-size:12px}
  #website .hero-trust span{font-size:11px}
  .store-badge{min-width:0;padding:7px 12px 7px 10px}
  .store-badge b{font-size:15px}
}

/* Supporting line + highlights sit below the book, with the buttons */
#website .book-invitation{display:flex;flex-direction:column;align-items:center;gap:14px}
#website .book-invitation .hero-sub{margin:0 auto!important;text-align:center}
#website .book-invitation .hero-trust{margin:0}
#website .book-invitation .actions{margin-top:6px!important}
#website .book-invitation .book-levels{margin-top:2px!important}
@media(min-width:1024px){#website .book-hero .book-scene{height:clamp(250px,calc(100svh - 500px),460px)!important}#website .book-scroll-stage .book-invitation{padding-bottom:18px!important}}


/* Headline that rises out of the book */
#website .hero-rise{position:absolute;z-index:5;left:50%;top:18px;width:min(96%,960px);max-width:none!important;margin:0;translate:-50% 0;text-align:center;pointer-events:none;
  font:700 clamp(28px,3.4vw,48px)/1.1 var(--font-head,'Plus Jakarta Sans',Inter,sans-serif);letter-spacing:-.03em;color:#16211a;text-wrap:balance}
#website .hero-rise span{display:block;opacity:0;transform:translateY(var(--from,190px)) scale(.2);filter:blur(6px);transform-origin:50% 100%}
#website .hero-rise em{font-style:normal;color:#2f7a4f}
#website .book-awake .hero-rise span{animation:heroRise 1.4s cubic-bezier(.16,1,.3,1) both}
#website .book-awake .hero-rise span:nth-child(1){animation-delay:.15s;--from:200px}
#website .book-awake .hero-rise span:nth-child(2){animation-delay:.45s;--from:150px}
@keyframes heroRise{0%{opacity:0;transform:translateY(var(--from)) scale(.2);filter:blur(6px)}60%{opacity:1;filter:blur(0)}100%{opacity:1;transform:none;filter:none}}
#website .book-awake .hero-rise{animation:heroFloat 6s ease-in-out 2s infinite}
@keyframes heroFloat{0%,100%{translate:-50% 0}50%{translate:-50% -6px}}
#website .book-hero .book-scene .open-book{top:30%!important;height:70%!important}
@media(min-width:1024px){#website .book-hero .book-scene{height:clamp(330px,calc(100svh - 360px),560px)!important}}
@media(max-width:760px){#website .hero-rise{font-size:30px;line-height:1.12;top:14px}#website .hero-rise span{display:inline}#website .book-hero .book-scene{height:380px!important}#website .book-hero .book-scene .open-book{top:36%!important;height:62%!important}}
@media(prefers-reduced-motion:reduce){#website .hero-rise span{opacity:1;transform:none;filter:none;animation:none!important}#website .hero-rise{animation:none!important}}

/* Buttons at the far left and right, highlights in the middle (desktop) */
@media(min-width:1200px){
  #website .book-scroll-stage .book-invitation{display:grid!important;grid-template-columns:1fr auto 1fr;align-items:center;width:min(100% - 280px,1000px);max-width:none!important;margin:0 auto!important;column-gap:24px}
  #website .book-scroll-stage .book-invitation .actions{display:contents!important}
  #website .book-scroll-stage .book-invitation .hero-trust{grid-column:2;grid-row:1}
  #website .book-scroll-stage .book-invitation .actions>.button{grid-column:1;grid-row:1;justify-self:start;white-space:nowrap}
  #website .book-scroll-stage .book-invitation #bookExplore{grid-column:3;grid-row:1;justify-self:end;white-space:nowrap;display:inline-flex;align-items:center;gap:8px;min-height:52px;padding:0 22px;border-radius:14px;border:1.5px solid #cfd8cb;background:#fff;text-decoration:none;font-weight:600}
  #website .book-scroll-stage .book-invitation #bookExplore:hover{border-color:#173f2d}
  #website .book-scroll-stage .book-invitation .book-levels{grid-column:1/-1;grid-row:2;justify-self:center;margin-top:14px!important}
}

/* Vertical headline on the far left (desktop) */
/* stage stays sticky (book-hero.css); sticky is already a containing block */
#website .hero-vert{position:absolute!important;z-index:6;left:40px;top:50%;translate:0 calc(-50% - 150px)!important;width:auto!important;max-width:none!important;margin:0;text-align:left!important;
  display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding-left:22px;border-left:3px solid #d9b56a;
  font:700 22px/1.15 var(--font-head,'Plus Jakarta Sans',Inter,sans-serif)!important;letter-spacing:-.01em!important;color:#16211a}
#website .hero-vert span{display:block!important}
#website .hero-vert .hv-lead,#website .hero-vert .hv-tail{font:600 13px/1.4 Inter,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:#5c6456}
#website .hero-vert .hv-lead{margin-bottom:10px}
#website .hero-vert .hv-tail{margin-top:12px}
#website .hero-vert .hv-verb{font-size:clamp(32px,3.1vw,46px);line-height:1.02;letter-spacing:-.035em;color:#2f7a4f}
#website .hero-vert .hv-verb em{font-style:normal}
#website .hero-vert .hv-verb:nth-child(3) em{color:#3f8a5c}
#website .hero-vert .hv-verb:nth-child(4) em{color:#173f2d}
#website .hero-vert .hv-verb small{font:italic 400 .7em Georgia,serif;color:#b8923f;margin-right:2px}
#website .book-awake .hero-vert span{animation:hvIn 1s cubic-bezier(.16,1,.3,1) both}
#website .book-awake .hero-vert span:nth-child(1){animation-delay:.1s}
#website .book-awake .hero-vert span:nth-child(2){animation-delay:.3s}
#website .book-awake .hero-vert span:nth-child(3){animation-delay:.5s}
#website .book-awake .hero-vert span:nth-child(4){animation-delay:.7s}
#website .book-awake .hero-vert span:nth-child(5){animation-delay:.9s}
#website .book-awake .hero-vert{animation:none!important}
@keyframes hvIn{0%{opacity:0;transform:translateX(90px) scale(.6);filter:blur(6px)}100%{opacity:1;transform:none;filter:none}}
#website .hero-vert span{opacity:0}
/* book no longer needs headroom */
@media(min-width:1024px){#website .book-hero .book-scene .open-book{top:18%!important;height:78%!important}#website .book-hero .book-scene{margin-left:auto!important;margin-right:4%!important}}
/* Tablet / phone: stack above the book, centred, horizontal lines */
@media(max-width:1023px){
  #website .hero-vert{position:relative!important;left:auto;top:auto;translate:none!important;align-items:center;text-align:center!important;border-left:0;padding:0;margin:8px auto 0;gap:0}
  #website .hero-vert .hv-verb{font-size:34px}
  #website .hero-vert .hv-lead{margin-bottom:6px}#website .hero-vert .hv-tail{margin-top:8px}
}
@media(prefers-reduced-motion:reduce){#website .hero-vert span{opacity:1;animation:none!important}}
#website .hero-vert .hv-verb,#website .hero-vert .hv-verb em{font-weight:700!important;font-family:var(--font-head,'Plus Jakarta Sans',Inter,sans-serif)!important}
@media(min-width:1024px){#website .book-hero .book-scene .open-book{top:6%!important;height:88%!important}#website .book-hero .book-scene{height:clamp(300px,calc(100svh - 330px),540px)!important}}
@media(min-width:1200px){#website .book-scroll-stage .book-invitation .hero-trust{flex-wrap:nowrap}#website .book-scroll-stage .book-invitation .hero-trust li{padding:4px 14px;white-space:nowrap}}
@media(max-width:1023px){#website .book-hero .book-scene{height:280px!important}#website .book-hero .book-scene .open-book{top:6%!important;height:90%!important}}
@media(min-width:1024px){#website .book-scroll-stage .book-scene{flex:none!important;height:clamp(300px,calc(100svh - 300px),560px)!important}#website .book-scroll-stage{justify-content:center!important}}
@media(max-width:1023px){#website .book-scroll-stage .book-scene{flex:none!important}}

/* Longer hero: objects finish rising at ~60% of the scroll, then hold before the next section */
@media(min-width:761px){#website #home.book-hero{height:235svh!important;min-height:1200px!important}}
@media(max-width:760px){#website #home.book-hero{height:205svh!important}}
@media(prefers-reduced-motion:reduce){#website #home.book-hero{height:auto!important;min-height:0!important}}
/* Keep the book and everything that rises from it to the right of the headline */
@media(min-width:1024px){#website .book-scroll-stage .book-scene{width:calc(100% - clamp(200px,17vw,270px))!important;max-width:1080px!important;margin-left:auto!important;margin-right:0!important;align-self:flex-end}}
#website .book-scroll-stage>.lumi-guide{top:auto!important;bottom:110px!important}
@media(max-width:760px){#website .book-scroll-stage>.lumi-guide{bottom:70px!important}}
/* Hero bottom row: highlights + "See how it works", aligned left under the headline */
@media(min-width:1024px){
  #website .book-scroll-stage .book-invitation{display:flex!important;flex-direction:row!important;flex-wrap:wrap;justify-content:flex-start!important;align-items:center;gap:14px 28px!important;width:auto!important;max-width:none!important;margin:0 0 0 40px!important;text-align:left!important}
  #website .book-scroll-stage .book-invitation .hero-trust{justify-content:flex-start;margin:0}
  #website .book-scroll-stage .book-invitation .hero-trust li:first-child{padding-left:0}
  #website .book-scroll-stage .book-invitation .hero-trust li{align-items:flex-start}
  #website .book-scroll-stage .book-invitation .actions{display:flex!important;margin:0!important}
  #website .book-scroll-stage .book-invitation .book-levels{flex-basis:100%;margin:0!important;justify-self:auto;text-align:left}
}
@media(min-width:1024px){#website .book-scroll-stage .book-invitation .actions{margin-left:48px!important}}
/* Faint ink sketch on the page where each formula starts, fades as it lifts off */
#website .book-equations .eq-ghost{position:absolute;transform:translate(-50%,-50%) rotate(-4deg);font:italic 400 12px/1 Georgia,'Times New Roman',serif;color:#89704b;white-space:nowrap;pointer-events:none;opacity:1;mix-blend-mode:multiply;filter:blur(.2px)}
@media(max-width:760px){#website .book-equations .eq-ghost{font-size:9px}}
/* Formulas lift slightly and use 50% of their former size growth. */
#website #home .book-scroll-stage .book-equations .book-equation{transform:translate(var(--origin-x,0px),calc(var(--origin-y,180px) - var(--rise,0) * 8px)) scale(calc(.12 + var(--rise,0) * .44)) rotate(var(--angle))!important}
/* Smooth landing: correct header height from the first frame, and GPU-only entrance (no blur) */
#website #home{--visible-header:78px}
@keyframes hvIn{0%{opacity:0;transform:translate3d(40px,0,0)}100%{opacity:1;transform:none}}
#website .book-awake .hero-vert span{animation-duration:.9s!important;animation-timing-function:cubic-bezier(.22,1,.36,1)!important;will-change:transform,opacity}
#website .hero-vert span{filter:none!important}
