/*
 * Sistema de diseño compartido (theme + widgets del core).
 * Tokens consolidados: un solo bloque :root. Cambiar de marca = editar este bloque.
 * El core incluye una copia de este archivo (sin @font-face) como respaldo
 * para cuando el theme no está activo.
 */

/* @fuentes:inicio */
@font-face{font-family:"Onest";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/onest-400.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Onest";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/onest-500.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Onest";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/onest-600.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Onest";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/onest-700.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Onest";font-style:normal;font-weight:800;font-display:swap;src:url("../fonts/onest-800.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Respaldo con métricas ajustadas: el cambio de fuente no mueve el texto (CLS). */
@font-face{font-family:"Onest Fallback";src:local("Arial"),local("ArialMT");ascent-override:92.2019%;descent-override:28.9913%;line-gap-override:0%;size-adjust:105.2039%}
/* @fuentes:fin */

:root{
  /* Marca (provisional: Marca Demo) */
  --ink:#112E3B; --ink-2:#4B6470; --ink-3:#5E7480;
  --primary:#FF6B2C;        /* naranja de marca: bordes, badge, estrellas. Nunca con texto blanco encima */
  --primary-dk:#F2561A;
  --primary-text:#C2410C;   /* naranja para texto e iconos sobre claro (5.2:1) */
  --btn-bg:#CF4A15;         /* fondo de botón con texto blanco (4.5:1) */
  --btn-bg-hover:#B53E10;
  --primary-soft:#FFF1EA;
  --ice:#EEF5F8; --ice-2:#E3EEF3;
  --offer:#FF6B2C; --offer-soft:#FFE9DE; --offer-ink:#9A3412;
  --signal:#1DB37A;
  --bg:#F6F9FA; --surface:#FFFFFF; --line:#DCE6EA; --muted-dot:#C9D8DE;
  --on-dark-2:#B9C7CA;      /* texto secundario sobre navy */
  --on-dark-accent:#FF8A57; /* naranja legible sobre navy */
  --grad-hero:linear-gradient(135deg,#FFF3EC 0%,#F7FAFB 50%,#E6F0F4 100%);
  --grad-soft:linear-gradient(180deg,#F5F9FA 0%,#FFF6F1 100%);
  --grad-soft-2:linear-gradient(180deg,#FFF7F2 0%,#F3F8FA 100%);
  --grad-dark:linear-gradient(135deg,#112E3B 0%,#18404F 60%,#1F5064 100%);
  --grad-chip:linear-gradient(135deg,#FFE4D6 0%,#FFF3EC 100%);
  --grad-chip-ice:linear-gradient(135deg,#DDEBF1 0%,#F1F7F9 100%);
  --radius-lg:20px; --radius-md:12px; --radius-sm:8px;
  --font:"Onest","Onest Fallback",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --wrap:1200px;
}

/* Base */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.55;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--primary);outline-offset:3px;border-radius:4px}
.wrap{width:min(var(--wrap),100% - 40px);margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:12px;top:-60px;z-index:100;background:var(--surface);color:var(--ink);padding:10px 16px;border-radius:var(--radius-sm);font-weight:600;box-shadow:0 8px 24px -8px rgba(17,46,59,.35)}
.skip-link:focus{top:12px}

/* Iconos (sprite SVG en línea) */
.i{width:1em;height:1em;fill:currentColor;flex:none;display:inline-block;vertical-align:middle}
.ico{display:inline-grid;place-items:center;flex:none;border-radius:12px;background:var(--grad-chip);color:var(--primary-text);width:44px;height:44px;font-size:24px}
.ico-sm{width:32px;height:32px;font-size:18px;border-radius:9px}
.ico-lg{width:56px;height:56px;font-size:30px;border-radius:16px}
.ico-ice{background:var(--grad-chip-ice);color:var(--ink)}
.check{flex:none;color:var(--primary-text);width:18px;height:18px}

/* Botones: compactos, nunca al 100 % de ancho; en móvil el texto parte en dos líneas */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-weight:600;line-height:1.2;padding:12px 22px;border-radius:10px;text-decoration:none;cursor:pointer;text-align:center;max-width:100%;transition:background-color .15s,color .15s,border-color .15s}
.btn .i{font-size:1.15em}
.btn-sm{padding:9px 16px;font-size:.92rem;border-radius:var(--radius-sm)}
.btn-lg{padding:14px 24px;font-size:1rem}
.btn-primary{background:var(--btn-bg);color:#fff;border:1.5px solid var(--btn-bg)}
.btn-primary:hover{background:var(--btn-bg-hover);border-color:var(--btn-bg-hover);color:#fff}
.btn-outline{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.btn-outline:hover{background:var(--primary-soft);border-color:var(--primary-text);color:var(--primary-text)}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn-ghost:hover{border-color:var(--ink)}
.btn-light{background:#fff;color:#112E3B;border:1.5px solid #fff}
.btn-light:hover{background:var(--btn-bg);border-color:var(--btn-bg);color:#fff}
.link-secondary{font-weight:600;color:var(--primary-text);text-underline-offset:3px}

/* Secciones: cada widget imprime su <section class="hst-sec …"> a ancho completo */
.block{padding:96px 0}
.block-head{max-width:720px;margin:0 0 48px}
.block-head.center{text-align:center;margin-inline:auto}
.block-head h2{font-size:clamp(1.9rem,3.4vw,2.7rem);letter-spacing:-.03em;line-height:1.12;margin:0 0 14px;font-weight:800}
.block-head p{color:var(--ink-2);font-size:1.08rem;margin:0}
.block-eyebrow{display:inline-block;font-weight:600;font-size:.9rem;color:var(--primary-text);margin:0 0 12px}

/* Migas de pan */
.crumbs{font-size:.88rem;color:var(--ink-3);margin:0 0 18px}
.crumbs ol{list-style:none;margin:0;padding:0}
.crumbs li{display:inline}
.crumbs li+li::before{content:"/";margin:0 8px;color:var(--line)}
.crumbs a{text-decoration:none}
.crumbs a:hover{text-decoration:underline}

/* Fondos de sección (control «Fondo» de los widgets). Dos clases para ganar a la regla del componente. */
.hst-sec.bg-surface{background:var(--surface)}
.hst-sec.bg-alt{background:var(--grad-soft)}
.hst-sec.bg-ice{background:var(--ice)}
.hst-sec.bg-peach{background:var(--primary-soft)}
.hst-sec.bg-hero{background:var(--grad-hero)}
.hst-sec.bg-soft-2{background:var(--grad-soft-2)}
.hst-sec.bg-dark{background:var(--grad-dark)}
.hst-sec.bg-custom{background:var(--sec-bg,var(--surface))}

/* Esquema oscuro: el texto y los acentos se adaptan al fondo de la sección */
.is-dark{
  --ink:#FFFFFF; --ink-2:#D3DEE2; --ink-3:#B9C7CA;
  --primary-text:#FF8A57; --line:rgba(255,255,255,.2);
  --bg:rgba(255,255,255,.08); --primary-soft:rgba(255,255,255,.1);
  --grad-chip:rgba(255,255,255,.1); --grad-chip-ice:rgba(255,255,255,.1);
  color:var(--ink);
}
.is-dark .btn-outline,.is-dark .btn-ghost{color:#fff;border-color:rgba(255,255,255,.7)}
.is-dark .btn-outline:hover,.is-dark .btn-ghost:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff}
.is-dark .crumbs li+li::before{color:rgba(255,255,255,.4)}
/* Fondo parecido al naranja de los botones: el botón principal cambia de variante */
.is-btn-swap:not(.is-dark) .btn-primary{background:#112E3B;border-color:#112E3B;color:#fff}
.is-btn-swap.is-dark .btn-primary{background:#fff;border-color:#fff;color:#112E3B}
/* Superficies claras dentro de una sección oscura conservan su propio esquema */
.hst-claro{
  --ink:#112E3B; --ink-2:#4B6470; --ink-3:#5E7480;
  --primary-text:#C2410C; --line:#DCE6EA; --bg:#F6F9FA; --primary-soft:#FFF1EA;
  --grad-chip:linear-gradient(135deg,#FFE4D6 0%,#FFF3EC 100%);
  --grad-chip-ice:linear-gradient(135deg,#DDEBF1 0%,#F1F7F9 100%);
  color:var(--ink);
}
.hst-claro .btn-outline{color:var(--ink);border-color:var(--ink)}

/* Aviso visible solo en el editor de Elementor */
.hst-editor-aviso{font:600 13px/1.4 system-ui,sans-serif;background:#FFF4D6;color:#5C3D00;border:1px solid #F2C14E;padding:8px 12px;margin:0}
.hst-editor-vacio{border:2px dashed #BFD2DA;border-radius:var(--radius-lg);background:linear-gradient(135deg,#FFFFFF,#F1F7F9);color:#4B6470;display:grid;place-items:center;text-align:center;padding:24px;font-size:.95rem}

@media (max-width:640px){
  .block{padding:64px 0}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important} /* !important: anula transiciones de cualquier origen, incluido Elementor */
}