:root{
  --void:#0d0b09; --dirt:#1a1610; --mud:#2a2318; --soot:#5a4d3a;
  --rust:#8f3a14; --rust-2:#d07a3f;
  --bone:#c8b898; --pale:#b8a888; --dim:#9a8d78;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
body{background:var(--void);color:var(--bone);font-family:'Space Mono',ui-monospace,Menlo,monospace;font-size:14px;line-height:1.6;overflow-x:hidden}

body::before{
  content:'';
  position:fixed;inset:0;
  background:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.06'/%3E%3C/svg%3E");
  pointer-events:none;
  z-index:9999;
}

::selection{background:var(--rust);color:var(--void)}

/* NAV */
.nav{position:sticky;top:0;z-index:100;background:linear-gradient(180deg,rgba(13,11,9,.95),rgba(13,11,9,.75));backdrop-filter:blur(12px);border-bottom:1px solid var(--mud)}
.nav-inner{max-width:1440px;margin:0 auto;padding:20px 40px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:40px}
.wordmark{font-family:'Anton',sans-serif;font-size:22px;letter-spacing:.06em;color:var(--bone);text-transform:uppercase;display:flex;align-items:center;gap:10px;white-space:nowrap}
.nav-links{display:flex;gap:28px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--pale);list-style:none}
.nav-links a{transition:color .2s}
.nav-links a:hover{color:var(--bone)}
.nav-links a.active{color:var(--rust-2)}
.lang{display:flex;align-items:center;font-size:10px;letter-spacing:.14em;color:var(--dim);gap:6px;border:1px solid var(--mud);padding:4px}
.lang a{display:flex}
.lang span{padding:3px 6px;cursor:pointer;display:inline-block}
.lang span.on{background:var(--mud);color:var(--bone)}
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border:1px solid var(--mud);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--bone);cursor:pointer;background:transparent;font-family:'Space Mono',monospace;transition:border-color .2s}
.btn:hover{border-color:var(--bone)}
.btn.rust{background:var(--rust);border-color:var(--rust);color:var(--bone);font-weight:700}
.btn.rust:hover{background:var(--rust-2);border-color:var(--rust-2);color:var(--void)}
.nav-cta{display:flex;gap:10px;align-items:center}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:8px;flex-direction:column;gap:5px}
.nav-toggle span{display:block;width:24px;height:2px;background:var(--bone);transition:transform .3s,opacity .3s}

/* HERO */
.page-hero{max-width:1440px;margin:0 auto;padding:100px 60px 80px;border-bottom:1px solid var(--mud);display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:end}
.page-hero .crumb{font-size:11px;letter-spacing:.2em;color:var(--rust-2);text-transform:uppercase;margin-bottom:28px}
.page-hero .crumb b{color:var(--pale);font-weight:400;margin-right:10px}
.page-hero .num{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.2em;color:var(--dim);margin-bottom:18px;text-transform:uppercase}
.page-hero h1{font-family:'Anton',sans-serif;font-weight:normal;text-transform:uppercase;font-size:clamp(96px,12vw,180px);line-height:.86;letter-spacing:.01em;color:var(--bone);margin:0}
.page-hero h1 em{font-family:'Fraunces',serif;font-style:italic;font-weight:400;color:var(--rust-2);text-transform:none;font-size:.5em;display:block;letter-spacing:0;margin-top:16px;line-height:1.1}
.page-hero .side{color:var(--pale);font-size:15px;line-height:1.75;max-width:40ch}
.page-hero .side p+p{margin-top:14px}

/* FILTER BAR */
.filter-bar{max-width:1440px;margin:0 auto;padding:32px 60px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;border-bottom:1px solid var(--mud);font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.filter-bar .lbl{color:var(--dim)}
.filters{display:flex;gap:4px;flex-wrap:wrap}
.filters button{all:unset;cursor:pointer;padding:8px 14px;border:1px solid var(--mud);color:var(--pale);font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.filters button.on{background:var(--rust);border-color:var(--rust);color:var(--bone);font-weight:700}
.filters button:hover:not(.on){border-color:var(--bone);color:var(--bone)}
.sort{color:var(--pale)}
.sort span{color:var(--bone);margin-left:6px}

/* GRID — asymmetric */
.grid{max-width:1440px;margin:0 auto;padding:80px 60px 40px;display:grid;grid-template-columns:repeat(12,1fr);gap:24px}
.card{position:relative;background:var(--dirt);border:1px solid var(--mud);overflow:hidden;transition:border-color .2s}
.card:hover{border-color:var(--rust)}
.card .img{position:relative;overflow:hidden;background:var(--dirt)}
.card .img .ph{position:absolute;inset:0}
.card .img .ph.a{background:
  repeating-linear-gradient(135deg, rgba(168,152,120,.06) 0 2px, transparent 2px 22px),
  radial-gradient(ellipse at 30% 40%, #3a2e20 0%, #1a1610 55%, #0d0b09 100%)}
.card .img .ph.b{background:
  repeating-linear-gradient(-20deg, rgba(216,122,63,.07) 0 1px, transparent 1px 18px),
  radial-gradient(ellipse at 60% 50%, #4a3524 0%, #241812 60%, #0d0b09 100%)}
.card .img .ph.c{background:
  repeating-linear-gradient(90deg, rgba(168,152,120,.05) 0 1px, transparent 1px 26px),
  radial-gradient(ellipse at 50% 45%, #3d2e1f 0%, #1a1310 60%)}
.card .img .ph.d{background:
  repeating-linear-gradient(160deg, rgba(139,69,19,.1) 0 1px, transparent 1px 14px),
  radial-gradient(ellipse at 35% 60%, #2d241a 0%, #0d0b09 70%)}
.card .num{position:absolute;top:14px;left:14px;font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.2em;color:var(--pale);background:rgba(13,11,9,.7);padding:4px 10px}
.card .tag{position:absolute;top:14px;right:14px;font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--rust-2);background:rgba(13,11,9,.7);padding:4px 10px;border:1px solid var(--rust)}
.card .body{padding:28px 28px 30px;border-top:1px solid var(--mud)}
.card h2{font-family:'Anton',sans-serif;font-weight:normal;text-transform:uppercase;font-size:clamp(32px,3vw,44px);line-height:.95;letter-spacing:.02em;color:var(--bone);margin:0 0 6px}
.card .role{font-family:'Fraunces',serif;font-style:italic;color:var(--rust-2);font-size:14px;margin-bottom:14px}
.card .spec{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:16px;line-height:1.6}
.card .excerpt{color:var(--pale);font-size:13px;line-height:1.7;margin:0}
.card .foot{margin-top:22px;padding-top:16px;border-top:1px dashed var(--mud);display:flex;justify-content:space-between;align-items:center;font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--pale)}
.card .foot .arr{color:var(--rust-2);font-size:14px}
.card .status{color:var(--dim)}
.card .status.sold{color:var(--dim)}
.card .status.avail{color:var(--rust-2)}

.card.size-hero{grid-column:span 12}
.card.size-hero .img{aspect-ratio:21/9}
.card.size-hero .body{display:grid;grid-template-columns:1fr 1fr;gap:48px;padding:40px 40px 40px}
.card.size-hero .body .left{border-right:1px solid var(--mud);padding-right:40px}
.card.size-hero .body .right{align-self:end}
.card.size-hero h3{font-size:clamp(56px,6vw,96px)}
.card.size-hero .excerpt{font-family:'Fraunces',serif;font-style:italic;font-size:19px;color:var(--bone);max-width:48ch}
.card.size-hero .foot{grid-column:1/-1;margin-top:0;padding-top:28px}

.card.size-lg{grid-column:span 8}
.card.size-lg .img{aspect-ratio:4/3}
.card.size-md{grid-column:span 4}
.card.size-md .img{aspect-ratio:3/4}
.card.size-wide{grid-column:span 6}
.card.size-wide .img{aspect-ratio:5/4}
.card.size-sm{grid-column:span 4}
.card.size-sm .img{aspect-ratio:4/5}

/* ARCHIVE LINE */
.archive-head{max-width:1440px;margin:80px auto 0;padding:60px 60px 28px;border-top:1px solid var(--mud);display:flex;justify-content:space-between;align-items:baseline;font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}
.archive-head h2{font-family:'Anton',sans-serif;font-weight:normal;font-size:clamp(32px,4vw,56px);text-transform:uppercase;letter-spacing:.02em;color:var(--bone);margin:0}
.archive{max-width:1440px;margin:0 auto;padding:0 60px 80px}
.archive-row{display:grid;grid-template-columns:60px 1fr 120px 140px 180px 24px;gap:24px;align-items:center;padding:22px 0;border-bottom:1px dashed var(--mud);font-family:'Space Mono',monospace;font-size:12px;color:var(--pale);cursor:pointer;transition:background .15s}
.archive-row:hover{background:rgba(184,82,31,.05)}
.archive-row .n{color:var(--dim);letter-spacing:.14em}
.archive-row .t{font-family:'Anton',sans-serif;font-size:22px;color:var(--bone);letter-spacing:.02em;text-transform:uppercase;line-height:1}
.archive-row .t small{display:block;font-family:'Fraunces',serif;font-style:italic;font-size:12px;color:var(--rust-2);margin-top:4px;letter-spacing:0;text-transform:none}
.archive-row .line-tag{color:var(--rust-2);letter-spacing:.18em;text-transform:uppercase;font-size:10px}
.archive-row .m{color:var(--dim);letter-spacing:.14em;text-transform:uppercase;font-size:10px}
.archive-row .s{letter-spacing:.16em;text-transform:uppercase;font-size:10px;text-align:right}
.archive-row .s.sold{color:var(--dim)}
.archive-row .s.avail{color:var(--rust-2)}
.archive-row .arr{color:var(--dim);text-align:right}
.archive-row:hover .arr{color:var(--rust-2)}

/* MANIFEST BAND */
.band{background:var(--dirt);border-top:1px solid var(--mud);border-bottom:1px solid var(--mud);padding:120px 60px}
.band blockquote{max-width:940px;margin:0 auto;font-family:'Anton',sans-serif;font-weight:normal;text-transform:uppercase;font-size:clamp(40px,5.6vw,80px);line-height:.98;color:var(--bone);text-align:center;letter-spacing:.02em}
.band blockquote em{font-family:'Fraunces',serif;font-style:italic;color:var(--rust-2);text-transform:none;font-weight:400;letter-spacing:0}
.band .attrib{text-align:center;margin-top:36px;font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.2em;color:var(--dim);text-transform:uppercase}

/* CTA */
.cta{padding:120px 60px;border-bottom:1px solid var(--mud);text-align:center;max-width:1440px;margin:0 auto}
.cta .k{font-size:11px;letter-spacing:.2em;color:var(--rust-2);text-transform:uppercase;margin-bottom:24px}
.cta h2{font-family:'Anton',sans-serif;font-weight:normal;font-size:clamp(56px,8vw,112px);line-height:.92;letter-spacing:.02em;text-transform:uppercase;color:var(--bone);margin:0}
.cta h2 em{font-family:'Fraunces',serif;font-style:italic;color:var(--rust-2);text-transform:none;font-weight:400;letter-spacing:0}
.cta p{max-width:52ch;margin:28px auto 36px;color:var(--pale);font-size:15px;line-height:1.75}
.cta-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* FOOTER */
.foot-site{padding:48px 60px;border-top:1px solid var(--mud);display:grid;grid-template-columns:1fr auto 1fr;gap:40px;align-items:center;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}
.foot-site .center{text-align:center;color:var(--pale)}
.foot-site .right{text-align:right}

a:focus-visible,button:focus-visible{outline:2px solid var(--rust);outline-offset:2px}

@media (max-width:960px){
  .nav-inner{grid-template-columns:1fr auto;padding:16px 20px;gap:20px}
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;padding:16px 24px;gap:16px;background:rgba(13,11,9,.98);border-bottom:1px solid var(--mud)}
  .nav-links.open{display:flex}
  .nav-cta{display:none}
  .nav-toggle{display:flex}
  .page-hero{grid-template-columns:1fr;padding:60px 24px}
  .filter-bar,.grid,.archive,.archive-head,.band,.cta,.foot-site{padding-left:24px;padding-right:24px}
  .grid{grid-template-columns:1fr;gap:20px}
  .card.size-hero,.card.size-lg,.card.size-md,.card.size-wide,.card.size-sm{grid-column:span 1}
  .card.size-hero .body{grid-template-columns:1fr}
  .card.size-hero .body .left{border-right:none;border-bottom:1px solid var(--mud);padding-right:0;padding-bottom:24px}
  .archive-row{grid-template-columns:44px 1fr auto;gap:14px}
  .archive-row .line-tag,.archive-row .m,.archive-row .arr{display:none}
  .foot-site{grid-template-columns:1fr;text-align:center}
  .foot-site .right{text-align:center}
}

@media print{
  body::before{display:none}
  .nav{display:none}
  *{color:#000 !important;background:#fff !important}
}
