@font-face{font-family:Montserrat;src:url('assets/montserrat.woff') format('woff');font-weight:100 900;font-style:normal;font-display:swap}
:root{color-scheme:dark;background:#0b110e;color:#f1f3eb;font-family:Montserrat,Arial,sans-serif;font-synthesis:none;-webkit-text-size-adjust:100%}
*{box-sizing:border-box}
body{margin:0;min-width:240px;position:relative;isolation:isolate}
.atmosphere{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,#15251c 0%,#101b14 35%,#0b110e 72%)}
.atmosphere::before{content:"";position:absolute;inset:-15%;background:radial-gradient(ellipse at 32% 55%,rgba(117,159,109,.12),transparent 45%),radial-gradient(ellipse at 68% 40%,rgba(69,115,84,.13),transparent 38%);animation:drift 18s ease-in-out infinite alternate}
main{min-height:100vh;min-height:100svh;display:grid;grid-template-rows:1fr auto;padding: max(32px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(42px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));text-align:center}
.identity{align-self:center;padding:52px 0 64px}
h1{margin:0 auto;width:clamp(260px,39vw,560px);max-width:100%;line-height:0}
h1 img{width:100%;height:auto;display:block}
.soon{margin:31px 0 0;padding-left:.3em;color:#bfd4bb;font-size:.875rem;line-height:1.8;font-weight:400;letter-spacing:.3em}
.tagline{margin:0;color:#a7afa7;font-size:.8125rem;font-weight:400;line-height:1.8;letter-spacing:.075em}
@keyframes drift{from{transform:translate3d(-2%,1%,0);opacity:.5}to{transform:translate3d(3%,-2%,0);opacity:1}}
@media(max-width:600px){h1{width:min(86vw,370px)}.soon{margin-top:24px;letter-spacing:.26em;padding-left:.26em}.identity{padding-bottom:70px}main{padding-bottom:max(34px,env(safe-area-inset-bottom))}}
@media(max-height:450px){.identity{padding:20px 0 30px}h1{width:270px}.soon{margin-top:12px}main{padding-top:20px;padding-bottom:20px}}
@media(prefers-reduced-motion:reduce){.atmosphere::before{animation:none;opacity:.75}}
@media(forced-colors:active){.atmosphere{display:none}}
/* Restrained reveal: a pool of forest light, falling away to near-black. */
.atmosphere{background:radial-gradient(ellipse at 50% 46%,#192e21 0%,#101e16 30%,#080e0b 67%,#060a08 100%)}
.atmosphere::before{background:radial-gradient(ellipse at 36% 47%,rgba(137,179,117,.16),transparent 38%),linear-gradient(118deg,transparent 34%,rgba(140,180,131,.025) 45%,transparent 53%);animation-duration:22s}
h1{width:clamp(280px,42vw,600px)}
@media(max-width:600px){h1{width:min(88vw,380px)}}
@media(max-height:450px){h1{width:270px}}

/* One gentle breath every 12 seconds; logo position and size stay fixed. */
h1 img{animation:logo-breathe 12s ease-in-out infinite}
@keyframes logo-breathe{0%,100%{opacity:1;filter:drop-shadow(0 0 10px rgba(191,212,187,.22)) drop-shadow(0 0 28px rgba(191,212,187,.12))}50%{opacity:.65;filter:drop-shadow(0 0 5px rgba(191,212,187,.08)) drop-shadow(0 0 18px rgba(191,212,187,.04))}}
@media(prefers-reduced-motion:reduce){h1 img{animation:none;opacity:1;filter:drop-shadow(0 0 12px rgba(191,212,187,.12))}}

/* Green atmosphere breathes opposite the logo on the same clock. */
.atmosphere::before{animation:forest-counterpulse 12s ease-in-out infinite}
@keyframes forest-counterpulse{
  0%,100%{opacity:.35;transform:translate3d(-1%,.5%,0) scale(1)}
  50%{opacity:.85;transform:translate3d(1%,-.5%,0) scale(1.025)}
}
@media(prefers-reduced-motion:reduce){.atmosphere::before{animation:none;opacity:.6;transform:none}}