/* Dar forma · Trama — capa sobre motion.css. Misma sobriedad, otra materia. */
@font-face{font-family:"Instrument Sans";src:url("assets/fonts/instrument-sans-latin.woff2") format("woff2");font-weight:400 700;font-stretch:75% 100%;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Instrument Sans";src:url("assets/fonts/instrument-sans-latin-ext.woff2") format("woff2");font-weight:400 700;font-stretch:75% 100%;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

body{font-family:"Instrument Sans",Arial,Helvetica,sans-serif}
h1,h2,h3{letter-spacing:-.045em}
.opening h1{letter-spacing:-.06em;font-stretch:88%;font-weight:500}
.contact h2{letter-spacing:-.055em;font-weight:500}
.wordmark{letter-spacing:-.01em}

/* Portada: los enfoques, nombrados sin rodeos */
.opening-meta .roles{font-weight:600;letter-spacing:.03em;line-height:1.55}

/* Respaldo sin WebGL: líneas en lugar de volúmenes */
.fallback-art div{background:repeating-linear-gradient(0deg,transparent 0 9px,#8a8a8a 9px 10px);border:0;box-shadow:none;opacity:.55}
.fallback-art div:nth-child(2){background:repeating-linear-gradient(90deg,transparent 0 9px,#8a8a8a 9px 10px)}

/* La promesa */
.promise{position:relative;background:#101010;color:#eee;padding:140px 5% 150px;border-top:1px solid #222}
.promise-inner{max-width:1180px;display:grid;gap:34px}
.promise .eyebrow{color:#8f8f8f}
.promise h2{font-size:clamp(44px,5.6vw,92px);line-height:.98}
.promise h2 em{color:#8d8d8d}
.promise-lede{font-size:clamp(19px,1.7vw,26px);line-height:1.4;color:#bdbdbd;max-width:36ch}
.verbs{list-style:none;margin:30px 0 0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid #333}
.verbs li{padding:20px 18px 0 0;font-size:15px;line-height:1.35;color:#d8d8d8;border-right:1px solid #262626;padding-left:16px}
.verbs li:first-child{padding-left:0}
.verbs li:last-child{border-right:0;color:#fff}
.verbs span{display:block;font-family:Consolas,monospace;font-size:10px;color:#777;margin-bottom:10px}
@media(max-width:850px){.verbs{grid-template-columns:repeat(3,1fr);row-gap:22px}.verbs li:nth-child(3n){border-right:0}.verbs li:nth-child(4){padding-left:0}}
@media(max-width:600px){.promise{padding:90px 6% 100px}.verbs{grid-template-columns:1fr 1fr}.verbs li{border-right:0;padding-left:0}.promise h2 br{display:none}}

/* Capacidades: la acción primero, los lugares después */
.cap .project-title .eyebrow{color:#2b2b2b;font-weight:600;letter-spacing:.07em}
.cap .project-type{font-size:12.5px;line-height:1.55;color:#5f5f5f;max-width:34ch}
.cap .project-type b{display:block;font-family:Consolas,monospace;font-weight:400;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:#8a8a8a;margin-bottom:6px}
.work-header h2{letter-spacing:-.05em}

/* Móvil: un velo bajo el texto para que los hilos nunca compitan con la lectura durante las transiciones */
@media(max-width:600px){
 .chapter-copy,.resolution-copy{bottom:0!important;padding-top:64px;padding-bottom:calc(12svh + 8px);background:linear-gradient(to bottom,rgba(16,16,16,0) 0,rgba(16,16,16,.84) 64px,rgba(16,16,16,.92) 100%)}
 .scene-caption{z-index:3}
 .chapter-copy{left:0!important;width:100%;padding-left:6%;padding-right:6%}
 .resolution-copy{left:0;width:100%;padding-left:6%;padding-right:6%}
}

/* Selector de idioma */
.top-right{display:flex;align-items:center;gap:26px}
.lang{font-size:11px;letter-spacing:.08em;padding:5px 8px;border:1px solid rgba(255,255,255,.55);line-height:1}
.lang:hover{background:#fff;color:#000;opacity:1!important}
html[lang="en"] .opening h1{font-size:15.4vw}
@media(max-width:600px){.top-right{gap:16px}html[lang="en"] .opening h1{font-size:15vw}}