/* Original A / After dark: black, ivory, amber and a flowing hero, led by the app that's out. */
:root{color-scheme:dark;--paper:#000;--ink:#f7f4e9;--amber:#ffbd2e;--line:#686457;--muted:#d2cec3;--head:90px;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:1.5rem}body{margin:0;font-size:1rem;line-height:1.5;-webkit-font-smoothing:antialiased}h1,h2,h3,p,figure{margin:0}a{color:inherit;text-underline-offset:.25em}a:focus-visible,summary:focus-visible{outline:2px solid var(--amber);outline-offset:6px}::selection{background:var(--amber);color:#000}.page{max-width:1680px;margin:auto;padding:0 4%}.masthead{height:var(--head);display:flex;align-items:center;justify-content:space-between;gap:2rem;position:relative;z-index:1}.brand{display:flex;gap:1.25rem;align-items:center;font-size:2rem;letter-spacing:-.055em;font-weight:600;text-decoration:none}.brand-mark{width:43px;height:43px;overflow:hidden;position:relative;display:block}.brand img{position:absolute;width:70px;height:70px;max-width:none;left:-13px;top:-13px}.masthead nav{display:flex;gap:3.5rem}.masthead nav a{text-decoration:none;font-size:1.125rem}.masthead nav a:hover{color:var(--amber)}
.badge{display:inline-block;font-size:.75rem;line-height:1;letter-spacing:.18em;text-transform:uppercase;padding:.45rem .65rem;border:1px solid var(--line);color:var(--muted);white-space:nowrap}.badge.now{background:var(--amber);border-color:var(--amber);color:#090700;font-weight:700}
/* The first screen: visual[flow] and its teaser, the whole film in view at 1080p. */
.hero{position:relative;margin:0 -4.35%;padding:12px 4% 56px;isolation:isolate;overflow:hidden;background:#000;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,2.1fr);gap:3%;align-items:center;min-height:calc(100svh - var(--head) - 64px)}.hero::before{content:"";position:absolute;inset:auto 0 0;height:62%;z-index:-1;background-image:url('./assets/amber-wave.png');background-size:100% 100%;background-repeat:no-repeat;opacity:.55;pointer-events:none}.hero-copy{position:relative;z-index:1}.eyebrow{font-size:.75rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}.status{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;margin:1.6rem 0 1rem;font-size:.9375rem;color:var(--muted)}h1{font-size:clamp(2.8rem,3.9vw,5.2rem);font-weight:750;line-height:.95;letter-spacing:-.055em;white-space:nowrap}.lede{font-size:clamp(1.05rem,1.3vw,1.4rem);margin:1.4rem 0 1.8rem;max-width:34rem}.actions{display:flex;gap:1rem;flex-wrap:wrap}.button{display:inline-flex;justify-content:center;align-items:center;min-height:56px;padding:.85rem 1.7rem;text-decoration:none;font-size:1.125rem;border:1px solid var(--ink)}.primary{background:var(--amber);border-color:var(--amber);color:#090700;gap:1.5rem}.primary:hover{background:#ffd270}.secondary{background:rgba(0,0,0,.8)}.secondary:hover{border-color:var(--amber);color:var(--amber)}.next{margin-top:1.6rem;font-size:.9375rem;color:var(--muted)}.next a:hover{color:var(--amber)}
.hero-film{position:relative;z-index:1;justify-self:end;width:100%;max-width:calc((100svh - var(--head) - 140px) * 16 / 9)}.teaser-video{display:block;width:100%;height:auto;aspect-ratio:16/9;border:1px solid var(--line);background:#030303}.hero-film figcaption{margin-top:.6rem;font-size:.8125rem;color:var(--muted)}.hero-film figcaption a:hover{color:var(--amber)}
/* The suite: what's out, and what's coming. */
.suite{border-top:1px solid var(--line);padding-top:25px}.suite-title{font-size:.8125rem;font-weight:400;letter-spacing:.32em;text-transform:uppercase;color:var(--muted);margin-bottom:1.4rem}.apps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}.app{min-width:0;padding:0 2.6rem;border-left:1px solid var(--line)}.app:first-child{padding-left:0;border-left:0}.app:last-child{padding-right:0}.app-link{text-decoration:none;display:block}.app-link:hover h3{color:var(--amber)}.app-status{margin-bottom:.8rem}h3{font-size:clamp(2rem,2.65vw,2.65rem);line-height:1.1;letter-spacing:-.05em}.app p:not(.app-status){font-size:clamp(1rem,1.2vw,1.2rem);margin:.4rem 0 1.2rem;min-height:3em;color:var(--muted)}.app figure{border:1px solid var(--line);position:relative;padding-bottom:1.8rem;background:#030303}.preview{display:block;width:100%;height:auto;aspect-ratio:2.23;object-fit:cover}div.preview{background-image:url('./assets/homepage-concept.png');background-repeat:no-repeat;background-size:363.981% auto}.preview-set{background-position:5.565% 82.66%}.preview-mix{background-position:94.704% 82.66%}.soon .preview{filter:grayscale(.55);opacity:.5;transition:opacity .2s,filter .2s}.soon .app-link:hover .preview{opacity:.8;filter:none}figcaption{font-size:.8125rem;color:var(--muted);line-height:1.2}.app figcaption{position:absolute;bottom:.4rem;left:.8rem}
.about{margin-top:1.6rem;font-size:.9375rem;color:#c8c3b6}.about summary{cursor:pointer;width:fit-content}.about[open]{border-top:1px solid var(--line);padding-top:1.5rem}.about>div{max-width:740px;padding-top:1rem}.about p{font-size:1.125rem;margin-bottom:.9rem}.about a:hover{color:var(--amber)}footer{display:flex;align-items:center;gap:1.5rem;padding:2.2rem 0 2.5rem}footer p{font-size:.75rem;letter-spacing:.24em;text-transform:uppercase}.footer-rule{height:1px;flex:1;background:var(--line)}footer a{font-size:.8125rem;text-decoration:none;white-space:nowrap}.skip-link{position:fixed;left:1rem;top:-6rem;z-index:10;padding:.75rem 1rem;background:var(--amber);color:#000}.skip-link:focus{top:1rem}
@media(max-width:1100px){.app{padding:0 1.3rem}.button{font-size:1rem;padding:.8rem 1.4rem;min-height:52px}}
/* Narrower than the two columns fit: copy, then the film at full width. */
@media(max-width:960px){.hero{grid-template-columns:1fr;gap:2rem;min-height:0;padding-bottom:3rem}.hero-film{justify-self:stretch;max-width:none}h1{font-size:clamp(3rem,10vw,5rem)}.lede{max-width:40rem}}
@media(max-width:700px){:root{--head:85px}.page{padding:0 6%}.masthead{height:auto;min-height:85px;flex-wrap:wrap;padding:1.1rem 0;gap:.8rem}.brand{font-size:1.6rem;gap:.7rem}.brand-mark{width:36px;height:36px}.brand img{width:60px;height:60px;left:-11px;top:-11px}.masthead nav{gap:1.2rem}.masthead nav a{font-size:.9375rem}.hero{margin:0 -6.82%;padding:1.2rem 6% 2.5rem}.hero::before{height:40%}.eyebrow{letter-spacing:.2em;font-size:.75rem}h1{font-size:clamp(2.6rem,12vw,4rem);letter-spacing:-.06em}.lede{font-size:1.0625rem}.button{padding:.85rem 1.15rem}.primary{gap:1rem}.apps{grid-template-columns:1fr;gap:2rem}.app,.app:first-child,.app:last-child{padding:0 0 2rem;border-left:0;border-bottom:1px solid var(--line)}h3{font-size:2.3rem}.app p:not(.app-status){font-size:1.0625rem;min-height:0}.about{margin-top:0}footer{flex-wrap:wrap;gap:1rem;padding-top:1.8rem}footer p{font-size:.75rem;letter-spacing:.16em}.footer-rule{min-width:30px}footer a{font-size:.8125rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.soon .preview{transition:none}}
