/* Dreambook iteration 4: complete marks, soft motion and room for the artwork. */
:root{--spring:cubic-bezier(.34,1.56,.64,1);--settle:cubic-bezier(.22,1,.36,1)}
.brand,.header .brand{width:64px;height:64px;background:transparent;border-radius:0;overflow:visible;box-shadow:none;transition:none;transform:none}
.brand img,.header .brand img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 0 #19327415)}
.brand:hover,.brand:focus-visible,.brand:active{transform:none}
.header{gap:25px}
.social-links{gap:9px;flex-wrap:nowrap}
.social,.header-social .social,.footer-social .social{width:41px;height:41px;flex:none;border:1.7px solid var(--navy);border-radius:36%;box-shadow:inset 0 0 0 2px #fff5d5cc;transform:scale(1);transform-origin:50% 50%;transition:transform 420ms cubic-bezier(.45,0,.2,1)}
.social img,.header-social .social img,.footer-social .social img{width:24px;height:24px}
.social:hover,.social:focus-visible{transform:scale(1.12);text-decoration:none!important}
.social:active{transform:scale(.97)}
.social.tiktok{background:var(--sky);border-color:var(--navy)}
.social.youtube{background:#ff8b99}
.footer-social{gap:13px;padding-block:5px}

/* Text links stay light: an existing underline changes color smoothly in both directions. */
.text-link{color:var(--navy);text-decoration-line:underline!important;text-decoration-color:#d3b65f!important;text-decoration-thickness:2px!important;text-underline-offset:5px;background:none;border:0;border-radius:0;transform:none;padding:0;margin-inline:0;transition:text-decoration-color 380ms ease-in-out,color 380ms ease-in-out}
.text-link:hover,.text-link:focus-visible{color:#122b71;text-decoration-color:var(--navy)!important;background:none;transform:none}
.header #navigation a{border:0;padding:9px 7px;margin-inline:0;text-decoration-color:transparent!important}
.header #navigation a:hover,.header #navigation a:focus-visible{text-decoration-color:var(--gold)!important}
.header #navigation a:hover{border:0}
.quiet-link,.policy-link{display:inline-flex;align-items:center;justify-content:flex-start;min-height:44px;padding:9px 0;margin-inline:0;border:0;border-radius:0;background:none;font-size:.875rem;line-height:1.6}
.quiet-link:hover,.quiet-link:focus-visible,.policy-link:hover,.policy-link:focus-visible{transform:none;background:none}
.safety-slide-copy .policy-link{margin-top:18px}
.footer-explore>nav:first-child a,.footer-bottom a{padding:7px 0;margin:-7px 0;display:inline-block;border-radius:0}
.footer-explore>nav:first-child a:hover,.footer-bottom a:hover{transform:none}
.skip{background-image:none}

/* Display the entire high-resolution plate, including its anti-aliased edge. */
/* Keep the label and hit area stationary. Only the painted bookplate changes tone. */
.art-button{min-height:82px;padding:25px 32px;overflow:visible;transform:none;transition:none}
.art-button:before{background-size:100% 100%;image-rendering:auto;filter:brightness(1);transition:filter 220ms cubic-bezier(.2,0,0,1)}
@media(hover:hover) and (pointer:fine){
 .art-button:not(:disabled):not([aria-disabled="true"]):hover:before{filter:brightness(1.06)}
}
.art-button:not(:disabled):not([aria-disabled="true"]):focus-visible:before{filter:brightness(1.06)}
.art-button:not(:disabled):not([aria-disabled="true"]):active:before{filter:brightness(.94);transition-duration:90ms}
.page-turn{transition:transform 380ms var(--spring)}
.page-turn:not(:disabled):hover{transform:scale(1.11) rotate(-3deg)}
.page-turn:not(:disabled):active{transform:scale(.94)}

.app-section{grid-template-columns:minmax(0,.68fr) minmax(0,1.32fr);gap:48px;align-items:center;padding-bottom:70px}
.product-demo-surface{padding:52px 56px 34px;border-radius:44px}
.product-demo-surface .device-stage{width:min(100%,550px);margin-inline:auto}
.caption-world{margin-bottom:24px}
.product-visual .carousel-controls{margin-top:28px;padding:32px 32px 44px;max-width:520px;width:100%}
.product-visual .carousel-navigation{margin-top:12px;gap:clamp(16px,2.5vw,28px)}
.carousel-caption{min-height:108px}
.story-section{padding-top:65px}
.character-intro{font:1rem/1.85 var(--font-body);max-width:440px;margin-top:22px}
.character-section .section-heading{align-items:center}
.safety-controls button{border:0;border-bottom:3px solid transparent;border-radius:0;background:transparent;transition:border-color 380ms ease-in-out,color 380ms ease-in-out}
.safety-controls button[aria-pressed=true]{background:transparent;border-bottom-color:var(--gold)}
.safety-controls button:hover,.safety-controls button:focus-visible{background:transparent;border-bottom-color:var(--sky);transform:none}
.safety-controls button[aria-pressed=true]:hover,.safety-controls button[aria-pressed=true]:focus-visible{background:transparent;border-bottom-color:var(--navy)}
.app-choices button[aria-pressed=true]>span:last-child{text-decoration:none}
.app-choices .choice-number{transition:background-color 250ms ease,transform 350ms var(--spring)}
.app-choices button:hover .choice-number{transform:scale(1.1)}
.signup-terms{font:.8125rem/1.85 var(--font-body);margin:0 0 15px;color:#585765;max-width:470px}
.signup-terms .text-link{color:var(--navy)}

/* The compact footer pair sits on the blue-to-white page boundary. */
.home-page .site-footer{padding-top:90px}

/* The legal documents keep their approved wording in a calmer reading layout. */
.legal-hero{background:var(--sky);padding:48px 0 44px}
.legal-hero h1{font-size:clamp(2.5rem,4.4vw,3.7rem)}
.legal-hero .legal-date{font:.875rem/1.7 var(--font-body);margin-top:18px;color:var(--navy)}
.legal-layout{display:grid;grid-template-columns:255px minmax(0,1fr);gap:70px;padding-block:54px 80px;align-items:start}
.legal-layout>aside{position:sticky;top:28px;max-height:calc(100svh - 56px);overflow:auto;scrollbar-width:thin}
.legal-toc{border:1.5px solid #c8e4f4;border-radius:22px;background:#f1f9ff;padding:19px 22px}
.legal-toc>summary{position:relative;padding-right:32px;font:1.05rem/1.5 var(--font-display);color:var(--navy);cursor:pointer;list-style:none}
.legal-toc>summary::-webkit-details-marker{display:none}
/* Two bars forming a plus that rotates into an x on open, rather than swapping + for -. */
.legal-toc>summary:before,.legal-toc>summary:after{content:'';position:absolute;right:2px;top:50%;width:14px;height:2px;border-radius:2px;background:var(--navy);transition:transform 320ms var(--settle)}
.legal-toc>summary:before{transform:translateY(-50%) rotate(90deg)}
.legal-toc>summary:after{transform:translateY(-50%)}
.legal-toc[open]>summary:before{transform:translateY(-50%) rotate(135deg)}
.legal-toc[open]>summary:after{transform:translateY(-50%) rotate(45deg)}
.legal-toc[data-faq-motion]{overflow:hidden}
@media(prefers-reduced-motion:reduce){.legal-toc>summary:before,.legal-toc>summary:after{transition:none}}

/* Focus ring: the inherited magenta is off-palette; brand navy reads as ours and still
   clears the 3:1 non-text contrast floor against the white field and the blue panels. */
input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--navy);outline-offset:3px}
/* The signup fields ease into focus: the ring is always present but transparent, so its
   colour (and a soft halo) can transition rather than snapping on the way an outline does. */
.updates-form>input{outline:3px solid transparent;outline-offset:2px;box-shadow:0 0 0 0 rgba(33,64,154,0);transition:border-color 280ms ease-in-out,outline-color 280ms ease-in-out,box-shadow 280ms ease-in-out}
.updates-form>input:focus-visible{outline-color:var(--navy);outline-offset:2px;border-color:var(--navy);box-shadow:0 0 0 5px rgba(33,64,154,.14)}
.updates-form>input:focus{border-color:var(--navy)}
@media(prefers-reduced-motion:reduce){.updates-form>input{transition:none}}

/* Typed text in brand navy rather than near-black, with the caret to match, and the
   placeholder in the muted blue the field's own border already uses. The labels above carry
   Coiny; the value deliberately stays in Domine, because an email is an unfamiliar string
   the person has to proof-read and a display face is where mistyped addresses hide. */
.updates-form>input{color:var(--navy);caret-color:var(--navy)}
.updates-form input::placeholder{color:#7087b5;opacity:1}

/* Chrome paints its own yellow-green wash over an autofilled field. A large inset shadow
   covers it without disturbing the real background; the text colour needs setting separately
   because autofill overrides that too. */
.updates-form>input:-webkit-autofill,
.updates-form>input:-webkit-autofill:hover,
.updates-form>input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 60px #fff inset;box-shadow:0 0 0 60px #fff inset;
  -webkit-text-fill-color:var(--navy);caret-color:var(--navy)}

/* :user-invalid rather than :invalid, so a half-typed address is never marked wrong —
   the field only objects once the person has left it or tried to submit. The crimson is the
   one the base stylesheet used to spend on every focus ring; an error is what it is for. */
.updates-form>input:user-invalid{border-color:#ae195c}
.updates-form>input:user-invalid:focus-visible{outline-color:#ae195c;box-shadow:0 0 0 5px rgba(174,25,92,.14)}
.legal-toc nav{display:flex;flex-direction:column;align-items:flex-start;gap:11px;margin-top:20px}
.legal-toc nav a{font:.8125rem/1.6 var(--font-body)}
.legal-switch{display:flex;flex-wrap:wrap;gap:15px;margin-top:25px;font:.8125rem/1.7 var(--font-display)}
.legal-content{max-width:805px;min-width:0;font:1rem/1.9 var(--font-body);overflow-wrap:anywhere}
.legal-content p+p{margin-top:19px}
.legal-content h2{font:1.7rem/1.35 var(--font-display);margin:46px 0 22px;padding-top:28px;border-top:2px solid var(--sky);scroll-margin-top:35px;text-wrap:pretty}
.legal-content h3{font:1.2rem/1.5 var(--font-display);color:var(--navy);margin:28px 0 14px;scroll-margin-top:35px}
.legal-content h4{font:1.05rem/1.5 var(--font-display);color:var(--navy);margin:24px 0 12px}
.legal-content ul,.legal-content ol{padding-left:24px;margin-block:18px}
.legal-content li+li{margin-top:10px}
.legal-content li::marker{color:var(--navy)}
.legal-content table{width:100%;border-collapse:collapse;min-width:580px;font-size:.875rem;line-height:1.75;margin-block:22px}
.legal-content td,.legal-content th{padding:15px;text-align:left;border:1px solid #c1ddef;vertical-align:top}
.legal-content th{background:#e2f4ff;color:var(--navy);font-family:var(--font-display);font-weight:400}
.legal-content blockquote{border-left:4px solid var(--gold);margin:24px 0;padding:10px 22px;background:#fff9e9;border-radius:0 15px 15px 0}
.legal-content a{color:var(--navy)}
.legal-page .site-footer{border-top:3px solid var(--sky);padding-top:60px}





@media(max-width:1100px){
 .header{flex-wrap:wrap;gap:0;padding-block:18px;min-height:96px}.header .brand{margin-right:25px}.header-social{margin-left:auto;margin-right:25px}.menu-toggle{display:flex;align-items:center;gap:10px;order:3;border:0;background:transparent;color:var(--navy);padding:12px 0;font:.9375rem var(--font-display)}
 .header #navigation{display:none;order:4;width:100%;margin:18px 0 0;padding:5px 0;gap:10px;font-size:.9375rem}.header #navigation.open{display:grid;grid-template-columns:repeat(3,1fr)}.header #navigation a{padding:10px}
 .app-section{grid-template-columns:1fr;gap:40px}.product-visual{width:min(830px,100%);justify-self:center}.product-demo-surface{padding:52px 60px 34px}.app-copy{max-width:710px}.app-copy>p:not(.eyebrow){max-width:670px}.legal-layout{grid-template-columns:225px minmax(0,1fr);gap:40px}
}
@media(max-width:980px){
 .app-section{grid-template-columns:1fr;gap:40px}.product-visual{width:min(830px,100%)}.product-demo-surface{padding:48px 56px 34px}.app-copy{max-width:710px}.app-copy>p:not(.eyebrow){max-width:670px}.app-section{padding-bottom:50px}
 .legal-layout{grid-template-columns:1fr;gap:32px}.legal-layout>aside{position:static;max-height:none;overflow:visible}.legal-toc nav{display:grid;grid-template-columns:1fr 1fr;gap:12px 25px}.legal-content{max-width:100%}
}
@media(max-width:700px){
 .header .brand{width:56px;height:56px;margin-right:0}.header-social{margin-right:22px;gap:7px}.header-social .social{width:35px;height:35px}.header-social .social img{width:18px;height:18px}.menu-toggle{font-size:0}.menu-toggle span{font:24px Arial,sans-serif}.header #navigation.open{grid-template-columns:1fr 1fr}
 .product-demo-surface{padding:40px 36px 28px;border-radius:32px}.caption-world{margin-bottom:24px}.product-visual .carousel-controls{padding:30px 23px 48px;margin-top:27px}.carousel-caption{min-height:132px}
 .story-section{padding-top:55px}.character-intro{font-size:1rem;max-width:380px}.character-section .section-heading{gap:28px}.character-section .section-heading>.lettering{max-width:38%}
 .safety-controls{gap:6px}.safety-controls button{border-radius:0;font-size:.75rem;padding:10px 3px}
 .legal-hero{padding-block:34px}.legal-layout{padding-block:30px 55px}.legal-toc{padding:18px 20px}.legal-content h2{font-size:1.5rem;margin-top:35px;padding-top:23px}.legal-content h3{font-size:1.15rem}.legal-hero .eyebrow{font-size:.75rem}
 .art-button{min-height:80px;padding:24px 28px}.quiet-link,.policy-link{font-size:.8125rem}
}
@media(max-width:430px){
 .header .brand{width:50px;height:50px}.header-social{gap:5px;margin-right:16px}.header-social .social{width:30px;height:30px;border-width:1.5px;box-shadow:inset 0 0 0 1.5px #fff5d5cc}.header-social .social img{width:18px;height:18px}
 .product-demo-surface{padding:34px 26px 24px;border-radius:26px}.product-visual .carousel-controls{padding:29px 20px 48px}.carousel-caption{min-height:155px}.carousel-caption h3{font-size:1.2rem}.story-section{padding-top:45px}
 .character-section .section-heading>.lettering{max-width:88%;margin-top:28px}.character-intro{max-width:100%;margin-top:20px}.safety-controls button{font-size:.75rem;overflow-wrap:anywhere}.safety-controls button>span{font-size:.75rem}
 .legal-toc nav{grid-template-columns:1fr}.legal-toc nav a{font-size:.875rem}.signup-terms{font-size:.8125rem}
}
@media(prefers-reduced-motion:reduce){.brand:hover,.social:hover,.social:focus-visible,.social:active,.page-turn:not(:disabled):hover,.art-button:hover{transform:none}.motion-toggle{display:none}}

/* Contact & support belongs to the same Dreambook world. */
.support-hero h1{max-width:850px}
.support-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:80px;padding-block:65px 75px;align-items:start}
.support-layout h2{font:clamp(1.6rem,2.3vw,2rem)/1.4 var(--font-display);color:var(--navy);margin-bottom:20px;text-wrap:balance}
.support-layout p{font:1rem/1.9 var(--font-body)}
.support-layout p+p{margin-top:18px}
.support-email{display:inline-block;font:clamp(1rem,2vw,1.3rem)/1.7 var(--font-display);overflow-wrap:anywhere;margin-top:20px;max-width:100%}
.support-response{font-size:.875rem!important;margin-top:12px!important;color:#585765}
.support-report{margin-top:42px;padding-top:30px;border-top:3px solid var(--sky)}
.support-accounts{padding:35px 38px 38px;background:#fff5d8;border:2px solid #efd37f;border-radius:28px 43px 30px 40px}
.support-accounts .eyebrow{font: .8125rem/1.7 var(--font-display);margin-bottom:12px}
.support-accounts nav{display:flex;flex-wrap:wrap;gap:15px 26px;margin-top:24px;font:.9375rem/1.7 var(--font-display)}
.support-reading{padding:30px 0 55px;border-top:2px solid #d2edfc;display:flex;gap:24px 50px;align-items:center;justify-content:space-between}
.support-reading p{font:1rem/1.8 var(--font-body);max-width:560px}
.support-reading nav{display:flex;gap:28px;flex-wrap:wrap;font:1rem/1.8 var(--font-display)}
@media(max-width:980px){.support-layout{gap:40px}.support-accounts{padding:28px}.support-reading{align-items:flex-start}}
@media(max-width:700px){.support-layout{grid-template-columns:1fr;gap:38px;padding-block:40px 45px}.support-accounts{padding:27px 25px;border-radius:24px 35px 26px 32px}.support-reading{flex-direction:column;gap:24px;padding-bottom:40px}.support-report{margin-top:32px;padding-top:26px}}

/* Brian’s original animated wordmark, with a still version for reduced motion. */
.hero-wordmark{display:block;width:min(100%,480px);margin:0 0 25px}
.hero-wordmark img{display:block;width:100%;height:auto}
@media(max-width:700px){.hero-wordmark{width:min(100%,420px);margin:0 auto 26px}}

.hero:has(.hero-wordmark){padding-top:42px;padding-bottom:50px}
.hero-copy:has(.hero-wordmark) h1{font-size:clamp(2.7rem,3.8vw,3.45rem)}
@media(max-width:700px){.hero:has(.hero-wordmark){padding-top:30px;padding-bottom:44px}.hero-copy:has(.hero-wordmark) h1{font-size:clamp(2.7rem,7.8vw,3.4rem)}}

/* Parent-facing reasons to care; the blue carousel owns the app walkthrough. */
.experience-benefits{display:grid;gap:23px;margin:30px 0 0;padding:0;max-width:440px}
.experience-benefits>div{padding-left:19px;border-left:3px solid var(--gold)}
.experience-benefits>div:nth-child(2){border-left-color:var(--sky)}
.experience-benefits>div:nth-child(3){border-left-color:#f781ca}
.experience-benefits dt{font:1.1rem/1.45 var(--font-display);color:var(--navy);margin-bottom:7px}
.experience-benefits dd{font:1rem/1.8 var(--font-body);margin:0}
@media(min-width:701px) and (max-width:1100px){.experience-benefits{max-width:none;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.experience-benefits>div{padding-left:15px}}
@media(max-width:700px){.experience-benefits{gap:23px;margin-top:28px;max-width:460px}}

@media(max-width:430px){.product-visual .page-turn{width:48px;height:48px;flex-basis:48px}.product-visual .page-turn img{width:48px;height:48px}}

/* Blue ink for the shared illustrated scroll; text and images keep their own colours. */
.svg-definitions{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}

/* Give the footer links the width they need, without shrinking the type. */
.site-footer>.wrap{width:min(1320px,calc(100% - 64px))}
.site-footer .footer-main{grid-template-columns:auto minmax(0,1fr);gap:36px}
.site-footer .footer-explore{min-width:0}
.site-footer .footer-explore>nav:first-child{flex-wrap:wrap;gap:14px clamp(14px,1.5vw,24px)}
.site-footer .footer-explore>nav:first-child a{white-space:nowrap}
@media(max-width:1100px){.site-footer .footer-main{grid-template-columns:1fr;gap:24px}.site-footer .footer-brand{justify-content:center}.site-footer .footer-explore{align-items:center}.site-footer .footer-explore>nav:first-child{justify-content:center}}
@media(max-width:700px){.site-footer>.wrap{width:calc(100% - 40px)}.site-footer .footer-explore>nav:first-child{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 24px;width:min(440px,100%);text-align:center}.site-footer .footer-explore>nav:first-child a{white-space:normal;font-size:.875rem;line-height:1.6}}

/* One illustrated spread encloses the parent benefits and the app walkthrough. */
.app-section.wrap{width:min(1340px,calc(100% - 56px))}
.app-section{position:relative;isolation:isolate;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:40px;align-items:center;margin-block:78px 65px;padding:64px 44px 60px}
.app-section:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border:solid transparent;border-width:48px 62px 62px;border-image-source:url('/assets/carousel-bookplate.png');border-image-slice:140 180 200 180;border-image-repeat:stretch;filter:url(#dreambook-scroll-blue)}
.app-section:after{content:"";position:absolute;inset:15px 22px 22px;z-index:-2;pointer-events:none;border-radius:44px;background:linear-gradient(105deg,#fffaf0 0%,#fffaf0 35%,#e8f6ff 56%,#d6efff 100%)}
.app-section .app-copy{align-self:stretch;display:flex;flex-direction:column;min-width:0;padding:16px 0 12px}
.app-section .app-copy>p:not(.eyebrow){margin:25px 0 20px}
.app-section .experience-benefits{margin-top:auto;padding-top:26px;gap:18px}
.app-section .product-visual{position:relative;width:100%;max-width:none;min-width:0;margin:0;align-self:center}
.product-visual .caption-world{position:absolute;z-index:3;top:-22px;right:4px;width:220px;max-width:none;height:auto;margin:0;transform:rotate(6deg);transform-origin:65% 60%;pointer-events:none}
.product-visual .product-demo-surface{position:relative;isolation:isolate;background:transparent;padding:68px 14px 0;border-radius:0}
.product-visual .product-demo-surface:before{content:none}
.product-visual .device-stage{width:min(100%,640px);aspect-ratio:1.5;margin-inline:auto}
.product-visual .device-tablet{top:0;width:82%}
.product-visual .device-phone{width:25%}
.product-visual .carousel-controls{display:grid;grid-template-columns:48px minmax(0,1fr) 48px;column-gap:14px;row-gap:8px;align-items:center;width:min(100%,650px);max-width:none;margin:18px auto 0;padding:12px 12px 0}
.product-visual .carousel-controls:before{content:none}
.product-visual .carousel-caption{grid-column:2;grid-row:1;min-height:92px;display:flex;flex-direction:column;justify-content:center;text-align:center}
.product-visual .carousel-caption h3{font-size:1.25rem;line-height:1.35;text-wrap:balance}
.product-visual .carousel-caption p{margin:7px auto 0;max-width:36ch;font-size:1rem;line-height:1.55;text-wrap:pretty}
.product-visual .carousel-navigation{display:contents}
.product-visual .carousel-navigation .previous{grid-column:1;grid-row:1}
.product-visual .carousel-navigation .next{grid-column:3;grid-row:1}
.product-visual .carousel-navigation .slide-number{grid-column:2;grid-row:2;justify-self:center;font-size:.875rem;line-height:1.5}
.product-visual .page-turn{width:48px;height:48px;flex-basis:48px;justify-self:center}
.product-visual .page-turn img{width:48px;height:48px}
@media(max-width:1100px){
 .app-section{grid-template-columns:1fr;gap:42px;padding:60px 42px 56px}.app-section:after{background:linear-gradient(180deg,#fffaf0 0%,#fffaf0 32%,#e8f6ff 54%,#d6efff 100%)}
 .app-section .app-copy{display:block;max-width:none;padding:0}.app-section .experience-benefits{margin-top:26px;padding-top:0}.app-section .product-visual{width:min(830px,100%);justify-self:center}.product-visual .caption-world{right:6px}
}
@media(max-width:700px){
 .app-section.wrap{width:calc(100% - 24px)}.app-section{gap:42px;margin-block:55px 35px;padding:44px 24px 42px}.app-section:before{border-width:30px 30px 40px}.app-section:after{inset:10px 12px 14px;border-radius:25px;background:linear-gradient(180deg,#fffaf0 0%,#fffaf0 40%,#e8f6ff 67%,#d6efff 100%)}
 .app-section .app-copy>p:not(.eyebrow){margin:22px 0}.app-section .experience-benefits{margin-top:26px;gap:21px}
 .product-visual .caption-world{top:-16px;right:0;width:198px;transform:rotate(5deg)}
 .product-visual .product-demo-surface{padding:65px 2px 0}
 .product-visual .device-stage{aspect-ratio:1.45}.product-visual .device-tablet{width:84%}.product-visual .device-phone{width:26%}
 .product-visual .carousel-controls{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);column-gap:16px;padding:8px 4px 0;margin-top:18px}
 .product-visual .carousel-caption{grid-column:1/-1;grid-row:1;min-height:96px}
 .product-visual .carousel-navigation .previous{grid-column:1;grid-row:2;justify-self:end}.product-visual .carousel-navigation .next{grid-column:3;grid-row:2;justify-self:start}
 .product-visual .carousel-navigation .slide-number{grid-column:2;grid-row:2}
}
@media(max-width:430px){
 .app-section{padding-inline:22px}.product-visual .caption-world{width:176px;top:-14px;right:2px}.product-visual .product-demo-surface{padding-top:58px}.product-visual .carousel-caption{min-height:140px}.product-visual .carousel-caption h3{font-size:1.125rem}
}

/* A distinct family promise, grounded in the choices the plans actually offer. */
.pricing-promise{grid-template-columns:156px minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:center;padding:36px 40px;margin-block:14px 8px;border:0;border-radius:32px;background:#fff6df;box-shadow:inset 0 3px 0 #f9b91980}
.pricing-promise .promise-art{width:156px;height:156px;object-fit:contain}
.pricing-promise .eyebrow{font-size:.875rem;margin-bottom:12px}
.pricing-promise h2{font-size:clamp(1.85rem,2.5vw,2.25rem);line-height:1.2;margin-bottom:14px;text-wrap:balance}
.pricing-promise p{font-size:1rem;line-height:1.75}
.pricing-promise .pricing-details{padding-left:28px;border-left:2px solid #e9ca79}
.pricing-promise .promise-points{display:grid;gap:17px;margin:0}
.pricing-promise .promise-points dt{font:1.0625rem/1.5 var(--font-display);color:var(--navy);margin-bottom:5px}
.pricing-promise .promise-points dd{font:1rem/1.7 var(--font-body);margin:0}
.pricing-promise .renewal-note{font-size:.875rem;line-height:1.65;margin-top:15px}
.pricing-promise .quiet-link{font-size:1rem;margin-top:10px}
@media(max-width:980px){
 .pricing-promise{grid-template-columns:132px minmax(0,1fr);gap:22px 28px;padding:32px}.pricing-promise .promise-art{grid-column:1;grid-row:1/3;width:132px;height:132px;align-self:start;margin-top:20px}.pricing-promise .promise-copy{grid-column:2}.pricing-promise .pricing-details{grid-column:2;padding:22px 0 0;border-left:0;border-top:2px solid #e9ca79}.pricing-promise .promise-points{grid-template-columns:1fr 1fr;gap:24px}
}
@media(max-width:700px){
 .pricing-promise{grid-template-columns:80px minmax(0,1fr);gap:22px 18px;padding:28px 24px;border-radius:26px}.pricing-promise .promise-art{grid-column:1;grid-row:1;width:80px;height:100px;margin:0;align-self:center}.pricing-promise .promise-copy{grid-column:2}.pricing-promise h2{font-size:1.75rem}.pricing-promise .eyebrow{font-size:.8125rem}.pricing-promise .promise-copy>p:last-child{font-size:.9375rem}.pricing-promise .pricing-details{grid-column:1/-1}.pricing-promise .promise-points{grid-template-columns:1fr;gap:18px}
}

/* The small slogan, navigation and socials share one compact desktop row. */
.site-footer .footer-main{grid-template-columns:auto minmax(0,1fr) auto;gap:24px;align-items:center;padding-bottom:22px}
.site-footer .footer-brand{gap:12px;justify-content:flex-start}
.site-footer .footer-brand .brand{width:48px;height:48px;flex:0 0 48px}
.site-footer .footer-slogan{width:168px;height:84px;max-width:none;object-fit:cover;object-position:center}
.site-footer .footer-explore{display:contents}
.site-footer .footer-explore>nav:first-child{justify-content:center;gap:14px 18px;font-size:.875rem}
.site-footer .footer-social{justify-self:end;gap:8px;padding:4px 0}
.site-footer .footer-social .social{width:36px;height:36px}
.site-footer .footer-social .social img{width:21px;height:21px}
.home-page .site-footer{padding-top:62px}
.site-footer .footer-bottom{padding:17px 0 22px;gap:18px}
@media(max-width:1180px){
 .site-footer .footer-main{grid-template-columns:1fr auto;gap:16px 24px}.site-footer .footer-brand{grid-column:1;grid-row:1}.site-footer .footer-social{grid-column:2;grid-row:1}.site-footer .footer-explore>nav:first-child{grid-column:1/-1;grid-row:2;justify-content:space-between}
}
@media(max-width:700px){
 .site-footer .footer-main{grid-template-columns:1fr;gap:20px;padding-bottom:20px}.site-footer .footer-brand{grid-column:1;grid-row:1;justify-content:center}.site-footer .footer-explore>nav:first-child{grid-column:1;grid-row:2;justify-self:center;justify-content:center}.site-footer .footer-social{grid-column:1;grid-row:3;justify-self:center}.home-page .site-footer{padding-top:56px}.site-footer .footer-bottom{padding-bottom:20px}
}

/* The artwork itself is the quiet, keyboard-accessible discovery target. */
.discovery-art{appearance:none;display:block;margin:0;padding:0;border:0;border-radius:18px;background:transparent;min-width:0;line-height:0;cursor:pointer;touch-action:pan-y}
.discovery-art>img{display:block;width:100%;height:100%;object-fit:contain;transform-origin:50% 60%;pointer-events:none;user-select:none}
.safety-art.discovery-art{width:250px;height:250px;max-width:100%;justify-self:center;align-self:center}
.discovery-art[data-discovery="voice"]>img{transform-origin:50% 75%}
.discovery-art[data-discovery="promise"]>img{transform-origin:50% 65%}
.discovery-art:focus-visible{outline:3px solid #ae195c;outline-offset:6px}
@media(max-width:980px){.safety-art.discovery-art{width:230px;height:230px}}
@media(max-width:700px){.safety-art.discovery-art{width:220px;height:220px}}

/* The original lettering stays still; only colour travels through its blue and gold ink. */
.living-lettering{position:relative;display:block;touch-action:pan-y pinch-zoom}
.living-lettering>img{display:block;width:100%;height:auto;pointer-events:none}
.living-lettering>.living-ink-layer{position:absolute;inset:0;display:block;width:100%;height:100%;opacity:0;overflow:hidden;pointer-events:none}
.living-lettering>.living-ink-layer.is-ready{opacity:1}
@media(prefers-reduced-motion:reduce){.living-lettering>.living-ink-layer{display:none}}

/* The original paired artwork keeps its exact seating line; only local character areas move. */
.footer-friends>.footer-friends-source{display:block;width:100%;height:auto;pointer-events:none}
.footer-friends>.footer-friends-stage{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none}
.footer-reaction-button{position:absolute;display:block;appearance:none;border:0;border-radius:24px;background:transparent;padding:0;margin:0;min-width:44px;min-height:44px;cursor:pointer;pointer-events:auto;touch-action:pan-y}
.deery-reaction{left:28%;top:22%;width:23%;height:54%}
.bunny-reaction{left:47.5%;top:16.5%;width:23%;height:60%}
.footer-reaction-button:focus-visible{outline:3px solid #ae195c;outline-offset:2px}
@media(prefers-reduced-motion:reduce){.footer-friends>.footer-friends-stage{display:none}}

/* Brian's original hero paths, with independent quiet discovery moments. */
.hero-art[data-hero-moments]{position:relative}
.hero-art>.hero-art-source{display:block;width:100%;height:auto;opacity:0;pointer-events:none}
.hero-art>.hero-art-stage{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none}
.hero-reaction-button{appearance:none;position:absolute;display:block;padding:0;margin:0;border:0;background:transparent;border-radius:35%;min-width:44px;min-height:44px;cursor:pointer;touch-action:pan-y pinch-zoom}
.hero-reaction-button:focus-visible{outline:3px solid #f9b919;outline-offset:2px}
.hero-reaction-bunny{left:32%;top:29%;width:26%;height:69%}
.hero-reaction-deery{left:57%;top:29%;width:30%;height:69%}
.hero-reaction-friend{left:12%;top:63%;width:29%;height:35%}
.hero-reaction-dinosaur{left:14%;top:22%;width:12%;height:17%}
.hero-reaction-astronaut{left:20%;top:0;width:12%;height:17%}
.hero-reaction-planet{left:55%;top:6%;width:22%;height:20%}
.hero-reaction-stars{left:45.5%;top:9%;width:9%;height:18%}
.hero-reaction-ufo{left:75.5%;top:20.5%;width:11%;height:9%}
@media(prefers-reduced-motion:reduce){.hero-reaction-button{cursor:default}}

/* Keep the corner lettering’s original angle and proportions; make its ink interactive. */
.product-visual .caption-world.living-lettering{pointer-events:auto}

/* A compact icon and restrained, reversible menu reveal. */
.navigation-links{display:contents}
.menu-toggle .menu-glyph{position:relative;display:block;width:22px;height:2px;background:currentColor;border-radius:2px;transition:background-color .14s ease}
.menu-glyph::before,.menu-glyph::after{content:"";position:absolute;inset:0;background:currentColor;border-radius:inherit;transition:transform .16s ease}
.menu-glyph::before{transform:translateY(-7px)}
.menu-glyph::after{transform:translateY(7px)}
.menu-toggle[aria-expanded="true"] .menu-glyph{background:transparent}
.menu-toggle[aria-expanded="true"] .menu-glyph::before{transform:rotate(45deg)}
.menu-toggle[aria-expanded="true"] .menu-glyph::after{transform:rotate(-45deg)}
@media(max-width:1100px){
 .header #navigation,.header #navigation.open{display:grid;grid-template-columns:1fr;grid-template-rows:0fr;align-items:stretch;gap:0;margin:0;padding:0;opacity:0;visibility:hidden;pointer-events:none;transform:none;transition:grid-template-rows .2s ease,margin .2s ease,padding .2s ease,opacity .16s ease,visibility 0s .2s}
 .header #navigation .navigation-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));min-height:0;overflow:hidden;gap:0 10px}
 .header #navigation.open{grid-template-rows:1fr;margin-top:18px;padding-block:5px;opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0);transition-delay:0s}
 .menu-toggle{min-height:44px;min-width:44px;justify-content:center;gap:0;padding:12px;font-size:0}
}
@media(max-width:700px){.header #navigation .navigation-links{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.header #navigation,.header #navigation.open,.menu-toggle .menu-glyph,.menu-glyph::before,.menu-glyph::after{transition:none}.header #navigation,.header #navigation.open{transform:none}}

/* The small footer cutout keeps the exact crop of its original image. */
.site-footer .footer-slogan.living-lettering{flex:0 0 168px;overflow:hidden;line-height:0}
.site-footer .footer-slogan.living-lettering>img,.site-footer .footer-slogan.living-lettering>.living-ink-layer{width:100%;height:100%;object-fit:cover;object-position:center}

/* A quiet plus-to-minus cue accompanies the FAQ disclosure. */
.faq-list summary::before,.faq-list summary::after,.faq-list details[open] summary::after{content:"";position:absolute;right:7px;font:inherit;top:calc(23px + .72em);width:16px;height:2px;border-radius:2px;background:currentColor;transform-origin:center;transition:transform .18s ease}
.faq-list summary::before{transform:rotate(90deg)}
.faq-list details[open]:not([data-faq-motion])>summary::before,.faq-list details[data-faq-expanded="true"]>summary::before{transform:rotate(90deg) scaleX(0)}
@media(prefers-reduced-motion:reduce){.faq-list summary::before,.faq-list summary::after{transition:none}}

/* The product origin volume reuses the approved scroll and page-turn artwork. */
.origin-section{padding-block:78px 70px;background:linear-gradient(180deg,#fff 0%,#eef9ff 24%,#eef9ff 80%,#fff 100%)}
.origin-section>.wrap{width:min(1180px,calc(100% - 56px))}
.origin-heading{text-align:center;max-width:700px;margin:0 auto 35px}
.origin-heading h2{font-size:clamp(2.1rem,4.4vw,3.25rem);line-height:1.14}
.origin-heading>p:last-child{max-width:47ch;margin:20px auto 0;font-size:1rem;line-height:1.75;text-wrap:pretty}
.origin-book{min-width:0;outline-offset:8px}
.origin-spreads{position:relative;isolation:isolate}
.origin-spread{position:relative;isolation:isolate;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:80px;padding:65px 64px;min-height:590px;margin-bottom:28px}
.origin-spread:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border:solid transparent;border-width:42px 50px 56px;border-image:url('/assets/carousel-bookplate.png') 140 180 200 180 stretch}
.origin-spread:after{content:"";position:absolute;inset:14px 18px 22px;z-index:-2;pointer-events:none;border-radius:30px;background:linear-gradient(90deg,#eaf7ff 0%,#f4fbff 45%,#dae4e8 49.5%,#bdcbd2 50%,#e8e1d2 50.5%,#fffaf0 55%,#fffaf0 100%);box-shadow:0 13px 28px #21409a0b}
.origin-book.is-enhanced .origin-spreads{display:grid}
.origin-book.is-enhanced .origin-spread{grid-area:1/1;visibility:hidden;pointer-events:none;margin:0}
.origin-book.is-enhanced .origin-spread.is-current{visibility:visible;pointer-events:auto}
.origin-illustration{align-self:center;display:grid;align-content:center;justify-items:center;gap:18px;min-width:0;padding-right:4px;text-align:center}
.origin-illustration img{width:min(100%,350px);height:340px;object-fit:contain;user-select:none}
.origin-illustration figcaption{max-width:28ch;color:#334879;font:1rem/1.6 var(--font-body);text-wrap:pretty}
.origin-illustration--screen img{height:auto;width:100%;border:5px solid #26334b;border-radius:12px;box-shadow:0 10px 20px #21409a15}
.origin-illustration--character img{height:350px;object-fit:contain}
.origin-illustration--lettering img{height:auto;width:100%;max-height:290px;object-fit:contain}
.origin-copy{min-width:0;align-self:center;padding:0;max-width:46ch}
.origin-chapter{color:#54658c;font:.875rem/1.5 var(--font-display);letter-spacing:.11em;margin-bottom:14px}
.origin-copy h3{color:var(--navy);font:clamp(1.65rem,2.6vw,2.3rem)/1.2 var(--font-display);text-wrap:balance;margin-bottom:23px}
.origin-copy>p:not(.origin-chapter){font-size:1rem;line-height:1.8;margin-top:15px;text-wrap:pretty}
.origin-copy>.origin-last-line{color:var(--navy)}
.origin-reader-controls{max-width:580px;margin:17px auto 0}
.origin-navigation{display:grid;grid-template-columns:52px minmax(0,1fr) 52px;gap:22px;align-items:center}
.origin-position{text-align:center;color:var(--navy);display:grid;gap:4px;font:1rem/1.5 var(--font-display)}
.origin-position [data-origin-progress]{font-size:.875rem;letter-spacing:.12em}
.origin-position [data-origin-title]{font-size:1rem;text-wrap:balance}
.origin-book .page-turn[aria-disabled="true"]{opacity:.3;cursor:default;transform:none}
.origin-chapters{display:flex;justify-content:center;gap:9px;margin-top:16px}
.origin-chapters button{display:grid;place-items:center;min-width:44px;min-height:44px;padding:8px 6px;border:0;border-bottom:3px solid transparent;background:transparent;color:var(--navy);font:.9375rem/1.3 var(--font-display);transition:border-color 250ms ease}
.origin-chapters button[aria-current="page"]{border-bottom-color:var(--gold)}
.origin-chapters button:hover{border-bottom-color:var(--sky)}
.origin-reading-hint{margin:15px auto 0;text-align:center;font:.875rem/1.6 var(--font-body);color:#4f5e7b}
.origin-companion{margin:33px auto 0;max-width:52ch;text-align:center;font:1rem/1.8 var(--font-body);color:var(--navy)}
.origin-companion a{display:inline-block;margin-top:6px}
.origin-book.is-enhanced .origin-spreads{touch-action:pan-y pinch-zoom}
@media(max-width:1000px){
 .origin-section>.wrap{width:calc(100% - 32px)}
 .origin-spread{grid-template-columns:repeat(2,minmax(0,1fr));gap:56px;padding:52px 38px;min-height:630px}
 .origin-illustration img,.origin-illustration--character img{height:280px}
 .origin-illustration--screen img,.origin-illustration--lettering img{height:auto}
 .origin-copy h3{font-size:1.8rem}
}
@media(max-width:700px){
 .origin-section{padding-block:50px}
 .origin-section>.wrap{width:calc(100% - 24px)}
 .origin-heading{padding-inline:10px;margin-bottom:26px}
 .origin-heading .eyebrow{font-size:.75rem;letter-spacing:.08em}
 .origin-spread{grid-template-columns:1fr;align-content:start;gap:22px;padding:36px 28px 44px;min-height:0}
 .origin-spread:before{border-width:30px 28px 38px}
 .origin-spread:after{inset:10px 10px 15px;border-radius:22px;background:linear-gradient(180deg,#eaf7ff,#f4fbff 245px,#fffaf0 320px)}
 .origin-illustration{padding:0;gap:8px}
 .origin-illustration img,.origin-illustration--character img{height:205px;width:min(100%,290px)}
 .origin-illustration--screen img{height:auto;width:min(100%,280px)}
 .origin-illustration--lettering img{height:155px;width:min(100%,280px)}
 .origin-illustration figcaption{max-width:30ch;font-size:.875rem;line-height:1.6}
 .origin-copy{padding:0}
 .origin-chapter{margin-bottom:10px;font-size:.8125rem}
 .origin-copy h3{font-size:1.8rem;line-height:1.22;margin-bottom:20px}
 .origin-copy h3 br{display:none}
 .origin-copy>p:not(.origin-chapter){font-size:1rem;line-height:1.8;margin-top:14px}
 .origin-reader-controls{padding-inline:8px}
 .origin-navigation{gap:10px}
 .origin-chapters{gap:4px}
 .origin-position [data-origin-title]{font-size:.875rem}
 .origin-reading-hint{max-width:30ch}
 .origin-companion{padding-inline:12px;margin-top:28px}
}
@media(prefers-reduced-motion:reduce){.origin-book .page-turn,.origin-chapters button{transition:none}.origin-book .page-turn:hover,.origin-book .page-turn:active{transform:none}}

/* Refreshed illustration layers, registered to the original device canvases.
   Base screenshots preserve the app controls, prose and selection states. */
.product-visual .device-screen { position:relative; width:100%; container-type:inline-size; overflow:hidden; }
.product-visual .device-screen .screen-art { position:absolute; display:block; overflow:hidden; pointer-events:none; }
.product-visual .device-screen .screen-art > img { width:100%; height:100%; object-fit:fill; display:block; }
.product-visual .device-screen .screen-ui-fragment { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.product-visual .mood-tablet .mood-art { border-radius:1.5% / 2%; }
.product-visual .mood-phone .mood-art { border-radius:5% / 6.7%; }
.product-visual .story-tablet .story-art { border-radius:2.7% 0 0 2.7% / 1.8% 0 0 1.8%; }
.product-visual .narrator-art { border-radius:11%; }
.product-visual .device-screen .narrator-art > img { position:absolute; width:200%; height:200%; max-width:none; }
.product-visual .narrator-kate > img { left:0; top:0; }
.product-visual .narrator-graham > img { left:-100%; top:0; }
.product-visual .narrator-aya > img { left:0; top:-100%; }
.product-visual .narrator-dave > img { left:-100%; top:-100%; }
.product-visual .narrator-art::after { content:'Ready'; position:absolute; inset:auto 2% 2%; height:13%; background:#34489ae6; color:white; border-radius:999px; display:flex; align-items:center; justify-content:center; font-family:Georgia,serif; font-weight:400; line-height:1; letter-spacing:0; }
.product-visual .narrator-tablet .narrator-art::after { font-size:.88cqw; }
.product-visual .narrator-phone .narrator-art::after { font-size:3.15cqw; }

/* Original design images and app art assembled as a small paper collage.
   Source pixels remain unchanged; each historical crop is described in its alt text. */
.origin-collage{gap:14px;width:100%}
.collage-stage{position:relative;isolation:isolate;width:100%;max-width:400px;aspect-ratio:1/1}
.collage-piece{position:absolute;display:block;min-width:0}
.collage-piece.paper{overflow:hidden;background:#fffaf0;padding:6px;border:1px solid #d3cbb7;box-shadow:0 8px 12px #2539641c}
.origin-collage .collage-piece img{display:block;width:100%;height:100%;max-width:none;object-fit:contain;border:0;border-radius:0;box-shadow:none}
.collage-piece.cutout img{filter:drop-shadow(0 6px 4px #25396418)}
.collage-piece.welcome{left:3%;top:7%;width:86%;height:65%;transform:rotate(-5deg)}
.collage-piece.icons{left:20%;top:65%;width:74%;height:25%;transform:rotate(5deg)}
.origin-collage .icons img{position:absolute;width:145%;height:auto;left:-8%;top:-72%}
.collage-piece.studies{left:3%;top:15%;width:69%;height:65%;transform:rotate(-7deg)}
.origin-collage .studies img{position:absolute;width:260%;height:auto;left:-8%;top:-20%}
.collage-piece.saya{left:42%;top:3%;width:57%;height:93%;transform:rotate(4deg)}
.collage-piece.mood-study{left:3%;top:5%;width:88%;height:66%;transform:rotate(-6deg)}
.collage-piece.heartwarming{left:13%;top:40%;width:83%;height:57%;transform:rotate(5deg)}
.origin-collage .heartwarming img{object-fit:cover}
.collage-piece.early-reading{left:3%;top:9%;width:86%;height:65%;transform:rotate(-6deg)}
.collage-piece.current-reading{left:55%;top:25%;width:39%;height:71%;transform:rotate(6deg);border:4px solid #26334b;border-radius:12px;padding:0;background:#26334b}
.origin-collage .current-reading img{object-fit:cover}
.collage-piece.robbie-cover{left:6%;top:9%;width:44%;height:66%;transform:rotate(-9deg)}
.collage-piece.naomi-cover{left:38%;top:18%;width:44%;height:66%;transform:rotate(7deg)}
.collage-piece.naomi{left:58%;top:42%;width:40%;height:56%;transform:rotate(3deg)}
.collage-piece.warmth-early{left:2%;top:1%;width:57%;height:55%;transform:rotate(-5deg)}
.collage-piece.warmth-current{left:14%;top:46%;width:85%;height:54%;transform:rotate(4deg)}
.origin-collage .collage-piece.warmth-current img{object-fit:cover}
.collage-piece.naomi-early{left:3%;top:7%;width:46%;height:46%;transform:rotate(-6deg)}
.collage-piece.naomi-later{left:28%;top:39%;width:47%;height:52%;transform:rotate(5deg);background:#eaf7ff}
.origin-collage .collage-piece.naomi-later img{position:absolute;width:140%;height:auto;left:-20%;top:-40%}
.collage-piece.naomi-current{left:54%;top:2%;width:46%;height:94%;transform:rotate(3deg)}

/* Motion is still respected via the OS-level prefers-reduced-motion setting; the manual toggle control was removed. */
.motion-paused{scroll-behavior:auto}
.motion-paused *,.motion-paused *::before,.motion-paused *::after{transition:none!important;animation:none!important}
.motion-paused .living-lettering>.living-ink-layer{display:none}
/* Text enlargement may need a second navigation line without pushing social links off-screen. */
@media(min-width:1101px){.header #navigation{min-width:0;flex-wrap:wrap}}
@media(max-width:700px){.origin-collage{gap:10px}.collage-stage{max-width:290px}.origin-collage .collage-piece img{width:100%;height:100%}.origin-collage .icons img{width:145%;height:auto}.origin-collage .studies img{width:260%;height:auto}.collage-piece.paper{padding:4px}.collage-piece.current-reading{padding:0;border-width:3px;border-radius:9px}}

/* Body copy on the sky-blue sections reads as navy, not ink. Every heading, eyebrow and
   callout on those sections already uses --navy; these lead paragraphs were the last text
   still set in --ink, whose hard near-black clashes against the saturated blue. Both are
   existing palette tokens, and navy on --sky still clears WCAG AA (5.32:1). */
.hero .intro,.interior-hero p:not(.eyebrow){color:var(--navy)}

/* Early-access section subheading: sits under the reused "Wonka" living-lettering caption,
   scaled down from the old standalone CTA emphasis style since the caption now carries the weight. */
.early-access-subheading{margin-top:14px;font:600 1.05rem/1.5 var(--font-display);color:var(--ink)}

/* Gold-button: the pre-launch Early Access CTA. A struck-coin treatment in brand gold —
   navy rim and navy Coiny lettering to match the logo and the navy outlines carried by
   every character illustration, with a radial glint and a solid navy ledge it presses into.
   Static by design: no canvas, no animation beyond the hover/press affordance. */
.gold-button{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;padding:17px 36px;min-height:60px;min-width:220px;text-align:center;text-decoration:none;font:1.05rem/1.2 var(--font-display);letter-spacing:.01em;color:#fff;font-weight:700;text-shadow:0 2px 4px rgba(110,62,6,.4);cursor:pointer;background:transparent;border:0}
.gold-fog{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
@media(max-width:430px){.gold-button{width:100%}}
