/* base.css — generado a partir de la deduplicacion de index.css / politica-de-cookies.css */

:root{
    --espuma:#F5F3EE;
    --blanco:#FFFFFF;
    --noche:#12313A;
    --noche-2:#1C4A54;
    --noche-3:#0B2229;
    --terracota:#C8672E;
    --terracota-2:#A8541F;
    --terracota-soft:#F1E1D3;
    --salvia:#8FA98C;
    --salvia-soft:#E7EEE5;
    --alerta:#B33F3F;
    --alerta-bg:#FBEAE7;
    --alerta-border:#E3B4A9;
    --text:#1B2421;
    --text-soft:#4B5854;
    --text-faint:#657268;
    --border:rgba(18,49,58,0.14);
    --border-strong:rgba(18,49,58,0.28);
    --radius-s:10px;
    --radius-m:16px;
    --radius-l:28px;
    --shadow-s:0 2px 10px rgba(18,49,58,0.08);
    --shadow-m:0 12px 32px rgba(18,49,58,0.14);
    --ff-display:ui-serif, Georgia, 'Iowan Old Style', 'Palatino Linotype', 'URW Palladio L', P052, serif;
    --ff-body:system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --ff-mono:ui-monospace, 'SF Mono', 'Cascadia Code', 'Segoe UI Mono', Consolas, 'Liberation Mono', monospace;
    /* Escala de espaciado (revisión de diseño 2026-08). Complementa los
       tokens de color/radio/sombra/tipografía que ya existían — el
       espaciado seguía siendo valores sueltos repetidos por sección. No
       reemplaza los valores actuales de golpe (alto riesgo de regresión
       visual sin verificar cada sección); se usa en código nuevo y se va
       adoptando de a poco donde ya se toca cada bloque. */
    --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;
    --space-28:112px;
    /* Escala tipográfica (revisión de diseño 2026-08, sugerencia 27).
       --fs-h2 documenta el tamaño ya usado por .section-head h2 en todo
       el sitio (fuente única de verdad, no un valor nuevo). --fs-h3 es
       el único ajuste real: unifica los títulos de tarjetas de grilla
       (servicios/pasos/turistas), que diferían por accidente (1.08rem
       vs 1.15rem) sin ninguna razón de jerarquía. Los h3 de paneles
       principales (whatsapp-card, form-card) se dejan como están: son
       una jerarquía distinta a propósito, no una inconsistencia. */
    --fs-h2:clamp(1.7rem,3.4vw,2.4rem);
    --fs-h3:1.1rem;
  }

/* Grid-shrink safety net: prevents CSS Grid children from forcing horizontal overflow on narrow phones */
  .hero-grid > *, .request-grid > *, .fit-grid > *, .tourist-grid > *, .footer-grid > *,
  .form-row > *, .price-grid > *, .services-grid > *, .credentials > *, .profile-card > *,
  .about-grid > *{
    min-width:0;
  }

@media(max-width:420px){
    .btn{ white-space:normal; text-align:center; line-height:1.3; }
  }

*{box-sizing:border-box;}

html{scroll-behavior:smooth;}

body{
    margin:0;
    background:var(--espuma);
    color:var(--text);
    font-family:var(--ff-body);
    font-size:16px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }

img,svg{max-width:100%;display:block;}

a{color:inherit;}

h1,h2,h3,h4{font-family:var(--ff-display);margin:0;font-weight:600;color:var(--noche);letter-spacing:-0.01em;}

p{margin:0;}

ul{margin:0;padding:0;list-style:none;}

button{font-family:inherit;cursor:pointer;}

input,select,textarea{font-family:inherit;font-size:1rem;}

.container{max-width:1160px;margin:0 auto;padding:0 24px;}

.eyebrow{
    font-family:var(--ff-mono);
    font-size:0.72rem;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--terracota-2);
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-weight:600;
  }

.eyebrow::before{
    content:'';
    width:7px;height:7px;border-radius:50%;
    background:var(--terracota);
    display:inline-block;
  }

.eyebrow.on-dark{color:#E6A879;}

.eyebrow.on-dark::before{background:#E6A879;}

/* Más aire entre macro-secciones (revisión de diseño 2026-08, sugerencia
   16): el valor anterior (96px/64px) ya estaba en el rango razonable,
   pero en el extremo bajo — subir refuerza la sensación de calma que
   busca la marca frente a un scroll de bloques muy pegados. */
  section{padding:var(--space-28) 0;position:relative;}

@media(max-width:720px){ section{padding:var(--space-20) 0;} }

.section-head{max-width:640px;margin-bottom:48px;}

.section-head h2{font-size:var(--fs-h2);margin-top:14px;}

.section-head p{margin-top:16px;color:var(--text-soft);font-size:1.05rem;}

.section-head.on-dark h2{color:var(--blanco);}

.section-head.on-dark p{color:rgba(245,243,238,0.72);}

/* Botones: extraídos a css/components.css (cargado antes que este archivo). */

/* ===== IDIOMA (ES / EN) ===== */
  .lang-switch{display:flex;align-items:center;background:rgba(18,49,58,0.07);border-radius:100px;padding:3px;gap:2px;flex-shrink:0;}

.lang-switch button{
    display:inline-flex;align-items:center;gap:6px;
    border:none;background:transparent;padding:6px 11px 6px 6px;border-radius:100px;
    font-family:var(--ff-mono);font-size:0.74rem;font-weight:600;color:var(--text-soft);
    transition:background .15s, color .15s;
  }

.lang-switch button svg{width:18px;height:13px;border-radius:2px;flex-shrink:0;display:block;}

.lang-switch button.active{background:var(--noche);color:var(--blanco);}

.mobile-menu .lang-switch{margin:12px 4px 4px;align-self:flex-start;}

/* ===== HEADER ===== */
  header{
    position:sticky;top:0;z-index:200;
    background:rgba(245,243,238,0.88);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--border);
  }

.nav-wrap{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;max-width:1160px;margin:0 auto;gap:16px;}

.brand{display:flex;align-items:center;gap:10px;font-family:var(--ff-display);font-weight:600;font-size:1.1rem;color:var(--noche);text-decoration:none;flex-shrink:0;}

.brand-mark{
    width:36px;height:36px;border-radius:10px;background:var(--noche);
    display:flex;align-items:center;justify-content:center;flex-shrink:0;
  }

.brand-mark svg{width:19px;height:19px;stroke:var(--espuma);}

nav.links{display:flex;gap:24px;align-items:center;}

nav.links a{font-size:0.92rem;font-weight:500;text-decoration:none;color:var(--text-soft);transition:color .15s;white-space:nowrap;}

nav.links a:hover{color:var(--noche);}

.nav-right{display:flex;align-items:center;gap:12px;flex-shrink:0;}

.nav-phone{display:flex;align-items:center;gap:8px;font-family:var(--ff-mono);font-size:0.88rem;font-weight:600;color:var(--noche);text-decoration:none;}

.nav-phone svg{width:16px;height:16px;stroke:var(--terracota);}

.burger{display:none;background:none;border:none;padding:8px;}

.burger svg{width:24px;height:24px;stroke:var(--noche);}

.mobile-menu{display:none;flex-direction:column;gap:2px;padding:8px 24px 20px;border-top:1px solid var(--border);background:var(--espuma);}

.mobile-menu a{display:flex;align-items:center;gap:10px;padding:12px 4px;text-decoration:none;color:var(--text);font-weight:500;border-bottom:1px solid var(--border);}

.mobile-menu a svg{width:17px;height:17px;stroke:var(--terracota);flex-shrink:0;}

.mobile-menu.open{display:flex;}

@media(max-width:1120px){
    nav.links{display:none;}
    .burger{display:block;}
    .nav-phone{display:none;}
  }

@media(max-width:560px){
    .nav-right .btn-whatsapp{display:none;}
    .nav-wrap{gap:6px;padding:14px 14px;}
    .nav-right{gap:5px;}
    .brand{font-size:0.92rem;gap:6px;}
    .lang-switch{padding:2px;gap:1px;}
    .lang-switch button{padding:5px 8px 5px 5px;gap:4px;font-size:0.68rem;}
    .lang-switch button svg{width:16px;height:11px;}
    .burger{padding:6px;}
    body{padding-bottom:64px;}
  }

/* ===== CTA sticky mobile — el botón de WhatsApp de la cabecera se oculta
   por debajo de 560px (arriba); esta barra fija lo reemplaza para que
   siempre haya una acción a un toque, sin depender de hacer scroll.
   Sustituye a .float-wa en ese mismo rango (se oculta abajo) para no
   mostrar dos CTAs de WhatsApp flotantes a la vez. */
  .mobile-sticky-cta{
    display:none;position:fixed;left:0;right:0;bottom:0;z-index:60;
    align-items:center;justify-content:center;gap:8px;
    padding:14px 20px calc(14px + env(safe-area-inset-bottom));
    background:#1F7A5C;color:#fff;text-decoration:none;
    font-weight:700;font-size:0.95rem;box-shadow:0 -2px 10px rgba(0,0,0,0.12);
  }

.mobile-sticky-cta svg{width:19px;height:19px;stroke:#fff;flex-shrink:0;}

@media(max-width:560px){
    .mobile-sticky-cta{display:flex;}
  }

@media(max-width:360px){
    .brand span:not(.brand-mark){display:none;}
  }

/* ===== HERO ===== */
  .hero{padding:76px 0 60px;overflow:hidden;position:relative;}

.hero-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:56px;align-items:center;}

@media(max-width:920px){ .hero-grid{grid-template-columns:1fr;gap:40px;} }

.hero h1{font-size:clamp(2.2rem,4.6vw,3.3rem);line-height:1.1;margin-top:18px;}

.hero h1 em{font-style:normal;color:var(--terracota);}

.hero-sub{margin-top:22px;font-size:1.1rem;color:var(--text-soft);max-width:520px;}

.hero-facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px;}

/* .fact-chip: extraído a css/components.css. */

.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px;}

.hero-trust{display:flex;flex-wrap:wrap;gap:22px;margin-top:38px;padding-top:28px;border-top:1px solid var(--border);}

.trust-item{display:flex;align-items:center;gap:10px;font-size:0.9rem;color:var(--text-soft);}

.trust-item svg{width:18px;height:18px;stroke:var(--salvia);flex-shrink:0;}

.trust-item b{color:var(--noche);font-weight:600;}

/* ---- Hero visual: pulse composition ---- */
  .hero-visual{position:relative;height:520px;max-width:520px;margin:0 auto;}

@media(max-width:920px){ .hero-visual{height:440px;width:100%;} }

@media(max-width:480px){ .hero-visual{height:380px;} }

.blob{position:absolute;border-radius:50%;filter:blur(50px);pointer-events:none;}

.blob-1{
    width:320px;height:320px;top:-10px;right:-30px;
    background:radial-gradient(circle at 30% 30%, rgba(200,103,46,0.55), rgba(200,103,46,0) 70%);
    animation:blobfloat1 12s ease-in-out infinite;
  }

.blob-2{
    width:280px;height:280px;bottom:-20px;left:-30px;
    background:radial-gradient(circle at 60% 40%, rgba(143,169,140,0.55), rgba(143,169,140,0) 70%);
    animation:blobfloat2 14s ease-in-out infinite;
  }

@keyframes blobfloat1{ 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(-18px,22px) scale(1.08);} }

@keyframes blobfloat2{ 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(16px,-16px) scale(1.06);} }

.orbit-ring{
    position:absolute;top:50%;left:50%;width:360px;height:360px;
    transform:translate(-50%,-50%);border-radius:50%;
    border:1.5px dashed rgba(18,49,58,0.22);
    animation:orbitspin 50s linear infinite;
  }

.orbit-ring::before,.orbit-ring::after{
    content:'';position:absolute;width:8px;height:8px;border-radius:50%;background:var(--terracota);
  }

.orbit-ring::before{top:-4px;left:50%;margin-left:-4px;}

.orbit-ring::after{bottom:6%;right:8%;width:6px;height:6px;background:var(--salvia);}

@keyframes orbitspin{ to{ transform:translate(-50%,-50%) rotate(360deg); } }

.pulse-core{
    position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
    width:250px;height:250px;border-radius:50%;
    background:rgba(255,255,255,0.62);
    backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
    border:1px solid rgba(255,255,255,0.7);
    box-shadow:0 20px 50px rgba(18,49,58,0.18), inset 0 1px 0 rgba(255,255,255,0.8);
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
    overflow:hidden;
  }

.pulse-core .badge-icon{
    width:46px;height:46px;border-radius:12px;background:var(--noche);
    display:flex;align-items:center;justify-content:center;
  }

.pulse-core .badge-icon svg{width:24px;height:24px;stroke:var(--espuma);}

.ekg-wrap{width:168px;height:46px;overflow:hidden;position:relative;}

.ekg-track{position:absolute;top:0;left:0;height:100%;width:200%;animation:ekgmove 3.2s linear infinite;}

.ekg-track svg{height:100%;width:100%;}

@keyframes ekgmove{ from{transform:translateX(0);} to{transform:translateX(-50%);} }

.pulse-core .badge-label{font-family:var(--ff-mono);font-size:0.72rem;letter-spacing:0.06em;color:var(--noche);text-transform:uppercase;font-weight:600;}

.float-chip{
    position:absolute;display:flex;align-items:center;gap:10px;
    background:rgba(255,255,255,0.85);backdrop-filter:blur(8px);
    border:1px solid rgba(255,255,255,0.9);border-radius:100px;
    padding:10px 16px 10px 10px;box-shadow:0 10px 26px rgba(18,49,58,0.14);
    font-size:0.82rem;font-weight:600;color:var(--noche);white-space:nowrap;
  }

.float-chip .chip-icon{
    width:28px;height:28px;border-radius:50%;flex-shrink:0;
    display:flex;align-items:center;justify-content:center;
  }

.float-chip .chip-icon svg{width:15px;height:15px;}

.chip-1{top:6%;left:-2%;animation:chipfloat 5s ease-in-out infinite;}

.chip-1 .chip-icon{background:var(--salvia-soft);}

.chip-1 .chip-icon svg{stroke:var(--noche-2);}

.chip-2{bottom:12%;right:-4%;animation:chipfloat 6s ease-in-out infinite 0.6s;}

.chip-2 .chip-icon{background:var(--terracota-soft);}

.chip-2 .chip-icon svg{stroke:var(--terracota-2);}

.chip-3{bottom:-2%;left:14%;animation:chipfloat 5.6s ease-in-out infinite 1.2s;}

.chip-3 .chip-icon{background:var(--salvia-soft);}

.chip-3 .chip-icon svg{stroke:var(--noche-2);}

@keyframes chipfloat{ 0%,100%{transform:translateY(0);} 50%{transform:translateY(-10px);} }

@media(max-width:560px){
    .float-chip{font-size:0.72rem;padding:8px 14px 8px 8px;}
    .chip-1{left:-4%;} .chip-2{right:-6%;} .chip-3{left:8%;}
  }

@media (prefers-reduced-motion:reduce){
    .blob-1,.blob-2,.orbit-ring,.ekg-track,.float-chip{animation:none;}
    html{scroll-behavior:auto;}
  }

/* ===== CTA STRIP (reused at the end of sections) ===== */
  .cta-strip{
    margin-top:44px;padding:26px 30px;border-radius:var(--radius-m);
    background:var(--salvia-soft);border:1px solid var(--border);
    display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;
  }

.cta-strip p{font-weight:600;color:var(--noche);font-size:0.98rem;}

.cta-strip.on-dark{background:rgba(245,243,238,0.08);border-color:rgba(245,243,238,0.18);}

.cta-strip.on-dark p{color:var(--blanco);}

@media(max-width:480px){
    .cta-strip{padding:22px;}
    .cta-strip .btn{width:100%;}
  }

/* ===== CTA de texto (discreto) — para secciones que no son uno de los
   2-3 momentos clave del recorrido (hero, precios, cierre de FAQ). En vez
   de repetir un botón grande de WhatsApp en cada sección, un link corto. */
  .cta-text{
    margin-top:32px;display:inline-flex;align-items:center;gap:6px;
    font-size:0.94rem;color:var(--noche-2);text-decoration:none;font-weight:600;
  }

.cta-text svg{width:16px;height:16px;stroke:var(--terracota);flex-shrink:0;}

.cta-text:hover{color:var(--terracota-2);text-decoration:underline;}

/* ===== SERVICIOS ===== */
  .services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}

@media(max-width:920px){ .services-grid{grid-template-columns:repeat(2,1fr);} }

@media(max-width:620px){ .services-grid{grid-template-columns:1fr;} }

.service-card{
    display:block;background:var(--blanco);border:1px solid var(--border);border-radius:var(--radius-m);
    padding:30px 26px;transition:transform .2s ease, box-shadow .2s ease;
    color:inherit;text-decoration:none;
  }

.service-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-m);}

.service-card.highlight{background:var(--terracota-soft);border-color:rgba(200,103,46,0.3);}

.service-icon{
    width:46px;height:46px;border-radius:12px;background:var(--salvia-soft);
    display:flex;align-items:center;justify-content:center;margin-bottom:18px;
  }

.service-card.highlight .service-icon{background:rgba(200,103,46,0.16);}

.service-icon svg{width:23px;height:23px;stroke:var(--noche-2);}

.service-card.highlight .service-icon svg{stroke:var(--terracota-2);}

.service-card h3{font-size:var(--fs-h3);font-weight:600;margin-bottom:8px;}

.service-card p{color:var(--text-soft);font-size:0.94rem;}

.service-badge{
    display:inline-block;margin-top:10px;font-family:var(--ff-mono);font-size:0.72rem;font-weight:700;
    color:var(--terracota-2);background:rgba(200,103,46,0.14);padding:4px 10px;border-radius:100px;
  }

/* ===== SEGUIMIENTO (banner destacado) ===== */
  .followup-banner{
    margin-top:22px;display:flex;align-items:center;gap:26px;flex-wrap:wrap;
    padding:28px 32px;border-radius:var(--radius-l);
    background:linear-gradient(120deg, var(--terracota-soft) 0%, #FBEFE3 55%, var(--terracota-soft) 100%);
    background-size:200% 100%;
    border:1px solid rgba(200,103,46,0.25);
  }

.followup-icon{
    width:56px;height:56px;border-radius:16px;background:var(--terracota);flex-shrink:0;
    display:flex;align-items:center;justify-content:center;box-shadow:0 8px 18px rgba(200,103,46,0.3);
    animation:followupPulse 3.2s ease-in-out infinite;
  }

.followup-icon svg{width:26px;height:26px;stroke:var(--blanco);}

@keyframes followupPulse{ 0%,100%{transform:scale(1);} 50%{transform:scale(1.08);} }

.followup-text{flex:1;min-width:220px;}

.followup-text h3{font-size:1.2rem;margin-bottom:6px;}

.followup-text p{color:var(--text-soft);font-size:0.96rem;max-width:520px;}

/* .followup-badge (+ num/label): extraído a css/components.css. */

@media (prefers-reduced-motion:reduce){ .followup-icon{animation:none;} }

@media(max-width:600px){
    .followup-banner{padding:24px;gap:18px;}
  }

/* ===== MALETÍN (showcase en Servicios) ===== */
  .bag-showcase{
    margin-top:36px;background:var(--blanco);border:1px solid var(--border);border-radius:var(--radius-l);
    padding:26px 40px;display:grid;grid-template-columns:0.95fr 1.05fr;gap:20px;align-items:center;
    box-shadow:var(--shadow-s);
  }

@media(max-width:860px){ .bag-showcase{grid-template-columns:1fr;padding:28px 24px;} }

.bag-art{max-width:420px;margin:0 auto;width:100%;}

.bag-float{animation:bagFloat 6s ease-in-out infinite;transform-origin:260px 260px;}

@keyframes bagFloat{ 0%,100%{transform:translateY(0);} 50%{transform:translateY(-6px);} }

.cross-glow{animation:crossGlowPulse 3.4s ease-in-out infinite;}

@keyframes crossGlowPulse{ 0%,100%{opacity:0.35;} 50%{opacity:0.75;} }

.steth-pulse{animation:stethBeat 2.2s ease-in-out infinite;transform-origin:284px 270px;}

@keyframes stethBeat{ 0%,100%{transform:scale(1);} 50%{transform:scale(1.18);} }

@media (prefers-reduced-motion:reduce){
    .bag-float,.cross-glow,.steth-pulse{animation:none;}
  }

.bag-copy h3{font-size:1.5rem;margin-bottom:14px;}

.bag-copy > p{color:var(--text-soft);font-size:1rem;margin-bottom:20px;}

.bag-checklist{display:flex;flex-direction:column;gap:12px;}

.bag-checklist li{
    display:flex;align-items:center;gap:12px;font-size:0.94rem;color:var(--text);font-weight:500;
  }

.bag-checklist li svg{
    width:22px;height:22px;flex-shrink:0;stroke:var(--blanco);background:var(--salvia);
    border-radius:50%;padding:4px;box-sizing:border-box;
  }

/* ===== QUÉ ATENDEMOS / NO ATENDEMOS =====
   .fit-grid y compañía: extraído a css/components.css. */

/* ===== PRECIOS + SELECTOR DE ZONA ===== */
  .price-band{background:var(--noche);color:var(--espuma);}

.price-band .eyebrow{color:#E6A879;}

.price-band .eyebrow::before{background:#E6A879;}

.price-band .section-head h2{color:var(--blanco);}

.price-band .section-head p{color:rgba(245,243,238,0.72);}

.zone-tool{
    background:rgba(245,243,238,0.06);border:1px solid rgba(245,243,238,0.16);
    border-radius:var(--radius-l);padding:36px;margin-bottom:32px;
  }

@media(max-width:600px){ .zone-tool{padding:26px 22px;} }

.zone-tool-label{font-family:var(--ff-mono);font-size:0.8rem;color:rgba(245,243,238,0.65);margin-bottom:14px;}

.zone-map-wrap{margin-bottom:28px;}

.zone-chip-outside{margin-top:16px;width:100%;justify-content:center;}

@media(max-width:500px){ .zone-chip-outside span{white-space:normal;text-align:center;} }

.zone-map{width:100%;height:auto;border-radius:14px;overflow:visible;}

.zone-route{animation:routeDash 30s linear infinite;}

@keyframes routeDash{ to{ stroke-dashoffset:-240; } }

.map-pin{cursor:pointer;outline:none;}

.pin-halo{fill:none;stroke-width:1.5;stroke:rgba(245,243,238,0.35);transition:all .2s ease;}

.pin-dot{fill:#8FA98C;transition:all .2s ease;}

.map-pin[data-zone="benalmadena"] .pin-dot,
  .map-pin[data-zone="marbella"] .pin-dot,
  .map-pin[data-zone="malaga"] .pin-dot{fill:#C8672E;}

.map-pin[data-zone="benalmadena"] .pin-halo,
  .map-pin[data-zone="marbella"] .pin-halo,
  .map-pin[data-zone="malaga"] .pin-halo{stroke:rgba(200,103,46,0.35);}

.pin-label{
    font-family:var(--ff-mono);font-size:12px;fill:rgba(245,243,238,0.7);text-anchor:middle;
    transition:fill .2s ease;
  }

.map-pin:hover .pin-halo{stroke:rgba(245,243,238,0.7);}

.map-pin:focus-visible{outline:3px solid var(--terracota);outline-offset:4px;border-radius:50%;}

.map-pin.active .pin-dot{r:11;}

.map-pin.active .pin-halo{r:22;stroke-width:2;animation:pinPulse 2.2s ease-out infinite;}

.map-pin.active .pin-label{fill:var(--blanco);font-weight:700;}

@keyframes pinPulse{ 0%{opacity:0.9;} 100%{opacity:0.15;} }

.map-legend circle{opacity:0.9;}

.map-legend text{font-family:var(--ff-mono);font-size:11px;fill:rgba(245,243,238,0.55);}

@media (prefers-reduced-motion:reduce){ .zone-route{animation:none;} .map-pin.active .pin-halo{animation:none;} }

.zone-chip{
    display:inline-flex;align-items:center;gap:8px;
    border:1.5px dashed rgba(245,243,238,0.3);background:transparent;color:rgba(245,243,238,0.8);
    padding:11px 20px;border-radius:100px;font-size:0.88rem;font-weight:600;transition:all .15s;
  }

.zone-chip svg{width:16px;height:16px;flex-shrink:0;stroke:rgba(245,243,238,0.7);}

.zone-chip:hover{border-color:rgba(245,243,238,0.6);background:rgba(245,243,238,0.06);}

.zone-chip.active{background:var(--terracota);border-color:var(--terracota);border-style:solid;color:var(--blanco);}

.zone-chip.active svg{stroke:var(--blanco);}

.zone-result{
    display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;
    padding-top:26px;border-top:1px solid rgba(245,243,238,0.16);
  }

.zone-result-amount{font-family:var(--ff-mono);font-size:2.6rem;font-weight:600;color:var(--blanco);}

.zone-result-amount .cur{font-size:1.6rem;}

.zone-result-note{font-size:0.92rem;color:rgba(245,243,238,0.65);margin-top:6px;}

.zone-result.is-outside .zone-result-amount{font-size:1.6rem;color:var(--terracota-soft);}

.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:0;}

@media(max-width:860px){ .price-grid{grid-template-columns:1fr;} }

.price-card{
    background:rgba(245,243,238,0.06);border:1px solid rgba(245,243,238,0.16);
    border-radius:var(--radius-m);padding:26px 24px;
  }

.price-card .label{font-size:0.88rem;color:rgba(245,243,238,0.7);font-weight:500;}

.price-card .amount{font-family:var(--ff-mono);font-size:1.8rem;font-weight:600;color:var(--blanco);margin-top:8px;display:block;}

.price-card .note{margin-top:10px;font-size:0.84rem;color:rgba(245,243,238,0.6);}

.price-includes{display:flex;flex-wrap:wrap;gap:14px 28px;margin:32px 0;padding:24px 0;border-top:1px solid rgba(245,243,238,0.16);border-bottom:1px solid rgba(245,243,238,0.16);}

.price-includes-col h4{font-family:var(--ff-mono);font-size:0.76rem;text-transform:uppercase;letter-spacing:0.06em;color:rgba(245,243,238,0.55);margin-bottom:10px;}

.price-includes-col{flex:1;min-width:220px;}

.price-includes-col span{display:block;font-size:0.9rem;color:rgba(245,243,238,0.88);font-weight:500;margin-bottom:8px;}

.price-includes-col.no span{color:rgba(245,243,238,0.6);}

.price-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;align-items:center;padding-top:4px;}

.pay-methods{display:flex;flex-wrap:wrap;gap:12px;}

.pay-pill{
    font-family:var(--ff-mono);font-size:0.82rem;padding:8px 16px;border-radius:100px;
    border:1px solid rgba(245,243,238,0.24);color:rgba(245,243,238,0.85);
  }

.price-disclaimer{font-size:0.86rem;color:rgba(245,243,238,0.55);max-width:360px;}

/* ===== BLOQUE: FLUJO DE PAGO SEGURO (dentro de precios) ===== */
  .payment-flow{
    margin-top:32px;padding:28px 30px;border-radius:var(--radius-l);
    background:rgba(245,243,238,0.05);border:1px solid rgba(245,243,238,0.16);
    display:flex;gap:22px;align-items:flex-start;
  }

@media(max-width:640px){ .payment-flow{flex-direction:column;padding:24px 22px;} }

.payment-flow-icon{
    width:44px;height:44px;border-radius:12px;background:rgba(245,243,238,0.1);flex-shrink:0;
    display:flex;align-items:center;justify-content:center;
  }

.payment-flow-icon svg{width:22px;height:22px;stroke:#E6A879;}

.payment-flow h4{color:var(--blanco);font-size:1.06rem;margin-bottom:10px;}

.payment-flow p{color:rgba(245,243,238,0.78);font-size:0.94rem;line-height:1.6;}

.payment-flow .payment-flow-secondary{color:rgba(245,243,238,0.6);font-size:0.86rem;margin-top:10px;}

.payment-flow-methods{display:flex;flex-wrap:wrap;gap:22px;margin-top:18px;}

.payment-flow-methods > div{min-width:180px;}

.payment-flow-methods .pf-label{
    font-family:var(--ff-mono);font-size:0.72rem;text-transform:uppercase;letter-spacing:0.06em;
    color:rgba(245,243,238,0.5);display:block;margin-bottom:6px;
  }

.payment-flow-methods .pf-value{font-size:0.92rem;color:rgba(245,243,238,0.9);font-weight:500;}

.payment-flow-cancel-note{
    margin-top:16px;font-size:0.82rem;color:rgba(245,243,238,0.5);font-style:italic;
  }

.cancel-summary{
    margin-top:18px;padding-top:18px;border-top:1px solid rgba(245,243,238,0.14);
    display:flex;gap:12px;align-items:flex-start;
  }

.cancel-summary svg{width:18px;height:18px;stroke:#E6A879;flex-shrink:0;margin-top:2px;}

.cancel-summary h5{
    font-family:var(--ff-body);font-size:0.92rem;font-weight:600;color:var(--blanco);margin-bottom:6px;
  }

.cancel-summary p{font-size:0.86rem;color:rgba(245,243,238,0.75);line-height:1.55;}

.cancel-summary a{
    display:inline-block;margin-top:8px;font-size:0.86rem;font-weight:600;color:#E6A879;
    text-decoration:underline;text-underline-offset:3px;padding:4px 0;
  }

.cancel-summary a:hover{color:#F3C39A;}

/* ===== ZONA DE COBERTURA ===== */
  .coverage-list{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px;}

.coverage-pill{
    display:flex;align-items:center;gap:10px;background:var(--blanco);border:1px solid var(--border);
    border-radius:100px;padding:10px 18px 10px 12px;font-size:0.92rem;font-weight:600;color:var(--noche);
  }

.coverage-pill .dot{width:8px;height:8px;border-radius:50%;background:var(--salvia);flex-shrink:0;}

.coverage-pill.ext .dot{background:var(--terracota);}

.coverage-note{margin-top:24px;color:var(--text-soft);font-size:0.98rem;max-width:600px;}

/* ===== COMO FUNCIONA ===== */
  .request-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:28px;align-items:stretch;}

@media(max-width:920px){ .request-grid{grid-template-columns:1fr;} }

.whatsapp-card{
    background:linear-gradient(165deg,#1F7A5C,#155940);
    border-radius:var(--radius-l);padding:38px 32px;color:var(--blanco);
    display:flex;flex-direction:column;justify-content:space-between;gap:28px;
  }

.whatsapp-card h3{color:var(--blanco);font-size:1.5rem;}

.whatsapp-card p{color:rgba(255,255,255,0.82);margin-top:12px;font-size:0.98rem;}

.whatsapp-icon-badge{
    width:56px;height:56px;border-radius:16px;background:rgba(255,255,255,0.14);
    display:flex;align-items:center;justify-content:center;
  }

.whatsapp-icon-badge svg{width:28px;height:28px;stroke:var(--blanco);fill:none;}

.whatsapp-card-badge{
    display:inline-block;margin-top:16px;font-family:var(--ff-mono);font-size:0.72rem;font-weight:700;
    letter-spacing:0.04em;color:var(--blanco);background:rgba(255,255,255,0.16);
    padding:4px 10px;border-radius:100px;
  }

.whatsapp-card .btn-whatsapp{background:var(--blanco);color:#155940;box-shadow:none;}

.whatsapp-card .btn-whatsapp:hover{background:#EAF7F1;}

.response-time{display:flex;gap:10px;align-items:center;font-size:0.86rem;color:rgba(255,255,255,0.75);}

.response-time svg{width:16px;height:16px;stroke:rgba(255,255,255,0.75);}

.form-card{
    background:var(--blanco);border:1px solid var(--border);border-radius:var(--radius-l);
    padding:38px 34px;
  }

.form-card h3{font-size:1.4rem;margin-bottom:6px;}

.form-card > p.form-sub{color:var(--text-soft);font-size:0.94rem;margin-bottom:26px;}

.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;}

@media(max-width:560px){ .form-row{grid-template-columns:1fr;} }

.field{display:flex;flex-direction:column;gap:6px;}

.field.full{grid-column:1/-1;}

.field label{font-size:0.82rem;font-weight:600;color:var(--noche);}

.field input,.field select,.field textarea{
    padding:12px 14px;border-radius:var(--radius-s);border:1.5px solid var(--border-strong);
    background:var(--espuma);color:var(--text);outline:none;transition:border-color .15s;
  }

.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--terracota);}

.field textarea{resize:vertical;min-height:88px;}

.form-note{margin-top:18px;font-size:0.9rem;color:var(--text-soft);font-style:italic;
    padding:14px 16px;background:var(--salvia-soft);border-radius:var(--radius-s);}

/* Sin fondo/borde propio (a diferencia de .form-note): ya vive dentro de
   .form-card, que tiene su propio borde — una caja bordeada dentro de otra
   no aportaba nada. Revisión de diseño 2026-08 (sugerencia 72). */
  .form-note-payment{
    margin-top:14px;padding:0;background:none;border:none;
    display:flex;gap:12px;align-items:flex-start;font-style:normal;
  }

.form-note-payment svg{width:18px;height:18px;stroke:var(--noche-2);flex-shrink:0;margin-top:2px;}

.form-note-payment span{color:var(--text-soft);font-size:0.88rem;line-height:1.55;}

.form-note-terms{
    background:none;border:none;padding:0;margin-top:12px;font-style:normal;
    font-size:0.86rem;color:var(--text-soft);
  }

.form-note-terms a{
    display:inline-block;margin-left:6px;font-weight:600;color:var(--noche-2);
    text-decoration:underline;text-underline-offset:3px;padding:4px 0;
  }

.form-note-terms a:hover{color:var(--noche);}

/* ===== TURISTAS — plegado dentro de Servicios (rediseño UX 5/6) ===== */
  .services-tourist{margin-top:64px;padding-top:44px;border-top:1px solid var(--border);}

.services-tourist .tourist-grid{margin-top:20px;}

.tourist-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:40px;align-items:center;}

@media(max-width:860px){ .tourist-grid{grid-template-columns:1fr;} }

.tourist-list{display:flex;flex-direction:column;gap:14px;margin-top:22px;}

.tourist-list li{display:flex;gap:12px;align-items:flex-start;font-size:0.98rem;color:var(--text-soft);}

.tourist-list svg{width:19px;height:19px;stroke:var(--salvia);flex-shrink:0;margin-top:2px;}

.tourist-card{
    background:var(--noche);color:var(--espuma);border-radius:var(--radius-l);padding:32px 28px;
  }

.tourist-card h3{color:var(--blanco);font-size:var(--fs-h3);margin-bottom:12px;}

.tourist-card p{color:rgba(245,243,238,0.78);font-size:0.94rem;}

/* ===== SOBRE EL SERVICIO — tarjeta de perfil profesional ===== */
  .profile-card{
    display:grid;grid-template-columns:0.85fr 1.4fr;gap:0;align-items:center;
    background:var(--blanco);border:1px solid var(--border);border-radius:var(--radius-l);
    overflow:hidden;box-shadow:var(--shadow-m);
  }

@media(max-width:860px){ .profile-card{grid-template-columns:1fr;} }

.profile-photo-placeholder{
    aspect-ratio:4/5;border-radius:var(--radius-m);
    border:1.5px dashed rgba(245,243,238,0.35);
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
    background:rgba(245,243,238,0.05);
  }

.profile-photo-placeholder svg{width:34px;height:34px;stroke:rgba(245,243,238,0.55);}

.profile-photo-placeholder span{font-family:var(--ff-mono);font-size:0.8rem;color:rgba(245,243,238,0.55);text-align:center;padding:0 20px;}

.profile-photo{
    width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:var(--radius-m);display:block;
  }

.profile-photo-col picture{display:block;width:100%;}

.profile-name-tag h3{color:var(--blanco);font-size:1.2rem;}

.profile-name-tag span{display:block;margin-top:6px;font-family:var(--ff-mono);font-size:0.8rem;color:rgba(245,243,238,0.6);}

.profile-content-col{padding:40px;}

@media(max-width:600px){ .profile-content-col{padding:28px 24px;} }

.profile-bio{color:var(--text-soft);font-size:1.08rem;line-height:1.6;margin-bottom:28px;}

/* .skill-tags / .experience-list: eliminados (bio del médico achicada,
   rediseño UX 5/6) — detalle completo en /dr-cristian-diaz. */

/* ===== PARA EMPRESAS: extraído a /empresas.html (css/empresas.css). ===== */

/* ===== FAQ ===== */
  .faq-list{max-width:780px;}

details.faq-item{
    border-bottom:1px solid var(--border);padding:12px 0;
  }

/* padding propio (no solo el de .faq-item) para que el área táctil real
   del <summary> llegue al mínimo recomendado de 44px en mobile -- antes
   solo medía ~27px, la altura del texto en una sola línea. */
  details.faq-item summary{
    list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;
    font-weight:600;font-size:1.04rem;color:var(--noche);
    padding:10px 0;min-height:24px;
  }

details.faq-item summary::-webkit-details-marker{display:none;}

.faq-plus{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--border-strong);
    display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;transition:transform .2s;}

.faq-plus::before,.faq-plus::after{content:'';position:absolute;background:var(--noche);}

.faq-plus::before{width:10px;height:1.5px;}

.faq-plus::after{width:1.5px;height:10px;}

details[open] .faq-plus{transform:rotate(45deg);background:var(--terracota);border-color:var(--terracota);}

details[open] .faq-plus::before,details[open] .faq-plus::after{background:var(--blanco);}

.faq-item p{margin-top:14px;color:var(--text-soft);font-size:0.98rem;max-width:640px;}

/* ===== AVISO ===== */
  .alert-box{
    background:var(--alerta-bg);border:1.5px solid var(--alerta-border);
    border-radius:var(--radius-l);padding:36px 34px;display:flex;gap:22px;align-items:flex-start;
  }

@media(max-width:600px){ .alert-box{flex-direction:column;} }

.alert-icon{
    width:48px;height:48px;border-radius:12px;background:var(--alerta);flex-shrink:0;
    display:flex;align-items:center;justify-content:center;
  }

.alert-icon svg{width:24px;height:24px;stroke:var(--blanco);}

.alert-box h3{color:var(--alerta);font-size:1.2rem;margin-bottom:10px;}

.alert-box p{color:#5C2B2B;font-size:0.98rem;line-height:1.65;}

.alert-box a.tel112{font-weight:700;color:var(--alerta);text-decoration:underline;}

/* ===== FOOTER ===== */
  footer{background:var(--noche-3);color:rgba(245,243,238,0.72);padding:56px 0 30px;}

.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:40px;}

@media(max-width:760px){ .footer-grid{grid-template-columns:1fr;gap:32px;} }

.footer-brand{display:flex;align-items:center;gap:10px;font-family:var(--ff-display);font-size:1.15rem;color:var(--blanco);margin-bottom:14px;}

.footer-brand .brand-mark{background:var(--terracota);}

footer h4{color:var(--blanco);font-size:0.82rem;text-transform:uppercase;letter-spacing:0.1em;margin-bottom:16px;font-family:var(--ff-mono);font-weight:600;}

footer ul li{margin-bottom:10px;font-size:0.92rem;}

footer ul li a{
    display:inline-flex;align-items:center;gap:9px;
    text-decoration:none;color:inherit;transition:color .15s;overflow-wrap:anywhere;word-break:break-word;
  }

footer ul li a svg{width:15px;height:15px;flex-shrink:0;stroke:rgba(245,243,238,0.55);transition:stroke .15s;}

footer ul li a:hover svg{stroke:var(--blanco);}

footer ul li a:hover{color:var(--blanco);}

.footer-bottom{margin-top:44px;padding-top:24px;border-top:1px solid rgba(245,243,238,0.12);
    display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:0.82rem;color:rgba(245,243,238,0.45);}

.footer-legal{margin-top:36px;padding-top:28px;border-top:1px solid rgba(245,243,238,0.12);}

.footer-legal details{margin-bottom:10px;}

.footer-legal summary{cursor:pointer;font-size:0.86rem;font-weight:600;color:rgba(245,243,238,0.75);}

.footer-legal summary:hover{color:var(--blanco);}

.footer-legal .legal-body{margin-top:10px;font-size:0.82rem;color:rgba(245,243,238,0.5);max-width:640px;line-height:1.6;}

.footer-terms-link{margin:14px 0 0;}

.footer-terms-link a{
    display:inline-block;padding:6px 0;font-size:0.86rem;font-weight:600;
    color:rgba(245,243,238,0.75);text-decoration:underline;text-underline-offset:3px;
    min-height:44px;line-height:32px;
  }

.footer-terms-link a:hover{color:var(--blanco);}

/* ===== FLOATING WHATSAPP ===== */
  .float-wa{
    position:fixed;bottom:24px;right:24px;z-index:300;
    display:inline-flex;align-items:center;gap:10px;
    background:#1F7A5C;color:var(--blanco);
    padding:16px 22px;border-radius:100px;
    box-shadow:0 10px 30px rgba(31,122,92,0.4);
    text-decoration:none;font-weight:700;font-size:0.94rem;
    animation:floatWaPulse 3s ease-in-out infinite;
  }

.float-wa:hover{background:#186347;transform:translateY(-2px);}

.float-wa svg{width:24px;height:24px;stroke:var(--blanco);fill:none;flex-shrink:0;}

.float-wa .label{white-space:nowrap;}

@keyframes floatWaPulse{
    0%,100%{ box-shadow:0 10px 30px rgba(31,122,92,0.4); }
    50%{ box-shadow:0 10px 30px rgba(31,122,92,0.4), 0 0 0 8px rgba(31,122,92,0.16); }
  }

@media(max-width:600px){
    .float-wa{padding:16px;border-radius:50%;}
    .float-wa .label{display:none;}
  }

/* Por debajo de 560px, .mobile-sticky-cta (arriba) reemplaza a .float-wa
   como CTA flotante de WhatsApp — evita mostrar los dos a la vez. */
@media(max-width:560px){
    .float-wa{display:none;}
  }

@media (prefers-reduced-motion:reduce){ .float-wa{animation:none;} }

/* reveal on scroll */
  .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease, transform .7s ease;}

.reveal.in{opacity:1;transform:translateY(0);}

.skip-link{position:absolute;left:-999px;top:0;background:var(--noche);color:var(--blanco);padding:10px 16px;z-index:999;}

.skip-link:focus{left:10px;top:10px;}

a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, summary:focus-visible {
    outline:2.5px solid var(--terracota); outline-offset:2px;
  }

/* Keyframe usado hoy por el punto de carga de la agenda automática
   (.agenda-card-skeleton .agenda-dot, ver css/index.css) — la barra manual
   de disponibilidad que originalmente lo usaba ya no existe en el HTML
   (ver comentario en js/main.js), así que se limpió el resto del bloque
   muerto (--amber*, .availability-wrap/-bar/-dot y sus variantes de
   estado) en la revisión de diseño 2026-08. */
  @keyframes availPulse{ 0%,100%{opacity:1;} 50%{opacity:0.55;} }

/* ===== PROCESO (PASOS DENTRO DE "COMO FUNCIONA") ===== */
  /* 4 tarjetas + 3 conectores en escritorio; 2x2 en tablet; apilado en movil */
  .steps-grid{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;gap:0;align-items:start;}

@media(max-width:1180px){
    .steps-grid{grid-template-columns:repeat(2,1fr);gap:32px 24px;}
    .step-connector{display:none;}
  }

@media(max-width:640px){
    .steps-grid{grid-template-columns:1fr;gap:28px;}
  }

.step-card{
    background:var(--blanco);border:1px solid var(--border);border-radius:var(--radius-l);
    padding:32px 26px;text-align:center;position:relative;transition:transform .2s ease, box-shadow .2s ease;
    display:flex;flex-direction:column;height:100%;
  }

.step-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-m);}

.step-num{
    position:absolute;top:-14px;left:50%;transform:translateX(-50%);
    width:30px;height:30px;border-radius:50%;background:var(--noche);color:var(--blanco);
    display:flex;align-items:center;justify-content:center;font-family:var(--ff-mono);font-weight:700;font-size:0.86rem;
  }

.step-icon{
    width:56px;height:56px;border-radius:16px;background:var(--terracota-soft);margin:14px auto 18px;
    display:flex;align-items:center;justify-content:center;flex-shrink:0;
  }

.step-icon svg{width:26px;height:26px;stroke:var(--terracota-2);}

.step-card h3{font-size:var(--fs-h3);margin-bottom:8px;}

.step-card p{color:var(--text-soft);font-size:0.94rem;}

.step-connector{display:flex;align-items:center;justify-content:center;padding-top:70px;}

.step-connector svg{width:60px;height:20px;stroke:var(--border-strong);stroke-width:2;fill:none;}

@media(max-width:1180px){ .step-connector{display:none;} }

.steps-then{
    display:flex;align-items:center;gap:16px;margin:52px 0 32px;
    color:var(--text-faint);font-family:var(--ff-mono);font-size:0.78rem;letter-spacing:0.08em;text-transform:uppercase;
  }

.steps-then::before,.steps-then::after{content:'';flex:1;height:1px;background:var(--border);}

/* ===== CONSENTIMIENTO DE COOKIES: extraído a css/components.css
   (rollout GA4/Consent Mode v2 a las páginas nuevas). ===== */