@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:400 600;font-display:swap;src:url(/fonts/cormorant-latin.woff2) format("woff2")}
@font-face{font-family:Manrope;font-style:normal;font-weight:400 600;font-display:swap;src:url(/fonts/manrope-latin.woff2) format("woff2")}

/* Tokens match curation.cards */
:root{
  --bg:#0e0e0c;--surface:#16150f;--line:#26241f;--line-3:#3a372f;--line-4:#4a4538;
  --text:#f2eee6;--muted:#bdb6a8;--faint:#8a8478;--dim:#5e594f;
  --accent:#c9a96e;--accent-hi:#e2c891;--error:#e8a48a;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;
  --gutter:clamp(20px,6.667vw,96px);
  --ease-out:cubic-bezier(.22,1,.36,1);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--bg);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
  margin:0;min-height:100svh;display:flex;flex-direction:column;
  background:var(--bg);color:var(--text);font:16px/1.5 var(--sans);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip;
}
h1,p,ul{margin:0}
ul{padding:0;list-style:none}
a{color:var(--accent)}
::selection{background:var(--accent);color:var(--bg)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.container{width:100%;max-width:1440px;margin-inline:auto;padding-inline:max(var(--gutter),env(safe-area-inset-left)) max(var(--gutter),env(safe-area-inset-right))}
.hp{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;top:12px;left:12px;z-index:100;padding:12px 18px;background:var(--accent);color:var(--bg);font-weight:600;text-decoration:none;transform:translateY(-200%)}
.skip:focus{transform:none}

/* Header */
.nav{flex:none;height:88px;border-bottom:1px solid var(--line)}
.nav__inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:14px;color:var(--text);text-decoration:none}
.brand__mark{width:30px;height:30px;flex:none;color:var(--accent)}
.brand__name{font:500 26px/1 var(--serif);letter-spacing:.02em}
.brand__sub{color:var(--muted)}
.nav__note{font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--faint)}

/* Stage: everything fits one screen */
.stage{
  flex:1;display:flex;flex-direction:column;justify-content:center;
  gap:clamp(40px,8svh,96px);padding-block:clamp(28px,6svh,72px);position:relative;
}
.stage::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(640px circle at 50% 38%,#c9a96e10,transparent 62%);
}
.intro{display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px;position:relative}
.title{font:400 clamp(40px,5.2vw,76px)/1.04 var(--serif);letter-spacing:-.01em;text-wrap:balance}
.lede{max-width:500px;color:var(--muted);font-size:17px;line-height:1.65;text-wrap:balance}

/* Interest form */
.signup{width:100%;max-width:540px;margin-top:10px}
.interest{display:flex;flex-direction:column;gap:12px;text-align:left}
.interest__label{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.interest__row{display:flex;gap:12px}
.field{
  flex:1;min-width:0;height:54px;padding:0 20px;border:1px solid var(--line-3);border-radius:2px;
  background:var(--surface);color:var(--text);font:400 16px var(--sans);
  transition:border-color .3s,box-shadow .3s;
}
.field::placeholder{color:var(--faint)}
.field:hover{border-color:var(--line-4)}
.field:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #c9a96e2e}
.field[aria-invalid=true]{border-color:var(--error)}
.btn{
  position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  height:54px;padding:0 30px;border:0;border-radius:2px;cursor:pointer;
  background:var(--accent);color:var(--bg);font:600 13px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;
}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--accent-hi);transform:translateY(101%);transition:transform .5s var(--ease-out)}
.btn:hover::before{transform:none}
.btn:active{transform:scale(.985)}
.btn__spinner{display:none;width:16px;height:16px;border:1.5px solid #0e0e0c4d;border-top-color:var(--bg);border-radius:50%;animation:spin .8s linear infinite}
.is-loading .btn__spinner{display:block}
.is-loading .btn{pointer-events:none}
@keyframes spin{to{transform:rotate(360deg)}}
.interest__error{color:var(--error);font-size:14px}
.interest__error:empty{display:none}
.success{font:400 26px/1.3 var(--serif);color:var(--accent);text-align:center;outline:none}
.success[hidden]{display:none}

/* Collections */
.houses{position:relative}
.houses__list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));max-width:860px;margin-inline:auto;border-top:1px solid var(--line)}
.house{display:flex;flex-direction:column;align-items:center;gap:10px;padding:26px 8px 4px;color:var(--dim);text-decoration:none;cursor:default}
.house__mark{width:40px;height:40px}
.house__name{font:400 22px/1 var(--serif);letter-spacing:.02em}
.house__state{font-size:10px;letter-spacing:.2em;text-transform:uppercase}
.house--open{color:var(--accent);cursor:pointer;position:relative;transition:color .3s var(--ease-out)}
.house--open .house__name{color:var(--text)}
.house--open::before{content:"";position:absolute;top:-1px;left:22%;right:22%;height:1px;background:var(--accent)}
.house--open:hover{color:var(--accent-hi)}
.house--open:hover .house__state span{display:inline-block;transform:translateX(3px)}
.house__state span{transition:transform .3s var(--ease-out)}

/* Footer */
.footer{flex:none;border-top:1px solid var(--line);padding-block:18px calc(18px + env(safe-area-inset-bottom))}
.footer__inner{display:flex;justify-content:space-between;gap:24px;font-size:12px;color:var(--faint)}

.grain{
  position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.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 0.9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* Quiet entrance */
@media (prefers-reduced-motion:no-preference){
  .nav,.intro>*,.houses{animation:rise 1.1s var(--ease-out) both}
  .intro>:nth-child(2){animation-delay:.12s}
  .intro>:nth-child(3){animation-delay:.24s}
  .houses{animation-delay:.4s}
  @keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}

@media (min-width:721px) and (max-height:780px){
  .nav{height:72px}
  .stage{gap:clamp(24px,5svh,48px);padding-block:20px}
  .intro{gap:16px}
  .title{font-size:clamp(40px,4.6vw,64px)}
  .house{padding-top:20px}
}

@media (max-width:720px){
  .nav{height:68px}
  .brand{gap:10px}
  .brand__mark{width:24px;height:24px}
  .brand__name{font-size:21px}
  .nav__note{display:none}
  .stage{gap:clamp(28px,5svh,48px)}
  .intro{gap:16px}
  .lede{font-size:15px}
  .interest__row{flex-direction:column}
  .field{flex:none;width:100%}
  .btn{width:100%}
  .house:not(.house--open) .house__state{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .houses__list{gap:0}
  .house{padding:18px 2px 0;gap:8px}
  .house__mark{width:30px;height:30px}
  .house__name{font-size:17px}
  .house__state{font-size:8.5px;letter-spacing:.14em}
  .footer__inner{flex-direction:column;gap:4px;font-size:11px}
}

@media (max-width:720px) and (max-height:700px){
  .nav{height:60px}
  .stage{gap:22px;padding-block:18px}
  .intro{gap:12px}
  .title{font-size:38px}
  .field,.btn{height:48px}
  .signup{margin-top:4px}
  .footer{padding-block:12px calc(12px + env(safe-area-inset-bottom))}
}