/* A clear centre with the spiral tile field observed in Cosmos's public hero. */
:root{--hero-height:820px;--hero-title:clamp(40px,5vw,72px);--hero-reveal:500ms;--logo-canvas:#fff;--logo-line:rgb(13 13 13 / .12)}
.hero.cosmos-hero{position:relative;isolation:isolate;min-height:min(var(--hero-height),calc(100svh - 76px));margin:0 calc(-1 * var(--grid-margin));padding:var(--space-page) var(--grid-margin);background:var(--paper);overflow:clip;align-items:center;border:0}
.cosmos-hero .hero-copy{grid-column:4/10;position:relative;z-index:1;text-align:center;justify-self:stretch;align-self:center;padding-block:var(--space-block)}
.cosmos-hero h1{font-size:var(--hero-title);max-width:none;line-height:1.06;letter-spacing:-.035em;margin-bottom:var(--space-part)}
.cosmos-hero .hero-meta{color:var(--muted);margin-bottom:var(--space-part)}
.cosmos-hero .hero-deck{color:var(--muted);max-width:40ch;margin-inline:auto;font-size:var(--heading);line-height:1.5}
.cosmos-hero .hero-actions{justify-content:center;margin-top:var(--space-section)}
.hero-art{position:absolute;inset:0;pointer-events:none;contain:strict;z-index:0;mask-image:radial-gradient(ellipse 52% 54% at 50% 50%,transparent 0 44%,#000 76%)}
.hero-logo-canvas,.hero-logo-still{position:absolute;inset:0;width:100%;height:100%}.hero-logo-still{visibility:hidden}.hero-logo-canvas{display:block;opacity:0;transition:opacity var(--hero-reveal) ease-out}
[data-motion-ready] .hero-logo-canvas{opacity:1}[data-motion-ready] .hero-logo-still{visibility:hidden}
.hero-logo{position:absolute;left:var(--logo-x);top:var(--logo-y);width:var(--logo-size);aspect-ratio:1;display:grid;place-items:center;padding:var(--space-near);border:var(--line) solid var(--logo-line);border-radius:var(--radius-row);background:var(--logo-canvas);transform:translate(-50%,-50%) rotate(var(--logo-tilt));overflow:hidden}
.hero-logo img{width:100%;height:100%;object-fit:contain}
.hero-motion-toggle{position:absolute;right:var(--space-part);bottom:var(--space-part);z-index:1;min-height:var(--touch);padding:var(--space-near) var(--space-group);border:var(--line) solid var(--rule);border-radius:var(--radius-pill);background:var(--paper);color:var(--ink);font-size:var(--small)}
.hero-motion-toggle:hover{background:var(--quiet)}
.hero-next{position:absolute;left:50%;bottom:var(--space-part);transform:translateX(-50%);z-index:1;display:grid;place-items:center;width:var(--touch);height:var(--touch);border:var(--line) solid var(--rule);border-radius:var(--radius-pill);background:var(--paper);color:var(--ink)}
.hero-next .solo-icon{transform:rotate(90deg)}
.guide-author{grid-column:1/9;min-width:0;margin:0 0 var(--space-section);padding-top:var(--space-part);border-top:var(--line) solid var(--rule)}
.guide-author .publisher-note{padding:0;border:0;max-width:75ch}
@media(min-width:768px) and (max-width:1023px){.cosmos-hero .hero-copy{grid-column:2/8}.guide-author{grid-column:1/-1}}
@media(max-width:767px){:root{--hero-height:720px;--hero-title:clamp(36px,9vw,48px)}.hero.cosmos-hero{min-height:660px;padding-block:var(--space-block)}.cosmos-hero .hero-copy{grid-column:1/-1;padding:var(--space-page) var(--space-near)}.cosmos-hero h1{max-width:13ch;margin-inline:auto}.cosmos-hero .hero-deck{font-size:var(--body);max-width:24ch}.cosmos-hero .hero-meta{font-size:var(--small)}.hero-art{mask-image:radial-gradient(ellipse 84% 55% at 50% 49%,transparent 0 44%,#000 86%)}.hero-logo{width:calc(var(--logo-size) * .7);padding:var(--space-tight);border-radius:var(--radius-control)}.guide-author{grid-column:1/-1}.hero-motion-toggle{right:var(--space-group);bottom:var(--space-group)}.hero-next{left:var(--space-group);bottom:var(--space-group);transform:none}}
@media(prefers-reduced-motion:reduce){.hero-motion-toggle{display:none!important}}
@media(forced-colors:active){.hero-art{display:none}.hero-motion-toggle{display:none}.hero-next{border:1px solid ButtonText}}
@media print{.hero-art,.hero-motion-toggle,.hero-next{display:none}.hero.cosmos-hero{min-height:0;padding-block:var(--space-part);margin:0}.cosmos-hero .hero-copy{padding:0;text-align:left}.cosmos-hero .hero-actions{display:none}.guide-author{display:block}}

/* The calculator owns the full 12 / 8 / 4 tracks; prose uses eight. */
.guide-layout{padding-top:var(--space-page)}
.guide-layout .reading-body{grid-column:1/-1;--content-columns:var(--grid-columns)}
.guide-layout .price-section>h2{padding-inline:var(--space-part);margin-bottom:0}
@media(min-width:768px) and (max-width:1023px){.guide-layout{padding-top:var(--space-block)}.guide-layout .reading-body>.prose{grid-column:1/-1}}
@media(max-width:767px){.guide-layout{padding-top:var(--space-section)}.guide-layout .price-section>h2{padding-inline:var(--space-related)}}
.guide-layout .price-lab{--workspace-columns:var(--grid-columns)}
@container(max-width:620px){.workspace-grid,.price-dialog .workspace-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
