/* =========================================================
   ROUZ Uruguay — Sistema visual editorial
   Identidad: taupe #bdb1a5 · crema #f8f6f1 · carbón #32302e
   Lenguaje de diseño: editorial, minimalista, fotografía a sangre,
   tipografía fina, secciones alternadas, divisores verticales, sin botones.
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600&display=swap');

/* ---------- Variables ---------- */
:root{
  --ink:#32302e;          /* carbón corporativo */
  --ink-deep:#1c1b1a;     /* más oscuro para secciones */
  --paper:#ffffff;
  --cream:#f8f6f1;        /* crema corporativa */
  --cream-2:#efeadf;
  --taupe:#bdb1a5;        /* taupe corporativo */
  --taupe-deep:#8c8175;
  --text:#2a2826;
  --text-soft:#6f6a64;
  --text-on-dark:#d6d0c7;
  --text-on-dark-soft:#9c9389;
  --line:#e6e0d6;
  --line-on-dark:rgba(189,177,165,.22);
}

/* ---------- Reset ---------- */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  font-family:'Manrope',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  font-weight:400;
  font-size:16px;
  line-height:1.6;
  color:var(--text);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block;}
ul,ol{list-style:none;}
a{color:inherit;text-decoration:none;transition:color .25s ease;}
button{font-family:inherit;background:none;border:0;cursor:pointer;color:inherit;}

h1,h2,h3,h4,h5,h6{
  font-family:'Manrope',sans-serif;
  font-weight:300;
  color:var(--ink);
  line-height:1.12;
  letter-spacing:-.02em;
}

/* ---------- Layout ---------- */
.wrap{
  width:100%;max-width:1240px;
  margin:0 auto;
  padding:0 clamp(20px,4.5vw,56px);
}
.section{
  padding:clamp(64px,9vw,130px) 0;
  position:relative;
}
.section--tight{padding:clamp(44px,6.5vw,90px) 0;}
.bg-paper{background:var(--paper);color:var(--text);}
.bg-cream{background:var(--cream);color:var(--text);}
.bg-taupe{background:var(--taupe);color:var(--ink);}
.bg-dark{background:var(--ink-deep);color:var(--text-on-dark);}
.bg-dark h1,.bg-dark h2,.bg-dark h3,.bg-dark h4{color:#fff;}

/* ---------- Tipografía ---------- */
.overline{
  display:inline-block;
  font-size:.7rem;
  font-weight:600;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--taupe-deep);
}
.bg-dark .overline{color:var(--taupe);}

.display{
  font-size:clamp(2.2rem,5.5vw,4.6rem);
  font-weight:300;
  line-height:1.06;
  letter-spacing:-.028em;
}
.h-xl{font-size:clamp(1.85rem,3.9vw,3.2rem);font-weight:300;letter-spacing:-.024em;line-height:1.1;}
.h-lg{font-size:clamp(1.55rem,2.9vw,2.35rem);font-weight:300;letter-spacing:-.02em;line-height:1.15;}
.h-md{font-size:clamp(1.15rem,1.55vw,1.38rem);font-weight:500;letter-spacing:-.008em;line-height:1.3;}
.h-sm{font-size:1rem;font-weight:500;letter-spacing:-.003em;line-height:1.35;}

.lead{
  font-size:clamp(.97rem,1.05vw,1.08rem);
  color:var(--text-soft);
  font-weight:400;
  line-height:1.65;
  max-width:60ch;
}
.bg-dark .lead{color:var(--text-on-dark-soft);}

.muted{color:var(--text-soft);}
.bg-dark .muted{color:var(--text-on-dark-soft);}

/* enlaces sutiles */
.link{
  display:inline-block;
  font-size:.95rem;
  color:var(--ink);
  padding-bottom:3px;
  border-bottom:1px solid var(--ink);
  transition:gap .25s ease,border-color .25s ease,color .25s ease;
}
.link:hover{border-color:var(--taupe-deep);color:var(--taupe-deep);}
.bg-dark .link{color:#fff;border-color:#fff;}
.bg-dark .link:hover{color:var(--taupe);border-color:var(--taupe);}

/* ---------- Encabezado (transparente sobre hero, blanco después) ---------- */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:22px 0;
  transition:background .35s ease,padding .25s ease,border-color .25s ease;
  border-bottom:1px solid transparent;
}
.site-header.is-solid{
  background:rgba(28,27,26,.92);
  backdrop-filter:saturate(140%) blur(10px);
  -webkit-backdrop-filter:saturate(140%) blur(10px);
  border-bottom-color:var(--line-on-dark);
  padding:14px 0;
}
.site-header.is-dark-page{
  background:transparent;
}
.nav{
  display:flex;align-items:center;justify-content:space-between;
  gap:32px;
}
.brand{
  display:flex;align-items:center;gap:14px;color:#fff;
}
.site-header.is-solid .brand{color:#fff;}
.brand-logo{
  height:24px;width:auto;display:block;
  transition:opacity .25s ease;
}
/* Logo local (assets/img/logo.png): es blanco con fondo transparente.
   El header va en modo oscuro en todos los estados (transparente sobre el
   slider y oscuro al hacer scroll), así que el logo se muestra blanco siempre. */
.brand-logo--light{display:none;}
.brand-logo--dark{display:block;}
.site-header:not(.is-solid) .brand-logo--dark{filter:none;}
.site-header.is-solid .brand-logo--dark{filter:none;}
.brand-region{
  font-size:.62rem;
  font-weight:500;
  letter-spacing:.34em;
  text-transform:uppercase;
  padding-left:14px;
  border-left:1px solid currentColor;
  opacity:.75;
}

.menu{
  display:flex;align-items:center;gap:0;
  font-size:.88rem;font-weight:500;letter-spacing:.005em;
  color:#fff;
}
.site-header.is-solid .menu{color:#fff;}
.menu li{position:relative;}
.menu a{
  display:inline-block;padding:8px 22px;
  position:relative;
  transition:opacity .2s ease;
}
.menu a:hover{opacity:.7;}
.menu li+li a::before{
  content:"";position:absolute;left:0;top:50%;
  transform:translateY(-50%);height:14px;width:1px;
  background:currentColor;opacity:.35;
}
.menu a.is-active{font-weight:500;}
.menu a.is-active::after{
  content:"";position:absolute;left:22px;right:22px;bottom:2px;
  height:1px;background:currentColor;
}

/* dropdown sutil */
.has-drop{position:relative;}
.dropdown{
  position:absolute;top:calc(100% + 6px);left:50%;
  transform:translateX(-50%) translateY(6px);
  background:rgba(28,27,26,.97);border:1px solid var(--line-on-dark);
  min-width:280px;padding:14px 6px;
  opacity:0;visibility:hidden;
  transition:all .25s ease;
  box-shadow:0 24px 60px -28px rgba(0,0,0,.55);
}
.has-drop:hover .dropdown{
  opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);
}
.dropdown a{
  display:block;padding:10px 22px;color:var(--text-on-dark);font-size:.92rem;
}
.dropdown a small{
  display:block;font-size:.74rem;color:var(--text-on-dark-soft);font-weight:300;
  margin-top:2px;
}
.dropdown a:hover{background:rgba(255,255,255,.06);color:#fff;}

/* burger */
.burger{display:none;flex-direction:column;gap:5px;padding:8px;color:#fff;}
.burger span{
  width:24px;height:1.5px;background:currentColor;
  transition:transform .25s ease,opacity .2s;
}

/* ---------- HERO principal (slider a pantalla completa) ---------- */
.hero{
  position:relative;height:100vh;min-height:560px;max-height:920px;
  color:#fff;overflow:hidden;
  background:var(--ink-deep);
}
.hero-slides{position:absolute;inset:0;}
.hero-slide{
  position:absolute;inset:0;
  opacity:0;transition:opacity 1.4s ease;
  background-size:cover;background-position:center;
}
.hero-slide.is-active{opacity:1;}
.hero-slide::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,
    rgba(0,0,0,.25) 0%,
    rgba(0,0,0,.15) 40%,
    rgba(0,0,0,.65) 100%);
}
.hero-content{
  position:relative;z-index:2;height:100%;
  display:flex;align-items:flex-end;
  padding-bottom:clamp(64px,10vh,130px);
}
.hero-title{
  font-size:clamp(1.9rem,4.6vw,3.9rem);
  font-weight:300;line-height:1.1;color:#fff;
  max-width:20ch;letter-spacing:-.028em;
}
.hero-eyebrow{
  display:block;font-size:.72rem;font-weight:500;
  letter-spacing:.28em;text-transform:uppercase;color:var(--taupe);
  margin-bottom:22px;line-height:1.5;
}
.hero-nav{
  position:absolute;right:clamp(24px,5vw,64px);bottom:32px;z-index:3;
  display:flex;gap:10px;
}
.hero-dot{
  width:34px;height:1.5px;background:rgba(255,255,255,.35);
  transition:background .25s ease;cursor:pointer;
}
.hero-dot.is-active{background:#fff;}

/* hero secundario (páginas internas) */
.page-hero{
  position:relative;
  padding:clamp(140px,18vh,210px) 0 clamp(52px,7.5vh,100px);
  background:var(--cream);color:var(--text);
}
.page-hero.has-image{
  color:#fff;background:var(--ink-deep);overflow:hidden;
}
.page-hero.has-image .ph-bg{
  position:absolute;inset:0;background-size:cover;background-position:center;
}
.page-hero.has-image .ph-bg::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(28,27,26,.55),rgba(28,27,26,.25));
}
.page-hero .wrap{position:relative;z-index:2;}
.page-hero h1{
  font-size:clamp(1.85rem,3.9vw,3.2rem);
  font-weight:300;color:inherit;
  max-width:20ch;margin-top:18px;letter-spacing:-.024em;line-height:1.1;
}
.page-hero.has-image h1{color:#fff;}
.page-hero p{
  margin-top:18px;max-width:54ch;
  color:var(--text-soft);font-size:1rem;font-weight:400;line-height:1.6;
}
.page-hero.has-image p{color:var(--text-on-dark-soft);}
.breadcrumb{
  font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--text-soft);
}
.page-hero.has-image .breadcrumb{color:var(--text-on-dark-soft);}
.breadcrumb a:hover{color:var(--ink);}
.page-hero.has-image .breadcrumb a:hover{color:var(--taupe);}
.breadcrumb span{margin:0 10px;opacity:.55;}

/* ---------- Grids editoriales ---------- */
.grid{display:grid;gap:clamp(30px,4vw,60px);}
.grid-2{grid-template-columns:1fr 1fr;}
.grid-2-12{grid-template-columns:5fr 7fr;}     /* texto pequeño + imagen grande */
.grid-2-21{grid-template-columns:7fr 5fr;}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}

.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,90px);align-items:center;}

/* ---------- Imágenes ---------- */
.figure{position:relative;overflow:hidden;background:var(--cream);}
.figure img{width:100%;height:100%;object-fit:cover;display:block;}
.figure--tall{aspect-ratio:4/5;}
.figure--portrait{aspect-ratio:3/4;}
.figure--landscape{aspect-ratio:16/10;}
.figure--square{aspect-ratio:1/1;}
.figure-caption{
  position:absolute;left:18px;bottom:18px;z-index:2;
  font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;
  color:#fff;
}

/* collage 2x2 con asimetría */
.collage{
  display:grid;
  grid-template-columns:1fr 1.4fr;
  grid-template-rows:1fr 1.2fr;
  gap:14px;
  aspect-ratio:1/1.05;
}
.collage .figure:nth-child(1){grid-column:1;grid-row:1;}
.collage .figure:nth-child(2){grid-column:2;grid-row:1/3;}
.collage .figure:nth-child(3){grid-column:1;grid-row:2;}

/* foto a sangre ancho completo · efecto parallax (fija al hacer scroll) */
.cinematic{
  position:relative;height:clamp(420px,62vh,720px);
  background-size:cover;
  background-position:center bottom;
  background-attachment:fixed;
  color:#fff;display:flex;align-items:flex-end;
  padding:clamp(40px,7vh,90px) 0;
}
/* iOS Safari no soporta background-attachment:fixed con cover —
   en móvil/tablet se desactiva para evitar comportamientos raros */
@media(max-width:980px){
  .cinematic{background-attachment:scroll;}
}
.cinematic::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.55));
}
.cinematic .wrap{position:relative;z-index:2;}
.cinematic h2{
  color:#fff;font-weight:200;max-width:18ch;
  font-size:clamp(1.6rem,3.4vw,2.6rem);line-height:1.2;
}

/* ---------- Lista con flechas (en lugar de checks) ---------- */
.arrow-list{
  display:flex;flex-direction:column;gap:18px;margin-top:28px;
}
.arrow-list li{
  display:grid;grid-template-columns:22px 1fr;gap:14px;
  font-weight:400;color:var(--ink);
  padding-bottom:14px;border-bottom:1px solid var(--line);
}
.arrow-list li::before{
  content:"→";color:var(--taupe-deep);font-weight:400;
  align-self:start;line-height:1.7;
}
.bg-dark .arrow-list li{color:#fff;border-bottom-color:var(--line-on-dark);}
.bg-dark .arrow-list li::before{color:var(--taupe);}
.arrow-list li small{
  display:block;font-size:.88rem;color:var(--text-soft);
  font-weight:300;margin-top:4px;
}
.bg-dark .arrow-list li small{color:var(--text-on-dark-soft);}

/* ---------- Columnas con divisores verticales (Cómo funcionamos) ---------- */
.columns{
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  margin-top:60px;
}
.columns>div{
  padding:0 28px;border-left:1px solid var(--line-on-dark);
}
.columns>div:first-child{border-left:0;padding-left:0;}
.bg-paper .columns>div{border-left-color:var(--line);}
.bg-cream .columns>div{border-left-color:var(--line);}

.columns h3{
  font-size:1.05rem;font-weight:500;
  margin-bottom:14px;color:inherit;
  max-width:18ch;
}
.bg-dark .columns h3{color:#fff;}
.columns p{
  font-size:.92rem;font-weight:300;color:var(--text-on-dark-soft);
  max-width:22ch;
}
.bg-paper .columns p,.bg-cream .columns p{color:var(--text-soft);}

/* ---------- Lista numerada (Servicios 1) Capital, 2) Realty…) ---------- */
.numbered{
  display:grid;grid-template-columns:1fr 1fr;
  column-gap:60px;row-gap:0;
}
.numbered>div{
  padding:44px 0;border-bottom:1px solid var(--line-on-dark);
}
.numbered>div:nth-child(-n+2){padding-top:0;}
.bg-paper .numbered>div,.bg-cream .numbered>div{border-bottom-color:var(--line);}
.numbered>div:nth-last-child(-n+2){border-bottom:0;padding-bottom:0;}
.numbered h3{
  font-size:1.35rem;font-weight:300;margin-bottom:10px;color:inherit;
}
.bg-dark .numbered h3{color:#fff;}
.numbered p{
  font-size:.94rem;color:var(--text-on-dark-soft);max-width:30ch;
}
.bg-paper .numbered p,.bg-cream .numbered p{color:var(--text-soft);}
.numbered a{display:block;}
.numbered a:hover h3{color:var(--taupe);}
.bg-paper .numbered a:hover h3,.bg-cream .numbered a:hover h3{color:var(--taupe-deep);}

/* ---------- Etiquetas verticales rotadas (Estrategia · Confianza…) ---------- */
.vlabels{
  display:flex;gap:0;align-items:stretch;
}
.vlabels>span{
  writing-mode:vertical-rl;transform:rotate(180deg);
  font-size:clamp(1.3rem,2vw,1.8rem);font-weight:300;
  padding:18px 22px;border-right:1px solid var(--line-on-dark);
  color:#fff;letter-spacing:.02em;
}
.vlabels>span:last-child{border-right:0;}

/* ---------- Hitos / cards sin borde, con divisor ---------- */
.milestones{
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  margin-top:40px;
}
.milestones>div{
  padding:0 28px;border-left:1px solid var(--line-on-dark);
}
.milestones>div:first-child{border-left:0;padding-left:0;}
.bg-paper .milestones>div,.bg-cream .milestones>div{border-left-color:var(--line);}
.milestones h3{
  font-size:1.05rem;font-weight:500;margin-bottom:12px;
}
.bg-dark .milestones h3{color:#fff;}
.milestones p{font-size:.9rem;font-weight:300;color:var(--text-on-dark-soft);}
.bg-paper .milestones p,.bg-cream .milestones p{color:var(--text-soft);}

/* ---------- Equipo (sin tarjetas) ---------- */
.team{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:clamp(24px,3vw,40px);
}
.team-card{display:block;}
.team-photo{
  aspect-ratio:3/4;background:var(--cream);overflow:hidden;
}
.team-photo img{width:100%;height:100%;object-fit:cover;}
.team-card h4{
  font-size:1rem;font-weight:500;color:var(--ink);
  margin-top:18px;letter-spacing:0;
}
.team-card span{
  display:block;font-size:.85rem;color:var(--text-soft);
  margin-top:2px;font-weight:300;
}

/* ---------- Tira de aliados (logos reales) ---------- */
.logo-strip{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:clamp(20px,3vw,40px);align-items:center;
  margin-top:50px;
}
.logo-strip .alias{
  font-size:1.15rem;font-weight:500;
  text-align:center;color:var(--text-soft);
  letter-spacing:.02em;
}

/* ---------- Banda de cifras / stats ---------- */
.stat-num{
  display:block;
  font-family:'Manrope',sans-serif;
  font-size:clamp(2.8rem,5.5vw,4.6rem);
  font-weight:200;
  color:var(--ink);
  letter-spacing:-.04em;
  line-height:.95;
  position:relative;
}
.stat-num::before{
  content:"";display:block;
  width:28px;height:1px;
  background:currentColor;opacity:.35;
  margin:0 auto 20px;
}
.bg-dark .stat-num{color:#fff;}
.bg-dark .stat-num::before{background:var(--taupe);opacity:.55;}
.stat-cap{
  margin-top:22px;
  font-size:.88rem;
  font-weight:400;
  color:var(--muted);
  line-height:1.55;
  max-width:24ch;
  margin-left:auto;
  margin-right:auto;
}
.bg-dark .stat-cap{color:var(--text-on-dark-soft);}

/* ---------- Centered CTA band (taupe / crema) ---------- */
.cta-center{
  text-align:center;
  padding:clamp(62px,7.5vw,100px) 0;
  max-width:880px;margin:0 auto;
  position:relative;
}
.cta-center::before{
  content:"";display:block;
  width:36px;height:1px;
  background:currentColor;opacity:.35;
  margin:0 auto 24px;
}
.cta-center .overline{
  display:block;margin-bottom:18px;color:var(--ink);opacity:.65;
}
.cta-center h2{
  font-size:clamp(1.7rem,2.9vw,2.3rem);
  font-weight:300;color:var(--ink);
  max-width:26ch;margin:0 auto;
  letter-spacing:-.022em;line-height:1.14;
}
.cta-center p{
  margin-top:18px;color:var(--ink);opacity:.72;
  max-width:44ch;margin-left:auto;margin-right:auto;
  font-weight:400;font-size:.98rem;line-height:1.6;
}
.cta-center .link{
  margin-top:30px;
  font-size:.94rem;font-weight:500;
  letter-spacing:.04em;
  padding-bottom:5px;
  display:inline-flex;align-items:center;gap:10px;
}
.cta-center .link::after{
  content:"→";font-weight:300;font-size:1.05em;
  transition:transform .25s ease;
}
.cta-center .link:hover::after{transform:translateX(4px);}

/* CTA en fondo crema en lugar de taupe (variante sutil) */
.bg-cream .cta-center::before{background:var(--taupe-deep);opacity:.5;}
.bg-cream .cta-center .overline{color:var(--taupe-deep);}

/* ---------- FAQ acordeón ---------- */
.faq{max-width:880px;margin:0 auto;}
.faq-cat{
  font-size:.72rem;font-weight:600;letter-spacing:.24em;
  text-transform:uppercase;color:var(--taupe-deep);
  margin:48px 0 14px;padding-bottom:8px;
  border-bottom:1px solid var(--line);
}
.faq-cat:first-child{margin-top:0;}
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{
  width:100%;text-align:left;padding:22px 0;
  display:flex;justify-content:space-between;align-items:center;gap:24px;
  font-size:1.05rem;font-weight:400;color:var(--ink);
  cursor:pointer;
}
.faq-q .plus{
  font-size:1.4rem;font-weight:200;color:var(--taupe-deep);
  transition:transform .3s ease;
  flex-shrink:0;
}
.faq-item.is-open .faq-q .plus{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease;}
.faq-a-inner{
  padding:0 0 24px;color:var(--text-soft);font-weight:300;
  max-width:62ch;
}

/* ---------- Formulario de contacto (sin cajas) ---------- */
.form{max-width:560px;}
.form-success{
  display:none;padding:14px 18px;
  background:var(--cream);border-left:2px solid var(--taupe);
  color:var(--ink);font-size:.9rem;font-weight:400;
  margin-bottom:30px;
}
.form-error{
  display:none;padding:14px 18px;
  background:#fbeceb;border-left:2px solid #c0392b;
  color:#7d2820;font-size:.9rem;font-weight:400;
  margin-bottom:30px;
}
.field{margin-bottom:34px;}
.field label{
  display:block;font-size:.78rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--text-soft);
  margin-bottom:10px;font-weight:500;
}
.field input,.field select,.field textarea{
  width:100%;padding:8px 0;
  border:0;border-bottom:1px solid var(--line);
  background:transparent;
  font-family:inherit;font-size:1rem;font-weight:300;color:var(--ink);
  transition:border-color .25s ease;
}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-bottom-color:var(--ink);
}
.field textarea{resize:vertical;min-height:90px;}
.field-check{
  display:flex;gap:10px;align-items:flex-start;font-size:.85rem;
  color:var(--text-soft);font-weight:300;
}
.field-check input{width:auto;}
.btn-submit{
  display:inline-block;padding:16px 44px;
  background:var(--taupe);color:var(--ink);
  font-size:.78rem;letter-spacing:.24em;text-transform:uppercase;
  font-weight:500;border:0;cursor:pointer;
  transition:background .25s ease,color .25s ease;
}
.btn-submit:hover{background:var(--ink);color:var(--cream);}

/* ---------- Contacto: info lateral ---------- */
.contact-info{display:flex;flex-direction:column;gap:38px;}
.contact-info-row{display:grid;grid-template-columns:1fr 1fr;gap:32px;}
.contact-info h4{
  font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--taupe-deep);font-weight:600;margin-bottom:14px;
}
.contact-info p{font-size:.95rem;color:var(--ink);font-weight:400;}
.contact-info p+p{margin-top:4px;}

/* ---------- Páginas legales (.prose) ---------- */
.prose{max-width:760px;}
.prose h2{
  font-size:1.5rem;font-weight:500;margin:48px 0 16px;
  color:var(--ink);letter-spacing:-.005em;
}
.prose h3{font-size:1.1rem;font-weight:500;margin:28px 0 10px;}
.prose p{margin-bottom:14px;color:var(--text);font-weight:300;}
.prose ul{display:flex;flex-direction:column;gap:10px;margin:0 0 18px;}
.prose ul li{
  position:relative;padding-left:22px;font-weight:300;color:var(--text);
}
.prose ul li::before{
  content:"";position:absolute;left:0;top:14px;
  width:10px;height:1px;background:var(--taupe-deep);
}
.prose .updated{
  font-size:.85rem;color:var(--text-soft);font-style:italic;
  margin-top:40px;padding-top:18px;border-top:1px solid var(--line);
}
.prose table{width:100%;border-collapse:collapse;margin:22px 0;font-size:.92rem;}
.prose th,.prose td{
  padding:12px 14px;text-align:left;
  border-bottom:1px solid var(--line);font-weight:300;
}
.prose th{font-weight:500;color:var(--ink);}
.legal-note{
  padding:18px 22px;background:var(--cream);
  border-left:2px solid var(--taupe);font-size:.88rem;
  color:var(--text-soft);margin:24px 0 36px;font-weight:300;
}

/* marcadores editables */
.ph-data{
  background:rgba(189,177,165,.2);
  border-bottom:1px dashed var(--taupe-deep);
  padding:0 6px;color:inherit;font-style:normal;
}
.bg-dark .ph-data,.bg-taupe .ph-data{
  background:rgba(255,255,255,.12);border-bottom-color:var(--cream);
}

/* ---------- Footer (blanco, no oscuro) ---------- */
.site-footer{
  background:var(--paper);color:var(--text-soft);
  padding:clamp(70px,9vw,120px) 0 36px;
  border-top:1px solid var(--line);
}
.footer-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1.6fr;
  gap:clamp(30px,5vw,80px);
}
.footer-grid h5{
  font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--taupe-deep);font-weight:600;margin-bottom:22px;
}
.footer-brand .brand-logo{height:26px;margin-bottom:24px;filter:brightness(0);}
.footer-brand .brand{color:var(--ink);align-items:center;}
.footer-brand .brand-region{color:var(--taupe-deep);}
.footer-brand p{
  font-size:.88rem;color:var(--text-soft);max-width:32ch;
  font-weight:300;
}
.footer-grid ul{display:flex;flex-direction:column;gap:12px;}
.footer-grid a{font-size:.92rem;color:var(--text);font-weight:300;}
.footer-grid a:hover{color:var(--taupe-deep);}
.footer-contact p{
  font-size:.9rem;color:var(--text);margin-bottom:6px;font-weight:300;
}
.footer-bottom{
  margin-top:60px;padding-top:24px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;
  font-size:.78rem;color:var(--text-soft);
}

/* ---------- Cookie banner ---------- */
.cookie{
  position:fixed;left:20px;right:20px;bottom:20px;z-index:200;
  background:var(--ink);color:var(--text-on-dark);
  padding:22px 26px;
  display:flex;justify-content:space-between;align-items:center;
  gap:24px;flex-wrap:wrap;max-width:920px;margin:0 auto;
}
.cookie.is-hidden{display:none;}
.cookie p{font-size:.85rem;flex:1 1 320px;font-weight:300;}
.cookie a{color:var(--taupe);text-decoration:underline;}
.cookie-buttons{display:flex;gap:18px;align-items:center;}
.cookie-buttons button{
  font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;
  font-weight:500;color:#fff;padding:12px 22px;
  border:1px solid rgba(255,255,255,.3);
  transition:background .25s ease,color .25s ease,border-color .25s;
}
.cookie-buttons button:first-child{border-color:transparent;opacity:.7;}
.cookie-buttons button:hover{
  background:var(--taupe);color:var(--ink);border-color:var(--taupe);
}

/* ---------- Animación reveal ---------- */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .8s ease,transform .8s ease;}
.reveal.is-in{opacity:1;transform:none;}

/* ---------- Spacing helpers ---------- */
.mt-sm{margin-top:18px;}
.mt-md{margin-top:32px;}
.mt-lg{margin-top:50px;}
.mt-xl{margin-top:80px;}

/* =========================================================
   Globales de robustez para pantallas pequeñas
   ========================================================= */
img,video,iframe{max-width:100%;height:auto;display:block;}
body{word-wrap:break-word;overflow-wrap:break-word;}
*{min-width:0;} /* evita que grids se desborden con texto largo */

/* Inputs: font-size mínimo 16px en móvil evita el auto-zoom de iOS */
@media(max-width:720px){
  input,select,textarea{font-size:16px !important;}
}

/* Targets táctiles mínimo 44x44 según WCAG/Apple */
.burger{min-width:44px;min-height:44px;align-items:center;justify-content:center;}
.faq-q{min-height:44px;}
.cookie-buttons button{min-height:44px;}
.btn-submit{min-height:44px;}

/* =========================================================
   Responsive — cuatro breakpoints
   1100 · tablet grande · ajustes finos
    960 · tablet · grids 2col + menú hamburguesa
    720 · móvil · grids 1col, hero más bajo
    480 · móvil pequeño · tipografía más compacta
    380 · iPhone SE / phones ultra pequeños
   ========================================================= */

/* ---------- TABLET grande (≤ 1100px) ---------- */
@media(max-width:1100px){
  .section{padding:clamp(56px,8vw,110px) 0;}
  .wrap{padding:0 clamp(18px,3.5vw,40px);}
}

/* ---------- TABLET (≤ 960px) ---------- */
@media(max-width:960px){
  /* grids de 2 columnas pasan a 1 */
  .grid-2,.grid-2-12,.grid-2-21,.split,.contact-info-row{grid-template-columns:1fr;}
  .split.reverse .split-media{order:0;}

  /* grids de 3-4 columnas pasan a 2 */
  .grid-3,.grid-4,.team,.milestones,.columns{grid-template-columns:repeat(2,1fr);}
  .quote-grid{grid-template-columns:repeat(2,1fr);}

  /* numbered grid mantiene 2 columnas en tablet */
  .numbered{grid-template-columns:repeat(2,1fr);column-gap:40px;}

  /* columns/milestones: divisor cambia de izquierda a arriba */
  .columns>div,.milestones>div{
    border-left:0;padding:28px 0;
    border-top:1px solid var(--line-on-dark);
  }
  .bg-paper .columns>div,.bg-paper .milestones>div,
  .bg-cream .columns>div,.bg-cream .milestones>div{border-top-color:var(--line);}
  .columns>div:first-child,.milestones>div:first-child{border-top:0;padding-top:0;}

  /* collage simplificado */
  .collage{grid-template-columns:1fr 1fr;grid-template-rows:auto auto;aspect-ratio:auto;}
  .collage .figure:nth-child(2){grid-column:1/3;grid-row:auto;aspect-ratio:16/10;}
  .collage .figure{aspect-ratio:1/1;}

  /* footer en 2 columnas */
  .footer-grid{grid-template-columns:1fr 1fr;}
  .footer-brand{grid-column:1/3;}

  /* hero un poco más bajo */
  .hero{min-height:520px;height:88vh;}
  .hero-content{padding-bottom:80px;}

  /* page-hero más ajustado */
  .page-hero{padding:130px 0 64px;}
  .page-hero h1{max-width:24ch;}

  /* cinematic — desactivar parallax (iOS Safari lo rompe) */
  .cinematic{background-attachment:scroll;}

  /* menú móvil */
  .menu{
    position:fixed;top:0;right:0;width:320px;max-width:90vw;height:100vh;
    background:var(--ink-deep);color:#fff;flex-direction:column;align-items:flex-start;
    padding:100px 28px 36px;
    transform:translateX(100%);transition:transform .35s ease;
    z-index:99;gap:0;overflow-y:auto;
  }
  .menu.is-open{transform:translateX(0);}
  .menu li{width:100%;}
  .menu li+li a::before{display:none;}
  .menu a{padding:18px 0;width:100%;border-bottom:1px solid var(--line-on-dark);font-size:1.02rem;}
  .menu a.is-active::after{display:none;}
  .has-drop .dropdown{
    position:static;opacity:1;visibility:visible;transform:none;
    background:transparent;border:0;box-shadow:none;padding:0 0 12px 14px;
    min-width:auto;
  }
  .has-drop .dropdown a{padding:10px 0;border-bottom:0;font-size:.9rem;}
  .burger{display:flex;}
  .nav-overlay{
    position:fixed;inset:0;background:rgba(28,27,26,.4);z-index:98;
    opacity:0;visibility:hidden;transition:.3s;
  }
  .nav-overlay.is-on{opacity:1;visibility:visible;}

  /* etiquetas verticales pasan a horizontales */
  .vlabels{flex-direction:column;}
  .vlabels>span{
    writing-mode:horizontal-tb;transform:none;
    border-right:0;border-bottom:1px solid var(--line-on-dark);
    padding:16px 0;font-size:1.4rem;
  }
  .vlabels>span:last-child{border-bottom:0;}

  /* stats centradas con mejor reparto */
  .stats-band{grid-template-columns:repeat(2,1fr);gap:30px 20px;}
  .value-row{grid-template-columns:repeat(3,1fr);}
}

/* ---------- MÓVIL (≤ 720px) ---------- */
@media(max-width:720px){
  /* todos los grids → 1 columna */
  .grid-3,.grid-4,.team,.milestones,.columns,.numbered,.quote-grid{
    grid-template-columns:1fr;
  }
  .numbered>div{border-bottom:1px solid var(--line);padding:32px 0;}
  .numbered>div:nth-child(-n+2){padding-top:32px;}
  .numbered>div:first-child{padding-top:0;}
  .numbered>div:last-child{border-bottom:0;padding-bottom:0;}
  .bg-dark .numbered>div{border-bottom-color:var(--line-on-dark);}

  .collage{display:flex;flex-direction:column;}
  .collage .figure{aspect-ratio:16/10;}

  /* hero */
  .hero{min-height:460px;height:80vh;}
  .hero-content{padding-bottom:56px;}
  .hero-title{max-width:none;font-size:clamp(1.6rem,5.6vw,2.2rem);}
  .hero-eyebrow{margin-bottom:18px;}
  .hero-nav{bottom:22px;right:18px;}
  .hero-dot{width:28px;}

  /* page-hero más compacto */
  .page-hero{padding:110px 0 48px;}
  .page-hero h1{font-size:clamp(1.5rem,5.4vw,2.1rem);max-width:none;}
  .page-hero p{margin-top:14px;font-size:.95rem;}

  /* footer en 1 columna */
  .footer-grid{grid-template-columns:1fr;gap:34px;}
  .footer-brand{grid-column:auto;}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:8px;margin-top:40px;font-size:.74rem;}

  /* tipografía respira menos */
  .section-head{margin-bottom:32px;}
  .mt-xl{margin-top:42px;}
  .mt-lg{margin-top:32px;}
  .mt-md{margin-top:24px;}

  /* h-xl ajustado */
  .h-xl{font-size:clamp(1.5rem,5.2vw,2rem);}
  .h-lg{font-size:clamp(1.3rem,4.5vw,1.7rem);}

  /* contact info */
  .contact-info{gap:24px;}
  .contact-info h4{margin-bottom:10px;}

  /* CTA centro */
  .cta-center{padding:54px 0;}
  .cta-center h2{font-size:clamp(1.4rem,4.8vw,1.9rem);max-width:none;}
  .cta-center p{font-size:.92rem;}

  /* stats — números más pequeños */
  .stat-num{font-size:clamp(2.4rem,9vw,3.4rem);}

  /* faq */
  .faq-cat{margin-top:30px;}
  .faq-q{font-size:.95rem;padding:18px 0;gap:14px;}
  .faq-a-inner{font-size:.9rem;padding-bottom:18px;}

  /* prose */
  .prose h2{font-size:1.25rem;margin:32px 0 12px;}
  .prose h3{font-size:1rem;}
  .prose p,.prose li{font-size:.95rem;}
  .legal-note{font-size:.85rem;padding:14px 16px;}

  /* cookie banner */
  .cookie{padding:16px 18px;gap:12px;left:12px;right:12px;bottom:12px;}
  .cookie p{flex:1 1 100%;font-size:.82rem;}
  .cookie-buttons{width:100%;justify-content:space-between;gap:10px;}
  .cookie-buttons button{flex:1;padding:12px 14px;font-size:.7rem;letter-spacing:.14em;}

  /* forms */
  .field{margin-bottom:26px;}
  .field label{font-size:.74rem;}
  .form-row{grid-template-columns:1fr;gap:0;}

  /* stats band horizontal */
  .stats-band{grid-template-columns:1fr 1fr;}
  .value-row{grid-template-columns:1fr 1fr;}

  /* arrow-list más compacto */
  .arrow-list{gap:12px;margin-top:20px;}
  .arrow-list li{padding-bottom:12px;}
}

/* ---------- MÓVIL PEQUEÑO (≤ 480px) ---------- */
@media(max-width:480px){
  body{font-size:15px;}
  .wrap{padding:0 16px;}
  .section{padding:44px 0;}

  /* logo+región — ocultar región para no apretar */
  .brand-region{display:none;}
  .brand-logo{height:22px;}
  .site-header{padding:14px 0;}
  .site-header.is-solid{padding:10px 0;}

  /* hero */
  .hero{min-height:420px;height:78vh;}
  .hero-content{padding-bottom:42px;}
  .hero-title{font-size:1.5rem;line-height:1.15;}
  .hero-eyebrow{font-size:.62rem;letter-spacing:.2em;margin-bottom:14px;}

  /* page hero */
  .page-hero{padding:92px 0 40px;}
  .page-hero h1{font-size:1.45rem;line-height:1.15;}
  .page-hero p{font-size:.9rem;}
  .breadcrumb{font-size:.7rem;}

  /* botón submit ocupa ancho */
  .btn-submit{width:100%;text-align:center;padding:16px;}

  /* form más compacto */
  .field{margin-bottom:24px;}

  /* overlines */
  .overline{font-size:.64rem;letter-spacing:.2em;}

  /* CTA */
  .cta-center{padding:44px 0;}
  .cta-center::before{width:24px;margin-bottom:18px;}
  .cta-center h2{font-size:1.35rem;}
  .cta-center .link{font-size:.88rem;}

  /* stats */
  .stat-num{font-size:2.4rem;}
  .stat-cap{font-size:.82rem;}

  /* numbered con menos padding */
  .numbered h3{font-size:1.15rem;}
  .numbered p{font-size:.88rem;}

  /* footer compacto */
  .footer-grid{gap:28px;}
  .footer-grid h5{font-size:.68rem;margin-bottom:14px;}
  .footer-grid a,.footer-contact p{font-size:.88rem;}
  .footer-brand p{font-size:.84rem;}

  /* prose ajustada */
  .prose h2{font-size:1.15rem;margin:28px 0 10px;}
  .prose ul{margin-bottom:14px;}

  /* arrow-list */
  .arrow-list li{padding-bottom:10px;gap:10px;}

  /* faq */
  .faq-q{font-size:.92rem;}

  /* cookie ultra compacto */
  .cookie{padding:14px 16px;}
  .cookie p{font-size:.78rem;}
  .cookie-buttons button{padding:10px 12px;font-size:.66rem;}
}

/* ---------- ULTRA PEQUEÑO (≤ 380px · iPhone SE, Galaxy Fold) ---------- */
@media(max-width:380px){
  body{font-size:14.5px;}
  .wrap{padding:0 14px;}
  .section{padding:38px 0;}

  /* hero ultra reducido */
  .hero{min-height:380px;}
  .hero-title{font-size:1.32rem;line-height:1.18;}
  .hero-eyebrow{font-size:.58rem;}
  .hero-content{padding-bottom:36px;}

  /* page hero */
  .page-hero{padding:84px 0 34px;}
  .page-hero h1{font-size:1.3rem;}

  /* tipografía global más compacta */
  .h-xl{font-size:1.4rem !important;}
  .h-lg{font-size:1.25rem !important;}
  .h-md{font-size:1.05rem;}

  /* CTA */
  .cta-center h2{font-size:1.22rem;}

  /* stats */
  .stat-num{font-size:2.1rem;}

  /* cookie: botones apilados */
  .cookie-buttons{flex-direction:column;}
  .cookie-buttons button{width:100%;}
}

/* =========================================================
   BLOG — listado y artículos
   ========================================================= */

/* Hero del listing */
.blog-hero{
  padding:clamp(140px,18vh,210px) 0 clamp(40px,6vh,70px);
  background:var(--cream);color:var(--text);
}
.blog-hero h1{
  font-size:clamp(2rem,4.6vw,3.4rem);
  font-weight:300;letter-spacing:-.02em;line-height:1.08;
  max-width:24ch;
}
.blog-hero p{margin-top:18px;max-width:64ch;color:var(--text-soft);font-size:1rem;line-height:1.6;}

/* Listing */
.blog-list{padding:clamp(40px,6vw,80px) 0 clamp(60px,8vw,120px);}
.blog-year{
  font-size:.78rem;letter-spacing:.28em;text-transform:uppercase;
  color:var(--taupe-deep);margin:48px 0 24px;font-weight:500;
}
.blog-year:first-child{margin-top:0;}
.blog-item{
  display:grid;grid-template-columns:120px 1fr;gap:32px;
  padding:28px 0;border-bottom:1px solid var(--line);
  align-items:start;
}
.blog-item:first-of-type{padding-top:0;}
.blog-item time{
  font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--text-soft);font-weight:400;padding-top:6px;
}
.blog-item a{display:block;color:inherit;}
.blog-item h3{
  font-size:1.35rem;font-weight:300;line-height:1.3;color:var(--ink);
  margin-bottom:8px;letter-spacing:-.012em;
  transition:color .2s ease;
}
.blog-item a:hover h3{color:var(--taupe-deep);}
.blog-item p{
  font-size:.94rem;color:var(--text-soft);line-height:1.55;
  max-width:64ch;
}
.blog-tag{
  display:inline-block;font-size:.66rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--taupe-deep);
  margin-bottom:8px;
}

/* Artículo individual */
.post-hero{
  padding:clamp(130px,16vh,180px) 0 clamp(40px,6vh,70px);
  background:var(--cream);
}
.post-meta{
  display:flex;gap:18px;font-size:.72rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--taupe-deep);margin-bottom:24px;
  flex-wrap:wrap;
}
.post-meta time{color:var(--text-soft);}
.post-hero h1{
  font-size:clamp(1.8rem,4.2vw,3rem);
  font-weight:300;letter-spacing:-.02em;line-height:1.12;
  max-width:26ch;
}
.post-hero .lead{
  margin-top:22px;max-width:62ch;color:var(--text-soft);
  font-size:1.05rem;line-height:1.6;font-weight:300;
}

.post-body{padding:clamp(48px,7vw,90px) 0 clamp(60px,8vw,120px);}
.post-body .wrap-narrow{max-width:720px;margin:0 auto;}
.post-body h2{
  font-size:clamp(1.35rem,2.6vw,1.7rem);
  font-weight:500;color:var(--ink);
  margin:48px 0 18px;letter-spacing:-.01em;
}
.post-body h2:first-child{margin-top:0;}
.post-body h3{
  font-size:1.12rem;font-weight:500;color:var(--ink);
  margin:32px 0 12px;
}
.post-body p{
  font-size:1rem;line-height:1.72;color:var(--text);
  margin-bottom:18px;
}
.post-body ul,.post-body ol{
  margin:0 0 22px 22px;padding:0;
}
.post-body li{
  font-size:1rem;line-height:1.7;color:var(--text);
  margin-bottom:8px;
}
.post-body blockquote{
  border-left:3px solid var(--taupe);
  padding:6px 0 6px 24px;
  margin:28px 0;
  font-style:italic;color:var(--ink);
  font-size:1.04rem;line-height:1.6;
}
.post-body strong{font-weight:500;color:var(--ink);}
.post-body a{color:var(--taupe-deep);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;}
.post-body a:hover{color:var(--ink);}
.post-body hr{
  border:0;border-top:1px solid var(--line);
  margin:42px 0;
}

/* Related posts */
.post-related{
  background:var(--cream);
  padding:clamp(54px,7vw,90px) 0;
  border-top:1px solid var(--line);
}
.post-related .overline{margin-bottom:24px;display:block;}
.post-related h2{
  font-size:clamp(1.4rem,2.8vw,1.9rem);font-weight:300;
  margin-bottom:34px;color:var(--ink);
}
.related-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:30px;
}
.related-grid a{
  display:block;color:inherit;padding:24px 0;
  border-top:1px solid var(--line);
}
.related-grid time{
  font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--text-soft);display:block;margin-bottom:10px;
}
.related-grid h3{
  font-size:1.05rem;font-weight:400;line-height:1.4;color:var(--ink);
  transition:color .2s ease;
}
.related-grid a:hover h3{color:var(--taupe-deep);}

/* Responsive blog */
@media(max-width:960px){
  .blog-item{grid-template-columns:1fr;gap:8px;}
  .blog-item time{padding-top:0;}
  .related-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:720px){
  .blog-hero h1{font-size:clamp(1.6rem,5.6vw,2.2rem);}
  .post-hero h1{font-size:clamp(1.5rem,5.4vw,2.1rem);}
  .post-body h2{font-size:1.2rem;margin:36px 0 14px;}
  .related-grid{grid-template-columns:1fr;}
  .post-body{padding:36px 0 60px;}
  .post-body p,.post-body li{font-size:.96rem;line-height:1.7;}
}
