:root{
  --bg:#080706;
  --ivory:#eee5db;
  --metal:#c7b7a5;
  --line:rgba(218,201,181,.3);
  --mx:50%;
  --my:28%;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ivory)}
body{font-family:Georgia,"Times New Roman",serif;overflow-x:hidden;background:
  radial-gradient(circle at 50% -10%,rgba(255,244,229,.09),transparent 35%),
  linear-gradient(180deg,#12100e 0%,#080706 55%,#050504 100%)}
body:before{content:"";position:fixed;inset:0;z-index:-4;background:
  repeating-radial-gradient(ellipse at 50% 0%,rgba(255,255,255,.018) 0 1px,transparent 1px 4px),
  linear-gradient(115deg,rgba(255,255,255,.018),transparent 40%);opacity:.65}
.ambient{position:fixed;inset:-15%;z-index:-3;pointer-events:none;background:
  radial-gradient(circle at var(--mx) var(--my),rgba(255,238,216,.15),transparent 20%),
  radial-gradient(circle at 50% 15%,rgba(255,255,255,.055),transparent 32%);
  transition:background .1s linear}
.grain{position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:.13;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E")}
.topbar{position:fixed;top:0;left:0;width:100%;display:flex;justify-content:flex-end;gap:10px;padding:24px clamp(16px,4vw,62px);z-index:10}
.nav-link{font:11px/1 Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#e6dbcf;text-decoration:none;border:1px solid rgba(225,208,188,.38);padding:11px 17px;background:rgba(8,7,6,.28);backdrop-filter:blur(10px);transition:.25s ease}
.nav-link:hover{background:#d7c7b5;color:#14110f;border-color:#d7c7b5;box-shadow:0 0 28px rgba(215,199,181,.15)}
.nav-link--filled{background:rgba(199,183,165,.12)}
.hero{min-height:100vh;display:grid;place-items:center;padding:92px 20px 40px}
.brand{text-align:center;width:min(940px,100%);animation:reveal 1.2s ease both}
.brand__logo{
    display:block;
    width:min(420px,42vw);
    max-width:90%;
    height:auto;
    margin:0 auto 35px;
    filter:
        drop-shadow(0 35px 45px rgba(0,0,0,.8))
        drop-shadow(0 0 45px rgba(235,222,208,.12));
    transition:transform .5s ease;
}

.brand__logo:hover{
    transform:translateY(-3px) scale(1.02);
}
h1{margin:0;font-weight:400;font-size:clamp(42px,7.2vw,94px);letter-spacing:.34em;text-indent:.34em;color:transparent;background:linear-gradient(180deg,#f7eee5 0%,#b1a291 43%,#5e5349 70%,#d7c7b6 100%);-webkit-background-clip:text;background-clip:text;text-shadow:0 8px 25px rgba(0,0,0,.5)}
.tagline{margin:14px 0 26px;font:11px/1.5 Arial,sans-serif;letter-spacing:.58em;text-indent:.58em;color:rgba(235,222,208,.72)}
.ornament{display:flex;align-items:center;gap:18px;width:min(560px,78vw);margin:0 auto 26px;color:#d6c5b3}
.ornament:before,.ornament:after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--line))}.ornament:after{background:linear-gradient(90deg,var(--line),transparent)}
.ornament span{font-size:22px;text-shadow:0 0 20px rgba(255,238,218,.25)}
.countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;width:min(820px,100%);margin:0 auto}
.time-card{position:relative;overflow:hidden;padding:22px 10px 19px;border:1px solid rgba(211,194,174,.22);background:linear-gradient(180deg,rgba(33,29,25,.52),rgba(8,7,6,.48));backdrop-filter:blur(9px)}
.time-card:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 28%,rgba(255,255,255,.08) 47%,transparent 65%);transform:translateX(-130%);animation:shine 7s infinite}
.time-card strong{display:block;font:300 clamp(32px,5.4vw,64px)/1 Arial,sans-serif;letter-spacing:.04em;color:#eadfd3;text-shadow:0 2px 18px rgba(0,0,0,.65)}
.time-card span{display:block;margin-top:9px;font:10px/1 Arial,sans-serif;letter-spacing:.28em;text-transform:uppercase;color:rgba(233,217,199,.55)}
.target-date{margin:23px 0 0;font:10px/1.5 Arial,sans-serif;letter-spacing:.23em;color:rgba(231,216,199,.6)}
.expired{font-size:clamp(25px,4vw,50px);letter-spacing:.2em;color:#e8dbcc}
@keyframes reveal{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes shine{0%,68%{transform:translateX(-130%)}82%,100%{transform:translateX(135%)}}
@media(max-width:680px){.topbar{padding:16px 13px}.nav-link{padding:9px 11px;font-size:9px}.hero{padding-top:86px}.brand__logo{width:120px;margin-bottom:-6px}h1{font-size:clamp(35px,12vw,52px);letter-spacing:.19em;text-indent:.19em}.tagline{letter-spacing:.34em;text-indent:.34em}.countdown{grid-template-columns:repeat(2,1fr)}.target-date{font-size:9px;letter-spacing:.16em}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
