/* ============================================================================
   AUREN Consultoría · Estrategia de Negocio y Procesos — mini site
   CSS único autocontenido. Fuente visual: prototipo aprobado (Fase 1,
   prototipo/ui_kits/landing/) + tokens del design system "AUREN · Design System".
   Diferencias aplicadas según prototipo/README.md y plan/CANON.md §4-§5:
   Jost + Open Sans en woff2 locales (sin CDNs), --fw-xlight → 300 (peso mínimo
   disponible en Jost libre, equivalente visual del ITC AG Pro XLt del diseño).
   Capas: 1 fuentes · 2 tokens · 3 base · 4 header/footer · 5 componentes ·
          6 componentes nuevos de la home completa · 7 media queries
   ========================================================================== */

/* ---------- 1. @font-face (woff2 locales, subset latin) ---------- */
@font-face{font-family:'Jost';font-style:normal;font-weight:300;font-display:swap;
  src:url("../fonts/jost-300.woff2") format("woff2")}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;
  src:url("../fonts/jost-500.woff2") format("woff2")}
@font-face{font-family:'Jost';font-style:normal;font-weight:600;font-display:swap;
  src:url("../fonts/jost-600.woff2") format("woff2")}
@font-face{font-family:'Jost';font-style:normal;font-weight:700;font-display:swap;
  src:url("../fonts/jost-700.woff2") format("woff2")}
@font-face{font-family:'Open Sans';font-style:normal;font-weight:400;font-display:swap;
  src:url("../fonts/opensans-400.woff2") format("woff2")}
@font-face{font-family:'Open Sans';font-style:italic;font-weight:400;font-display:swap;
  src:url("../fonts/opensans-400i.woff2") format("woff2")}
@font-face{font-family:'Open Sans';font-style:normal;font-weight:600;font-display:swap;
  src:url("../fonts/opensans-600.woff2") format("woff2")}
@font-face{font-family:'Open Sans Condensed';font-style:normal;font-weight:700;font-display:swap;
  src:url("../fonts/opensans-condensed-700.woff2") format("woff2")}

/* ---------- 2. Tokens (design system AUREN) ---------- */
:root{
  /* Marca */
  --auren-red:#E32717; --auren-red-fill:#E2231A; --auren-charcoal:#2A2A2B;
  --auren-orange:#F26B43; --auren-green:#578353; --auren-green-2:#798A59;
  --auren-ink:#150E0F; --auren-gray:#827D7E; --auren-white:#FFFFFF; --auren-black:#000000;
  /* Rampa neutra cálida */
  --neutral-950:#1C1C1D; --neutral-900:#2A2A2B; --neutral-800:#3C3B3C;
  --neutral-700:#504E4F; --neutral-600:#6B6768; --neutral-500:#827D7E;
  --neutral-400:#A29E9F; --neutral-300:#C4C1C1; --neutral-200:#DEDCDC;
  --neutral-100:#EFEEEE; --neutral-50:#F7F6F6;
  /* Rampa roja */
  --red-700:#B41E11; --red-600:#E32717; --red-500:#F0402F; --red-100:#FBDBD7;
  /* Alias semánticos */
  --brand-primary:var(--auren-red); --brand-primary-strong:var(--red-700);
  --brand-ink:var(--auren-charcoal); --brand-accent:var(--auren-orange);
  --brand-green:var(--auren-green); --service-consultoria:var(--auren-green);
  --surface-ink:var(--auren-ink);
  --text-primary:var(--neutral-900); --text-secondary:var(--neutral-600);
  --text-muted:var(--neutral-500); --text-on-dark:var(--auren-white);
  --text-on-brand:var(--auren-white);
  --surface:var(--auren-white); --surface-subtle:var(--neutral-50);
  --surface-muted:var(--neutral-100); --surface-dark:var(--auren-charcoal);
  --surface-brand:var(--auren-red);
  --border:var(--neutral-200); --border-strong:var(--neutral-300);
  --link:var(--auren-red); --link-hover:var(--red-700);
  /* Data-viz */
  --data-primary:var(--auren-red); --data-neutral:var(--neutral-400);
  --data-dark:var(--auren-charcoal); --data-track:var(--neutral-200);
  --cat-1:var(--auren-red); --cat-2:var(--auren-charcoal);
  --cat-3:var(--auren-gray); --cat-4:var(--auren-orange);
  /* Tipografía (CANON §4: Jost titulares · Open Sans cuerpo · Condensed labels) */
  --font-display:"Jost","Century Gothic","Futura",system-ui,sans-serif;
  --font-body:"Jost","Century Gothic",system-ui,sans-serif;
  --font-web:"Open Sans","Segoe UI",system-ui,sans-serif;
  --font-label:"Open Sans Condensed","Arial Narrow",sans-serif;
  --fw-xlight:300; --fw-book:400; --fw-medium:500; --fw-demi:600; --fw-bold:700;
  --fs-display:80px; --fs-h1:60px; --fs-h2:44px; --fs-h3:36px; --fs-section:28px;
  --fs-title:24px; --fs-lead:20px; --fs-body:16px; --fs-small:14px;
  --fs-caption:12px; --fs-micro:11px;
  --lh-tight:1.05; --lh-heading:1.15; --lh-body:1.5;
  --tracking-caps:.04em; --tracking-tight:-.01em;
  /* Espaciado, radios, sombras, layout */
  --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;
  --radius-sm:4px; --radius-md:8px; --radius-lg:14px; --radius-pill:999px;
  --dogear:18px; --stroke-highlight:3px; --border-width:1px;
  --shadow-sm:0 1px 2px rgba(42,42,43,.08); --shadow-md:0 6px 18px rgba(42,42,43,.12);
  --shadow-lg:0 16px 40px rgba(42,42,43,.16);
  --container:1200px; --gutter:var(--space-6); --page-margin:var(--space-10);
  --ease-standard:cubic-bezier(.2,.6,.2,1); --dur-fast:120ms; --dur-base:220ms;
  color-scheme:light;
}

/* ---------- 3. Base ---------- */
*{box-sizing:border-box}
body{margin:0;background:var(--surface);color:var(--text-primary);font-family:var(--font-display);-webkit-font-smoothing:antialiased}
a{color:var(--link);text-decoration:none}
a:hover{color:var(--link-hover);text-decoration:underline}
:focus-visible{outline:2px solid var(--brand-primary);outline-offset:2px}
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--brand-primary);color:#fff;padding:10px 18px;font-family:var(--font-web);font-size:14px}
.skip:focus{left:0;color:#fff}
.wrap{max-width:var(--container);margin:0 auto;padding-left:clamp(20px,5vw,48px);padding-right:clamp(20px,5vw,48px)}
.kick{display:inline-flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:var(--fw-demi);color:var(--text-secondary)}
.kick::after{content:"";width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:7px solid var(--brand-primary)}
.kick.red{color:var(--brand-primary)}
.kick.green{color:var(--service-consultoria)}.kick.green::after{border-left-color:var(--service-consultoria)}
.h2{margin:14px 0 0;font-size:clamp(28px,3.6vw,44px);font-weight:var(--fw-xlight);letter-spacing:.02em;text-transform:uppercase;line-height:var(--lh-heading);text-wrap:balance}
.lead{font-family:var(--font-web);font-size:clamp(15px,1.5vw,17px);line-height:1.65;color:var(--text-secondary);text-wrap:pretty}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:var(--radius-pill);padding:15px 30px;font-family:var(--font-display);font-weight:var(--fw-demi);font-size:15px;line-height:1;letter-spacing:.03em;text-align:center;text-decoration:none;transition:background-color var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard),color var(--dur-base) var(--ease-standard)}
.btn:hover{text-decoration:none}
.btn-primary{background:var(--brand-primary);color:#fff}.btn-primary:hover{background:var(--brand-primary-strong);color:#fff}
.btn-ghost{border:1px solid rgba(255,255,255,.45);color:#fff}.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.08);color:#fff}
.btn-line{border:1px solid var(--border-strong);color:var(--text-primary)}.btn-line:hover{border-color:var(--auren-charcoal);background:var(--auren-charcoal);color:#fff}
.btn.sm{padding:11px 22px;font-size:13px}
.sec{padding-top:clamp(60px,8.5vw,104px);padding-bottom:clamp(60px,8.5vw,104px)}
.sec.alt{background:var(--surface-subtle)}
.g2{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,64px);align-items:center}
.ph{border-radius:var(--radius-md);overflow:hidden}
.ph img{width:100%;height:100%;min-height:300px;object-fit:cover;display:block}
.sect{display:flex;align-items:center;gap:12px;font-size:clamp(20px,2.2vw,26px);font-weight:var(--fw-xlight);letter-spacing:var(--tracking-caps);text-transform:uppercase}
.sect::after{content:"";width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:11px solid var(--brand-primary)}
.lblc{font-size:12px;letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--text-muted);font-weight:var(--fw-demi)}

/* ---------- 4. Header ---------- */
.hd{position:sticky;top:0;z-index:60;background:var(--surface-ink);border-bottom:1px solid rgba(255,255,255,.08)}
.nav{display:flex;align-items:center;gap:18px;height:76px;position:relative}
.logo{display:flex}.logo img{height:42px;width:auto;display:block}
.hk{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--neutral-400);border-left:1px solid rgba(255,255,255,.22);padding-left:16px;line-height:1.6;max-width:230px}
.menu{margin-left:auto;display:flex;align-items:center;gap:clamp(16px,1.9vw,26px);padding-left:clamp(26px,3vw,52px)}
.menu a:not(.btn){color:#fff;font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:var(--fw-book);text-decoration:none;padding:6px 0;border-bottom:2px solid transparent;transition:color var(--dur-base) var(--ease-standard)}
.menu a:not(.btn):hover{color:var(--neutral-300);text-decoration:none}
.menu a.on{border-bottom-color:var(--brand-primary)}
#nv{position:absolute;opacity:0;pointer-events:none}
.burger{display:none;margin-left:auto;flex-direction:column;gap:5px;cursor:pointer;padding:8px 0}
.burger span{width:22px;height:2px;background:#fff}

/* ---------- 5. Componentes del prototipo ---------- */
/* Hero home */
.hero{position:relative;background:var(--surface-ink);color:#fff;overflow:hidden}
.hero .bg{position:absolute;inset:0;background:url("../img/fotos/foto-manos-planeta-cover.webp") 72% center/cover no-repeat}
.hero .scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(21,14,15,.93) 0%,rgba(21,14,15,.62) 52%,rgba(21,14,15,.18) 100%)}
.hero-in{position:relative;padding-top:clamp(84px,12vw,148px);padding-bottom:clamp(84px,12vw,148px)}
.hero h1{margin:20px 0 0;font-size:clamp(36px,6vw,72px);font-weight:var(--fw-xlight);text-transform:uppercase;letter-spacing:.02em;line-height:1.08;color:#fff;max-width:14ch;text-wrap:balance}
.hero .sub{font-family:var(--font-web);font-size:clamp(15px,1.6vw,18px);line-height:1.65;color:var(--neutral-200);max-width:560px;margin:24px 0 0}
.cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px}
/* Sección oscura de cifras */
.dark{background:var(--surface-dark);color:#fff}
.dark .kick{color:var(--neutral-300)}
.eq{margin:26px 0 0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--neutral-400);line-height:2}
.kpis{display:flex;flex-wrap:wrap;gap:clamp(28px,4.5vw,56px);margin-top:34px}
.kpi b{display:block;font-size:clamp(42px,4.6vw,60px);font-weight:var(--fw-bold);letter-spacing:var(--tracking-tight);line-height:1}
.kpi.hi b{color:var(--brand-primary)}
.kpi span{display:block;margin-top:10px;font-size:11px;letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--neutral-400);line-height:1.6;max-width:210px}
.kpis.on-light .kpi b{color:var(--text-primary)}
.kpis.on-light .kpi.hi b{color:var(--brand-primary)}
.kpis.on-light .kpi span{color:var(--text-muted)}
.dark .close{font-family:var(--font-web);font-size:15px;line-height:1.65;color:var(--neutral-300);max-width:640px;margin:36px 0 0}
.dark .close b{color:#fff;font-weight:600}
/* Presencia + infografía */
.mapa{max-width:420px;width:100%;height:auto;display:block;margin:0 auto}
.of{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px 18px}
.of li{font-family:var(--font-web);font-size:13px;color:var(--text-secondary);display:flex;align-items:center;gap:8px}
.of li::before{content:"";width:4px;height:4px;background:var(--neutral-300);flex:none}
.panel{background:var(--surface-subtle);border:1px solid var(--border);border-radius:var(--radius-md);padding:clamp(22px,3vw,34px)}
.donut-row{display:flex;align-items:center;gap:clamp(20px,3vw,34px);flex-wrap:wrap;margin-top:22px}
.donut{position:relative;width:180px;height:180px;flex:none}
.donut .c{position:absolute;inset:0;display:grid;place-items:center;text-align:center;font-weight:var(--fw-bold);line-height:1}
.leg{display:grid;gap:9px;min-width:200px}
.leg div{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--text-secondary)}
.leg i{width:12px;height:12px;flex:none}
.leg b{margin-left:auto;font-size:15px;font-weight:var(--fw-bold);color:var(--text-primary);letter-spacing:0}
.leg .hi b{color:var(--brand-primary)}
.pk{display:flex;flex-wrap:wrap;gap:clamp(24px,3vw,44px);margin:26px 0 0}
.pk b{display:block;font-size:32px;font-weight:var(--fw-bold);letter-spacing:var(--tracking-tight);line-height:1}
.pk .hi b{color:var(--brand-primary)}
.pk span{display:block;margin-top:6px;font-size:11px;letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--text-muted)}
.rk{display:grid;gap:8px;margin-top:14px}
.rank{display:flex}
.rank .num{background:var(--neutral-900);color:#fff;font-weight:var(--fw-bold);font-size:18px;padding:6px 12px;display:grid;place-items:center;min-width:44px}
.rank .bar{color:#fff;font-weight:var(--fw-demi);font-size:12px;letter-spacing:var(--tracking-caps);text-transform:uppercase;padding:0 14px;display:flex;align-items:center;flex:1;background:var(--data-dark)}
.rank .bar.hi{background:var(--data-primary)}
.fuentes{font-family:var(--font-web);font-size:11px;color:var(--text-muted);margin:14px 0 0}
/* Internacional */
.intl{position:relative;background:var(--surface-ink);color:#fff;overflow:hidden}
.intl .bg{position:absolute;inset:0;background:url("../img/fotos/foto-mapamundi-nubes.webp") center/cover no-repeat}
.intl .scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(21,14,15,.92) 0%,rgba(21,14,15,.78) 100%)}
.intl .in{position:relative}
.intl .sect{color:#fff}
.antea{margin-left:auto;background:#fff;border-radius:var(--radius-md);padding:12px 18px;flex:none}
.antea img{height:52px;width:auto;display:block}
.cols2{margin:28px 0 0;font-family:var(--font-web);font-size:14.5px;line-height:1.7;color:var(--neutral-200);max-width:1000px}
.cols2 p{margin:0 0 14px}
/* Testimonios */
.tsts{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.5vw,28px);margin-top:40px}
.tst{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);padding:30px 30px 26px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column}
.tst .qm{font-size:58px;font-weight:var(--fw-bold);color:var(--brand-primary);line-height:.55;height:26px}
.tst blockquote{margin:0;font-family:var(--font-web);font-size:14.5px;line-height:1.7;color:var(--text-secondary);flex:1}
.tst footer{margin-top:20px}
.tst .who{font-size:14px;font-weight:var(--fw-demi)}
.tst .role{font-family:var(--font-web);font-size:12px;color:var(--text-muted);margin-top:3px}
/* Tarjetas de las 3 líneas (home) */
.lcs{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.5vw,28px);margin-top:40px}
.lcs-4{grid-template-columns:repeat(2,1fr)}
.lc{border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;background:#fff;display:flex;flex-direction:column;text-decoration:none;color:inherit;transition:box-shadow var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard)}
.lc:hover{box-shadow:var(--shadow-md);border-color:var(--border-strong);text-decoration:none;color:inherit}
.lc .im{height:150px;overflow:hidden;background:var(--surface-ink)}
.lc .im img{width:100%;height:100%;object-fit:cover;display:block;transition:filter var(--dur-base) var(--ease-standard)}
.lc:hover .im img{filter:brightness(1.07)}
.lc h3{font-size:15.5px;font-weight:var(--fw-demi);text-transform:uppercase;letter-spacing:.05em;margin:0;padding:20px 22px 0;line-height:1.4}
.lc ul{list-style:none;margin:14px 0 0;padding:0 22px;flex:1}
.lc li{font-family:var(--font-web);font-size:13px;color:var(--text-secondary);padding:7px 0;border-top:1px solid var(--neutral-100)}
.lc li:first-child{border-top:0}
.lc .go{padding:16px 22px 20px;color:var(--brand-primary);font-weight:var(--fw-demi);font-size:14px}
.lc:hover .go{color:var(--brand-primary-strong)}
.startcta{margin:34px 0 0;text-align:center;font-family:var(--font-web);font-size:14px;color:var(--text-secondary)}
/* Sostenibilidad (tarjeta) */
.sus{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;display:grid;grid-template-columns:1.1fr .9fr}
.sus .tx{padding:clamp(28px,4vw,52px)}
.sus h3{margin:14px 0 0;font-size:clamp(26px,3vw,34px);font-weight:var(--fw-xlight);letter-spacing:.02em;text-transform:uppercase}
.sus p{font-family:var(--font-web);font-size:15px;line-height:1.65;color:var(--text-secondary);margin:16px 0 0;max-width:52ch}
.glink{display:inline-block;margin-top:22px;color:var(--service-consultoria);font-weight:var(--fw-demi);font-size:14px;text-decoration:none}
.glink:hover{color:var(--service-consultoria);text-decoration:underline}
.sus .im{min-height:260px}
.sus .im img{width:100%;height:100%;object-fit:cover;display:block}
/* Certificaciones y rejillas de logos */
.certs{display:grid;grid-template-columns:repeat(9,1fr);gap:clamp(6px,.8vw,12px);margin-top:36px}
.cert{border:1px solid var(--border);border-radius:var(--radius-sm);background:#fff;padding:10px 8px;display:grid;place-items:center;min-height:96px}
.cert img{max-height:clamp(48px,5.4vw,72px);width:auto;max-width:100%}
.certs.logos{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:14px}
.certs.logos .cert{min-height:96px}
.certs.logos .cert img{max-height:52px}
/* CTA final */
.cta{background:radial-gradient(620px 320px at 78% 118%,rgba(227,39,23,.5),transparent 66%),radial-gradient(700px 400px at -8% -40%,rgba(227,39,23,.16),transparent 60%),var(--surface-ink);color:#fff;text-align:center}
.cta h2{margin:0;font-size:clamp(32px,4.6vw,54px);font-weight:var(--fw-xlight);text-transform:uppercase;letter-spacing:.02em;line-height:1.12}
.cta p{font-family:var(--font-web);font-size:15px;color:var(--neutral-300);margin:18px auto 0;max-width:460px;line-height:1.65}
.cta .row{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;align-items:center;margin-top:34px}
.cta .mail{color:#fff;font-weight:var(--fw-demi);font-size:17px;text-decoration:none}
.cta .mail:hover{color:#fff;text-decoration:underline}
.cta .lblc{color:var(--neutral-400)}
.cta .btn{line-height:1.35}
/* Hero de línea */
.lhero{position:relative;background:radial-gradient(640px 340px at 85% 130%,rgba(227,39,23,.42),transparent 65%),radial-gradient(520px 300px at -6% -50%,rgba(227,39,23,.14),transparent 60%),var(--surface-ink);color:#fff;overflow:hidden}
.lhero .in{padding-top:clamp(56px,8vw,96px);padding-bottom:clamp(56px,8vw,96px)}
.lhero h1{margin:22px 0 0;font-size:clamp(34px,5vw,60px);font-weight:var(--fw-xlight);text-transform:uppercase;letter-spacing:.02em;line-height:1.1;color:#fff;text-wrap:balance}
/* Breadcrumb (claro por defecto; oscuro dentro de .lhero) */
.crumbbar{background:var(--surface-subtle);border-bottom:1px solid var(--border)}
.crumb{font-family:var(--font-web);font-size:12.5px;color:var(--text-muted);padding:14px 0}
.crumb a{color:var(--text-secondary)}
.crumb a:hover{color:var(--brand-primary);text-decoration:none}
.crumb b{color:var(--text-primary);font-weight:600}
.lhero .crumb{color:var(--neutral-400);padding:0}
.lhero .crumb a{color:var(--neutral-300)}
.lhero .crumb a:hover{color:#fff;text-decoration:none}
.lhero .crumb b{color:#fff}
/* Intro de línea */
.intro p{font-family:var(--font-web);font-size:clamp(15px,1.5vw,17px);line-height:1.7;color:var(--text-secondary);max-width:76ch;margin:0 0 18px;text-wrap:pretty}
.intro p:first-child{font-size:clamp(16px,1.7vw,19px);color:var(--text-primary)}
/* Tarjetas de subservicio (índice de línea) */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.2vw,24px)}
.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);padding:26px 26px 22px;display:flex;flex-direction:column;text-decoration:none;color:inherit;position:relative;overflow:hidden;transition:box-shadow var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard)}
.card:hover{box-shadow:var(--shadow-md);border-color:var(--border-strong);text-decoration:none;color:inherit}
.card .ear{position:absolute;top:0;right:0;width:0;height:0;border-top:18px solid var(--neutral-100);border-left:18px solid transparent}
.card .n{font-size:30px;font-weight:var(--fw-xlight);color:var(--neutral-400);line-height:1}
.card h3{margin:16px 0 0;font-size:16px;font-weight:var(--fw-demi);letter-spacing:.02em;line-height:1.4;text-transform:uppercase;color:var(--text-primary)}
.card p{margin:12px 0 0;font-family:var(--font-web);font-size:13px;line-height:1.6;color:var(--text-secondary);flex:1}
.card .go{margin-top:20px;font-size:13.5px;font-weight:var(--fw-demi);color:var(--brand-primary);transition:color var(--dur-base) var(--ease-standard)}
.card:hover .go{color:var(--brand-primary-strong)}
/* CTA de línea + otras líneas */
.ctab{text-align:center}
.ctab .row{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;align-items:center;margin-top:28px}
.ctab .mail{font-weight:var(--fw-demi);font-size:17px;color:var(--text-primary);text-decoration:none}
.ctab .mail:hover{color:var(--brand-primary);text-decoration:none}
.sisters{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;align-items:center;border-top:1px solid var(--border);margin-top:clamp(40px,6vw,64px);padding-top:clamp(32px,5vw,48px)}
.sisters .kick{width:100%;justify-content:center}
/* Detalle de subservicio */
.art{padding-top:clamp(48px,7vw,84px);padding-bottom:clamp(48px,7vw,84px)}
.art .grid{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(32px,5vw,72px);align-items:start}
.art h1{margin:18px 0 0;font-size:clamp(30px,4.2vw,50px);font-weight:var(--fw-xlight);text-transform:uppercase;letter-spacing:.02em;line-height:1.12;text-wrap:balance}
.copy{margin-top:28px}
.copy p{font-family:var(--font-web);font-size:15.5px;line-height:1.75;color:var(--text-secondary);margin:0 0 18px;text-wrap:pretty}
.copy p.lead{font-size:clamp(16px,1.7vw,18.5px);color:var(--text-primary);line-height:1.65}
.copy ul{margin:0 0 18px;padding:0;list-style:none}
.copy li{font-family:var(--font-web);font-size:15px;line-height:1.65;color:var(--text-secondary);padding:7px 0 7px 22px;position:relative}
.copy li::before{content:"";position:absolute;left:2px;top:15px;width:7px;height:7px;background:var(--brand-primary)}
.copy h2,.copy h3{font-size:clamp(17px,1.8vw,21px);font-weight:var(--fw-demi);letter-spacing:.03em;text-transform:uppercase;margin:30px 0 12px;line-height:1.3}
.art aside figure{margin:0;border-radius:var(--radius-md);overflow:hidden}
.art aside figure img{width:100%;height:auto;display:block;aspect-ratio:4/3;object-fit:cover}
.art aside figcaption{font-family:var(--font-web);font-size:11px;color:var(--text-muted);padding:10px 2px 0}
.mini{margin-top:22px;background:var(--surface-dark);color:#fff;border-radius:var(--radius-md);padding:24px 26px;position:relative;overflow:hidden}
.mini .ear{position:absolute;top:0;right:0;width:0;height:0;border-top:18px solid rgba(255,255,255,.18);border-left:18px solid transparent}
.mini .lbl{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--neutral-400);font-weight:var(--fw-demi)}
.mini a{display:inline-block;margin-top:10px;color:#fff;font-weight:var(--fw-demi);font-size:15px;text-decoration:none}
.mini a:hover{color:var(--red-500);text-decoration:none}
/* Anterior / siguiente */
.pn{border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.pn .in{display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:center;padding-top:22px;padding-bottom:22px}
.pn .lbl{display:block;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted);font-weight:var(--fw-demi);margin-bottom:6px}
.pn .t{font-size:14px;font-weight:var(--fw-demi);line-height:1.45}
.pn .off .t{color:var(--neutral-300)}
.pn a{text-decoration:none;color:inherit}
.pn .back{justify-self:center;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:var(--fw-demi);color:var(--text-secondary);padding:8px 18px;border:1px solid var(--border-strong);border-radius:var(--radius-pill);transition:background-color var(--dur-base) var(--ease-standard),color var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard)}
.pn .back:hover{background:var(--auren-charcoal);border-color:var(--auren-charcoal);color:#fff}
.pn .nxt{text-align:right}
.pn .nxt .t{color:var(--brand-primary)}
.pn a.nxt:hover .t{color:var(--brand-primary-strong)}

/* ---------- 6. Componentes de la home completa (extensión del prototipo) ---------- */
/* Claim destacado + lista de puntos (sección "¿Qué nos hace diferentes?") */
.claim{margin:26px 0 0;font-size:clamp(20px,2.6vw,30px);font-weight:var(--fw-xlight);letter-spacing:.02em;text-transform:uppercase;line-height:1.3;max-width:30ch;text-wrap:balance}
.claim b{font-weight:var(--fw-demi);color:var(--brand-primary)}
.vlist{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:16px}
.vlist li{font-family:var(--font-web);font-size:14.5px;line-height:1.65;color:var(--text-secondary);padding-left:24px;position:relative}
.vlist li::before{content:"";position:absolute;left:0;top:8px;width:8px;height:8px;background:var(--brand-primary)}
.vlist b{color:var(--text-primary);font-weight:600}
/* Píldoras (Servicios 360º) */
.pills{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.pill{border:1px solid var(--border-strong);border-radius:var(--radius-pill);padding:10px 20px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:var(--fw-demi);color:var(--text-secondary)}
.pill.hi{border-color:var(--brand-primary);color:var(--brand-primary)}
/* Las 4 áreas de Auren */
.areas{display:grid;grid-template-columns:repeat(3,1fr);align-items:stretch;gap:clamp(14px,1.8vw,22px);margin-top:36px}
.area{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);padding:18px 18px 16px;display:flex;flex-direction:column;position:relative;overflow:hidden}
.area .ear{position:absolute;top:0;right:0;width:0;height:0;border-top:18px solid var(--neutral-100);border-left:18px solid transparent}
.area h3{margin:0;font-size:13.5px;font-weight:var(--fw-demi);letter-spacing:.06em;text-transform:uppercase;color:var(--text-primary)}
.area p{margin:11px 0 0;font-family:var(--font-web);font-size:12.5px;line-height:1.6;color:var(--text-secondary);flex:1}
.area.hl{border-color:var(--border)}
.area.hl h3{color:var(--service-consultoria)}
.area .tags{margin:12px 0 0;font-size:10.5px;letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--text-muted);font-weight:var(--fw-demi);line-height:1.75}
.area .alink{margin-top:10px;font-size:13px;font-weight:var(--fw-demi);color:var(--service-consultoria)}
.area .alink:hover{color:var(--service-consultoria);text-decoration:underline}
.areahl{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,1fr) clamp(200px,24vw,330px);gap:clamp(18px,2.6vw,38px);align-items:center;background:#eaf1e8;border:1px solid rgba(87,131,83,.45);border-top:3px solid var(--service-consultoria);border-radius:calc(var(--radius-md) + 6px);padding:clamp(12px,1.5vw,20px)}
.areahl .area{padding:clamp(18px,2vw,26px)}
.areahl .area h3{font-size:15px}
.areahl .area p{margin-top:13px;font-size:13.5px;max-width:82ch}
.areahl .area .tags{margin-top:16px;line-height:1.6}
.areahl .area .alink{margin-top:12px}
.diagrama{justify-self:center;align-self:center;width:100%;max-width:330px;height:auto;display:block;margin:0}
/* Panorámica de servicios (4 columnas) */
.pano{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3.2vw,40px);margin-top:40px}
.pcol h3{margin:0 0 4px;font-size:13px;font-weight:var(--fw-demi);letter-spacing:.08em;text-transform:uppercase;color:var(--text-primary);display:flex;align-items:center;gap:8px}
.pcol h3::after{content:"";width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:7px solid var(--brand-primary);flex:none}
.pcol .nota{font-family:var(--font-web);font-size:10.5px;color:var(--text-muted);margin:0 0 6px}
.pcol ul{list-style:none;margin:10px 0 0;padding:0}
.pcol li{font-family:var(--font-web);font-size:12.5px;line-height:1.5;color:var(--text-secondary);padding:6px 0;border-top:1px solid var(--neutral-100)}
.pcol li:first-child{border-top:0}
.pcol li a{color:var(--text-secondary)}
.pcol li a:hover{color:var(--brand-primary);text-decoration:none}
/* Otros servicios de Auren Consultoría */
.otros{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(14px,2vw,22px);margin-top:40px}
.otro{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);padding:22px 22px 20px}
.otro h3{margin:0;font-size:13.5px;font-weight:var(--fw-demi);letter-spacing:.04em;text-transform:uppercase;line-height:1.45;color:var(--text-primary);min-height:40px;text-align:center}
.otro ul{list-style:none;margin:14px 0 0;padding:0}
.otro li{font-family:var(--font-web);font-size:12px;line-height:1.5;color:var(--text-secondary);padding:5px 0 5px 16px;position:relative;border-top:1px solid var(--neutral-100)}
.otro li:first-child{border-top:0}
.otro li::before{content:"";position:absolute;left:2px;top:11px;width:5px;height:5px;background:var(--brand-primary)}
/* Referencias por ámbitos (4 bloques con collage) — una ficha por fila */
.refs{display:grid;grid-template-columns:1fr;gap:clamp(14px,1.8vw,20px);margin-top:40px}
.refb{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);padding:clamp(24px,3vw,32px);display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);grid-template-rows:auto 1fr;column-gap:clamp(24px,4vw,48px);row-gap:0;align-items:center}
.refb h3{margin:0;font-size:13.5px;font-weight:var(--fw-demi);letter-spacing:.08em;text-transform:uppercase;color:var(--text-primary);grid-column:1;grid-row:1;align-self:end}
.refb p{margin:12px 0 0;font-family:var(--font-web);font-size:13.5px;line-height:1.65;color:var(--text-secondary);grid-column:1;grid-row:2;align-self:start}
.refb .cl{margin:0;padding:0 0 0 clamp(24px,4vw,44px);border-left:1px solid var(--neutral-100);grid-column:2;grid-row:1 / span 2;align-self:center}
.refb .cl img{width:100%;max-width:640px;height:auto;display:block;margin:0 auto}
/* Listado tipográfico colapsable de referencias empresariales */
.reflist{margin-top:34px;border:1px solid var(--border);border-radius:var(--radius-md);background:#fff}
.reflist summary{cursor:pointer;list-style:none;padding:18px 24px;font-size:13.5px;font-weight:var(--fw-demi);letter-spacing:.05em;text-transform:uppercase;color:var(--brand-primary);display:flex;align-items:center;gap:10px}
.reflist summary::-webkit-details-marker{display:none}
.reflist summary::after{content:"";width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:7px solid var(--brand-primary);transition:transform var(--dur-base) var(--ease-standard)}
.reflist[open] summary::after{transform:rotate(180deg)}
.reflist .txt{padding:0 24px 22px;font-family:var(--font-web);font-size:12px;line-height:2;color:var(--text-muted);text-align:justify}
/* Placeholder de foto pendiente (canon §8 / 05 §3.14) */
.ph-foto{position:relative;border-radius:var(--radius-md);overflow:hidden;background:radial-gradient(420px 240px at 80% 115%,rgba(227,39,23,.4),transparent 65%),var(--surface-ink);min-height:260px;display:grid;place-items:center}
.ph-foto .tag{font-family:var(--font-label);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--neutral-400);border-left:3px solid var(--brand-primary);padding-left:12px}

/* ---------- Footer ---------- */
.ft{background:var(--surface-ink);color:#fff;border-top:1px solid rgba(255,255,255,.08);padding-top:clamp(44px,6vw,72px)}
.ft h4{margin:0 0 14px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--neutral-500);font-weight:var(--fw-demi)}
.ftop{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,44px)}
.fb img{height:38px;width:auto;display:block}
.fb .fk{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--neutral-400);margin:16px 0 0;line-height:1.6}
.fb .claim2{font-family:var(--font-web);font-size:13px;color:var(--neutral-400);line-height:1.65;margin:12px 0 0;max-width:300px}
.soc{display:flex;gap:16px;margin-top:20px}
.soc img{width:18px;height:18px;opacity:.75;transition:opacity var(--dur-base) var(--ease-standard)}
.soc a:hover img{opacity:1}
.ft a{text-decoration:none}
.fmail{color:#fff;font-weight:var(--fw-demi);font-size:15px}
.fmail:hover{color:var(--red-500);text-decoration:none}
.fkpi{font-family:var(--font-web);font-size:12.5px;color:var(--neutral-400);line-height:1.8;margin:14px 0 0}
.flink{display:block;font-family:var(--font-web);font-size:12.5px;color:var(--neutral-300);padding:3px 0}
.flink:hover{color:#fff}
.cities{font-family:var(--font-web);font-size:12.5px;color:var(--neutral-400);line-height:1.9;margin:0}
.fserv{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(24px,3vw,44px);border-top:1px solid rgba(255,255,255,.1);margin-top:clamp(32px,4vw,52px);padding-top:clamp(28px,4vw,44px)}
.fgt{display:block;color:#fff;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;font-weight:var(--fw-demi);margin-bottom:10px}
.fgt:hover{color:var(--neutral-300)}
.fserv ul{list-style:none;margin:0;padding:0}
.legal{display:flex;flex-wrap:wrap;gap:10px 24px;align-items:center;justify-content:space-between;border-top:1px solid rgba(255,255,255,.1);margin-top:clamp(32px,4vw,52px);padding:20px 0 24px}
.legal span{font-family:var(--font-web);font-size:11.5px;color:var(--neutral-500)}
.legal nav{display:flex;gap:20px}
.legal a{font-family:var(--font-web);font-size:11.5px;color:var(--neutral-400)}
.legal a:hover{color:#fff;text-decoration:none}

/* ---------- 7. Media queries ---------- */
@media (min-width:900px){.cols2{column-count:2;column-gap:44px}.cols2 p{break-inside:avoid}}
@media (max-width:1230px){.hk{display:none}}
@media (max-width:980px){
.burger{display:flex}
.menu{display:none;position:absolute;top:76px;left:calc(-1*clamp(20px,5vw,48px));right:calc(-1*clamp(20px,5vw,48px));background:var(--surface-ink);flex-direction:column;align-items:flex-start;padding:20px clamp(20px,5vw,48px) 28px;gap:18px;border-bottom:1px solid rgba(255,255,255,.12)}
#nv:checked ~ .menu{display:flex}
.g2{grid-template-columns:1fr}
.lcs{grid-template-columns:1fr 1fr}
.ftop{grid-template-columns:1fr 1fr}
.ftop .fb{grid-column:1 / -1}
.fserv{grid-template-columns:1fr 1fr}
.cards{grid-template-columns:1fr 1fr}
.certs{grid-template-columns:repeat(5,1fr)}
.areas{grid-template-columns:1fr 1fr}
.areahl{grid-column:1 / -1;grid-template-columns:1fr;justify-items:center}
.diagrama{max-width:270px;margin:4px auto 6px}
.pano{grid-template-columns:1fr 1fr}
.otros{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
.art .grid{grid-template-columns:1fr}
.pn .in{grid-template-columns:1fr 1fr}
.pn .back{grid-column:1 / -1;justify-self:start;order:3}
}
@media (max-width:720px){
.tsts{grid-template-columns:1fr}
.lcs{grid-template-columns:1fr}
.sus{grid-template-columns:1fr}
.sus .im{order:-1;min-height:220px}
.of{grid-template-columns:1fr 1fr}
.ftop{grid-template-columns:1fr}
.fserv{grid-template-columns:1fr}
.rank .bar{font-size:11px;padding:6px 10px;line-height:1.4}
.refs{grid-template-columns:1fr}
.refb{grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:0}
.refb h3,.refb p{grid-column:1;grid-row:auto}
.refb .cl{grid-column:1;grid-row:auto;margin-top:18px;padding:16px 0 0;border-left:0;border-top:1px solid var(--neutral-100)}
}
@media (max-width:640px){
.cards{grid-template-columns:1fr}
.certs{grid-template-columns:repeat(3,1fr)}
.areas{grid-template-columns:1fr}
.diagrama{max-width:230px}
.pano{grid-template-columns:1fr}
.otros{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
*,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important}
}

/* ---------- 8. Ampliación jul-2026: barra utilitaria · casos · novedades · equipo ---------- */
/* Barra utilitaria (nav secundaria, encima del header) */
.ub{background:var(--auren-black);border-bottom:1px solid rgba(255,255,255,.09)}
.ub-in{display:flex;align-items:center;gap:18px;min-height:36px;flex-wrap:wrap}
.ub a{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:var(--fw-demi);color:var(--neutral-400);padding:9px 0}
.ub a:hover{color:#fff;text-decoration:none}
.ub a.on{color:#fff}
.ub .ub-mail{font-family:var(--font-web);font-size:12px;letter-spacing:0;text-transform:none;font-weight:var(--fw-book);color:var(--neutral-300)}
.ub-nav{margin-left:auto;display:flex;gap:clamp(14px,2vw,24px);flex-wrap:wrap}
/* Marcador de contenido pendiente de entrega del cliente */
.tagp{display:inline-block;font-family:var(--font-label);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted);border-left:3px solid var(--brand-primary);padding-left:10px}
/* Casos de éxito */
.casos{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.2vw,24px);margin-top:40px}
.caso{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);padding:26px 26px 24px;position:relative;overflow:hidden;display:flex;flex-direction:column}
.caso .ear{position:absolute;top:0;right:0;width:0;height:0;border-top:18px solid var(--neutral-100);border-left:18px solid transparent}
.caso .ln{font-size:11px;letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--brand-primary);font-weight:var(--fw-demi)}
.caso h3{margin:12px 0 0;font-size:16px;font-weight:var(--fw-demi);letter-spacing:.02em;text-transform:uppercase;line-height:1.4}
.caso dl{margin:18px 0 0;display:grid;gap:14px;flex:1}
.caso dt{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted);font-weight:var(--fw-demi)}
.caso dd{margin:5px 0 0;font-family:var(--font-web);font-size:13px;line-height:1.6;color:var(--text-secondary)}
.caso.pend{border:1px dashed var(--border-strong);background:var(--surface-subtle)}
.caso.pend dd{color:var(--text-muted);font-style:italic}
.sectores{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
/* Novedades */
.novs{margin-top:36px;border-top:1px solid var(--border)}
.nov{display:grid;grid-template-columns:104px 1fr auto;gap:clamp(14px,3vw,32px);align-items:start;padding:24px 0;border-bottom:1px solid var(--border);text-decoration:none;color:inherit;transition:background-color var(--dur-base) var(--ease-standard)}
.nov:hover{background:var(--surface-subtle);text-decoration:none;color:inherit}
.nov .dt{font-family:var(--font-label);font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);padding-top:3px}
.nov h3{margin:0;font-size:16px;font-weight:var(--fw-demi);letter-spacing:.01em;line-height:1.4}
.nov p{margin:8px 0 0;font-family:var(--font-web);font-size:13.5px;line-height:1.6;color:var(--text-secondary);max-width:70ch}
.nov .go{align-self:center;font-size:13px;font-weight:var(--fw-demi);color:var(--brand-primary);white-space:nowrap}
.nov.pend{border-bottom:1px dashed var(--border-strong)}
.nov.pend h3{color:var(--text-muted)}
.tp{display:inline-block;margin:0 0 9px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:var(--fw-demi);color:var(--brand-primary);background:var(--red-100);border:1px solid var(--red-100);border-radius:var(--radius-pill);padding:4px 11px}
.tp.g{color:var(--service-consultoria);background:rgba(87,131,83,.12);border-color:rgba(87,131,83,.22)}
.tp.n{color:var(--text-secondary);background:var(--neutral-100);border-color:var(--neutral-200)}
/* Newsletter */
.nl{margin-top:clamp(34px,5vw,52px);border-radius:var(--radius-md);padding:clamp(26px,4vw,42px);color:#fff;display:grid;grid-template-columns:1.3fr auto;gap:clamp(20px,3vw,36px);align-items:center;background:radial-gradient(520px 280px at 88% 130%,rgba(227,39,23,.45),transparent 66%),var(--surface-ink)}
.nl .kick{color:var(--neutral-300)}
.nl h3{margin:12px 0 0;font-size:clamp(22px,2.6vw,30px);font-weight:var(--fw-xlight);text-transform:uppercase;letter-spacing:.02em;line-height:1.2}
.nl p{margin:14px 0 0;font-family:var(--font-web);font-size:14px;line-height:1.65;color:var(--neutral-300);max-width:56ch}
/* Equipo */
.pers{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,22px);margin-top:36px}
.per{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden}
.per .av{aspect-ratio:1/1;display:grid;place-items:center;padding:16px;text-align:center;background:radial-gradient(220px 160px at 78% 118%,rgba(227,39,23,.38),transparent 66%),var(--surface-ink)}
.per .av .tagp{color:var(--neutral-400)}
.per .tx{padding:18px 20px 20px}
.per h3{margin:0;font-size:15px;font-weight:var(--fw-demi);letter-spacing:.02em}
.per .rl{margin:6px 0 0;font-family:var(--font-web);font-size:12.5px;line-height:1.5;color:var(--text-muted)}
.per .pm{display:inline-block;margin-top:12px;font-family:var(--font-web);font-size:12.5px;font-weight:600;color:var(--brand-primary)}
/* Colores de línea de servicio (barras de las portadas de división) */
:root{--line-auditoria:#A85B1B;--line-legal:#4E7276;--line-corporate:#A20057}
.area.au{border-color:var(--line-auditoria);border-top:3px solid var(--line-auditoria)}
.area.au h3{color:var(--line-auditoria)}
.area.lg{border-color:var(--line-legal);border-top:3px solid var(--line-legal)}
.area.lg h3{color:var(--line-legal)}
.area.co{border-color:var(--line-corporate);border-top:3px solid var(--line-corporate)}
.area.co h3{color:var(--line-corporate)}
/* Énfasis rojo en línea (una sola vez por bloque, regla de datos del DS) */
.emr{color:var(--brand-primary);font-weight:var(--fw-demi)}
/* Énfasis neutro: idea principal en carbón sobre párrafo gris */
.em{color:var(--text-primary);font-weight:600}
/* Énfasis sobre fondo oscuro (el rojo no llega a contraste AA en cuerpo) */
.emw{color:#fff;font-weight:600}
/* Histórico de webinars y eventos — auto-fit centrado: una sola ficha queda centrada
   y al añadir más se reparten (hasta 3 por fila) sin perder el centrado */
.evs{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,340px));justify-content:center;gap:clamp(18px,2.5vw,26px);margin-top:36px}
.ev[hidden]{display:none}
.ev{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;display:flex;flex-direction:column}
.ev.pend{border:1px dashed var(--border-strong);background:var(--surface-subtle)}
.ev .im{height:160px;overflow:hidden;background:var(--surface-ink)}
.ev .im img{width:100%;height:100%;object-fit:cover;display:block}
.ev .ph-im{display:grid;place-items:center;background:radial-gradient(260px 160px at 78% 118%,rgba(227,39,23,.34),transparent 66%),var(--surface-ink)}
.ev .ph-im .tagp{color:var(--neutral-400)}
.ev .tx{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.ev .mt{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ev .mt .tp,.mt .tp{margin:0}
.ev .dt{font-family:var(--font-label);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted)}
.ev h3{margin:12px 0 0;font-size:16px;font-weight:var(--fw-demi);letter-spacing:.01em;line-height:1.4}
.ev p{margin:10px 0 0;font-family:var(--font-web);font-size:13px;line-height:1.6;color:var(--text-secondary);flex:1}
.ev .sp{margin:12px 0 0;font-size:12px;color:var(--text-muted);line-height:1.5;flex:none}
.ev .lk{display:flex;flex-wrap:wrap;gap:16px;margin-top:18px;padding-top:16px;border-top:1px solid var(--neutral-100)}
.ev .lk a{font-size:13px;font-weight:var(--fw-demi);color:var(--brand-primary)}
.ev .lk a:hover{color:var(--brand-primary-strong)}
/* Banda de cifras centrada */
.kpis.mid{justify-content:center;align-items:center;text-align:center}
.kpis.mid .kpi span{margin-left:auto;margin-right:auto}
/* Fila de acciones de los teasers de la home */
.tz{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-top:30px}
@media (max-width:980px){
.casos{grid-template-columns:1fr 1fr}
.pers{grid-template-columns:1fr 1fr}
.nl{grid-template-columns:1fr}
}
@media (max-width:720px){
.casos{grid-template-columns:1fr}
.nov{grid-template-columns:1fr}
.nov .dt{padding-top:0}
.nov .go{align-self:start}
.ub .ub-mail{display:none}
.ub-nav{margin-left:0}
}
@media (max-width:640px){.pers{grid-template-columns:1fr}}

/* ---------- 9. Home v2 (rediseño comercial jul-2026) ---------- */
/* CTA intermedio repetido (ritmo de 4 CTA idénticos) */
.ctam{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:clamp(38px,5vw,56px);padding-top:clamp(30px,4vw,42px);border-top:1px solid var(--border)}
.ctam .mail{font-family:var(--font-web);font-size:13.5px;color:var(--text-muted);margin:0}
.ctam .mail a{color:var(--text-secondary)}
.ctam .mail a:hover{color:var(--brand-primary);text-decoration:none}
/* Diagrama de los 3 pilares con leyenda (pilar destacado en verde) */
.diag{margin:0}
.dg{position:relative}
.dg img{width:100%;height:auto;display:block}
.pil{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:center}
.pil li{display:flex;align-items:center;gap:9px;font-size:11.5px;letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--text-muted)}
.pil i{width:11px;height:11px;flex:none;background:var(--neutral-400)}
.pil .on{color:var(--service-consultoria);font-weight:var(--fw-demi)}
.pil .on i{background:var(--service-consultoria)}
.diag figcaption{margin:18px auto 0;font-family:var(--font-web);font-size:12.5px;line-height:1.6;color:var(--text-muted);text-align:center;max-width:44ch}
/* Preguntas-dolor, cada una enlazada al servicio que la resuelve */
.qs{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(28px,4vw,56px);margin-top:38px;border-top:1px solid var(--border)}
.q{display:flex;flex-direction:column;gap:7px;padding:20px 0;border-bottom:1px solid var(--border);text-decoration:none;color:inherit}
.q:hover{text-decoration:none;color:inherit}
.q p{margin:0;font-family:var(--font-web);font-size:14.5px;line-height:1.55;color:var(--text-primary);text-wrap:pretty}
.q span{font-size:11px;letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--text-muted);font-weight:var(--fw-demi)}
.q:hover span{color:var(--brand-primary)}
/* Tarjeta de línea v2: frase de resultado + los 6 subservicios enlazados uno a uno */
.lc .res{font-family:var(--font-web);font-size:13px;line-height:1.55;color:var(--text-muted);margin:10px 0 0;padding:0 22px;text-wrap:pretty}
.lc h3 a{color:inherit;text-decoration:none}
.lc h3 a:hover{color:var(--brand-primary);text-decoration:none}
.lc li a{display:block;color:var(--text-secondary);text-decoration:none}
.lc li a:hover{color:var(--brand-primary);text-decoration:none}
article.lc .go{display:block;text-decoration:none}
article.lc .go:hover{color:var(--brand-primary-strong);text-decoration:none}
/* Ventajas de la sección oscura "¿Por qué Auren Consultoría?" */
.vent{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,3.4vw,44px);margin-top:44px}
.vent article{border-top:1px solid rgba(255,255,255,.16);padding-top:20px}
.vent h3{margin:0;font-size:clamp(19px,2vw,23px);font-weight:var(--fw-book);letter-spacing:.01em;line-height:1.3;color:#fff;text-wrap:pretty}
.vent .hi{color:var(--brand-primary);font-weight:var(--fw-bold)}
.vent p{margin:12px 0 0;font-family:var(--font-web);font-size:14px;line-height:1.7;color:var(--neutral-300);max-width:44ch}
/* Franja discreta de sellos dentro de la sección oscura */
.dark .clbl{margin:clamp(44px,5vw,64px) 0 18px;padding-top:clamp(28px,3.5vw,40px);border-top:1px solid rgba(255,255,255,.16);color:var(--neutral-400)}
.certs.strip{margin-top:0;gap:10px}
.dark .certs.strip .cert{min-height:86px;border-color:transparent}
.dark .certs.strip .cert img{max-height:52px}
/* Fases del proceso */
.fases{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,2.6vw,32px);margin-top:44px}
.fase{border-top:2px solid var(--neutral-200);padding-top:18px}
.fase:first-child{border-top-color:var(--brand-primary)}
.fase b{display:block;font-family:var(--font-label);font-size:13px;letter-spacing:.12em;color:var(--text-muted)}
.fase h3{margin:10px 0 0;font-size:17px;font-weight:var(--fw-demi);text-transform:uppercase;letter-spacing:.04em;line-height:1.35}
.fase p{margin:12px 0 0;font-family:var(--font-web);font-size:13.5px;line-height:1.65;color:var(--text-secondary);text-wrap:pretty}
/* Preguntas frecuentes */
.faqs{margin-top:38px;border-top:1px solid var(--border)}
.faq{border-bottom:1px solid var(--border)}
.faq summary{cursor:pointer;list-style:none;padding:20px 0;display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:16px;font-weight:var(--fw-demi);letter-spacing:.01em;line-height:1.4}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:7px solid var(--brand-primary);transition:transform var(--dur-base) var(--ease-standard)}
.faq[open] summary::after{transform:rotate(180deg)}
.faq p{margin:0 0 22px;font-family:var(--font-web);font-size:14.5px;line-height:1.7;color:var(--text-secondary);max-width:70ch}
.faq p.pend{color:var(--text-muted);font-style:italic}
/* Encabezado de subsección + rejilla de 2 casos */
.h3s{margin:clamp(48px,6vw,72px) 0 0;font-size:clamp(20px,2.2vw,26px);font-weight:var(--fw-xlight);letter-spacing:var(--tracking-caps);text-transform:uppercase}
.casos.two{grid-template-columns:1fr 1fr;margin-top:26px}
/* Rejilla de logos centrada también en la última fila (flex: grid centra los tracks, no los items) */
.certs.logos.mid{display:flex;flex-wrap:wrap;justify-content:center;gap:14px}
.certs.logos.mid .cert{flex:0 0 150px}
/* Footer: las tres columnas de arriba comparten la rejilla de .fserv (3×1fr) y arrancan
   en la misma línea base — la fila de etiquetas se alinea con «ESTRATEGIA Y PROCESOS»,
   no con el logo. Espaciado por grupos (.fgrp) en vez de márgenes sueltos. */
.ftop{align-items:start}
.ft .fb{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.ft .fb .fk,.ft .fb .claim2{margin:0}
.ft .fb .claim2{max-width:34ch}
.ft .soc{margin:6px 0 0}
.ft .cities{margin:0}
.ft .fkpi{margin:0}
.fcol{display:flex;flex-direction:column;gap:32px}
.fgrp h4{margin:0 0 12px}
.fgrp .fmail,.fgrp .flink{display:block}
.fgrp .fmail{line-height:1.5}
@media (max-width:980px){
.dg{max-width:440px;margin:0 auto}
.fases{grid-template-columns:1fr 1fr}
.casos.two{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
.qs{grid-template-columns:1fr}
.vent{grid-template-columns:1fr}
}
@media (max-width:720px){
.fases{grid-template-columns:1fr}
.casos.two{grid-template-columns:1fr}
}

/* Pie centrado. Decision del 21/09/2026: el bloque «¿Como podemos ayudarte?» ya venia con su
   texto centrado, y el pie alineado a la izquierda hacia que el conjunto se leyera desequilibrado
   aunque los margenes de los tres bloques coincidieran al pixel. Se centra el CONTENIDO del pie,
   no sus margenes, que ya estaban bien. La franja legal se queda como estaba: son dos extremos
   enfrentados, no una columna. Va al final del fichero a proposito, para ganar tambien dentro de
   las consultas de medios y que el movil quede igual de centrado. */
.ft .ftop,.ft .fserv{text-align:center}
.ft .fb{align-items:center}
.ft .fb .claim2,.ft .cities{margin-left:auto;margin-right:auto}
.ft .soc{justify-content:center}
.ft .fcol{align-items:center}

/* Bloque de entrada de las cuatro paginas de linea: texto a la izquierda, foto a la derecha,
   colgando del heroe negro. Reutiliza la rejilla de .art para no duplicar maquetacion; lo unico
   propio es quitar el margen superior de .copy, que en una pagina de servicio separa el texto del
   <h1> y aqui no tiene <h1> delante que separar. Decision del 21/09/2026: las cuatro lineas
   comparten patron, porque hasta hoy cadena-de-suministro usaba el molde de una pagina de servicio
   y las otras tres no llevaban foto. */
.art.lintro .copy{margin-top:0}