/* Shared shell for the public-facing development pages. */
/* Inter (OFL, assets/fonts/Inter-OFL.txt), servida desde el propio dominio. */
@font-face{
  font-family:Inter;
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url(assets/fonts/inter-latin-wght-normal.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
}
header {
  display: block;
  min-height: 73px;
  border-bottom: 1px solid #ebeff4;
  background: #fff;
}
.site-header-inner,
.site-footer-inner {
  box-sizing: border-box;
  width: 100%;
  max-width: 1288px;
  margin: 0 auto;
  padding: 18px 24px;
}
.site-header-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.site-logo { display: flex; line-height: 1; }
.site-logo img { display: block; width: auto; height: 42px; }
.site-navigation { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 26px; font-size: 15px; font-weight: 500; }
.site-navigation a { color: #181c31; text-decoration: none; }
.site-navigation a[aria-current="page"] { color: #1967a7; font-weight: 700; }
.site-platform-link { padding: 10px 18px; border: 1px solid #ebeff4; border-radius: 8px; }

.nav-item { display: inline-flex; align-items: center; gap: 2px; position: relative; }
.nav-submenu-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  cursor: pointer;
}
.nav-submenu-toggle:hover { background: #f8fafb; }
.nav-submenu-toggle svg { transition: transform .15s ease; }
.nav-submenu-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.nav-submenu {
  display: none;
  flex-direction: column;
  gap: 2px;
  margin: 0;
  padding: 8px;
  list-style: none;
}
.nav-submenu a {
  display: block;
  padding: 10px 12px;
  border-radius: 8px;
  color: #181c31;
  text-decoration: none;
  font-weight: 500;
  font-size: 14px;
}
.nav-submenu a:hover,
.nav-submenu a:focus-visible { background: #f8fafb; color: #1967a7; }
.nav-submenu-highlight { border-bottom: 1px solid #ebeff4; margin-bottom: 6px; padding-bottom: 6px; }
.nav-submenu-highlight a { background: #f2f7fc; color: #1967a7; font-weight: 700; }
.nav-submenu-highlight a:hover,
.nav-submenu-highlight a:focus-visible { background: #e7f0fa; color: #1967a7; }
.nav-item.is-open .nav-submenu,
.nav-item:focus-within .nav-submenu { display: flex; }

@media (min-width: 768px) {
  .nav-submenu {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 0;
    padding-top: 16px;
    min-width: 260px;
    background: #fff;
    border: 1px solid #ebeff4;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(45, 74, 170, 0.18);
    z-index: 40;
  }
}
@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
  .nav-item:hover .nav-submenu { display: flex; }
}
@media (max-width: 767px) {
  .nav-item { display: flex; flex-wrap: wrap; width: 100%; justify-content: space-between; }
  .nav-submenu { width: 100%; margin: 4px 0 2px; padding-left: 14px; border-left: 2px solid #ebeff4; }
}
footer { display: block; margin-top: 0; background: #1967a7; color: #fff; }
.site-footer-inner { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; padding-top: 40px; padding-bottom: 40px; font-size: 14px; }
.site-footer-links { display: flex; flex-wrap: wrap; gap: 24px; }
.site-footer-links a { color: #fff; }

@media (max-width: 767px) {
  .site-header-inner { padding: 14px 16px; }
  .site-footer-inner { padding: 32px 20px; }
}

/* ===== TEMA DE COLOR (azul y naranja, ex dev9) ===== */
/* Duotono: paleta y retoques. Solo colores y alguna filigrana; no cambia estructura, textos, espacios ni tipografía. */
:root {
  --t-bg: #FFFFFF;
  --t-soft: #E7F0F9;
  --t-tint: #FFEEDF;
  --t-ink: #102A43;
  --t-muted: #536273;
  --t-muted2: #44515F;
  --t-accent: #1967A7;
  --t-accent-hover: #13507F;
  --t-accent-bg: #1967A7;
  --t-on-accent: #FFFFFF;
  --t-on-accent-soft: #DCEAF6;
  --t-line: #D6E2EE;
  --t-dark: #F37021;
  --t-on-dark: #102A43;
  --t-header-bg: #FFFFFF;
  --t-header-ink: #102A43;
  --t-footer-bg: #1967A7;
  --t-footer-ink: #FFFFFF;
  --t-star: #F37021;
  --t-nav-active: #1967A7;
  --t-sel: #F37021;
  --t-sel-ink: #102A43;
  --t-logo-filter: none;
}

html body { background-color: var(--t-bg); color: var(--t-ink); }
html body a { color: var(--t-accent); }
html body a:hover { color: var(--t-accent-hover); }
input, select, textarea { color: var(--t-ink); }

/* Cabecera, menú y pie */
header { background-color: var(--t-header-bg) !important; border-bottom-color: var(--t-line) !important; }
.site-logo img { filter: var(--t-logo-filter); }
.site-navigation a { color: var(--t-header-ink); }
.site-navigation a[aria-current="page"], .site-navigation a:hover { color: var(--t-nav-active); }
.site-platform-link { border-color: var(--t-line) !important; }
.nav-submenu-toggle { color: inherit; }
.has-submenu:hover > .nav-submenu-toggle { color: var(--t-nav-active); }
.nav-submenu-toggle:hover { background: var(--t-soft); color: var(--t-ink); }
.nav-submenu a { color: var(--t-ink); }
.nav-submenu a:hover, .nav-submenu a:focus-visible { background: var(--t-soft); color: var(--t-accent); }
.nav-submenu-highlight { border-bottom-color: var(--t-line); }
.nav-submenu-highlight a { background: var(--t-tint); color: var(--t-accent); }
.nav-submenu-highlight a:hover, .nav-submenu-highlight a:focus-visible { background: var(--t-soft); color: var(--t-accent); }
@media (min-width: 768px) { .nav-submenu { background: var(--t-bg); border-color: var(--t-line); } }
@media (max-width: 767px) {
  .nav-submenu { border-left-color: var(--t-line); }
  .nav-submenu a { color: var(--t-header-ink); }
  .nav-submenu-highlight a { background: transparent; }
}
.menu-toggle { background: var(--t-header-bg) !important; color: var(--t-header-ink) !important; border-color: var(--t-line) !important; }
.skip-link { background: var(--t-dark) !important; color: var(--t-on-dark) !important; }
footer { background-color: var(--t-footer-bg) !important; color: var(--t-footer-ink) !important; }
.site-footer-links a { color: var(--t-footer-ink); }
.site-footer-links a:hover { color: var(--t-accent-bg); }

/* Colores escritos en el HTML (style="...") */
[style*="background: #FFFFFF"], [style*="background:#FFFFFF"] { background-color: var(--t-bg) !important; }
[style*="background: #F8FAFB"] { background-color: var(--t-soft) !important; }
[style*="background: #F8F9FF"] { background-color: var(--t-tint) !important; }
[style*="background: #1967A7"] { background-color: var(--t-accent-bg) !important; }
[style*="background: #181C31"] { background-color: var(--t-dark) !important; }
[style*="background: rgba(255, 255, 255, 0.16)"] { background-color: color-mix(in srgb, var(--t-on-accent) 14%, transparent) !important; }
[style*="background: rgba(255, 255, 255, 0.08)"] { background-color: color-mix(in srgb, var(--t-on-accent) 8%, transparent) !important; }
[style*="color: #181C31"], [style*="color:#181C31"] { color: var(--t-ink) !important; }
[style*="color: #79808A"] { color: var(--t-muted) !important; }
[style*="color: #596270"], [style*="color:#596270"] { color: var(--t-muted2) !important; }
[style*="color: #1967A7"] { color: var(--t-accent) !important; }
[style*="color: #13507F"] { color: var(--t-accent-hover) !important; }
[style*="color: #FFFFFF"] { color: var(--t-on-accent) !important; }
[style*="background: #181C31"][style*="color: #FFFFFF"] { color: var(--t-on-dark) !important; }
[style*="color: #E8F0F8"], [style*="color: #E3EEF8"], [style*="color: #CFE2F3"] { color: var(--t-on-accent-soft) !important; }
[style*="border: 1px solid #EBEFF4"], [style*="border: 1px solid #DDE3EA"] { border-color: var(--t-line) !important; }
[style*="border-bottom: 1px solid #EBEFF4"] { border-bottom-color: var(--t-line) !important; }
[style*="border-top: 1px solid #EBEFF4"] { border-top-color: var(--t-line) !important; }
[style*="border: 1px solid #1967A7"] { border-color: var(--t-accent-bg) !important; }
[style*="border-top: 4px solid #1967A7"], [style*="border-top: 3px solid #1967A7"] { border-top-color: var(--t-accent-bg) !important; }
[style*="border: 1px solid rgba(255, 255, 255, 0.25)"] { border-color: color-mix(in srgb, var(--t-on-accent) 25%, transparent) !important; }
[style*="box-shadow: 0 1px 5px rgba(45, 74, 170, 0.14)"] { box-shadow: var(--t-card-shadow) !important; }
[style*="drop-shadow(0 24px 48px rgba(45, 74, 170, 0.22))"] { filter: var(--t-img-shadow) !important; }
[stroke="#1967A7"] { stroke: var(--t-accent); }
[stroke="#FFFFFF"] { stroke: var(--t-on-accent); }
[fill="#EABF23"] { fill: var(--t-star); }
[data-form-privacy] { background: var(--t-bg) !important; border-color: var(--t-line) !important; color: var(--t-muted2) !important; }
[data-form-privacy] strong { color: var(--t-ink) !important; }

/* Páginas de servicio (service-page.css) */
.service-hero { background-color: var(--t-soft) !important; }
.service-kicker { color: var(--t-accent) !important; }
.service-intro, .service-section > .service-wrap > p, .service-list, .service-card p, .service-card li, .service-faq p, .service-case p { color: var(--t-muted2) !important; }
.service-section a { color: var(--t-accent) !important; }
.service-card { background: var(--t-bg) !important; box-shadow: var(--t-card-shadow) !important; }
.service-case { background: var(--t-tint) !important; border-left-color: var(--t-accent-bg) !important; }
.service-faq, .service-faq details { border-color: var(--t-line) !important; }
.service-cta { background: var(--t-soft) !important; color: var(--t-ink) !important; }
.service-cta a:not(.service-actions a) { color: var(--t-accent) !important; }
.service-actions a { background: var(--t-bg) !important; color: var(--t-accent) !important; }
.service-actions a:first-child { background: var(--t-dark) !important; color: var(--t-on-dark) !important; transition: background-color .2s ease; }
.service-actions a:first-child:hover { background: #F68D4E !important; }
.service-cta { background-image: radial-gradient(35% 70% at 100% 0%, rgba(243, 112, 33, 0.16), transparent 72%) !important; }

/* Página de asesores (clases de Tailwind de asesores.css) */
.text-body { color: var(--t-muted) !important; }
.text-black { color: var(--t-ink) !important; }
.text-primary { color: var(--t-accent) !important; }
.bg-white { background-color: var(--t-bg) !important; }
.bg-gray { background-color: var(--t-tint) !important; }
.bg-\[\#F8FAFB\] { background-color: var(--t-soft) !important; }
.bg-primary { background-color: var(--t-accent-bg) !important; }
.bg-black { background-color: var(--t-dark) !important; }
.bg-black.text-white, .bg-black .text-white { color: var(--t-on-dark) !important; }
.bg-primary.text-white, .bg-primary .text-white { color: var(--t-on-accent) !important; }
.border-stroke { border-color: var(--t-line) !important; }
.group:hover .group-hover\:bg-primary { background-color: var(--t-accent-bg) !important; }
.group:hover .group-hover\:text-white { color: var(--t-on-accent) !important; }
.bg-gradient-1 { background-image: linear-gradient(55deg, var(--t-accent), var(--t-accent)) !important; }

/* Aviso de cookies (lo inyecta cmp.js) */
.es-cmp__panel { background: var(--t-bg) !important; color: var(--t-ink) !important; }
.es-cmp__panel a { color: var(--t-accent) !important; }
.es-cmp__settings { background: var(--t-soft) !important; }
.es-cmp__actions button { background: var(--t-accent-bg) !important; border-color: var(--t-accent-bg) !important; color: var(--t-on-accent) !important; }
.es-cmp__actions .es-cmp__secondary { background: var(--t-bg) !important; color: var(--t-accent) !important; }
.es-cmp__open { background: var(--t-bg) !important; color: var(--t-accent) !important; border-color: var(--t-accent) !important; }
::selection { background: var(--t-sel); color: var(--t-sel-ink); }
:focus-visible { outline-color: var(--t-accent-bg) !important; }

/* Filigranas */
:root {
  --t-card-shadow: 0 1px 3px rgba(16, 42, 67, 0.07), 0 8px 22px rgba(25, 103, 167, 0.09);
  --t-img-shadow: drop-shadow(0 24px 48px rgba(25, 103, 167, 0.28));
}
/* Franja bicolor bajo la cabecera: mitad azul, mitad naranja */
header { box-shadow: none; background-image: linear-gradient(90deg, #1967A7 0 50%, #F37021 50% 100%); background-size: 100% 4px; background-position: bottom; background-repeat: no-repeat; } /* legal */
footer { box-shadow: inset 0 4px 0 #F37021; } /* legal */
.site-footer-links a:hover { color: #FFE0C7; }
/* Bloque principal: duotono, naranja arriba y azul abajo */
header + section, .service-hero, #home, header + main > section:first-child {
  background-image: radial-gradient(45% 70% at 95% 0%, rgba(243, 112, 33, 0.30), transparent 70%),
                    radial-gradient(55% 80% at 0% 100%, rgba(25, 103, 167, 0.18), transparent 70%) !important;
}
.hero { background-image: radial-gradient(45% 90% at 95% 0%, rgba(243, 112, 33, 0.28), transparent 70%); } /* legal */
/* Bloques azules con un sol naranja en la esquina */
a[style*="background: #1967A7"][style*="border-radius: 16px"], section[style*="background: #1967A7"] { background-image: radial-gradient(35% 60% at 100% 0%, rgba(243, 112, 33, 0.55), transparent 72%) !important; }
/* Tarjetas: se elevan con un filo naranja arriba */
[style*="box-shadow: 0 1px 5px rgba(45, 74, 170, 0.14)"], .service-card { transition: transform .2s ease, box-shadow .2s ease; }
[style*="box-shadow: 0 1px 5px rgba(45, 74, 170, 0.14)"]:hover, .service-card:hover { transform: translateY(-3px); box-shadow: inset 0 4px 0 #F37021, 0 0 0 1px #D6E2EE, 0 14px 30px rgba(16, 42, 67, 0.12) !important; }
/* Etiquetas sobre los títulos en naranja; los enlaces y botones siguen en azul */
p[style*="color: #1967A7"], span[style*="color: #1967A7"], .service-kicker { color: #B23C0A !important; }
a span[style*="color: #1967A7"] { color: var(--t-accent) !important; }
/* Botones naranjas: un poco más intensos al pasar el ratón */
[style*="background: #181C31"]:is(a, button), .bg-black { transition: background-color .2s ease, transform .15s ease; }
[style*="background: #181C31"]:is(a, button):hover, .bg-black:hover { background-color: #E0600F !important; }
