/* --e = escala de los textos (0.75 = 25% más chicos). Subirlo a 1 vuelve al tamaño anterior. */
:root{--e:.75;--tinta:#15171a;--suave:#6b7177;--linea:#e2e4e6;--gris:#eceeed;--plano:#1d4f9c;--m:clamp(20px,3.2vw,44px);--h:56px}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:60px}
body{font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;font-weight:300;color:var(--tinta);background:#fff;line-height:1.5;font-size:calc(16px*var(--e));-webkit-font-smoothing:antialiased}
a{color:inherit}img{display:block;max-width:100%}
:focus-visible{outline:2px solid var(--plano);outline-offset:3px}
h1,h2,h3{font-weight:300;line-height:1.25}
/* encabezado y menú */
.top{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;height:var(--h);padding:0 var(--m);background:#fff;border-bottom:1px solid var(--linea)}
.logo img{height:34px;width:auto}
.top nav{display:flex;gap:22px;align-items:center;height:var(--h);font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--suave)}
.top nav a{text-decoration:none}.top nav a:hover{color:var(--tinta)}
.dd{position:relative;display:flex;align-items:center;height:var(--h)}
.sub{display:none;position:absolute;top:var(--h);left:50%;transform:translateX(-50%);min-width:210px;padding:10px 0;background:#fff;border:1px solid var(--linea);border-top:0;z-index:30}
.dd.open .sub{display:block}.dd.open>a{color:var(--tinta)}
.top nav .sub a{display:block;padding:9px 20px;font-size:12px;font-weight:400;letter-spacing:.02em;text-transform:none;color:var(--tinta);white-space:nowrap}
.top nav .sub a:hover{color:var(--plano)}
/* video: centrado, contorno blanco con planos animados */
.video{position:relative;overflow:hidden;display:flex;justify-content:center;background:#fff}
.video video{position:relative;z-index:1;background:transparent;display:block;width:100%;height:calc(100vh - var(--h));height:calc(100svh - var(--h));object-fit:contain}
.video iframe{position:relative;z-index:1;display:block;border:0;width:min(100%,calc((100vh - var(--h)) * 1.7778));aspect-ratio:16/9}
.planos{position:absolute;inset:0;pointer-events:none}
.planos svg{position:absolute;height:auto;fill:none;stroke:var(--tinta);stroke-width:1;opacity:0;transform:rotate(var(--r,0deg));animation:plano 20s ease-in-out infinite}
.planos svg *{vector-effect:non-scaling-stroke}
@keyframes plano{0%{opacity:0;transform:translate(0,0) rotate(var(--r))}20%,80%{opacity:.4}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(calc(var(--r) + var(--dr)))}}
@media(prefers-reduced-motion:reduce){.planos svg{animation:none;opacity:.25}}
/* portada */
.hero{padding:clamp(32px,4.5vw,56px) var(--m) 0}
.hero h1{font-size:clamp(calc(24px*var(--e)),calc(2.1vw*var(--e)),calc(30px*var(--e)));max-width:30em;letter-spacing:-.01em}
.sub2{max-width:50em;margin-top:16px;font-size:clamp(calc(15px*var(--e)),calc(1.2vw*var(--e)),calc(17px*var(--e)));line-height:1.6;color:var(--suave)}
.notas{margin-top:16px;font-size:11px}
.notas a{text-decoration:none;border-bottom:1px solid #c3c7cb}
/* tarjetas del Home: todas iguales (3:2) */
.paneles{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;padding:clamp(32px,5vw,64px) var(--m) 0}
.panel{position:relative;display:block;overflow:hidden;color:#fff;text-decoration:none;background:#2c2f33;aspect-ratio:3/2;flex:0 0 calc((100% - 24px) / 3)}
.panel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.panel::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0) 55%)}
.panel div{position:relative;z-index:1;padding:clamp(14px,1.4vw,20px)}
.panel small{display:block;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
/* secciones */
.sec{padding:clamp(72px,9vw,128px) var(--m) 0}
.n{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--suave);margin-bottom:16px}
.sec>h2{font-size:clamp(calc(26px*var(--e)),calc(2.8vw*var(--e)),calc(40px*var(--e)));max-width:24ch;margin-bottom:clamp(22px,2.6vw,36px)}
.texto{max-width:44em;font-size:clamp(calc(17px*var(--e)),calc(1.5vw*var(--e)),calc(20px*var(--e)));line-height:1.6}.texto p+p{margin-top:1em}
.foto{background:var(--gris);overflow:hidden;background-image:linear-gradient(var(--linea) 1px,transparent 1px),linear-gradient(90deg,var(--linea) 1px,transparent 1px);background-size:48px 48px}
.foto img{width:100%;height:100%;object-fit:cover}
/* listado de proyectos y galerías: mismas medidas */
.grid,.galeria{display:grid;grid-template-columns:repeat(4,1fr);gap:28px 12px}
.galeria{gap:12px}
.item{text-decoration:none}.item .foto{aspect-ratio:3/2}
.item h3{font-size:max(12px,calc(16px*var(--e)));font-weight:400;margin-top:10px}.item p{font-size:11px;color:var(--suave)}
.item:hover h3{color:var(--plano)}
.cel{display:flex;gap:8px;aspect-ratio:3/2;overflow:hidden;background:#fff}
.cel a{display:block;flex:1;min-width:0;height:100%}
.cel img{width:100%;height:100%;object-fit:cover}
.cel.v1{background:var(--gris);justify-content:center}.cel.v1 a{flex:0 0 calc(50% - 4px)}
.gal-sec{padding:36px var(--m) 0}
.aviso{color:var(--suave)}
/* Estudio: texto a la izquierda, fotos a la derecha */
.compacta{padding-top:clamp(32px,4vw,56px)}.compacta>h2{font-size:clamp(calc(24px*var(--e)),calc(2.2vw*var(--e)),calc(32px*var(--e)));margin-bottom:20px}
.est-cols{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:start}
.texto.chico{font-size:max(11.5px,calc(15px*var(--e)));line-height:1.65}.texto.chico p+p{margin-top:.8em}
.galeria.lateral{grid-template-columns:repeat(2,1fr)}
/* proyecto (estilo caso de estudio) */
.caso{padding:clamp(32px,4vw,56px) var(--m) 0}
.mig{font-size:11px;color:var(--suave)}.mig a{text-decoration:none}.mig a:hover{color:var(--tinta)}
.caso h1{font-size:clamp(calc(26px*var(--e)),calc(2.8vw*var(--e)),calc(40px*var(--e)));margin:12px 0 20px}
.datos-p{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px 28px;max-width:640px;margin-bottom:24px;padding:14px 0;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.datos-p dt{font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--suave)}.datos-p dd{font-size:max(11.5px,calc(15px*var(--e)));margin:0}
.fin{padding-top:clamp(56px,7vw,96px)}.fin>h2{margin-bottom:18px}.fin p+p{margin-top:24px}
/* contacto */
.cont{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(32px,6vw,96px)}
.hp{position:absolute;left:-9999px}
.redes{display:flex;gap:20px;align-items:center}
.redes a{display:inline-flex;color:var(--tinta);text-decoration:none;border:0}.redes a:hover{color:var(--plano)}
.datos-c .redes svg{width:30px;height:30px}
.bloque{padding:clamp(48px,7vw,96px) var(--m) 0;display:grid;grid-template-columns:minmax(120px,1fr) 3fr;gap:32px}
.pie{margin-top:clamp(72px,10vw,140px);padding:26px var(--m);border-top:1px solid var(--linea);display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--suave)}
.pie img{width:140px;height:auto}
/* formularios y admin */
.form{display:grid;gap:16px}.form label{display:grid;gap:6px;font-weight:500;font-size:12px}
input,textarea,select{font:inherit;font-weight:300;font-size:14px;padding:10px 12px;border:1px solid var(--linea);background:#fff;width:100%;border-radius:0}
button,.btn{font:inherit;font-size:13px;font-weight:500;background:var(--tinta);color:#fff;border:0;padding:12px 24px;cursor:pointer;text-decoration:none;display:inline-block;width:max-content}
button:hover,.btn:hover{background:var(--plano)}
.ok{color:#1d6b3a}.error{color:#a02020}
.admin{font-size:15px}
.admin .bloque{display:block;max-width:820px;padding-top:48px}.admin h2{margin-bottom:24px;font-size:26px}
.lnk{background:none;color:#a02020;padding:0;text-decoration:underline;font-weight:400}.lnk:hover{background:none}
.fila{display:flex;gap:18px;align-items:center;padding:12px 0;border-bottom:1px solid var(--linea)}
.fila strong{flex:1;font-weight:500}.fila img,.sin{width:72px;height:54px;object-fit:cover;background:var(--gris)}
.fotos-admin{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px}
.ft{position:relative;padding:6px;border:1px solid var(--linea);background:#fff;cursor:grab}
.ft img{aspect-ratio:4/3;object-fit:cover;width:100%;pointer-events:none}
.pf .ft:first-child::before{content:"Portada";position:absolute;left:10px;top:10px;background:var(--tinta);color:#fff;font-size:11px;padding:2px 8px}
.mv{display:flex;justify-content:space-between;margin:6px 0 2px}
.mv button{padding:2px 12px;font-size:14px;background:#fff;color:var(--tinta);border:1px solid var(--linea)}.mv button:hover{background:var(--gris)}
.chk{display:flex!important;gap:8px;align-items:center;font-weight:300!important;margin-top:4px}.chk input{width:auto}
@media(max-width:1100px){.grid,.galeria{grid-template-columns:repeat(3,1fr)}.galeria.lateral{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){
  .logo img{height:29px}.top nav{gap:14px;font-size:10px}
  .sub{left:auto;right:-14px;transform:none}
  .video video{height:auto;max-height:calc(100svh - var(--h))}
  .panel{flex-basis:100%}
  .grid,.galeria{grid-template-columns:repeat(2,1fr)}
  .est-cols,.bloque,.cont{grid-template-columns:1fr;gap:16px}
  .pie{flex-direction:column;gap:12px;align-items:flex-start}
}
/* Estudio en una sola pantalla: texto + todas las fotos a la vista, sin scroll */
.una{height:calc(100svh - var(--h) - 52px);min-height:400px;display:flex;flex-direction:column;overflow:hidden;padding:clamp(16px,2.2vw,30px) var(--m) clamp(12px,1.6vw,20px)}
.una>.n{margin-bottom:6px}
.una>h2{font-size:clamp(calc(24px*var(--e)),calc(2.2vw*var(--e)),calc(32px*var(--e)));margin-bottom:14px}
.una .est-cols{flex:1;min-height:0;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);grid-template-rows:minmax(0,1fr);align-items:stretch}
.una .texto.chico{overflow:auto;padding-right:8px;min-height:0}
.galeria.todas{height:100%;min-height:0;overflow:hidden;gap:8px;justify-content:start;align-content:start;grid-template-columns:repeat(2,1fr)}
.todas .cel{min-height:0}
.pie.mini{margin-top:0;height:52px;padding:0 var(--m)}.pie.mini img{width:90px}
@media(max-width:760px){
  .una{height:auto;display:block;overflow:visible}.una .texto.chico{overflow:visible}
  .galeria.todas{height:auto;grid-template-columns:repeat(2,1fr);grid-template-rows:none;margin-top:16px}
  .todas .cel{aspect-ratio:3/2}.todas .cel img{object-fit:cover}
  .pie.mini{height:auto;min-height:52px;padding:12px var(--m);flex-direction:row}.pie.mini img,.pie.mini p{display:none}
}