:root{
  --black:#060606;
  --raise:#0c0b0a;
  --light:#f2ece0;
  --dim:rgba(242,236,224,.74);
  --faint:rgba(242,236,224,.46);
  --rule:rgba(242,236,224,.16);
  --tungsten:#e7a768;

  --display:'Bodoni Moda','Bodoni 72','Didot','Playfair Display','Liberation Serif',Georgia,serif;
  --body:'Literata','Charter','Bitstream Charter',Georgia,'Liberation Serif',serif;

  --pad:clamp(1.25rem, 5vw, 4.5rem);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth; background:var(--black);}
body{
  margin:0;
  background:var(--black);
  color:var(--light);
  font-family:var(--body);
  font-size:1.0625rem;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%; display:block;}
a{color:inherit;}
:focus-visible{outline:2px solid var(--tungsten); outline-offset:4px;}
::selection{background:var(--tungsten); color:#000;}

body::after{
  content:""; position:fixed; inset:0; z-index:90; pointer-events:none; opacity:.07; mix-blend-mode:screen;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

.skip{position:absolute; left:-999px; top:0; background:var(--light); color:#000; padding:.6rem 1rem; z-index:200;}
.skip:focus{left:0;}

.label{
  font-family:var(--body);
  font-size:.74rem; letter-spacing:.24em; text-transform:uppercase;
  color:var(--faint);
}

.topbar{
  position:fixed; top:0; left:0; right:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:1.25rem var(--pad);
  transition:background .3s ease, border-color .3s ease, padding .3s ease;
  border-bottom:1px solid transparent;
}
.topbar.solid{
  background:rgba(6,6,6,.92);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  border-bottom-color:var(--rule);
  padding-top:.85rem; padding-bottom:.85rem;
}
.topbar .mark{
  font-family:var(--display); font-weight:500; font-size:1.05rem; letter-spacing:.14em;
  text-decoration:none; text-transform:uppercase; white-space:nowrap;
}
.sitenav{display:flex; gap:.4rem clamp(1rem,2.6vw,2.2rem); font-size:.82rem; letter-spacing:.08em;}
.sitenav a{
  text-decoration:none; color:var(--dim); padding:.2rem 0; border-bottom:1px solid transparent;
  transition:color .2s, border-color .2s;
}
.sitenav a:hover{color:var(--light);}
.sitenav a[aria-current]{color:var(--light); border-bottom-color:var(--tungsten);}
.sitenav .short{display:none;}

.stage{
  position:relative; min-height:100vh; min-height:100svh; overflow:hidden;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:7rem var(--pad) clamp(2.5rem,6vh,4.5rem);
  isolation:isolate;
}
.portrait{
  position:absolute; z-index:-1; top:0; right:0; bottom:0;
  width:min(66%, 1000px);
  animation:lightup 3.2s cubic-bezier(.3,.1,.2,1) both;
}
.portrait img{
  width:100%; height:100%; object-fit:cover; object-position:50% 14%;
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 42%);
          mask-image:linear-gradient(90deg, transparent 0%, #000 42%);
}
.portrait::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:38%;
  background:linear-gradient(0deg, var(--black) 6%, transparent);
}
.stage .label{margin:0 0 1.4rem; animation:rise 1.6s ease 1.9s both; color:var(--dim);}
.name{
  margin:0; font-family:var(--display); font-weight:500;
  font-size:clamp(3.2rem, 7.2vw, 7rem);
  line-height:1; letter-spacing:-.02em;
  animation:rise 2s ease 1.3s both;
}
.name span{display:inline;}
.name span + span{margin-left:.28em;}
.hook{
  margin:3.6rem 0 0; max-width:30rem; font-size:1.1rem; color:var(--dim);
  animation:rise 1.6s ease 2.3s both;
}
.hook a{color:var(--light); text-underline-offset:4px; text-decoration-color:var(--tungsten);}

@keyframes lightup{
  0%{opacity:0; filter:brightness(.15);}
  35%{opacity:1; filter:brightness(.35);}
  100%{opacity:1; filter:brightness(1);}
}
@keyframes rise{
  from{opacity:0; transform:translateY(14px);}
  to{opacity:1; transform:none;}
}
@media (prefers-reduced-motion:reduce){
  .portrait, .stage .label, .name, .hook, .tile{animation:none;}
  html{scroll-behavior:auto;}
}

.about{padding:clamp(6rem,14vw,11rem) var(--pad) clamp(2rem,4vw,3rem); scroll-margin-top:3rem;}
.about .col{max-width:40rem; margin:0 auto; position:relative;}
.about .label{display:flex; align-items:center; gap:1rem; margin-bottom:3.2rem;}
.about .label::after{content:""; flex:1; height:1px; background:var(--rule);}
.about p{margin:0 0 1.9rem; font-size:1.2rem; line-height:1.82; color:var(--dim);}
.about .drop{
  float:left; font-family:var(--display); font-weight:500;
  font-size:4.6em; line-height:.8; padding:.06em .1em 0 0; color:var(--light);
}

.lamp{
  position:relative; text-align:center;
  padding:clamp(4.5rem,9vw,7.5rem) var(--pad);
  background:radial-gradient(ellipse 55% 60% at 50% 50%, rgba(231,167,104,.16), rgba(231,167,104,.05) 45%, transparent 72%);
}
.lamp blockquote{
  margin:0 auto; max-width:21ch;
  font-family:var(--display); font-style:italic; font-weight:400;
  font-size:clamp(2.4rem, 6.4vw, 5.6rem); line-height:1.08; letter-spacing:-.015em;
}

.about.after{padding-top:clamp(1rem,3vw,2rem); padding-bottom:clamp(4.5rem,9vw,7rem);}

.show{
  position:relative; scroll-margin-top:3rem;
  padding:clamp(5rem,11vw,9rem) var(--pad);
  background:var(--raise);
  border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);
  overflow:hidden;
}
.show .grid{
  max-width:70rem; margin:0 auto;
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:clamp(2.5rem,7vw,6rem); align-items:center;
}
.wordmark{display:block; text-decoration:none; width:100%; transform:rotate(-1.4deg); opacity:.94;}
.wordmark svg{width:100%; height:auto; overflow:visible;}
.wordmark .paint, .wordmark .drip{fill:var(--light);}
.show .label{margin:0 0 1.6rem; color:var(--tungsten);}
.show p{margin:0 0 1.4rem; font-size:1.14rem; color:var(--dim); max-width:34rem;}
.show p.lede{color:var(--light); font-size:1.3rem;}
.btn{
  display:inline-block; margin-top:.8rem;
  font-family:var(--body); font-size:.8rem; letter-spacing:.2em; text-transform:uppercase; text-decoration:none;
  color:var(--light); padding:1rem 1.6rem; border:1px solid var(--light);
  background:transparent; cursor:pointer;
  transition:background .2s, color .2s, border-color .2s;
}
.btn:hover{background:var(--light); color:#000;}

.list{padding:clamp(6rem,13vw,10rem) var(--pad); text-align:center; scroll-margin-top:3rem;}
.list h2{
  margin:0 0 .6rem; font-family:var(--display); font-weight:500;
  font-size:clamp(2.6rem, 7vw, 5.4rem); line-height:1; letter-spacing:-.02em;
}
.list .coming{margin:0 0 3rem; color:var(--tungsten); font-style:italic; font-family:var(--display); font-size:1.3rem;}
.signup{max-width:30rem; margin:0 auto;}
.signup-form{display:flex; gap:.8rem; flex-wrap:wrap; justify-content:center;}
.signup-form input[type="email"]{
  flex:1 1 15rem; min-width:0; padding:.95rem .2rem;
  background:transparent; border:0; border-bottom:1px solid var(--faint); border-radius:0;
  color:var(--light); font:inherit; font-size:1.05rem; text-align:left;
}
.signup-form input[type="email"]::placeholder{color:var(--faint);}
.signup-form input[type="email"]:focus{outline:none; border-bottom-color:var(--tungsten);}
.signup-form button{margin-top:0;}
.signup-status{margin-top:1rem; min-height:1.4em; font-size:.95rem; color:var(--tungsten);}
.signup .fine{margin-top:1.2rem; font-size:.78rem; color:var(--faint);}
.signup .fine a{color:var(--faint);}

footer{border-top:1px solid var(--rule); padding:2rem var(--pad) 2.4rem; font-size:.8rem; color:var(--faint);}
footer .inner{max-width:70rem; margin:0 auto; display:flex; flex-wrap:wrap; justify-content:space-between; gap:.9rem 2rem;}
footer a{color:var(--faint); text-decoration:none;}
footer a:hover{color:var(--light); text-decoration:underline; text-underline-offset:3px;}
footer .socials{display:flex; flex-wrap:wrap; gap:.4rem 1.4rem;}

.simple{min-height:100svh; display:flex; align-items:center; justify-content:center; text-align:center; padding:6rem var(--pad);}
.simple .box{max-width:34rem;}
.simple h1{margin:.8rem 0 1.4rem; font-family:var(--display); font-weight:500; font-size:clamp(3rem,10vw,6rem); line-height:.95; letter-spacing:-.025em;}
.simple p{color:var(--dim); font-size:1.12rem; margin:0 0 1rem;}
.simple p small{display:block; margin-top:.5rem; color:var(--faint); font-size:.9rem;}
.simple .sign{font-family:var(--display); font-style:italic; font-size:1.3rem; color:var(--light); margin:2rem 0 2.2rem;}
.simple .back{display:block; margin-top:2rem; color:var(--faint); font-size:.85rem; letter-spacing:.06em; text-decoration:none;}
.simple .back:hover{color:var(--light);}

.legal{max-width:42rem; margin:0 auto; padding:9rem var(--pad) 6rem;}
.legal h1{margin:.6rem 0 .4rem; font-family:var(--display); font-weight:500; font-size:clamp(2.6rem,7vw,4.4rem); line-height:1; letter-spacing:-.02em;}
.legal .updated{color:var(--faint); font-size:.9rem; margin:0 0 3rem;}
.legal h2{margin:2.6rem 0 .6rem; font-family:var(--display); font-weight:500; font-size:1.5rem; letter-spacing:-.005em;}
.legal p, .legal li{color:var(--dim);}
.legal a{color:var(--light); text-decoration-color:var(--tungsten); text-underline-offset:3px; overflow-wrap:anywhere;}
.legal ul{padding-left:1.3rem;}

@media (max-width:860px){
  .show .grid{grid-template-columns:1fr;}
  .wordmark{max-width:26rem;}
  .stage{padding-top:5rem;}
  .portrait{width:100%; height:78svh; bottom:auto;}
  .portrait img{object-position:50% 12%; -webkit-mask-image:linear-gradient(180deg,#000 55%,transparent 100%); mask-image:linear-gradient(180deg,#000 55%,transparent 100%);}
  .portrait::after{display:none;}
  .name{font-size:clamp(3rem, 14vw, 5rem);}
  .hook{margin-top:2.6rem;}
}
@media (max-width:700px){
  .sitenav .long{display:none;}
  .sitenav .short{display:inline;}
  .topbar .mark{font-size:.9rem; letter-spacing:.1em;}
}
@media (max-width:380px){
  .sitenav{gap:.3rem .8rem; font-size:.78rem;}
  .topbar .mark{font-size:.8rem; letter-spacing:.06em;}
}

.name{font-size:clamp(1.6rem,2.6vw,2.4rem); letter-spacing:0; line-height:1.1;}
.name span{display:inline;} .name span+span{margin-left:.3em;}
.stage .label{margin-bottom:.7rem;}
.tile{display:flex; align-items:center; gap:1.6rem; margin-top:2.4rem; padding:1.2rem 1.4rem; max-width:34rem; background:rgba(6,6,6,.72); border:1px solid var(--rule); animation:rise 1.6s ease 2.3s both;}
.tile .tw{flex:0 0 8.5rem;} .tile .wordmark{max-width:none;}
.tile .btn{padding:.6rem 1.1rem; font-size:.78rem;}
@media (max-width:860px){.name{font-size:1.9rem;} .tile{flex-direction:column; align-items:flex-start; gap:1rem;} .tile .tw{flex-basis:auto; width:9rem;}}

.thanks{position:relative; min-height:100svh; display:flex; align-items:center; justify-content:center; text-align:center; padding:6rem var(--pad) 5rem; overflow:hidden; isolation:isolate;}
.thanks .glow{position:absolute; inset:0; z-index:-1; background:radial-gradient(ellipse 60% 55% at 50% 38%, rgba(231,167,104,.20), rgba(231,167,104,.06) 45%, transparent 72%); animation:lightup 3s cubic-bezier(.3,.1,.2,1) both;}
.thanks .box{max-width:34rem;}
.thanks .label{margin:0 0 1rem; color:var(--tungsten); animation:rise 1.4s ease .5s both;}
.thanks h1{margin:0 0 1.6rem; font-family:var(--display); font-weight:500; font-size:clamp(3.6rem,13vw,7.5rem); line-height:.95; letter-spacing:-.025em; animation:rise 1.8s ease .9s both;}
.thanks p{margin:0 0 1rem; color:var(--dim); font-size:1.12rem; line-height:1.7; animation:rise 1.6s ease 1.5s both;}
.thanks .lede{color:var(--light); font-size:1.3rem;}
.thanks .sign{font-family:var(--display); font-style:italic; font-size:1.5rem; color:var(--light); margin:1.6rem 0 2.8rem;}
.show-tile{display:block; text-decoration:none; text-align:left; padding:1.4rem 1.6rem; border:1px solid var(--rule); background:rgba(6,6,6,.6); transition:border-color .25s ease; animation:rise 1.6s ease 2s both;}
.show-tile:hover{border-color:var(--tungsten);}
.show-tile .k{display:block; font-size:.74rem; letter-spacing:.18em; text-transform:uppercase; color:var(--tungsten);}
.show-tile .t{display:block; margin:.5rem 0 .7rem; font-family:var(--display); font-size:1.7rem; line-height:1.1; color:var(--light);}
.show-tile .go{display:block; font-size:.85rem; letter-spacing:.1em; text-transform:uppercase; color:var(--dim);}
.thanks .follow-label{margin:2.6rem 0 .6rem; font-size:.74rem; letter-spacing:.18em; text-transform:uppercase; color:var(--faint); animation-delay:2.3s;}
.thanks .follow{display:flex; justify-content:center; gap:1.6rem; animation-delay:2.4s;}
.thanks .follow a{color:var(--light); text-decoration:none; border-bottom:1px solid var(--tungsten); padding-bottom:.15rem; font-size:1rem;}
.thanks .back{display:block; margin-top:2.4rem; color:var(--faint); font-size:.85rem; letter-spacing:.06em; text-decoration:none;}
.thanks .back:hover{color:var(--light);}
@media (prefers-reduced-motion:reduce){.thanks .glow,.thanks .label,.thanks h1,.thanks p,.show-tile{animation:none;}}