/* ==========================================================================
   Vital 4Life Nicaragua — Paleta de colores (modo claro y oscuro)
   --------------------------------------------------------------------------
   Para Claude Code:
   - Importa este archivo una sola vez en el CSS global del sitio.
   - En los componentes usa SIEMPRE estas variables (o las clases de Tailwind
     que las referencian), nunca colores hex sueltos.
   - El modo oscuro se activa con data-theme="dark" en <html>. Si no hay
     data-theme, se sigue la preferencia del sistema (prefers-color-scheme).
     data-theme="light" fuerza el modo claro.
   - Regla de marca: --color-offer / --color-offer-text SOLO en ofertas.
   - Todos los pares texto/fondo cumplen contraste WCAG AA (≥ 4.5:1).
   ========================================================================== */

:root {
  color-scheme: light;

  /* Fondos y bordes */
  --color-bg: #F3F4EE;              /* fondo de página */
  --color-surface: #FFFFFF;         /* tarjetas */
  --color-surface-soft: #FAFBF7;    /* modales, hojas, franja de confianza */
  --color-surface-sunken: #E7EDE3;  /* fondo de fotos de producto, botón cerrar, estado "en pedido" */
  --color-surface-accent: #E3EADF;  /* arco del hero, bloque CTA final */
  --color-border: #DDE3D8;          /* bordes y divisores */
  --color-border-card: #E4E9E0;     /* borde de tarjetas */

  /* Texto */
  --color-text: #1E3B30;            /* títulos y texto principal */
  --color-text-muted: #4C5E55;      /* texto secundario */
  --color-text-subtle: #536659;     /* precio tachado, notas */

  /* Acción */
  --color-primary: #2E7D55;         /* relleno de botones principales */
  --color-primary-hover: #256946;
  --color-on-primary: #FFFFFF;
  --color-primary-text: #2A7350;    /* precios, enlaces, palabra en cursiva de los títulos */
  --color-focus: #2E7D55;           /* anillo de foco */

  /* Ofertas (solo ofertas) */
  --color-offer: #A9561A;           /* insignia OFERTA / −X% */
  --color-on-offer: #FFFFFF;
  --color-offer-text: #9A4E16;      /* precio de oferta, etiqueta "OFERTAS DE LA SEMANA" */

  /* Contraste y selección */
  --color-inverse: #1E3B30;         /* bloque "Cómo te atendemos" */
  --color-on-inverse: #E8EFE6;
  --color-inverse-accent: #A9D3B8;  /* números del bloque, contador del pedido */
  --color-selected-bg: #1E3B30;     /* chip activo, botón oscuro del menú, barra flotante de pedido */
  --color-selected-text: #F3F4EE;
  --color-overlay: rgba(20, 35, 28, 0.5);

  /* Ilustración del hero (volcán y laguna) */
  --illus-sky-1: #F6EEDC;
  --illus-sky-2: #EAEDE0;
  --illus-sky-3: #DCE6DA;
  --illus-sun: #F3D9A8;
  --illus-volcano: #9FB3A3;
  --illus-ridge: #7E9A86;
  --illus-lake: #B9CCC4;
  --illus-lake-line: #DCE6E1;
  --illus-hill: #4F7A60;
  --illus-hill-front: #2F5A44;
  --illus-star-opacity: 0;          /* estrellas ocultas de día */
}

/* Modo oscuro: "noche en la laguna" */
:root[data-theme="dark"] {
  color-scheme: dark;

  --color-bg: #101914;
  --color-surface: #17221C;
  --color-surface-soft: #1B2720;
  --color-surface-sunken: #22302A;
  --color-surface-accent: #1D2B24;
  --color-border: #2C3C33;
  --color-border-card: #26352D;

  --color-text: #E6EDE6;
  --color-text-muted: #A8B8AD;
  --color-text-subtle: #8C9E92;

  --color-primary: #2E7D55;         /* mismo verde que en claro */
  --color-primary-hover: #256946;
  --color-on-primary: #FFFFFF;
  --color-primary-text: #7CC79E;
  --color-focus: #7CC79E;

  --color-offer: #A9561A;           /* mismo terracota que en claro */
  --color-on-offer: #FFFFFF;
  --color-offer-text: #E39A5F;

  --color-inverse: #1E3B30;
  --color-on-inverse: #E8EFE6;
  --color-inverse-accent: #A9D3B8;
  --color-selected-bg: #E6EDE6;     /* en oscuro el seleccionado se invierte a claro */
  --color-selected-text: #101914;
  --color-overlay: rgba(0, 0, 0, 0.6);

  --illus-sky-1: #1B2B2A;
  --illus-sky-2: #18241F;
  --illus-sky-3: #15201B;
  --illus-sun: #E9E3C9;             /* el sol pasa a ser luna */
  --illus-volcano: #34493F;
  --illus-ridge: #2B3F35;
  --illus-lake: #2A3D3A;
  --illus-lake-line: #4A615A;
  --illus-hill: #22372C;
  --illus-hill-front: #172820;
  --illus-star-opacity: 0.7;
}

/* Sin elección explícita: seguir al sistema */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --color-bg: #101914;
    --color-surface: #17221C;
    --color-surface-soft: #1B2720;
    --color-surface-sunken: #22302A;
    --color-surface-accent: #1D2B24;
    --color-border: #2C3C33;
    --color-border-card: #26352D;
    --color-text: #E6EDE6;
    --color-text-muted: #A8B8AD;
    --color-text-subtle: #8C9E92;
    --color-primary: #2E7D55;
    --color-primary-hover: #256946;
    --color-on-primary: #FFFFFF;
    --color-primary-text: #7CC79E;
    --color-focus: #7CC79E;
    --color-offer: #A9561A;
    --color-on-offer: #FFFFFF;
    --color-offer-text: #E39A5F;
    --color-inverse: #1E3B30;
    --color-on-inverse: #E8EFE6;
    --color-inverse-accent: #A9D3B8;
    --color-selected-bg: #E6EDE6;
    --color-selected-text: #101914;
    --color-overlay: rgba(0, 0, 0, 0.6);
    --illus-sky-1: #1B2B2A;
    --illus-sky-2: #18241F;
    --illus-sky-3: #15201B;
    --illus-sun: #E9E3C9;
    --illus-volcano: #34493F;
    --illus-ridge: #2B3F35;
    --illus-lake: #2A3D3A;
    --illus-lake-line: #4A615A;
    --illus-hill: #22372C;
    --illus-hill-front: #172820;
    --illus-star-opacity: 0.7;
  }
}

/* Base */
body {
  background: var(--color-bg);
  color: var(--color-text);
}
:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}

/* Fuentes propias (subconjunto latino, WOFF2): ~84 KB en total frente a ~177 KB de Google Fonts, sin conexiones a otros dominios */
@font-face{font-family:'Fraunces';font-style:normal;font-weight:300 500;font-display:swap;src:url(fonts/fraunces-normal.woff2) format('woff2')}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:300;font-display:swap;src:url(fonts/fraunces-italic.woff2) format('woff2')}
@font-face{font-family:'Fraunces Texto';font-style:normal;font-weight:400 500;font-display:swap;src:url(fonts/fraunces-texto.woff2) format('woff2')}
@font-face{font-family:'Outfit';font-style:normal;font-weight:300 600;font-display:swap;src:url(fonts/outfit.woff2) format('woff2')}
/* Diseño: DISENO.md ("Una mañana tranquila"). Sin estilos en línea en el HTML: la política de seguridad (_headers) no los permite. */
:root{--serif:'Fraunces',Georgia,serif;--serif-t:'Fraunces Texto','Fraunces',Georgia,serif;--sans:'Outfit',system-ui,sans-serif;--mist:var(--color-bg);--paper:var(--color-surface);--paper-soft:var(--color-surface-soft);--sage:var(--color-surface-sunken);--sage-deep:var(--color-surface-accent);--line:var(--color-border);--line-card:var(--color-border-card);--tx:var(--color-text);--ink-muted:var(--color-text-muted);--ink-soft:var(--color-text-subtle);--btn-p:var(--color-primary);--leaf:var(--color-primary-text);--leaf-light:var(--color-inverse-accent);--on-pine:var(--color-on-inverse);--surf:var(--color-inverse);--offer:var(--color-offer);--offer-tx:var(--color-offer-text);--btn-d-bg:var(--color-selected-bg);--btn-d-tx:var(--color-selected-text);--overlay:var(--color-overlay);--foto:var(--color-surface-sunken);--mist-t:color-mix(in srgb,var(--color-bg) 95%,transparent);--flota:color-mix(in srgb,var(--color-surface) 92%,transparent)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--mist);color:var(--tx);font:400 17px/1.55 var(--sans)}
a{color:var(--tx)}a:hover{color:var(--leaf)}
h1,h2,h3,p{margin:0}
[hidden]{display:none!important}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.ic{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ic.fino{stroke-width:1.5}.ic.leaf{color:var(--leaf)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:1288px;margin:0 auto;padding:0 24px}  /* 1240 px de contenido + 24 px de margen a cada lado: igual que las secciones en caja */
.it{font-style:italic}.it.leaf,.leaf{color:var(--leaf)}
.eyebrow{font-size:14px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--leaf)}
.eyebrow.oferta{color:var(--offer-tx)}
h1.t,h2.t{font-family:var(--serif);font-weight:300}
h1.t{font-size:clamp(44px,6vw,80px);line-height:1.02;letter-spacing:-.025em}
h2.t{font-size:clamp(36px,4.4vw,56px);line-height:1.08;letter-spacing:-.02em}
.nav-movil,.barra-movil,.barra-pedido,.of-cab-movil,.ver-todos,.menu-movil,.solo-movil-i,.solo-movil-b{display:none}
.titulo-movil{font:400 22px var(--serif-t)}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 30px;border-radius:999px;border:1.5px solid transparent;font:500 17px var(--sans);text-decoration:none;cursor:pointer;text-align:center}
.btn-p{background:var(--color-primary);color:var(--color-on-primary);border-color:var(--color-primary)}.btn-p:hover{color:var(--color-on-primary);background:var(--color-primary-hover);border-color:var(--color-primary-hover)}
.btn-s{border-color:var(--tx);color:var(--tx);background:transparent}.btn-s:hover{color:var(--tx);background:var(--sage)}
.btn-d{min-height:44px;padding:0 20px;background:var(--btn-d-bg);color:var(--btn-d-tx);font-size:16px;border-color:var(--btn-d-bg)}.btn-d:hover{color:var(--btn-d-tx)}
.btn:focus-visible,button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}
.cuenta{min-width:24px;height:24px;padding:0 6px;border-radius:999px;background:var(--color-inverse-accent);color:var(--color-inverse);font-size:13px;font-weight:600;display:inline-flex;align-items:center;justify-content:center}
.badge{padding:5px 12px;border-radius:999px;background:var(--color-offer);color:var(--color-on-offer);font-weight:600;font-size:12px;letter-spacing:.06em}

/* Encabezado */
.top{padding:20px 0;border-bottom:1px solid var(--line)}
.top.fijo{position:sticky;top:0;z-index:5;background:var(--mist-t);padding:16px 0}
.top-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--tx);font:500 22px var(--serif-t)}
.brand .n{font-style:italic;font-weight:300;color:var(--leaf)}.brand .corto{display:none}
.nav{display:flex;flex-wrap:wrap;align-items:center;gap:8px 28px;font-size:16px}
.nav a{text-decoration:none}.nav a.act{font-weight:600}.nav a.btn-d{color:var(--btn-d-tx)}
.nav button.btn-d{font:500 16px var(--sans);cursor:pointer}

/* Hero */
.hero{padding:72px 0 88px}
.hero-in{display:flex;flex-wrap:wrap;align-items:center;gap:56px}
.hero-t{flex:1 1 460px;min-width:0;display:flex;flex-direction:column;gap:28px}
.pill-oferta{align-self:flex-start;display:inline-flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;border-radius:999px;background:var(--paper);border:1px solid var(--line);text-decoration:none;font-size:15px}
.pill-oferta b{padding:4px 12px;border-radius:999px;background:var(--color-offer);color:var(--color-on-offer);font-weight:600;font-size:13px;letter-spacing:.04em}
.hero p.lead{max-width:520px;font-size:19px;font-weight:300;color:var(--ink-muted)}
.hero-b{display:flex;flex-wrap:wrap;gap:14px}
.hero-art{flex:1 1 420px;min-width:0;display:flex;justify-content:center}
.arco{position:relative;width:100%;max-width:520px;aspect-ratio:5/6;border-radius:260px 260px 32px 32px;overflow:hidden;background:var(--sage-deep)}
.arco img{width:100%;height:100%;display:block;object-fit:cover;object-position:70% 20%}
.flota{position:absolute;left:20px;right:20px;bottom:20px;display:flex;align-items:center;gap:14px;padding:14px 18px;border-radius:20px;background:var(--flota);font-size:15px;line-height:1.35}
.flota span{color:var(--ink-muted)}

.landing-main{display:flex;flex-direction:column}

/* Franja de confianza */
.trust{padding:0 24px}.trust-in{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:24px;overflow:hidden}
.trust-c{background:var(--paper-soft);padding:24px 26px;display:flex;gap:14px;align-items:flex-start}
.trust.suelta{padding-bottom:88px}
.trust-c b{display:block;font-weight:600}.trust-c span{display:block;font-size:15px;color:var(--ink-muted)}

/* Ofertas */
.ofertas{padding:104px 24px 96px}.ofertas-in{max-width:1240px;margin:0 auto;display:flex;flex-direction:column;gap:44px}
.of-cab{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px}
.of-cab>div:first-child{display:flex;flex-direction:column;gap:12px}
.pill-fecha{display:inline-flex;align-items:center;gap:10px;padding:12px 20px;border-radius:999px;background:var(--paper);border:1px solid var(--line);font-size:15px}
.pill-fecha .ic{color:var(--offer-tx)}
.of-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px}
.ocard{background:var(--paper);border-radius:28px;padding:14px;display:flex;flex-direction:column;gap:22px;border:1px solid var(--line-card)}
.ofoto{position:relative;height:260px;border-radius:20px;background:var(--foto);display:flex;align-items:center;justify-content:center;color:var(--ink-soft);overflow:hidden}
.ofoto img,.pimg img{width:100%;height:100%;object-fit:contain;padding:14px;mix-blend-mode:multiply}
.ofoto .badge{position:absolute;top:14px;left:14px;padding:6px 14px;font-size:13px}
.ocard-t{padding:0 12px;display:flex;flex-direction:column;gap:8px;flex-grow:1}
.ocard-t h3{font:400 26px var(--serif-t)}.ocard-t .fmt{font-size:15px;color:var(--ink-muted)}
.precios{display:flex;align-items:baseline;gap:12px;margin-top:6px}
.p-of{font-size:30px;font-weight:600;color:var(--offer-tx)}.p-ant{font-size:17px;color:var(--ink-soft);text-decoration:line-through}
.ocard .btn{min-height:52px;font-size:16px}

/* Bloque oscuro */
.pausa{padding:0 24px}.pausa-in{max-width:1240px;margin:0 auto;border-radius:36px;background:var(--surf);color:var(--on-pine);padding:clamp(48px,7vw,96px) clamp(28px,6vw,88px);display:flex;flex-wrap:wrap;gap:48px;align-items:center}
.pausa-t{flex:1 1 420px;min-width:0;display:flex;flex-direction:column;gap:20px}
.pausa .eyebrow{color:var(--leaf-light)}
.pausa h2{font:300 clamp(34px,4vw,52px)/1.1 var(--serif);letter-spacing:-.02em}
.pausa-t p{font-size:18px;font-weight:300;max-width:460px}
.pasos{flex:1 1 380px;min-width:0;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.pasos li{display:flex;gap:20px;padding:22px 0;border-bottom:1px solid color-mix(in srgb,var(--color-on-inverse) 18%,transparent)}.pasos li:last-child{border:0}
.pasos .num{font:italic 300 32px/1 var(--serif);color:var(--leaf-light)}
.pasos b{display:block;font-size:19px;font-weight:500}.pasos span{display:block;font-size:16px;font-weight:300}

/* Destacados */
.destacados{padding:104px 24px 96px}.dest-in{max-width:1240px;margin:0 auto;display:flex;flex-direction:column;gap:40px}
.dest-cab{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px}
.dest-cab>div{display:flex;flex-direction:column;gap:12px}
.dest-cab h2{font:300 clamp(34px,4vw,50px)/1.1 var(--serif);letter-spacing:-.02em}
.dest-cab a.ver{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:17px;font-weight:500}
.filas{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:16px}
.fila{min-width:0;display:flex;gap:18px;align-items:center;padding:14px 22px 14px 14px;border-radius:22px;background:var(--paper);border:1px solid var(--line-card);text-decoration:none;color:var(--tx)}
.fila .mini{flex:0 0 auto;width:84px;height:84px;border-radius:16px;background:var(--foto);display:flex;align-items:center;justify-content:center;color:var(--ink-soft);overflow:hidden}
.fila .mini img{width:100%;height:100%;object-fit:contain;padding:6px;mix-blend-mode:multiply}
.fila .tx{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.fila .tx b{font-size:18px;font-weight:500}.fila .tx span{font-size:14px;color:var(--ink-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fila .pr{font-size:19px;font-weight:600;color:var(--leaf)}

/* CTA final */
.cta{padding:0 24px 96px}.cta-in{max-width:1240px;margin:0 auto;border-radius:36px;background:var(--sage-deep);padding:clamp(48px,7vw,88px) 28px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px}
.cta h2{max-width:720px}.cta p{max-width:520px;font-size:18px;font-weight:300;color:var(--ink-muted)}
.cta .btn{min-height:58px;padding:0 34px;font-size:18px}.cta small{font-size:15px;color:var(--ink-muted)}

/* Pie */
.pie{padding:32px 0 44px;border-top:1px solid var(--line)}
.pie-in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px 40px;font-size:14px;color:var(--ink-muted)}.pie-in span+span{max-width:620px}

/* Catálogo */
.titulo-cat{padding:40px 0 24px}.titulo-cat-in{display:flex;flex-direction:column;gap:20px}
.tc-fila{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px}
.tc-fila>div{display:flex;flex-direction:column;gap:6px;max-width:640px}
.tc-fila h1{font:300 40px/1.1 var(--serif);letter-spacing:-.02em}

.buscar{flex:0 1 400px;min-width:260px;position:relative;display:flex;align-items:center;gap:12px;min-height:56px;padding:0 20px;border-radius:999px;background:var(--paper);border:1px solid var(--line)}
.buscar .ic{color:var(--ink-soft)}.buscar input{flex:1;min-width:0;border:0;outline:none;background:transparent;font:inherit;font-size:17px;color:var(--tx)}
.buscar:focus-within{outline:3px solid var(--color-focus);outline-offset:2px}.buscar input:focus-visible{outline:none}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{min-height:44px;padding:0 20px;border-radius:999px;font:400 15px var(--sans);cursor:pointer;background:var(--paper);color:var(--tx);border:1px solid var(--line)}
.chip[aria-pressed="true"]{background:var(--btn-d-bg);color:var(--btn-d-tx);border-color:var(--btn-d-bg);font-weight:500}
.lista-sec{padding:24px 0 96px}.lista-in{display:flex;flex-direction:column;gap:20px}
.resultados{font-size:15px;color:var(--ink-muted)}
.sin{padding:64px 24px;border-radius:28px;background:var(--sage);text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}
.sin h2{font:300 28px var(--serif)}.sin p{color:var(--ink-muted)}.sin .btn{min-height:48px;padding:0 24px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.pcard{content-visibility:auto;contain-intrinsic-size:auto 540px;background:var(--paper);border:1px solid var(--line-card);border-radius:24px;padding:12px;display:flex;flex-direction:column;gap:16px}
.pimg{position:relative;height:230px;border:0;border-radius:18px;background:var(--foto);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--ink-soft);padding:0;overflow:hidden;font:inherit;font-size:14px}
.pimg .badge{position:absolute;top:12px;left:12px}
.pinfo{padding:0 8px;display:flex;flex-direction:column;gap:6px;flex-grow:1}
.pinfo h2{font:400 23px/1.2 var(--serif-t);cursor:pointer}.pinfo .fmt{font-size:14px;color:var(--ink-muted)}
.pinfo .desc{font-size:15px;color:var(--ink-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.enlace{align-self:flex-start;min-height:32px;padding:0;border:0;background:none;color:var(--leaf);font:500 15px var(--sans);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.pfoot{padding:0 8px 8px;display:flex;flex-direction:column;align-items:stretch;gap:12px}
.pfoot .precios{margin:0;flex-direction:row;gap:10px;align-items:baseline;line-height:1.2}
.pfoot .p-n{font-size:22px;font-weight:600;color:var(--leaf)}.pfoot .p-of{font-size:22px}.pfoot .p-ant{font-size:14px}
.add{min-height:46px;padding:0 20px;border-radius:999px;font:500 15px var(--sans);cursor:pointer;background:var(--color-primary);color:var(--color-on-primary);border:1.5px solid var(--color-primary)}
.add.en{background:var(--sage);color:var(--tx);border-color:var(--color-primary-text)}

/* Ventanas: detalle y pedido (dialog nativo: foco atrapado, Esc y foco de regreso incluidos) */
dialog{border:0;padding:0;color:var(--tx);font:inherit}
dialog::backdrop{background:var(--overlay)}
#ficha{width:min(940px,calc(100% - 48px));max-height:calc(100vh - 48px);overflow:auto;background:var(--paper-soft);border-radius:32px;padding:28px;margin:auto}
#ficha[open]{position:fixed}  /* fijo en la pantalla (no en la página): se abre sobre lo que se está viendo; también ancla el botón de cerrar */
.asa{display:none}
.cerrar{position:absolute;top:18px;right:18px;width:44px;height:44px;border:0;border-radius:999px;background:var(--sage);color:var(--tx);cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:3}
.f-cuerpo{display:flex;flex-wrap:wrap;gap:32px}
.galeria{flex:1 1 340px;min-width:0}
#marco,#sinfoto{position:relative;height:380px;border-radius:24px;background:var(--foto);overflow:hidden;display:flex;align-items:center;justify-content:center;color:var(--ink-soft)}
#foto{width:100%;height:100%;object-fit:contain;padding:18px;mix-blend-mode:multiply;cursor:zoom-in;transition:transform .15s}#foto.zoom{transform:scale(2.4);cursor:zoom-out}
.flecha{position:absolute;top:50%;margin-top:-22px;width:44px;height:44px;border:0;border-radius:999px;background:var(--paper);color:var(--tx);cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2;box-shadow:0 0 0 1px var(--color-border-card)}
#prev{left:14px}#next{right:14px}
.puntos{position:absolute;bottom:16px;left:0;right:0;display:flex;justify-content:center;gap:8px;z-index:2}
.puntos i{width:8px;height:8px;border-radius:999px;background:var(--color-border)}.puntos i.on{background:var(--tx)}
.f-texto{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:14px;padding-top:8px}
.f-texto .badge{align-self:flex-start}
.f-texto h2{font:400 36px/1.1 var(--serif);padding-right:48px}
.f-precio{display:flex;align-items:baseline;gap:12px}.f-precio .p-n{font-size:28px;font-weight:600;color:var(--leaf)}.f-precio .p-of{font-size:28px}
.f-texto .fmt{font-size:15px;color:var(--ink-muted)}.f-texto .d{font-size:17px}
.vermas{align-self:flex-start;min-height:36px;padding:0;border:0;background:none;color:var(--leaf);font:500 16px var(--sans);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
#f-mas h3{font:600 15px var(--sans);margin:12px 0 2px;color:var(--leaf)}#f-mas p{font-size:15px}
.f-acc{display:flex;flex-wrap:nowrap;gap:10px;margin-top:8px}.f-acc .btn{flex:1 1 0;min-width:0;min-height:52px;font-size:16px;padding:0 14px;white-space:nowrap}
.aviso{padding-top:18px;margin-top:24px;border-top:1px solid var(--line);font-size:14px;color:var(--ink-muted)}

#carrito{width:min(460px,100%);height:100dvh;max-height:none;margin:0 0 0 auto;background:var(--paper-soft);padding:28px;overflow:auto}
#carrito[open]{display:flex;flex-direction:column;gap:20px}
.c-cab{display:flex;align-items:center;justify-content:space-between}.c-cab h2{font:400 32px var(--serif)}
.c-cab .cerrar{position:static}
.c-vacio{flex-grow:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;color:var(--ink-muted)}
.c-vacio b{font-size:18px;color:var(--tx);font-weight:500}
.c-linea{display:flex;gap:14px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.c-linea .mini{flex:0 0 auto;width:64px;height:64px;border-radius:14px;background:var(--foto);overflow:hidden}.c-linea .mini img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.c-linea .d{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}.c-linea .d b{font-weight:500}.c-linea .d span{font-size:14px;color:var(--ink-muted)}
.quitar{align-self:flex-start;min-height:28px;padding:0;border:0;background:none;color:var(--ink-muted);font:inherit;font-size:14px;text-decoration:underline;cursor:pointer}
.stepper{display:flex;align-items:center;gap:6px}.stepper button{width:44px;height:44px;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--tx);font:inherit;font-size:20px;cursor:pointer}
.stepper span{min-width:24px;text-align:center;font-weight:600}
.c-pie{margin-top:auto;display:flex;flex-direction:column;gap:12px}
.c-total{display:flex;justify-content:space-between;align-items:baseline}.c-total span:first-child{font-size:18px}.c-total span:last-child{font-size:26px;font-weight:600}
.c-pie p{font-size:14px;color:var(--ink-muted)}.c-pie .btn{min-height:56px;font-size:17px}

/* ====== Teléfono ====== */
@media (max-width:720px){
body{font-size:16px}
.wrap{padding:0 16px}
.solo-esc{display:none!important}
.nav{display:none}.nav-movil{display:flex;gap:6px}
.top,.top.fijo{padding:12px 0;position:sticky;top:0;z-index:6;background:var(--mist-t)}
.brand{font-size:19px;gap:8px}.brand .largo{display:none}.brand .corto{display:inline}
.btn-ic{width:44px;height:44px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:var(--btn-d-bg);color:var(--btn-d-tx);border:0;cursor:pointer;position:relative}
.btn-ic:hover{color:var(--btn-d-tx)}.btn-ic.claro{background:var(--paper);color:var(--tx);border:1px solid var(--line)}.btn-ic.claro:hover{color:var(--tx)}
.btn-ic .cuenta{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;font-size:12px;padding:0 5px}
.menu-movil{position:sticky;top:69px;z-index:6;display:flex;flex-direction:column;background:var(--paper-soft);border-bottom:1px solid var(--line);padding:8px 16px}
.menu-movil[hidden]{display:none!important}.menu-movil a{min-height:48px;display:flex;align-items:center;text-decoration:none;font-size:18px}
.solo-movil-i{display:inline}.solo-movil-b{display:flex}.titulo-movil.solo-movil-b{display:block}.top.fijo .brand{display:none}
.hero{padding:28px 0}.hero-in{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:22px}
.hero-t{display:contents}
.pill-oferta{order:1;padding:6px 14px 6px 6px;font-size:14px}.pill-oferta b{padding:3px 10px;font-size:12px}
.hero h1.t{order:2;font-size:42px;line-height:1.04}.hero p.lead{order:3;font-size:17px}
.hero-art{order:4;flex:none}.arco{max-width:none;aspect-ratio:auto;height:430px;border-radius:180px 180px 24px 24px}.arco img{object-position:72% 18%}.flota{display:none}
.hero-b{order:5;flex-direction:column;gap:10px}.hero-b .btn{min-height:54px;width:100%}
.ofertas{order:2;padding:0 0 8px}.ofertas-in{gap:14px}.of-cab{display:none}
.of-cab-movil{display:flex;padding:0 16px;align-items:baseline;justify-content:space-between;gap:12px}
.of-cab-movil .eyebrow{font-size:12px;letter-spacing:.08em;white-space:nowrap}.of-cab-movil span{font-size:13px;color:var(--ink-muted)}
.of-grid{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 16px 6px;scroll-padding-left:16px}
.ocard{flex:0 0 290px;scroll-snap-align:start;border-radius:24px;padding:10px;gap:16px}
.ofoto{height:200px;border-radius:18px}.ocard-t{padding:0 8px;gap:4px}.ocard-t h3{font-size:23px}.ocard-t .fmt{font-size:14px}.p-of{font-size:26px}.p-ant{font-size:15px}.ocard .btn{min-height:48px}
.trust{order:3;padding:40px 16px 48px}.trust-in{display:flex;flex-direction:column;border-radius:20px}.trust-c{padding:16px 18px;gap:12px;border-bottom:1px solid var(--line)}.trust-c:last-child{border:0}.trust-c span{font-size:14px}
.pausa{order:4;padding:0 16px}.pausa-in{border-radius:28px;padding:40px 24px;gap:18px}.pausa h2{font-size:32px;line-height:1.12}.pausa-t p{display:none}.pausa .eyebrow{font-size:13px}
.pasos li{padding:16px 0;gap:16px}.pasos .num{font-size:28px}.pasos b{font-size:17px}.pasos span{font-size:15px}
.destacados{order:5;padding:56px 16px 48px}.dest-in{gap:20px}.dest-cab h2{font-size:32px;line-height:1.12}.dest-cab a.ver{display:none}
.filas{grid-template-columns:minmax(0,1fr);gap:10px}.fila{padding:10px 16px 10px 10px;border-radius:18px;gap:14px}.fila:nth-child(n+5){display:none}
.fila .mini{width:64px;height:64px;border-radius:14px}.fila .tx b{font-size:16px}.fila .tx span{font-size:13px}.fila .pr{font-size:16px}
.ver-todos{display:flex;min-height:52px}
.cta{order:6;padding:0 16px 40px}.cta-in{border-radius:28px;padding:40px 22px;gap:16px}.cta h2{font-size:32px;line-height:1.1}.cta p{font-size:16px}.cta .btn{display:none}
.pie{order:7;padding:24px 0 120px}.pie-in{flex-direction:column;gap:10px;font-size:13px}
.barra-movil{display:flex;position:sticky;bottom:0;z-index:6;padding:12px 16px 16px;background:var(--mist-t);border-top:1px solid var(--line);gap:10px}
.barra-movil .btn{min-height:50px;padding:0;flex:1;font-size:16px}.barra-movil .btn-p{flex:1.6}
/* catálogo */
.titulo-cat{padding:12px 0 14px}.tc-fila h1{font-size:30px}.tc-txt .eyebrow{font-size:12px}
.filtros{top:var(--alto,69px);padding:10px 0}.filtros-in{flex-direction:column;align-items:stretch;gap:12px}
.titulo-cat-in{gap:0}.tc-fila{display:block}.buscar{flex:none;min-height:48px;padding:0 16px;min-width:0;width:100%}.buscar input{font-size:16px}
.chips{flex-wrap:nowrap;overflow-x:auto;gap:8px;margin:0 -16px;padding:0 16px 2px}.chip{flex:0 0 auto;min-height:40px;padding:0 16px;font-size:14px;white-space:nowrap}
.lista-sec{padding:0 0 120px}.lista-in{gap:12px;padding-top:16px}.barra-pedido~.arriba{bottom:92px}.resultados{font-size:14px}
.grid{grid-template-columns:1fr;gap:12px}
.pcard{display:grid;grid-template-columns:104px 1fr;grid-template-areas:"img info" "img foot";border-radius:20px;padding:10px;gap:0 14px}
.pimg{grid-area:img;width:104px;height:120px;border-radius:14px}.pimg .badge{top:6px;left:6px;padding:2px 8px;font-size:11px}
.pinfo{grid-area:info;padding:0;gap:3px;flex-grow:0}.pinfo h2{font-size:19px}.pinfo .desc,.pinfo .enlace{display:none}.pinfo .fmt{font-size:13px}
.pfoot{grid-area:foot;padding:0;align-self:end;gap:6px}.pfoot .p-n{font-size:18px}.pfoot .p-of{font-size:17px}.pfoot .p-ant{font-size:13px}
.acc{gap:6px}.add,.wa-card{min-height:44px;padding:0 10px;font-size:14px}.wa-card{gap:5px}
.barra-pedido{position:fixed;left:16px;right:16px;bottom:16px;z-index:8;min-height:58px;padding:0 8px 0 20px;border:0;border-radius:999px;background:var(--color-selected-bg);color:var(--color-selected-text);font:inherit;align-items:center;justify-content:space-between;cursor:pointer}
.barra-pedido:not([hidden]){display:flex}
.barra-pedido>span:first-child{font-size:15px}.barra-pedido>span:last-child{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;background:var(--color-primary);color:var(--color-on-primary);font-weight:600}
/* hojas desde abajo */
#ficha,#carrito{width:100%;max-width:100%;margin:auto 0 0;max-height:92dvh;height:auto;border-radius:28px 28px 0 0;padding:10px 16px 24px}
#carrito[open]{gap:12px}
.asa{display:flex;justify-content:center;padding:4px 0}.asa i{width:40px;height:5px;border-radius:999px;background:var(--line)}
.cerrar{top:22px;right:16px}.c-cab .cerrar{position:static}
.f-cuerpo{flex-direction:column;flex-wrap:nowrap;gap:14px}.galeria,.f-texto{flex:none}
#marco,#sinfoto{height:260px;border-radius:20px}#prev{left:10px}#next{right:10px}
.f-texto{padding-top:0;gap:12px}.f-texto h2{font-size:28px;line-height:1.12;padding-right:52px}.f-precio .p-n,.f-precio .p-of{font-size:24px}
.f-texto .d{font-size:16px}.f-acc{margin-top:0;gap:8px}.f-acc .btn{min-height:54px;font-size:15px;padding:0 10px}
.aviso{font-size:12px;margin-top:12px;padding-top:12px}
.c-cab h2{font-size:28px}.c-linea{padding:12px 0;gap:12px}.c-linea .mini{width:56px;height:56px;border-radius:12px}.c-linea .d b{font-size:15px}.c-linea .d span,.quitar{font-size:13px}
.stepper{gap:4px}.c-total span:first-child{font-size:17px}.c-total span:last-child{font-size:24px}.c-pie p{font-size:13px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}#foto{transition:none}}

/* Tarjetas: Agregar y WhatsApp lado a lado */
.acc{display:flex;gap:8px}.acc>*{flex:1 1 0;min-width:0}
.wa-card{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:46px;padding:0 14px;border-radius:999px;border:1.5px solid var(--tx);color:var(--tx);text-decoration:none;font:500 15px var(--sans);white-space:nowrap}
.wa-card:hover{color:var(--tx);background:var(--sage)}
/* Buscador fijo */
.filtros{position:sticky;top:var(--alto,77px);z-index:4;background:var(--mist-t);border-bottom:1px solid var(--line);padding:12px 0}
.filtros-in{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}.filtros .buscar{flex:0 1 380px}
/* Pasarela: carrusel de productos que se mueve solo y se puede deslizar */
.pasarela{padding:0 0 88px}
.pas-vp{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.pas-vp::-webkit-scrollbar{display:none}
.pas-pista{display:flex;gap:14px;width:max-content;padding:4px 0}
.pas-card{flex:0 0 220px;display:flex;flex-direction:column;gap:10px;padding:10px;border-radius:22px;background:var(--paper);border:1px solid var(--line-card);text-decoration:none;color:var(--tx)}
.pas-foto{aspect-ratio:1;border-radius:14px;background:var(--foto);display:flex;align-items:center;justify-content:center;overflow:hidden;color:var(--ink-soft)}
.pas-foto img{width:100%;height:100%;object-fit:contain;padding:10px;mix-blend-mode:multiply}
.pas-card b{font-weight:500;font-size:16px;padding:0 4px;line-height:1.25;min-height:2.5em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pas-card span.pr{padding:0 4px 4px;font-weight:600;color:var(--leaf)}
/* Volver arriba */
.arriba{position:fixed;right:20px;bottom:24px;z-index:7;width:48px;height:48px;border:0;border-radius:999px;background:var(--btn-d-bg);color:var(--btn-d-tx);display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .2s,transform .2s}
.arriba.ver{opacity:1;transform:none;pointer-events:auto}
/* Botón de tema */
.btn-tema{width:44px;height:44px;border-radius:999px;border:1px solid var(--line);background:var(--paper);color:var(--tx);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.btn-tema:hover{background:var(--sage)}
.tema-btn .i-sol{display:none}.tema-btn .i-luna{display:block}
:root[data-theme="dark"] .tema-btn .i-sol{display:block}:root[data-theme="dark"] .tema-btn .i-luna{display:none}
@media (max-width:720px){
.pasarela{order:1;padding:0 0 28px}.pasarela>.wrap{padding:0}.pas-pista{padding:4px 16px;gap:12px}.pas-card{flex-basis:170px;border-radius:18px;padding:8px}.pas-card b{font-size:15px}
.arriba{right:16px;bottom:92px}
.nav-movil .btn-tema{width:44px;height:44px}
}
@media (min-width:721px){.hero{padding-bottom:56px}}
@media (prefers-reduced-motion:reduce){.arriba{transition:none}}
@media (max-width:720px){
.filtros .buscar{flex:none;width:100%}
.filtros-in,.filtros-in>*{min-width:0}
.chips{max-width:calc(100% + 32px)}
}

/* Precio promocional: el nuevo destacado y el anterior tachado */
.viejo{color:var(--ink-soft);text-decoration:line-through;font-weight:400;font-size:.85em}
.pas-card .pr.of{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px}.pas-card .nuevo,.fila .nuevo{color:var(--offer-tx)}
.fila .pr.of{display:flex;flex-direction:column;align-items:flex-end;line-height:1.2}
.c-linea .d .viejo{font-size:13px}

/* Moneda: la página trae US$ y C$; se muestra el elegido */
.m .nio{display:none}
:root[data-moneda="nio"] .m .usd{display:none}
:root[data-moneda="nio"] .m .nio{display:inline}
.moneda{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:3px;background:var(--paper)}
.mon-btn{min-height:36px;min-width:46px;padding:0 10px;border:0;border-radius:999px;background:transparent;color:var(--tx);font:500 14px var(--sans);cursor:pointer}
.mon-btn[aria-pressed="true"]{background:var(--btn-d-bg);color:var(--btn-d-tx)}
/* Carrito: tocar un producto abre su ficha para verificarlo */
.c-linea .mini{padding:0;border:0;cursor:pointer;display:block}
.ver-prod{padding:0;border:0;background:none;font:500 16px var(--sans);color:var(--tx);text-align:left;cursor:pointer;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:3px}
.ver-prod:hover,.c-linea .mini:hover+.d .ver-prod{text-decoration-color:currentColor}
@media (max-width:720px){.mon-btn{min-width:40px;padding:0 8px}.nav-movil{align-items:center}.ver-prod{font-size:15px}}
@media (max-width:720px){
.top-in{flex-wrap:nowrap;gap:8px}.brand{min-width:0;font-size:17px;gap:6px}.brand .ic{width:24px;height:24px}
.titulo-movil{flex:1;min-width:0;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-movil{flex:none}
.barra-pedido>span{white-space:nowrap}
}

/* Modo oscuro: las fotos de producto (fondo blanco) van dentro de una tarjeta redonda sobre el fondo hundido */
:root[data-theme="dark"] .ofoto,:root[data-theme="dark"] .pimg,:root[data-theme="dark"] .fila .mini,:root[data-theme="dark"] .pas-foto,:root[data-theme="dark"] #marco,:root[data-theme="dark"] .c-linea .mini{padding:8px}
:root[data-theme="dark"] .ofoto img,:root[data-theme="dark"] .pimg img,:root[data-theme="dark"] .fila .mini img,:root[data-theme="dark"] .pas-foto img,:root[data-theme="dark"] #foto,:root[data-theme="dark"] .c-linea .mini img{mix-blend-mode:normal;background:#fff;border-radius:10px}
:root[data-theme="dark"] .pimg .badge,:root[data-theme="dark"] .ofoto .badge{z-index:1}

.powered{flex:0 0 100%;color:var(--ink-muted);font-size:14px;text-decoration:none}.powered:hover{color:var(--leaf);text-decoration:underline}

/* Banner del catálogo (DISENO.md 5.1): siempre verde profundo, igual en claro y oscuro */
:root{--color-banner-bg:#06301F}
.banner{padding:32px 24px 0}
.banner-in{--b-acc:#7CC79E;--b-ital:#A9D3B8;--b-p:#CFE0D4;--b-li:#E8EFE6;--b-t:#F3F4EE;position:relative;max-width:1240px;height:500px;margin:0 auto;border-radius:32px;overflow:hidden;background:var(--color-banner-bg);color:var(--b-t)}
.banner-foto{position:absolute;top:0;right:0;width:64%;height:100%;object-fit:cover;object-position:30% 50%;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 20%);mask-image:linear-gradient(90deg,transparent 0%,#000 20%)}
.banner-txt{position:relative;width:560px;height:100%;padding:56px 0 56px 64px;display:flex;flex-direction:column;justify-content:center;gap:22px}
.banner-eb{display:flex;align-items:center;gap:14px;font-size:13px;font-weight:600;letter-spacing:.16em;color:var(--b-acc)}.banner-eb i{width:44px;height:1.5px;background:var(--b-acc)}
.banner h2{font:300 52px/1.04 var(--serif);letter-spacing:-.02em}.banner h2 .it{font-style:italic;color:var(--b-ital)}
.banner p{font-size:17px;font-weight:300;color:var(--b-p)}.banner .p-corto{display:none}
.banner ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:12px 24px;font-size:15px;color:var(--b-li)}
.banner li{display:flex;align-items:center;gap:10px}.banner li .ic{color:var(--b-acc);stroke-width:1.6}
.banner .btn{align-self:flex-start}
@media (min-width:721px) and (max-width:1100px){.banner h2{font-size:40px}}
@media (max-width:720px){
.pcard{contain-intrinsic-size:auto 140px}
.banner{padding:16px}.banner-in{height:auto;border-radius:26px}
.banner-foto{position:static;display:block;width:100%;height:236px;object-position:38% 50%;-webkit-mask-image:none;mask-image:none}
.banner-txt{width:auto;height:auto;padding:22px 20px 24px;gap:14px}
.banner-eb{font-size:12px;gap:10px}.banner-eb i{width:28px}
.banner h2{font-size:32px;line-height:1.08;letter-spacing:0}
.banner p{font-size:15px}.banner .p-largo{display:none}.banner .p-corto{display:inline}
.banner ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;font-size:13px;line-height:1.3;text-align:center}
.banner li{flex-direction:column;gap:6px}.banner li .ic{width:22px;height:22px}
.banner .btn{width:100%;min-height:54px;font-size:16px}
}

/* Una sola línea siempre: el título de ofertas se achica con el ancho y los botones de las tarjetas no parten su texto */
.of-cab h2{white-space:nowrap;font-size:clamp(20px,5.4vw,56px)}
.acc .add{flex:1 1 auto;min-width:0;white-space:nowrap;font-size:14px;padding:0 8px}
.acc .wa-card{flex:0 0 auto;padding:0 10px;font-size:14px;gap:5px}

/* Enlace del nombre en las tarjetas y páginas de producto */
.pinfo h2 a{color:inherit;text-decoration:none}.pinfo h2 a:hover{color:var(--leaf)}
.pp{padding:24px 0 72px}
.migas{display:flex;flex-wrap:wrap;gap:6px 10px;font-size:14px;color:var(--ink-muted);margin-bottom:24px}.migas a{color:var(--ink-muted);text-decoration:none}.migas a:hover{color:var(--leaf);text-decoration:underline}
.pp-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
.pp-foto{aspect-ratio:1;border-radius:24px;background:var(--foto);display:flex;align-items:center;justify-content:center;overflow:hidden;color:var(--ink-soft)}
.pp-foto img{width:100%;height:100%;object-fit:contain;padding:18px;mix-blend-mode:multiply}
:root[data-theme="dark"] .pp-foto{padding:8px}:root[data-theme="dark"] .pp-foto img{mix-blend-mode:normal;background:#fff;border-radius:10px}
.pp-minis{display:flex;gap:10px;margin-top:12px}
.pp-mini{width:72px;height:72px;padding:0;border:1px solid var(--line);border-radius:14px;background:#fff;cursor:pointer;overflow:hidden}.pp-mini img{width:100%;height:100%;object-fit:contain}
.pp-txt{display:flex;flex-direction:column;gap:14px}
.pp-txt h1{font:400 40px/1.1 var(--serif-t)}
.pp-txt h2{font:600 15px var(--sans);margin:10px 0 0;color:var(--leaf)}.pp-txt p{font-size:16px}.pp-txt .fmt{font-size:15px;color:var(--ink-muted)}.pp-txt .d{font-size:17px}
.pp-txt .f-acc{margin-top:8px}
.pp-rel{margin-top:64px}.pp-rel h2{font:300 clamp(28px,3.4vw,40px)/1.1 var(--serif);margin-bottom:20px}.ver-todos-pp{margin-top:20px}
@media (max-width:720px){
.pp{padding:12px 0 48px}.pp-in{grid-template-columns:minmax(0,1fr);gap:20px}.pp-txt h1{font-size:30px}.pp-rel{margin-top:40px}.pp-minis{margin-top:10px}
.pp-txt .f-acc{flex-direction:row}
}

.pp-txt .alias{font-size:14px;color:var(--ink-muted);margin-top:-6px}

.redes{display:flex;gap:10px;align-items:center}.red{position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink-muted);cursor:pointer;text-decoration:none}.red:hover{color:var(--leaf);border-color:var(--leaf)}.redes [hidden]{display:none}
[data-share]{position:relative}.f-acc .comp-i{flex:0 0 54px;padding:0}
[data-share].ok::after{content:"¡Enlace copiado!";position:absolute;bottom:calc(100% + 8px);right:0;white-space:nowrap;background:var(--surf);color:var(--on-pine);font-size:13px;padding:6px 10px;border-radius:8px}
.hero-b{align-items:center;flex-wrap:nowrap}
@media (max-width:720px){.hero-b{order:5;flex-direction:row;gap:10px}.hero-b .btn{flex:1 1 0;min-width:0;width:auto;padding:0 10px;font-size:15px;white-space:nowrap}.hero-b .redes{gap:6px;flex:none}.hero-b .red{width:46px;height:46px}}

.cta-txt{display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px}
.cta-mapa iframe{display:block;width:100%;height:100%;min-height:340px;border:0;border-radius:24px;background:var(--foto)}
.cta-in:has(.cta-mapa:not([hidden])){display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px;text-align:left}
.cta-in:has(.cta-mapa:not([hidden])) .cta-txt{align-items:flex-start;text-align:left}
@media (max-width:720px){.cta-txt{gap:16px}.cta-in:has(.cta-mapa:not([hidden])){grid-template-columns:1fr;gap:24px}.cta-mapa iframe{min-height:260px;border-radius:20px}}

.legal{max-width:760px;margin:0 auto;padding:32px 0 56px}
.legal h2{font-size:1.15rem;margin:28px 0 8px}
.legal p,.legal li{line-height:1.65}
.legal ul{padding-left:1.2em;margin:8px 0}
.pie a:not(.powered):not(.red){text-decoration:underline;text-underline-offset:3px}
.legal .f-acc{margin-top:28px}