/* Tipografía de marca Kronoz — Kudryashev (titulares), auto-hospedada */
@font-face{font-family:'Kudryashev';src:url('../fonts/kudryashev-normal.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Kudryashev';src:url('../fonts/kudryashev-semibold.otf') format('opentype');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Kudryashev';src:url('../fonts/kudryashev-bold.otf') format('opentype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Kudryashev';src:url('../fonts/kudryashev-italic.otf') format('opentype');font-weight:400;font-style:italic;font-display:swap}

:root{
  --azul:#023047; --blanco:#fff; --beige:#e1d8ce; --negro:#000; --lima:#ddf149;
  --azul-800:#01243a; --azul-900:#011a2b; --gris-txt:#4a5560; --linea:rgba(2,48,71,.12); --gris-bg:#f2f4f7;
  --ff-title:'Kudryashev','Fraunces',Georgia,serif;
  --ff-body:'Montserrat',system-ui,sans-serif;
  --maxw:1200px;
  --s-1:.5rem; --s-2:1rem; --s-3:1.5rem; --s-4:2rem; --s-6:3rem; --s-8:5rem; --s-10:7rem;
  --r:14px; --r-lg:22px;
  --shadow:0 20px 50px rgba(2,48,71,.10);
  --ease:cubic-bezier(.22,1,.36,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:auto}
body{margin:0;font-family:var(--ff-body);color:var(--azul);background:var(--blanco);line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--ff-body);line-height:1.08;font-weight:600;margin:0 0 .4em}
/* Serif (Kudryashev) SOLO para títulos de sección + hero; el resto Montserrat */
.section h2,.hero__title{font-family:var(--ff-title)}
h1{font-size:clamp(2.4rem,6vw,4.6rem)}
h2{font-size:clamp(1.9rem,4vw,3.1rem)}
h3{font-size:clamp(1.2rem,2vw,1.5rem)}
p{margin:0 0 1rem}
.container{width:min(100% - 2.5rem,var(--maxw));margin-inline:auto}
.section{padding-block:var(--s-8)}
.eyebrow{font-family:var(--ff-body);font-weight:600;letter-spacing:.22em;text-transform:uppercase;font-size:.78rem;color:var(--lima);display:inline-block;margin-bottom:1rem}
.eyebrow--dark{color:var(--azul)}
.btn{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--ff-body);font-weight:600;font-size:.9rem;letter-spacing:.02em;padding:.95rem 1.8rem;border-radius:100px;border:0;cursor:pointer;transition:transform .35s var(--ease),background .35s var(--ease),color .35s var(--ease)}
.btn--lima{background:var(--lima);color:var(--azul)}
.btn--lima:hover{transform:translateY(-3px);background:var(--azul);color:var(--blanco)}
.btn--ghost{background:transparent;color:var(--blanco);border:1px solid rgba(255,255,255,.4)}
.btn--ghost:hover{background:var(--blanco);color:var(--azul)}
.text-center{text-align:center}
.reveal{opacity:0;transform:translateY(34px)}
.is-in .reveal,.reveal.is-in{opacity:1;transform:none;transition:opacity .8s var(--ease),transform .8s var(--ease)}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}}
/* ===== Header ===== */
/* Transparente sobre el hero, sólido al hacer scroll */
.site-header{position:fixed;top:0;left:0;right:0;z-index:60;background:var(--blanco);border-bottom:2px solid var(--beige);transition:background .4s var(--ease),box-shadow .4s var(--ease)}
.site-header.is-scrolled{background:var(--blanco);box-shadow:0 8px 24px rgba(2,48,71,.08)}
.site-header__inner{display:flex;align-items:stretch;min-height:92px}
.brand{display:flex;align-items:center;flex-shrink:0;padding:0 2.6rem;background:transparent;transition:background .4s var(--ease)}
.site-header.is-scrolled .brand{background:transparent}
.brand img{height:54px;width:auto}
.nav{flex:1;display:flex;align-items:center;justify-content:center;gap:2.4rem;font-family:var(--ff-body);font-weight:600;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase}
.nav a{color:var(--azul);position:relative;padding:.4rem 0;white-space:nowrap}
/* Con 6 entradas el menú de escritorio no cabe con 2.4rem entre 901 y 1180px */
@media(min-width:901px) and (max-width:1180px){.nav{gap:1.3rem}.brand{padding:0 1.6rem}}
.nav a::after{content:"";position:absolute;left:0;bottom:-3px;width:0;height:2px;background:var(--azul);transition:width .3s var(--ease)}
.nav a:hover,.nav a[aria-current]{color:var(--negro)}
.nav a:hover::after,.nav a[aria-current]::after{width:100%}
/* Submenú de Servicios */
.nav__item{display:inline-flex}
.nav__has-sub{align-self:stretch;display:flex;align-items:center;gap:.35rem;position:relative}
.nav__caret{display:inline-flex;align-items:center;justify-content:center;background:0;border:0;color:var(--azul);cursor:pointer;padding:.2rem;transition:color .3s}
.nav__caret svg{width:12px;height:12px;transition:transform .3s var(--ease)}
.nav__has-sub:hover .nav__caret,.nav__has-sub:focus-within .nav__caret{color:var(--negro)}
.nav__has-sub:hover .nav__caret svg,.nav__has-sub:focus-within .nav__caret svg{transform:rotate(180deg)}
.nav__sub{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(10px);min-width:250px;list-style:none;margin:0;padding:.5rem 0;background:var(--blanco);border:1px solid rgba(2,48,71,.08);border-radius:12px;box-shadow:0 24px 48px rgba(2,48,71,.20);opacity:0;visibility:hidden;transition:opacity .28s var(--ease),transform .28s var(--ease),visibility .28s;z-index:70}
.nav__has-sub:hover .nav__sub,.nav__has-sub:focus-within .nav__sub,.nav__sub.is-open{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.nav__caret[aria-expanded="true"] svg{transform:rotate(180deg)}
.nav__sub li{margin:0}
.nav__sub a{display:block;padding:.62rem 1.35rem;font-size:.76rem;letter-spacing:.05em;color:var(--azul);border-left:3px solid transparent}
.nav__sub a::after{display:none}
.nav__sub a:hover{color:var(--azul);background:var(--gris-bg);border-left-color:var(--lima)}
.nav__sub a[aria-current]{color:var(--azul);font-weight:700;background:var(--gris-bg);border-left-color:var(--lima)}
.nav__sub li:first-child a{font-weight:700;border-bottom:1px solid var(--linea);margin-bottom:.25rem;padding-bottom:.72rem}
.header-search-toggle{display:flex;align-items:center;padding:0 1.7rem;background:transparent;border:0;border-left:1px solid var(--linea);color:var(--azul);cursor:pointer;transition:color .3s}
.header-search-toggle:hover{color:var(--negro)}
.header-search-toggle svg{width:20px;height:20px}
.header-social{display:flex;align-items:center;gap:1rem;padding:0 1.9rem 0 1.4rem}
/* Con 6 entradas (Casos de éxito, Blog) el header completo necesita ~1050px: bajo eso
   las redes del header se ocultan (siguen en el pie y en el botón flotante de WhatsApp) */
@media(min-width:901px) and (max-width:1079px){.header-social{display:none}}
.header-social a{color:rgba(2,48,71,.75);display:grid;place-items:center;transition:color .3s,transform .3s}
.header-social a:hover{color:var(--azul);transform:translateY(-2px)}
.header-social svg{width:18px;height:18px}
.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;background:0;border:0;cursor:pointer;padding:0 1.6rem}
.nav-toggle span{width:26px;height:2px;background:var(--azul);transition:.3s}
/* Overlay de búsqueda */
.search-overlay{position:fixed;inset:0;z-index:120;background:rgba(2,48,71,.97);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility .35s}
.search-overlay.is-open{opacity:1;visibility:visible}
.search-overlay__form{display:flex;align-items:center;gap:1rem;width:min(90%,680px);border-bottom:2px solid var(--lima);padding-bottom:1rem}
.search-overlay__form input{flex:1;background:transparent;border:0;color:var(--blanco);font-family:var(--ff-body);font-weight:600;font-size:clamp(1.4rem,4vw,2.4rem);outline:none}
.search-overlay__form input::placeholder{color:rgba(255,255,255,.4)}
.search-overlay__form button[type=submit]{background:0;border:0;color:var(--lima);cursor:pointer;display:flex}
.search-overlay__form button svg{width:30px;height:30px}
.search-overlay__close{position:absolute;top:1.8rem;right:2.4rem;background:0;border:0;color:var(--blanco);font-size:2.4rem;line-height:1;cursor:pointer}
.search-overlay__close:hover{color:var(--lima)}
.site-footer{background:var(--gris-bg);color:var(--gris-txt);padding-block:var(--s-8) var(--s-3)}
.site-footer__grid{display:grid;grid-template-columns:1.6fr 1fr 1.6fr;gap:2.5rem}
.site-footer h4{color:var(--azul);font-family:var(--ff-body);font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:.8rem;margin-bottom:1rem}
.site-footer__grid a{display:block;color:var(--gris-txt);padding:.25rem 0;transition:color .3s}
.site-footer__grid a:hover{color:var(--azul)}
.site-footer__logo{height:68px;margin-bottom:1.4rem}
.site-footer__social{display:flex;gap:1rem;margin-top:1rem}
.site-footer__social a{color:var(--azul)}
.site-footer__bottom{display:flex;justify-content:space-between;border-top:1px solid var(--linea);margin-top:2.5rem;padding-top:1.5rem;font-size:.82rem}
/* ===== Hero principal ===== */
.hero{position:relative;min-height:max(100vh,720px);overflow:hidden;color:var(--azul);background:var(--blanco)}
/* Foto del equipo anclada a la IZQUIERDA (zona blanca) y disuelta hacia la
   derecha, para no competir con las cuñas beige ni con el formulario. */
.hero__photo{position:absolute;inset:0;z-index:0;pointer-events:none;background-image:url('../fotos/hero-socios.webp');background-image:image-set(url('../fotos/hero-socios.avif') type('image/avif'), url('../fotos/hero-socios.webp') type('image/webp'));background-size:auto 52vw;background-position:left center;background-repeat:no-repeat;opacity:.07;-webkit-mask-image:linear-gradient(to left,transparent 0%,transparent 30%,#000 72%);mask-image:linear-gradient(to left,transparent 0%,transparent 30%,#000 72%)}
.hero__panel{position:absolute;inset:0;display:flex;align-items:center}
/* El video de fondo (red de nodos) y el degradado azul se retiraron:
   el hero es blanco liso. Los archivos siguen en assets/ por si se necesitan. */
/* ===== Formas geométricas ancladas a la derecha. Los PNG originales son cuñas
   lima y azul oscuro; aquí se usan versiones ya teñidas de beige (shape-beige-*.png).
   Se usan como background-image y NO como mask-image: las máscaras por URL
   dependen de CORS y se bloquean al abrir el sitio con file://. ===== */
.hero__shapes{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden;opacity:.85}
.hero__shapes .hs{position:absolute;inset:0;background-repeat:no-repeat;background-position:right top;background-size:auto 100%;opacity:0;transform:translateX(60px);will-change:transform,opacity}
.hero__shapes .hs--1{background-image:url('../img/shapes/shape-beige-1.png');z-index:10;animation:hsIn 1.3s var(--ease) .20s forwards}
.hero__shapes .hs--2{background-image:url('../img/shapes/shape-beige-2.png');z-index:9;animation:hsIn 1.2s var(--ease) .35s forwards}
.hero__shapes .hs--3{background-image:url('../img/shapes/shape-beige-3.png');z-index:8;animation:hsIn 1.3s var(--ease) .50s forwards}
.hero__shapes .hs--4{background-image:url('../img/shapes/shape-beige-4.png');z-index:7;animation:hsIn 1.2s var(--ease) .65s forwards}
.hero__shapes .hs--5{background-image:url('../img/shapes/shape-beige-5.png');z-index:6;animation:hsIn5 1.1s var(--ease) .80s forwards}
@keyframes hsIn{from{opacity:0;transform:translateX(60px)}to{opacity:1;transform:none}}
@keyframes hsIn5{from{opacity:0;transform:translateX(60px)}to{opacity:.4;transform:none}}
@media(prefers-reduced-motion:reduce){.hero__shapes .hs{animation:none;transform:none;opacity:1}.hero__shapes .hs--5{opacity:.4}}
/* Contenido y formulario distribuidos sobre el video */
.hero__layout{position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,1fr) minmax(500px,620px);gap:clamp(1.5rem,3vw,3rem);align-items:center;padding-top:72px}
.hero .hero__content{width:auto;max-width:580px;margin:0}
.hero__eyebrow{display:inline-block;font-family:var(--ff-body);font-weight:600;letter-spacing:.22em;text-transform:uppercase;font-size:.78rem;color:var(--azul);background:transparent;border-left:3px solid var(--lima);padding:.45rem 0 .45rem 1.1rem;margin:0 0 1.3rem}
.hero__title{font-family:var(--ff-title);font-weight:500;font-size:clamp(2rem,3vw,2.75rem);line-height:1.06;text-transform:uppercase;letter-spacing:.005em;margin:0 0 1.9rem}
.hero__title-line{display:block;white-space:nowrap}
.hero__btn{font-size:.86rem;letter-spacing:.14em;text-transform:uppercase;border-radius:0;padding:1.25rem 2.4rem;border:2px solid var(--lima)}
.hero__btn:hover{background:var(--azul);color:var(--blanco);border-color:var(--azul);transform:translateY(-3px)}
.contact__form.hero-form{width:100%;max-width:620px;justify-self:end;padding:1.9rem 2.05rem;border:1px solid rgba(2,48,71,.12);border-radius:20px;background:var(--blanco);box-shadow:0 18px 44px rgba(2,48,71,.10)}
.contact__form.hero-form .form-row{grid-template-columns:1fr 1fr;gap:.65rem}
.contact__form.hero-form .btn{justify-self:start;margin-top:.1rem;padding:.7rem 1.45rem;font-size:.75rem}
/* La tarjeta pasó a blanca sobre hero blanco: se refuerzan los bordes internos
   para que campos y tarjetas de selección no se diluyan. */
.contact__form.hero-form input,.contact__form.hero-form select,.contact__form.hero-form textarea{border-color:rgba(2,48,71,.24)}
.contact__form.hero-form .choice-card{border-color:rgba(2,48,71,.24)}

/* Popup de diagnóstico */
body.modal-open{overflow:hidden}
.diagnostic-modal{position:fixed;inset:0;width:min(calc(100% - 2rem),900px);max-height:calc(100dvh - 2rem);margin:auto;padding:2.4rem;border:0;border-radius:var(--r-lg);overflow:auto;color:var(--azul);background:var(--gris-bg);box-shadow:0 30px 90px rgba(1,26,43,.38)}
.diagnostic-modal[open]{animation:diagnosticIn .35s var(--ease)}
.diagnostic-modal::backdrop{background:rgba(1,26,43,.76);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);animation:diagnosticBackdrop .3s ease-out}
.diagnostic-modal__close{position:absolute;top:1rem;right:1rem;width:42px;height:42px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:var(--azul);color:var(--blanco);font-size:1.8rem;line-height:1;cursor:pointer;transition:background .3s,color .3s,transform .3s}
.diagnostic-modal__close:hover{background:var(--lima);color:var(--azul);transform:rotate(6deg)}
.contact__form.diagnostic-modal__form{padding:.2rem;border-radius:0;background:transparent}
@keyframes diagnosticIn{from{opacity:0;transform:translateY(24px) scale(.98)}to{opacity:1;transform:none}}
@keyframes diagnosticBackdrop{from{background:rgba(1,26,43,0)}to{background:rgba(1,26,43,.76)}}
@media (prefers-reduced-motion:reduce){.diagnostic-modal[open],.diagnostic-modal::backdrop{animation:none}}
@media(max-width:1120px){
  .hero{min-height:0}
  .hero__panel{position:relative;inset:auto;display:block;min-height:100svh;padding:calc(92px + 2rem) 0 3rem}
  .hero__layout{grid-template-columns:1fr;gap:2rem;padding-top:0}
  .hero .hero__content{max-width:680px}
  .contact__form.hero-form{max-width:680px;justify-self:stretch}
  /* Bajo 1120px el hero se apila y crece en alto: si la cuña se escalara por
     ALTURA (auto 100%) cubriría todo el ancho y borraría el blanco. Aquí se
     dimensiona por ANCHO, así queda siempre como acento en la esquina. */
  .hero__shapes{opacity:.8}
  .hero__shapes .hs{background-size:62% auto}
}
@media(max-width:680px){
  .hero__panel{padding-top:calc(92px + 1.5rem)}
  .hero__layout{width:min(100% - 1.25rem,var(--maxw))}
  .contact__form.hero-form{padding:1.35rem}
  .contact__form.hero-form .form-row{grid-template-columns:1fr}
  .hero__title{max-width:none}
  .hero__title-line{display:inline;white-space:normal}
  .hero__title-line:not(:last-child)::after{content:" "}
}
@media(max-width:600px){
  .diagnostic-modal{width:calc(100% - 1rem);max-height:calc(100dvh - 1rem);padding:1.25rem}
  .diagnostic-modal__close{top:.75rem;right:.75rem}
}
@media(max-width:1024px){
  .header-search-toggle{border-left:0;margin-left:auto}
}
@media(max-width:900px){
  .nav{position:fixed;inset:92px 0 auto 0;background:var(--blanco);border-bottom:2px solid var(--beige);box-shadow:0 18px 40px rgba(2,48,71,.10);flex-direction:column;justify-content:flex-start;align-items:flex-start;padding:1.6rem 2rem;gap:1.1rem;font-size:1rem;transform:translateY(-135%);transition:transform .4s var(--ease);z-index:50}
  .nav.nav--open{transform:none}
  .nav__item,.nav__has-sub{width:100%;align-self:auto}
  .nav__has-sub{flex-wrap:wrap;gap:0}
  .nav__has-sub>a{flex:1}
  .nav__caret{margin-left:auto;padding:.4rem .6rem;color:var(--blanco)}
  .nav__caret[aria-expanded="true"] svg{transform:rotate(180deg)}
  .nav__sub{position:static;transform:none;opacity:1;visibility:visible;display:none;width:100%;min-width:0;margin:.2rem 0 .2rem;padding:.2rem 0;background:transparent;border:0;box-shadow:none}
  .nav__sub.is-open{display:block}
  .nav__has-sub:hover .nav__sub,.nav__has-sub:focus-within .nav__sub,.nav__sub.is-open{transform:none;opacity:1;visibility:visible}
  .nav__sub a{padding:.5rem 0 .5rem 1rem;font-size:.9rem;letter-spacing:.04em;text-transform:none;color:rgba(255,255,255,.85);border-left:0;background:transparent}
  .nav__sub a:hover,.nav__sub a[aria-current]{color:var(--lima);background:transparent}
  .nav__sub li:first-child a{border-bottom:1px solid rgba(255,255,255,.12)}
  .brand{padding:0 1.4rem}
  .header-social{display:none}
  .header-search-toggle{margin-left:auto}
  .nav-toggle{display:flex}
  .site-footer__grid{grid-template-columns:1fr;gap:1.8rem}
  .site-footer__bottom{flex-direction:column;gap:.5rem;text-align:center}
}

/* ===== Botón flotante de WhatsApp (personalizado, en toda la web) ===== */
.wa-float{position:fixed;right:22px;bottom:22px;z-index:110;width:60px;height:60px;border-radius:50%;background:#25d366;color:#fff;display:grid;place-items:center;box-shadow:0 12px 30px rgba(37,211,102,.4);transition:transform .3s var(--ease)}
.wa-float:hover{transform:scale(1.06)}
.wa-float svg{width:33px;height:33px}
.wa-float__pulse{position:absolute;inset:0;border-radius:50%;animation:wa-pulse 2s infinite}
@keyframes wa-pulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.55)}70%{box-shadow:0 0 0 18px rgba(37,211,102,0)}100%{box-shadow:0 0 0 0 rgba(37,211,102,0)}}
.wa-float__label{position:absolute;right:74px;top:50%;transform:translateY(-50%) translateX(8px);background:var(--azul);color:#fff;font-family:var(--ff-body);font-weight:600;font-size:.85rem;white-space:nowrap;padding:.5rem .85rem;border-radius:10px;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}
.wa-float__label::after{content:"";position:absolute;right:-4px;top:50%;transform:translateY(-50%) rotate(45deg);width:9px;height:9px;background:var(--azul)}
.wa-float:hover .wa-float__label{opacity:1;transform:translateY(-50%)}
@media(prefers-reduced-motion:reduce){.wa-float__pulse{animation:none}}
@media(max-width:600px){.wa-float{right:16px;bottom:16px}.wa-float__label{display:none}}

/* CTA inferior tras avanzar dos pantallas; reserva espacio al final de la página. */
body.has-diagnostic-bar{padding-bottom:var(--diagnostic-bar-height,80px)}
.diagnostic-bar{position:fixed;inset:auto 0 0;z-index:100;padding:14px 0 calc(14px + env(safe-area-inset-bottom,0px));background:var(--blanco);border-top:1px solid var(--linea);box-shadow:0 -8px 30px rgba(2,48,71,.08);animation:diagnosticBarIn .25s var(--ease)}
.diagnostic-bar[hidden],body.modal-open .diagnostic-bar{display:none}
.diagnostic-bar__inner{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.diagnostic-bar__note{margin:0;color:var(--azul);font-size:.9rem;font-weight:600}
.diagnostic-bar .btn{min-height:44px;justify-content:center;white-space:nowrap}
.diagnostic-bar .btn:focus-visible{outline:2px solid var(--azul);outline-offset:4px}
body.diagnostic-bar-visible .wa-float{bottom:calc(var(--diagnostic-bar-height,80px) + 16px)}
@keyframes diagnosticBarIn{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:none}}
@media(max-width:600px){
  .diagnostic-bar{padding-top:12px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}
  .diagnostic-bar__inner{justify-content:center}
  .diagnostic-bar__note{display:none}
  .diagnostic-bar .btn{width:100%;max-width:440px;font-size:.8rem;padding:.85rem 1rem}
}
@media(prefers-reduced-motion:reduce){.diagnostic-bar{animation:none}}

/* ============================================================
   SECCIONES DE LA HOME
   ============================================================ */
.section h2{font-size:clamp(1.9rem,3.4vw,3rem);text-transform:uppercase;font-weight:500}
.section .text-center h2{margin-inline:auto;max-width:min(94%,780px)}

/* --- Reseña de Kronoz (justo después del hero) --- */
.intro{background:var(--gris-bg);color:var(--azul)}
.intro__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.intro__media{margin:0;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/5}
.intro__media img{width:100%;height:100%;object-fit:cover;object-position:50% 62%}
.intro__head{margin-bottom:1.6rem}
.intro__head h2{margin:0}
.intro__body p{color:var(--gris-txt);font-size:1.02rem;line-height:1.75;max-width:62ch}
.intro__body .intro__lead{color:var(--azul);font-size:clamp(1.12rem,1.6vw,1.3rem);font-weight:500;line-height:1.55}
.intro__body .intro__accent{color:var(--azul);font-weight:600;border-left:3px solid var(--lima);padding-left:1rem;margin:1.6rem 0 0}
/* En móvil el texto va primero: la reseña es lo que el visitante debe leer antes que nada */
@media(max-width:900px){.intro__grid{grid-template-columns:1fr;gap:2rem}.intro__media{order:2;aspect-ratio:4/3}.intro__media img{object-position:50% 58%}}

/* --- Experiencia real (oscuro, 3 tarjetas) --- */
.real-world{position:relative;overflow:hidden;background:var(--beige);color:var(--azul)}
.real-world::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 88% 12%,rgba(255,255,255,.55),transparent 42%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64'%3E%3Cg fill='none' stroke='%23023047' stroke-opacity='0.05' stroke-width='1'%3E%3Cpath d='M0 64L64 0M-16 16L16 -16M48 80L80 48'/%3E%3C/g%3E%3C/svg%3E")}
.real-world > .container{position:relative;z-index:1}
.real-world h2{color:var(--azul)}
.real-world .eyebrow{color:var(--azul)}
.rw-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem;margin-top:3rem}
.rw-card{background:var(--blanco);border:1px solid rgba(2,48,71,.10);border-radius:var(--r);padding:2.4rem 2rem;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s}
.rw-card:hover{transform:translateY(-8px);border-color:var(--azul);box-shadow:0 18px 44px rgba(2,48,71,.12)}
.rw-card__icon{width:60px;height:60px;display:grid;place-items:center;border-radius:14px;background:var(--lima);color:var(--azul);margin-bottom:1.4rem}
.rw-card__icon svg{width:28px;height:28px}
.rw-card h3{color:var(--azul);margin-bottom:.6rem}
.rw-card p{color:var(--gris-txt)}
.rw-card__link{color:var(--azul);font-weight:600;font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;display:inline-flex;gap:.4rem;align-items:center}
.rw-card__link span{transition:transform .3s}
.rw-card:hover .rw-card__link span{transform:translateX(5px)}

/* --- Socios --- */
.partners{background:var(--azul-900);padding-block:var(--s-6)}
.partners__title{text-align:center;font-family:var(--ff-body);font-weight:600;letter-spacing:.2em;text-transform:uppercase;font-size:.78rem;position:relative;margin-bottom:2rem}
.partners__title span{background:var(--azul-900);padding:0 1.5rem;position:relative;z-index:1;color:rgba(255,255,255,.7)}
.partners__title::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(255,255,255,.14)}
.partners__ticker{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.partners__track{display:flex;align-items:center;gap:4.5rem;width:max-content;animation:ticker 32s linear infinite}
.partners:hover .partners__track{animation-play-state:paused}
.tlogo__img{height:40px;width:auto;max-width:150px;object-fit:contain;flex:none;filter:grayscale(1) opacity(.45);transition:filter .3s,opacity .3s}
.tlogo__img:hover{filter:grayscale(0) opacity(1);transform:translateY(-2px)}
@keyframes ticker{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.partners__track{animation:none;flex-wrap:wrap;justify-content:center;width:auto}}

/* --- Quiénes somos --- */
.welcome{padding-block:var(--s-10)}
.welcome__grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.svc-list{list-style:none;padding:0;margin:1.9rem 0;display:grid;grid-template-columns:1fr 1fr;gap:.9rem 1.6rem}
.svc-list li{position:relative;padding-left:1.9rem;font-weight:600;font-size:.95rem;color:var(--azul)}
.svc-list li::before{content:"";position:absolute;left:0;top:.12em;width:19px;height:19px;border-radius:50%;background:var(--lima) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23023047' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/11px no-repeat}
.welcome__media{position:relative;width:min(100%,440px);min-height:0;justify-self:center}
/* Variante ancha: foto horizontal 5:4 (dos socios) en la landing */
.welcome__media--wide{width:min(100%,560px)}
.welcome__img{border-radius:6px;object-fit:cover;object-position:50% 22%;box-shadow:var(--shadow)}
.welcome__img--main{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;object-position:center}
.welcome__img--sub{position:absolute;right:0;bottom:0;width:52%;aspect-ratio:4/3;border:8px solid var(--blanco)}
.welcome__accent{position:absolute;top:-18px;left:-18px;width:120px;height:120px;background:var(--lima);z-index:-1;border-radius:6px}
.welcome__accent-text{color:var(--azul);font-weight:600;border-left:3px solid var(--lima);padding-left:1rem;margin:1.4rem 0}
.bars{display:grid;gap:1.2rem;margin:1.8rem 0}
.bar__label{font-size:.82rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;display:block;margin-bottom:.45rem}
.bar__track{height:8px;background:var(--beige);border-radius:100px;overflow:hidden}
.bar__track i{display:block;height:100%;width:0;background:var(--azul);border-radius:100px;transition:width 1.2s var(--ease)}
/* --- Casos --- */
.cases{background:var(--gris-bg)}
.cases__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:3rem}
.case-card{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:420px;display:flex;align-items:flex-end;color:var(--blanco);isolation:isolate}
.case-card__img{position:absolute;inset:0;background-size:cover;background-position:center;z-index:-2;transition:transform .6s var(--ease)}
.case-card::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 30%,rgba(1,26,43,.92));z-index:-1}
.case-card:hover .case-card__img{transform:scale(1.08)}
.case-card__body{padding:2rem}
.case-card__tag{display:inline-block;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--azul);background:var(--lima);padding:.3rem .7rem;border-radius:6px;margin-bottom:.8rem}
.case-card__body h3{color:var(--blanco)}
.case-card__body p{max-width:28ch;margin:.45rem 0 0;color:rgba(255,255,255,.82);font-size:.88rem;line-height:1.45}

/* --- Tarjetas con icono (sustituyen a las fotos en la landing) --- */
.icon-card{position:relative;border-radius:var(--r-lg);background:var(--blanco);border:1px solid var(--linea);color:var(--azul);padding:2.1rem 1.9rem;min-height:280px;display:flex;flex-direction:column;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s}
.icon-card:hover{transform:translateY(-8px);box-shadow:var(--shadow);border-color:var(--beige)}
.icon-card__icon{width:58px;height:58px;display:grid;place-items:center;border-radius:14px;background:var(--beige);color:var(--azul);margin-bottom:1.2rem}
.icon-card__icon svg{width:27px;height:27px}
.icon-card__tag{display:inline-block;width:fit-content;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;padding:.28rem .65rem;border-radius:6px;background:var(--lima);color:var(--azul);margin-bottom:.7rem}
.icon-card h3{color:var(--azul);margin:0;font-size:1.18rem;line-height:1.2}
.icon-card p{margin:.45rem 0 0;color:var(--gris-txt);font-size:.88rem;line-height:1.5;max-width:26ch}
@media(prefers-reduced-motion:reduce){.icon-card{transition:none}}
@media(max-width:560px){.icon-card{min-height:auto}}

/* --- Misión CTA --- */
.mission-cta{position:relative;color:var(--blanco);text-align:center;overflow:hidden;padding-block:var(--s-10)}
.mission-cta__bg{position:absolute;inset:-15% 0;background:linear-gradient(rgba(0,0,0,.70),rgba(0,0,0,.80)),url('../fotos/DSC02095.jpg') center 38%/cover;background:linear-gradient(rgba(0,0,0,.70),rgba(0,0,0,.80)),image-set(url('../fotos/DSC02095.avif') type('image/avif'), url('../fotos/DSC02095.jpg') type('image/jpeg')) center 38%/cover;z-index:-1}
.mission-cta h2{font-family:var(--ff-title);color:var(--blanco);text-transform:uppercase;font-weight:500;font-size:clamp(2rem,4vw,3.2rem);margin-bottom:1.1rem}
.mission-cta__lead{max-width:640px;margin:0 auto 2.1rem;color:rgba(255,255,255,.82);font-size:clamp(1rem,1.5vw,1.15rem);line-height:1.55}
/* La foto de fondo es vertical: el 38% deja la cara centrada en la franja visible. */
.mission-cta__btn{margin-top:1.6rem}

/* --- FAQ --- */
.faq__grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;margin-top:3rem;align-items:start}
.accordion{display:grid;gap:1rem}
.acc-item{border:1px solid var(--linea);border-radius:var(--r);overflow:hidden;background:var(--blanco);transition:border-color .3s,box-shadow .3s}
.acc-item.open{border-color:var(--lima);box-shadow:var(--shadow)}
.acc-head{width:100%;display:flex;justify-content:space-between;align-items:center;gap:1rem;background:transparent;border:0;cursor:pointer;font-family:var(--ff-body);font-weight:700;font-size:1.05rem;text-align:left;padding:1.55rem 1.9rem;color:var(--azul)}
.acc-ico{position:relative;width:18px;height:18px;flex:none}
.acc-ico::before,.acc-ico::after{content:"";position:absolute;background:var(--lima)}
.acc-ico::before{top:8px;left:0;width:18px;height:2px}
.acc-ico::after{left:8px;top:0;width:2px;height:18px;transition:transform .3s}
.acc-item.open .acc-ico::after{transform:scaleY(0)}
.acc-body{max-height:0;overflow:hidden;transition:max-height .4s var(--ease)}
.acc-body p{padding:0 1.4rem 1.3rem;color:var(--gris-txt);margin:0}
.faq__img{width:100%;border-radius:var(--r);aspect-ratio:2/1;object-fit:cover;object-position:50% 26%}
.faq__bottom{display:grid;grid-template-columns:1fr auto;gap:1.5rem;align-items:center}
.ticks{list-style:none;padding:0;margin:0;display:grid;gap:.7rem}
.ticks li{position:relative;padding-left:2rem;font-size:.92rem}
.ticks li::before{content:"";position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;background:var(--lima) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23023047' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat}
.faq__badge{background:var(--lima);color:var(--azul);border-radius:var(--r);padding:1.6rem;text-align:center;display:grid;place-items:center;align-self:stretch}
.faq__badge-num{font-family:var(--ff-body);font-size:2.6rem;font-weight:800;line-height:1}

/* --- Testimonios --- */
.testimonials{background:var(--beige)}
.testimonials__grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:3rem;align-items:center}
.testimonials__head h2{margin:.4rem 0 1rem}
.testimonials__head p{color:var(--gris-txt)}
.testimonials__nav{display:flex;gap:.8rem;margin-top:1.6rem}
.testimonials__nav button{width:52px;height:52px;border-radius:50%;border:1px solid var(--azul);background:transparent;color:var(--azul);cursor:pointer;font-size:1.2rem;transition:.3s}
.testimonials__nav button:hover{background:var(--azul);color:var(--blanco)}
.testimonials__viewport{overflow:hidden}
.testimonials__track{display:flex;transition:transform .6s var(--ease)}
.tcard{position:relative;flex:0 0 100%;margin:0;background:var(--blanco);border-radius:var(--r);padding:2.4rem;box-shadow:var(--shadow)}
.tcard::before{content:"\201C";position:absolute;top:1rem;right:1.8rem;font-family:var(--ff-body);font-weight:700;font-size:4rem;line-height:1;color:rgba(2,48,71,.1)}
.tcard p{font-family:var(--ff-body);font-size:1.15rem;line-height:1.6;color:var(--azul);position:relative}
.faq__badge .fplus{font-family:var(--ff-body);font-weight:700}
.tcard footer{display:flex;flex-direction:column;margin-top:1.2rem}
.tcard footer strong{color:var(--azul)}
.tcard footer span{color:var(--gris-txt);font-size:.88rem}

/* --- Contadores --- */
.counters{background:var(--azul-900);color:var(--blanco)}
/* Se adapta sola al número de tarjetas y centra la última fila cuando queda
   incompleta, así nunca aparece un elemento suelto a la izquierda.
   No hay que tocar el CSS si cambia la cantidad de contadores. */
.card-grid--4{display:flex;flex-wrap:wrap;justify-content:center;gap:1.5rem;text-align:center}
.card-grid--4>*{flex:1 1 200px;max-width:340px}
.counter__icon{width:64px;height:64px;display:grid;place-items:center;margin:0 auto 1rem;border-radius:14px;background:rgba(255,255,255,.06);color:var(--lima)}
.counter__icon svg{width:30px;height:30px}
.counter__num{font-family:var(--ff-body);font-size:clamp(2.4rem,4vw,3.2rem);font-weight:800;color:var(--lima);display:block}
.counter__num::after{content:"+";font-family:var(--ff-body);font-weight:700;margin-left:.02em}
.counter p{color:rgba(255,255,255,.7);text-transform:uppercase;letter-spacing:.08em;font-size:.82rem;font-weight:600;margin:0}

/* --- Áreas (tabs) --- */
.areas__tabs{display:flex;justify-content:center;gap:.6rem;flex-wrap:wrap;margin-top:2.5rem}
.area-tab{border:1px solid var(--linea);background:var(--blanco);color:var(--azul);padding:.9rem 1.6rem;border-radius:100px;cursor:pointer;font-family:var(--ff-body);font-weight:700;font-size:.9rem;transition:.3s}
.area-tab.is-active{background:var(--azul);color:var(--blanco);border-color:var(--azul)}
.areas__panels{margin-top:2.5rem}
.area-panel{display:none}
.area-panel.is-active{display:block;animation:fadeUp .5s var(--ease)}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.area-panel__grid{display:block}
.area-panel__lead{max-width:62ch;margin:0 auto 2.4rem;text-align:center;color:var(--gris-txt);font-size:1.05rem}
.area-panel__feats{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem 3rem;margin-bottom:2.2rem}
.area-panel__feats .feat{margin:0}
.area-panel__ticks{border-top:1px solid var(--linea);padding-top:1.6rem}
.area-panel__ticks .ticks{grid-template-columns:repeat(4,1fr);gap:.8rem 1.4rem}
@media(max-width:960px){.area-panel__feats{grid-template-columns:1fr}.area-panel__ticks .ticks{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.area-panel__ticks .ticks{grid-template-columns:1fr}}
.feat{display:flex;gap:1rem;margin-bottom:1.6rem}
.feat__icon{width:44px;height:44px;flex:none;display:grid;place-items:center;border-radius:10px;background:rgba(221,241,73,.25);color:var(--azul)}
.feat__icon svg{width:22px;height:22px}
.feat h3{font-size:1.1rem;margin-bottom:.3rem}
.feat p{color:var(--gris-txt);font-size:.92rem;margin:0}
.area-panel__extra p{color:var(--gris-txt)}
.ticks--sm li{font-size:.88rem}
.area-panel__img{border-radius:var(--r);min-height:320px;background-size:cover;background-position:center}

/* --- Novedades --- */
.news__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:3rem;text-align:left}
.post{background:var(--blanco);border:1px solid var(--linea);border-radius:var(--r-lg);overflow:hidden;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.post:hover{transform:translateY(-8px);box-shadow:var(--shadow)}
.post__img{aspect-ratio:16/11;background-size:cover;background-position:center;position:relative}
/* Blog en el home (#latestPosts): la imagen es un enlace, y un artículo sin portada lleva un fondo neutro */
.news--blog{background:var(--gris-bg)}
/* Con 1 o 2 artículos las tarjetas quedan centradas en vez de pegadas a la izquierda */
.news--blog .news__grid{grid-template-columns:repeat(auto-fit,minmax(260px,370px));justify-content:center}
@media(max-width:960px){.news--blog .news__grid{grid-template-columns:1fr}}
a.post__img{display:block}
.post__img--empty{background:linear-gradient(135deg,var(--beige),#f3eee8)}
.post__body h3 a:hover{text-decoration:underline;text-decoration-color:var(--lima);text-underline-offset:4px}
/* --- Cuadrícula de Instagram ---
   Replica la del perfil: baldosas 3/4 (Instagram dejó de usar cuadradas), casi
   pegadas y sin texto debajo. Tres columnas en TODOS los anchos, como hace la
   app en móvil. El ancho máximo deja las baldosas a ~318px, igual que el perfil. */
.ig-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;max-width:960px;margin:3rem auto 0}
.ig-tile{position:relative;display:block;overflow:hidden;background:var(--azul-900);text-decoration:none}
.ig-tile__img{display:block;aspect-ratio:3/4;background-size:cover;background-position:top center;transition:transform .5s var(--ease)}
.ig-tile:hover .ig-tile__img{transform:scale(1.04)}
.ig-tile__tipo{position:absolute;top:.55rem;right:.55rem;width:20px;height:20px;color:#fff;filter:drop-shadow(0 1px 3px rgba(0,0,0,.55));pointer-events:none}
.ig-tile__tipo svg{width:20px;height:20px;display:block}
.ig-tile__velo{position:absolute;inset:0;display:flex;align-items:flex-end;padding:.9rem;background:linear-gradient(to top,rgba(1,26,43,.88) 0%,rgba(1,26,43,.35) 45%,transparent 70%);color:#fff;font-weight:600;font-size:.85rem;line-height:1.35;opacity:0;transition:opacity .35s var(--ease)}
.ig-tile:hover .ig-tile__velo,.ig-tile:focus-visible .ig-tile__velo{opacity:1}
.ig-tile:focus-visible{outline:3px solid var(--lima);outline-offset:3px}
@media(max-width:700px){.ig-grid{gap:1px;margin-top:2rem}.ig-tile__tipo,.ig-tile__tipo svg{width:15px;height:15px}.ig-tile__velo{display:none}}
.news__cta{margin-top:2.5rem}
.news__cta-btn{display:inline-flex;align-items:center;gap:.55rem}
.news__cta-ico{display:inline-flex;width:18px;height:18px}
.news__cta-ico svg{width:18px;height:18px}
.post__date{position:absolute;left:1rem;bottom:1rem;background:var(--lima);color:var(--azul);font-weight:700;font-size:.78rem;padding:.35rem .7rem;border-radius:6px}
.post__body{padding:1.6rem}
.post__meta{font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;color:var(--gris-txt);font-weight:600}
.post__body h3{font-size:1.12rem;margin:.6rem 0 1rem;line-height:1.3}
.post__link{color:var(--azul);font-weight:700;font-size:.82rem;text-transform:uppercase;letter-spacing:.06em;display:inline-flex;gap:.4rem}
.post__link span{color:var(--lima)}

/* --- CTA final --- */
.cta-final{background:var(--beige);color:var(--azul)}
.cta-final__row{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding-block:var(--s-6)}
/* Salto de línea solo en pantallas anchas */
@media(max-width:600px){.br-desk{display:none}}
.cta-final h2{margin:0;color:var(--azul);text-transform:uppercase;font-weight:600;font-size:clamp(1.35rem,2.4vw,2.1rem)}

/* --- Footer --- */
.site-footer{background:var(--gris-bg);color:var(--gris-txt)}
.site-footer__grid{grid-template-columns:1.6fr 1fr 1.6fr}
.site-footer__contact{list-style:none;padding:0;margin:1.4rem 0 0;display:grid;gap:.9rem}
.site-footer__contact li{display:flex;align-items:center;gap:.8rem}
.fc-ico{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:50%;background:rgba(221,241,73,.35);color:var(--azul)}
.fc-ico svg{width:17px;height:17px}
.site-footer__links{display:grid;gap:.3rem}
.news-card{background:var(--blanco);border:1px solid var(--linea);border-radius:var(--r);padding:1.6rem}
.news-card p{margin-bottom:1rem;font-size:.92rem}
.news-card__form{display:flex;gap:.5rem;flex-wrap:wrap}
.news-status{flex-basis:100%;margin:.4rem 0 0;font-size:.85rem;color:#9f1239}
.news-status[hidden]{display:none}
.news-status.is-ok{color:#166534}
.news-card__form input{flex:1;min-width:150px;background:var(--blanco);border:1px solid var(--linea);border-radius:8px;padding:.8rem 1rem;font-family:var(--ff-body);color:var(--azul)}
.news-card__form .btn{border-radius:8px;padding:.8rem 1.3rem}
.site-footer__bottom .site-footer__social{display:flex;gap:.8rem}
.site-footer__bottom .site-footer__social a{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:rgba(2,48,71,.08);color:var(--azul);transition:.3s}
.site-footer__bottom .site-footer__social a:hover{background:var(--lima);color:var(--azul);transform:translateY(-2px)}
.site-footer__bottom .site-footer__social svg{width:16px;height:16px}

/* --- Responsive secciones --- */
@media(max-width:960px){
  .cases__grid,.news__grid,.area-panel__grid,.welcome__grid,.faq__grid,.testimonials__grid{grid-template-columns:1fr}
  .site-footer__grid{grid-template-columns:1fr;gap:2rem}
  .site-footer__bottom{flex-direction:column;gap:.5rem;text-align:center}
  .welcome__media{min-height:auto;margin-bottom:2rem}
  .welcome__img--main{width:100%;height:auto;aspect-ratio:auto}
  .welcome__img--sub{position:relative;width:60%;margin:-3rem 0 0 auto}
  .cta-final__row{flex-direction:column;text-align:center}
  .partners__track{justify-content:center}
  .faq__bottom{grid-template-columns:1fr}
}

/* --- Grilla de 4 servicios (sección "Nuestros servicios") --- */
.cases__grid--4{grid-template-columns:repeat(4,1fr)}
.cases__grid--4 .case-card{min-height:360px}
.cases__grid--4 .case-card__body h3{font-size:1.2rem;line-height:1.2}
@media(max-width:960px){.cases__grid--4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.cases__grid--4{grid-template-columns:1fr}}

/* --- Testimonios: carrusel doble full-bleed --- */
.testimonials{overflow:hidden}
/* Grilla de reseñas: se muestran las reales una sola vez, sin repetir. */
.treviews{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.4rem;margin-top:3rem;align-items:stretch}
.treviews .treview{width:auto;height:100%}
/* Los textos tienen largos muy distintos: la firma se ancla abajo para que
   los nombres queden alineados entre tarjetas, no flotando tras el texto. */
.treviews .treview figcaption{margin-top:auto}
.treview{flex:none;margin:0;width:min(86vw,360px);background:var(--blanco);border-radius:var(--r);padding:1.7rem 1.9rem;box-shadow:0 8px 24px rgba(2,48,71,.09);display:flex;flex-direction:column;gap:.7rem}
.treview__stars{color:#f5b301;letter-spacing:2px;font-size:.95rem}
.treview blockquote{margin:0;font-size:1rem;line-height:1.55;color:var(--azul)}
.treview figcaption{display:flex;align-items:center;gap:.8rem;margin-top:.4rem}
.treview__avatar{width:44px;height:44px;flex:none;border-radius:50%;background:var(--lima);color:var(--azul);display:grid;place-items:center;font-family:var(--ff-body);font-weight:800}
.treview__who strong{display:block;color:var(--azul);font-size:.95rem}
.treview__who small{color:var(--gris-txt);font-size:.82rem}

/* ===== Páginas interiores ===== */
/* Banner interior */
.page-hero{position:relative;overflow:hidden;background-color:var(--beige);background-image:url('../fotos/analisis-financiero.avif');background-size:cover;background-position:center;background-repeat:no-repeat;color:var(--azul);text-align:center;padding-block:12rem var(--s-8)}
.page-hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,rgba(225,216,206,.90),rgba(225,216,206,.78) 60%,rgba(225,216,206,.88))}
.page-hero .container{position:relative;z-index:1}
.page-hero .eyebrow{color:var(--azul)}
.page-hero h1{font-family:var(--ff-title);color:var(--azul);text-transform:uppercase;font-weight:500;font-size:clamp(1.75rem,5vw,4rem);margin:.3rem 0}
/* Hero interior con foto de fondo */
.page-hero--photo{background-size:cover;background-position:center;background-repeat:no-repeat}
.crumbs{margin-top:.9rem;display:flex;gap:.6rem;justify-content:center;font-size:.78rem;color:rgba(2,48,71,.65);text-transform:uppercase;letter-spacing:.14em;font-weight:600}
.crumbs a{color:var(--azul)}

/* Misión y visión */
.mv-wrap{background:var(--gris-bg)}
.mv{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:3rem}
.mv-card{background:var(--blanco);border-radius:var(--r);padding:2.4rem;border-top:4px solid var(--lima);box-shadow:0 10px 30px rgba(2,48,71,.05)}
.mv-card__icon{width:56px;height:56px;display:grid;place-items:center;border-radius:14px;background:rgba(221,241,73,.25);color:var(--azul);margin-bottom:1.2rem}
.mv-card__icon svg{width:28px;height:28px}
.mv-card h3{margin-bottom:.6rem}
.mv-card p{color:var(--gris-txt);margin:0}

/* Equipo */
.team__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;margin-top:3rem}
.member{margin:0;background:var(--blanco);border-radius:var(--r);overflow:hidden;box-shadow:0 10px 30px rgba(2,48,71,.06);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.member:hover{transform:translateY(-8px);box-shadow:var(--shadow)}
.member__photo{aspect-ratio:3/4;overflow:hidden}
.member__photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.member:hover .member__photo img{transform:scale(1.05)}
.member figcaption{padding:1.2rem 1.4rem;text-align:center}
.member figcaption strong{display:block;color:var(--azul);font-size:1.05rem;margin-bottom:.15rem}
.member figcaption span{color:var(--gris-txt);font-size:.85rem}

@media(max-width:960px){
  .mv{grid-template-columns:1fr}
  .team__grid{grid-template-columns:repeat(2,1fr)}
  .page-hero{padding-block:9rem var(--s-6)}
}
@media(max-width:560px){.team__grid{grid-template-columns:repeat(2,1fr);gap:1rem}}

/* Nuestro enfoque (empresa) */
.approach__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:3.5rem;align-items:center}
.approach__body h2{margin-bottom:1.2rem;font-size:clamp(1.35rem,2.6vw,2.5rem)}
/* Dos líneas en todo el rango. Techo 2.5rem: en escritorio va en una columna de ~600px
   y a 3rem "Especialistas por área," no cabía. Suelo 1.35rem: por debajo de 430px de
   ventana la fuente ya no encoge sola y el contenedor sí, así que con 1.7rem volvía a
   partirse en 3 líneas en el iPhone 15 y en Android típico. */
.approach__body p{color:var(--gris-txt)}
.approach__media{display:grid;gap:1.2rem}
.approach__media img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r);box-shadow:0 12px 34px rgba(2,48,71,.08)}
/* Encuadre de retratos de equipo hacia las caras */
.member__photo img{object-position:50% 12%}
@media(max-width:960px){.approach__grid{grid-template-columns:1fr;gap:2rem}}
/* Empresa: dos fotos verticales del equipo, lado a lado (recorte 3:4 sin cortar caras) */
/* Mitad y mitad con menos separación: el texto conserva ~580px porque "Especialistas por área," mide 567px a 40px y debe seguir en 2 líneas */
.approach__grid--duo{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2rem}
.approach__media--duo{grid-template-columns:1fr 1fr;align-items:start}
.approach__media--duo img{height:auto;aspect-ratio:2/3;object-position:50% 28%}
.approach__media--duo img:last-child{margin-top:2.4rem}
/* Empresa: fachada vertical en "¿Quién es?" (va después del responsive de .welcome para ganarle) */
.welcome__img--portrait{aspect-ratio:4/5;object-fit:cover;object-position:50% 62%}
@media(max-width:960px){.approach__grid--duo{grid-template-columns:1fr;gap:2rem}.welcome__img--main.welcome__img--portrait{aspect-ratio:4/3;object-position:50% 58%}.approach__media--duo{gap:.8rem}.approach__media--duo img:last-child{margin-top:1.4rem}}

/* Ventajas / ¿Por qué Kronoz? (home) */
.advantages{background:var(--gris-bg)}
.advantages__grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:1rem 3.5rem;align-items:start}
.advantages__eyebrow{grid-column:2;grid-row:1;margin:0}
.advantages__media{grid-column:1;grid-row:2;position:sticky;top:116px;align-self:start;min-width:0}
.advantages__body{grid-column:2;grid-row:2;min-width:0}
.advantages__media img{width:100%;height:auto;border-radius:var(--r);object-fit:cover;object-position:50% 30%;aspect-ratio:5/4;box-shadow:var(--shadow)}
.advantages__media .adv-video{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;border:0;border-radius:var(--r);background:transparent;box-shadow:none}
/* Slideshow Mario <-> Emmanuel. Mario va primero y queda SIEMPRE en el flujo:
   define la altura del bloque y garantiza que nunca haya un frame en blanco.
   Emmanuel se superpone y aparece/desaparece con fundido. */
.adv-slideshow{position:relative}
.adv-slide{display:block}
.adv-slide--2{position:absolute;inset:0;opacity:0;animation:advFade 10s ease-in-out infinite}
.adv-slide--2 img{height:100%;aspect-ratio:auto}
@keyframes advFade{0%,42%{opacity:0}50%,92%{opacity:1}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.adv-slide--2{animation:none;opacity:0}}
.section.advantages h2{margin-bottom:1.4rem;font-size:clamp(1.5rem,2.55vw,2.1rem);white-space:nowrap}
.adv-list{list-style:none;padding:0;margin:0;display:grid;gap:1rem}
.adv-list li{position:relative;padding-left:2.1rem;color:var(--gris-txt);font-size:.95rem;line-height:1.5}
.adv-list li::before{content:"";position:absolute;left:0;top:.12em;width:20px;height:20px;border-radius:50%;background:var(--lima) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23023047' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat}
.adv-list strong{color:var(--azul)}
@media(max-width:960px){
  .advantages__grid{grid-template-columns:minmax(0,1fr);gap:1.5rem}
  .advantages__eyebrow{grid-column:1;grid-row:1}
  .advantages__body{display:contents}
  .section.advantages h2{grid-column:1;grid-row:2;margin:0;font-size:clamp(1.125rem,5vw,2.1rem)}
  .advantages__media{grid-column:1;grid-row:3;position:static}
  .advantages .adv-list{grid-column:1;grid-row:4}
  .advantages__media img{aspect-ratio:5/4}
}

/* ===== Contacto ===== */
.contact__grid{display:grid;grid-template-columns:1fr 1.15fr;gap:3.5rem;align-items:start}
.contact__info h2{margin-bottom:1rem}
.contact__info p{color:var(--gris-txt)}
.contact__list{list-style:none;padding:0;margin:1.8rem 0 0;display:grid;gap:1.1rem}
.contact__list li{display:flex;align-items:center;gap:.9rem}
.ci-ico{width:46px;height:46px;flex:none;display:grid;place-items:center;border-radius:12px;background:rgba(221,241,73,.25);color:var(--azul)}
.ci-ico svg{width:20px;height:20px}
.contact__list strong{display:block;color:var(--azul);font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.1rem}
.contact__list a,.contact__list div span{color:var(--gris-txt);font-weight:600}
.contact__list a:hover{color:var(--azul)}
/* Ítem de WhatsApp en contacto: vira al verde de WhatsApp al pasar el cursor,
   al enfocar con teclado y al hacer clic. */
.ci-wa .ci-ico,.ci-wa a{transition:background .3s var(--ease),color .3s var(--ease)}
.ci-wa:hover .ci-ico,.ci-wa:focus-within .ci-ico{background:rgba(37,211,102,.18);color:#25d366}
.ci-wa a:hover,.ci-wa a:focus-visible{color:#25d366}
.ci-wa a:active{color:#128c7e}
@media(prefers-reduced-motion:reduce){.ci-wa .ci-ico,.ci-wa a{transition:none}}
.contact__socials{display:flex;gap:.8rem;margin-top:1.6rem}
.contact__socials a{width:46px;height:46px;display:grid;place-items:center;border-radius:50%;background:var(--azul);color:var(--blanco);transition:.3s}
.contact__socials a:hover{background:var(--lima);color:var(--azul);transform:translateY(-2px)}
.contact__socials svg{width:18px;height:18px}
.contact__form{background:var(--gris-bg);border-radius:var(--r-lg);padding:2.6rem;display:grid;gap:1.1rem}
.contact__form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.contact__form label{display:grid;gap:.45rem;font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--azul)}
.contact__form input,.contact__form textarea,.contact__form select{font-family:var(--ff-body);font-size:1rem;font-weight:400;text-transform:none;letter-spacing:normal;padding:.95rem 1.1rem;border:1px solid var(--linea);border-radius:10px;background:var(--blanco);color:var(--azul);width:100%}
.contact__form textarea{resize:vertical}
.contact__form select{appearance:none;-webkit-appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23023047' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;background-size:16px;padding-right:2.6rem}
.contact__form input:focus,.contact__form textarea:focus,.contact__form select:focus{outline:2px solid var(--lima);border-color:var(--lima)}
.contact__form .btn{justify-self:start;margin-top:.3rem}
/* Dentro del formulario los CTA van en azul; el botón principal del hero
   (.hero__btn) queda fuera de este selector y conserva el lima. */
.contact__form.step-form .btn--lima{background:var(--azul);color:var(--blanco)}
.contact__form.step-form .btn--lima:hover{background:var(--negro);color:var(--blanco)}

/* --- Diagnóstico persuasivo en tres pasos --- */
.contact__form.step-form{display:block;overflow:hidden;color:var(--azul)}
.step-form__header{display:grid;gap:.48rem;padding:0 3rem 1.15rem 0;border-bottom:1px solid rgba(2,48,71,.12)}
.hero-form .step-form__header{padding-right:0}
.step-form__eyebrow{color:var(--azul);font-size:.64rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.step-form__header h2{max-width:680px;margin:0;color:var(--azul);font-family:var(--ff-body);font-size:clamp(1.08rem,1.5vw,1.35rem);font-weight:750;line-height:1.25}
.step-form__header h2 small{display:block;margin-top:.12rem;color:var(--gris-txt);font-family:var(--ff-body);font-size:.68em;font-weight:500}
.step-form__steps{display:grid;grid-template-columns:repeat(3,1fr);gap:0;padding:0;margin:.65rem 0 .1rem;list-style:none}
.step-form__steps li{position:relative;display:grid;grid-template-columns:1fr;justify-items:center;gap:.38rem;padding:0 .35rem;border:0;background:transparent;color:var(--gris-txt);font-size:.68rem;font-weight:750;line-height:1.15;text-align:center;transition:color .3s}
.step-form__steps li:not(:last-child)::after{content:"";position:absolute;z-index:0;top:20px;left:calc(50% + 23px);right:calc(-50% + 23px);height:2px;background:rgba(2,48,71,.16);transition:background .3s}
.step-form__steps b{position:relative;z-index:1;display:grid;place-items:center;width:42px;height:42px;border:2px solid rgba(2,48,71,.18);border-radius:50%;background:var(--gris-bg);color:var(--gris-txt);font-size:.82rem;transition:border-color .3s,background .3s,color .3s,box-shadow .3s}
.step-form__steps li.is-active{color:var(--azul)}
.step-form__steps li.is-active b{border-color:var(--azul);background:var(--azul);color:var(--lima);box-shadow:0 0 0 5px rgba(2,48,71,.08)}
.step-form__steps li.is-complete{color:var(--azul)}
.step-form__steps li.is-complete b{border-color:var(--lima);background:var(--lima);color:var(--azul)}
.step-form__steps li.is-complete::after{background:var(--lima)}
.step-form__progress-row{display:flex;justify-content:center;margin-top:.15rem}
.step-form__progress-label{padding:0;background:transparent;color:var(--gris-txt);font-size:.62rem;font-weight:750;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.step-form__progress{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.step-form__progress i{display:block;width:33.333%;height:100%;border-radius:inherit;background:var(--lima);transition:width .4s var(--ease)}
.form-step{display:grid;gap:.9rem;padding-top:1.25rem}
.form-step[hidden]{display:none}
.form-step.is-active{animation:stepIn .35s var(--ease)}
.step-form__question{margin:0;color:var(--azul);font-family:var(--ff-body);font-size:.86rem;font-weight:800;line-height:1.3;letter-spacing:.025em}
.step-form__question small{font-size:.88em;font-weight:500;color:var(--gris-txt)}
.step-form__question:focus{outline:none}
.choice-group{display:grid;gap:.6rem}
.choice-group+.choice-group{margin-top:.25rem;padding-top:.9rem;border-top:1px solid rgba(2,48,71,.1)}
.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}
.contact__form.step-form .choice-card{position:relative;display:flex;align-items:center;gap:.65rem;min-height:48px;margin:0;padding:.68rem .8rem;border:1px solid rgba(2,48,71,.14);border-radius:10px;background:var(--blanco);color:var(--azul);font-size:.74rem;font-weight:650;line-height:1.25;letter-spacing:0;text-transform:none;cursor:pointer;transition:border-color .2s,background .2s,box-shadow .2s,transform .2s}
.contact__form.step-form .choice-card:hover{border-color:rgba(2,48,71,.42);transform:translateY(-1px)}
.contact__form.step-form .choice-card:has(input:checked){border-color:var(--azul);background:rgba(221,241,73,.22);box-shadow:0 0 0 1px var(--azul)}
.contact__form.step-form .choice-card:has(input:focus-visible){outline:3px solid rgba(221,241,73,.8);outline-offset:2px}
.contact__form.step-form .choice-card input{position:absolute;width:1px;height:1px;min-height:0;margin:0;padding:0;border:0;opacity:0;pointer-events:none}
.choice-card__marker{position:relative;width:15px;height:15px;flex:none;border:1.5px solid rgba(2,48,71,.45);border-radius:50%;background:var(--blanco)}
.choice-card input:checked+.choice-card__marker{border-color:var(--azul);background:var(--azul)}
.choice-card input:checked+.choice-card__marker::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--lima)}
.step-form__contact{display:grid;gap:.72rem;padding-top:.2rem}
.contact__form.step-form .field-label{display:grid;gap:.36rem;margin:0;color:var(--azul);font-size:.67rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.contact__form.step-form .field-label input{min-height:46px;padding:.72rem .88rem;border-radius:9px;font-size:.84rem}
.step-form__actions{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-top:.15rem}
.step-form__actions--end{justify-content:flex-end}
.step-form__actions--submit{align-items:stretch}
.contact__form.step-form .step-form__actions .btn{justify-content:center;margin:0;padding:.82rem 1.4rem;font-size:.76rem}
.step-form__back{align-self:center;padding:.6rem 0;border:0;background:transparent;color:var(--gris-txt);font-family:var(--ff-body);font-size:.73rem;font-weight:700;cursor:pointer;transition:color .2s}
.step-form__back:hover{color:var(--azul)}
.step-form__trust{display:flex;align-items:center;justify-content:flex-end;gap:.38rem;margin:.05rem 0 0;color:var(--gris-txt);font-size:.61rem;line-height:1.3}
.step-form__trust span{display:grid;place-items:center;width:15px;height:15px;border-radius:50%;background:var(--lima);color:var(--azul);font-size:.58rem;font-weight:900}
@keyframes stepIn{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.form-step.is-active{animation:none}.step-form__progress i{transition:none}}
@media(max-width:480px){
  .step-form__header{padding-right:2.4rem}
  .hero-form .step-form__header{padding-right:0}
  .step-form__steps{gap:0}
  .step-form__steps li{gap:.28rem;padding:0 .15rem}
  .step-form__steps b{width:34px;height:34px}
  .step-form__steps li:not(:last-child)::after{top:16px;left:calc(50% + 19px);right:calc(-50% + 19px)}
  .choice-grid{grid-template-columns:1fr}
  .step-form__actions--submit{flex-direction:column-reverse}
  .contact__form.step-form .step-form__actions--submit .btn{width:100%}
  .step-form__trust{justify-content:center;text-align:center}
}

/* Ubicaciones (mapas) */
.locations{background:var(--gris-bg)}
.locations__grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:3rem}
.office{background:var(--blanco);border-radius:var(--r);overflow:hidden;box-shadow:0 10px 30px rgba(2,48,71,.06);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.office:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.office__map{aspect-ratio:16/10;background:var(--azul-900)}
.office__map iframe{width:100%;height:100%;border:0;display:block;filter:grayscale(.2) contrast(1.05)}
.office__body{padding:1.8rem 2rem}
.office__body h3{margin-bottom:.5rem}
.office__body p{color:var(--gris-txt);margin:0 0 .6rem}
.office__body a{color:var(--azul);border-bottom:2px solid var(--lima)}
@media(max-width:900px){.contact__grid,.locations__grid{grid-template-columns:1fr}.contact__form .form-row{grid-template-columns:1fr}}

/* ===== Página Servicios ===== */
.services-page__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:3rem}
.svc-card{display:flex;flex-direction:column;background:var(--blanco);border:1px solid var(--linea);border-radius:var(--r);padding:2.4rem 2rem;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s}
.svc-card:hover{transform:translateY(-8px);box-shadow:var(--shadow);border-color:var(--lima)}
.svc-card__icon{width:60px;height:60px;display:grid;place-items:center;border-radius:14px;background:var(--azul);color:var(--lima);margin-bottom:1.4rem;transition:background .4s,color .4s}
.svc-card:hover .svc-card__icon{background:var(--lima);color:var(--azul)}
.svc-card__icon svg{width:28px;height:28px}
.svc-card h3{margin-bottom:.7rem}
.svc-card p{color:var(--gris-txt);font-size:.95rem;flex:1;margin:0}
.svc-card__link{color:var(--azul);font-weight:700;font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;display:inline-flex;gap:.4rem;align-items:center;margin-top:1.3rem;align-self:flex-start}
.svc-card__link span{color:var(--lima);transition:transform .3s}
.svc-card:hover .svc-card__link span{transform:translateX(4px)}
.svc-card--cta{background:var(--azul);color:var(--blanco);border-color:var(--azul)}
.svc-card--cta .svc-card__icon{background:rgba(221,241,73,.16);color:var(--lima)}
.svc-card--cta:hover .svc-card__icon{background:var(--lima);color:var(--azul)}
.svc-card--cta h3{color:var(--blanco)}
.svc-card--cta p{color:rgba(255,255,255,.75)}
.svc-card--cta .svc-card__link{color:var(--lima)}
/* Cómo trabajamos */
.process-wrap{background:var(--gris-bg)}
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;margin-top:3rem}
.step{padding:2rem;background:var(--blanco);border-radius:var(--r);border-top:4px solid var(--lima);box-shadow:0 10px 30px rgba(2,48,71,.05)}
.step__num{font-family:var(--ff-body);font-weight:800;font-size:2rem;color:var(--lima);display:block;margin-bottom:.3rem}
.step h3{margin-bottom:.4rem}
.step p{color:var(--gris-txt);margin:0;font-size:.92rem}
/* --- Casos de éxito (casos-de-exito.html) --- */
.success-page{background:var(--gris-bg)}
.success-page .text-center h2{max-width:min(94%,960px)}
.success-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:3rem}
.success-card{display:flex;flex-direction:column;background:var(--blanco);border:1px solid var(--linea);border-radius:var(--r);padding:2rem 1.8rem;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s}
.success-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--lima)}
.success-card__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.3rem}
.success-card__icon{width:52px;height:52px;display:grid;place-items:center;border-radius:12px;background:var(--gris-bg);color:var(--azul);transition:background .4s}
.success-card__icon svg{width:24px;height:24px}
.success-card:hover .success-card__icon{background:var(--lima)}
.success-card__num{font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gris-txt)}
.success-card h3{font-size:1.15rem;line-height:1.3;margin-bottom:.8rem}
.success-card p{color:var(--gris-txt);font-size:.92rem;line-height:1.6;margin:0 0 .7rem}
.success-card .success-card__result{margin:auto 0 0;padding:1rem 1rem 1rem 2.6rem;position:relative;background:rgba(221,241,73,.16);border-radius:10px;color:var(--azul);font-size:.9rem}
.success-card__result::before{content:"";position:absolute;left:.9rem;top:1.05rem;width:18px;height:18px;border-radius:50%;background:var(--lima) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23023047' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/10px no-repeat}
/* margin-top:auto empuja el resultado al fondo; este espacio lo separa del último párrafo */
.success-card p:nth-last-child(2){margin-bottom:1.2rem}
@media(prefers-reduced-motion:reduce){.success-card{transition:none}}
@media(max-width:960px){.success-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.success-grid{grid-template-columns:1fr}}

@media(max-width:960px){.services-page__grid{grid-template-columns:repeat(2,1fr)}.process{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.services-page__grid{grid-template-columns:1fr}.process{grid-template-columns:1fr}}

/* ===== Detalle de servicio ===== */
.service-detail__grid{display:grid;grid-template-columns:320px 1fr;gap:3rem;align-items:start}
.svc-sidebar{position:sticky;top:112px;display:grid;gap:1.5rem}
.svc-sidebar__box{background:var(--gris-bg);border-radius:var(--r);padding:1.8rem}
.svc-sidebar__box h3{font-size:1.1rem;margin-bottom:1.1rem}
.svc-nav{list-style:none;padding:0;margin:0;display:grid;gap:.5rem}
.svc-nav a{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.9rem 1.1rem;border-radius:10px;background:var(--blanco);color:var(--azul);font-weight:600;font-size:.9rem;border:1px solid var(--linea);transition:.3s}
.svc-nav a::after{content:"\2192";color:var(--lima);transition:transform .3s}
.svc-nav a:hover,.svc-nav a[aria-current]{background:var(--azul);color:var(--blanco);border-color:var(--azul)}
.svc-nav a:hover::after,.svc-nav a[aria-current]::after{transform:translateX(3px)}
.svc-help{background:var(--azul);color:var(--blanco);border-radius:var(--r);padding:2rem;text-align:center}
.svc-help__icon{width:56px;height:56px;display:grid;place-items:center;margin:0 auto 1rem;border-radius:50%;background:var(--lima);color:var(--azul)}
.svc-help__icon svg{width:26px;height:26px}
.svc-help h3{color:var(--blanco);margin-bottom:.5rem}
.svc-help p{color:rgba(255,255,255,.75);font-size:.92rem;margin-bottom:1.3rem}
.svc-help .btn{width:100%;justify-content:center;border:2px solid var(--lima)}
.svc-help .btn:hover{background:transparent;color:var(--lima);border-color:var(--lima);transform:translateY(-2px)}
.svc-help__phone{display:block;margin-top:1rem;font-weight:700;color:var(--lima)}
.svc-content h2{margin:0 0 1rem;text-transform:none}
.svc-content h3{margin:2rem 0 .8rem;color:var(--azul)}
.svc-content p{color:var(--gris-txt);line-height:1.7}
.svc-content__sub{margin:1.6rem 0 1rem}
.svc-content__list{margin:1rem 0 0}
.svc-content__list li{margin-bottom:.9rem;color:var(--gris-txt)}
.svc-content__list strong{color:var(--azul)}
.svc-content__lead{font-family:var(--ff-body);font-weight:700;font-size:1.2rem;color:var(--azul);margin-top:1.6rem}
@media(max-width:960px){.service-detail__grid{grid-template-columns:1fr}.svc-sidebar{position:static;order:2;grid-template-columns:1fr 1fr}}
@media(max-width:640px){.svc-sidebar{grid-template-columns:1fr}}

/* Contadores: tile de icono sobre negro */
.counters .counter__icon{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.09);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 0 24px rgba(221,241,73,.10)}
.search-results{list-style:none;margin:1.2rem auto 0;padding:0;width:min(100% - 2rem,640px);max-height:50vh;overflow:auto}
.search-results li+li{margin-top:.5rem}
.search-results a{display:block;padding:.9rem 1.1rem;border-radius:12px;background:rgba(255,255,255,.08);color:var(--blanco);text-decoration:none}
.search-results a:hover,.search-results a:focus-visible{background:rgba(255,255,255,.18)}
.search-results strong{display:block;font-weight:600}
.search-results span{display:block;margin-top:.2rem;font-size:.85rem;color:var(--beige);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.search-results__empty{padding:.9rem 1.1rem;opacity:.8}
.search-overlay{flex-direction:column}
