/* Homepage composition; shared type, controls and symbols live in tokens.css. */
.hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,390px); align-items:center; gap:clamp(40px,7vw,88px); width:100%; max-width:var(--width-wide); margin:auto; padding:48px var(--edge) 64px; }
.hero-copy { text-align:left; }
.hero-line { max-width:16ch; }
.hero-sub { max-width:48ch; margin-top:var(--space-xl); }
.hero-actions,.download-actions { display:flex; align-items:center; gap:var(--space-xl); margin-top:var(--space-xl); }
.hero-product { position:relative; max-width:360px; justify-self:center; padding:10px; border:1px solid var(--hairline); border-radius:42px; background:#050506; box-shadow:0 30px 90px rgba(0,0,0,.55),0 0 80px rgba(245,196,82,.08); transform:rotate(1.5deg); }
.hero-product img { display:block; width:100%; height:auto; border-radius:33px; }
.qr-download { display:flex; align-items:center; gap:var(--space-m); }
.qr-download img { width:92px; height:92px; padding:7px; border-radius:10px; background:#fff; image-rendering:pixelated; }
.qr-download p { font-family:var(--font-label); font-size:.75rem; line-height:1.4; color:var(--text-tertiary); }
.feature-section { max-width:var(--width-wide); }
.feature-section > .section-title { max-width:22ch; }
.feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-xl); margin-top:var(--space-xxl); }
.feature-card { overflow:hidden; border:1px solid var(--hairline); border-radius:var(--r-panel); background:rgba(255,255,255,.025); }
.feature-card > div { padding:var(--space-xl); }
.feature-card h3 { margin-bottom:var(--space-m); }
#atlas-teaser { max-width:var(--width-wide); }
.home-atlas { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-xxl); margin-top:var(--space-xxl); }
.home-atlas { margin-bottom:var(--space-xxl); }
.home-atlas a { display:flex; flex-direction:column; text-align:center; color:var(--text-primary); }
.home-atlas a:hover { text-decoration:none; }
.home-atlas h3 { margin:var(--space-l) 0 var(--space-m); }
.home-atlas span,.text-link { font-family:var(--font-label); font-size:.875rem; color:var(--accent); }
.home-atlas span { display:block; margin-top:auto; padding-top:var(--space-l); }
#privacy-promise p + p { margin-top:var(--space-l); }
details { padding:var(--space-l) 0; border-bottom:1px solid var(--hairline); }
summary { cursor:pointer; font-family:var(--font-label); }
details p { margin-top:var(--space-m); }
#updates-form { display:flex; flex-wrap:wrap; gap:var(--space-m); margin-top:var(--space-xl); }
.download-cta { margin-top:var(--section-y); padding-top:calc(var(--section-y) * 1.5); padding-bottom:calc(var(--section-y) * 1.5); text-align:center; border-top:1px solid var(--hairline); border-bottom:1px solid var(--hairline); }
.download-cta > p:not(.eyebrow) { max-width:46ch; margin:auto; }
.download-actions { justify-content:center; }
#updates-form label { flex-basis:100%; font-family:var(--font-label); font-size:.875rem; }
#updates-form input[type="email"] { min-width:0; flex:1 1 240px; background:transparent; border:1px solid var(--text-tertiary); border-radius:var(--r-card); padding:14px 18px; color:var(--text-primary); font-family:var(--font-label); font-size:1rem; }
#updates-form input::placeholder { color:var(--text-tertiary); }
.form-note,#updates-msg { font-family:var(--font-label); font-size:.875rem; margin-top:var(--space-l); }
.form-note { color:var(--text-tertiary); max-width:60ch; }
#updates-msg { min-height:1.7em; }
@media(max-width:760px) { .hero { grid-template-columns:1fr; padding:32px var(--edge) 40px; } .hero-copy { text-align:center; } .hero-line,.hero-sub { margin-left:auto; margin-right:auto; } .hero-product { width:min(72vw,330px); transform:none; } .hero-actions { justify-content:center; } .feature-grid { grid-template-columns:1fr; max-width:440px; margin-left:auto; margin-right:auto; } }
@media(max-width:600px) { .hero { padding-top:24px; } .qr-download { display:none; } .home-atlas { grid-template-columns:1fr; gap:var(--space-xxl); } .home-atlas .medallion { max-width:240px; margin:auto; } #updates-form .btn { width:100%; } .download-actions { justify-content:center; } }