/* ============================================================================
   FARELLO ASESORES DE SEGUROS — Landing
   Construida sobre el Design System oficial: dos colores (magenta + violeta),
   neutros cálidos, mucho espacio en blanco, FF Mark Pro, gesto diagonal de marca.
   ============================================================================ */

/* -------- Tipografía --------------------------------------------------------
   Sitio público: Mulish (Google Fonts, gratis) — humanista geométrica, muy
   cercana a FF Mark Pro. Se carga desde index.html.
   NOTA: FF Mark Pro (la fuente de marca) requiere licencia Webfont anual de
   Monotype por dominio. Si se adquiere, agregar acá el @font-face del
   self-hosting kit oficial y anteponerla en --font. La licencia desktop (.otf)
   NO habilita uso web, por eso no se incluye en el deploy.
--------------------------------------------------------------------------- */

:root {
  /* Marca */
  --magenta:      #DF3569;
  --magenta-600:  #C42757;
  --magenta-700:  #A81E48;
  --magenta-100:  #FDE7EE;
  --magenta-50:   #FEF4F7;
  --purple:       #6C2A88;
  --purple-600:   #581F70;
  --purple-700:   #431657;
  --purple-300:   #C9A3DB;   /* acento sobre fondo oscuro */
  --purple-100:   #EDE2F2;
  --purple-50:    #F7F1FA;
  --magenta-300:  #F4A7C0;   /* acento sobre fondo oscuro */

  /* Neutros cálidos (sesgo violeta — nunca grises fríos ni negro puro) */
  --ink-900:#1A1320; --ink-800:#2B2034; --ink-700:#463A52; --ink-600:#6B5E77;
  --ink-500:#8C8196; --ink-400:#B5ABBD; --ink-300:#D8D1DE; --ink-200:#EAE5EE;
  --ink-100:#F4F0F7; --ink-50:#FAF8FB; --white:#fff;

  --fg-1:var(--ink-900); --fg-2:var(--ink-700); --fg-3:var(--ink-500);
  --bg-1:#fff; --bg-2:var(--ink-50); --bg-3:var(--ink-100);

  --success:#1E9E6A; --whatsapp:#25D366; --whatsapp-600:#1EBE5D;

  --border-1:var(--ink-200); --border-2:var(--ink-300); --border-brand:var(--magenta-100);

  /* Gesto de marca: diagonal dura magenta→violeta (una vez por página) */
  --grad-brand: linear-gradient(115deg, var(--magenta) 0%, var(--magenta) 48%, var(--purple) 48%, var(--purple) 100%);
  --grad-brand-soft: linear-gradient(125deg, var(--magenta) 0%, var(--purple) 100%);
  --grad-wash: linear-gradient(180deg, var(--magenta-50) 0%, #fff 60%);

  /* Sombras suaves, tinte violeta — nunca gris puro */
  --shadow-xs:0 1px 2px rgba(26,19,32,.05);
  --shadow-sm:0 2px 6px rgba(26,19,32,.06),0 1px 2px rgba(26,19,32,.04);
  --shadow-md:0 8px 20px rgba(26,19,32,.08),0 2px 4px rgba(26,19,32,.04);
  --shadow-lg:0 20px 40px rgba(26,19,32,.10),0 4px 8px rgba(26,19,32,.05);
  --shadow-brand:0 10px 24px rgba(223,53,105,.25);

  /* Radios — "amable, no infantil"; 12px es la esquina Farello */
  --r-xs:4px; --r-sm:8px; --r-md:12px; --r-lg:20px; --r-xl:28px; --r-pill:999px;

  --font: 'Mulish','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;

  --ease:cubic-bezier(.2,0,0,1);
  --ease-soft:cubic-bezier(.32,.72,0,1);

  --maxw:1140px;
  --pad:clamp(1.1rem,4vw,2rem);
}

/* -------- Reset -------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}*{animation-duration:.01ms!important;transition-duration:.01ms!important;}}
body{font:400 16px/1.55 var(--font);color:var(--fg-1);background:var(--ink-50);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,h4{font-family:var(--font);letter-spacing:-.01em;line-height:1.1;}
::selection{background:var(--magenta-100);color:var(--purple-700);}
:focus-visible{outline:2px solid var(--magenta);outline-offset:2px;border-radius:var(--r-sm);}

.container{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad);}
.hide-mobile{display:none;}

/* Glifo chevron de marca */
.chev{color:var(--magenta);font-weight:900;}
.tx-mag{color:var(--magenta);} .tx-pur{color:var(--purple);}

/* -------- Overline (única mayúscula permitida) -------- */
.overline{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:.75rem;
  text-transform:uppercase;letter-spacing:.08em;color:var(--magenta);}

/* ============================================================================
   BOTONES — CTAs primarios siempre pill
   ============================================================================ */
.btn{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:.97rem;
  padding:.8rem 1.4rem;border-radius:var(--r-pill);cursor:pointer;border:1.5px solid transparent;
  transition:transform var(--dur,.18s) var(--ease),box-shadow .2s var(--ease),background .18s,border-color .18s,color .18s;
  white-space:nowrap;line-height:1;}
.btn svg{width:18px;height:18px;}
.btn:active{transform:scale(.98);}
.btn--wa{background:var(--whatsapp);color:#fff;box-shadow:var(--shadow-sm);}
.btn--wa:hover{background:var(--whatsapp-600);box-shadow:var(--shadow-md);transform:translateY(-1px);}
.btn--mag{background:var(--magenta);color:#fff;box-shadow:var(--shadow-brand);}
.btn--mag:hover{background:var(--magenta-600);transform:translateY(-1px);}
.btn--ghost{background:transparent;color:var(--magenta);border-color:var(--magenta-100);}
.btn--ghost:hover{background:var(--magenta-50);border-color:var(--magenta);}
.btn--light{background:#fff;color:var(--purple-700);}
.btn--light:hover{transform:translateY(-1px);box-shadow:var(--shadow-md);}
.btn--on-grad{background:#fff;color:var(--magenta-700);}
/* Outline claro para fondos oscuros (hero) */
.btn--outline-light{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.30);backdrop-filter:blur(4px);}
.btn--outline-light:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.6);transform:translateY(-1px);}
/* CTA de EMISIÓN ONLINE — el imán: gradiente de marca + pulso suave */
.btn--emit{background:var(--grad-brand-soft);color:#fff;font-weight:800;font-size:1.03rem;
  padding:.95rem 1.7rem;box-shadow:0 10px 28px rgba(223,53,105,.45);
  animation:emitPulse 2.8s var(--ease) infinite;}
.btn--emit svg{width:20px;height:20px;}
.btn--emit:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(223,53,105,.6);animation:none;}
@keyframes emitPulse{0%,100%{box-shadow:0 10px 28px rgba(223,53,105,.45);}50%{box-shadow:0 12px 38px rgba(223,53,105,.75);}}
@media (prefers-reduced-motion:reduce){.btn--emit{animation:none;}}
/* Nota de urgencia bajo los CTAs del hero */
.hero__now{display:flex;align-items:center;gap:.45rem;font-size:.85rem;font-weight:600;
  color:rgba(255,255,255,.85);margin:-1rem 0 1.6rem;}
.hero__now .chev{color:var(--magenta-300);}

/* ============================================================================
   NAV
   ============================================================================ */
.nav{position:fixed;inset:0 0 auto 0;z-index:100;transition:background .3s,box-shadow .3s,border-color .3s;border-bottom:1px solid transparent;}
.nav.is-scrolled{background:rgba(255,255,255,.85);backdrop-filter:saturate(140%) blur(12px);border-bottom-color:var(--border-1);box-shadow:var(--shadow-xs);}
.nav__inner{display:flex;align-items:center;justify-content:space-between;height:64px;gap:1rem;}
.nav__brand{display:flex;align-items:center;}
.nav__brand img{height:30px;width:auto;transition:filter .3s;}
.nav__links{display:none;align-items:center;gap:1.6rem;}
.nav__links a:not(.btn){font-size:.95rem;font-weight:500;color:rgba(255,255,255,.9);transition:color .18s;}
.nav__links a:not(.btn):hover{color:#fff;}
.nav__links a.btn{color:#fff;}
.nav__burger{display:flex;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px;}
.nav__burger span{width:24px;height:2px;background:#fff;border-radius:2px;transition:.3s var(--ease);}

/* Sobre el hero oscuro: logo en blanco. Al hacer scroll vuelve a su color. */
.nav__brand img{filter:brightness(0) invert(1);}
.nav.is-scrolled .nav__brand img{filter:none;}
.nav.is-scrolled .nav__links a:not(.btn){color:var(--fg-2);}
.nav.is-scrolled .nav__links a:not(.btn):hover{color:var(--magenta-700);}
.nav.is-scrolled .nav__burger span{background:var(--ink-900);}
/* Menú mobile abierto (panel blanco): texto oscuro */
.nav__links.is-open a:not(.btn){color:var(--fg-2);}
.nav__burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav__burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav__burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.nav__links.is-open{display:flex;flex-direction:column;align-items:flex-start;gap:1.1rem;position:absolute;top:64px;left:0;right:0;padding:1.4rem var(--pad) 1.8rem;background:rgba(255,255,255,.97);backdrop-filter:blur(12px);border-bottom:1px solid var(--border-1);box-shadow:var(--shadow-md);}
.nav__links.is-open a{font-size:1.1rem;}

/* ============================================================================
   HERO — cinematográfico. El gesto de marca a pantalla, con soporte de
   foto/video de fondo y un scrim que mantiene el título siempre legible.
   ============================================================================ */
.hero{position:relative;isolation:isolate;display:flex;align-items:center;
  min-height:clamp(600px,94vh,940px);
  padding:clamp(7.5rem,16vh,11rem) 0 clamp(4.5rem,10vh,7rem);
  color:#fff;background:var(--ink-900);overflow:hidden;}

/* Base de marca (visible si no hay foto/video): gradiente diagonal con profundidad */
.hero::before{content:"";position:absolute;inset:0;z-index:-4;
  background:
    radial-gradient(95% 90% at 82% 8%, rgba(223,53,105,.50) 0%, transparent 52%),
    radial-gradient(85% 85% at 0% 100%, rgba(108,42,136,.62) 0%, transparent 56%),
    linear-gradient(142deg,#1A1320 0%,#2B1430 36%,#5A1A4C 70%,#7E1F51 100%);}

/* Capa de media (foto o video) — inyectada por JS si CONFIG.heroMedia tiene src */
.hero__bg{position:absolute;inset:0;z-index:-3;overflow:hidden;}
.hero__bg img,.hero__bg video{width:100%;height:100%;object-fit:cover;
  opacity:.42;filter:saturate(1.05) contrast(1.02);}

/* Scrim: asegura contraste del título sobre cualquier imagen */
.hero__scrim{position:absolute;inset:0;z-index:-2;
  background:linear-gradient(90deg,rgba(22,13,28,.93) 0%,rgba(22,13,28,.66) 44%,rgba(126,31,81,.30) 100%);}
@media (min-width:760px){.hero__scrim{background:linear-gradient(90deg,rgba(22,13,28,.90) 0%,rgba(22,13,28,.55) 50%,rgba(126,31,81,.16) 100%);}}

/* Glows suaves animados — dan vida sin distraer */
.hero__glow{position:absolute;z-index:-1;border-radius:50%;filter:blur(64px);opacity:.5;pointer-events:none;}
.hero__glow--1{width:36vw;height:36vw;max-width:480px;max-height:480px;top:-8%;right:5%;
  background:radial-gradient(circle,var(--magenta),transparent 70%);animation:floatA 15s var(--ease-soft) infinite;}
.hero__glow--2{width:32vw;height:32vw;max-width:420px;max-height:420px;bottom:-10%;left:-5%;
  background:radial-gradient(circle,var(--purple),transparent 70%);animation:floatB 19s var(--ease-soft) infinite;}
@keyframes floatA{0%,100%{transform:translate(0,0)}50%{transform:translate(-26px,28px)}}
@keyframes floatB{0%,100%{transform:translate(0,0)}50%{transform:translate(24px,-22px)}}
@media (prefers-reduced-motion:reduce){.hero__glow{animation:none!important}}

/* Chevron gigante de marca, como marca de agua */
.hero__chev{position:absolute;right:-4%;top:50%;transform:translateY(-50%);font-size:44vw;line-height:0;
  font-weight:900;color:#fff;opacity:.045;pointer-events:none;user-select:none;z-index:-1;}

.hero__inner{position:relative;z-index:1;max-width:800px;}
.hero .overline{color:var(--magenta-300);margin-bottom:1.1rem;}
.hero__title{font-weight:900;font-size:clamp(2.6rem,7.2vw,4.8rem);line-height:1.0;letter-spacing:-.025em;
  margin:1rem 0 1.3rem;color:#fff;text-wrap:balance;}
.hero__title .tx-mag{color:var(--magenta-300);}
.hero__title .tx-pur{color:var(--purple-300);}
.hero__sub{font-weight:500;font-size:clamp(1.08rem,2.2vw,1.34rem);line-height:1.5;color:rgba(255,255,255,.84);
  max-width:600px;margin-bottom:2rem;}
.hero__ctas{display:flex;flex-wrap:wrap;gap:.7rem;margin-bottom:1.8rem;}

/* Credenciales reales (confianza inmediata) */
.hero__creds{display:flex;flex-wrap:wrap;gap:.55rem;margin-bottom:2.2rem;}
.hero__cred{display:inline-flex;align-items:center;gap:.4rem;font-size:.8rem;font-weight:600;
  color:rgba(255,255,255,.88);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);
  padding:.42rem .85rem;border-radius:var(--r-pill);backdrop-filter:blur(4px);}
.hero__cred .chev{color:var(--magenta-300);}

.hero__trust{display:flex;flex-direction:column;gap:.7rem;}
.hero__trust-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:rgba(255,255,255,.55);font-weight:700;}
.hero__trust-logos{display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;align-items:center;}
.hero__trust-logos img{height:28px;width:auto;opacity:.95;}
.hero__trust-logos .partner{display:inline-flex;align-items:center;gap:.45rem;font-weight:600;color:#fff;font-size:.95rem;}
.hero__trust-logos .partner::before{content:"›";color:var(--magenta-300);font-weight:900;}

/* Cue de scroll */
.hero__scroll{position:absolute;left:50%;bottom:1.3rem;transform:translateX(-50%);z-index:1;
  display:flex;flex-direction:column;align-items:center;gap:.3rem;color:rgba(255,255,255,.55);
  font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;}
.hero__scroll svg{width:18px;height:18px;animation:bobble 2s var(--ease) infinite;}
@keyframes bobble{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
@media (prefers-reduced-motion:reduce){.hero__scroll svg{animation:none}}

/* ============================================================================
   SECCIONES
   ============================================================================ */
.section{padding:clamp(3.5rem,9vh,6.5rem) 0;position:relative;background:var(--magenta-50);}
.section--tint{background:var(--purple-50);}
.section--wash{background:var(--ink-50);}
.section__head{max-width:720px;margin-bottom:clamp(2.2rem,5vw,3.4rem);}
.section__title{font-weight:900;font-size:clamp(1.8rem,4.4vw,2.8rem);line-height:1.08;color:var(--ink-900);margin:.7rem 0 .9rem;}
.section__lead{font-weight:500;font-size:clamp(1.02rem,2vw,1.18rem);color:var(--fg-2);}
.section__sign{margin-top:clamp(2rem,5vw,3rem);text-align:center;font-weight:700;font-size:clamp(1.2rem,3vw,1.7rem);color:var(--purple-700);letter-spacing:-.01em;}
.section__sign .chev{margin-right:.3rem;}

.grid{display:grid;gap:clamp(.9rem,2.2vw,1.4rem);}
.grid--3{grid-template-columns:1fr;}
.grid--4{grid-template-columns:1fr;}

/* ============================================================================
   CARDS — Qué resolvemos (esquina Farello 12px, sombra suave)
   ============================================================================ */
.card{background:#fff;border:1px solid var(--border-1);border-radius:var(--r-md);padding:1.5rem 1.4rem;
  box-shadow:var(--shadow-sm);transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s;position:relative;overflow:hidden;}
.card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--magenta);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease);}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--border-brand);}
.card:hover::before{transform:scaleX(1);}
.card__icon{width:48px;height:48px;display:grid;place-items:center;border-radius:var(--r-md);background:var(--magenta-50);color:var(--magenta);margin-bottom:1rem;}
.card__icon svg{width:26px;height:26px;}
.card__title{font-weight:700;font-size:1.2rem;margin-bottom:.45rem;}
.card__desc{font-size:.95rem;color:var(--fg-2);margin-bottom:1rem;}
.card__desc strong{color:var(--purple-700);font-weight:700;}
.card__list{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;}
.card__list li{font-size:.78rem;font-weight:600;color:var(--purple-700);background:var(--purple-50);padding:.28rem .65rem;border-radius:var(--r-xs);}

/* ============================================================================
   PILARES — Por qué nosotros (uno destacado: magenta-50 + border-left)
   ============================================================================ */
.pillar{background:#fff;border:1px solid var(--border-1);border-radius:var(--r-md);padding:1.8rem 1.6rem;box-shadow:var(--shadow-sm);transition:transform .2s var(--ease),box-shadow .2s;}
.pillar:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}
.pillar--feature{background:var(--magenta-50);border:1px solid var(--magenta-100);border-left:3px solid var(--magenta);}
.pillar__icon{width:52px;height:52px;display:grid;place-items:center;border-radius:var(--r-md);background:var(--white);color:var(--magenta);border:1px solid var(--border-1);margin-bottom:1rem;}
.pillar--feature .pillar__icon{background:#fff;border-color:var(--magenta-100);}
.pillar__icon svg{width:28px;height:28px;}
.pillar__num{font-weight:900;font-size:.85rem;color:var(--magenta);letter-spacing:.08em;margin-bottom:.4rem;}
.pillar__title{font-weight:700;font-size:1.3rem;margin-bottom:.5rem;}
.pillar__desc{font-size:.97rem;color:var(--fg-2);}

/* ============================================================================
   FRANJA SUAVE / VALUE BAR — corta el blanco, da ritmo (paleta suave)
   ============================================================================ */
.valuebar{background:linear-gradient(90deg,var(--magenta-50),var(--purple-50));
  border-block:1px solid var(--border-brand);}
.valuebar__inner{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem 2rem;padding:.95rem 0;}
.valuebar__item{display:inline-flex;align-items:center;gap:.4rem;font-weight:600;font-size:.92rem;color:var(--purple-700);}
.valuebar__item .chev{font-size:1.05em;}

/* ============================================================================
   INSURTECH — el gesto diagonal de marca (única vez por página)
   ============================================================================ */
.lab{position:relative;color:#fff;background:var(--grad-brand-soft);overflow:hidden;}
.lab__chev{position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Ctext x='8' y='44' font-size='44' font-weight='900' fill='%23ffffff' fill-opacity='0.06' font-family='sans-serif'%3E%E2%80%BA%3C/text%3E%3C/svg%3E");pointer-events:none;}
.lab .container{position:relative;z-index:1;}
.lab .overline{color:#fff;opacity:.9;}
.lab .section__title{color:#fff;}
.lab .section__lead{color:rgba(255,255,255,.85);}
.lab .section__sign{color:#fff;}
.tech-card{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:var(--r-md);padding:1.6rem 1.4rem;transition:transform .2s var(--ease),background .2s,border-color .2s;}
.tech-card:hover{transform:translateY(-3px);background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.4);}
.tech-card__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;}
.tech-card__icon{width:48px;height:48px;display:grid;place-items:center;border-radius:var(--r-md);background:rgba(255,255,255,.14);color:#fff;}
.tech-card__icon svg{width:26px;height:26px;}
.tech-card__title{font-weight:700;font-size:1.18rem;margin-bottom:.45rem;color:#fff;}
.tech-card__desc{font-size:.93rem;color:rgba(255,255,255,.85);}
.badge{font-weight:700;font-size:.66rem;text-transform:uppercase;letter-spacing:.08em;padding:.28rem .6rem;border-radius:var(--r-pill);white-space:nowrap;background:rgba(255,255,255,.16);color:#fff;border:1px solid rgba(255,255,255,.3);}
.badge--live{background:rgba(37,211,102,.22);border-color:rgba(255,255,255,.45);}

/* Base del ecosistema — Campus Olegario (tarjeta blanca sobre el gradiente) */
.office{display:grid;grid-template-columns:1fr;background:#fff;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);margin-bottom:clamp(2rem,5vw,3rem);}
.office__info{padding:clamp(1.6rem,4vw,2.4rem);}
.office__kicker{display:inline-flex;align-items:center;gap:.4rem;font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--magenta);margin-bottom:.7rem;}
.office__name{font-weight:900;font-size:clamp(1.5rem,3.4vw,2.1rem);color:var(--ink-900);margin-bottom:.3rem;}
.office__tagline{font-weight:700;color:var(--purple);font-size:1.05rem;margin-bottom:.9rem;}
.office__desc{color:var(--fg-2);font-size:.97rem;margin-bottom:1.2rem;max-width:46ch;}
.office__addr{display:flex;align-items:flex-start;gap:.5rem;font-weight:700;color:var(--ink-900);font-size:1rem;margin-bottom:1.3rem;}
.office__addr svg{width:20px;height:20px;color:var(--magenta);flex:none;margin-top:1px;}
.office__actions{display:flex;flex-wrap:wrap;gap:.6rem;}
#officeCopy.is-copied{border-color:var(--success);color:var(--success);}
.office__map{min-height:280px;background:var(--ink-100);}
.office__map iframe{display:block;width:100%;height:100%;min-height:280px;border:0;}
.office__projects-title{display:flex;align-items:center;gap:.4rem;font-weight:700;font-size:1.05rem;color:#fff;opacity:.92;margin-bottom:1rem;}

/* ============================================================================
   NOSOTROS
   ============================================================================ */
.about{display:grid;gap:clamp(1.6rem,4vw,3rem);grid-template-columns:1fr;align-items:center;}
.about__media{position:relative;}
.about__photo{aspect-ratio:1/1;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);background:var(--purple-50);}
.about__photo img{width:100%;height:100%;object-fit:cover;}
.about__photo--empty{display:grid;place-items:center;color:var(--purple);background:var(--grad-brand-soft);}
.about__photo--empty span{color:#fff;font-weight:700;opacity:.9;}
.about__badge{position:absolute;left:-12px;bottom:-12px;background:#fff;border-radius:var(--r-md);box-shadow:var(--shadow-md);padding:.7rem 1rem;display:flex;align-items:center;gap:.6rem;border:1px solid var(--border-1);}
.about__badge .chev{font-size:1.4rem;}
.about__badge b{font-weight:700;font-size:.95rem;color:var(--ink-900);}
.about__badge small{display:block;color:var(--fg-3);font-size:.75rem;}
.about__text p{color:var(--fg-2);margin-bottom:1rem;max-width:56ch;}
.about__text strong{color:var(--ink-900);font-weight:700;}
.about__points{list-style:none;display:flex;flex-direction:column;gap:.55rem;margin-top:1.3rem;}
.about__points li{display:flex;gap:.6rem;align-items:baseline;color:var(--fg-2);}
.about__points li::before{content:"›";color:var(--magenta);font-weight:900;}

/* ============================================================================
   CONTACTO
   ============================================================================ */
.contact{display:grid;gap:clamp(1.1rem,3vw,2rem);grid-template-columns:1fr;}
.contact__channels{display:flex;flex-direction:column;gap:.75rem;}
.contact__card{display:flex;align-items:center;gap:1rem;background:#fff;border:1px solid var(--border-1);border-radius:var(--r-md);padding:1.05rem 1.15rem;cursor:pointer;transition:transform .18s var(--ease),box-shadow .2s,border-color .18s;}
.contact__card:hover{transform:translateX(3px);box-shadow:var(--shadow-md);border-color:var(--magenta);}
.contact__ico{width:46px;height:46px;flex:none;display:grid;place-items:center;border-radius:var(--r-md);background:var(--magenta-50);color:var(--magenta);}
.contact__ico svg{width:24px;height:24px;}
.contact__ico--wa{background:var(--whatsapp);color:#fff;}
.contact__body strong{display:block;font-weight:700;font-size:1.04rem;}
.contact__body small{color:var(--fg-3);}
.contact__schedule{background:#fff;border:1px solid var(--border-1);border-radius:var(--r-lg);padding:1.6rem 1.5rem;box-shadow:var(--shadow-sm);}
.contact__schedule h3{font-weight:700;font-size:1.3rem;margin-bottom:.4rem;}
.contact__schedule p{color:var(--fg-2);margin-bottom:1.2rem;}
.calendar-mount iframe{width:100%;border:0;border-radius:var(--r-md);min-height:600px;}
.calendar-open{display:inline-block;margin-top:.7rem;font-size:.82rem;font-weight:600;color:var(--magenta-700);}
.calendar-open:hover{text-decoration:underline;}
.calendar-placeholder{border:2px dashed var(--border-2);border-radius:var(--r-md);padding:1.4rem;text-align:center;color:var(--fg-3);font-size:.9rem;}
.calendar-placeholder code{background:var(--purple-50);color:var(--purple-700);padding:.1rem .35rem;border-radius:4px;}

/* ============================================================================
   FOOTER
   ============================================================================ */
.footer{background:var(--ink-900);color:#fff;padding:3rem 0 2.4rem;position:relative;overflow:hidden;}
.footer__chev{position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Ctext x='8' y='44' font-size='44' font-weight='900' fill='%23DF3569' fill-opacity='0.06' font-family='sans-serif'%3E%E2%80%BA%3C/text%3E%3C/svg%3E");pointer-events:none;}
.footer .container{position:relative;z-index:1;}
.footer__inner{display:flex;flex-direction:column;gap:1.8rem;}
.footer__top{display:flex;flex-direction:column;gap:1.6rem;}
.footer__brand img{height:34px;width:auto;margin-bottom:.7rem;filter:brightness(0) invert(1);}
.footer__brand p{color:rgba(255,255,255,.6);font-size:.9rem;max-width:34ch;}
.footer__partners{display:flex;flex-direction:column;align-items:flex-start;gap:.6rem;}
.footer__partners small{text-transform:uppercase;letter-spacing:.1em;font-size:.68rem;color:rgba(255,255,255,.5);font-weight:700;}
.footer__partners img{height:26px;width:auto;max-width:100%;object-fit:contain;align-self:flex-start;opacity:.85;}
.footer__group{display:flex;align-items:center;gap:.9rem;}
.footer__group small{text-transform:uppercase;letter-spacing:.1em;font-size:.68rem;color:rgba(255,255,255,.5);font-weight:700;}
.footer__group a{display:inline-flex;align-items:center;gap:.9rem;}
.footer__group-logo{height:64px;width:auto;display:block;opacity:.95;}
.footer__meta{border-top:1px solid rgba(255,255,255,.12);padding-top:1.4rem;}
.footer__meta p{color:rgba(255,255,255,.55);font-size:.85rem;margin-bottom:.3rem;}

/* ============================================================================
   WHATSAPP FAB — 56px, pulso suave 4s, siempre sólido
   ============================================================================ */
.wa-float{position:fixed;right:18px;bottom:18px;z-index:90;width:56px;height:56px;border-radius:50%;
  background:var(--whatsapp);color:#fff;display:grid;place-items:center;box-shadow:var(--shadow-md);
  transition:transform .2s var(--ease);}
.wa-float svg{width:30px;height:30px;}
.wa-float:hover{transform:scale(1.06);}
.wa-float::before{content:"";position:absolute;inset:0;border-radius:50%;background:var(--whatsapp);z-index:-1;animation:waPulse 4s var(--ease) infinite;}
@keyframes waPulse{0%,100%{transform:scale(1);opacity:.55;}50%{transform:scale(1.12);opacity:0;}}

/* ============================================================================
   LANDINGS POR RAMO — componentes reutilizables
   ============================================================================ */
/* Hero compacto para páginas de ramo (reusa el fondo cinematográfico del hero) */
.hero--ramo{min-height:auto;padding:clamp(7rem,14vh,9.5rem) 0 clamp(3rem,7vh,4.5rem);}
.hero--ramo .hero__title{font-size:clamp(2.2rem,5.6vw,3.7rem);}
.hero--ramo .hero__inner{max-width:760px;}

/* Breadcrumb */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;font-size:.82rem;font-weight:600;margin-bottom:1rem;color:rgba(255,255,255,.7);}
.crumbs a{color:rgba(255,255,255,.7);transition:color .18s;}
.crumbs a:hover{color:#fff;}
.crumbs .sep{color:var(--magenta-300);}
.crumbs [aria-current]{color:#fff;}

/* Fila problema / orientación (texto + aside) */
.feature-row{display:grid;gap:clamp(1.4rem,4vw,2.6rem);grid-template-columns:1fr;align-items:start;}
.feature-row__text p{color:var(--fg-2);margin-bottom:1rem;max-width:60ch;}
.feature-row__text strong{color:var(--ink-900);}
.aside-card{background:#fff;border:1px solid var(--border-1);border-left:3px solid var(--magenta);border-radius:var(--r-md);padding:1.5rem 1.4rem;box-shadow:var(--shadow-sm);}
.aside-card h3{font-weight:700;font-size:1.1rem;margin-bottom:.8rem;display:flex;align-items:center;gap:.5rem;}
.aside-card ul{list-style:none;display:flex;flex-direction:column;gap:.6rem;}
.aside-card li{display:flex;gap:.6rem;align-items:baseline;color:var(--fg-2);font-size:.95rem;}
.aside-card li::before{content:"›";color:var(--magenta);font-weight:900;}

/* Tarjetas de cobertura */
.cov{background:#fff;border:1px solid var(--border-1);border-radius:var(--r-md);padding:1.4rem 1.3rem;box-shadow:var(--shadow-sm);transition:transform .2s var(--ease),box-shadow .2s,border-color .2s;}
.cov:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--border-brand);}
.cov__icon{width:44px;height:44px;display:grid;place-items:center;border-radius:var(--r-md);background:var(--magenta-50);color:var(--magenta);margin-bottom:.85rem;}
.cov__icon svg{width:24px;height:24px;}
.cov__title{font-weight:700;font-size:1.08rem;margin-bottom:.35rem;}
.cov__desc{font-size:.92rem;color:var(--fg-2);}

/* Pasos 1-2-3 */
.steps{display:grid;gap:clamp(1rem,2.5vw,1.4rem);grid-template-columns:1fr;counter-reset:step;}
.step{position:relative;background:#fff;border:1px solid var(--border-1);border-radius:var(--r-md);padding:1.5rem 1.4rem 1.4rem;box-shadow:var(--shadow-sm);}
.step__num{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--grad-brand-soft);color:#fff;font-weight:900;font-size:1.05rem;margin-bottom:.8rem;}
.step__title{font-weight:700;font-size:1.1rem;margin-bottom:.35rem;}
.step__desc{font-size:.93rem;color:var(--fg-2);}

/* Errores comunes (evitar) */
.mistakes{display:grid;gap:.7rem;grid-template-columns:1fr;}
.mistake{display:flex;gap:.8rem;align-items:flex-start;background:#fff;border:1px solid var(--border-1);border-radius:var(--r-md);padding:1.1rem 1.2rem;box-shadow:var(--shadow-xs);}
.mistake__ico{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--magenta-50);color:var(--magenta);}
.mistake__ico svg{width:18px;height:18px;}
.mistake b{display:block;font-weight:700;font-size:.98rem;margin-bottom:.15rem;color:var(--ink-900);}
.mistake span{font-size:.9rem;color:var(--fg-2);}

/* FAQ (accesible, semántico — bueno para SEO) */
.faq{display:flex;flex-direction:column;gap:.7rem;max-width:820px;}
.faq__item{background:#fff;border:1px solid var(--border-1);border-radius:var(--r-md);box-shadow:var(--shadow-xs);overflow:hidden;}
.faq__item summary{cursor:pointer;list-style:none;padding:1.1rem 1.2rem;font-weight:700;font-size:1.02rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;color:var(--ink-900);}
.faq__item summary::-webkit-details-marker{display:none;}
.faq__item summary::after{content:"+";font-weight:900;font-size:1.4rem;color:var(--magenta);transition:transform .2s var(--ease);line-height:1;}
.faq__item[open] summary::after{transform:rotate(45deg);}
.faq__item p{padding:0 1.2rem 1.2rem;color:var(--fg-2);font-size:.96rem;}

/* Banda CTA final (gesto de marca) */
.cta-band{background:var(--grad-brand-soft);color:#fff;border-radius:var(--r-xl);padding:clamp(2rem,5vw,3.2rem);text-align:center;position:relative;overflow:hidden;}
.cta-band h2{font-weight:900;font-size:clamp(1.6rem,4vw,2.4rem);margin-bottom:.7rem;color:#fff;}
.cta-band p{color:rgba(255,255,255,.9);max-width:50ch;margin:0 auto 1.6rem;}
.cta-band .hero__ctas{justify-content:center;margin-bottom:0;}

/* Cards de ramos enlazadas (home -> ramo) */
.card--link{cursor:pointer;}
.card__more{display:inline-flex;align-items:center;gap:.3rem;margin-top:1rem;font-weight:700;font-size:.85rem;color:var(--magenta);}
.card--link:hover .card__more{gap:.55rem;}

@media (min-width:760px){
  .feature-row{grid-template-columns:1.3fr .7fr;}
  .steps{grid-template-columns:repeat(3,1fr);}
  .mistakes{grid-template-columns:1fr 1fr;}
}

/* ============================================================================
   GUÍAS / CONTENIDO SEO — artículos legibles
   ============================================================================ */
.prose{max-width:720px;margin:0 auto;}
.prose p{color:var(--fg-2);font-size:1.04rem;line-height:1.7;margin-bottom:1.1rem;}
.prose h2{font-weight:900;font-size:clamp(1.4rem,3.4vw,1.9rem);color:var(--ink-900);margin:2rem 0 .8rem;letter-spacing:-.01em;}
.prose h3{font-weight:800;font-size:1.15rem;color:var(--ink-900);margin:1.5rem 0 .5rem;}
.prose strong{color:var(--ink-900);font-weight:700;}
.prose ul,.prose ol{margin:0 0 1.2rem 0;padding-left:0;list-style:none;}
.prose ul li{position:relative;padding-left:1.4rem;margin-bottom:.55rem;color:var(--fg-2);line-height:1.6;}
.prose ul li::before{content:"›";position:absolute;left:0;top:0;color:var(--magenta);font-weight:900;}
.prose ol{counter-reset:n;}
.prose ol li{position:relative;padding-left:2.3rem;margin-bottom:.7rem;counter-increment:n;color:var(--fg-2);line-height:1.6;min-height:24px;}
.prose ol li::before{content:counter(n);position:absolute;left:0;top:.05rem;background:var(--magenta-50);color:var(--magenta-700);font-weight:800;font-size:.85rem;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;}
.prose a{color:var(--magenta-700);font-weight:600;text-decoration:underline;text-underline-offset:2px;}
.prose blockquote{border-left:3px solid var(--magenta);background:var(--magenta-50);padding:1rem 1.2rem;border-radius:0 var(--r-sm) var(--r-sm) 0;margin:1.4rem 0;color:var(--purple-700);font-weight:600;}
.article__meta{display:flex;flex-wrap:wrap;gap:.6rem 1rem;color:var(--fg-3);font-size:.85rem;margin-bottom:1.5rem;}
.guide-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--border-1);border-radius:var(--r-md);box-shadow:var(--shadow-sm);padding:1.5rem 1.4rem;transition:transform .2s var(--ease),box-shadow .2s,border-color .2s;}
.guide-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--border-brand);}
.guide-card__tag{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--magenta);margin-bottom:.5rem;}
.guide-card h3{font-weight:800;font-size:1.15rem;margin-bottom:.4rem;color:var(--ink-900);}
.guide-card p{color:var(--fg-2);font-size:.93rem;margin-bottom:1rem;}
.guide-card .card__more{margin-top:auto;}

/* ============================================================================
   COTIZADOR / FORMULARIOS — herramienta de lead-gen
   ============================================================================ */
.quoter{max-width:660px;margin:0 auto;background:#fff;border:1px solid var(--border-1);
  border-radius:var(--r-lg);box-shadow:var(--shadow-md);padding:clamp(1.5rem,4vw,2.5rem);}
.field{margin-bottom:1.1rem;}
.field > label{display:block;font-weight:700;font-size:.9rem;margin-bottom:.4rem;color:var(--ink-900);}
.field input,.field select,.field textarea{width:100%;font:inherit;padding:.78rem .9rem;
  border:1.5px solid var(--border-2);border-radius:var(--r-sm);background:#fff;color:var(--ink-900);
  transition:border-color .18s,box-shadow .18s;}
.field input::placeholder,.field textarea::placeholder{color:var(--ink-400);}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--magenta);
  box-shadow:0 0 0 3px var(--magenta-100);}
.field textarea{min-height:90px;resize:vertical;}
.field--row{display:grid;gap:1rem;grid-template-columns:1fr;}
.quoter__grid{display:grid;gap:0 1rem;grid-template-columns:1fr;}
.quoter__title{font-weight:900;font-size:1.3rem;margin-bottom:.3rem;}
.quoter__sub{color:var(--fg-2);font-size:.95rem;margin-bottom:1.5rem;}
.quoter__submit{width:100%;justify-content:center;font-size:1.05rem;padding:1rem 1.4rem;margin-top:.4rem;}
.quoter__hint{font-size:.82rem;color:var(--fg-3);margin-top:.9rem;text-align:center;}
.quoter__hint .chev{color:var(--magenta);}
.quoter__err{display:none;background:var(--magenta-50);border:1px solid var(--magenta-100);
  color:var(--magenta-700);border-radius:var(--r-sm);padding:.7rem .9rem;font-size:.88rem;font-weight:600;margin-bottom:1rem;}
.quoter__err.is-on{display:block;}
@media (min-width:560px){
  .field--row{grid-template-columns:1fr 1fr;}
  .quoter__grid--2{grid-template-columns:1fr 1fr;}
}

/* ============================================================================
   NAV — DROPDOWN "SEGUROS" (renderizado por main.js desde CONFIG.navRamos)
   ============================================================================ */
.nav__item--drop{position:relative;}
.nav__droplink{display:inline-flex;align-items:center;gap:.35rem;font-size:.95rem;font-weight:500;
  color:rgba(255,255,255,.9);cursor:pointer;background:none;border:0;font-family:inherit;padding:0;transition:color .18s;}
.nav__droplink svg{width:14px;height:14px;transition:transform .2s var(--ease);}
.nav__droplink:hover{color:#fff;}
.nav.is-scrolled .nav__droplink{color:var(--fg-2);}
.nav.is-scrolled .nav__droplink:hover{color:var(--magenta-700);}
.nav__panel{position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%) translateY(6px);
  min-width:460px;background:#fff;border:1px solid var(--border-1);border-radius:var(--r-md);
  box-shadow:var(--shadow-lg);padding:.9rem;display:grid;grid-template-columns:1fr 1fr;gap:.1rem .8rem;
  opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s var(--ease),transform .18s var(--ease),visibility .18s;z-index:110;}
.nav__panel::before{content:"";position:absolute;top:-12px;left:0;right:0;height:12px;}
.nav__item--drop:hover .nav__panel,.nav__item--drop:focus-within .nav__panel,.nav__item--drop.is-open .nav__panel{
  opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);}
.nav__item--drop:hover .nav__droplink svg,.nav__item--drop.is-open .nav__droplink svg{transform:rotate(180deg);}
.nav__panel a{display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.52rem .65rem;
  border-radius:var(--r-sm);font-size:.92rem;font-weight:600;color:var(--fg-2)!important;transition:background .15s,color .15s;}
.nav__panel a:hover{background:var(--magenta-50);color:var(--magenta-700)!important;}
.nav__panel .tag-online{flex:none;font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;
  color:var(--success);background:rgba(30,158,106,.1);padding:.16rem .45rem;border-radius:var(--r-pill);}
.nav__panel-all{grid-column:1 / -1;margin-top:.4rem;border-top:1px solid var(--border-1);padding-top:.65rem!important;
  color:var(--magenta-700)!important;font-weight:700!important;justify-content:flex-start!important;}
/* En el panel mobile (burger abierto) el dropdown se vuelve un bloque estático */
.nav__links.is-open .nav__item--drop{width:100%;}
.nav__links.is-open .nav__droplink{display:none;}
.nav__links.is-open .nav__panel{position:static;transform:none;opacity:1;visibility:visible;pointer-events:auto;
  min-width:0;width:100%;box-shadow:none;border:0;border-bottom:1px solid var(--border-1);border-radius:0;
  padding:0 0 .9rem;grid-template-columns:1fr 1fr;}
.nav__links.is-open .nav__panel a{font-size:.95rem;padding:.45rem .3rem;}
.nav__links.is-open .nav__panel-all{grid-column:1 / -1;}
/* Título del grupo en mobile */
.nav__panel-label{display:none;}
.nav__links.is-open .nav__panel-label{display:block;grid-column:1 / -1;font-size:.68rem;font-weight:800;
  text-transform:uppercase;letter-spacing:.1em;color:var(--magenta);padding:.2rem .3rem .4rem;}
/* Aire en anchos intermedios: se ocultan links secundarios */
@media (min-width:760px) and (max-width:1020px){ .nav__hide-md{display:none!important;} }

/* ============================================================================
   EMISIÓN ONLINE — herramienta oficial Sancor + acompañamiento Farello
   ============================================================================ */
.online-card{display:grid;grid-template-columns:1fr;background:#fff;border:1px solid var(--border-1);
  border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);}
.online-card__main{padding:clamp(1.6rem,4vw,2.4rem);}
.online-badge{display:inline-flex;align-items:center;gap:.45rem;font-size:.72rem;font-weight:800;
  text-transform:uppercase;letter-spacing:.07em;color:var(--purple-700);background:var(--purple-50);
  border:1px solid var(--purple-100);padding:.4rem .8rem;border-radius:var(--r-pill);margin-bottom:1rem;}
.online-badge::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--success);
  box-shadow:0 0 0 3px rgba(30,158,106,.18);}
.online-card__title{font-weight:900;font-size:clamp(1.4rem,3.2vw,2rem);letter-spacing:-.015em;color:var(--ink-900);margin-bottom:.55rem;}
.online-card__desc{color:var(--fg-2);font-size:1rem;margin-bottom:1.2rem;max-width:52ch;}
.online-card__points{list-style:none;display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem;}
.online-card__points li{display:flex;gap:.6rem;align-items:baseline;color:var(--fg-2);font-size:.95rem;}
.online-card__points li::before{content:"›";color:var(--magenta);font-weight:900;}
.online-card__points strong{color:var(--ink-900);}
.online-card__actions{display:flex;flex-wrap:wrap;gap:.7rem;align-items:center;}
.online-card__alt{font-size:.85rem;color:var(--fg-3);width:100%;margin-top:.2rem;}
.online-card__alt a{color:var(--magenta-700);font-weight:700;}
.online-card__alt a:hover{text-decoration:underline;}
/* Lado oscuro: la promesa de acompañamiento (eco del footer, sin 2º gradiente) */
.online-card__aside{position:relative;background:var(--ink-900);color:#fff;padding:clamp(1.6rem,4vw,2.4rem);
  display:flex;flex-direction:column;justify-content:center;overflow:hidden;}
.online-card__aside::before{content:"›";position:absolute;right:-1.5rem;bottom:-4rem;font-size:16rem;
  font-weight:900;color:var(--magenta);opacity:.12;line-height:1;pointer-events:none;}
.online-card__aside h3{font-weight:800;font-size:1.25rem;margin-bottom:.7rem;color:#fff;}
.online-card__aside h3 .tx-mag{color:var(--magenta-300);}
.online-card__aside p{color:rgba(255,255,255,.78);font-size:.95rem;margin-bottom:1rem;}
.online-card__aside ul{list-style:none;display:flex;flex-direction:column;gap:.55rem;position:relative;z-index:1;}
.online-card__aside li{display:flex;gap:.6rem;align-items:baseline;color:rgba(255,255,255,.88);font-size:.92rem;}
.online-card__aside li::before{content:"›";color:var(--magenta-300);font-weight:900;}
@media (min-width:860px){ .online-card{grid-template-columns:1.12fr .88fr;} }

/* Grid de herramientas oficiales (home + /cotizar/) */
.tools{display:grid;gap:clamp(.8rem,2vw,1.1rem);grid-template-columns:1fr;}
@media (min-width:560px){ .tools{grid-template-columns:repeat(2,1fr);} }
@media (min-width:960px){ .tools{grid-template-columns:repeat(3,1fr);} .tools--4{grid-template-columns:repeat(4,1fr);} }
.tool{display:flex;flex-direction:column;background:#fff;border:1px solid var(--border-1);border-radius:var(--r-md);
  padding:1.3rem 1.25rem;box-shadow:var(--shadow-sm);position:relative;overflow:hidden;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s;}
.tool::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-brand-soft);
  transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease);}
.tool:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--border-brand);}
.tool:hover::before{transform:scaleX(1);}
.tool__top{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-bottom:.85rem;}
.tool__icon{width:42px;height:42px;display:grid;place-items:center;border-radius:var(--r-md);
  background:var(--magenta-50);color:var(--magenta);}
.tool__icon svg{width:22px;height:22px;}
.tool__tag{font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--success);
  background:rgba(30,158,106,.1);padding:.2rem .5rem;border-radius:var(--r-pill);white-space:nowrap;}
.tool__title{font-weight:700;font-size:1.05rem;margin-bottom:.3rem;color:var(--ink-900);}
.tool__desc{font-size:.88rem;color:var(--fg-2);margin-bottom:.9rem;}
.tool__go{display:inline-flex;align-items:center;gap:.3rem;margin-top:auto;font-weight:700;font-size:.85rem;color:var(--magenta);}
.tool:hover .tool__go{gap:.55rem;}
/* Franja de acompañamiento bajo el grid de herramientas */
.tools-note{display:flex;gap:.9rem;align-items:flex-start;background:var(--purple-50);border:1px solid var(--purple-100);
  border-left:3px solid var(--magenta);border-radius:var(--r-md);padding:1.1rem 1.3rem;margin-top:clamp(1.4rem,3vw,2rem);}
.tools-note__ico{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--magenta);border:1px solid var(--magenta-100);}
.tools-note__ico svg{width:20px;height:20px;}
.tools-note p{color:var(--fg-2);font-size:.95rem;}
.tools-note strong{color:var(--purple-700);}

/* ============================================================================
   COMERCIO — herramientas interactivas (diagnóstico + riesgos por rubro)
   ============================================================================ */
/* Diagnóstico: quiz de 8 preguntas con semáforo */
.quiz{max-width:720px;margin:0 auto;background:#fff;border:1px solid var(--border-1);
  border-radius:var(--r-lg);box-shadow:var(--shadow-md);padding:clamp(1.6rem,4vw,2.4rem);}
.quiz__progress{display:flex;align-items:center;gap:.8rem;margin-bottom:1.4rem;}
.quiz__bar{flex:1;height:6px;border-radius:var(--r-pill);background:var(--ink-100);overflow:hidden;}
.quiz__bar span{display:block;height:100%;background:var(--grad-brand-soft);border-radius:var(--r-pill);
  transition:width .3s var(--ease);}
.quiz__count{font-size:.8rem;font-weight:800;color:var(--fg-3);white-space:nowrap;}
.quiz__q{font-weight:800;font-size:clamp(1.15rem,2.6vw,1.5rem);color:var(--ink-900);margin-bottom:.5rem;}
.quiz__why{font-size:.92rem;color:var(--fg-3);margin-bottom:1.4rem;}
.quiz__opts{display:flex;flex-wrap:wrap;gap:.6rem;}
.quiz__opt{flex:1;min-width:110px;font:inherit;font-weight:700;padding:.85rem 1rem;cursor:pointer;
  border:1.5px solid var(--border-2);border-radius:var(--r-md);background:#fff;color:var(--fg-2);
  transition:border-color .15s,background .15s,transform .15s;}
.quiz__opt:hover{border-color:var(--magenta);background:var(--magenta-50);color:var(--magenta-700);transform:translateY(-1px);}
/* Resultado */
.quiz__score{display:flex;align-items:center;gap:1.1rem;margin-bottom:1.2rem;}
.quiz__ring{flex:none;width:86px;height:86px;border-radius:50%;display:grid;place-items:center;
  font-weight:900;font-size:1.5rem;color:#fff;}
.quiz__ring--verde{background:var(--success);}
.quiz__ring--amarillo{background:#D97706;}
.quiz__ring--rojo{background:var(--magenta-700);}
.quiz__verdict{font-weight:900;font-size:1.3rem;color:var(--ink-900);}
.quiz__verdict small{display:block;font-weight:600;font-size:.92rem;color:var(--fg-2);margin-top:.2rem;}
.quiz__flags{list-style:none;display:flex;flex-direction:column;gap:.55rem;margin:1rem 0 1.4rem;}
.quiz__flags li{display:flex;gap:.6rem;align-items:baseline;font-size:.93rem;color:var(--fg-2);
  background:var(--magenta-50);border:1px solid var(--magenta-100);border-radius:var(--r-sm);padding:.6rem .8rem;}
.quiz__flags li::before{content:"›";color:var(--magenta);font-weight:900;}
.quiz__again{background:none;border:0;cursor:pointer;font:inherit;font-size:.85rem;font-weight:700;
  color:var(--fg-3);text-decoration:underline;text-underline-offset:3px;margin-top:1rem;}
.quiz__again:hover{color:var(--magenta-700);}

/* Selector de rubro: chips + panel de riesgos reales */
.rubros{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.4rem;}
.rubro-chip{font:inherit;font-size:.9rem;font-weight:700;padding:.55rem 1.05rem;cursor:pointer;
  border:1.5px solid var(--border-2);border-radius:var(--r-pill);background:#fff;color:var(--fg-2);
  transition:all .15s var(--ease);}
.rubro-chip:hover{border-color:var(--magenta);color:var(--magenta-700);}
.rubro-chip.is-active{background:var(--grad-brand-soft);border-color:transparent;color:#fff;
  box-shadow:var(--shadow-brand);}
.rubro-panel{background:#fff;border:1px solid var(--border-1);border-radius:var(--r-lg);
  box-shadow:var(--shadow-md);padding:clamp(1.4rem,3.5vw,2rem);}
.rubro-panel__title{font-weight:900;font-size:1.35rem;color:var(--ink-900);margin-bottom:.35rem;}
.rubro-panel__insight{color:var(--purple-700);font-weight:600;font-size:.98rem;margin-bottom:1.4rem;
  padding:.8rem 1rem;background:var(--purple-50);border-left:3px solid var(--purple);border-radius:0 var(--r-sm) var(--r-sm) 0;}
.rubro-panel__cols{display:grid;gap:1.2rem;grid-template-columns:1fr;}
@media (min-width:760px){ .rubro-panel__cols{grid-template-columns:1fr 1fr;} }
.rubro-panel__col h4{display:flex;align-items:center;gap:.5rem;font-size:.78rem;font-weight:800;
  text-transform:uppercase;letter-spacing:.07em;margin-bottom:.7rem;}
.rubro-panel__col--si h4{color:var(--success);}
.rubro-panel__col--no h4{color:var(--magenta-700);}
.rubro-panel__col ul{list-style:none;display:flex;flex-direction:column;gap:.5rem;}
.rubro-panel__col li{display:flex;gap:.55rem;align-items:baseline;font-size:.93rem;color:var(--fg-2);}
.rubro-panel__col--si li::before{content:"✓";color:var(--success);font-weight:900;}
.rubro-panel__col--no li::before{content:"✕";color:var(--magenta-700);font-weight:900;}
.rubro-panel__cta{margin-top:1.5rem;display:flex;flex-wrap:wrap;gap:.7rem;align-items:center;}

/* ============================================================================
   CAUCIÓN — cotizador de alquiler integrado (réplica oficial Sancor)
   ============================================================================ */
.calc{display:grid;gap:0;grid-template-columns:1fr;background:#fff;border:1px solid var(--border-1);
  border-radius:var(--r-lg);box-shadow:var(--shadow-lg);overflow:hidden;}
@media (min-width:880px){ .calc{grid-template-columns:.9fr 1.1fr;} }
.calc__form{padding:clamp(1.5rem,4vw,2.2rem);}
.calc__form h3{font-weight:900;font-size:1.25rem;margin-bottom:.4rem;color:var(--ink-900);}
.calc__form > p{color:var(--fg-3);font-size:.9rem;margin-bottom:1.3rem;}
.calc__vigencia{display:flex;gap:.5rem;flex-wrap:wrap;}
.calc__vig{flex:1;min-width:90px;font:inherit;font-weight:700;padding:.7rem .5rem;cursor:pointer;text-align:center;
  border:1.5px solid var(--border-2);border-radius:var(--r-md);background:#fff;color:var(--fg-2);
  transition:all .15s var(--ease);}
.calc__vig:hover{border-color:var(--magenta);color:var(--magenta-700);}
.calc__vig.is-active{background:var(--grad-brand-soft);border-color:transparent;color:#fff;box-shadow:var(--shadow-brand);}
.calc__submit{width:100%;justify-content:center;margin-top:1.2rem;}
/* Resultados */
.calc__results{background:var(--purple-50);border-top:1px solid var(--border-1);
  padding:clamp(1.5rem,4vw,2.2rem);display:flex;flex-direction:column;}
@media (min-width:880px){ .calc__results{border-top:0;border-left:1px solid var(--border-1);} }
.calc__empty{margin:auto;text-align:center;color:var(--fg-3);font-size:.95rem;max-width:32ch;}
.calc__empty svg{width:44px;height:44px;color:var(--purple-300);margin:0 auto .8rem;display:block;}
.calc__label{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--fg-3);}
.calc__total{font-weight:900;font-size:clamp(1.9rem,4.5vw,2.6rem);color:var(--ink-900);letter-spacing:-.02em;line-height:1.1;}
.calc__total small{font-size:.85rem;font-weight:600;color:var(--fg-3);letter-spacing:0;}
.calc__sa{font-size:.85rem;color:var(--fg-2);margin:.4rem 0 1.1rem;}
.calc__pay{display:grid;gap:.6rem;grid-template-columns:1fr;margin-bottom:1.2rem;}
@media (min-width:560px){ .calc__pay{grid-template-columns:repeat(3,1fr);} }
.calc__opt{background:#fff;border:1px solid var(--border-1);border-radius:var(--r-md);padding:.8rem .9rem;}
.calc__opt--best{border-color:var(--magenta);box-shadow:0 0 0 3px var(--magenta-100);position:relative;}
.calc__opt small{display:block;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--fg-3);margin-bottom:.25rem;}
.calc__opt b{font-size:1.05rem;font-weight:900;color:var(--ink-900);}
.calc__opt span{display:block;font-size:.75rem;color:var(--fg-3);margin-top:.15rem;}
.calc__opt--best small{color:var(--magenta-700);}
.calc__actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:1rem;}
.calc__disclaimer{font-size:.75rem;color:var(--fg-3);line-height:1.5;}
/* Modal "PDF a tu nombre" (cotizador de caución) */
.calc-modal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;
  padding:1rem;background:rgba(26,19,32,.55);backdrop-filter:blur(3px);}
.calc-modal[hidden]{display:none;}
.calc-modal__box{position:relative;width:100%;max-width:460px;max-height:92vh;overflow:auto;background:#fff;
  border-radius:var(--r-lg);box-shadow:var(--shadow-lg);padding:1.7rem 1.5rem 1.4rem;}
.calc-modal__box h3{font-weight:900;font-size:1.2rem;color:var(--ink-900);margin-bottom:.35rem;padding-right:1.8rem;}
.calc-modal__intro{color:var(--fg-2);font-size:.9rem;line-height:1.55;margin-bottom:1.2rem;}
.calc-modal__close{position:absolute;top:.9rem;right:.9rem;width:32px;height:32px;border:0;border-radius:50%;
  background:var(--ink-50);color:var(--fg-2);font-size:1.15rem;line-height:1;cursor:pointer;}
.calc-modal__close:hover{background:var(--magenta-100);color:var(--magenta-700);}
.calc-modal__grid{display:grid;gap:0 .8rem;grid-template-columns:1fr;}
@media (min-width:480px){ .calc-modal__grid{grid-template-columns:1fr 1fr;} }
.calc-modal__err{font-size:.85rem;font-weight:700;color:var(--magenta-700);background:var(--magenta-50);
  border-radius:var(--r-sm);padding:.55rem .8rem;margin-bottom:.9rem;}
.calc-modal__submit{width:100%;justify-content:center;}
.calc-modal__skip{display:block;width:100%;margin-top:.7rem;border:0;background:none;cursor:pointer;
  font:inherit;font-size:.85rem;font-weight:600;color:var(--fg-3);text-decoration:underline;text-underline-offset:3px;}
.calc-modal__skip:hover{color:var(--fg-2);}
.calc-modal__privacy{font-size:.72rem;color:var(--fg-3);text-align:center;margin-top:.9rem;line-height:1.5;}
/* Requisitos bajo el cotizador */
.calc-req{display:grid;gap:1rem;grid-template-columns:1fr;margin-top:clamp(1.2rem,3vw,1.8rem);}
@media (min-width:760px){ .calc-req{grid-template-columns:1fr 1fr;} }
.calc-req__card{background:#fff;border:1px solid var(--border-1);border-left:3px solid var(--purple);
  border-radius:var(--r-md);padding:1.2rem 1.3rem;box-shadow:var(--shadow-xs);}
.calc-req__card h4{font-weight:800;font-size:.95rem;margin-bottom:.6rem;color:var(--ink-900);}
.calc-req__card ul{list-style:none;display:flex;flex-direction:column;gap:.45rem;}
.calc-req__card li{display:flex;gap:.55rem;align-items:baseline;font-size:.88rem;color:var(--fg-2);}
.calc-req__card li::before{content:"›";color:var(--purple);font-weight:900;}
/* Comparativa caución vs garantía clásica */
.versus{display:grid;gap:1rem;grid-template-columns:1fr;}
@media (min-width:820px){ .versus{grid-template-columns:1fr 1fr;} }
.versus__col{border-radius:var(--r-lg);padding:clamp(1.4rem,3.5vw,2rem);border:1px solid var(--border-1);}
.versus__col--win{background:#fff;border-color:var(--magenta-100);box-shadow:var(--shadow-md);position:relative;}
.versus__col--lose{background:var(--ink-100);opacity:.92;}
.versus__badge{display:inline-block;font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;
  padding:.3rem .7rem;border-radius:var(--r-pill);margin-bottom:.8rem;}
.versus__col--win .versus__badge{background:var(--grad-brand-soft);color:#fff;}
.versus__col--lose .versus__badge{background:var(--ink-200);color:var(--fg-2);}
.versus__col h3{font-weight:900;font-size:1.3rem;margin-bottom:1rem;color:var(--ink-900);}
.versus__col ul{list-style:none;display:flex;flex-direction:column;gap:.65rem;}
.versus__col li{display:flex;gap:.6rem;align-items:baseline;font-size:.95rem;color:var(--fg-2);}
.versus__col--win li::before{content:"✓";color:var(--success);font-weight:900;flex:none;}
.versus__col--lose li::before{content:"✕";color:var(--ink-500);font-weight:900;flex:none;}

/* ============================================================================
   FOOTER — navegación por secciones (renderizada por main.js)
   ============================================================================ */
.footer__nav{display:grid;gap:1.6rem 1.2rem;grid-template-columns:repeat(2,1fr);
  border-top:1px solid rgba(255,255,255,.12);padding-top:1.6rem;}
@media (min-width:760px){ .footer__nav{grid-template-columns:repeat(4,1fr);} }
.footer__nav h4{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;
  color:rgba(255,255,255,.5);margin-bottom:.7rem;}
.footer__nav a{display:block;color:rgba(255,255,255,.68);font-size:.88rem;padding:.2rem 0;transition:color .15s;}
.footer__nav a:hover{color:#fff;}

/* ============================================================================
   REVEAL ON SCROLL — fade + slide corto (sin rebotes)
   ============================================================================ */
.reveal{opacity:0;transform:translateY(8px);transition:opacity .5s var(--ease),transform .5s var(--ease);}
.reveal.is-in{opacity:1;transform:none;}

/* ============================================================================
   RESPONSIVE
   ============================================================================ */
@media (min-width:640px){ .grid--4{grid-template-columns:repeat(2,1fr);} }
@media (min-width:760px){
  .hide-mobile{display:inline;}
  .nav__burger{display:none;}
  .nav__links{display:flex;}
  .contact{grid-template-columns:.9fr 1.1fr;align-items:start;}
  .about{grid-template-columns:.85fr 1.15fr;}
  .office{grid-template-columns:1.05fr .95fr;}
  .office__map{min-height:340px;}
  .footer__top{flex-direction:row;justify-content:space-between;align-items:flex-start;}
}
@media (min-width:960px){
  .grid--3{grid-template-columns:repeat(3,1fr);}
  .grid--4{grid-template-columns:repeat(4,1fr);}
  .wa-float{width:60px;height:60px;right:24px;bottom:24px;}
}