:root{
  --ground:#14110F;
  --surface:#1C1815;
  --line:#35302B;
  --line-soft:#26221E;
  --text:#EFEAE5;
  --text-soft:#C8C2BB;
  --muted:#939598;
  --accent:#CB5A28;
  --accent-dim:#8C3E1C;
  color-scheme: dark;
  --display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --serif:"Spectral",Georgia,"Times New Roman",serif;
}

*{box-sizing:border-box;}

html{scroll-behavior:smooth;}

body{
  margin:0;
  background:var(--ground);
  color:var(--text);
  font-family:var(--display);
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;}

.wrap{
  max-width:1120px;
  margin:0 auto;
  padding-inline:20px;
}

/* ---------- language switch ---------- */
[lang="en"]{display:none;}
html[data-lang="en"] [lang="en"]{display:revert;}
html[data-lang="en"] [lang="es"]{display:none;}

/* ---------- header ---------- */
.site{
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(20,17,15,.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line-soft);
}
.site .wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding-block:14px;
}
.mark{display:block;width:140px;height:auto;}
.lang{
  display:flex;align-items:center;gap:2px;
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;
}
.lang button{
  appearance:none;background:none;border:1px solid transparent;
  color:var(--muted);font:inherit;letter-spacing:inherit;text-transform:inherit;
  padding:5px 9px;cursor:pointer;border-radius:2px;
}
.lang button:hover{color:var(--text);}
.lang button[aria-pressed="true"]{color:var(--accent);border-color:var(--accent-dim);}
.lang button:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.lang .sep{color:var(--line);}

/* ---------- intro ---------- */
.intro{padding-block:64px 40px;}
.eyebrow{
  font-size:11px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--accent);margin:0 0 20px;
}
.intro h1{
  font-weight:600;
  font-size:clamp(28px,5.2vw,46px);
  line-height:1.12;letter-spacing:-.01em;
  margin:0 0 20px;max-width:18ch;text-wrap:balance;
}
.lede{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(16px,2.1vw,19px);line-height:1.62;
  color:var(--text-soft);max-width:60ch;margin:0;
}
.confidential{
  margin-top:28px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);border-left:2px solid var(--accent-dim);padding-left:12px;
}

/* ---------- framed rule ---------- */
.rule{display:flex;align-items:center;gap:14px;margin-block:0;}
.rule::before,.rule::after{content:"";flex:1;height:1px;background:var(--line);}
.rule span{
  font-size:11px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--muted);white-space:nowrap;
}

/* ---------- index ---------- */
.index{padding-block:8px;}
.index ol{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-soft);}
.index li{border-bottom:1px solid var(--line-soft);}
.index a{
  display:grid;grid-template-columns:1fr auto;gap:4px 20px;align-items:baseline;
  padding-block:16px;text-decoration:none;color:inherit;
}
.index a:hover .ix-title{color:var(--accent);}
.index a:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
.ix-title{
  font-weight:600;font-size:clamp(17px,2.6vw,21px);
  letter-spacing:.01em;transition:color .15s ease;
}
.ix-meta{
  font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);text-align:right;
}

/* ---------- projects ---------- */
.projects{padding-block:56px 24px;}
.projects .wrap{display:flex;flex-direction:column;gap:72px;}

.project{
  display:grid;
  grid-template-columns:minmax(0,300px) minmax(0,1fr);
  gap:36px;
  scroll-margin-top:96px;
}

.keyart-real{
  display:block;width:100%;height:auto;max-width:300px;
  border:1px solid var(--line);
  align-self:start;
}

.info{min-width:0;}
.p-head{border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:20px;}
.p-title{
  font-weight:600;font-size:clamp(26px,4.4vw,38px);
  line-height:1.08;letter-spacing:-.005em;margin:0 0 6px;text-wrap:balance;
}
.p-alt{
  font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:16px;color:var(--muted);margin:0;
}
.spec{
  display:flex;flex-wrap:wrap;gap:6px 10px;margin:0 0 22px;padding:0;list-style:none;
  font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
}
.spec li{display:flex;align-items:center;gap:10px;}
.spec li + li::before{content:"";width:3px;height:3px;background:var(--line);border-radius:50%;}
.status{
  display:inline-flex;align-items:center;gap:8px;
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);
  border:1px solid var(--accent-dim);padding:5px 11px;margin:0 0 22px;
}
.status::before{content:"";width:5px;height:5px;background:var(--accent);border-radius:50%;}
.logline{
  font-family:var(--serif);font-size:clamp(17px,2.3vw,20px);line-height:1.6;
  color:#DED8D1;max-width:56ch;margin:0 0 26px;
}
.honors{display:grid;gap:12px;margin-bottom:26px;}
.honor{
  display:flex;gap:12px;align-items:flex-start;
  border-left:2px solid var(--accent-dim);padding-left:14px;
  font-size:13px;line-height:1.5;color:var(--text-soft);max-width:48ch;
}
.honor > div{min-width:0;}
.honor strong{
  display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent);font-weight:600;margin-bottom:3px;
}
.credits{margin:0 0 26px;padding:0;list-style:none;display:grid;gap:7px;font-size:14px;}
.credits li{display:grid;grid-template-columns:minmax(120px,auto) 1fr;gap:4px 16px;}
.credits .role{
  font-size:11px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--muted);padding-top:3px;
}
.downloads{display:flex;flex-wrap:wrap;gap:10px;}
.dl{
  display:inline-flex;align-items:center;gap:9px;
  border:1px solid var(--line);color:var(--text);background:var(--surface);
  text-decoration:none;font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  padding:11px 15px;transition:border-color .15s ease,color .15s ease;cursor:pointer;
}
.dl:hover{border-color:var(--accent-dim);color:var(--accent);}
.dl:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.dl svg{width:13px;height:13px;flex:none;}
.dl-soon{color:var(--muted);background:none;border-style:dashed;cursor:default;}
.dl-soon:hover{border-color:var(--line);color:var(--muted);}

/* ---------- contact ---------- */
.contact{padding-block:64px 80px;}
.contact-inner{
  border:1px solid var(--line);
  padding:clamp(24px,4vw,44px);
  display:grid;gap:22px;
}
.contact h2{font-weight:600;font-size:clamp(22px,3.4vw,30px);margin:0;letter-spacing:-.005em;}
.contact p{
  font-family:var(--serif);font-size:17px;line-height:1.6;
  color:var(--text-soft);margin:0;max-width:52ch;
}
.addr{display:grid;gap:6px;font-size:15px;}
.addr .k{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);}
.addr .v{
  font-size:clamp(17px,2.6vw,22px);font-weight:500;color:var(--accent);
  user-select:all;word-break:break-word;
}
.pending{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}

footer.foot{
  border-top:1px solid var(--line-soft);
  padding-block:26px 40px;
  display:flex;flex-wrap:wrap;gap:12px 24px;
  justify-content:space-between;align-items:center;
  font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);
}

/* ---------- home ---------- */
.home-hero{
  min-height:min(72vh,620px);
  display:flex;flex-direction:column;justify-content:center;
  padding-block:80px 60px;
}
.home-mark{width:min(360px,72vw);height:auto;display:block;margin-bottom:36px;}
.home-hero h1{
  font-weight:500;font-size:clamp(20px,3.2vw,28px);line-height:1.25;
  margin:0 0 22px;max-width:22ch;letter-spacing:-.005em;
}

@media (max-width:820px){
  .project{grid-template-columns:1fr;gap:26px;}
  .keyart-real{max-width:280px;}
  .projects .wrap{gap:60px;}
  .intro{padding-block:44px 32px;}
}
@media (max-width:440px){
  .keyart-real{max-width:100%;}
  .credits li{grid-template-columns:1fr;}
  .index a{grid-template-columns:1fr;}
  .ix-meta{text-align:left;}
}

@media (prefers-reduced-motion:reduce){
  *{transition:none !important;}
  html{scroll-behavior:auto;}
}
