/* The original Akashic hero: one statement, blue dither, and a download action. */
.hero{min-height:calc(100vh - var(--header-height) - var(--site-gutter));min-height:calc(100dvh - var(--header-height) - var(--site-gutter));margin-inline:var(--site-gutter);isolation:isolate;overflow:hidden;border-radius:36px;background:var(--brand);color:#f7fbff;display:grid;grid-template-rows:1fr;align-items:center;justify-items:center;padding:clamp(24px,6dvh,64px) 24px}
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse 45% 100% at 50% 45%,#0056bc80 0%,#0062d240 48%,#0878f900 84%)}
.hero :focus-visible{outline-color:#fff}
.hero-copy{width:100%;max-width:1080px}
.hero h1{width:100%;font-size:clamp(56px,min(6.4vw,10dvh),92px);line-height:1.06;letter-spacing:-.045em;font-weight:480}
.hero h1 span{color:inherit}
.hero-symbol{color:var(--brand);background:#f7fbff;display:grid;place-items:center;width:clamp(44px,9dvh,76px);height:clamp(44px,9dvh,76px);border-radius:clamp(14px,2.8dvh,24px);line-height:0;margin-bottom:clamp(24px,4dvh,44px)}
.hero-symbol .brand-mark{width:clamp(26px,4.5dvh,35px);height:clamp(26px,4.5dvh,35px)}
.hero-description{font-size:clamp(15px,2.2dvh,18px);margin-top:clamp(20px,4dvh,36px);color:#f7fbff}
.hero-actions{margin-top:clamp(20px,3.4dvh,28px)}
.hero-actions .button{min-height:50px;padding-inline:27px;font-size:14px;background:#f7fbff;color:#0757bc}
.hero-actions .button:hover{background:#fff}
.hero-meta{margin-top:clamp(8px,1.8dvh,16px);font-size:12px;color:#eef6ff}
.hero-scroll{position:absolute;z-index:2;left:50%;bottom:24px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#f7fbff;color:#075fcf;box-shadow:0 4px 18px #004ba629;transform:translateX(-50%);transition:transform .2s ease,background .2s ease}
.hero-scroll .icon{width:21px;height:21px;transform:rotate(90deg)}
.hero-scroll:hover{background:#fff;color:#075fcf;transform:translate(-50%,-4px)}
/* Original editorial artwork, with one concrete idea per section. */
.feature-section{padding:80px 0}
.feature-first{padding-top:112px}
.feature-inner{width:calc(100% - 96px);max-width:1280px;margin-inline:auto;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:72px;align-items:center}
.feature-copy{min-width:0;max-width:420px}
.feature-copy h2{font-size:clamp(36px,3.6vw,52px);line-height:1.12;font-weight:480;letter-spacing:-.035em}
.feature-copy p{max-width:35ch;margin-top:24px;font-size:17px;line-height:1.65;color:var(--muted)}
.feature-art{margin:0;min-width:0;overflow:hidden;border-radius:28px}
.feature-art img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}
.feature-reverse{background:#fff}
.feature-reverse .feature-inner{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
.feature-reverse .feature-copy{grid-column:2;grid-row:1;justify-self:end}
.feature-reverse .feature-art{grid-column:1;grid-row:1}
.feature-art-note{margin:24px 24px 48px;text-align:center;font-size:12px;color:var(--muted)}
@media(min-width:1500px){.feature-first{padding-top:128px}.feature-section{padding-bottom:96px}}
@media(max-width:1100px){.feature-inner{gap:40px}.feature-copy p{font-size:16px}}
@media(max-width:900px){
 .feature-section{padding:64px 0}
 .feature-first{padding-top:80px}
 .feature-inner,.feature-reverse .feature-inner{width:calc(100% - 40px);max-width:640px;grid-template-columns:minmax(0,1fr);gap:32px}
 .feature-copy,.feature-reverse .feature-copy{max-width:520px;grid-column:auto;grid-row:auto;justify-self:start}
 .feature-reverse .feature-art{grid-column:auto;grid-row:auto}
 .feature-copy h2{font-size:clamp(32px,6vw,44px)}
 .feature-copy p{max-width:42ch;margin-top:20px}
 .feature-art{border-radius:22px}
 .feature-art-note{margin-block:16px 40px}
}
@media(max-width:700px){
 .hero{padding-inline:20px;border-radius:28px}
 .hero-scroll{bottom:16px}
 .hero::after{background:radial-gradient(ellipse 75% 115% at 50% 45%,#0056bc80 0%,#0062d240 48%,#0878f900 90%)}
 .hero h1{font-size:clamp(42px,10.3vw,64px)}
 .hero-description{font-size:16px;max-width:260px}
}
@media(max-width:380px){.hero h1{font-size:clamp(34px,10vw,38px)}.hero-description{font-size:15px}.feature-copy h2{font-size:30px}.feature-section{padding-block:52px}}
/* Content may grow at high zoom; short viewports use compact spacing. */
@media(max-height:550px){
 :root{--header-height:56px}
 .hero{padding-top:16px;padding-bottom:80px}
 .hero h1{font-size:clamp(32px,min(6.4vw,10dvh),48px)}
 .hero-symbol{margin-bottom:16px}
 .hero-symbol .brand-mark{width:36px;height:36px}
 .hero-description{font-size:15px;margin-top:12px}
 .hero-actions{margin-top:12px}
 .hero-actions .button{min-height:44px;padding-block:10px}
 .hero-meta{margin-top:6px;font-size:11px}
}
@media(prefers-reduced-motion:reduce){.hero .motion-toggle{display:none}.hero-scroll:hover{transform:translateX(-50%)}}

.hero .motion-toggle{position:absolute;z-index:2;right:24px;bottom:24px;width:44px;height:44px;padding:0;justify-content:center;background:#075fcfbf;color:#fff;font-size:15px}
.hero .motion-toggle > span+span{display:none}
.hero .motion-glyph,.hero .motion-glyph > span{display:flex;align-items:center;justify-content:center}
.hero .motion-glyph .icon{width:18px;height:18px}
.hero .motion-toggle[aria-pressed="false"] .motion-play,
.hero .motion-toggle[aria-pressed="true"] .motion-pause{display:none}
.hero .motion-toggle:hover{background:#ffffff30}
@media(max-width:700px){.hero .motion-toggle{right:12px;bottom:16px}}
@media(max-height:550px){.hero .motion-toggle{bottom:12px}}
@media(prefers-reduced-motion:reduce){.hero .motion-toggle{display:none}}
