/* ================================================================
   Marco común del ecosistema GOZ: barra superior y pie de página.
   Lo cargan gozecosistema.com y /negocios-invertibles/ para que
   las dos páginas se vean como un solo sitio.
   ================================================================ */

/* ---------- Barra superior (idéntica en las dos páginas) ---------- */
.eco-bar.topbar { position: sticky; top: 0; z-index: 50; margin-bottom: -72px; background: transparent; box-shadow: none; transition: background .3s, box-shadow .3s; }
.eco-bar.topbar.scrolled { background: rgba(255, 255, 255, .88); backdrop-filter: saturate(1.4) blur(14px); -webkit-backdrop-filter: saturate(1.4) blur(14px); box-shadow: 0 1px 0 rgba(9, 26, 58, .1); }
[data-theme="dark"] .eco-bar.topbar.scrolled { background: rgba(1, 2, 26, .88); box-shadow: 0 1px 0 rgba(255, 255, 255, .08); }
.eco-bar .topbar-in { width: min(1180px, 100% - 40px); margin-inline: auto; height: 72px; display: flex; align-items: center; gap: 1.5rem; }
.eco-bar .brand { display: inline-flex; align-items: center; text-decoration: none; flex: none; }
.eco-bar .brand img { height: 38px; width: auto; display: block; }
.eco-bar .brand .logo-c { display: none; }
.eco-bar.scrolled .brand .logo-w { display: none; }
.eco-bar.scrolled .brand .logo-c { display: block; }
[data-theme="dark"] .eco-bar.scrolled .brand .logo-w { display: block; }
[data-theme="dark"] .eco-bar.scrolled .brand .logo-c { display: none; }

/* etiqueta del programa, junto al logo (solo en Negocios Invertibles) */
.eco-prog { display: inline-flex; align-items: center; gap: .45rem; padding-left: .9rem; margin-left: -.6rem; border-left: 1px solid rgba(255, 255, 255, .35); color: #fff; font: 700 .72rem/1.1 "Montserrat", system-ui, sans-serif; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; white-space: nowrap; }
.eco-prog .pulpo { width: 1.5rem; flex: none; }
.eco-bar.scrolled .eco-prog { color: #093A89; border-left-color: rgba(9, 26, 58, .18); }
[data-theme="dark"] .eco-bar.scrolled .eco-prog { color: #fff; border-left-color: rgba(255, 255, 255, .2); }

.eco-bar .topnav { display: flex; gap: 1.6rem; margin-left: auto; }
.eco-bar.topbar .topnav a { position: relative; padding: .3em 0; font: 600 .9rem/1.2 "Montserrat", system-ui, sans-serif; color: rgba(255, 255, 255, .88); opacity: 1; text-decoration: none; transition: color .25s; }
.eco-bar.topbar .topnav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 0; height: 2px; background: #FAA210; transition: right .3s cubic-bezier(.2, .8, .2, 1); }
.eco-bar.topbar .topnav a:hover, .eco-bar.topbar .topnav a.is-active { color: #fff; }
.eco-bar.topbar .topnav a:hover::after, .eco-bar.topbar .topnav a.is-active::after { right: 0; }
.eco-bar.topbar.scrolled .topnav a { color: #56607A; }
.eco-bar.topbar.scrolled .topnav a:hover, .eco-bar.topbar.scrolled .topnav a.is-active { color: #0A1F4F; }
.eco-bar.topbar.scrolled .topnav a::after { background: #093A89; }
[data-theme="dark"] .eco-bar.topbar.scrolled .topnav a { color: #9AA5C0; }
[data-theme="dark"] .eco-bar.topbar.scrolled .topnav a:hover, [data-theme="dark"] .eco-bar.topbar.scrolled .topnav a.is-active { color: #fff; }
[data-theme="dark"] .eco-bar.topbar.scrolled .topnav a::after { background: #FAA210; }

.eco-bar .top-actions { display: flex; align-items: center; gap: .6rem; }
.eco-bar .topnav + .top-actions { margin-left: 0; }
.eco-bar.topbar .icon-btn { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; cursor: pointer; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .3); color: #fff; }
.eco-bar.topbar.scrolled .icon-btn { background: #fff; border-color: #DCE4EF; color: #0A1F4F; }
[data-theme="dark"] .eco-bar.topbar.scrolled .icon-btn { background: #0A1131; border-color: #1D2757; color: #fff; }
.eco-bar.topbar .btn-sm, .eco-bar.topbar:not(.scrolled) .btn-sm { --b: #FAA210; --i: #0A1F4F; padding: .6em 1.15em; font-size: .88rem; }

/* ---------- Pie de página (idéntico en las dos páginas) ---------- */
.eco-foot { background: #FFFFFF; border-top: 1px solid #DCE4EF; color: #56607A; font: 400 .85rem/1.5 "Montserrat", system-ui, sans-serif; padding: 1.8rem 0; }
[data-theme="dark"] .eco-foot { background: #01021A; border-top-color: #1D2757; color: #9AA5C0; }
.eco-foot-in { width: min(1180px, 100% - 40px); margin-inline: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem; }
.eco-foot-brand { display: inline-flex; flex: none; }
.eco-foot-brand img { height: 34px; width: auto; display: block; }
.eco-foot-brand .logo-w { display: none; }
[data-theme="dark"] .eco-foot-brand .logo-w { display: block; }
[data-theme="dark"] .eco-foot-brand .logo-c { display: none; }
.eco-foot-nav { display: flex; flex-wrap: wrap; gap: .3rem 1.4rem; }
.eco-foot-nav a { color: inherit; font-weight: 600; text-decoration: none; padding: .25rem 0; }
.eco-foot-nav a:hover { color: #093A89; }
[data-theme="dark"] .eco-foot-nav a:hover { color: #FAA210; }
.eco-foot p { margin: 0; }
.eco-foot-credit a { color: #093A89; font-weight: 700; text-decoration: none; }
[data-theme="dark"] .eco-foot-credit a { color: #FAA210; }
.eco-foot-credit a:hover { text-decoration: underline; }

/* Flechas del manual de marca (cierre de Negocios Invertibles) */
.eco-flechas { position: absolute; right: 3%; bottom: 22px; width: clamp(100px, 12vw, 160px); height: auto; fill: none; stroke: rgba(255, 255, 255, .5); stroke-width: 1; pointer-events: none; z-index: 0; }

@media (max-width: 1060px) {
  .eco-bar .topnav { display: none; }
  .eco-bar .top-actions { margin-left: auto; }
}
@media (max-width: 900px) {
  .eco-foot { padding-bottom: calc(1.8rem + 84px + env(safe-area-inset-bottom, 0px)); } /* espacio para la barra inferior pegada al borde */
  .eco-foot-in { justify-content: center; text-align: center; }
  .eco-foot-nav { justify-content: center; }
}
@media (max-width: 560px) {
  .eco-bar .topbar-in, .eco-foot-in { width: calc(100% - 32px); }
  .eco-bar .brand img { height: 32px; }
  .eco-prog { font-size: .62rem; letter-spacing: .08em; padding-left: .7rem; margin-left: -.9rem; }
  .eco-prog .pulpo { width: 1.25rem; }
}
/* móvil: la luna va junto al logo, igual que en el inicio de GOZ; la etiqueta del programa queda después */
@media (max-width: 1060px) {
  .eco-bar .eco-prog { order: 3; margin-left: 0; min-width: 0; }
  .eco-bar .top-actions { order: 2; }
}
@media (max-width: 560px) {
  .eco-bar .topbar-in { gap: 1rem; }
  .eco-prog { white-space: normal; }
}

/* móvil: barra superior siempre a la vista, sin depender de position sticky */
@media (max-width: 900px) {
  .eco-bar.topbar { position: fixed; left: 0; right: 0; top: 0; transition: transform .35s cubic-bezier(.2, .8, .2, 1), background .3s, box-shadow .3s; }
  .eco-bar.topbar.oculta { transform: translateY(-100%); }
}
@media (prefers-reduced-motion: reduce) { .eco-bar.topbar { transition: none; } }

/* ---------- Enlaces legales del pie ---------- */
.eco-foot-legal { display: flex; flex-wrap: wrap; gap: .3rem 1.1rem; width: 100%; justify-content: flex-end; }
.eco-foot-legal a { color: inherit; font-size: .8rem; text-decoration: none; opacity: .85; }
.eco-foot-legal a:hover { opacity: 1; text-decoration: underline; }

/* ---------- Páginas legales (privacidad, términos, cookies) ---------- */
.legal { padding: calc(72px + 3rem) 0 4rem; background: var(--bg); }
.legal-wrap { width: min(760px, 100% - 40px); margin-inline: auto; }
.legal h1 { font-size: clamp(1.9rem, 5vw, 2.7rem); margin-bottom: .4rem; }
.legal-fecha { font-size: .85rem; color: var(--muted); margin-bottom: 2.2rem; }
.legal h2 { font-size: 1.12rem; font-style: normal; font-weight: 800; letter-spacing: -.01em; margin: 2.4rem 0 .7rem; color: var(--head); }
.legal p, .legal li { color: var(--muted); font-size: 1rem; line-height: 1.7; }
.legal b { color: var(--text); }
.legal ul { margin: 0 0 1em; padding-left: 1.15rem; display: grid; gap: .5rem; }
.legal a { color: var(--accent); font-weight: 600; }
[data-theme="dark"] .legal a { color: var(--ambar, #FAA210); }
.legal-nav { display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; margin-top: 3rem; padding-top: 1.4rem; border-top: 1px solid var(--line); }
.legal-nav a { font-size: .9rem; font-weight: 700; text-decoration: none; }
.legal-nav a:hover { text-decoration: underline; }
@media (max-width: 900px) {
  .eco-foot-legal { justify-content: center; }
  .legal { padding-top: calc(72px + 2rem); padding-bottom: 3rem; }
}