/* Creative Socio — estilos. Medidas y colores tomados de Figma (desktop 1440 manda; móvil 402). */

@font-face{font-family:"Fraunces";font-style:normal;font-weight:300;font-display:swap;src:url("../fonts/fraunces-9pt-300.woff2") format("woff2")}
@font-face{font-family:"Fraunces";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/fraunces-9pt-400.woff2") format("woff2")}
@font-face{font-family:"Fraunces";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/fraunces-9pt-600.woff2") format("woff2")}
@font-face{font-family:"Fraunces";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/fraunces-9pt-700.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:300 700;font-display:swap;src:url("../fonts/inter-latin.woff2") format("woff2");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:"Inter";font-style:normal;font-weight:300 700;font-display:swap;src:url("../fonts/inter-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,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}

:root{
  --dark:#161616; --black:#000; --white:#fff; --lime:#c3ff00; --lime-press:#a8dd00;
  --gray-1:#f3f3f3; --gray-2:#f8f8f8; --muted:#888;
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --maxw:1120px; --pad:40px; --r-card:40px; --r-pill:35px;
  --focus:#161616;
  --header-h:130px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--dark);color:var(--dark);font:400 18px/30px var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg,picture{display:block;max-width:100%}
a{color:inherit}
p{margin:0}
h1,h2,h3,h4{margin:0;font-family:var(--serif);font-weight:400}
h1,h2,h3,h4,.dato__frase,.eyebrow{text-wrap:balance}
p,li,summary{text-wrap:pretty}
ul,ol{margin:0;padding:0;list-style:none}
li{margin-bottom:6px}
button{font:inherit;color:inherit}
sup{font-size:.6em;line-height:0;vertical-align:super}
.cita{font-size:.7em;line-height:0}
.skip{position:absolute;left:-9999px;top:8px;background:var(--lime);color:var(--black);padding:10px 16px;border-radius:8px;z-index:200}
.skip:focus{left:8px}
.solo-movil{display:none}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.container{width:min(var(--maxw),calc(100% - var(--pad)*2));margin-inline:auto}

/* Temas: el anillo de foco cambia con el fondo */
.theme-dark{--focus:#c3ff00;background:var(--dark);color:var(--white)}
.theme-light{--focus:#161616;background:var(--white);color:var(--dark)}
.theme-gray{--focus:#161616;background:var(--gray-2);color:var(--dark)}

/* ───────── Botones (estados: normal, hover, foco, presionado, desactivado, cargando) ───────── */
.btn{--bg:var(--black);--fg:var(--white);--bd:var(--black);
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 39px;min-height:60px;border:2px solid var(--bd);border-radius:var(--r-pill);
  background:var(--bg);color:var(--fg);font:400 20px/30px var(--sans);white-space:nowrap;text-decoration:none;cursor:pointer;
  transition:background-color .15s,color .15s,border-color .15s,transform .15s;-webkit-tap-highlight-color:transparent}
.btn svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s}
.btn--sm{min-height:46px;padding:10px 39px;font-size:18px;line-height:22px}
.btn--primary{--bg:var(--black);--fg:var(--white);--bd:var(--black)}
.btn--secondary{--bg:var(--white);--fg:var(--black);--bd:var(--black)}
.btn--cta{--bg:var(--lime);--fg:var(--black);--bd:var(--black)}
.btn--block{display:flex;width:100%}
@media (hover:hover){
  .btn--primary:hover{--bg:var(--lime);--fg:var(--black)}
  .btn--secondary:hover{--bg:var(--black);--fg:var(--white)}
  .btn--cta:hover{--bg:var(--black);--fg:var(--lime)}
  .btn:hover svg{transform:translateX(4px)}
}
.btn:active{transform:translateY(1px)}
.btn--primary:active{--bg:var(--lime-press);--fg:var(--black)}
.btn--secondary:active{--bg:var(--dark);--fg:var(--white)}
.btn--cta:active{--bg:var(--dark);--fg:var(--lime)}
.btn:focus-visible,a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.4;cursor:not-allowed;pointer-events:none}
.btn.is-loading{pointer-events:none;opacity:.85}
.btn.is-loading svg{display:none}
.btn.is-loading::after{content:"";width:18px;height:18px;border:3px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ───────── Encabezado ───────── */
.site-header{background:var(--dark);color:var(--white);height:var(--header-h);position:relative;z-index:30}
.site-header .container{height:100%;display:flex;align-items:center;justify-content:space-between}
.nav{display:flex;align-items:center;gap:36px}
.nav a:not(.btn){font:400 16px/24px var(--sans);text-decoration:none;color:var(--white);padding:6px 0;border-bottom:2px solid transparent;transition:border-color .15s}
@media (hover:hover){.nav a:not(.btn):hover{border-bottom-color:var(--lime)}}
.nav a[aria-current="page"]:not(.btn){border-bottom-color:var(--lime)}
.logo{display:block;color:var(--white);width:144px;height:50px;flex:none}
.logo svg{width:100%;height:100%;fill:currentColor}
.menu-btn{display:none;width:49px;height:49px;border:2px solid var(--white);border-radius:50%;background:transparent;color:var(--white);cursor:pointer;align-items:center;justify-content:center;transition:background-color .15s,color .15s}
.menu-btn svg{width:22px;height:22px;stroke:currentColor;stroke-width:2.5;fill:none;stroke-linecap:round}
@media (hover:hover){.menu-btn:hover{background:var(--lime);color:var(--black);border-color:var(--lime)}}
.menu-panel{display:none}

/* ───────── Hero ───────── */
.hero{position:relative;background:var(--black);color:var(--white);padding:120px 0;overflow:hidden;isolation:isolate}
.hero__bg{position:absolute;inset:0;z-index:-1}
.hero__slide{position:absolute;inset:0;opacity:0;transition:opacity .4s ease-in-out}
.hero__slide.is-active{opacity:.3}
.hero__slide picture,.estudio__bg picture,.page-hero__bg picture{display:block;position:absolute;inset:0;width:100%;height:100%}
.hero__slide img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%);filter:blur(3px);transform:scale(1.02)}
.hero__row{display:flex;gap:80px;align-items:flex-start}
.hero__titular{flex:0 0 520px;display:flex;flex-direction:column;gap:28px}
.hero h1{font-weight:700;font-size:clamp(60px,6.667vw,96px);line-height:.85}
.hero h1 em{font-style:normal;color:var(--lime)}
html[lang="en"] .hero h1{line-height:1}
.hero__identidad{font-size:20px;line-height:30px}
.hero__identidad span{display:block}
.hero__datos{flex:0 0 520px;display:flex;flex-direction:column;gap:24px}
.datos{display:grid}
.dato{grid-area:1/1;display:flex;flex-direction:column;gap:24px;opacity:0;visibility:hidden;transition:opacity .4s ease-in-out,visibility .4s}
.dato.is-active{opacity:1;visibility:visible}
.dato__frase{font:400 32px/42px var(--sans)}
.dato__frase strong{font:400 56px/1.15 var(--serif)}
.dato__frase em{font:700 32px/1.3 var(--serif);font-style:normal;color:var(--lime)}
.dato__fuente{font-size:14px;line-height:21px;color:rgba(255,255,255,.55)}
.puntos{display:flex;gap:8px}
.punto{width:10px;height:10px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.4);cursor:pointer;position:relative;transition:background-color .15s}
.punto::before{content:"";position:absolute;inset:-12px}
.punto[aria-current="true"]{background:var(--lime)}
@media (hover:hover){.punto:hover{background:rgba(255,255,255,.8)}.punto[aria-current="true"]:hover{background:var(--lime)}}

/* ───────── Secciones ───────── */
.section{padding:112px 0}
.eyebrow{font:400 14px/17px var(--sans);letter-spacing:.07em;text-transform:uppercase}
.burbuja{display:inline-block;margin-left:10px;margin-top:-3px;padding:3px 10px;border-radius:999px;background:var(--lime);color:var(--black);font-weight:700;font-size:12px;line-height:16px;vertical-align:middle}
.h2{font:300 56px/1.22 var(--serif)}
.fila{display:flex;gap:80px;align-items:flex-start}
.fila--imagen{align-items:center}
.fila--imagen .fila__col{flex:5 1 0;min-width:0;display:flex;flex-direction:column;gap:32px}
.fila--imagen .fila__titulo,.fila--imagen .fila__texto{flex:none;width:100%}
.fila--imagen .fila__titulo .h2,.fila--imagen .parrafos{max-width:none}
.fila--imagen{gap:48px}
.fila--imagen .h2 em{font-style:normal;color:var(--dark);background:var(--lime);padding:0 .14em;border-radius:.12em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.como{overflow:hidden}
.fila__imagen{flex:7 1 0;min-width:0;display:block}
.fila__imagen img{display:block;width:100%;height:auto;transform:translateY(50px) scale(1.1)}
.fila__titulo{flex:0 0 520px;display:flex;flex-direction:column;gap:20px}
.fila__texto{flex:0 0 520px;display:flex;flex-direction:column;align-items:flex-start;gap:30px}
.fila__titulo .h2{max-width:440px}
.como .h2,.estudio .h2{font-weight:400}
.parrafos{display:flex;flex-direction:column;gap:12px;max-width:500px}
.parrafos p{width:100%}
.pasos{display:flex;flex-direction:column;gap:10px;max-width:500px}.pasos b{font-weight:600}.pasos li{display:flex;align-items:center;gap:10px}.pasos svg{width:14px;height:14px;flex:none;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}

.opciones{padding:96px 0;background:#f0f0f0;color:#161616}
.opciones .eyebrow{text-align:center;margin-bottom:48px}
.opciones__chevron{display:none}
.tarjetas{display:flex;gap:32px}
.tarjeta{flex:1 1 0;background:var(--white);color:var(--dark);border-radius:var(--r-card);padding:48px 35px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:24px}
.tarjeta__icono{width:96px;height:96px;object-fit:contain}
.tarjeta h3{font:400 32px/1.22 var(--serif)}
.tarjeta p{color:var(--muted);font-size:18px;line-height:30px}
.tarjeta .btn{margin-top:auto}

.estudio{position:relative;isolation:isolate;overflow:hidden}
.estudio__bg{position:absolute;inset:0;z-index:-1;opacity:.05}
.estudio__bg img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%;filter:grayscale(1) blur(3px);transform:scale(1.02)}

.cifras{display:flex;gap:24px;margin-top:40px}
.cifra{flex:1 1 0;border-radius:var(--r-card);padding:40px 32px;display:flex;flex-direction:column;gap:16px}
.cifra .cifra__n{font:400 72px/76px var(--serif)}
.cifra p{font-size:20px;line-height:30px}
.cifra--oscura{background:var(--dark);color:var(--white)}
.cifra--oscura .cifra__n{color:var(--lime)}
.cifra--oscura p{color:rgba(255,255,255,.85)}
.cifra--lima{background:var(--lime);color:var(--dark)}
.cifra--gris{background:var(--white);color:var(--dark)}
.lectura{padding-top:16px;margin-top:24px;display:flex;flex-direction:column;gap:24px}
.lectura p:first-child{font-size:22px;line-height:34px}

.cta{padding:120px 0}
.cta__row{display:flex;gap:80px;align-items:flex-start}
.cta__row h2{flex:0 0 360px;font:400 56px/1.22 var(--serif)}
.cta__col{flex:0 0 680px;display:flex;flex-direction:column;gap:30px}
.cta__col p{font-size:20px;line-height:30px}
.cta__botones{display:flex;gap:24px;flex-wrap:wrap}

.notas{background:var(--dark);color:#666;padding:0 0 32px}
.notas__linea{height:1px;background:#333;margin-bottom:32px}
.notas p{font-size:12px;line-height:normal}

.site-footer{background:var(--dark);color:#666;font-size:14px;line-height:22px;padding:0 0 33px}
.site-footer .container{border-top:1px solid #333;padding-top:33px;display:flex;justify-content:space-between;gap:16px}
.site-footer__legal{display:flex;gap:24px}
.site-footer__enlaces{display:flex;gap:16px}
.site-footer a,.site-footer button{color:inherit;background:none;border:0;padding:0;font:inherit;text-decoration:none;cursor:pointer;transition:color .15s}
@media (hover:hover){.site-footer a:hover,.site-footer button:hover{color:var(--white);text-decoration:underline}}
.site-footer a.site-footer__idioma{color:var(--white);font-weight:600}


/* ───────── Encabezado de página (banda oscura con título) ───────── */
.page-hero{position:relative;isolation:isolate;overflow:hidden;background:var(--dark);color:var(--white);padding:72px 0 104px}
.page-hero__bg{position:absolute;inset:0;z-index:-1;opacity:.1}.page-hero--empieza .page-hero__bg,.page-hero--servicios .page-hero__bg{opacity:.3}
.page-hero__bg img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%;filter:blur(3px);transform:scale(1.02)}
.page-hero .container{display:flex;flex-direction:column;gap:32px}
.page-hero h1{font:700 64px/1.22 var(--serif);max-width:900px}
.page-hero h1 em{font-style:normal;color:var(--lime)}
.page-hero p{max-width:760px;font-size:18px;line-height:30px}
.page-hero p+p{margin-top:-20px}
.page-hero--confirmar{min-height:calc(100vh - 220px);padding-top:120px}.page-hero--confirmar [hidden]{display:none}
.page-hero .eyebrow{font-size:14px;line-height:17px}

/* ───────── Escenarios (Empieza por tu caso) ───────── */
.escenario{padding:96px 0}
.escenario--gris{background:var(--gray-2)}
.escenario__fila{display:flex;gap:80px;align-items:flex-start}
.escenario__cab{flex:0 0 340px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:32px}
.escenario__titulo{font:300 40px/1.22 var(--serif)}
.escenario__imagen{display:block;width:100%;max-width:300px}
.escenario__imagen img{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.escenario--gris .escenario__imagen img{mix-blend-mode:normal}
.otra{padding:96px 0}
.otra__fila{display:flex;gap:80px;align-items:center}
.otra__titulo{flex:0 0 340px;font:300 40px/1.22 var(--serif);text-align:center}
.otra__texto{flex:1;max-width:420px}
.escenario__titulo button{display:block;width:100%;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:center;cursor:default}
.escenario__chev{display:none}
.detalle[hidden]{display:none}
.detalle{flex:0 0 700px;display:flex;flex-direction:column;gap:28px}
.detalle h4{font:600 24px/1.3 var(--serif);margin-bottom:10px}
.detalle p+p{margin-top:12px}
.detalle ul{list-style:disc;padding-left:27px;margin:12px 0}
.detalle li{padding-left:2px}
.detalle strong{font-weight:700}
.detalle .btn{align-self:flex-start}
.cta__antes{display:block}

/* ───────── Contacto ───────── */
.contacto{padding:96px 0}
.contacto__fila{display:flex;gap:80px;align-items:flex-start}
.contacto__vias{flex:0 0 420px;display:flex;flex-direction:column;gap:56px}
.via{display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.via h2{font:600 28px/1.25 var(--serif)}
.via p{font-size:18px;line-height:30px}
.via .via__numero{font:600 40px/1.22 var(--serif)}
.via__encabezado{display:flex;flex-direction:column;gap:16px}
.via__numero{font:600 40px/1.22 var(--serif)}
.formulario{flex:0 0 620px;background:var(--gray-2);border-radius:var(--r-card);padding:48px;display:flex;flex-direction:column;gap:24px}
.formulario h2{font:600 28px/1.25 var(--serif);margin-bottom:16px}
.formulario__intro{font-size:18px;line-height:30px}
.form{display:flex;flex-direction:column;gap:24px}
.form__fila{display:flex;gap:20px}
.campo{flex:1 1 0;display:flex;flex-direction:column;gap:10px;min-width:0}
.campo label{font:700 16px/28px var(--sans)}
.campo input,.campo textarea{width:100%;height:60px;padding:0 20px;border:2px solid #333;border-radius:14px;background:var(--white);color:var(--dark);font:400 18px/22px var(--sans);transition:border-color .15s,box-shadow .15s}
.campo textarea{height:132px;padding:18px 20px;resize:vertical}
.campo input::placeholder,.campo textarea::placeholder{color:rgba(22,22,22,.55)}
@media (hover:hover){.campo input:hover,.campo textarea:hover{border-color:var(--black)}}
.campo input:focus,.campo textarea:focus{border-color:var(--black);box-shadow:0 0 0 3px var(--lime)}
.campo [aria-invalid="true"]{border-color:#b3261e}
.campo__error{display:none;color:#b3261e;font-size:14px;line-height:22px}
.campo__error.is-visible{display:block}
.trampa{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form__aviso{font-size:14px;line-height:22px}
.form__estado{display:none;padding:16px 20px;border-radius:14px;font-size:16px;line-height:24px}
.form__estado.is-visible{display:block}
.form__estado--ok{background:var(--lime);color:var(--dark)}
.form__estado--error{background:#fdecea;color:#7a1b14;border:2px solid #b3261e}

/* ───────── Texto legal (Privacidad) ───────── */
.legal{padding:96px 0}
.legal__col{max-width:720px;display:flex;flex-direction:column;gap:48px}
.legal h2{font:600 22px/1.3 var(--serif);margin-bottom:10px}
.legal p+p,.legal ul+p,.legal p+ul{margin-top:12px}
.legal ul{list-style:disc;padding-left:27px}
.legal a{text-underline-offset:3px}


/* ───────── Servicios ───────── */
.etapas{padding:104px 0;background:var(--gray-2);color:var(--dark)}
.etapas .container{display:flex;flex-direction:column;gap:48px}
.etapas__grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.etapa{background:var(--white);border-radius:var(--r-card);padding:48px;display:flex;flex-direction:column;gap:20px}
.etapa--lima{background:var(--lime)}
.etapas__grid--3{grid-template-columns:repeat(3,1fr)}.etapas__grid--3 .etapa{padding:40px}
.etapa__icono{width:137px;height:120px;padding:13px 9px;display:flex;align-items:center;justify-content:center}
.etapa__icono img{max-width:100%;max-height:100%}
.etapa h3{font:600 28px/1.25 var(--serif)}
.etapa--lima h3{color:var(--black)}
.etapa p+p{margin-top:12px}
.hacer{padding:104px 0}
.hacer__fila{display:flex;gap:80px;align-items:flex-start}
.hacer__titulo{flex:0 0 320px;display:flex;flex-direction:column;gap:24px}
.hacer__lista{flex:0 0 720px;display:flex;flex-direction:column;gap:40px}
.acc{border-bottom:2px solid var(--black);padding-bottom:7px}
.acc summary{display:flex;align-items:center;justify-content:space-between;gap:36px;padding:7px 3px;list-style:none;cursor:pointer;font:400 32px/1.2 var(--serif);color:var(--black);-webkit-tap-highlight-color:transparent}
.acc summary::-webkit-details-marker{display:none}
.acc__icono{width:27px;height:27px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.acc[open] .acc__icono{transform:rotate(180deg)}
@media (hover:hover){.acc summary:hover{color:#4a4a4a}}
/* Al abrir un acordeón, cada párrafo y cada línea de lista entra en cascada (vertical); la clase .abre y --d los pone site.js */
@keyframes abre-vert{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.abre :is(h4,p,li,.btn){animation:abre-vert 1.17s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--d,0s)}
.acc.cerrando .acc__icono{transform:none}
.acc__cuerpo{padding:30px 66px 43px 3px;display:flex;flex-direction:column;gap:16px}
.acc__intro{font-size:16px;line-height:24px}
.acc__cuerpo ul{list-style:disc;padding-left:24px;font-size:16px;line-height:26px}
.acc__cuerpo li{padding-left:2px}
.acc__cuerpo strong,.acc__cuerpo b{font-weight:600}
.acc--faq{border-bottom:0;padding-bottom:0}
.acc--faq summary{font:600 20px/1.3 var(--serif);color:var(--dark)}
.acc--faq .acc__cuerpo{padding:16px 66px 20px 3px}
.acc--faq .acc__cuerpo p{font-size:16px;line-height:24px}
.acc--faq .acc__cuerpo p+p{margin-top:8px}
.preguntas{padding:104px 0}
.preguntas__lista{flex:0 0 720px;display:flex;flex-direction:column;gap:15px}
.paga{padding:104px 0}
.paga .container{display:flex;flex-direction:column;gap:40px}
.bloque{display:flex;gap:80px;padding:28px 0;border-top:1px solid #333}
.bloque:last-child{border-bottom:1px solid #333}
.bloque h3{flex:0 0 360px;font:600 22px/1.3 var(--serif)}
.bloque h3 em{font-style:normal;color:var(--lime)}
.bloque__texto{flex:0 0 680px;display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.bloque__texto p+p{margin-top:12px}
.bloque__texto b{font-weight:700}

/* ───────── Sobre nosotros ───────── */
.nombre{padding:104px 0;background:var(--lime);color:var(--dark)}
.nombre__fila{display:flex;gap:80px;align-items:flex-start}
.nombre__def{flex:0 0 520px;display:flex;flex-direction:column;gap:24px}
.nombre__def h2{font:600 22px/1.3 var(--serif)}
.definiciones{position:relative;padding-left:26px;display:flex;flex-direction:column;gap:24px}
.definiciones::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--dark);transform-origin:top}
.definiciones em{font-style:italic}
.nombre__texto{flex:0 0 520px;padding-top:45px;display:flex;flex-direction:column;gap:32px}
.nombre__texto h3{font:600 22px/1.3 var(--serif);margin-bottom:6px}
.nombre__texto ul{list-style:disc;padding-left:27px}
.venimos{padding:104px 0}
.venimos__fila{display:flex;gap:80px;align-items:flex-start}
.venimos__texto{flex:0 0 520px;display:flex;flex-direction:column;gap:24px}
.venimos__texto h2{font:600 22px/1.3 var(--serif)}
.venimos__texto h2+p{margin-top:-8px}
.venimos__texto p+p{margin-top:-12px}
.fotos{flex:0 0 520px;display:grid;grid-template-columns:250px 250px;grid-auto-rows:auto;align-items:start;gap:20px}
.fotos picture{display:block;width:100%}
.fotos img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.quienes{padding:104px 0}
.quienes .container{display:flex;flex-direction:column;gap:48px}
.personas{display:flex;gap:80px;align-items:flex-start}
.persona{flex:0 0 520px;display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.persona__foto{width:300px;height:300px;max-width:100%;border-radius:50%;object-fit:cover;object-position:50% 50%;background:#d9d9d9}
.persona__nombre strong{font-weight:700}
.quienes>.container>.eyebrow{text-align:center}
.persona>picture{align-self:center}
.persona__nombre{align-self:stretch;text-align:center}
.persona>p{align-self:stretch;text-align:center}
.persona__enlaces{display:flex;gap:12px;align-self:stretch;justify-content:center}
.apoyo{display:flex;gap:80px;padding-top:48px;border-top:1px solid rgba(22,22,22,.15)}
.apoyo p{flex:0 0 520px}
.apoyo strong{font-weight:700}

/* ───────── El caso ───────── */
.caso-hero .container{gap:28px}
.caso-hero .eyebrow{text-transform:uppercase}
.caso-hero__intro{font-size:20px!important;line-height:30px!important;color:rgba(255,255,255,.9)}
.estudio-caso{padding:96px 0}
.estudio-caso__fila{display:flex;gap:80px;align-items:flex-start}
.hallazgos{flex:0 0 480px;display:flex;flex-direction:column;gap:40px}
.hallazgos h2{font:600 22px/1.3 var(--serif);margin-bottom:12px}
.hallazgos ul{list-style:disc;padding-left:27px}.hallazgos p+p{margin-top:12px}
.hallazgos b{font-weight:600}
.hallazgos .objetivos{list-style:none;padding:0;margin:12px 0;display:flex;flex-direction:column;gap:8px}
.pedido{flex:0 0 560px;background:var(--gray-2);border-radius:var(--r-card);padding:40px;display:flex;flex-direction:column;gap:20px}
.pedido h2{font:600 22px/1.3 var(--serif);margin-bottom:6px}
.casilla{display:flex;gap:12px;align-items:center;font-size:16px;line-height:24px}
.casilla input{appearance:none;width:24px;height:24px;flex:none;margin:0;border:2px solid var(--dark);border-radius:6px;background:var(--white);cursor:pointer;display:grid;place-content:center;transition:background-color .15s}
.casilla input:checked{background:var(--lime)}
.casilla input:checked::after{content:"";width:6px;height:11px;border:solid var(--dark);border-width:0 2.5px 2.5px 0;transform:rotate(45deg) translate(-1px,-1px)}
.casilla label{cursor:pointer}
.nota{padding:88px 0;background:var(--gray-2)}
.nota p{max-width:760px}

/* ───────── Aviso de idioma (lo crea site.js solo si el navegador pide el otro idioma) ───────── */
.idioma-aviso{position:relative;z-index:40;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px 8px;background:var(--lime);color:var(--black);font:400 15px/22px var(--sans);padding:9px 56px;text-align:center}
.idioma-aviso a{color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.idioma-aviso button{position:absolute;right:16px;top:50%;transform:translateY(-50%);width:32px;height:32px;border:0;border-radius:50%;background:transparent;color:inherit;font:400 24px/1 var(--sans);cursor:pointer}
@media (hover:hover){.idioma-aviso button:hover{background:rgba(0,0,0,.1)}}

.boletin{position:fixed;right:24px;bottom:24px;width:min(400px,calc(100% - 48px));background:var(--white);color:var(--dark);border-radius:24px;padding:32px 28px 28px;box-shadow:0 8px 24px rgba(0,0,0,.25);z-index:99;opacity:0;visibility:hidden;transform:translateY(20px);transition:opacity .25s,transform .25s,visibility .25s;--focus:#161616}
.boletin.is-open{opacity:1;visibility:visible;transform:none}
.boletin__titulo{font:600 24px/1.25 var(--serif);margin-bottom:8px;padding-right:28px}
.boletin__texto{font-size:15px;line-height:23px;margin-bottom:16px}
.boletin .form{gap:12px}
.boletin__cerrar{position:absolute;top:14px;right:14px;width:36px;height:36px;border:0;background:none;border-radius:50%;font-size:24px;line-height:1;cursor:pointer;color:var(--dark)}
.boletin__cerrar:hover{background:var(--gray-2)}
.boletin .form__aviso{font-size:12px;line-height:18px}

/* ───────── Responsive (móvil: 402) ───────── */
@media (max-width:999px){
  :root{--header-h:140px}
  body{font-size:16px;line-height:28px}
  .container{width:calc(100% - 80px)}
  .nav{display:none}
  .menu-btn{display:inline-flex}
  .site-header .container{flex-direction:row-reverse;justify-content:space-between}
  .site-header{border-bottom:4px solid var(--lime)}
  .logo{width:136px;height:48px}
  .header--over{position:absolute;left:0;right:0;top:var(--bar-h,0px);background:var(--dark)}
  /* Menú: el encabezado se expande hacia abajo hasta llenar la pantalla (.4 s, arranca parejo y frena al final) y empuja el contenido. El logo y el botón (que pasa a ser una X)
     bajan con él. Los 5 botones se desvanecen y entran desde la izquierda uno tras otro, rápido (50 ms de diferencia), apenas empieza. Al cerrar, los botones no se desvanecen: suben pegados al borde de abajo del encabezado (.5 s) y salen recortados por arriba. */
  :root{--menu-h:calc(100dvh - var(--bar-h,0px));--menu-t:.4s cubic-bezier(.3,.3,.2,1)}
  .site-header{overflow:hidden;transition:height .5s cubic-bezier(.65,0,.35,1)}
  .site-header.menu-abierto{height:var(--menu-h);transition:height var(--menu-t)}
  .site-header .container{height:calc(var(--header-h) - 4px);position:relative;z-index:2}
  .site-header .logo,.site-header .menu-btn{transition:translate .5s cubic-bezier(.65,0,.35,1),background-color .15s,color .15s,border-color .15s}
  .site-header.menu-abierto .logo,.site-header.menu-abierto .menu-btn{translate:0 calc(var(--menu-h) - 68px - (var(--header-h) - 4px) / 2);transition:translate var(--menu-t),background-color .15s,color .15s,border-color .15s}
  .menu-btn .m-ham,.menu-btn .m-x{transition:opacity .25s}
  .menu-btn .m-x{opacity:0}
  .site-header.menu-abierto .menu-btn .m-ham{opacity:0}
  .site-header.menu-abierto .menu-btn .m-x{opacity:1}
  .header--over~main,.header--over~footer{transition:translate .5s cubic-bezier(.65,0,.35,1)}
  .header--over.menu-abierto~main,.header--over.menu-abierto~footer{translate:0 calc(var(--menu-h) - var(--header-h));transition:translate var(--menu-t)}
  .menu-panel{position:absolute;left:0;right:0;bottom:0;height:var(--menu-h);display:flex;flex-direction:column;justify-content:center;gap:12px;padding:80px 40px 190px;overflow:auto;visibility:hidden;transition:visibility 0s .5s}
  .site-header.menu-abierto .menu-panel{visibility:visible;transition:visibility 0s}
  .menu-panel>.btn{opacity:0;translate:-32px 0;transition:opacity 0s .5s,translate 0s .5s,background-color .15s,color .15s,border-color .15s,transform .15s}
  .site-header.menu-abierto .menu-panel>.btn{opacity:1;translate:none;transition:opacity .9s ease var(--d,.05s),translate .9s cubic-bezier(.22,1,.36,1) var(--d,.05s),background-color .15s,color .15s,border-color .15s,transform .15s}
  .menu-panel>.btn:nth-child(2){--d:.12s}.menu-panel>.btn:nth-child(3){--d:.19s}.menu-panel>.btn:nth-child(4){--d:.26s}.menu-panel>.btn:nth-child(5){--d:.33s}
  .menu-panel__idioma{align-self:center;margin-top:6px;color:var(--white);font:400 14px/22px var(--sans);text-decoration:underline;text-underline-offset:3px;opacity:0;translate:-32px 0;transition:opacity 0s .5s,translate 0s .5s}
  .site-header.menu-abierto .menu-panel__idioma{opacity:1;translate:none;transition:opacity .9s ease .4s,translate .9s cubic-bezier(.22,1,.36,1) .4s}
  .menu-panel .btn{width:100%;justify-content:space-between;padding:15px 25px 15px 25px}
  .hero{padding:60px 0 63px}
  .hero--home{padding-top:calc(var(--header-h) + 60px)}
  .hero__row{flex-direction:column;gap:60px}
  .solo-movil{display:inline}
  .hero__titular,.hero__datos{flex:none;width:100%}
  .hero__titular{gap:12px}
  .hero h1{font-size:60px;line-height:58px}
  .hero__identidad{font-size:16px;line-height:28px}
  .hero__identidad span{margin-top:14px}
  .hero__datos{gap:20px}
  .dato{gap:20px}
  .dato__frase{font-size:24px;line-height:31px}
  .dato__frase strong{font-size:40px;line-height:31px}
  .dato__frase em{font-size:24px;line-height:31px}
  .dato__fuente{font-size:12px;line-height:18px}
  .puntos{gap:8px}
  .hero__slide.is-active{opacity:.3}
  .section{padding:73px 0}
  .h2{font-size:32px;line-height:1.22}
  .estudio .h2,.como .h2{font-size:40px;line-height:1.15;font-weight:400}
  .fila{flex-direction:column;gap:40px}
  .fila--imagen .fila__col,.fila__imagen{flex:none;width:100%;margin-right:0}
  .fila__imagen img{transform:none}
  .fila__titulo,.fila__texto{flex:none;width:100%}
  .fila__titulo{gap:20px}
  .fila__titulo .h2{max-width:none}
  .parrafos{max-width:none}
  .fila__texto{gap:30px}
  .opciones{padding:0 0 80px}
  .opciones .container{width:calc(100% - 40px)}
  .opciones__cab{padding:39px 0;display:flex;flex-direction:column;align-items:center;gap:16px}
  .opciones__chevron{display:block;width:29px;height:29px;stroke:#161616;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
  .opciones .eyebrow{margin:0}
  .tarjetas{flex-direction:column;gap:20px}
  .tarjeta{padding:80px 10px;gap:29px}
  .tarjeta__icono{width:100px;height:100px}
  .tarjeta h3{font-size:36px;line-height:41px;padding-inline:20px}
  .tarjeta p{font-size:20px;line-height:30px;padding-inline:36px}
  .cifras{flex-direction:column;gap:16px;margin-top:40px}
  .cifra{padding:32px;gap:12px}
  .cifra .cifra__n{font-size:64px;line-height:68px}
  .cifra p{font-size:18px;line-height:28px}
  .lectura{margin-top:24px;gap:16px}
  .lectura p:first-child{font-size:20px;line-height:30px}
  .lectura p:last-child{font-size:16px;line-height:26px}
  .cta{padding:100px 0}
  .cta__row{flex-direction:column;gap:45px}
  .cta__row h2,.cta__col{flex:none;width:100%}
  .cta__row h2{font-size:36px;line-height:1.14}
  .cta__botones{flex-direction:column;gap:19px}
  .cta__botones .btn{width:100%}
  .notas{padding-bottom:24px}
  .notas__linea{margin-bottom:24px}
  .notas p{line-height:18px}
  .site-footer .container{flex-direction:column;align-items:center;text-align:center;gap:4px;padding-top:25px}
  .site-footer{padding-bottom:25px}
  .site-footer__legal{flex-direction:column;gap:4px}
  .page-hero{padding:calc(var(--header-h) + 24px) 0 60px}
  .page-hero .container{gap:24px}
  .page-hero h1{font-size:40px;line-height:1.2}
  .page-hero p{font-size:16px;line-height:28px}
  .page-hero p+p{margin-top:-8px}
  .escenario{padding:0;background:var(--white)}
  .escenario--gris{background:var(--white)}
  .escenario+.escenario{border-top:1px solid rgba(22,22,22,.15)}
  .escenario__fila{flex-direction:column;gap:0}
  .escenario__cab{flex:none;width:100%;align-items:stretch;text-align:left}
  .detalle h4{font-size:22px}
  .otra{padding:40px 0;border-top:1px solid rgba(22,22,22,.15)}
  .otra__fila{flex-direction:column;align-items:stretch;gap:24px}
  .otra__titulo{flex:none;width:100%;font-size:32px;text-align:left}
  .otra__texto{max-width:none}
  .escenario__imagen{display:none}
  .escenario__titulo{flex:none;width:100%}
  .escenario__titulo button{text-align:left;display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:32px;padding:40px 0;cursor:pointer}
  .escenario__chev{display:block;flex:none;width:32px;height:32px;border:2px solid var(--dark);border-radius:50%;padding:6px;stroke:var(--dark);stroke-width:2.5;fill:none;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
  .escenario__titulo button[aria-expanded="true"] .escenario__chev{transform:rotate(180deg)}
  .detalle{flex:none;width:100%;padding-bottom:48px}
  .contacto{padding:73px 0}
  .contacto__fila{flex-direction:column;gap:56px}
  .contacto__vias,.formulario{flex:none;width:100%}
  .via h2,.formulario h2{font-size:24px}
  .formulario{padding:32px 24px;border-radius:32px}
  .form__fila{flex-direction:column;gap:24px}
  .legal{padding:73px 0}
  .etapas,.hacer,.preguntas,.paga,.nombre,.venimos,.quienes{padding:73px 0}
  .etapas .container{gap:32px}
  .etapas__grid,.etapas__grid--3{grid-template-columns:1fr;gap:20px}
  .etapa{padding:32px;gap:16px}
  .hacer__fila,.venimos__fila,.nombre__fila,.estudio-caso__fila{flex-direction:column;gap:40px}
  .hacer__titulo,.hacer__lista,.preguntas__lista,.nombre__def,.nombre__texto,.venimos__texto,.fotos,.hallazgos,.pedido{flex:none;width:100%}
  .hacer__lista{gap:24px}
  .acc summary{font-size:24px;gap:16px}
  .acc--faq summary{font-size:18px}
  .acc__cuerpo,.acc--faq .acc__cuerpo{padding-right:46px}
  .bloque{flex-direction:column;gap:16px}
  .bloque h3,.bloque__texto{flex:none;width:100%}
  .nombre__texto{padding-top:0}
  .fotos{grid-template-columns:1fr 1fr;grid-auto-rows:auto;gap:12px}
  .fotos img{aspect-ratio:16/9}
  .personas{flex-direction:column;gap:56px}
  .persona{flex:none;width:100%}
  .apoyo{flex-direction:column;gap:16px}
  .apoyo p{flex:none;width:100%}
  .estudio-caso,.nota{padding:73px 0}
  .pedido{padding:32px 24px;border-radius:32px}
  .boletin{right:16px;left:16px;bottom:16px;width:auto;padding:28px 20px 20px}
  .caso-hero__intro{font-size:18px!important}
  .btn{max-width:100%}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;transition-delay:0s!important;animation-duration:.01ms!important;scroll-behavior:auto!important}
}

/* ── Tu propuesta (el QR de la carta): una sola columna, en bloques ── */
.formulario--propuesta{flex:none;width:100%;max-width:720px;margin:0 auto}
.paso{border:0;padding:0;margin:0;min-width:0;display:flex;flex-direction:column;gap:20px}
.paso legend{font:600 24px/1.25 var(--serif);padding:0;margin-bottom:20px;float:left;width:100%}
.paso legend+*{clear:both}
.paso[hidden],.paso [hidden]{display:none!important}
.campo select{width:100%;height:60px;padding:0 20px;border:2px solid #333;border-radius:14px;background:var(--white);color:var(--dark);font:400 18px/22px var(--sans)}
.campo select:focus{border-color:var(--black);box-shadow:0 0 0 3px var(--lime);outline:0}
.opciones{display:flex;flex-direction:column;gap:12px}
.opciones--fila{flex-direction:row;flex-wrap:wrap}
.opcion{display:flex;gap:14px;align-items:flex-start;padding:16px 20px;border:2px solid #333;border-radius:14px;background:var(--white);cursor:pointer;transition:border-color .15s,box-shadow .15s,background-color .15s}
.opcion--corta{flex:1 1 200px;align-items:center}
.opcion input{appearance:none;width:24px;height:24px;flex:none;margin:1px 0 0;border:2px solid var(--dark);border-radius:50%;background:var(--white);display:grid;place-content:center;cursor:pointer}
.opcion input:checked{background:var(--lime)}
.opcion input:checked::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--dark)}
.opcion:has(input:checked){border-color:var(--black);box-shadow:0 0 0 3px var(--lime)}
.opcion:has(input:focus-visible){box-shadow:0 0 0 3px var(--lime),0 0 0 5px var(--black)}
.opcion input:disabled{opacity:.5}
.opcion span{display:flex;flex-direction:column;gap:4px;font-size:18px;line-height:26px}
.opcion b{font-weight:700}
.opcion small{font-size:16px;line-height:24px;color:#444}
.subbloque{display:flex;flex-direction:column;gap:16px;padding-top:4px}
.subbloque__titulo{font:700 16px/28px var(--sans)}
.subbloque__nota{font-size:16px;line-height:24px}
.enlace-boton{align-self:flex-start;background:none;border:0;padding:0;color:inherit;font:400 16px/24px var(--sans);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.form--enviado>*:not(.form__estado--ok){display:none!important}
@media (max-width:999px){.paso legend{font-size:22px}}
