/* ============================================================
   INTEGRA-LOG · Sistema de diseño (Dirección A · Institucional)
   Marca: navy #002B5C + cian #00A0E0 · POCTEFA Prioridad 7 #0E6EB6
   Tipografías: Montserrat (display) · Mulish (texto)
   ============================================================ */

:root {
  --navy: #002B5C;
  --navy-700: #043a6e;
  --cyan: #00A0E0;
  --cyan-600: #0089c2;
  --p7: #0E6EB6;          /* color Prioridad 7 POCTEFA */
  --eu-blue: #003399;
  --eu-yellow: #FFCC00;

  --ink: #243949;
  --muted: #5b6c7b;
  --faint: #8595a4;
  --line: #e7edf2;
  --line-2: #e3eaf0;
  --bg: #ffffff;
  --bg-soft: #f5f8fb;
  --bg-band: #eef4f9;

  --radius: 14px;
  --radius-sm: 8px;
  --shadow-sm: 0 1px 2px rgba(0,43,92,.05);
  --shadow: 0 10px 30px rgba(0,43,92,.08);
  --shadow-lg: 0 24px 60px rgba(0,43,92,.14);

  --maxw: 1240px;
  --pad: 56px;

  --font-display: 'Montserrat', system-ui, sans-serif;
  --font-body: 'Mulish', system-ui, sans-serif;
  --font-mono: ui-monospace, 'SFMono-Regular', Menlo, monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--bg);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }

h1,h2,h3,h4 { font-family: var(--font-display); color: var(--navy); margin: 0; letter-spacing: -0.02em; line-height: 1.1; font-weight: 800; }
p { margin: 0; }
.eyebrow {
  font-family: var(--font-mono); font-size: 13px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--cyan-600);
}
.eyebrow--p7 { color: var(--p7); }

/* ---------- layout helpers ---------- */
.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 var(--pad); }
.section { padding: 86px 0; }
.section--soft { background: var(--bg-soft); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.section--navy { background: var(--navy); color: #fff; }
.section--navy h1,.section--navy h2,.section--navy h3 { color: #fff; }
.grid { display: grid; gap: 24px; }
.lead { font-size: 19px; line-height: 1.65; color: var(--muted); }
.center { text-align: center; }
.balance { text-wrap: balance; }
.mt-0{margin-top:0}.mb-0{margin-bottom:0}

.section-head { margin-bottom: 44px; }
.section-head h2 { font-size: 36px; margin: 12px 0 0; }
.section-head .lead { margin-top: 16px; max-width: 720px; }

/* ---------- buttons ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: var(--font-display); font-weight: 700; font-size: 15px;
  padding: 14px 24px; border-radius: var(--radius-sm); cursor: pointer;
  border: 1.5px solid transparent; transition: transform .15s, background .15s, border-color .15s, color .15s;
  white-space: nowrap;
}
.btn:hover { transform: translateY(-1px); }
.btn--primary { background: var(--cyan); color: #fff; }
.btn--primary:hover { background: var(--cyan-600); }
.btn--navy { background: var(--navy); color: #fff; }
.btn--navy:hover { background: var(--navy-700); }
.btn--ghost { background: #fff; color: var(--navy); border-color: #d2dde6; }
.btn--ghost:hover { border-color: var(--cyan); color: var(--cyan-600); }
.btn--ghost-light { background: transparent; color: #fff; border-color: rgba(255,255,255,.3); }
.btn--ghost-light:hover { border-color: #fff; background: rgba(255,255,255,.08); }

/* ---------- utility top bar ---------- */
.utility {
  background: var(--navy); color: #fff;
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .03em;
}
.utility .wrap { display: flex; justify-content: space-between; align-items: center; padding-top: 8px; padding-bottom: 8px; }
.utility span { opacity: .85; }

/* ---------- header / nav ---------- */
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.92); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.nav { display: flex; align-items: center; justify-content: space-between; padding-top: 16px; padding-bottom: 16px; }
.nav__logo img { height: 44px; }
.nav__menu { display: flex; align-items: center; gap: 30px; }
.nav__link { font-family: var(--font-display); font-weight: 600; font-size: 15px; color: #3a4d5e; transition: color .15s; }
.nav__link:hover, .nav__link.is-active { color: var(--navy); }
.nav__link.is-active { position: relative; }
.nav__link.is-active::after { content:''; position:absolute; left:0; right:0; bottom:-6px; height:2px; background: var(--cyan); border-radius:2px; }
.nav__sep { width: 1px; height: 18px; background: var(--line-2); }
.nav__right { display: flex; align-items: center; gap: 22px; }
.nav__toggle { display: none; background: none; border: none; cursor: pointer; padding: 6px; }
.nav__toggle span { display: block; width: 24px; height: 2px; background: var(--navy); margin: 5px 0; border-radius: 2px; transition: .2s; }

/* language dropdown */
.lang { position: relative; }
.lang__current { display: flex; align-items: center; gap: 6px; background: none; border: 1px solid var(--line-2); border-radius: 8px; padding: 7px 11px; cursor: pointer; font-family: var(--font-display); font-weight: 700; font-size: 13px; letter-spacing: .03em; color: var(--navy); transition: border-color .15s; }
.lang__current:hover { border-color: var(--cyan); }
.lang__menu { position: absolute; top: calc(100% + 8px); right: 0; background: #fff; border: 1px solid var(--line-2); border-radius: 10px; box-shadow: var(--shadow); padding: 5px; min-width: 150px; display: none; z-index: 60; }
.lang.is-open .lang__menu { display: block; }
.lang__menu button { display: block; width: 100%; text-align: left; background: none; border: none; cursor: pointer; font-family: var(--font-display); font-weight: 600; font-size: 14px; color: var(--ink); padding: 9px 12px; border-radius: 7px; transition: background .12s, color .12s; }
.lang__menu button:hover { background: var(--bg-soft); }
.lang__menu button.is-active { color: var(--cyan-600); background: var(--bg-band); }

/* ---------- hero ---------- */
.hero { padding: 76px 0 70px; }
.hero__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 56px; align-items: center; }
.hero h1 { font-size: 54px; line-height: 1.07; }
.hero .lead { margin-top: 22px; max-width: 520px; }
.hero__cta { display: flex; gap: 14px; margin-top: 34px; flex-wrap: wrap; }
.tag {
  display: inline-flex; align-items: center; gap: 9px; padding: 8px 15px; border-radius: 999px;
  background: var(--bg-band); color: var(--p7);
  font-family: var(--font-display); font-weight: 700; font-size: 13px; letter-spacing: .02em;
}
.tag .dot { width: 8px; height: 8px; border-radius: 2px; background: var(--p7); }

/* ---------- full-bleed hero banner ---------- */
.hero-banner { position: relative; min-height: 600px; display: flex; align-items: center; overflow: hidden; background: #06223b; }
.hero-banner__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.hero-banner__overlay { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(2,18,33,.92) 0%, rgba(2,18,33,.62) 40%, rgba(4,28,46,.16) 76%, rgba(4,28,46,0) 100%); }
.hero-banner__caption { position: absolute; top: 16px; right: 22px; z-index: 3; font-family: var(--font-mono); font-size: 11px; letter-spacing: .06em; color: rgba(255,255,255,.5); }
.hero-banner .wrap { position: relative; z-index: 2; width: 100%; padding-top: 84px; padding-bottom: 92px; }
.hero-banner .tag { background: rgba(255,255,255,.1); color: #fff; backdrop-filter: blur(4px); }
.hero-banner .tag .dot { background: var(--cyan); }
.hero-banner h1 { color: #fff; font-size: 56px; line-height: 1.06; max-width: 760px; }
.hero-banner .lead { color: rgba(255,255,255,.86); max-width: 560px; margin-top: 22px; }
.hero-banner__cta { display: flex; gap: 14px; margin-top: 34px; flex-wrap: wrap; }
.hero-banner__line { position: absolute; bottom: 0; left: 0; width: 100%; height: 150px; z-index: 1; }

/* ---------- stats band ---------- */
.stats { display: grid; grid-template-columns: repeat(4,1fr); gap: 30px; }
.stat__n { font-family: var(--font-display); font-weight: 800; font-size: 34px; color: var(--navy); letter-spacing: -0.02em; line-height: 1.05; }
.stat__l { font-size: 14.5px; color: var(--muted); margin-top: 6px; }

/* ---------- cards ---------- */
.cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.card { background: #fff; border: 1px solid var(--line-2); border-radius: var(--radius); padding: 32px 30px; transition: border-color .18s, box-shadow .18s, transform .18s; }
.card:hover { border-color: #cfe0ee; box-shadow: var(--shadow); transform: translateY(-3px); }
.card__num { font-family: var(--font-display); font-weight: 800; font-size: 15px; color: var(--cyan-600); letter-spacing: .05em; }
.card__icon { width: 44px; height: 44px; border-radius: 11px; background: var(--bg-band); display: flex; align-items: center; justify-content: center; }
.card h3 { font-size: 21px; margin: 18px 0 10px; }
.card p { font-size: 15.5px; color: var(--muted); }
.card__head { display: flex; align-items: center; justify-content: space-between; }

/* icon glyph (simple geometric, no faux-realism) */
.glyph { width: 18px; height: 18px; color: var(--navy); }

/* ---------- editorial rows ---------- */
.rowlist { border-top: 1px solid var(--line); }
.rowitem { display: grid; grid-template-columns: 92px 1.1fr 1.4fr; gap: 30px; align-items: center; padding: 28px 0; border-bottom: 1px solid var(--line); }
.rowitem__n { font-family: var(--font-display); font-weight: 800; font-size: 38px; color: var(--cyan); letter-spacing: -0.02em; }
.rowitem h3 { font-size: 22px; }
.rowitem p { font-size: 16px; color: var(--muted); }

/* ---------- placeholder media ---------- */
.ph {
  border-radius: var(--radius); position: relative; overflow: hidden;
  background: repeating-linear-gradient(135deg, var(--bg-soft) 0 14px, rgba(0,43,92,.045) 14px 28px);
  border: 1px solid var(--line-2);
  display: flex; align-items: center; justify-content: center;
  min-height: 320px;
}
.ph--dark { background: repeating-linear-gradient(135deg,#0d2238 0 14px,rgba(255,255,255,.035) 14px 28px); border-color: rgba(255,255,255,.1); }
.ph__label {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-mono); font-size: 12.5px; letter-spacing: .03em; color: var(--faint);
  background: rgba(255,255,255,.82); padding: 7px 13px; border-radius: 999px; border: 1px solid var(--line-2);
}
.ph__label .sw { width: 7px; height: 7px; border-radius: 2px; background: var(--cyan); }
.ph--dark .ph__label { color: rgba(255,255,255,.7); background: rgba(7,20,34,.7); border-color: rgba(255,255,255,.12); }

/* ---------- brand illustrations (replace photo placeholders) ---------- */
.corridor { position: relative; border-radius: var(--radius); overflow: hidden; min-height: 300px;
  background: linear-gradient(180deg,#eaf2fb,#dae8f5); border: 1px solid var(--line-2);
  display: flex; align-items: center; justify-content: center; padding: 14px; }
.corridor svg, .scheme svg { width: 100%; height: auto; display: block; }
.scheme { position: relative; border-radius: var(--radius); overflow: hidden; min-height: 280px;
  background: radial-gradient(120% 110% at 72% 18%, rgba(0,160,224,.20), transparent 60%), #06223b;
  border: 1px solid rgba(255,255,255,.1); display: flex; align-items: center; justify-content: center; padding: 20px; }
.imgtile { position: relative; overflow: hidden; display: flex; align-items: flex-end; min-height: 170px;
  background: radial-gradient(115% 130% at 82% 0%, rgba(0,160,224,.38), transparent 55%), linear-gradient(140deg,#05243f,#0a3a63 58%,#0c4f86); }
.imgtile--p7 { background: radial-gradient(115% 130% at 82% 0%, rgba(0,160,224,.30), transparent 55%), linear-gradient(140deg,#062a4a,#0e6eb6 90%); }
.imgtile--lg { min-height: 340px; }
.imgtile__mt { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 56%; display: block; }
.imgtile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg,transparent 45%,rgba(2,14,26,.5)); }
.imgtile__cap { position: relative; z-index: 2; margin: 0; padding: 16px 18px; }
.imgtile__cap b { display: block; font-family: var(--font-display); font-weight: 700; font-size: 13px; color: #fff; letter-spacing: .01em; }
.imgtile__cap span { display: block; font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .06em; color: var(--cyan); margin-bottom: 3px; }

/* ---------- footer / POCTEFA compliance ---------- */
.site-footer { background: var(--navy); color: #fff; }
.footer-top { padding: 64px 0 48px; display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 40px; }
.footer-top h4 { color: #fff; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; font-family: var(--font-display); font-weight: 700; margin-bottom: 18px; opacity: .7; }
.footer-link { display: block; color: rgba(255,255,255,.78); font-size: 15px; padding: 6px 0; transition: color .15s; }
.footer-link:hover { color: var(--cyan); }
.footer-brand .lead { color: rgba(255,255,255,.7); font-size: 15px; max-width: 360px; margin-top: 16px; }
.footer-compliance { border-top: 1px solid rgba(255,255,255,.12); padding: 28px 0 40px; display: flex; align-items: center; justify-content: space-between; gap: 28px; flex-wrap: wrap; }
.footer-note { font-family: var(--font-mono); font-size: 11.5px; color: rgba(255,255,255,.6); line-height: 1.7; text-align: right; }
.funders { display: flex; align-items: flex-start; gap: 22px; flex-wrap: wrap; }
.fsep { width: 1px; height: 42px; background: rgba(255,255,255,.16); }
.funder-logo { background: #fff; border-radius: 10px; height: 72px; padding: 0 20px; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 16px rgba(0,0,0,.18); }
.funder-logo img { height: 44px; width: auto; display: block; }
.funder-logo--alia img { height: 48px; }
.funder-block { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.funder-cap { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--cyan); }

/* EU flag + POCTEFA lockup (placeholder, compliant structure) */
.poctefa { display: flex; align-items: center; gap: 11px; position: relative; }
.poctefa__txt { display: flex; flex-direction: column; line-height: 1.05; }
.poctefa__interreg { font-family: var(--font-display); font-weight: 700; font-size: 16px; color: #7fb2e6; letter-spacing: -0.01em; }
.poctefa__name { font-family: var(--font-display); font-weight: 700; font-size: 17px; letter-spacing: .04em; color: #fff; }
.poctefa__sub { font-family: Arial, sans-serif; font-weight: 700; font-size: 7px; letter-spacing: .01em; color: rgba(255,255,255,.82); margin-top: 3px; }
.poctefa__tag { position: absolute; top: -10px; right: -8px; font-family: var(--font-mono); font-size: 7.5px; letter-spacing: .05em; color: #b06a00; background: #fff4dc; border: 1px solid var(--eu-yellow); border-radius: 3px; padding: 1px 4px; white-space: nowrap; }
.partner-chip { display: flex; flex-direction: column; gap: 1px; padding: 7px 13px; border-radius: 6px; border: 1px dashed rgba(255,255,255,.28); }
.partner-chip b { font-family: var(--font-display); font-weight: 800; font-size: 13px; letter-spacing: .04em; }
.partner-chip span { font-family: var(--font-mono); font-size: 8px; letter-spacing: .04em; color: rgba(255,255,255,.5); }

/* ---------- reveal on scroll ---------- */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; }
.reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; transition: none; } html { scroll-behavior: auto; } }

/* ---------- responsive ---------- */
@media (max-width: 980px) {
  :root { --pad: 28px; }
  .hero__grid { grid-template-columns: 1fr; gap: 36px; }
  .hero h1 { font-size: 40px; }
  .hero-banner { min-height: 480px; }
  .hero-banner h1 { font-size: 38px; }
  .hero-banner .wrap { padding-top: 56px; padding-bottom: 64px; }
  .cards { grid-template-columns: 1fr; }
  .stats { grid-template-columns: repeat(2,1fr); gap: 24px; }
  .footer-top { grid-template-columns: 1fr 1fr; }
  .rowitem { grid-template-columns: 60px 1fr; }
  .rowitem p { grid-column: 1 / -1; }
  .nav__menu { display: none; position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; align-items: flex-start; gap: 0; background: #fff; border-bottom: 1px solid var(--line); padding: 10px var(--pad) 22px; box-shadow: var(--shadow); max-height: calc(100vh - 112px); overflow-y: auto; }
  .nav__menu.is-open { display: flex; }
  .nav__menu .nav__link { padding: 12px 0; width: 100%; border-bottom: 1px solid var(--line); }
  .nav__sep { display: none; }
  .nav__toggle { display: block; }
  .nav__menu .lang { width: 100%; margin: 16px 0 2px; }
  .nav__menu .lang__current { display: none; }
  .nav__menu .lang .lang__menu { display: flex !important; position: static; box-shadow: none; border: 0; padding: 0; min-width: 0; flex-wrap: wrap; gap: 8px; background: none; }
  .nav__menu .lang .lang__menu button { width: auto; border: 1px solid var(--line-2); border-radius: 8px; padding: 9px 15px; font-size: 13.5px; }
  .nav__menu .lang .lang__menu button.is-active { border-color: var(--cyan); color: var(--cyan-600); background: var(--bg-band); }
  .nav__menu .btn { width: 100%; justify-content: center; margin-top: 12px; padding-top: 15px; padding-bottom: 15px; }
  .nav__toggle span { transition: transform .22s ease, opacity .18s ease; }
  .nav__toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav__toggle.is-open span:nth-child(2) { opacity: 0; }
  .nav__toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .section-head h2 { font-size: 28px; }
  .hero { padding: 48px 0; }
  .section { padding: 60px 0; }
  .footer-compliance { flex-direction: column; align-items: flex-start; }
  .footer-note { text-align: left; }
  .utility .wrap { font-size: 11px; }
}
@media (max-width: 560px) {
  .stats { grid-template-columns: 1fr 1fr; }
  .footer-top { grid-template-columns: 1fr; }
  .hero h1 { font-size: 34px; }
  .utility span.hide-sm { display: none; }
}


/* ===== legal / cookies / consent (añadido) ===== */
.footer-legal { display:flex; flex-wrap:wrap; align-items:center; gap:8px 22px; padding:20px 0; border-top:1px solid rgba(255,255,255,.12); }
.footer-legal__t { font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.45); margin-right:4px; }
.footer-legal__l { background:none; border:none; cursor:pointer; padding:0; font-family:var(--font-display); font-weight:600; font-size:14px; color:rgba(255,255,255,.78); transition:color .15s; }
.footer-legal__l:hover { color:var(--cyan); }
.footer-legal__btn { display:inline-flex; align-items:center; gap:6px; }
.footer-legal__btn::before { content:''; width:13px; height:13px; border-radius:3px; border:1.5px solid currentColor; opacity:.6; }
.legal-prose { max-width:820px; }
.legal-prose h2 { font-size:22px; color:var(--navy); margin:40px 0 12px; }
.legal-prose h2:first-child { margin-top:0; }
.legal-prose h3 { font-size:17px; color:var(--navy); margin:24px 0 8px; }
.legal-prose p { font-size:16px; color:var(--ink); line-height:1.7; margin:0 0 14px; }
.legal-prose ul { margin:0 0 16px; padding-left:22px; }
.legal-prose li { font-size:16px; color:var(--ink); line-height:1.7; margin-bottom:7px; }
.ilink { color:var(--cyan-600); text-decoration:underline; text-underline-offset:2px; }
.legal-note { font-family:var(--font-mono); font-size:12.5px; color:var(--faint); border-left:3px solid var(--line-2); padding:4px 0 4px 14px; margin:0 0 28px; }
.legal-fill { font-family:var(--font-mono); font-size:13px; color:#b06a00; background:#fff6e6; border:1px dashed #e7b766; border-radius:5px; padding:1px 7px; }
.legal-table { width:100%; border-collapse:collapse; margin:6px 0 18px; font-size:14.5px; }
.legal-table th, .legal-table td { text-align:left; padding:10px 12px; border:1px solid var(--line-2); vertical-align:top; }
.legal-table th { background:var(--bg-band); color:var(--navy); font-family:var(--font-display); font-weight:700; }
.legal-updated { font-family:var(--font-mono); font-size:12.5px; color:var(--faint); margin-top:34px; }
.cookie-banner { position:fixed; left:0; right:0; bottom:0; z-index:200; background:var(--navy); color:#fff; transform:translateY(110%); transition:transform .35s cubic-bezier(.4,0,.2,1); box-shadow:0 -10px 40px rgba(0,0,0,.25); }
.cookie-banner.is-show { transform:translateY(0); }
.cookie-banner__in { max-width:1200px; margin:0 auto; padding:20px 28px; display:flex; align-items:center; gap:28px; flex-wrap:wrap; }
.cookie-banner p { flex:1 1 360px; font-size:14.5px; line-height:1.6; color:rgba(255,255,255,.86); margin:0; }
.cookie-banner__act { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.ckb { font-family:var(--font-display); font-weight:700; font-size:14px; border-radius:9px; padding:11px 20px; cursor:pointer; border:1.5px solid transparent; transition:.15s; }
.ckb--more { background:none; color:rgba(255,255,255,.85); text-decoration:underline; text-underline-offset:3px; padding:11px 6px; }
.ckb--more:hover { color:#fff; }
.ckb--reject { background:none; border-color:rgba(255,255,255,.4); color:#fff; }
.ckb--reject:hover { border-color:#fff; }
.ckb--accept { background:var(--cyan); color:#04243d; }
.ckb--accept:hover { filter:brightness(1.08); }
.consent { margin:6px 0 20px; }
.consent__lbl { display:flex; align-items:flex-start; gap:11px; font-size:14.5px; color:var(--muted); line-height:1.55; cursor:pointer; }
.consent__lbl input { margin-top:3px; width:18px; height:18px; accent-color:var(--cyan-600); flex-shrink:0; cursor:pointer; }
@media (max-width:560px){ .cookie-banner__in{padding:16px 20px;gap:14px;} .cookie-banner__act{width:100%;} .ckb--accept,.ckb--reject{flex:1;text-align:center;} .legal-table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap;} }