/* =====================================================================
   REGEN SpA — regen360.cl
   Hoja de estilos de producción · Jake Mate, Inteligencia Digital
   Base: Manual de Marca Regen (Montserrat · teal / sage / lime)
   Fixes del audit UX/UI (10 sept 2026) marcados con [P0-n] [P1-n] [P2-n]
   ===================================================================== */

/* ---------- Tipografía institucional (self-hosted) ---------- */
@font-face{font-family:"Montserrat";font-style:normal;font-weight:300 900;font-display:swap;src:url("../fonts/montserrat-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:"Montserrat";font-style:normal;font-weight:300 900;font-display:swap;src:url("../fonts/montserrat-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}
@font-face{font-family:"Montserrat";font-style:italic;font-weight:300 900;font-display:swap;src:url("../fonts/montserrat-italic-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:"Montserrat";font-style:italic;font-weight:300 900;font-display:swap;src:url("../fonts/montserrat-italic-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}

/* ---------- Tokens ---------- */
:root{
  /* Tintas corporativas (Manual de Marca p.11) */
  --regen-teal:#35858E; --regen-sage:#7EA88C; --regen-lime:#C2D199;

  --teal-50:#F5F9FA;--teal-100:#EAF3F4;--teal-200:#D0E4E7;--teal-300:#A9D0D4;--teal-400:#79B6BC;--teal-500:#4C9AA2;--teal-600:#35858E;--teal-700:#2A7078;--teal-800:#1D5A61;--teal-900:#12363B;
  --sage-100:#EFF5F1;--sage-200:#DBE8E0;--sage-300:#BDD5C4;--sage-400:#9CBFA7;--sage-500:#7EA88C;--sage-600:#5E8B6D;--sage-700:#456B51;
  --lime-100:#F4F7EB;--lime-200:#E7EDD4;--lime-300:#D5DFB7;--lime-400:#C2D199;--lime-500:#ABBC7D;--lime-600:#93A664;--lime-700:#71824A;--lime-800:#5E6B3A;
  --neutral-0:#FFFFFF;--neutral-50:#F7F9F9;--neutral-100:#EEF2F2;--neutral-200:#DCE4E4;--neutral-300:#BCC9CA;--neutral-400:#93A5A7;--neutral-500:#6D8184;--neutral-600:#4A5F62;--neutral-700:#2E4144;--neutral-800:#1B2A2C;--neutral-900:#0F1A1C;
  --status-success:#2F8F5B;--status-success-bg:#E8F4EC;--status-danger:#B23A31;--status-danger-bg:#FAEBE9;

  /* Semánticos */
  --text-strong:var(--neutral-900);
  --text-body:var(--neutral-700);
  --text-muted:var(--neutral-600);      /* [P0-4+] antes neutral-500 = 4.10:1 (no AA). Ahora 6.76:1 */
  --text-inverse:var(--neutral-0);
  --text-brand:var(--teal-700);
  --text-link:var(--teal-700);
  --text-link-hover:var(--teal-800);

  --surface-page:var(--neutral-0);
  --surface-card:var(--neutral-0);
  --surface-brand-soft:var(--teal-100);
  --border-subtle:var(--neutral-200);
  --border-default:var(--neutral-300);
  --border-focus:var(--teal-500);

  /* [P0-4] Botón primario: teal-700 sobre blanco = 5.70:1 (AA). El teal-600 de marca (4.29:1)
     se conserva en superficies grandes, no en texto de CTA. */
  --action-primary-bg:var(--teal-700);
  --action-primary-bg-hover:var(--teal-800);
  --action-primary-bg-active:var(--teal-900);
  --action-primary-fg:var(--neutral-0);
  --focus-ring:0 0 0 3px rgba(53,133,142,.38);

  --font-sans:"Montserrat","Helvetica Neue",Arial,sans-serif;
  --fw-medium:500;--fw-semibold:600;--fw-bold:700;
  --fs-display-2:48px;--fs-h1:38px;--fs-h2:30px;--fs-h3:24px;--fs-h4:20px;
  --fs-body-lg:18px;--fs-body:16px;--fs-body-sm:14px;--fs-caption:12px;
  --ls-display:-0.02em;--ls-heading:-0.01em;--ls-eyebrow:0.16em;--ls-button:0.02em;

  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;
  --gutter-page:24px;--max-content:1200px;
  --radius-sm:4px;--radius-md:8px;--radius-card:12px;--radius-control:8px;--radius-pill:999px;
  --shadow-xs:0 1px 2px rgba(15,26,28,.06);
  --shadow-md:0 4px 12px rgba(18,54,59,.08),0 1px 3px rgba(18,54,59,.06);
  --shadow-lg:0 12px 32px rgba(18,54,59,.12),0 2px 6px rgba(18,54,59,.06);
  --ease:cubic-bezier(.2,.6,.2,1);--dur-fast:120ms;--dur-base:200ms;
  --transition-control:background-color var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease);
  --header-h:68px;
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
/* [P0-1] El header sticky se rompía por `overflow-x:hidden` en html/body (crea contenedor de scroll).
   `overflow-x:clip` recorta sin romper position:sticky. */
html,body{overflow-x:clip}
body{margin:0;font-family:var(--font-sans);font-size:var(--fs-body);line-height:1.62;color:var(--text-body);background:var(--surface-page);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{color:var(--text-strong);font-weight:var(--fw-bold);letter-spacing:var(--ls-heading);margin:0;text-wrap:balance}
h1{font-size:var(--fs-h1);line-height:1.14}
h2{font-size:var(--fs-h2);line-height:1.2}
h3{font-size:var(--fs-h3);line-height:1.28}
h4{font-size:var(--fs-h4);line-height:1.32}
p{margin:0;text-wrap:pretty}
a{color:var(--text-link);text-decoration:none}
a:hover{color:var(--text-link-hover);text-decoration:underline;text-underline-offset:2px}
img,svg{display:block;max-width:100%}
img{height:auto}
ul{margin:0;padding:0;list-style:none}
button{font:inherit}
:focus-visible{outline:none;box-shadow:var(--focus-ring);border-radius:var(--radius-control)}
section[id]{scroll-margin-top:calc(var(--header-h) + 12px)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}

.skip-link{position:absolute;left:-999px;top:8px;z-index:100;background:var(--teal-800);color:#fff;padding:10px 14px;border-radius:var(--radius-control);font-weight:var(--fw-semibold)}
.skip-link:focus{left:12px}

.wrap{max-width:var(--max-content);margin:0 auto;padding:0 var(--gutter-page)}
.eyebrow{font-size:var(--fs-caption);font-weight:var(--fw-semibold);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--text-brand)}
.eyebrow--on-dark{color:var(--lime-400)}
.numeric{font-variant-numeric:tabular-nums}
.section{padding:var(--space-24) 0}
.section__head{display:grid;gap:var(--space-3);max-width:58ch}
.lead{font-size:var(--fs-body-lg);color:var(--text-body)}
.muted{font-size:var(--fs-body-sm);color:var(--text-muted)}
.stack-8{display:grid;gap:var(--space-8)}
.stack-6{display:grid;gap:var(--space-6)}
.stack-4{display:grid;gap:var(--space-4)}
.stack-3{display:grid;gap:var(--space-3)}

/* ---------- Componentes ---------- */
.btn{font-family:var(--font-sans);font-weight:var(--fw-semibold);letter-spacing:var(--ls-button);border-radius:var(--radius-control);border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);cursor:pointer;text-decoration:none;white-space:nowrap;transition:var(--transition-control);
  /* [P2-3] objetivo táctil mínimo 44px */
  min-height:44px;padding:0 20px;font-size:var(--fs-body-sm)}
.btn:hover{text-decoration:none}
.btn--lg{min-height:48px;padding:0 24px;font-size:var(--fs-body)}
.btn--primary{background:var(--action-primary-bg);color:var(--action-primary-fg)}
.btn--primary:hover{background:var(--action-primary-bg-hover);color:#fff}
.btn--primary:active{background:var(--action-primary-bg-active)}
.btn--accent{background:var(--lime-400);color:var(--neutral-900)}
.btn--accent:hover{background:var(--lime-500);color:var(--neutral-900)}
.btn--accent:active{background:var(--lime-600)}
.btn[disabled]{opacity:.65;cursor:progress}

.card{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-card);padding:var(--space-6);box-shadow:var(--shadow-xs)}
.card--flush{padding:0;overflow:hidden}
.card--interactive{transition:box-shadow var(--dur-base) var(--ease),transform var(--dur-base) var(--ease)}
.card--interactive:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}

.tag{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border-subtle);background:var(--neutral-0);color:var(--text-body);border-radius:var(--radius-sm);padding:4px 8px;font-size:var(--fs-caption);font-weight:var(--fw-medium);white-space:nowrap;line-height:1.5}
.tags{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}

.badge{display:inline-flex;align-items:center;border-radius:var(--radius-pill);padding:3px 10px;font-size:var(--fs-caption);font-weight:var(--fw-semibold);line-height:1.5;white-space:nowrap}
.badge--brand{background:var(--surface-brand-soft);color:var(--teal-800)}
.badge--accent{background:var(--lime-200);color:var(--lime-800)}  /* [P0-4+] 4.80:1 (antes 3.50) */

.icon{width:1em;height:1em;display:block;flex:none;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.icon-box{width:44px;height:44px;border-radius:var(--radius-md);background:var(--surface-brand-soft);color:var(--teal-700);display:grid;place-items:center;font-size:22px}

/* ---------- Header ---------- */
.header{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.94);-webkit-backdrop-filter:saturate(140%) blur(12px);backdrop-filter:saturate(140%) blur(12px);border-bottom:1px solid var(--border-subtle)}
.header__inner{position:relative;max-width:var(--max-content);margin:0 auto;padding:12px var(--gutter-page);display:flex;align-items:center;gap:var(--space-8);min-height:var(--header-h)}
.header__logo{display:flex;align-items:center;min-height:44px}
.header__logo img{height:38px;width:auto}
.nav{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-left:auto;font-size:var(--fs-body-sm);font-weight:var(--fw-medium)}
/* [P2-3] links de nav con área táctil ≥44px */
.nav a{color:var(--text-body);display:inline-flex;align-items:center;min-height:44px;padding:0 12px;border-radius:var(--radius-control)}
.nav a:hover,.nav a[aria-current="true"]{color:var(--teal-800);text-decoration:none;background:var(--teal-50)}
.nav__cta-mobile{display:none}
.header__cta{display:flex}
.burger{display:none;width:44px;height:44px;align-items:center;justify-content:center;border:1px solid var(--border-subtle);border-radius:var(--radius-control);background:var(--neutral-0);color:var(--teal-700);cursor:pointer;margin-left:auto;font-size:22px}
.burger .icon--close{display:none}
.burger[aria-expanded="true"] .icon--menu{display:none}
.burger[aria-expanded="true"] .icon--close{display:block}

/* ---------- Hero ---------- */
.hero{background:var(--teal-800);display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));align-items:stretch}
.hero__copy{max-width:calc(var(--max-content) / 2);width:100%;justify-self:end;padding:clamp(44px,8vw,var(--space-20)) var(--gutter-page);display:grid;gap:var(--space-6);align-content:center;justify-items:start}
.hero__title{font-size:clamp(34px,7vw,var(--fs-display-2));line-height:1.08;letter-spacing:var(--ls-display);color:var(--neutral-0);max-width:20ch}
.hero__lead{font-size:var(--fs-body-lg);color:var(--neutral-0);max-width:46ch}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-2)}
.hero__media{position:relative;min-height:min(70vh,560px);overflow:hidden}
/* [P0-3] foto servida como archivo estático, en 3 tamaños, con object-fit (sin upscale) */
.hero__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}

.panels{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.panel{position:relative;overflow:hidden;min-height:190px;display:grid;align-content:center;padding:var(--space-8);text-decoration:none}
.panel:hover{text-decoration:none}
.panel__mark{position:absolute;right:var(--space-6);top:50%;transform:translateY(-50%);height:58%;max-width:42%;object-fit:contain;opacity:.34;transition:opacity var(--dur-base) var(--ease)}
.panel:hover .panel__mark{opacity:.5}
.panel__label{position:relative;font-size:var(--fs-h2);font-weight:var(--fw-medium);letter-spacing:var(--ls-display)}
.panel--teal{background:var(--teal-600)}.panel--teal .panel__label{color:var(--neutral-0)}
.panel--sage{background:var(--sage-500)}.panel--sage .panel__label{color:var(--teal-900)}
.panel--lime{background:var(--lime-400)}.panel--lime .panel__label{color:var(--teal-900)}

.marcos{border-bottom:1px solid var(--border-subtle)}
.marcos .wrap{padding-top:var(--space-6);padding-bottom:var(--space-6);display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}
.marcos .eyebrow{margin-right:var(--space-4)}

/* ---------- Pilares ---------- */
.pilares{background:var(--teal-100)}
.grid-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--space-4)}
.pilar{display:grid;gap:var(--space-3);align-content:start}
.pilar h3{font-size:var(--fs-h4);line-height:1.32}   /* [P1-4] antes <h4> saltando H2→H4 */

/* ---------- Nosotros ---------- */
.nosotros{background:var(--sage-200)}
.nosotros__top{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-12);align-items:start}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--space-4)}
.kpi{display:grid;gap:4px;align-content:start}
.kpi__n{font-size:36px;font-weight:var(--fw-bold);color:var(--teal-700);line-height:1}
.kpi strong{font-size:var(--fs-body-sm);color:var(--text-strong)}
.historia{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--space-8)}
.hito{display:grid;gap:8px;align-content:start;border-top:2px solid var(--teal-600);padding-top:var(--space-4)}
.hito__k{font-size:var(--fs-body-sm);font-weight:var(--fw-bold);color:var(--teal-700);letter-spacing:.16em}
.hito h3{font-size:var(--fs-body);line-height:1.5}
.hito p{font-size:var(--fs-body-sm);color:var(--text-body)}

.proposito{display:grid;gap:var(--space-5);background:var(--neutral-0);border:1px solid var(--border-subtle);border-radius:var(--radius-card);padding:var(--space-10);box-shadow:var(--shadow-xs)}
/* [P2-4] tabs con roles ARIA + teclado; [P2-3] 44px de alto */
.tabs{display:flex;flex-wrap:wrap;gap:var(--space-4);border-bottom:1px solid var(--border-subtle)}
.tab{border:0;background:transparent;cursor:pointer;min-height:44px;padding:0 4px;font-size:var(--fs-body-sm);font-weight:var(--fw-medium);color:var(--text-muted);box-shadow:none;display:inline-flex;align-items:center;transition:var(--transition-control);border-radius:0}
.tab:hover{color:var(--text-brand)}
.tab[aria-selected="true"]{color:var(--text-brand);font-weight:var(--fw-semibold);box-shadow:inset 0 -2px 0 var(--teal-600)}
.tab:focus-visible{box-shadow:inset 0 -2px 0 var(--teal-600),var(--focus-ring)}
.tabpanel{font-size:var(--fs-body-lg);color:var(--text-body);max-width:76ch;min-height:8.5em}
.tabpanel[hidden]{display:none}

.equipo{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:var(--space-4)}
.persona{display:grid;grid-template-columns:120px 1fr;height:100%;align-items:stretch}
/* [P1-1] slot de foto real (object-fit) — mientras llega la foto, avatar de iniciales en color de marca */
.persona__foto{background:var(--teal-800);overflow:hidden;min-height:200px}
.persona__foto img{width:100%;height:100%;object-fit:cover;object-position:center top}
/* placeholder de iniciales: se muestra completo arriba de la columna (quitar la clase al poner foto real) */
.persona__foto--avatar{display:grid;align-content:start;justify-items:center;padding:var(--space-4) 0}
.persona__foto--avatar img{width:88px;height:88px;border-radius:50%;box-shadow:0 0 0 3px rgba(255,255,255,.25)}
.persona__body{padding:var(--space-6);display:grid;gap:8px;align-content:start}
.persona__body h3{font-size:var(--fs-h4);line-height:1.32}
.persona__rol{font-size:var(--fs-body-sm);color:var(--teal-700);font-weight:var(--fw-semibold)}
.persona__mail{font-size:var(--fs-body-sm);display:inline-flex;align-items:center;min-height:44px}

/* ---------- Servicios ---------- */
.servicios{background:var(--lime-100)}
.linea{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--space-8)}
.linea__head{display:grid;gap:var(--space-3);align-content:start}
.linea__head>div{display:flex}
.checklist{display:grid;gap:var(--space-3)}
.checklist li{display:flex;gap:var(--space-3);font-size:var(--fs-body-sm);color:var(--text-body)}
.checklist .icon{color:var(--sage-700);font-size:18px;margin-top:2px}

/* ---------- Digitaliza ---------- */
/* [P0-4+] fondo teal-800 (texto teal-100 = 6.93:1); antes regen-teal daba 3.80:1 */
.digitaliza{background:var(--teal-800);position:relative;overflow:hidden}
.digitaliza__mark{position:absolute;right:var(--space-8);top:50%;transform:translateY(-50%);height:70%;max-width:32%;object-fit:contain;opacity:.12;pointer-events:none}
.digitaliza .wrap{position:relative}
.digitaliza h2{color:var(--text-inverse)}
.digitaliza .lead{color:var(--teal-100)}
.digitaliza__eyebrow-row{display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:center}
.modulos{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-4)}
.modulo{display:flex;gap:var(--space-4);padding:var(--space-5);background:var(--teal-700);border:1px solid var(--teal-500);border-radius:var(--radius-card)}
.modulo .icon{color:var(--lime-400);font-size:20px;margin-top:3px}
.modulo h3{font-size:var(--fs-body);line-height:1.5;color:var(--text-inverse)}
.modulo p{font-size:var(--fs-body-sm);color:var(--teal-100);margin-top:4px}

/* ---------- CTA banda ---------- */
.cta-band{background:var(--lime-200);padding:var(--space-16) 0}
.cta-band .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--space-8);flex-wrap:wrap}
.cta-band__copy{display:grid;gap:8px;max-width:48ch}

/* ---------- Contacto ---------- */
.contacto{background:var(--teal-100)}
.contacto__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-4)}
.form{display:grid;gap:var(--space-4);align-content:start}
.form__row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-4)}
.field{display:grid;gap:6px;font-size:var(--fs-body-sm);font-weight:var(--fw-semibold);color:var(--text-strong)}
.field input,.field textarea{font-family:inherit;font-size:16px;/* 16px evita zoom automático en iOS */color:var(--text-strong);padding:10px 12px;min-height:44px;border:1px solid var(--border-default);border-radius:var(--radius-control);background:var(--neutral-0);width:100%;transition:var(--transition-control)}
.field textarea{resize:vertical;min-height:120px}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--border-focus);box-shadow:var(--focus-ring)}
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-color:var(--status-danger)}
.field__hint{font-weight:400;color:var(--text-muted);font-size:var(--fs-caption)}
.field__error{font-weight:500;color:var(--status-danger);font-size:var(--fs-caption);display:none}
.field input[aria-invalid="true"]~.field__error,.field textarea[aria-invalid="true"]~.field__error{display:block}
.form__foot{display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:center}
.form__legal{font-size:var(--fs-caption);color:var(--text-muted);max-width:40ch;font-weight:400}
.hp{position:absolute;left:-9999px;opacity:0;height:0;width:0;overflow:hidden}
/* [P0-2] estados visibles de envío */
.form-status{border-radius:var(--radius-control);padding:14px 16px;font-size:var(--fs-body-sm);display:none;align-items:flex-start;gap:10px}
.form-status[data-state="success"]{display:flex;background:var(--status-success-bg);color:#1E6B41;border:1px solid #BFE0CB}
.form-status[data-state="error"]{display:flex;background:var(--status-danger-bg);color:#8E2D26;border:1px solid #EFC3BE}
.form-status .icon{font-size:20px;flex:none;margin-top:1px}

.medios{display:grid;gap:var(--space-3)}
.medios a,.medios span{display:flex;gap:10px;align-items:center;font-size:var(--fs-body-sm);color:var(--text-body);min-height:44px}
.medios .icon{font-size:16px;color:var(--teal-700)}
/* [P1-2] tarjeta de ubicación (el mapa se incrustará cuando se confirme la dirección) */
.ubicacion{border-radius:var(--radius-card);background:var(--teal-800);min-height:220px;position:relative;overflow:hidden;display:grid;place-items:center;text-align:center;padding:var(--space-6)}
.ubicacion__mark{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);height:70%;width:auto;max-width:52%;object-fit:contain;opacity:.12;pointer-events:none}
.ubicacion__body{display:grid;gap:8px;position:relative;justify-items:center}
.ubicacion__body strong{color:var(--text-inverse);font-size:var(--fs-h4)}
.ubicacion__body span:last-child{color:var(--teal-100);font-size:var(--fs-body-sm);max-width:34ch}

/* ---------- Footer ---------- */
.footer{background:var(--neutral-900);color:var(--neutral-300)}
.footer__grid{max-width:var(--max-content);margin:0 auto;padding:var(--space-16) var(--gutter-page);display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-10)}
.footer__brand{display:grid;gap:var(--space-4);justify-items:start}
.footer__brand img{height:36px;width:auto}
.footer__brand p{font-size:var(--fs-body-sm);max-width:34ch}
.footer__col{display:grid;gap:4px;align-content:start}
.footer__col .eyebrow{color:var(--lime-400);margin-bottom:4px}
.footer__col a,.footer__col span{font-size:var(--fs-body-sm);color:var(--neutral-300);display:inline-flex;align-items:center;min-height:44px}
.footer__col a:hover{color:#fff}
.footer__legal{border-top:1px solid var(--neutral-800);padding:16px var(--gutter-page);font-size:var(--fs-caption);color:var(--neutral-400);/* [P0-4+] 6.90:1 */display:flex;flex-wrap:wrap;gap:8px var(--space-6);align-items:center;justify-content:center;text-align:center}
.footer__legal a{color:var(--neutral-300)}

/* ---------- WhatsApp flotante ---------- */
.wa{position:fixed;right:20px;bottom:20px;z-index:40;display:flex;align-items:center;gap:10px;padding:0 18px;min-height:52px;border-radius:999px;background:var(--teal-700);color:var(--neutral-0);font-size:var(--fs-body-sm);font-weight:var(--fw-semibold);box-shadow:var(--shadow-lg);transition:transform var(--dur-base) var(--ease),opacity var(--dur-base) var(--ease),background-color var(--dur-fast) var(--ease)}
.wa:hover{background:var(--teal-800);color:#fff;text-decoration:none}
.wa .icon{font-size:20px}
/* [P1-6] cuando el formulario está en pantalla, el botón se retira para no tapar "Enviar" */
.wa--retirado{transform:translateY(120px);opacity:0;pointer-events:none}

/* ---------- Responsive ---------- */
@media (max-width:900px){
  /* [P1-5] menú hamburguesa */
  .nav{display:none}
  .nav[data-open="true"]{display:grid;position:absolute;top:100%;left:0;right:0;margin:0;gap:0;background:var(--neutral-0);border-bottom:1px solid var(--border-subtle);padding:8px var(--gutter-page) 16px;box-shadow:var(--shadow-md)}
  .nav[data-open="true"] a{min-height:48px;padding:0 4px;border-bottom:1px solid var(--border-subtle);font-size:var(--fs-body);border-radius:0}
  .nav[data-open="true"] a:hover{background:transparent}
  .nav__cta-mobile{display:block;padding-top:14px}
  .nav__cta-mobile .btn{width:100%;color:#fff;border-bottom:0;justify-content:center;padding:0 20px;border-radius:var(--radius-control)}
  .nav[data-open="true"] .nav__cta-mobile .btn:hover{background:var(--action-primary-bg-hover);color:#fff}
  .burger{display:inline-flex}
  .header__cta{display:none}
  .section{padding:var(--space-12) 0}
  .hero__media{min-height:300px}
  .panel{min-height:132px}
  .persona{grid-template-columns:1fr}
  .persona__foto{min-height:0;aspect-ratio:16/9}
  .persona__foto img{object-position:center 30%}
  .persona__foto--avatar{aspect-ratio:auto;padding:var(--space-4)}
  .proposito{padding:var(--space-6)}
  .tabpanel{min-height:0}
  .footer__grid{padding-top:48px;padding-bottom:48px}
}
@media (max-width:700px){
  .hero,.panels,.grid-cards,.nosotros__top,.historia,.equipo,.linea,.modulos,.contacto__grid,.form__row,.footer__grid{grid-template-columns:1fr}
  .kpis{grid-template-columns:1fr 1fr}
  .hero__copy{max-width:none;justify-self:stretch}
  .hero__media{min-height:0;aspect-ratio:16/9}
  .hero__media img{position:static;height:100%}
  .cta-band .btn{width:100%}
  /* [P1-6] espacio extra bajo el formulario en móvil para que el botón WA nunca tape "Enviar" */
  .form{padding-bottom:var(--space-8)}
}
@media (max-width:480px){
  .wa{width:52px;min-height:52px;padding:0;justify-content:center}
  .wa__label{display:none}
  .kpis{grid-template-columns:1fr}
}

/* ---------- Páginas legales ---------- */
.legal{padding:var(--space-12) 0 var(--space-24)}
.legal .wrap{max-width:820px;display:grid;gap:var(--space-4)}
.legal h1{font-size:var(--fs-h1)}
.legal h2{font-size:var(--fs-h3);margin-top:var(--space-8);padding-top:var(--space-4);border-top:1px solid var(--border-subtle)}
.legal h3{font-size:var(--fs-body-lg);margin-top:var(--space-3)}
.legal p,.legal li{font-size:var(--fs-body);color:var(--text-body)}
.legal__toc{display:flex;flex-wrap:wrap;gap:8px;padding:var(--space-4);background:var(--teal-100);border-radius:var(--radius-card)}
.legal__toc a{font-size:var(--fs-body-sm);font-weight:var(--fw-medium);color:var(--teal-800);background:var(--neutral-0);border:1px solid var(--border-subtle);border-radius:var(--radius-pill);padding:6px 12px;min-height:36px;display:inline-flex;align-items:center}
.legal__toc a:hover{text-decoration:none;border-color:var(--teal-500)}
.legal__list{display:grid;gap:8px;padding-left:20px;list-style:disc}
.legal__table{width:100%;border-collapse:collapse;font-size:var(--fs-body-sm)}
.legal__table th,.legal__table td{text-align:left;vertical-align:top;padding:10px 12px;border:1px solid var(--border-subtle)}
.legal__table th{background:var(--neutral-50);color:var(--text-strong);font-weight:var(--fw-semibold);width:200px}
.legal__table--3 th,.legal__table--4 th{width:auto}
.legal code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;background:var(--neutral-100);padding:1px 6px;border-radius:4px}
.legal__cta{display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:center;justify-content:space-between;background:var(--lime-100);border:1px solid var(--lime-300);border-radius:var(--radius-card);padding:var(--space-4) var(--space-5)}
@media (max-width:700px){.legal__table,.legal__table tr,.legal__table td,.legal__table th{display:block}.legal__table th{width:auto;border-bottom:0}.legal__table td{border-top:0}.legal__table tr+tr{margin-top:12px}}

/* ---------- Consentimiento en formulario ---------- */
.check{display:flex;gap:10px;align-items:flex-start;font-size:var(--fs-body-sm);font-weight:400;color:var(--text-body);cursor:pointer}
.check input{width:20px;height:20px;min-height:0;margin:2px 0 0;flex:none;accent-color:var(--teal-700)}
.check a{font-weight:var(--fw-semibold)}
.check input[aria-invalid="true"]{outline:2px solid var(--status-danger);outline-offset:2px}
.check input[aria-invalid="true"]~.field__error{display:block}

/* ---------- Banner de cookies ---------- */
.ck{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;max-width:560px;margin:0 auto;background:var(--neutral-0);border:1px solid var(--border-subtle);border-radius:var(--radius-card);box-shadow:var(--shadow-lg);padding:var(--space-5);display:grid;gap:var(--space-4)}
.ck[hidden],.ck [hidden]{display:none!important}
.ck__title{font-size:var(--fs-body);font-weight:var(--fw-bold);color:var(--text-strong);display:flex;gap:8px;align-items:center}
.ck__title .icon{color:var(--teal-700);font-size:20px}
.ck p{font-size:var(--fs-body-sm)}
.ck__actions{display:flex;flex-wrap:wrap;gap:8px}
.ck__actions .btn{flex:1 1 auto}
.btn--ghost{background:transparent;color:var(--teal-800);border-color:var(--border-default)}
.btn--ghost:hover{background:var(--teal-50);color:var(--teal-900)}
.ck__panel{display:grid;gap:10px;border-top:1px solid var(--border-subtle);padding-top:var(--space-4)}
.ck__panel[hidden]{display:none}
.ck__opt{display:flex;gap:12px;align-items:flex-start;font-size:var(--fs-body-sm)}
.ck__opt input{width:20px;height:20px;margin-top:1px;flex:none;accent-color:var(--teal-700)}
.ck__opt strong{display:block;color:var(--text-strong)}
.ck__opt span{color:var(--text-muted)}
@media (min-width:701px){.ck{left:auto;right:24px;bottom:24px;margin:0}}
/* cuando el banner está abierto, el botón de WhatsApp sube para no chocar */
body.ck-open .wa{transform:translateY(-170px)}
@media (min-width:701px){body.ck-open .wa{transform:translateX(-600px)}}
.footer__legal a[data-cookie-open]{cursor:pointer}
