:root { color-scheme: dark; --ink:#eef1e7; --muted:#a9b3a8; --cyan:#62e5d0; --gold:#e1bd67; --night:#07100f; --panel:#0d1917; --line:rgba(192,224,208,.2); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; background:var(--night); color:var(--ink); font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif; line-height:1.55; }
a { color:inherit; }
.masthead { min-height:72px; padding:0 clamp(20px,5vw,72px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); position:absolute; z-index:3; width:100%; }
.wordmark { font-family:Georgia,serif; text-decoration:none; letter-spacing:.02em; }
nav { display:flex; gap:24px; }
nav a { color:var(--muted); text-decoration:none; font-size:.82rem; text-transform:uppercase; letter-spacing:.1em; }
nav a:hover,nav a:focus-visible { color:var(--cyan); }
.hero { min-height:780px; padding:150px clamp(24px,7vw,108px) 70px; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr); align-items:center; overflow:hidden; position:relative; background:radial-gradient(circle at 80% 35%,rgba(37,114,97,.28),transparent 32%),linear-gradient(135deg,#07100f,#101d19 60%,#172017); }
.hero::after { content:""; position:absolute; inset:auto 0 0; height:1px; background:linear-gradient(90deg,transparent,var(--gold),transparent); }
.hero img { grid-column:2; width:min(620px,100%); align-self:end; filter:drop-shadow(0 30px 60px rgba(0,0,0,.5)); }
.hero-copy { grid-column:1; grid-row:1; position:relative; z-index:1; max-width:760px; min-width:0; }
.eyebrow { margin:0 0 14px; color:var(--cyan); font-size:.72rem; font-weight:750; text-transform:uppercase; letter-spacing:.2em; }
h1,h2 { font-family:Georgia,"Times New Roman",serif; font-weight:400; line-height:.98; margin:0; }
h1 { font-size:clamp(3.4rem,7.4vw,7.8rem); letter-spacing:-.055em; }
h1 span { display:block; }
h2 { font-size:clamp(2.4rem,5vw,5rem); letter-spacing:-.04em; }
.lede { max-width:650px; color:#c6cec3; font-size:clamp(1.05rem,1.6vw,1.35rem); }
.live-clock { margin-top:40px; display:grid; grid-template-columns:auto auto; width:max-content; border-left:2px solid var(--gold); padding:6px 0 6px 18px; column-gap:22px; }
.live-clock span { grid-column:1/-1; color:var(--muted); text-transform:uppercase; letter-spacing:.16em; font-size:.67rem; }
.live-clock strong { font:400 clamp(1.7rem,3vw,3rem)/1.2 Georgia,serif; }
.live-clock em { color:var(--gold); align-self:end; font-style:normal; }
.hero-note { position:absolute; right:clamp(24px,5vw,72px); bottom:30px; color:var(--muted); font-size:.78rem; }
.horizon,.scale,.converter,.calendar { padding:clamp(80px,10vw,150px) clamp(24px,8vw,124px); }
.horizon { display:grid; grid-template-columns:minmax(180px,.45fr) minmax(0,1.2fr); gap:6vw; background:#e9e5d6; color:#12201c; }
.horizon .eyebrow { color:#207466; }
.horizon div { max-width:900px; }
.horizon p:not(.eyebrow) { font-size:clamp(1.05rem,1.7vw,1.35rem); max-width:780px; }
.scale { background:linear-gradient(#091210,#0c1715); }
.section-title { max-width:800px; }
.section-title>p:last-child { color:var(--muted); }
.unit-scale { list-style:none; margin:70px 0 0; padding:0; border-top:1px solid var(--line); }
.unit-scale li { display:grid; grid-template-columns:90px minmax(120px,.5fr) 1fr 1fr; gap:24px; padding:25px 0; border-bottom:1px solid var(--line); align-items:baseline; }
.unit-scale .number { color:var(--gold); font-variant-numeric:tabular-nums; }
.unit-scale strong { font:400 1.65rem Georgia,serif; }
.unit-scale span { color:var(--muted); }
.converter { display:grid; grid-template-columns:1fr 1fr; gap:50px; background:#111c19; border-block:1px solid var(--line); }
.cycle-form { display:grid; grid-template-columns:1fr auto; gap:10px; align-self:end; }
.converter label { grid-column:1/-1; color:var(--muted); font-size:.78rem; text-transform:uppercase; letter-spacing:.12em; }
.converter input { min-width:0; padding:16px; background:#07100f; color:var(--ink); border:1px solid var(--line); font:1.2rem inherit; }
button { padding:14px 22px; border:0; background:var(--cyan); color:#07100f; font-weight:800; cursor:pointer; }
.converter output { grid-column:1/-1; min-height:70px; color:var(--gold); font:400 1.3rem Georgia,serif; }
.calendar-events { margin-top:56px; }
.calendar-event { display:grid; grid-template-columns:150px minmax(0,1fr) minmax(180px,.45fr); gap:28px; padding:26px 0; border-top:1px solid var(--line); }
.calendar-event:last-child { border-bottom:1px solid var(--line); }
.calendar-event time { color:var(--gold); font-variant-numeric:tabular-nums; }
.calendar-event h3 { margin:0 0 8px; font:400 1.35rem Georgia,serif; }
.calendar-event p { margin:0; color:var(--muted); }
.calendar-event .owner { color:var(--cyan); font-size:.76rem; text-transform:uppercase; letter-spacing:.1em; }
footer { display:flex; justify-content:space-between; padding:34px clamp(24px,8vw,124px); color:var(--muted); border-top:1px solid var(--line); }
@media (max-width:760px) { nav { gap:12px; } nav a:not(:first-child){display:none}.hero{min-height:720px;grid-template-columns:minmax(0,1fr);padding:125px 24px 70px}.hero-copy{width:calc(100vw - 48px)}.hero h1{font-size:clamp(2.35rem,11vw,2.8rem);letter-spacing:-.045em}.hero h1 span{max-width:100%;white-space:normal}.hero img{position:absolute;opacity:.23;right:-100px;bottom:0;width:520px}.horizon,.converter{grid-template-columns:1fr}.unit-scale li{grid-template-columns:60px 1fr}.unit-scale li span{grid-column:2}.calendar-event{grid-template-columns:1fr}.hero-note{left:24px;right:auto}.masthead{align-items:flex-start;padding-top:22px;width:100vw}.wordmark{max-width:150px}.cycle-form{grid-template-columns:1fr}}
@media (max-width:460px) { .masthead nav{display:none} }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto} *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important} }