/* TDA — compatibilidad y composición fluida. Cargar después de styles.css. */
@font-face{font-family:'TDA Archivo Black';src:url('fonts/archivo-black.woff') format('woff'),url('fonts/ArchivoBlack-Regular.ttf') format('truetype');font-weight:800;font-style:normal;font-display:swap}
:root{--gutter:1.25rem;--gutter:clamp(1rem,5vw,6rem);--edge:var(--gutter);--edge:max(var(--gutter),calc((100% - 100rem)/2))}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:2rem}
[hidden]{display:none!important}
img{height:auto}picture{display:block}
p,h1,h2,h3,a,summary,small{overflow-wrap:break-word;overflow-wrap:anywhere}
.section-pad{padding-left:var(--edge);padding-right:var(--edge);padding-top:clamp(3rem,7vw,7rem);padding-bottom:clamp(3rem,7vw,7rem)}
.section-top{gap:1.5rem}.section-top>*{min-width:0}.section-caption{line-height:1.15}
.site-header{padding-left:var(--edge);padding-right:var(--edge);flex-wrap:wrap;align-items:center;gap:1rem 2rem;padding-top:1.5rem;padding-top:max(1.5rem,env(safe-area-inset-top,0px))}
.wordmark,.contact-brand{font-family:'TDA Archivo Black','Arial Black',Arial,Helvetica,sans-serif;font-weight:800;letter-spacing:-.055em;line-height:1;flex-shrink:0}
.wordmark{font-size:3rem;font-size:clamp(2.25rem,4vw,4.5rem)}
.wordmark .registered,.contact-brand .registered{font-family:Arial,Helvetica,sans-serif;align-self:baseline;font-weight:400;line-height:1}
.header-actions{flex-wrap:wrap;gap:1rem}.contact-shortcut,.index-fallback{display:inline-flex;align-items:center;min-height:44px;font-size:.875rem}
.no-js .menu-toggle,body:not(.no-js) .index-fallback{display:none}
.menu-toggle,.hero-next,.menu-close,.gallery-controls button,.top-link,.contact-bottom>a{min-height:44px}
.hero{height:auto;min-height:100vh;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto 1fr;gap:3rem 2rem;padding:10rem var(--edge) 3rem;padding-bottom:max(3rem,env(safe-area-inset-bottom,0px))}
@supports(height:100svh){.hero{min-height:100svh}}
.hero>picture,.consequences>picture{position:absolute;inset:0;width:100%;height:100%;z-index:-3}
.hero h1{grid-column:2;margin:0;min-width:0;font-size:4rem;font-size:clamp(3rem,7.1vw,8.5rem);line-height:.95}
.hero-bottom{position:relative;inset:auto;grid-column:1/-1;align-self:end;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:2rem}
.position-title{font-size:3.5rem;font-size:clamp(2.25rem,7vw,8rem);line-height:1.05}
.position-title span,.consequences h2 span,.studio h2 span,.contact h2{font-weight:700}
.position-columns,.studio-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem;gap:clamp(1.5rem,6vw,6rem);max-width:82rem}
.position-columns p,.studio-columns>p{font-size:1.4rem;font-size:clamp(1.25rem,2.2vw,2.15rem);line-height:1.35}
.principles{grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem;gap:clamp(1.5rem,4vw,5rem)}
.principle{min-width:0}.principle:nth-child(n){padding-top:0;margin-top:0}.principle:nth-child(2){margin-top:7rem}.principle:nth-child(3){margin-top:14rem}.principle:nth-child(5){margin-top:4rem}
.principle-number{font-size:6rem;font-size:clamp(5rem,12vw,11rem);line-height:.95}.principle h3{line-height:1.15}.principle p{max-width:28ch;line-height:1.45}
.project-heading{grid-template-columns:minmax(3rem,.35fr) minmax(0,1.2fr) minmax(0,1.5fr);gap:1.5rem}
.project-heading>*,.project-meta>*{min-width:0}.project h3{font-size:2.5rem;font-size:clamp(2rem,4vw,4.5rem);line-height:1.12}.project-summary{line-height:1.45}
.project-media{overflow:visible}.project-media img{width:100%;height:28rem;height:clamp(18rem,42vw,48rem);aspect-ratio:auto;object-fit:cover}
.project-concept{right:1rem;font-size:3rem;font-size:clamp(2rem,5vw,5rem);line-height:1.05}
.project-meta{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:1rem 2rem}
.project-caption{max-width:none;text-align:left}.project-caption small{font-size:.8125rem;line-height:1.5}
.gallery-controls{grid-column:1/-1;justify-self:end;flex-wrap:wrap;max-width:100%;gap:.75rem}.gallery-controls button{padding:.65rem .6rem}.gallery-counter{font-size:.875rem}
.no-js .gallery-controls{display:none}
.consequences{height:auto;min-height:42rem;min-height:min(92vh,60rem);padding:6rem var(--edge)}
.consequences>.eyebrow,.quote-credit{position:relative;inset:auto}.consequences>.eyebrow{margin-bottom:3rem}.quote-credit{margin-top:3rem;font-size:.8125rem}
.consequences h2{font-size:3rem;font-size:clamp(2rem,6vw,6.5rem);line-height:1.1}
.note summary{grid-template-columns:2rem minmax(0,1fr) minmax(6rem,.35fr) 2.75rem}.note-title{line-height:1.2}.note-body{line-height:1.5;margin-left:3.5rem}
.studio h2{font-size:4rem;font-size:clamp(2.75rem,8vw,9rem);line-height:1.07}.studio-info{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr)}
.contact{color:#fff}.contact h2{font-size:3rem;font-size:clamp(2rem,7.3vw,8rem);line-height:1.12}.contact-email{max-width:100%;font-size:1.5rem;font-size:clamp(1.125rem,3.5vw,3.5rem);line-height:1.4;overflow-wrap:anywhere;border-color:#fff}
.contact .top-link,.contact-bottom>a{border-color:#fff}.contact .legal{border-color:rgba(255,255,255,.7)}
.contact-bottom{grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem}.contact-bottom>a{display:inline-flex;flex-wrap:wrap;gap:.3rem;align-items:center}
.contact-brand{font-size:4rem;font-size:clamp(3rem,8vw,8rem)}.legal{flex-wrap:wrap;gap:1rem;font-size:.8125rem;padding-bottom:2rem}
.chapter-indicator{max-width:calc(100% - 1.5rem);flex-wrap:wrap;bottom:max(.75rem,env(safe-area-inset-bottom,0px));left:max(.75rem,env(safe-area-inset-left,0px));pointer-events:none}
.no-js .chapter-indicator,.no-js .reading-progress{display:none}
.site-menu{width:100%;max-width:100%;height:100vh;max-height:100vh;padding:2rem var(--edge);overscroll-behavior:contain}
.site-menu:not([open]){display:none}.site-menu[open]{display:block;position:fixed;inset:0;z-index:100}
@supports(height:100dvh){.site-menu{height:100dvh;max-height:100dvh}}
.menu-top,.menu-bottom{flex-wrap:wrap;gap:1rem}.menu-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem 3rem}.menu-links a{font-size:2.5rem;font-size:clamp(1.75rem,4vw,4rem);line-height:1.3;min-height:44px}.menu-links a span{flex-shrink:0}.menu-bottom{padding-bottom:max(1rem,env(safe-area-inset-bottom,0px))}
a:focus,button:focus,summary:focus{outline:3px solid var(--red);outline-offset:4px}.contact a:focus,.contact a:focus-visible{outline-color:#fff}
@supports selector(:focus-visible){a:focus:not(:focus-visible),button:focus:not(:focus-visible),summary:focus:not(:focus-visible){outline:none}}
@media(hover:none){.project-media:hover img{filter:grayscale(1)}}
@media(max-width:64rem){
 .header-location{display:none}.hero{padding-top:8.5rem}
 .project-heading{grid-template-columns:4rem minmax(0,1fr)}.project-summary{grid-column:2;max-width:none}
 .project-media,.project-meta,.project:nth-child(even) .project-media,.project:nth-child(even) .project-meta{margin-left:0;margin-right:0}
 .principle:nth-child(2){margin-top:4rem}.principle:nth-child(3){margin-top:8rem}
}
@media(max-width:48rem){
 .site-header{gap:.75rem}.header-actions{gap:.75rem}.menu-word{display:none}.menu-toggle{padding:.75rem;min-width:44px}
 .hero{grid-template-columns:minmax(0,1fr);gap:3rem}.hero h1{grid-column:1;margin:0;font-size:4rem;font-size:clamp(2.5rem,13vw,6.5rem);max-width:12ch}
 .hero-bottom{grid-template-columns:minmax(0,1fr) auto;gap:1.5rem}.hero-next{grid-column:2;grid-row:1;justify-self:end}.hero-credit{grid-column:1/-1;text-align:left}
 .position-columns,.studio-columns{grid-template-columns:minmax(0,1fr);gap:2rem}
 .principles{grid-template-columns:repeat(2,minmax(0,1fr))}.principle:nth-child(n){margin-top:0;padding-top:0}.principle:nth-child(even){margin-top:3rem}
 .project-media img{height:23rem;height:clamp(18rem,75vw,34rem)}.project-concept{left:1.25rem;right:1.25rem;bottom:1.25rem;font-size:2.5rem;font-size:clamp(2rem,6vw,3rem)}
 .note summary{grid-template-columns:1.5rem minmax(0,1fr) 2rem;gap:.75rem}.note-category{display:none}.note-body{margin-left:0}
 .contact-bottom{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem}.contact-bottom>a{grid-column:1/-1;justify-self:start}
 .menu-links{grid-template-columns:minmax(0,1fr)}.consequences{min-height:0;padding-top:4rem;padding-bottom:4rem}
}
@media(max-width:32rem){
 .section-top{flex-wrap:wrap;gap:1rem}.section-caption{width:100%;max-width:none}
 .principles{grid-template-columns:minmax(0,1fr)}.principle:nth-child(n){margin-top:0}.principle p{max-width:38ch}.principle-number{font-size:5rem}
 .project-heading{grid-template-columns:3rem minmax(0,1fr);gap:.75rem}.project-summary{grid-column:1/-1}.project-meta{grid-template-columns:minmax(0,1fr)}.gallery-controls{justify-self:start}
 .hero{padding-top:8rem}.contact-bottom{grid-template-columns:minmax(0,1fr)}.contact-bottom>a{grid-column:1}
}
@media(max-width:24rem){
 .site-header{padding-top:1rem}.wordmark{font-size:2.25rem}.header-actions{gap:.5rem}.contact-shortcut{font-size:.8125rem}
 .hero-bottom{grid-template-columns:minmax(0,1fr)}.hero-next{grid-column:1;grid-row:auto;justify-self:start}.hero h1{font-size:3rem;font-size:clamp(2rem,12vw,3rem)}
 .project-concept{position:relative;inset:auto;padding:1rem;background:var(--ink);font-size:2rem;text-shadow:none}.project-media::after{display:none}.project-media img{height:auto}
 .studio-info{grid-template-columns:minmax(0,1fr);gap:.75rem}
}
@media(max-height:32rem) and (orientation:landscape){.hero{min-height:0;padding-top:7.5rem;padding-bottom:2rem}.hero h1{font-size:3rem;font-size:clamp(2rem,7vw,4rem)}.hero-bottom{margin-top:1rem}.chapter-indicator{display:none}}
@supports not (display:grid){
 .hero,.hero-bottom,.position-columns,.studio-columns,.principles,.project-heading,.project-meta,.note summary,.studio-info,.contact-bottom,.menu-links{display:block}
 .hero h1,.hero-bottom>*,.position-columns>*,.studio-columns>*,.principle,.project-heading>*,.project-meta>*,.contact-bottom>*,.menu-links>*{margin-bottom:1.5rem}
 .principle:nth-child(n){margin-top:0}.note summary>*{display:inline-block;margin-right:.5rem}.note-category{display:none}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
@media(forced-colors:active){.hero-wash,.quote-shade{background:Canvas;opacity:.92}.menu-toggle,.hero-next,.gallery-controls button{border:1px solid ButtonText}}
@media print{.site-menu,.chapter-indicator,.reading-progress,.gallery-controls{display:none}.hero{min-height:0;padding:2rem}.hero h1{grid-column:1/-1;font-size:4rem}.principle:nth-child(n){margin-top:0}.project{break-inside:avoid}}

/* El logotipo escala como marca gráfica incluso con ampliaciones de texto. */
@media(max-width:24rem){.wordmark{font-size:10vw}.contact-brand{font-size:18vw}}
.contact .eyebrow,.contact .top-link,.contact-bottom p,.contact-bottom>a,.contact .legal{font-size:1.2rem;font-weight:700;line-height:1.4}
