/* ==========================================================================
   Cámara de Comercio Mercosur — stylesheet
   Rebuilt to match the real site: Volkhov (serif headings) + Cabin (sans
   body/UI). Brand blue #00329E, brand green #00993D, light lavender-gray
   section background #EAEAEE.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cabin:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Volkhov:ital,wght@0,400;0,700;1,400&display=swap');

:root{
  --blue: #00329e;
  --blue-deep: #002676;
  --blue-ink: #0a1830;      /* near-black navy for dark overlay sections */
  --green: #00993d;
  --green-deep: #00782f;
  --gold: #d9a441;
  --sand: #f2f0eb;
  --light: #eaeaee;         /* the site's real light section background */
  --white: #ffffff;
  --black: #000000;
  --ink: #142033;           /* body copy color */
  --ink-soft: #5b6472;
  --line: rgba(10,24,48,0.12);

  --font-display: 'Volkhov', Georgia, 'Times New Roman', serif;
  --font-body: 'Cabin', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --container: 1220px;
  --radius-btn: 8px;
  --shadow-soft: 0 16px 40px rgba(10,24,48,0.16);
  --shadow-card: 0 4px 18px rgba(10,24,48,0.07);
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0;
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  line-height: 1.6;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration: none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family: var(--font-display); margin:0 0 .5em; line-height: 1.18; font-weight:700; color: var(--blue); }
p{ margin:0 0 1em; }
button{ font-family: inherit; cursor:pointer; }
input,textarea,select{ font-family: inherit; font-size: 1rem; }

:focus-visible{ outline: 2px solid var(--blue); outline-offset: 3px; }

.container{ width:100%; max-width: var(--container); margin:0 auto; padding: 0 32px; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding: 15px 30px;
  border-radius: var(--radius-btn);
  font-weight:600; font-size:.95rem;
  border: 1.5px solid transparent;
  transition: transform .22s var(--ease), background .22s var(--ease), color .22s var(--ease), border-color .22s var(--ease);
  white-space: nowrap;
}
.btn:hover{ transform: translateY(-2px); }
.btn-light{ background: var(--white); color: var(--blue-ink); }
.btn-light:hover{ background: var(--light); }
.btn-outline-blue{ background: var(--white); color: var(--blue); border-color: var(--blue); }
.btn-outline-blue:hover{ background: var(--blue); color: #fff; }
.btn-blue{ background: var(--blue); color: #fff; }
.btn-blue:hover{ background: var(--blue-deep); }

/* ---------- Header ---------- */
.site-header{
  position: sticky; top:0; z-index: 500;
  background: var(--white);
  border-bottom: 1px solid var(--line);
}
.site-header .container{ display:flex; align-items:center; justify-content:space-between; height: 140px; }
.brand{ display:flex; align-items:center; gap:12px; }
.brand img{ height: 94px; width:auto; }

.main-nav{ display:flex; align-items:center; gap: 30px; }
.main-nav a{
  color: var(--blue);
  font-weight:500;
  font-size:.98rem;
  padding: 6px 2px;
  border-bottom: 2px solid transparent;
  transition: color .2s var(--ease), border-color .2s var(--ease);
}
.main-nav a:hover{ color: var(--blue-deep); }
.main-nav a.is-active{ color: var(--blue); border-bottom-color: var(--blue); }

.header-actions{ display:flex; align-items:center; gap:22px; }
/* ---------- Footer social icons ---------- */
.footer-social{ display:flex; align-items:center; gap:14px; margin-top:18px; }
.footer-social a{
  width: 34px; height:34px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,255,255,.12); color:#fff;
  transition: background .2s var(--ease), transform .2s var(--ease);
}
.footer-social a:hover{ background: var(--green); transform: translateY(-2px); }
.footer-social svg{ width:16px; height:16px; fill:currentColor; }

/* ---------- Language switcher ---------- */
.lang-switcher{ position:relative; }
.lang-toggle{
  display:flex; align-items:center; gap:6px;
  background:none; border:1.5px solid var(--line); border-radius:999px;
  padding:7px 12px; font-weight:700; font-size:.8rem; letter-spacing:.02em;
  color: var(--blue-ink); cursor:pointer; font-family: var(--font-body);
  transition: border-color .2s var(--ease), color .2s var(--ease);
}
.lang-toggle:hover{ border-color: var(--blue); color: var(--blue); }
.lang-chevron{ width:12px; height:12px; flex:none; transition: transform .22s var(--ease); }
.lang-switcher.is-open .lang-toggle{ border-color: var(--blue); color: var(--blue); }
.lang-switcher.is-open .lang-chevron{ transform: rotate(180deg); }
.lang-menu{
  list-style:none; margin:0; position:absolute; top: calc(100% + 10px); right:0; min-width:200px;
  background:#fff; border-radius:10px; box-shadow: var(--shadow-soft);
  padding:8px; opacity:0; pointer-events:none; transform: translateY(-6px);
  transition: opacity .2s var(--ease), transform .2s var(--ease);
  z-index:60;
}
.lang-switcher.is-open .lang-menu{ opacity:1; pointer-events:auto; transform: translateY(0); }
.lang-option{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:10px;
  background:none; border:none; padding:10px 12px; border-radius:6px;
  font-family: var(--font-body); font-size:.9rem; font-weight:600; color: var(--ink);
  text-align:left; cursor:pointer; transition: background .15s var(--ease);
}
.lang-option:hover:not(:disabled){ background: var(--light); }
.lang-option.is-active{ color: var(--blue); }
.lang-option.is-active::after{ content:"✓"; font-weight:700; }
.lang-option:disabled{ color: var(--ink-soft); opacity:.65; cursor:not-allowed; }
.lang-option .soon-badge{
  font-size:.62rem; font-weight:700; text-transform:uppercase; letter-spacing:.03em;
  background: var(--light); color: var(--ink-soft); padding:3px 8px; border-radius:999px; flex:none;
}

.nav-toggle{ display:none; background:none; border:none; width: 42px; height:42px; position:relative; }
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
  content:""; position:absolute; left:9px; right:9px; height:2px; background: var(--blue-ink);
  transition: transform .25s var(--ease), opacity .25s var(--ease);
}
.nav-toggle span{ top:20px; }
.nav-toggle span::before{ top:-8px; }
.nav-toggle span::after{ top:8px; }
.nav-open .nav-toggle span{ background: transparent; }
.nav-open .nav-toggle span::before{ transform: translateY(8px) rotate(45deg); background: var(--blue-ink); }
.nav-open .nav-toggle span::after{ transform: translateY(-8px) rotate(-45deg); background: var(--blue-ink); }

/* ---------- Hero ---------- */
.hero{
  position: relative; color:#fff;
  background: var(--blue-ink) center/cover no-repeat;
  overflow:hidden;
  min-height: 520px;
  display:flex; align-items:center;
}
.hero::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(100deg, rgba(6,14,30,.90) 20%, rgba(6,14,30,.58) 55%, rgba(6,14,30,.86));
}
.hero-inner{ position:relative; z-index:2; padding: 96px 0 84px; max-width: 700px; }
.hero--page{ min-height: 480px; }
.hero--page .hero-inner{ padding: 90px 0 74px; max-width: 680px; }
.hero-kicker{
  font-weight:700; letter-spacing:.14em; text-transform:uppercase; font-size:.76rem;
  color: rgba(255,255,255,.72); margin-bottom: 16px;
}
.hero h1{ color:#fff; font-size: clamp(2rem, 4vw, 3.15rem); margin-bottom:.5em; }
.hero p{ font-size: 1.05rem; color: rgba(255,255,255,.86); max-width: 600px; }
.hero p .hl{ text-decoration: underline; text-decoration-color: rgba(255,255,255,.5); text-underline-offset: 3px; }
.hero p strong{ font-weight:700; color:#fff; }
.hero-actions{ display:flex; gap:16px; margin-top: 30px; flex-wrap:wrap; }

/* ---------- Section rhythm ---------- */
.section{ padding: 84px 0; }
.section--tight{ padding: 54px 0; }
.section--light{ background: var(--light); }

.eyebrow{
  display:inline-block; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  font-size:.78rem; color: var(--green-deep); margin-bottom: 14px;
}

/* ---------- Intro + accordion (home) ---------- */
.intro-grid{
  display:grid; grid-template-columns: 0.85fr 1.15fr; gap: 64px; align-items: start;
}
.intro-grid h2{ font-size: clamp(1.7rem, 2.6vw, 2.15rem); }
.intro-grid h2 .accent-green{ color: var(--green); }
.intro-grid p{ color: var(--ink-soft); font-size: 1rem; }

.accordion-card{
  background: var(--white);
  border-radius: 4px;
  box-shadow: var(--shadow-card);
  padding: 6px 34px;
}
.accordion-item{ border-top: 1px solid var(--line); }
.accordion-item:first-child{ border-top:none; }
.accordion-trigger{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap: 20px;
  padding: 24px 0; background:none; border:none; text-align:left;
  font-family: var(--font-body); font-weight:700; letter-spacing:.03em; text-transform:uppercase;
  font-size: 1rem; color: var(--blue-ink);
}
.accordion-trigger .icon{
  flex:none; width:22px; height:22px; position:relative; color: var(--blue);
}
.accordion-trigger .icon::before, .accordion-trigger .icon::after{
  content:""; position:absolute; background: currentColor; border-radius:2px;
}
.accordion-trigger .icon::before{ left:2px; right:2px; top:50%; height:2px; transform: translateY(-50%); }
.accordion-trigger .icon::after{ top:2px; bottom:2px; left:50%; width:2px; transform: translateX(-50%); transition: transform .25s var(--ease), opacity .25s var(--ease); }
.accordion-item.is-open .accordion-trigger .icon::after{ transform: translateX(-50%) scaleY(0); opacity:0; }

.accordion-panel{ max-height:0; overflow:hidden; transition: max-height .32s var(--ease); }
.accordion-panel-inner{ padding: 0 0 28px; }
.accordion-panel-inner .sub{ font-weight:700; color: var(--blue-ink); margin-bottom:10px; font-size:1.02rem; }
.accordion-panel-inner p{ color: var(--ink-soft); font-size:.96rem; margin-bottom: .9em; }
.accordion-panel-inner p:last-child{ margin-bottom:0; }

/* ---------- Cámaras / voice section ---------- */
.voice-grid{ display:grid; grid-template-columns: 0.75fr 1.25fr; gap: 60px; align-items:center; }
.voice-grid h2{ font-size: clamp(1.8rem, 3vw, 2.35rem); }
.voice-underline{
  display:inline; background-image: linear-gradient(var(--green), var(--green));
  background-repeat:no-repeat; background-position: 0 100%; background-size: 100% 3px;
  padding-bottom: 4px;
}
.voice-grid p{ color: var(--ink-soft); margin:0; }
.voice-grid p strong{ color: var(--ink); font-weight:700; }

/* ---------- Feature icons strip ---------- */
.feature-strip{ display:grid; grid-template-columns: repeat(3,1fr); gap: 44px; margin-top: 60px; text-align:center; }
.feature-strip .icon-wrap{ height: 96px; display:flex; align-items:center; justify-content:center; margin-bottom: 22px; }
.feature-strip .icon-wrap img{ max-height: 88px; width:auto; margin:0 auto; }
.pill-badge{
  display:inline-block; background: var(--blue); color:#fff; font-weight:700; font-size:.92rem;
  padding: 11px 30px; border-radius: 999px; margin-bottom: 22px;
}
.feature-strip h3{ color: var(--ink); font-size: 1.1rem; margin-bottom: 12px; font-family: var(--font-body); font-weight:700; }
.feature-strip p{ color: var(--ink-soft); font-size:.94rem; max-width: 320px; margin: 0 auto; }

/* ---------- CTA band ---------- */
.cta-band{
  position:relative; background: var(--blue-ink) center/cover no-repeat; color:#fff;
  padding: 100px 0; text-align:center;
}
.cta-band::after{ content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(6,14,30,.72), rgba(6,14,30,.88)); }
.cta-band .container{ position:relative; z-index:2; }
.cta-band h2{ color:#fff; font-size: clamp(1.8rem, 3.2vw, 2.5rem); max-width: 700px; margin: 0 auto 20px; }
.cta-band p{ color: rgba(255,255,255,.82); max-width: 600px; margin: 0 auto 32px; }
.cta-band p strong{ color:#fff; }

/* ---------- Footer ---------- */
.site-footer{ background: var(--blue); color: rgba(255,255,255,.86); position:relative; border-top: 5px solid var(--green); }
.footer-top{
  display:grid; grid-template-columns: 1.3fr 1fr 1fr 1.2fr; gap: 48px;
  padding: 56px 0 46px;
}
.footer-brand-text{ color:#fff; font-family: var(--font-display); font-size:1.3rem; margin-bottom:16px; }
.footer-col p{ font-size:.92rem; color: rgba(255,255,255,.82); }
.footer-col a.email{ text-decoration: underline; color:#fff; }
.footer-col address{ font-style: italic; color: rgba(255,255,255,.82); font-size:.92rem; }
.footer-col h4{
  color:#fff; font-family: var(--font-display); font-style: italic; font-weight:700;
  font-size:1.05rem; margin-bottom: 18px;
}
.footer-col ul li{ margin-bottom: 12px; }
.footer-col ul li a{ font-size:.92rem; text-decoration: underline; color: rgba(255,255,255,.9); }
.footer-col ul li a:hover{ color:#fff; }
.footer-legal-list li a{ text-decoration:none; color: rgba(255,255,255,.9); }
.footer-legal-list li a:hover{ text-decoration: underline; }
.footer-legal-note{ font-size:.82rem; color: rgba(255,255,255,.7); line-height:1.6; }
.footer-legal-note + .footer-legal-note{ margin-top: 12px; }

/* ---------- Scroll reveal ---------- */
.reveal{ opacity:0; transform: translateY(20px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.reveal.is-visible{ opacity:1; transform:none; }

/* ---------- Back to top ---------- */
.back-to-top{
  position:fixed; right:26px; bottom:26px; width:46px; height:46px; border-radius:50%;
  background: var(--blue); color:#fff; border:none;
  display:flex; align-items:center; justify-content:center;
  box-shadow: var(--shadow-soft);
  opacity:0; visibility:hidden; transform: translateY(10px);
  transition: opacity .25s var(--ease), transform .25s var(--ease), visibility .25s;
  z-index: 400; font-size: 1.1rem;
}
.back-to-top.is-visible{ opacity:1; visibility:visible; transform:none; }

/* ---------- Mission / Vision ---------- */
.mv-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-top: 44px; }
.mv-card{
  background: var(--white); border: 1.5px solid var(--line); border-top: 4px solid var(--blue);
  border-radius: 4px; padding: 34px 36px; box-shadow: var(--shadow-card);
}
.mv-card .eyebrow{ margin-bottom: 12px; }
.mv-card p{ color: var(--ink-soft); margin:0; font-size:.98rem; }

/* ---------- Carousel ---------- */
.carousel-wrap{ margin-top: 48px; position:relative; }
.carousel-track{
  display:flex; gap: 24px; overflow-x:auto; scroll-snap-type: x mandatory;
  padding-bottom: 6px; scrollbar-width:none; -ms-overflow-style:none;
}
.carousel-track::-webkit-scrollbar{ display:none; }
.carousel-track > *{ scroll-snap-align:start; flex: 0 0 auto; }
.carousel-nav{ display:flex; gap:12px; justify-content:flex-end; margin-top: 26px; }
.carousel-btn{
  width:44px; height:44px; border-radius:50%; border:1.5px solid var(--blue);
  background:#fff; color:var(--blue); display:flex; align-items:center; justify-content:center;
  font-size:1.05rem; transition: background .2s var(--ease), color .2s var(--ease), opacity .2s var(--ease);
}
.carousel-btn:hover{ background: var(--blue); color:#fff; }
.carousel-btn[disabled]{ opacity:.35; pointer-events:none; }

.principle-card{
  width: 300px; background: var(--white); border: 1px solid var(--line); border-bottom: 3px solid var(--green);
  border-radius: 4px; padding: 28px 26px; box-shadow: var(--shadow-card);
}
.principle-card h3{ font-family: var(--font-body); font-size: 1.02rem; color: var(--blue-ink); margin-bottom:10px; }
.principle-card p{ color: var(--ink-soft); font-size:.92rem; margin:0; }

.team-card{
  width: 270px; background: var(--white); border: 1px solid var(--line); border-radius: 6px;
  overflow:hidden; box-shadow: var(--shadow-card);
}
.team-photo{ aspect-ratio: 4/3.6; overflow:hidden; background: var(--light); }
.team-photo img{ width:100%; height:100%; object-fit:cover; }
.team-info{ padding: 20px 22px 24px; }
.team-info .role{
  display:inline-block; font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color: var(--blue); background: rgba(0,50,158,.08); padding: 4px 10px; border-radius: 999px; margin-bottom: 10px;
}
.team-info h3{ font-family: var(--font-body); font-size: 1rem; color: var(--blue-ink); margin-bottom:6px; }
.team-info p{ color: var(--ink-soft); font-size:.88rem; margin:0; }

/* ---------- Governance heads ---------- */
.gov-heads{ display:grid; grid-template-columns: 1fr 1fr; gap: 24px; margin: 40px 0 8px; }

/* ---------- Generic split (used on inner pages) ---------- */
.split{ display:grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items:center; }
.split-media{ border-radius: 6px; overflow:hidden; box-shadow: var(--shadow-soft); }
.split-media img{ width:100%; height:100%; object-fit:cover; }
.split h2{ font-size: clamp(1.6rem, 2.6vw, 2.1rem); }
.split p{ color: var(--ink-soft); }
.split p strong{ color: var(--ink); }

/* ---------- Hero pattern variant (Nosotros, inner pages) ---------- */
.hero--pattern{
  min-height: 640px;
  background-color: var(--blue-ink);
  background-image:
    repeating-linear-gradient(45deg, rgba(255,255,255,.045) 0 2px, transparent 2px 46px),
    repeating-linear-gradient(-45deg, rgba(255,255,255,.045) 0 2px, transparent 2px 46px);
}
.hero--pattern::after{ background: radial-gradient(ellipse at 22% 15%, rgba(30,60,130,.55), rgba(6,14,30,.9)); }
.hero-wave{ position:absolute; bottom:-1px; left:0; width:100%; line-height:0; z-index:3; }
.hero-wave svg{ width:100%; height:auto; display:block; }

/* ---------- Two-column intro text ---------- */
.intro-2col{ display:grid; grid-template-columns:1fr 1fr; gap:48px; }
.intro-2col p{ color: var(--ink-soft); }
.intro-2col p strong{ color: var(--ink); }
h2 em, h1 em{ font-style: italic; }

/* ---------- Reason card (Nuestra razón de ser + Misión/Visión) ---------- */
.reason-card{ background: var(--light); border-radius: 6px; padding: 52px; }
.reason-card-grid{ display:grid; grid-template-columns: .95fr 1.05fr; gap: 60px; align-items:start; }
.reason-card h2{ font-size: clamp(1.5rem, 2.4vw, 1.9rem); }
.reason-card p{ color: var(--ink-soft); }

.accordion--plain{ background:transparent; box-shadow:none; padding:0; }
.accordion--plain .accordion-item{ border-top: 1px solid rgba(10,24,48,.14); }
.accordion--plain .accordion-item:first-child{ border-top:none; }
.accordion--plain .accordion-trigger{
  text-transform:uppercase; font-weight:700; letter-spacing:.05em; font-size:.92rem; padding: 20px 0;
}
.accordion--plain .accordion-panel-inner{ padding-bottom: 24px; }
.chevron{ display:inline-block; flex:none; color: var(--blue); font-size:1.2rem; line-height:1; transition: transform .25s var(--ease); }
.accordion-item.is-open .chevron{ transform: rotate(180deg); }

/* ---------- Carousel: circular badge cards (principios) ---------- */
.principle-card{ width: 230px; text-align:center; }
.principle-card .badge{
  width:176px; height:176px; border-radius:50%; margin: 0 auto 24px;
  background: var(--blue); display:flex; align-items:center; justify-content:center; overflow:hidden;
  border: 4px solid var(--white); box-shadow: 0 0 0 1px rgba(10,24,48,.08), var(--shadow-card);
}
.principle-card .badge svg{ width:70px; height:70px; }
.principle-card .badge img{ width:100%; height:100%; object-fit:cover; display:block; }
.principle-card h3{ font-family: var(--font-display); font-weight:700; font-size:1.08rem; color: var(--blue-ink); margin-bottom:10px; }
.principle-card p{ font-size:.88rem; color: var(--ink-soft); margin:0; }

/* overlaid carousel arrows (principios + team) */
.carousel-wrap--overlay{ position:relative; }
.carousel-wrap--overlay .carousel-nav{
  position:absolute; top:0; left:0; right:0; margin:0; padding:0;
  display:flex; justify-content:space-between; z-index:6;
}
.carousel-wrap--overlay.carousel--circle .carousel-nav{ top: 76px; }
.carousel-wrap--overlay.carousel--photo .carousel-nav{ top: 150px; }
.carousel-wrap--overlay .carousel-btn{ box-shadow: var(--shadow-card); }

/* ---------- Team carousel: plain photo cards ---------- */
.team-card--plain{ width: 250px; }
.team-card--plain .team-photo{ border-radius: 3px; aspect-ratio: 3/3.55; }
.team-card--plain .team-info{ padding: 18px 2px 0; }
.team-card--plain .role{
  display:block; background:none; padding:0; border-radius:0; color: var(--ink-soft);
  font-size:.72rem; font-weight:700; letter-spacing:.07em;
}
.team-card--plain h3{ font-family: var(--font-display); font-size: 1rem; color: var(--blue-ink); margin: 4px 0 8px; }
.team-card--plain p{ font-size:.86rem; color: var(--ink-soft); margin:0; }
.team-bio-link{
  display:inline-block; margin-top:8px; font-size:.84rem; font-weight:700;
  color: var(--blue); text-decoration:underline; text-underline-offset:2px;
}
.team-bio-link:hover{ color: var(--blue-deep); }

/* ---------- Gov head cards (collapsible, user-controlled) ---------- */
.gov-head{ position:relative; padding: 30px 32px; border-radius: 4px; background: var(--light); }
.gov-head-top{
  all: unset; box-sizing:border-box; cursor:pointer;
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:20px;
}
.gov-head-top h3{ font-family: var(--font-body); font-size:1.08rem; color: var(--blue-ink); margin:0; }
.gov-toggle{ flex:none; width:22px; height:22px; position:relative; color: var(--blue); }
.gov-toggle::before, .gov-toggle::after{ content:""; position:absolute; background: currentColor; border-radius:2px; }
.gov-toggle::before{ left:2px; right:2px; top:50%; height:2px; transform: translateY(-50%); }
.gov-toggle::after{ top:2px; bottom:2px; left:50%; width:2px; transform: translateX(-50%); transition: transform .25s var(--ease), opacity .25s var(--ease); }
.gov-head.is-open .gov-toggle::after{ transform: translateX(-50%) scaleY(0); opacity:0; }
.gov-head-panel{ max-height:0; overflow:hidden; transition: max-height .32s var(--ease); }
.gov-head-panel-inner{ padding-top:12px; }
.gov-head-panel-inner p{ margin:0; color: var(--ink-soft); font-size:.94rem; }
.gov-head-panel-inner hr{ border:none; border-top:1px solid rgba(10,24,48,.15); margin-top:20px; margin-bottom:0; }

/* ---------- Duo image banner (EVENTOS / NOTICIAS) ---------- */
.duo-banner{ display:grid; grid-template-columns:1fr 1fr; }
.duo-banner a{
  position:relative; min-height: 300px; display:flex; align-items:center; justify-content:center;
  background-size:cover; background-position:center; overflow:hidden;
}
.duo-banner a::after{ content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(10,24,48,.32), rgba(10,24,48,.58)); transition: background .25s var(--ease); }
.duo-banner a:hover::after{ background: linear-gradient(180deg, rgba(10,24,48,.5), rgba(10,24,48,.72)); }
.duo-banner span{
  position:relative; z-index:2; color:#fff; font-family: var(--font-display); font-weight:700;
  font-size: clamp(1.9rem, 4vw, 3.1rem); text-transform:uppercase; letter-spacing:.02em;
}

/* ---------- Eyebrow variants ---------- */
.eyebrow--italic{
  font-family: var(--font-display); font-style:italic; font-weight:700; text-transform:uppercase;
  letter-spacing:.06em; font-size:.9rem; color: rgba(255,255,255,.75); display:block; margin-bottom:14px;
}

/* ---------- Hero: flat blue tint + centered content (Participación, etc.) ---------- */
.hero--tint-blue::after{ background: rgba(0,50,158,.58); }
.hero-inner--center{ max-width: 820px; margin: 0 auto; text-align:center; }
.hero-inner--center p{ margin-left:auto; margin-right:auto; }
.hero-lede{ font-size:1rem; color: rgba(255,255,255,.92); margin-bottom: 16px; }
.hero-lede strong{ color:#fff; font-weight:700; }
.hero-inner--center h1{ margin-bottom:0; }

/* ---------- Straight underline heading ---------- */
.heading-wavy{ position:relative; display:inline-block; padding-bottom: 16px; }
.heading-wavy::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:4px;
  background: var(--green); border-radius: 2px;
}

/* ---------- Note bullet (small italic callouts) ---------- */
.note-bullet{ display:flex; gap:10px; align-items:flex-start; font-style:italic; color: var(--ink-soft); font-size:.92rem; margin: 18px 0; }
.note-bullet::before{ content:"•"; color: var(--blue); font-style:normal; line-height:1; }

/* ---------- Numbered accordion (Participación) ---------- */
.accordion--numbered .accordion-item{ border-top: 1px solid rgba(10,24,48,.15); }
.accordion--numbered .accordion-item:first-child{ border-top:none; }
.accordion--numbered .accordion-trigger{
  font-family: var(--font-display); text-transform:none; letter-spacing:0;
  font-weight:700; font-size: 1.32rem; color: var(--blue); padding: 26px 0;
}
.accordion--numbered .accordion-panel-inner{ padding-bottom: 30px; }
.accordion--numbered .accordion-panel-inner .sub{
  font-family: var(--font-body); font-style:italic; font-weight:700; color: var(--ink);
  font-size:1rem; margin-bottom: 12px;
}
.accordion--numbered .accordion-panel-inner p{ color: var(--ink); font-size:.96rem; }
.accordion--numbered .icon{ color: var(--blue); }

.participacion-grid{ display:grid; grid-template-columns: .85fr 1.15fr; gap: 70px; align-items:start; }
.participacion-grid h2{ font-size: clamp(2rem, 3.4vw, 2.6rem); }
.participacion-grid > div:first-child p{ color: var(--ink); font-size:1rem; }
.participacion-grid hr{ border:none; border-top:1px solid rgba(10,24,48,.18); margin: 26px 0; }

/* ---------- Hero: night-sky variant (Transparencia) ---------- */
.hero--night{
  min-height: 540px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #05123a;
}
.hero--night::after{
  background: linear-gradient(180deg, rgba(4,10,32,.72) 0%, rgba(4,10,32,.58) 45%, rgba(4,10,32,.8) 100%);
}
.hero--night .container{ position:relative; z-index:3; }

.stripe-green{ height: 14px; width:100%; background: var(--green); }

/* ---------- Marco institucional icon grid ---------- */
.compliance-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap: 36px; margin-top: 52px; }
.compliance-card svg{ width:58px; height:58px; color: var(--green); margin-bottom: 20px; }
.compliance-card h3{ font-family: var(--font-body); font-size: 1.02rem; color: var(--ink); margin-bottom:10px; }
.compliance-card p{ color: var(--ink-soft); font-size:.9rem; margin:0; }

.link-row{ display:flex; flex-wrap:wrap; justify-content:center; gap: 20px 26px; margin-top: 46px; padding-top:40px; border-top:1px solid var(--line); }

.link-row--grid{
  display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 36px;
  justify-items:center; margin-top: 46px; padding-top:40px; border-top:1px solid var(--line);
}
.link-row--grid .btn{ text-align:center; white-space:normal; }

/* ---------- Compact chevron accordion (Transparencia "Más aspectos") ---------- */
.accordion--compact .accordion-item{ border-top: 1px solid rgba(10,24,48,.14); }
.accordion--compact .accordion-item:first-child{ border-top:none; }
.accordion--compact .accordion-trigger{
  font-family: var(--font-body); text-transform:none; letter-spacing:0;
  font-weight:600; font-size:.98rem; color: var(--ink); padding: 18px 0;
}
.accordion--compact .accordion-panel-inner{ padding: 0 26px 22px 0; }
.accordion--compact .accordion-panel-inner p{ color: var(--ink-soft); font-size:.92rem; }
.accordion--compact .chevron{ font-size:1rem; }

.aspectos-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap: 56px; align-items:stretch; }
.aspectos-media{ border-radius: 6px; overflow:hidden; min-height: 420px; }
.aspectos-media img{ width:100%; height:100%; object-fit:cover; }

@media (max-width: 980px){
  .compliance-grid{ grid-template-columns: 1fr 1fr; }
  .link-row--grid{ grid-template-columns: 1fr 1fr; }
  .aspectos-grid{ grid-template-columns: 1fr; }
  .aspectos-media{ order:-1; min-height:280px; }
}
@media (max-width: 720px){
  .compliance-grid{ grid-template-columns: 1fr; }
  .link-row--grid{ grid-template-columns: 1fr; }
}

@media (max-width: 980px){
  .intro-2col, .reason-card-grid, .mv-grid, .gov-heads, .split{ grid-template-columns: 1fr; gap:32px; }
  .duo-banner{ grid-template-columns: 1fr; }
  .split-media{ order:-1; }
  .participacion-grid{ grid-template-columns: 1fr; gap:36px; }
}



@media (max-width: 980px){
  .intro-grid, .voice-grid{ grid-template-columns: 1fr; gap: 36px; }
  .feature-strip{ grid-template-columns: 1fr; gap: 40px; }
  .footer-top{ grid-template-columns: 1fr 1fr; }
}

@media (max-width: 720px){
  .main-nav{
    position:absolute; top:100%; left:0; right:0; background: var(--white);
    flex-direction:column; align-items:stretch; padding: 10px 24px 22px; gap:4px;
    border-bottom: 1px solid var(--line); display:none;
  }
  .nav-open .main-nav{ display:flex; }
  .nav-toggle{ display:block; }
  .social-links{ display:none; }
  .site-header .container{ height: 104px; }
  .brand img{ height:72px; }
  .section{ padding: 56px 0; }
  .hero-inner{ padding: 76px 0 56px; }
  .accordion-card{ padding: 4px 22px; }
  .footer-top{ grid-template-columns: 1fr; padding: 44px 0 32px; }
}

/* ==========================================================================
   Blog & Contacto pages
   ========================================================================== */

/* ---------- Header brand text (logo + wordmark) ---------- */
.brand-text{ display:flex; flex-direction:column; line-height:1.22; }
.brand-text strong{ font-family: var(--font-display); font-weight:700; color: var(--blue); font-size: .98rem; }
.brand-text span{ font-family: var(--font-body); font-size:.72rem; color: var(--ink-soft); text-transform:uppercase; letter-spacing:.08em; }

/* ---------- Additional button variants ---------- */
.btn-primary{ background: var(--blue); color:#fff; }
.btn-primary:hover{ background: var(--blue-deep); }
.btn-navy{ background: transparent; color: var(--blue); border-color: var(--blue); }
.btn-navy:hover{ background: var(--blue); color:#fff; }
.btn-arrow::after{ content:"\2192"; display:inline-block; transition: transform .22s var(--ease); }
.btn-arrow:hover::after{ transform: translateX(4px); }

/* ---------- Section background variants ---------- */
.section--sand{ background: var(--sand); }
.section--dark{
  position:relative; color:#fff; overflow:hidden;
  background-color: var(--blue-ink);
  background-image:
    repeating-linear-gradient(45deg, rgba(255,255,255,.045) 0 2px, transparent 2px 46px),
    repeating-linear-gradient(-45deg, rgba(255,255,255,.045) 0 2px, transparent 2px 46px);
}
.section--dark::before{
  content:""; position:absolute; inset:0;
  background: radial-gradient(ellipse at 82% 30%, rgba(30,60,130,.5), transparent 60%);
}
.section--dark .container{ position:relative; z-index:2; }
.section--dark h2, .section--dark h3{ color:#fff; }
.section--dark p{ color: rgba(255,255,255,.82); }

/* ---------- Hero: split image / dotted-navy variant (Blog) ---------- */
.hero--split{
  position:relative; overflow:hidden; min-height: 560px;
  display:flex; align-items:center;
  background-color: var(--blue-ink);
}
.hero--split::before{
  content:""; position:absolute; inset:0; z-index:0;
  background-image: radial-gradient(rgba(255,255,255,.16) 1.6px, transparent 1.8px);
  background-size: 28px 28px;
}
.hero--split::after{ content:none; }
.hero-split-media{
  position:absolute; top:0; left:0; bottom:0; width: 54%; z-index:1;
  background-size:cover; background-position:center;
  clip-path: polygon(0 0, 100% 0, 76% 100%, 0 100%);
}
.hero-split-media::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(200deg, rgba(6,14,30,.05) 40%, rgba(6,14,30,.4));
}
.hero--split .container{ position:relative; z-index:2; }
.hero-inner--split{ margin-left:auto; max-width:600px; text-align:right; padding: 90px 0; }
.hero-inner--split h1{ color:#fff; font-size: clamp(2.1rem, 4vw, 3.2rem); margin-bottom:.4em; }
.hero-inner--split .hero-lede{ margin-left:auto; max-width:440px; }

/* ---------- Blog: featured event banner ---------- */
.blog-feature{
  position:relative; border-radius: 8px; overflow:hidden;
  min-height: 480px; background-size:cover; background-position:center; background-color: var(--blue-ink);
  display:flex; align-items:center; justify-content:center; padding: 60px 24px;
}
.blog-feature-content{
  position:relative; z-index:2; background:#fff; max-width: 460px; width:100%;
  padding: 44px 42px; border-radius: 6px; box-shadow: var(--shadow-soft); text-align:center;
}
.blog-feature-content .eyebrow{ margin-bottom:6px; }
.blog-feature-content h2{ font-size: clamp(1.7rem, 3vw, 2.15rem); margin-bottom:.35em; }
.blog-feature-date{ font-weight:700; color: var(--ink); margin-bottom:2px; }
.blog-feature-place{ color: var(--ink-soft); font-size:.92rem; margin-bottom:18px; }
.blog-feature-content > p:not(.blog-feature-date):not(.blog-feature-place){ color: var(--ink-soft); font-size:.92rem; margin-bottom:26px; }

/* ---------- Blog: post grid / cards ---------- */
.post-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap:28px; margin-top:44px; }
.post-card{
  background:#fff; border-radius:6px; overflow:hidden; box-shadow: var(--shadow-card);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.post-card:hover{ transform: translateY(-5px); box-shadow: var(--shadow-soft); }
.post-thumb{ display:block; aspect-ratio: 4/3; overflow:hidden; background: var(--light); }
.post-thumb img{ width:100%; height:100%; object-fit:cover; transition: transform .35s var(--ease); }
.post-card:hover .post-thumb img{ transform: scale(1.06); }
.post-body{ padding: 20px 22px 26px; }
.post-meta{ display:flex; align-items:center; gap:8px; font-size:.78rem; color: var(--ink-soft); margin-bottom:10px; }
.post-meta .dot{ width:3px; height:3px; border-radius:50%; background: var(--ink-soft); }
.post-body h3{ font-family: var(--font-display); font-size:1.08rem; line-height:1.32; color: var(--blue-ink); margin-bottom:10px; }
.post-body p{ font-size:.88rem; color: var(--ink-soft); margin-bottom:16px; }
.post-link{ font-size:.85rem; font-weight:700; color: var(--blue); text-decoration:underline; text-underline-offset:2px; }
.post-link:hover{ color: var(--blue-deep); }

/* ---------- Pagination (Blog news grid) ---------- */
.pagination{ display:flex; align-items:center; justify-content:center; gap:10px; margin-top:44px; flex-wrap:wrap; }
.pagination-btn{
  min-width:42px; height:42px; padding:0 14px; border-radius:8px;
  border:1.5px solid var(--line); background:#fff; color: var(--blue-ink);
  font-weight:600; font-size:.92rem; cursor:pointer;
  transition: background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease);
}
.pagination-btn:hover:not(:disabled){ border-color: var(--blue); color: var(--blue); }
.pagination-btn.is-active{ background: var(--blue); border-color: var(--blue); color:#fff; }
.pagination-btn:disabled{ opacity:.4; cursor:not-allowed; }

/* ---------- News "Read More" modal (shares .privacy-overlay/.privacy-modal base) ---------- */
.privacy-modal.news-modal{ padding:0 0 40px; max-width: 780px; }
.news-modal .privacy-close{ top:16px; right:16px; background:#fff; box-shadow: var(--shadow-card); }
.news-modal-image{ width:100%; aspect-ratio: 16/8; overflow:hidden; border-radius:10px 10px 0 0; background: var(--light); }
.news-modal-image img{ width:100%; height:100%; object-fit:cover; display:block; }
.news-modal-content{ padding: 30px 44px 0; }
.news-modal-meta{ font-size:.8rem; color: var(--ink-soft); font-weight:600; letter-spacing:.04em; text-transform:uppercase; margin-bottom:10px; }
.news-modal-content h2{ font-size: clamp(1.2rem, 2.2vw, 1.55rem); margin-bottom: .6em; }
.news-modal-content p{ font-size:.94rem; color: var(--ink-soft); margin-bottom: 1em; line-height:1.65; }
.news-modal-source{ font-size:.8rem; color: var(--ink-soft); border-top:1px solid var(--line); padding-top:18px; margin-top:10px; }
.news-modal-source a{ color: var(--blue); font-weight:600; text-decoration:underline; text-underline-offset:2px; }
.news-modal-source a:hover{ color: var(--blue-deep); }

@media (max-width: 560px){
  .news-modal-content{ padding: 26px 22px 0; }
}

/* ---------- Team bio modal (shares .privacy-overlay/.privacy-modal base) ---------- */
.bio-modal-header{ display:flex; align-items:center; gap:20px; margin-bottom:22px; }
.bio-modal-photo{ width:88px; height:88px; border-radius:50%; overflow:hidden; flex:none; box-shadow: var(--shadow-card); }
.bio-modal-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.bio-modal-header .privacy-eyebrow{ margin-bottom:4px; }
.bio-modal-header h2{ margin:0; }
@media (max-width: 480px){
  .bio-modal-header{ gap:14px; }
  .bio-modal-photo{ width:68px; height:68px; }
}

/* ---------- Newsletter banner ---------- */
.newsletter{ display:grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items:center; padding: 74px 0; }
.newsletter h2{ font-size: clamp(1.7rem, 3vw, 2.3rem); }
.newsletter > div:first-child p{ max-width:440px; }
.newsletter-form{ display:flex; gap:0; max-width:460px; }
.newsletter-form input{
  flex:1; min-width:0; padding:15px 18px; border:none; border-radius: var(--radius-btn) 0 0 var(--radius-btn);
  font-size:.95rem; color: var(--ink);
}
.newsletter-form input:focus{ outline: 2px solid rgba(255,255,255,.5); outline-offset:-2px; }
.newsletter-form .btn{ border-radius: 0 var(--radius-btn) var(--radius-btn) 0; }
.newsletter-note{ font-size:.78rem; color: rgba(255,255,255,.6); margin: 14px 0 0; }
.newsletter .form-msg{ color: rgba(255,255,255,.9); font-size:.85rem; min-height:1.2em; }

/* ---------- Contacto: intro + form ---------- */
.contact-top-grid{ display:grid; grid-template-columns: .85fr 1.15fr; gap: 56px; align-items:start; }
.contact-top-grid h1{ color: var(--green); font-size: clamp(2.1rem, 3.6vw, 2.9rem); margin-bottom:.4em; }
.contact-top-grid > div:first-child > p{ color: var(--ink-soft); max-width: 460px; }

.circled{ position:relative; display:inline-block; font-style:normal; }
.circled::after{
  content:""; position:absolute; left:-16%; right:-16%; top:-18px; bottom:-9px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 90'%3E%3Cellipse cx='100' cy='45' rx='96' ry='40' fill='none' stroke='%2300993d' stroke-width='4'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-size:100% 100%;
  transform: rotate(-2deg); pointer-events:none; z-index:-1;
}

.contact-note{
  background: var(--sand); border-radius:6px; padding: 24px 26px; margin: 28px 0;
  font-size:.88rem; font-style:italic; color: var(--ink-soft); line-height:1.6;
}

.contact-info-card{ background: var(--blue); color:#fff; border-radius:6px; padding: 34px 34px 30px; }
.contact-info-card h3{ color:#fff; font-family: var(--font-body); font-weight:700; font-size:1.1rem; margin-bottom:20px; }
.contact-info-item{ display:flex; gap:12px; align-items:flex-start; font-size:.9rem; color: rgba(255,255,255,.92); margin-bottom:14px; }
.contact-info-item:last-child{ margin-bottom:0; }
.contact-info-item .ico{ flex:none; width:20px; text-align:center; color: var(--gold); font-size:1rem; line-height:1.4; }

.contact-form-panel{ background: var(--sand); border-radius: 10px; padding: 44px 40px; }

.form-field{ margin-bottom: 22px; }
.form-field label{ display:block; font-size:.85rem; font-weight:700; color: var(--ink); margin-bottom:8px; }
.form-field .req{ color: var(--green); margin-left:2px; }
.form-field input, .form-field select, .form-field textarea{
  width:100%; padding: 13px 16px; border: 1.5px solid rgba(10,24,48,.14); border-radius:6px;
  background:#fff; font-size:.94rem; color: var(--ink); transition: border-color .2s var(--ease);
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus{ border-color: var(--blue); }
.form-field textarea{ resize:vertical; min-height:120px; }
.form-field select{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%235b6472' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position: right 14px center; padding-right:38px;
}
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.form-field.full{ grid-column: 1/-1; }
.phone-group{ display:grid; grid-template-columns: 1fr 1fr; gap:12px; }

.form-checkbox{ display:flex; align-items:flex-start; gap:10px; font-size:.86rem; color: var(--ink-soft); margin-bottom:14px; cursor:pointer; }
.form-checkbox input{ width:auto; margin-top:3px; accent-color: var(--blue); }
.form-msg{ font-size:.85rem; color: var(--ink-soft); margin-top:14px; min-height:1.2em; }
.form-msg.ok{ color: var(--green-deep); font-weight:600; }
.form-msg.err{ color: #b3261e; font-weight:600; }
.newsletter .form-msg.ok{ color:#8be0a8; }
.newsletter .form-msg.err{ color:#ff9a8e; }

@media (max-width: 980px){
  .hero-inner--split{ margin-left:0; text-align:left; max-width:520px; }
  .hero-inner--split .hero-lede{ margin-left:0; }
  .hero-split-media{ width:100%; clip-path:none; opacity:.28; }
  .post-grid{ grid-template-columns: 1fr 1fr; }
  .newsletter{ grid-template-columns: 1fr; gap:32px; }
  .contact-top-grid{ grid-template-columns: 1fr; gap:36px; }
  .form-grid, .phone-group{ grid-template-columns: 1fr; }
}
@media (max-width: 720px){
  .post-grid{ grid-template-columns: 1fr; }
  .blog-feature-content{ padding: 32px 26px; }
  .contact-form-panel{ padding: 30px 22px; }
}

/* ==========================================================================
   Institutional notice modal
   ========================================================================== */
.notice-overlay{
  position: fixed; inset:0; z-index: 1000;
  background: rgba(6,14,30,.72);
  display:flex; align-items:center; justify-content:center;
  padding: 24px;
  opacity:0; pointer-events:none;
  transition: opacity .25s var(--ease);
}
.notice-overlay.is-open{ opacity:1; pointer-events:auto; }
.notice-modal{
  background:#fff; border-radius: 10px; max-width: 720px; width:100%;
  max-height: 84vh; overflow-y:auto; position:relative;
  padding: 44px 44px 36px; box-shadow: 0 30px 70px rgba(0,0,0,.35);
  transform: translateY(16px); transition: transform .25s var(--ease);
}
.notice-overlay.is-open .notice-modal{ transform: translateY(0); }
.notice-close{
  position:absolute; top:16px; right:16px; width:38px; height:38px; border-radius:50%;
  background: var(--light); border:none; color: var(--ink); font-size:1.3rem; line-height:1;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition: background .2s var(--ease), color .2s var(--ease);
}
.notice-close:hover{ background: var(--blue); color:#fff; }
.notice-eyebrow{
  font-weight:700; letter-spacing:.12em; text-transform:uppercase; font-size:.76rem;
  color: var(--green-deep); margin-bottom: 10px;
}
.notice-modal h2{ font-size: clamp(1.25rem, 2.4vw, 1.6rem); margin-bottom: .6em; }
.notice-modal p{ font-size:.94rem; color: var(--ink-soft); margin-bottom: 1em; }
.notice-modal p strong{ color: var(--ink); }
.notice-signature{ font-weight:700; color: var(--blue-ink); margin-top: 24px; margin-bottom:0; }
.notice-signature a{ color: var(--blue); text-decoration:underline; text-underline-offset:2px; }
.notice-signature a:hover{ color: var(--blue-deep); }
.notice-divider{ border:none; border-top:1px solid var(--line); margin: 32px 0 28px; }

/* ---------- EXPO MARKET popup (flyer recreation) ---------- */
.expo-shell{
  --expo-navy:#0b2547; --expo-navy-deep:#071a34; --expo-gold:#c6a45a; --expo-gray-text:#6b7280;
  background:#fff; border-radius: 10px; max-width: 640px; width:100%;
  max-height: 88vh; overflow-y:auto; overflow-x:hidden; position:relative;
  box-shadow: 0 30px 70px rgba(0,0,0,.35);
  transform: translateY(16px); transition: transform .25s var(--ease);
}
.notice-overlay.is-open .expo-shell{ transform: translateY(0); }
.expo-close{ z-index:5; }

.expo-header{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding: 30px 34px 22px; background: linear-gradient(135deg,#ededed,#dadada);
}
.expo-logo{ display:flex; align-items:center; gap:12px; }
.expo-logo-icon{
  width:42px; height:42px; border-radius:50%; flex-shrink:0; position:relative;
  background: conic-gradient(var(--expo-gold) 0deg 170deg, var(--expo-navy) 170deg 360deg);
}
.expo-logo-icon-inner{ position:absolute; inset:9px; border-radius:50%; background:#ededed; }
.expo-logo-text{ display:flex; flex-direction:column; line-height:1.05; }
.expo-logo-title{ font-size:1.4rem; font-weight:800; color: var(--expo-navy); }
.expo-logo-title span{ display:block; font-size:1.02rem; font-weight:600; letter-spacing:.02em; }
.expo-logo-sub{ font-size:.6rem; letter-spacing:.1em; color: var(--expo-navy); margin-top:5px; }

.expo-dates{ text-align:right; flex-shrink:0; }
.expo-dates-numbers{ font-size:1.95rem; font-weight:800; color: var(--expo-navy); line-height:1; }
.expo-dates-numbers i{ color: var(--expo-gold); font-style:normal; margin:0 1px; }
.expo-dates-month{ font-size:.9rem; color: var(--expo-navy); letter-spacing:.03em; margin-top:3px; }
.expo-dates-month strong{ font-weight:800; }
.expo-dates-venue{ font-size:.66rem; color: var(--expo-navy); margin-top:5px; }

.expo-tagline{ text-align:center; font-size:1.08rem; color: var(--expo-navy); padding: 18px 24px; }
.expo-gold-bar{ height:8px; background: var(--expo-gold); }

.expo-body{ padding: 28px 36px 4px; }
.expo-desc{ text-align:center; font-size:.86rem; color: var(--expo-gray-text); line-height:1.65; margin-bottom:26px; }
.expo-desc strong{ color: var(--expo-navy); font-weight:700; }

.expo-list-title{ text-align:center; font-size:1.02rem; font-weight:800; color: var(--expo-navy); margin-bottom:20px; line-height:1.45; }
.expo-underline{ text-decoration: underline; text-decoration-color: var(--expo-gold); text-decoration-thickness:2px; text-underline-offset:3px; }

.expo-participants{ display:grid; grid-template-columns:1fr 1fr; gap: 4px 32px; margin-bottom:16px; }
.expo-participants ul{ list-style:none; margin:0; padding:0; }
.expo-participants li{ margin-bottom:13px; font-size:.78rem; }
.expo-participants li strong{ display:block; color: var(--expo-navy); font-weight:800; letter-spacing:.01em; }
.expo-participants li span{ display:block; padding-left:14px; color: var(--expo-gray-text); position:relative; margin-top:3px; }
.expo-participants li span::before{ content:"▪"; position:absolute; left:0; top:.15em; color: var(--expo-navy); font-size:.6rem; }

.expo-note{ text-align:center; font-size:.74rem; font-style:italic; color: var(--expo-gray-text); margin-bottom:22px; }
.expo-invite{ text-align:center; font-size:.82rem; color: var(--expo-navy); margin-bottom:28px; }

.expo-footer{ text-align:center; font-size:.86rem; padding: 18px 24px; }
.expo-footer--gold{ background: var(--expo-gold); color: var(--expo-navy-deep); }
.expo-footer--gold a{ color: var(--expo-navy-deep); }
.expo-footer--navy{ background: var(--expo-navy); color:#fff; }
.expo-footer--navy a{ color:#fff; }
.expo-footer a{ text-decoration:none; }
.expo-footer strong{ font-weight:800; }

.expo-divider{ border:none; border-top:2px dashed #d9d9d9; margin:0; }

.expo-conoce-mas{ display:flex; align-items:center; justify-content:center; gap:12px; padding: 24px; background: linear-gradient(135deg,#ededed,#dadada); }
.expo-pill-gold{ background: var(--expo-gold); color:#fff; font-weight:800; font-size:.78rem; letter-spacing:.05em; padding: 13px 28px; border-radius:999px; }
.expo-chevron-btn{ width:34px; height:34px; border-radius:50%; background: var(--expo-gold); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1rem; line-height:1; }

.expo-navy-bar{ height:14px; background: var(--expo-navy); }

.expo-mesas-title{ text-align:center; font-size:1.15rem; font-weight:800; color: var(--expo-navy); margin: 26px 0 10px; }
.expo-mesas-sub{ text-align:center; font-size:.82rem; color: var(--expo-gray-text); margin-bottom:28px; }
.expo-mesas-sub strong{ color: var(--expo-navy); }

.expo-mesas-row{ display:grid; grid-template-columns:1fr 1fr; gap: 0 24px; position:relative; margin-bottom:30px; }
.expo-mesas-row::before{
  content:""; position:absolute; top:20px; left:50%; width:1px; height:1px;
  border-top:2px solid var(--expo-navy); transform: translateX(-50%); z-index:0;
}
.expo-mesa{ text-align:center; position:relative; z-index:1; }
.expo-mesa-pill{ background: linear-gradient(90deg, var(--expo-navy), #929aa5); border-radius:999px; padding:11px 0; margin-bottom:16px; }
.expo-mesas-row .expo-mesa:nth-child(2) .expo-mesa-pill{ background: linear-gradient(90deg, #929aa5, var(--expo-navy)); }
.expo-mesa-pill span{ color:#fff; font-weight:800; font-size:.8rem; letter-spacing:.04em; }
.expo-mesa-speaker{ font-size:.72rem; font-weight:800; color: var(--expo-navy); letter-spacing:.03em; margin-bottom:8px; line-height:1.5; }
.expo-mesa-desc{ font-size:.76rem; color: var(--expo-gray-text); line-height:1.55; padding:0 8px; }
.expo-mesa--solo{ max-width: 300px; margin: 0 auto 12px; }

@media (max-width: 620px){
  .expo-header{ flex-direction:column; text-align:center; gap:16px; padding:26px 22px 18px; }
  .expo-dates{ text-align:center; }
  .expo-body{ padding: 24px 22px 4px; }
  .expo-participants{ grid-template-columns:1fr; }
  .expo-mesas-row{ grid-template-columns:1fr; gap:26px; }
  .expo-mesas-row::before{ display:none; }
}

@media (max-width: 560px){
  .notice-modal{ padding: 34px 24px 28px; }
}

/* ==========================================================================
   Privacy Policy modal
   ========================================================================== */
.privacy-overlay{
  position: fixed; inset:0; z-index: 1100;
  background: rgba(6,14,30,.72);
  display:flex; align-items:center; justify-content:center;
  padding: 24px;
  opacity:0; pointer-events:none;
  transition: opacity .25s var(--ease);
}
.privacy-overlay.is-open{ opacity:1; pointer-events:auto; }
.privacy-modal{
  background:#fff; border-radius: 10px; max-width: 760px; width:100%;
  max-height: 86vh; overflow-y:auto; position:relative;
  padding: 44px 44px 40px; box-shadow: 0 30px 70px rgba(0,0,0,.35);
  transform: translateY(16px); transition: transform .25s var(--ease);
}
.privacy-overlay.is-open .privacy-modal{ transform: translateY(0); }
.privacy-close{
  position:absolute; top:16px; right:16px; width:38px; height:38px; border-radius:50%;
  background: var(--light); border:none; color: var(--ink); font-size:1.3rem; line-height:1;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition: background .2s var(--ease), color .2s var(--ease);
}
.privacy-close:hover{ background: var(--blue); color:#fff; }
.privacy-eyebrow{
  font-weight:700; letter-spacing:.12em; text-transform:uppercase; font-size:.76rem;
  color: var(--green-deep); margin-bottom: 10px;
}
.privacy-modal h2{ font-size: clamp(1.2rem, 2.2vw, 1.5rem); margin-bottom: .2em; }
.privacy-modal .privacy-updated{ font-size:.82rem; color: var(--ink-soft); margin-bottom: 1.4em; }
.privacy-modal h3{ font-family: var(--font-body); font-size:1.02rem; color: var(--blue-deep); margin: 1.6em 0 .5em; }
.privacy-modal h3:first-of-type{ margin-top: .4em; }
.privacy-modal h4{ font-family: var(--font-body); font-size:.92rem; font-weight:700; color: var(--blue); margin: 1.2em 0 .3em; }
.privacy-modal p{ font-size:.92rem; color: var(--ink-soft); margin-bottom: 1em; line-height:1.6; }
.privacy-modal a{ color: var(--blue); font-weight:600; text-decoration:underline; text-underline-offset:2px; }
.privacy-modal a:hover{ color: var(--blue-deep); }
.privacy-signature{ font-weight:700; color: var(--blue-ink); margin-top: 24px; font-size:.9rem; }

@media (max-width: 560px){
  .privacy-modal{ padding: 34px 22px 28px; }
}

/* ---------- Cookie preferences modal (shares .privacy-overlay/.privacy-modal base) ---------- */
.cookie-option{
  background: var(--sand); border-radius:6px; padding: 16px 20px; margin-bottom: 14px;
}
.cookie-option-head{ display:flex; align-items:center; justify-content:space-between; gap:16px; }
.cookie-option-head label{ font-weight:700; color: var(--blue-ink); font-size:.96rem; }
.cookie-option-head input[type="checkbox"]{ width:20px; height:20px; accent-color: var(--blue); flex:none; }
.cookie-option p{ margin: 8px 0 0; font-size:.86rem; color: var(--ink-soft); }
.cookie-actions{ display:flex; flex-wrap:wrap; gap:14px; margin-top: 26px; }
.cookie-status{ font-size:.86rem; color: var(--green-deep); font-weight:600; margin: 14px 0 0; min-height: 1.2em; }

/* ---------- Cookie consent banner (first layer) ---------- */
.cookie-banner{
  position: fixed; left:0; right:0; bottom:0; z-index: 1200;
  background: #fff; box-shadow: 0 -6px 24px rgba(10,24,48,.14);
  border-top: 1px solid var(--line);
  transform: translateY(100%); transition: transform .3s var(--ease);
}
.cookie-banner.is-open{ transform: translateY(0); }
.cookie-banner-inner{
  max-width: 1220px; margin:0 auto; padding: 20px 24px;
  display:flex; align-items:center; justify-content:space-between; gap: 28px; flex-wrap:wrap;
}
.cookie-banner-inner p{ margin:0; font-size:.88rem; color: var(--ink-soft); flex:1 1 380px; line-height:1.55; }
.cookie-banner-inner p a{ color: var(--blue); font-weight:600; text-decoration:underline; text-underline-offset:2px; }
.cookie-banner-inner p a:hover{ color: var(--blue-deep); }
.cookie-banner-actions{ display:flex; gap:12px; flex-wrap:wrap; flex:0 0 auto; }
.cookie-banner-actions .btn{ font-size:.86rem; padding: 11px 18px; white-space:nowrap; }

@media (max-width: 720px){
  .cookie-banner-inner{ padding: 18px 20px; }
  .cookie-banner-actions{ width:100%; }
  .cookie-banner-actions .btn{ flex:1 1 auto; text-align:center; }
}