:root { --paper:#f6f1e7; --ink:#191817; --red:#e5483f; --muted:#6c675f; --line:rgba(25,24,23,.24); --serif:Georgia,"Times New Roman",serif; --sans:Arial,Helvetica,sans-serif; color-scheme:light; }
* { box-sizing:border-box; }
html { background:var(--paper); }
body { background:radial-gradient(circle at 17% 22%,rgba(255,255,255,.72),transparent 28%),var(--paper); color:var(--ink); display:grid; font-family:var(--sans); grid-template-rows:auto 1fr auto; margin:0; min-height:100vh; min-height:100svh; overflow-x:hidden; }
body::before { 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='.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E"); content:""; inset:0; opacity:.09; pointer-events:none; position:fixed; z-index:10; }
a { color:inherit; }
.skip-link { background:var(--ink); color:var(--paper); left:16px; padding:10px 14px; position:fixed; top:0; transform:translateY(-120%); z-index:20; }
.skip-link:focus { transform:translateY(0); }
.coming-header,.coming-footer { align-items:center; display:flex; justify-content:space-between; position:relative; z-index:2; }
.coming-header { border-bottom:1px solid var(--line); margin:0 4.5vw; padding:24px 0 17px; }
.wordmark { display:flex; flex-direction:column; font-family:var(--serif); font-size:18px; font-weight:700; letter-spacing:-.035em; line-height:.86; text-decoration:none; }
.coming-header p,.coming-footer,.status { font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.coming-header p { margin:0; }
.coming-main { align-items:center; display:grid; gap:clamp(40px,8vw,140px); grid-template-columns:minmax(0,1.05fr) minmax(320px,.62fr); padding:clamp(42px,6vh,80px) 9vw clamp(46px,7vh,90px) 10.5vw; }
.coming-copy { position:relative; z-index:2; }
.status { align-items:center; display:flex; gap:10px; margin:0 0 clamp(23px,3vh,38px) 5px; }
.status span { animation:pulse 2.4s ease-in-out infinite; background:var(--red); border-radius:50%; height:8px; width:8px; }
h1 { font-family:var(--serif); font-size:clamp(82px,10.4vw,168px); font-weight:400; letter-spacing:-.082em; line-height:.73; margin:0; }
h1 em { font-weight:400; }
h1 b { color:var(--red); font-family:var(--sans); font-size:.72em; font-weight:400; margin-left:.01em; }
.intro { color:var(--muted); font-size:clamp(14px,1.05vw,17px); line-height:1.55; margin:clamp(40px,6vh,70px) 0 0 29%; max-width:380px; }
.contact-link { align-items:center; border-bottom:1px solid var(--ink); display:flex; font-size:12px; justify-content:space-between; margin:27px 0 0 29%; max-width:380px; padding:0 0 8px; text-decoration:none; transition:color 180ms ease,border-color 180ms ease; }
.contact-link span:last-child { color:var(--red); font-size:20px; line-height:1; transition:transform 180ms ease; }
.contact-link:hover,.contact-link:focus-visible { border-color:var(--red); color:var(--red); }
.contact-link:hover span:last-child,.contact-link:focus-visible span:last-child { transform:translate(3px,-3px); }
.coming-art { margin:0; max-width:470px; position:relative; transform:rotate(2.2deg); }
.art-frame { background:#fff; box-shadow:18px 22px 0 rgba(25,24,23,.1); overflow:hidden; padding:clamp(10px,1.2vw,18px); }
.coming-art img { aspect-ratio:.78; display:block; height:auto; object-fit:cover; width:100%; }
.tape { background:#dfd0bc; box-shadow:0 1px 3px rgba(25,24,23,.08); font-family:var(--serif); font-size:15px; font-style:italic; left:50%; letter-spacing:.02em; padding:9px 32px; position:absolute; top:-17px; transform:translateX(-50%) rotate(-4deg); white-space:nowrap; z-index:2; }
.coming-art figcaption { font-family:var(--serif); font-size:13px; font-style:italic; margin:17px 0 0 7px; }
.doodle { bottom:-39px; color:var(--red); font-size:clamp(52px,5vw,82px); line-height:1; position:absolute; right:-40px; transform:rotate(14deg); }
.coming-footer { border-top:1px solid var(--line); margin:0 4.5vw; padding:17px 0 22px; }
.coming-footer p { margin:0; }
.coming-footer a { text-decoration:none; text-transform:lowercase; }
.coming-footer a:hover { text-decoration:underline; }
@keyframes pulse { 0%,100% { box-shadow:0 0 0 0 rgba(229,72,63,.34); } 50% { box-shadow:0 0 0 7px rgba(229,72,63,0); } }
@media (max-width:840px) { .coming-main { gap:70px; grid-template-columns:1fr; padding:72px 8vw 90px; } h1 { font-size:clamp(86px,21vw,150px); } .intro,.contact-link { margin-left:20%; } .coming-art { justify-self:center; width:min(78vw,450px); } }
@media (max-width:560px) { .coming-header { margin:0 6vw; padding-top:21px; } .coming-header p { max-width:90px; text-align:right; } .coming-main { padding:58px 7vw 78px; } h1 { font-size:clamp(76px,24vw,126px); line-height:.77; } .intro,.contact-link { margin-left:12%; } .intro { margin-top:43px; } .coming-art { width:84vw; } .doodle { right:-14px; } .coming-footer { align-items:flex-start; flex-direction:column; gap:11px; margin:0 6vw; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.01ms !important; } }
