/* ═══════════════════════════════════════════════════════════════
   AupaZu — Dirección visual radical "El barrio en movimiento"
   Hoja única de las páginas principales (index.html / index-eu.html).
   Sistema: crema/papel/tinta navy/terracota + acento lima #DCE94B.
   Hero: vídeo real vertical de la app (tarjeta editorial) + recorrido con fotogramas reales sincronizados al scroll.
   ═══════════════════════════════════════════════════════════════ */

:root {
  --cream: #F2EFE5;
  --paper: #FAF8F1;
  --ink: #10233B;
  --ink-soft: rgba(16, 35, 59, .72);
  --terra: #BC4F32;
  --acid: #DCE94B;
  --line: rgba(16, 35, 59, .22);
  --sans: "Montserrat", "Inter", system-ui, sans-serif;
  --body: "Inter", system-ui, sans-serif;
  --serif: "Fraunces", Georgia, serif;
  --pad: clamp(20px, 5vw, 72px);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--cream);
  color: var(--ink);
  font-family: var(--body);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; }
a { color: inherit; }
.serif { font-family: var(--serif); font-weight: 400; font-style: italic; }
.container { width: 100%; max-width: 1440px; margin: 0 auto; padding-left: var(--pad); padding-right: var(--pad); }

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 200;
  background: var(--ink); color: var(--paper); padding: 12px 20px;
}
.skip-link:focus { left: 0; }

.tag {
  display: inline-flex; align-items: center; gap: 14px;
  font-family: var(--sans); font-size: 11px; font-weight: 400;
  letter-spacing: .16em; text-transform: uppercase;
}
.tag::before { content: ""; width: 42px; height: 1px; background: currentColor; }

/* ── Header ─────────────────────────────────────────────────── */
.site-header {
  position: fixed; inset: 18px 0 auto 0; z-index: 100;
  pointer-events: none;
  transition: inset .35s ease;
}
.header-inner {
  pointer-events: auto;
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  padding: 14px 22px;
  border-radius: 22px;
  color: var(--paper);
  transition: background .35s ease, box-shadow .35s ease, padding .35s ease;
}
.site-header.scrolled .header-inner {
  background: rgba(16, 35, 59, .92);
  box-shadow: 0 18px 50px rgba(16, 35, 59, .25);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.header-logo img { height: 44px; width: auto; }
.header-nav { display: flex; gap: 34px; }
.header-nav a {
  font-family: var(--sans); font-size: 12px; font-weight: 400;
  letter-spacing: .12em; text-transform: uppercase; text-decoration: none;
  opacity: .85;
}
.header-nav a:hover, .header-nav a:focus-visible { opacity: 1; color: var(--acid); }
.header-right { display: flex; align-items: center; gap: 16px; }
.lang-switcher { font-size: 12px; font-weight: 400; letter-spacing: .1em; }
.lang-toggle { text-decoration: none; opacity: .6; padding: 4px 2px; }
.lang-toggle.active { opacity: 1; color: var(--acid); }
.lang-sep { opacity: .35; }
.header-cta {
  font-family: var(--sans); font-size: 12px; font-weight: 400;
  letter-spacing: .1em; text-transform: uppercase; text-decoration: none;
  background: var(--acid); color: var(--ink);
  padding: 12px 20px; border-radius: 100px;
  transition: transform .25s ease;
}
.header-cta:hover { transform: translateY(-2px); }
.menu-toggle {
  display: none; background: none; border: 1px solid currentColor;
  color: inherit; width: 46px; height: 46px; border-radius: 50%;
  cursor: pointer; padding: 12px;
}
.menu-toggle svg { width: 100%; height: 100%; }

.mobile-nav {
  position: fixed; inset: 0; z-index: 99;
  background: var(--ink); color: var(--paper);
  display: flex; flex-direction: column; justify-content: center; gap: 8px;
  padding: 90px 8vw;
  opacity: 0; visibility: hidden; transition: opacity .3s ease, visibility .3s;
}
.mobile-nav.open { opacity: 1; visibility: visible; }
.mobile-nav a {
  font-family: var(--sans); font-weight: 400; font-size: clamp(30px, 8vw, 44px);
  letter-spacing: -.03em; text-decoration: none; padding: 10px 0;
  border-bottom: 1px solid rgba(250, 248, 241, .15);
}
.mobile-nav a:last-child { color: var(--acid); }

/* ── Hero: la experiencia real (vídeo vertical real) ─────────
   Tarjeta editorial vertical sobre navy: el material ya contiene
   el teléfono físico y el comercio, así que no se usa marco de
   dispositivo (evita el efecto teléfono-dentro-de-teléfono).  */
.hero-real {
  position: relative; background: var(--ink); color: var(--paper);
  overflow: hidden;
}
.hero-real::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .12;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
}
.hero-real-inner {
  position: relative; z-index: 2;
  display: grid; grid-template-columns: 1.08fr .92fr;
  gap: clamp(30px, 4.5vw, 70px); align-items: center;
  min-height: 100vh; min-height: 100svh;
  padding-top: 130px; padding-bottom: 76px;
}
.hero-real-copy .tag { color: var(--acid); margin-bottom: 26px; }
.hero-title {
  font-family: var(--sans); font-weight: 400;
  font-size: clamp(52px, 6.8vw, 112px);
  line-height: .84; letter-spacing: -.055em;
  max-width: 11ch;
}
.hero-title em { font-family: var(--serif); font-weight: 400; font-style: italic; color: var(--acid); letter-spacing: -.02em; }
.hero-real-sub {
  display: flex; align-items: flex-end; gap: clamp(26px, 3vw, 44px);
  margin-top: clamp(34px, 4vw, 48px);
}
.hero-real-sub p { max-width: 380px; font-size: 16px; line-height: 1.55; color: rgba(250, 248, 241, .88); }
.hero-meta {
  display: block; margin-top: clamp(36px, 4vw, 52px);
  font-size: 10px; letter-spacing: .2em; text-transform: uppercase; opacity: .7;
}

.hero-real-stage { position: relative; justify-self: center; will-change: transform; }
.hero-glow {
  position: absolute; inset: -10% -26%;
  background: radial-gradient(ellipse at 50% 42%, rgba(220, 233, 75, .30), transparent 62%);
  pointer-events: none;
}
.vcard {
  position: relative; margin: 0;
  width: clamp(250px, 23.5vw, 336px); aspect-ratio: 406 / 720;
  border-radius: 30px; overflow: hidden;
  border: 1px solid rgba(250, 248, 241, .16);
  box-shadow: 0 50px 110px rgba(0, 0, 0, .55);
  background: #0a1826;
}
.vcard::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(16, 35, 59, .35), inset 0 -90px 120px -60px rgba(10, 24, 38, .45);
}
.vcard-media, .vcard .rp-frame {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; display: block;
}
.vcard-play {
  position: absolute; left: 50%; bottom: 26px; transform: translateX(-50%); z-index: 4;
  border: 0; cursor: pointer; white-space: nowrap;
  background: var(--acid); color: var(--ink);
  font-family: var(--sans); font-size: 12px; font-weight: 400; letter-spacing: .08em; text-transform: uppercase;
  padding: 15px 22px; border-radius: 100px;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .4);
}
.hero-badge {
  position: absolute; top: 8px; left: -14px; z-index: 5;
  font-size: 9px; font-weight: 400; letter-spacing: .14em; text-transform: uppercase;
  color: var(--acid); border: 1px solid rgba(220, 233, 75, .65);
  background: rgba(16, 35, 59, .82); backdrop-filter: blur(6px);
  padding: 9px 13px; border-radius: 100px;
}
.hero-chip {
  position: absolute; right: -8px; bottom: 34px; z-index: 5;
  background: var(--acid); color: var(--ink);
  font-size: 10.5px; font-weight: 400; letter-spacing: .03em;
  padding: 12px 15px; border-radius: 14px;
  transform: rotate(-3deg);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .38);
  max-width: 190px; line-height: 1.35;
}
.hero-chip strong { display: block; font-family: var(--sans); font-weight: 400; font-size: 19px; letter-spacing: -.02em; }
.hero-scrollhint {
  position: absolute; left: 50%; bottom: 22px; transform: translateX(-50%); z-index: 3;
  font-size: 10px; letter-spacing: .22em; text-transform: uppercase; opacity: .65;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
}
.hero-scrollhint::after { content: ""; width: 1px; height: 30px; background: currentColor; }

/* ── Escena 2 · El recorrido con fotogramas reales ─────────── */
.recorrido {
  background: var(--ink); color: var(--paper);
  padding: clamp(80px, 9vw, 120px) var(--pad) clamp(90px, 10vw, 130px);
  border-top: 1px solid rgba(250, 248, 241, .12);
}
.recorrido .tag { color: var(--acid); }
.recorrido-title {
  font-family: var(--sans); font-weight: 400;
  font-size: clamp(46px, 6.2vw, 100px); line-height: .86; letter-spacing: -.055em;
  margin: 24px 0 26px; max-width: 14ch;
}
.recorrido-title em { font-family: var(--serif); font-weight: 400; font-style: italic; color: var(--acid); letter-spacing: -.02em; }
.recorrido-intro { max-width: 480px; font-size: 16px; color: rgba(250, 248, 241, .85); margin-bottom: clamp(50px, 6vw, 80px); }
.recorrido-grid {
  display: grid; grid-template-columns: .9fr 1.1fr;
  gap: clamp(40px, 6vw, 100px); align-items: start;
}
.recorrido-stage { position: sticky; top: 104px; }
.vcard-small { width: clamp(230px, 21vw, 300px); margin: 0 auto; }
.rp-frame { opacity: 0; transition: opacity .55s ease; }
.rp-frame.active { opacity: 1; }
.rp-dots { display: flex; gap: 10px; justify-content: center; margin-top: 22px; }
.rp-dots span { width: 34px; height: 2px; background: rgba(250, 248, 241, .28); transition: background .3s; }
.rp-dots span.on { background: var(--acid); }

.rsteps { list-style: none; }
.rstep {
  padding: clamp(30px, 4vw, 46px) 0 clamp(44px, 5vw, 64px);
  border-top: 1px solid rgba(250, 248, 241, .22);
}
.rstep:last-child { border-bottom: 1px solid rgba(250, 248, 241, .22); }
.rstep-frame { display: none; }
.vstep-num {
  font-family: var(--serif); font-style: italic; font-weight: 400;
  font-size: clamp(76px, 8.6vw, 132px); line-height: .72; color: var(--acid); display: block;
}
.rstep h3 {
  font-family: var(--sans); font-weight: 400; letter-spacing: -.045em;
  font-size: clamp(36px, 4.6vw, 66px); line-height: .95; margin: 24px 0 12px;
}
.rstep p { font-size: 16px; max-width: 420px; color: rgba(250, 248, 241, .85); }

/* CTA circular (hero y cierre) */
.round-cta {
  flex: 0 0 auto; width: 148px; height: 148px; border-radius: 50%;
  background: var(--acid); color: var(--ink);
  display: grid; place-items: center; text-align: center;
  font-family: var(--sans); font-size: 13px; font-weight: 400;
  letter-spacing: .04em; text-decoration: none; line-height: 1.3;
  transform: rotate(-8deg);
  transition: transform .3s ease;
}
.round-cta:hover, .round-cta:focus-visible { transform: rotate(-2deg) scale(1.05); }


/* ── Piloto ciudad ─────────────────────────────────────────── */
.r-citypilot { background: var(--acid); color: var(--ink); padding: clamp(90px, 11vw, 150px) var(--pad); }
.citypilot-head { display: grid; grid-template-columns: .72fr 1.55fr; gap: clamp(28px, 5vw, 72px); align-items: end; }
.r-citypilot .tag { align-self: start; }
.r-citypilot h2 { font-family: var(--sans); font-weight: 400; font-size: clamp(48px, 7.4vw, 118px); line-height: .84; letter-spacing: -.055em; }
.r-citypilot h2 .serif { color: var(--terra); }
.citypilot-lead { grid-column: 2; max-width: 760px; font-size: clamp(18px, 2vw, 25px); line-height: 1.42; margin-top: 8px; }
.citypilot-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(20px, 3vw, 42px); margin-top: clamp(58px, 8vw, 92px); }
.citypilot-grid article { border-top: 1.5px solid var(--ink); padding-top: 18px; }
.citypilot-grid .cpn { font-family: var(--serif); font-style: italic; color: var(--terra); font-size: 15px; }
.citypilot-grid h3 { font-family: var(--sans); font-weight: 400; letter-spacing: -.025em; font-size: clamp(19px, 1.8vw, 24px); margin: 12px 0 10px; }
.citypilot-grid p { font-size: 14px; line-height: 1.58; color: rgba(16,35,59,.82); }
.citypilot-roles { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1.5px solid var(--ink); border-bottom: 1.5px solid var(--ink); margin-top: clamp(52px, 7vw, 78px); }
.citypilot-roles div { padding: 24px 22px; border-right: 1px solid rgba(16,35,59,.3); }
.citypilot-roles div:last-child { border-right: 0; }
.citypilot-roles strong,.citypilot-roles span { display: block; }
.citypilot-roles strong { font-family: var(--sans); font-size: 14px; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 8px; }
.citypilot-roles span { font-size: 13.5px; line-height: 1.45; }
.citypilot-cta { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 38px; }
.citypilot-cta p { font-family: var(--sans); font-weight: 400; font-size: clamp(22px, 3vw, 38px); letter-spacing: -.03em; max-width: 720px; }
.route-dark { border-color: var(--ink); flex: 0 0 auto; }
.route-dark:hover,.route-dark:focus-visible { background: var(--ink); border-color: var(--ink); color: var(--acid); }
.public-value { max-width: 840px; margin-top: clamp(38px, 5vw, 60px); border-left: 5px solid var(--terra); padding: 4px 0 4px 22px; }
.public-value p { font-size: clamp(17px, 1.7vw, 22px); line-height: 1.5; }
.signup-intro { max-width: 760px; font-size: clamp(16px, 1.6vw, 20px); line-height: 1.5; color: var(--ink-soft); margin: -22px 0 clamp(44px, 6vw, 68px); }

/* ── Puente editorial ───────────────────────────────────────── */
.r-bridge {
  position: relative; background: var(--paper); overflow: hidden;
  padding: clamp(90px, 12vw, 150px) var(--pad) clamp(80px, 9vw, 120px);
}
.r-bridge-title {
  font-family: var(--sans); font-weight: 400;
  font-size: clamp(52px, 8.2vw, 132px); line-height: .84; letter-spacing: -.055em;
  max-width: 1050px;
}
.r-bridge-title .serif { color: var(--terra); }
.r-bridge-body {
  margin: clamp(50px, 6vw, 80px) 0 0 min(52%, 620px);
  max-width: 520px; font-size: clamp(19px, 2vw, 24px); line-height: 1.4;
}

/* ── Panel de impacto ───────────────────────────────────────── */
.r-impact { background: var(--paper); padding: clamp(90px, 11vw, 150px) var(--pad); }
.r-impact-head { display: grid; grid-template-columns: minmax(180px, .8fr) 2fr; gap: 40px; align-items: end; }
.r-impact h2 {
  font-family: var(--sans); font-weight: 400;
  font-size: clamp(50px, 7.6vw, 122px); line-height: .84; letter-spacing: -.055em;
}
.r-impact h2 .serif { color: var(--terra); }
.equation {
  margin-top: clamp(50px, 7vw, 90px);
  border-top: 1.5px solid var(--ink); border-bottom: 1.5px solid var(--ink);
  display: grid; grid-template-columns: 1fr auto 1fr auto 1fr;
  align-items: center; gap: 12px;
  padding: clamp(26px, 4vw, 48px) 0;
}
.equation .big { font-family: var(--sans); font-weight: 400; letter-spacing: -.045em; font-size: clamp(40px, 6.4vw, 104px); line-height: 1; }
.equation .op { font-family: var(--serif); font-style: italic; font-size: clamp(30px, 4vw, 60px); color: var(--ink-soft); text-align: center; }
.equation .result { color: var(--terra); }
.equation .lbl { display: block; font-family: var(--body); font-weight: 400; font-size: 12px; letter-spacing: .04em; color: var(--ink-soft); margin-top: 10px; }
.impact-notes { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 5vw, 60px); margin-top: clamp(36px, 5vw, 56px); }
.impact-notes h3 { font-family: var(--sans); font-size: 19px; font-weight: 400; letter-spacing: -.02em; margin-bottom: 12px; }
.impact-notes p, .impact-notes li { font-size: 14.5px; line-height: 1.65; color: var(--ink-soft); }
.impact-notes ul { list-style: none; }
.impact-notes li strong { color: var(--ink); }
.impact-math { margin-top: 10px; font-family: ui-monospace, monospace; font-size: 13px !important; }
.legal-pill {
  display: inline-block; border: 1.5px solid var(--ink); border-radius: 100px;
  padding: 13px 18px; margin-top: 18px;
  font-size: 12px; font-weight: 400; line-height: 1.4; color: var(--ink);
}
.impact-note {
  margin-top: clamp(30px, 4vw, 44px); max-width: 760px;
  font-size: 12.5px; line-height: 1.6; color: var(--ink-soft);
}
.impact-photo { margin-top: clamp(50px, 7vw, 90px); position: relative; }
.impact-photo img { width: 100%; height: clamp(340px, 48vw, 580px); object-fit: cover; filter: saturate(.78); }
.impact-photo figcaption {
  position: absolute; right: 0; bottom: 0;
  background: var(--paper); padding: 12px 16px;
  font-size: 10px; letter-spacing: .1em; text-transform: uppercase;
}
.placeholder-mark { outline: 2px dashed var(--terra); outline-offset: -10px; }
.placeholder-tag {
  position: absolute; top: 14px; left: 14px; z-index: 3;
  background: var(--acid); color: var(--ink);
  font-size: 8.5px; font-weight: 400; letter-spacing: .1em; text-transform: uppercase;
  padding: 7px 9px;
}

/* ── Voces ──────────────────────────────────────────────────── */
.r-voices { background: var(--terra); color: var(--paper); padding: clamp(90px, 11vw, 140px) var(--pad); }
.r-voices-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 30px; margin-bottom: clamp(46px, 6vw, 75px); }
.r-voices h2 { font-family: var(--sans); font-weight: 400; font-size: clamp(48px, 7.4vw, 120px); line-height: .84; letter-spacing: -.055em; }
.r-voices h2 .serif { color: var(--acid); }
.r-voices-note { max-width: 300px; font-size: 13px; line-height: 1.55; opacity: .85; }
.r-voices-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: clamp(18px, 2.4vw, 28px); }
.voice { position: relative; border-top: 1px solid rgba(250, 248, 241, .55); padding-top: 22px; }
.voice img { width: 100%; height: clamp(240px, 26vw, 330px); object-fit: cover; filter: grayscale(.25) saturate(.68); }
.voice blockquote { font-family: var(--serif); font-style: italic; font-size: clamp(24px, 2.4vw, 31px); line-height: 1.12; margin: 26px 0 18px; }
.voice cite { font-style: normal; font-size: 11px; letter-spacing: .13em; text-transform: uppercase; opacity: .9; }

/* ── FAQ editorial ──────────────────────────────────────────── */
.r-faq { background: var(--cream); padding: clamp(90px, 11vw, 140px) var(--pad); }
.r-faq-grid { display: grid; grid-template-columns: .85fr 1.3fr; gap: clamp(40px, 7vw, 110px); align-items: start; }
.r-faq-head { position: sticky; top: 110px; }
.r-faq-head .tag { margin-bottom: 22px; }
.r-faq h2 { font-family: var(--sans); font-weight: 400; font-size: clamp(46px, 6.4vw, 104px); line-height: .85; letter-spacing: -.05em; margin-bottom: 24px; }
.r-faq h2 .serif { color: var(--terra); }
.r-faq-head > p { max-width: 400px; font-size: 15px; color: var(--ink-soft); }
.faq-stats { display: flex; gap: clamp(24px, 3.4vw, 46px); margin-top: clamp(40px, 5vw, 64px); }
.faq-stats div { border-top: 1.5px solid var(--ink); padding-top: 12px; }
.faq-stats dt { white-space: nowrap; font-family: var(--sans); font-weight: 400; font-size: clamp(20px, 2.2vw, 27px); letter-spacing: -.02em; }
.faq-stats dd { font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-soft); margin-top: 4px; }
.r-faq-list details { border-top: 1px solid var(--line); }
.r-faq-list details:last-child { border-bottom: 1px solid var(--line); }
.r-faq-list summary {
  list-style: none; cursor: pointer;
  display: grid; grid-template-columns: 56px 1fr 34px; align-items: baseline; gap: 12px;
  padding: 26px 0;
  font-family: var(--sans); font-weight: 400; letter-spacing: -.02em;
  font-size: clamp(19px, 2vw, 25px);
}
.r-faq-list summary::-webkit-details-marker { display: none; }
.r-faq-list summary .faq-n { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 15px; color: var(--terra); }
.r-faq-list summary .plus { font-size: 24px; font-weight: 400; text-align: right; transition: transform .25s ease; }
.r-faq-list details[open] summary .plus { transform: rotate(45deg); }
.r-faq-list .answer { position: relative; padding: 0 0 30px 68px; max-width: 520px; font-size: 14.5px; color: var(--ink-soft); }
.r-faq-list .answer .wm {
  position: absolute; right: -10px; bottom: -30px; z-index: 0;
  font-family: var(--serif); font-style: italic; font-size: 150px; line-height: 1;
  color: rgba(16, 35, 59, .06); pointer-events: none;
}

/* ── Cierre monumental ──────────────────────────────────────── */
.r-close {
  position: relative; overflow: hidden;
  background: var(--ink); color: var(--paper);
  padding: clamp(80px, 9vw, 110px) var(--pad) clamp(70px, 8vw, 100px);
  min-height: 92vh; display: flex; flex-direction: column; justify-content: space-between;
}
.r-close-bg {
  position: absolute; inset: 0;
  background: var(--close-img) center / cover no-repeat;
  opacity: .68; filter: saturate(.9) brightness(.98);
}
.r-close::after {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(circle at 72% 26%, rgba(188, 79, 50, .3), transparent 46%),
              linear-gradient(0deg, rgba(16, 35, 59, .72) 0%, rgba(16, 35, 59, .25) 45%, rgba(16, 35, 59, .35) 100%);
}
.r-close > *:not(.r-close-bg) { position: relative; z-index: 2; }
.r-close .tag { color: var(--acid); }
.r-close h2 {
  font-family: var(--sans); font-weight: 400;
  font-size: clamp(72px, 13.5vw, 210px); line-height: .78; letter-spacing: -.06em;
  margin: clamp(60px, 12vh, 140px) 0 clamp(40px, 6vw, 60px);
}
.r-close h2 .serif { color: var(--acid); }
.r-close-bottom { display: flex; align-items: center; justify-content: space-between; gap: 30px; flex-wrap: wrap; }
.r-close-bottom p { max-width: 380px; font-size: 15.5px; color: rgba(250, 248, 241, .88); }
.routes { display: flex; gap: 12px; flex-wrap: wrap; }
.route {
  border: 1.5px solid rgba(250, 248, 241, .8); border-radius: 100px;
  padding: 17px 24px; font-family: var(--sans); font-size: 12.5px; font-weight: 400;
  letter-spacing: .08em; text-transform: uppercase; text-decoration: none;
  transition: background .25s ease, color .25s ease;
}
.route:hover, .route:focus-visible { background: var(--acid); border-color: var(--acid); color: var(--ink); }

/* ── Perfiles + formulario ──────────────────────────────────── */
.r-signup { background: var(--paper); border-top: 1px solid var(--line); padding: clamp(80px, 10vw, 130px) var(--pad); }
.r-signup .tag { margin-bottom: 22px; }
.r-signup h2 { font-family: var(--sans); font-weight: 400; font-size: clamp(44px, 7vw, 108px); line-height: .85; letter-spacing: -.05em; margin-bottom: clamp(36px, 5vw, 56px); }
.r-signup h2 .serif { color: var(--terra); }
.r-profiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(18px, 3vw, 40px); margin-bottom: clamp(50px, 7vw, 80px); }
.r-profile { border-top: 1.5px solid var(--ink); padding-top: 18px; }
.r-profile .pn { font-family: var(--serif); font-style: italic; font-size: 15px; color: var(--terra); }
.r-profile h3 { font-family: var(--sans); font-weight: 400; letter-spacing: -.03em; font-size: clamp(19px, 1.8vw, 24px); margin: 10px 0 8px; }
.r-profile p { font-size: 13.5px; color: var(--ink-soft); margin-bottom: 14px; }
.link-arrow {
  font-family: var(--sans); font-size: 12px; font-weight: 400;
  letter-spacing: .1em; text-transform: uppercase; text-decoration: none;
  color: var(--terra); display: inline-flex; align-items: center; gap: 8px;
}
.link-arrow::after { content: "→"; transition: transform .25s ease; }
.link-arrow:hover::after { transform: translateX(5px); }

.signup-form { display: grid; grid-template-columns: 1.3fr 1fr auto; gap: clamp(22px, 3vw, 36px); align-items: end; max-width: 1180px; }
.form-group label {
  display: block; font-size: 10.5px; font-weight: 400; letter-spacing: .13em;
  text-transform: uppercase; color: var(--ink-soft); margin-bottom: 10px;
}
.form-group input, .form-group select {
  width: 100%; border: 0; border-bottom: 1.5px solid var(--ink);
  background: transparent; padding: 13px 2px;
  font-family: var(--body); font-size: 18px; color: var(--ink);
  border-radius: 0; appearance: none; -webkit-appearance: none;
}
.form-group select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%2310233B' stroke-width='2' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 4px center;
}
.form-group input:focus, .form-group select:focus { outline: none; border-bottom-color: var(--terra); }
.form-error { display: none; color: #9E3B22; font-size: 12.5px; margin-top: 8px; }
.form-group.has-error input, .form-group.has-error select { border-bottom-color: #9E3B22; }
.checkbox-group { display: flex; align-items: flex-start; gap: 10px; grid-column: 1 / -2; font-size: 13.5px; color: var(--ink-soft); }
.checkbox-group input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--terra); }
.checkbox-group a { color: var(--ink); }
.btn-submit {
  border: 0; cursor: pointer;
  background: var(--terra); color: #fff;
  font-family: var(--sans); font-weight: 400; font-size: 14px; letter-spacing: .08em; text-transform: uppercase;
  border-radius: 100px; padding: 21px 38px;
  transition: transform .25s ease, background .25s ease;
}
.btn-submit:hover { transform: translateY(-2px); background: #A8431F; }
.btn-submit:disabled { opacity: .6; cursor: wait; transform: none; }
.form-status { display: none; grid-column: 1 / -1; margin-top: 18px; font-size: 14.5px; padding: 14px 18px; border-radius: 8px; }
.form-status.error { background: rgba(188, 79, 50, .1); color: #7E3018; border: 1px solid rgba(188, 79, 50, .35); }
.signup-legal { margin-top: 26px; font-size: 11.5px; color: var(--ink-soft); max-width: 660px; }
.signup-legal a { color: inherit; }

/* ── Footer ─────────────────────────────────────────────────── */
.site-footer { background: var(--paper); border-top: 1px solid var(--line); padding: 34px var(--pad); }
.footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.footer-logo img { height: 34px; width: auto; }
.footer-links { display: flex; gap: 22px; font-size: 12px; }
.footer-links a { text-decoration: none; color: var(--ink-soft); }
.footer-links a:hover { color: var(--terra); }
.footer-copy { font-size: 11px; color: var(--ink-soft); }

/* ── Reveals (script.js añade .visible) ─────────────────────── */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .5s ease, transform .55s ease; }
.reveal.visible { opacity: 1; transform: none; }

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 1060px) {
  .header-nav { display: none; }
  .r-faq-grid { grid-template-columns: 1fr; }
  .citypilot-head { grid-template-columns: 1fr; }
  .citypilot-lead { grid-column: 1; }
  .citypilot-grid { grid-template-columns: repeat(2, 1fr); }
  .r-faq-head { position: static; }
}
@media (max-width: 760px) {
  .header-cta { display: none; }
  .menu-toggle { display: block; }
  .header-logo img { height: 36px; }
  .site-header { inset: 12px 0 auto 0; }
  .hero-real-inner { grid-template-columns: 1fr; min-height: 0; padding-top: 118px; gap: 54px; }
  .hero-title { font-size: clamp(46px, 13.5vw, 68px); }
  .hero-real-sub { flex-direction: column; align-items: flex-start; gap: 26px; margin-top: 28px; }
  .hero-real-sub p { font-size: 14px; max-width: 300px; }
  .hero-meta { margin-top: 30px; }
  .hero-scrollhint { display: none; }
  .round-cta { width: 104px; height: 104px; font-size: 10.5px; }
  .vcard { width: min(74vw, 300px); }
  .hero-badge { left: -6px; }
  .hero-chip { right: -4px; bottom: 22px; max-width: 158px; font-size: 9.5px; }
  .hero-chip strong { font-size: 16px; }
  .recorrido-grid { grid-template-columns: 1fr; gap: 0; }
  .recorrido-stage { display: none; }
  .rstep-frame {
    display: block; width: min(64vw, 250px); height: auto; aspect-ratio: 406 / 720;
    object-fit: cover; border-radius: 22px; margin-bottom: 30px;
    border: 1px solid rgba(250, 248, 241, .16);
  }
  .rstep h3 { font-size: clamp(32px, 9vw, 42px); }
  .rstep p { font-size: 14px; max-width: 300px; }
  .vstep-num { font-size: clamp(64px, 17vw, 88px); }
  .r-bridge-body { margin-left: 12%; font-size: 18px; }
  .citypilot-grid, .citypilot-roles { grid-template-columns: 1fr; }
  .citypilot-roles div { border-right: 0; border-bottom: 1px solid rgba(16,35,59,.3); padding-left: 0; }
  .citypilot-roles div:last-child { border-bottom: 0; }
  .citypilot-cta { flex-direction: column; align-items: flex-start; }
  .citypilot-head h2 { font-size: clamp(46px, 13vw, 70px); }
  .r-impact-head { grid-template-columns: 1fr; gap: 22px; align-items: start; }
  .equation { grid-template-columns: 1fr auto 1fr; row-gap: 8px; }
  .equation .eq-eq { display: none; }
  .equation .result { grid-column: 3; }
  .impact-notes { grid-template-columns: 1fr; }
  .r-voices-head { flex-direction: column; align-items: flex-start; }
  .r-voices-grid { grid-template-columns: 1fr; }
  .r-close { min-height: 0; }
  .r-close h2 { font-size: clamp(58px, 17vw, 92px); }
  .r-close-bottom { flex-direction: column; align-items: flex-start; }
  .r-profiles { grid-template-columns: 1fr; }
  .signup-form { grid-template-columns: 1fr; }
  .checkbox-group { grid-column: 1 / -1; }
  .btn-submit { width: 100%; }
  .footer-inner { flex-direction: column; align-items: flex-start; }
}

/* ── Movimiento reducido ────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

/* ── Toggle claro/oscuro (restaurado en R03) ──────────────────
   El header vive siempre sobre escenas navy (texto paper), así
   que el botón es visible en ambos temas sin variantes.        */
.theme-toggle {
  display: grid; place-items: center;
  width: 46px; height: 46px; border-radius: 50%;
  border: 1px solid rgba(250, 248, 241, .55);
  background: none; color: inherit; cursor: pointer; padding: 0;
  transition: transform .25s ease, border-color .25s ease;
}
.theme-toggle:hover, .theme-toggle:focus-visible { transform: translateY(-2px); border-color: var(--acid); }
.theme-toggle svg { width: 20px; height: 20px; }
.theme-toggle .icon-sun { display: none; }
.dark-theme .theme-toggle .icon-sun { display: block; }
.dark-theme .theme-toggle .icon-moon { display: none; }

/* ── Tema oscuro (R03) ────────────────────────────────────────
   Las escenas ya oscuras del sistema (hero real, recorrido,
   banda lima del proceso, voces terracota, cierre monumental)
   se mantienen. Se invierten las secciones claras: puente,
   impacto, FAQ, perfiles+formulario y footer.                 */
.dark-theme { --ink-soft: rgba(242, 239, 229, .74); --line: rgba(242, 239, 229, .26); }
.dark-theme body { background: #0C1B2E; color: var(--paper); }

.dark-theme .r-citypilot { background: #B8C92F; color: #08192F; }
.dark-theme .r-citypilot .citypilot-grid p { color: rgba(8,25,47,.84); }
.dark-theme .r-citypilot h2 .serif { color: #8E341F; }
.dark-theme .r-bridge { background: #0C1B2E; }
.dark-theme .r-impact { background: #13263E; }
.dark-theme .r-faq { background: #0C1B2E; }
.dark-theme .r-signup, .dark-theme .site-footer { background: #13263E; }

.dark-theme .r-bridge-title .serif,
.dark-theme .r-impact h2 .serif,
.dark-theme .r-faq h2 .serif,
.dark-theme .r-signup h2 .serif { color: #E09478; }

.dark-theme .equation { border-top-color: rgba(250, 248, 241, .85); border-bottom-color: rgba(250, 248, 241, .85); }
.dark-theme .impact-notes li strong { color: var(--paper); }
.dark-theme .legal-pill { border-color: rgba(250, 248, 241, .85); color: var(--paper); }
.dark-theme .impact-photo figcaption { background: #0C1B2E; }
.dark-theme .link-arrow { color: #E09478; }
.dark-theme .faq-stats div { border-top-color: rgba(250, 248, 241, .85); }
.dark-theme .r-faq-list summary .faq-n { color: #E09478; }
.dark-theme .r-faq-list .answer .wm { color: rgba(250, 248, 241, .08); }
.dark-theme .r-profile { border-top-color: rgba(250, 248, 241, .85); }
.dark-theme .r-profile .pn { color: #E09478; }
.dark-theme .form-group input, .dark-theme .form-group select { border-bottom-color: rgba(250, 248, 241, .85); color: var(--paper); }
.dark-theme .form-group select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%23F2EFE5' stroke-width='2' fill='none'/%3E%3C/svg%3E");
}
.dark-theme .form-group select option { color: #10233B; }
.dark-theme .checkbox-group a { color: var(--paper); }
.dark-theme .form-status.error { background: rgba(188, 79, 50, .18); color: #F0B4A0; border-color: rgba(188, 79, 50, .45); }

/* v4: fondo del cierre en WebP con fallback JPG (navegadores sin image-set conservan --close-img) */
.r-close-bg {
  background-image: image-set(url('assets/radical/mercado.webp') type('image/webp'), url('assets/radical/mercado.jpg') type('image/jpeg'));
}

/* ═══ V7 · TEMA DETERMINISTA + FORMULARIO COMPACTO ═══════════ */
html { color-scheme: light; background: var(--cream); }
html.dark-theme { color-scheme: dark; background: #0C1B2E; }
html.light-theme body { background: var(--cream); color: var(--ink); }
html.dark-theme body { background: #0C1B2E; color: var(--paper); }

/* El hero y las escenas de marca conservan su identidad en ambos modos.
   Las escenas editoriales sí cambian, con contraste completo. */
.light-theme .r-bridge,
.light-theme .r-impact,
.light-theme .r-faq,
.light-theme .r-contact,
.light-theme .site-footer { background: var(--paper); color: var(--ink); }
.dark-theme .r-bridge,
.dark-theme .r-faq { background: #0C1B2E; color: var(--paper); }
.dark-theme .r-impact,
.dark-theme .r-contact,
.dark-theme .site-footer { background: #13263E; color: var(--paper); }
.light-theme .form-group input,
.light-theme .form-group textarea { color: var(--ink); border-color: var(--ink); }
.dark-theme .form-group input,
.dark-theme .form-group textarea { color: var(--paper); border-color: rgba(250,248,241,.82); }
.dark-theme .form-group input::placeholder,
.dark-theme .form-group textarea::placeholder { color: rgba(250,248,241,.45); }
.dark-theme .contact-copy p,
.dark-theme .form-service-note { color: rgba(250,248,241,.72); }
.dark-theme .contact-email,
.dark-theme .checkbox-group a { color: var(--paper); }
.dark-theme .r-contact h2 .serif { color: #E09478; }

.r-contact { border-top: 1px solid var(--line); padding: clamp(80px, 10vw, 130px) var(--pad); transition: background-color .28s ease, color .28s ease; }
.contact-grid { display: grid; grid-template-columns: minmax(0,.82fr) minmax(420px,1fr); gap: clamp(50px, 8vw, 120px); align-items: start; }
.contact-copy { position: sticky; top: 120px; }
.contact-copy .tag { margin-bottom: 24px; }
.r-contact h2 { font-family: var(--sans); font-weight: 400; font-size: clamp(46px, 6.8vw, 98px); line-height: .86; letter-spacing: -.055em; }
.r-contact h2 .serif { color: var(--terra); }
.contact-copy > p { max-width: 580px; margin-top: 32px; font-size: clamp(16px,1.45vw,20px); line-height: 1.55; color: var(--ink-soft); }
.contact-email { display: inline-block; margin-top: 28px; font-family: var(--sans); font-size: 14px; font-weight: 400; letter-spacing: .06em; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.contact-form { border: 1px solid var(--line); padding: clamp(26px,4vw,48px); display: grid; grid-template-columns: 1fr 1fr; gap: 26px 24px; background: rgba(255,255,255,.035); }
.contact-form .form-group:nth-of-type(1),
.contact-form .form-group:nth-of-type(4),
.contact-form .checkbox-group,
.contact-form .btn-submit,
.contact-form .form-service-note { grid-column: 1 / -1; }
.form-group label span { font-weight: 400; letter-spacing: normal; text-transform: none; opacity: .7; }
.form-group textarea { width: 100%; resize: vertical; min-height: 110px; border: 0; border-bottom: 1.5px solid var(--ink); background: transparent; padding: 13px 2px; font-family: var(--body); font-size: 17px; border-radius: 0; }
.form-group textarea:focus { outline: none; border-bottom-color: var(--terra); }
.contact-form .checkbox-group { margin-top: 2px; }
.contact-form .btn-submit { justify-self: start; min-width: 220px; }
.form-service-note { margin: -8px 0 0; font-size: 11.5px; line-height: 1.55; color: var(--ink-soft); max-width: 620px; }
.form-service-note a { color: inherit; }
.form-honey { position: absolute!important; left: -9999px!important; width: 1px!important; height: 1px!important; opacity: 0!important; pointer-events: none!important; }

@media (max-width: 960px) {
  .contact-grid { grid-template-columns: 1fr; }
  .contact-copy { position: static; }
}
@media (max-width: 600px) {
  .contact-form { grid-template-columns: 1fr; padding: 24px 20px; }
  .contact-form .form-group { grid-column: 1; }
  .contact-form .btn-submit { width: 100%; }
  .r-contact h2 { font-size: clamp(43px, 13vw, 62px); }
}

/* ═══ V8 · DOS PALETAS COMPLETAS ═══════════════════════════════
   El tema deja de ser parcial: todas las escenas reaccionan.   */
:root {
  --light-canvas: #F3F0E7;
  --light-surface: #FAF8F1;
  --light-lime-wash: #EDF1C8;
  --light-coral: #C96950;
  --dark-canvas: #071727;
  --dark-surface: #10263A;
  --dark-lime: #C5D63B;
  --dark-coral: #763727;
}

/* Cabecera y navegación */
html.light-theme .header-inner { color: var(--ink); }
html.light-theme .site-header.scrolled .header-inner {
  background: rgba(250,248,241,.94); color: var(--ink);
  box-shadow: 0 18px 50px rgba(16,35,59,.14);
}
html.light-theme .theme-toggle { border-color: rgba(16,35,59,.45); color: var(--ink); }
html.light-theme .mobile-nav { background: var(--light-surface); color: var(--ink); }
html.light-theme .mobile-nav a { border-bottom-color: rgba(16,35,59,.15); }
html.light-theme .mobile-nav a:last-child { color: var(--terra); }
html.dark-theme .header-inner { color: var(--paper); }
html.dark-theme .site-header.scrolled .header-inner { background: rgba(7,23,39,.94); }
html.dark-theme .mobile-nav { background: var(--dark-canvas); color: var(--paper); }

/* Hero */
html.light-theme .hero-real { background: var(--light-canvas); color: var(--ink); }
html.light-theme .hero-real::after { opacity: .055; mix-blend-mode: multiply; }
html.light-theme .hero-real-copy .tag,
html.light-theme .hero-title em { color: var(--terra); }
html.light-theme .hero-real-sub p { color: rgba(16,35,59,.78); }
html.light-theme .hero-meta,.light-theme .hero-scrollhint { color: rgba(16,35,59,.58); }
html.light-theme .hero-glow { background: radial-gradient(ellipse at 50% 42%, rgba(220,233,75,.58),transparent 62%); }
html.light-theme .hero-badge { color: var(--ink); border-color: rgba(16,35,59,.5); background: rgba(250,248,241,.88); }
html.dark-theme .hero-real { background: var(--dark-canvas); color: var(--paper); }
html.dark-theme .hero-glow { background: radial-gradient(ellipse at 50% 42%,rgba(220,233,75,.20),transparent 62%); }

/* Piloto ciudad */
html.light-theme .r-citypilot { background: var(--acid); color: var(--ink); }
html.light-theme .r-citypilot .citypilot-grid p { color: rgba(16,35,59,.82); }
html.dark-theme .r-citypilot { background: var(--dark-surface); color: var(--paper); }
html.dark-theme .r-citypilot h2 .serif,
html.dark-theme .citypilot-grid .cpn { color: #F09575; }
html.dark-theme .r-citypilot .citypilot-grid p { color: rgba(250,248,241,.76); }
html.dark-theme .citypilot-grid article,
html.dark-theme .citypilot-roles { border-color: rgba(250,248,241,.7); }
html.dark-theme .citypilot-roles div { border-color: rgba(250,248,241,.22); }
html.dark-theme .route-dark { border-color: var(--paper); color: var(--paper); }
html.dark-theme .route-dark:hover { background: var(--acid); border-color: var(--acid); color: var(--ink); }

/* Recorrido */
html.light-theme .recorrido { background: var(--light-lime-wash); color: var(--ink); }
html.light-theme .recorrido .tag,
html.light-theme .recorrido-title em,
html.light-theme .vstep-num { color: var(--terra); }
html.light-theme .recorrido-intro,
html.light-theme .rstep p { color: rgba(16,35,59,.75); }
html.light-theme .rp-dots span { background: rgba(16,35,59,.20); }
html.light-theme .rp-dots span.on { background: var(--terra); }
html.dark-theme .recorrido { background: #091C30; color: var(--paper); }

/* Puente, impacto y FAQ */
html.light-theme .r-bridge { background: var(--light-surface); color: var(--ink); }
html.dark-theme .r-bridge { background: var(--dark-canvas); color: var(--paper); }
html.light-theme .r-impact { background: #F0EDE3; color: var(--ink); }
html.dark-theme .r-impact { background: var(--dark-surface); color: var(--paper); }
html.dark-theme .impact-photo figcaption { background: var(--dark-surface); }
html.light-theme .r-faq { background: var(--light-canvas); color: var(--ink); }
html.dark-theme .r-faq { background: var(--dark-canvas); color: var(--paper); }

/* Voces */
html.light-theme .r-voices { background: var(--light-coral); color: #FFF9EF; }
html.dark-theme .r-voices { background: var(--dark-coral); color: var(--paper); }
html.dark-theme .r-voices h2 .serif { color: var(--acid); }

/* Cierre fotográfico: misma imagen, tratamiento claramente distinto */
html.light-theme .r-close { background: #D9D6CA; color: var(--ink); }
html.light-theme .r-close-bg { filter: grayscale(.12) brightness(1.25) saturate(.65); opacity: .52; }
html.light-theme .r-close::after {
  background: linear-gradient(90deg,rgba(250,248,241,.94) 0%,rgba(250,248,241,.72) 48%,rgba(250,248,241,.25) 100%);
}
html.light-theme .r-close .tag { color: var(--terra); }
html.light-theme .r-close h2 .serif { color: var(--terra); }
html.light-theme .r-close-bottom p { color: rgba(16,35,59,.82); }
html.light-theme .r-close .route { border-color: var(--ink); color: var(--ink); }
html.light-theme .r-close .route:hover { background: var(--ink); color: var(--paper); }
html.dark-theme .r-close { background: var(--dark-canvas); color: var(--paper); }
html.dark-theme .r-close-bg { filter: brightness(.58) saturate(.75); opacity: .62; }
html.dark-theme .r-close::after { background: linear-gradient(90deg,rgba(7,23,39,.94),rgba(7,23,39,.58) 58%,rgba(7,23,39,.35)); }

/* Formulario y pie */
html.light-theme .r-contact,html.light-theme .site-footer { background: var(--light-surface); color: var(--ink); }
html.dark-theme .r-contact,html.dark-theme .site-footer { background: var(--dark-surface); color: var(--paper); }
html.light-theme .contact-form { background: rgba(255,255,255,.38); }
html.dark-theme .contact-form { background: rgba(0,0,0,.10); }

/* Cambios suaves, excepto para usuarios que reducen movimiento. */
.hero-real,.r-citypilot,.recorrido,.r-bridge,.r-impact,.r-voices,.r-faq,.r-close,.r-contact,.site-footer,.header-inner {
  transition: background-color .3s ease,color .3s ease,border-color .3s ease,filter .3s ease;
}

/* R09 — vertical asociaciones/PAC */
.hero-actions { display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
.hero-assoc-link { color:inherit; font-size:13px; font-weight:400; text-transform:uppercase; letter-spacing:.08em; border-bottom:1px solid currentColor; padding:8px 0; }
.hero-institutional { max-width:520px; margin:22px 0 0; font-size:14px; line-height:1.55; opacity:.76; }
.mission-flow { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; gap:18px; align-items:stretch; margin-top:56px; }
.mission-flow article { border:1px solid currentColor; padding:28px; min-height:210px; display:flex; flex-direction:column; gap:12px; }
.mission-flow article>span { color:var(--terra); font-weight:400; font-size:13px; }
.mission-flow strong { font-family:var(--display); font-size:clamp(22px,2.2vw,34px); line-height:1; }
.mission-flow p { margin:0; line-height:1.55; opacity:.75; }
.mission-arrow { align-self:center; font-size:26px; }
.nonmoney-panel { margin-top:24px; background:var(--ink); color:var(--paper); padding:24px 28px; display:flex; justify-content:space-between; gap:24px; }
.nonmoney-panel span { max-width:630px; opacity:.8; }
.r-associations { padding:clamp(90px,11vw,150px) var(--pad); background:var(--acid); color:var(--ink); }
.assoc-head { display:grid; grid-template-columns:.72fr 1.4fr; column-gap:44px; align-items:end; }
.assoc-head .tag { grid-column:1; }
.assoc-head h2 { grid-column:2; grid-row:1 / span 2; font-size:clamp(48px,7.4vw,112px); line-height:.88; margin:0; }
.assoc-head .serif { color:var(--terra); }
.assoc-head p { grid-column:2; max-width:700px; font-size:18px; line-height:1.55; margin:30px 0 0; }
.assoc-capabilities { display:grid; grid-template-columns:repeat(4,1fr); margin-top:72px; border-top:1px solid currentColor; border-bottom:1px solid currentColor; }
.assoc-capabilities article { padding:28px 24px 34px; border-right:1px solid currentColor; }
.assoc-capabilities article:last-child { border-right:0; }
.assoc-capabilities article>span { color:var(--terra); font-weight:400; }
.assoc-capabilities h3 { font-size:21px; margin:18px 0 12px; }
.assoc-capabilities p { line-height:1.55; opacity:.77; }
.zero-friction { margin-top:48px; padding:42px; background:var(--ink); color:var(--paper); display:grid; grid-template-columns:1.2fr 1fr; gap:48px; }
.zero-friction h3 { font-size:clamp(30px,4vw,56px); line-height:1; margin:16px 0 0; }
.zero-friction ul { margin:0; padding:0; list-style:none; display:grid; }
.zero-friction li { padding:10px 0; border-bottom:1px solid rgba(255,255,255,.24); }
.agent-proposal { display:grid; grid-template-columns:1.25fr .75fr; gap:48px; padding:48px 0; border-bottom:1px solid currentColor; }
.status-pill { display:inline-block; border:1px solid currentColor; border-radius:99px; padding:8px 12px; font-size:11px; font-weight:400; text-transform:uppercase; letter-spacing:.09em; }
.agent-proposal h3 { font-size:clamp(34px,4.8vw,68px); line-height:.95; margin:24px 0 18px; }
.agent-proposal p,.agent-guards p { line-height:1.6; opacity:.75; }
.agent-guards { align-self:end; padding:24px; border:1px solid currentColor; }
.pilot-deliverables { padding:40px 0; }
.pilot-deliverables h3 { font-size:28px; max-width:700px; }
.pilot-deliverables ul { display:flex; flex-wrap:wrap; gap:10px; list-style:none; padding:0; }
.pilot-deliverables li { border:1px solid currentColor; border-radius:99px; padding:10px 14px; }
.assoc-cta { border-top:1px solid currentColor; padding-top:30px; display:flex; justify-content:space-between; gap:24px; align-items:center; }
.assoc-cta div { display:grid; gap:5px; }
.r-contact-assoc { border-top:1px solid var(--line); }
html.dark-theme .r-associations { background:#10243A; color:var(--paper); }
html.dark-theme .r-associations .assoc-head .serif { color:var(--acid); }
html.dark-theme .zero-friction { background:var(--acid); color:var(--ink); }
html.dark-theme .nonmoney-panel { background:var(--acid); color:var(--ink); }
@media(max-width:900px){.assoc-capabilities{grid-template-columns:1fr 1fr}.assoc-capabilities article:nth-child(2){border-right:0}.assoc-capabilities article:nth-child(-n+2){border-bottom:1px solid currentColor}.assoc-head,.zero-friction,.agent-proposal{grid-template-columns:1fr}.assoc-head h2,.assoc-head p,.assoc-head .tag{grid-column:1;grid-row:auto}.mission-flow{grid-template-columns:1fr}.mission-arrow{transform:rotate(90deg);justify-self:center}.nonmoney-panel{flex-direction:column}.assoc-cta{align-items:flex-start;flex-direction:column}}
@media(max-width:560px){.assoc-capabilities{grid-template-columns:1fr}.assoc-capabilities article{border-right:0!important;border-bottom:1px solid currentColor}.assoc-capabilities article:last-child{border-bottom:0}.zero-friction{padding:28px}.agent-proposal{gap:24px}.assoc-head h2{font-size:48px}.mission-flow article{min-height:0}.hero-actions{align-items:flex-start;flex-direction:column;gap:14px}}

/* R09.2 — tipografía alineada con el sistema editorial existente */
.assoc-head h2,
.agent-proposal h3,
.zero-friction h3,
.pilot-deliverables h3,
.mission-flow strong,
.assoc-capabilities h3,
.assoc-cta strong {
  font-family: var(--sans);
  font-weight: 400;
  letter-spacing: -.045em;
}
.assoc-head h2 { line-height: .84; letter-spacing: -.055em; }
.agent-proposal h3 { line-height: .95; letter-spacing: -.05em; }
.assoc-capabilities h3 { letter-spacing: -.025em; }
.assoc-head p,
.assoc-capabilities p,
.agent-proposal p,
.agent-guards p,
.assoc-cta span,
.nonmoney-panel span,
.mission-flow p { font-family: var(--body); font-weight: 400; }
.status-pill,
.agent-guards strong,
.pilot-deliverables li,
.nonmoney-panel strong { font-family: var(--sans); font-weight: 400; }

/* ═══ R09.3 · conversión, resiliencia y accesibilidad ═══ */
[id] { scroll-margin-top: 110px; }
:focus-visible { outline: 3px solid #F5D547; outline-offset: 4px; }
.reveal { opacity: 1; transform: none; }
.motion-ready .reveal.motion-pending { opacity: 0; transform: translateY(22px); }
.motion-ready .reveal.motion-pending.visible { opacity: 1; transform: none; }
.contact-form, .contact-form *, .round-cta, .route, .header-cta { opacity: 1 !important; transform: none; }
.header-nav a, .lang-toggle { min-height: 44px; display: inline-flex; align-items: center; }
.lang-toggle.active { color: #10233B; background: #F5D547; border-radius: 6px; padding: 8px; text-decoration: underline; text-underline-offset: 3px; }
.menu-disclosure { display: none; position: relative; color: var(--paper); }
.menu-disclosure summary { list-style: none; width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; cursor: pointer; font-size: 25px; }
.menu-disclosure summary::-webkit-details-marker { display:none; }
.menu-disclosure[open] .mobile-nav { display: flex; }
.mobile-nav { display:none; opacity:1; visibility:visible; }
.mobile-nav a { min-height: 44px; }
.conversion-actions { align-items:center; flex-wrap:wrap; }
.route-acid { background:var(--acid); color:var(--ink); }
.route-outline { border:1px solid var(--paper); color:var(--paper); }
.citizen-link { color:var(--paper); text-underline-offset:5px; min-height:44px; display:inline-flex; align-items:center; }
.r-entity-selector { padding:70px 0; background:var(--paper); color:var(--ink); }
.r-entity-selector h2 { font-family:var(--sans); font-size:clamp(34px,5vw,68px); line-height:1; margin:28px 0 34px; max-width:900px; }
.entity-options { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.entity-card { padding:30px; border:2px solid var(--ink); text-decoration:none; min-height:160px; display:flex; flex-direction:column; justify-content:space-between; }
.entity-card strong { font-family:var(--sans); font-size:clamp(26px,3vw,42px); }
.citizen-explainer { display:inline-flex; margin-top:25px; min-height:44px; align-items:center; font-weight:400; }
.proposal-banner { border:2px solid currentColor; padding:24px; margin:28px 0; }
.r-municipal,.r-diagnostic { padding:clamp(70px,9vw,130px) 0; background:var(--acid); color:var(--ink); }
.r-diagnostic { background:var(--paper); }
.municipal-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:35px 0; }
.municipal-grid article { border:1px solid currentColor; padding:24px; }
.diagnostic-demo { max-width:900px; padding:28px; border:2px solid currentColor; margin-top:30px; }
.demo-bars { display:grid; gap:12px; margin:20px 0; }
.demo-bars span { display:block; padding:12px; color:#fff; background:linear-gradient(90deg,var(--terra) var(--v),rgba(188,79,50,.15) var(--v)); }
.contact-form select { width:100%; min-height:48px; border:0; border-bottom:1px solid var(--ink); background:transparent; color:var(--ink); font:inherit; padding:10px 0; }
.vcard-media { background:#000; }
.vcard-play { z-index:4; }
.confirmation-page { min-height:100vh; padding:clamp(40px,10vw,130px); max-width:900px; display:grid; align-content:center; gap:24px; }
.confirmation-page h1 { font:400 clamp(42px,8vw,90px)/1 var(--sans); }
.dark-theme .r-entity-selector,.dark-theme .r-diagnostic { background:#122842;color:var(--paper); }
.dark-theme .entity-card { border-color:var(--paper); }
.dark-theme .contact-form select { color:var(--paper); border-color:var(--paper); }
@media(max-width:1060px){.header-nav{display:none}.menu-disclosure{display:block}.header-cta{display:none}}
@media(max-width:760px){.entity-options,.municipal-grid{grid-template-columns:1fr}.mobile-nav{padding:95px 7vw 30px}.mobile-nav a{font-size:clamp(22px,6vw,34px)}.rsteps{display:grid;gap:30px}.rstep{min-height:0;padding:26px 0}.rstep-frame{width:min(48vw,190px);margin-bottom:15px}.vstep-num{font-size:48px}.rstep h3{font-size:30px}.hero-actions{gap:10px}.route{min-height:44px}}
@media(prefers-reduced-motion:reduce){.motion-ready .reveal.motion-pending{opacity:1;transform:none}}
.citizen-path { background:var(--paper); color:var(--ink); padding:0 0 60px; }
.dark-theme .citizen-path { background:#122842; color:var(--paper); }
.legal-header { background:var(--ink); padding:22px var(--pad); }
.legal-header img { width:160px; height:auto; }
.legal-page { max-width:900px; margin:auto; padding:120px var(--pad); }
.legal-page h1 { font:400 clamp(44px,8vw,90px)/1 var(--sans); margin-bottom:45px; }
.legal-page h2 { font:400 24px/1.2 var(--sans); margin:36px 0 10px; }
.legal-page p { margin:12px 0; }
/* R09.3 contrast corrections for the light hero. */
.light-theme .hero-real .route-outline { border-color:var(--ink); color:var(--ink); }
.light-theme .hero-real .citizen-link { color:var(--ink); }
.dark-theme .hero-real .route-outline { border-color:var(--paper); color:var(--paper); }
.dark-theme .hero-real .citizen-link { color:var(--paper); }
.dark-theme .hero-real-sub p,.dark-theme .hero-institutional,.dark-theme .hero-meta,.dark-theme .hero-scrollhint { color:var(--paper); }
.light-theme .hero-real-sub p,.light-theme .hero-institutional { color:var(--ink); }
/* R09.3.1 · no-JS/default contrast: the inline theme initializer may be blocked. */
html:not(.dark-theme) .hero-real .route-outline { border-color:#10233B; color:#10233B; opacity:1; }
html:not(.dark-theme) .hero-real .citizen-link { color:#10233B; opacity:1; text-decoration-thickness:2px; }
html:not(.dark-theme) .hero-real-sub p,
html:not(.dark-theme) .hero-institutional,
html:not(.dark-theme) .hero-meta { color:#10233B; opacity:1; }
.hero-real .conversion-actions > a { opacity:1; }
/* R09.3.2 · status chip outside video/control surface. */
.hero-real-stage { padding-bottom: 96px; }
.hero-chip,
.hero-chip[style] {
  top: calc(100% + 18px);
  right: 0;
  bottom: auto;
  z-index: 3;
  transform: none !important;
  max-width: min(240px, 80vw);
}
@media (max-width: 760px) {
  .hero-real-stage { padding-bottom: 88px; }
  .hero-chip,
  .hero-chip[style] { top: calc(100% + 14px); right: 0; bottom: auto; max-width: 190px; }
}
/* Keep chip inside reserved stage gutter, never over the video card. */
.hero-chip,
.hero-chip[style] { top:auto; bottom:16px; }
@media (max-width:760px) { .hero-chip,.hero-chip[style] { top:auto; bottom:14px; } }
/* Dynamic scroll state is enhancement only: all steps remain readable without JS. */
@media (min-width:761px) {
  .rstep { opacity:.48; transition:opacity .3s ease; }
  .rstep.step-active { opacity:1; }
}
@media (prefers-reduced-motion:reduce) {
  .rstep { opacity:1; }
  .rp-frame { transition:none; }
}
/* R09.3.2 · native form controls, legible in both palettes. */
.contact-form select {
  appearance:auto;
  -webkit-appearance:menulist;
  background-image:none !important;
  background-color:var(--paper);
  color:var(--ink);
  border:1px solid rgba(16,35,59,.55);
  border-radius:6px;
  padding:10px 12px;
  color-scheme:light;
}
.contact-form select option { background:#FAF8F1; color:#10233B; }
html.dark-theme .contact-form select {
  background-image:none !important;
  background-color:#FAF8F1;
  color:#10233B;
  border-color:#FAF8F1;
  color-scheme:light;
}
html.dark-theme .contact-form select option { background:#FAF8F1; color:#10233B; }
html.dark-theme .contact-form input,
html.dark-theme .contact-form textarea { caret-color:#FAF8F1; }
/* R09.3.2 · goal and comment each occupy a full row in every contact form. */
.contact-form .form-group:has(select),
.contact-form .form-group:has(textarea) { grid-column:1 / -1; }
.contact-form select { width:100%; min-width:0; }

/* R09.3.3 · lectura móvil del recorrido.
   En móvil cada paso presenta primero su número y explicación, y después la evidencia visual.
   El paso 04 no repite el fotograma del paso 03: conserva la explicación textual y, en desktop,
   la escena sticky mantiene el último fotograma real. */
@media (max-width: 760px) {
  .recorrido { padding-top: 72px; padding-bottom: 84px; }
  .recorrido-intro { margin-bottom: 34px; }
  .rsteps { gap: 0; }
  .rstep {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 34px 0 38px;
  }
  .rstep .vstep-num { order: 1; }
  .rstep h3 { order: 2; margin: 14px 0 9px; }
  .rstep p { order: 3; }
  .rstep .rstep-frame {
    order: 4;
    width: min(68vw, 250px);
    margin: 24px 0 0;
  }
  .rstep-result { padding-bottom: 22px; }
}

/* R09.3.3 · header móvil: legible y fuera del contenido al avanzar.
   Se mantiene visible al inicio y al desplazarse hacia arriba; al bajar se retira para no tapar titulares. */
@media (max-width: 760px) {
  .site-header { transition: transform .26s ease, inset .35s ease; }
  .site-header .header-inner {
    background: rgba(16,35,59,.94);
    box-shadow: 0 10px 28px rgba(16,35,59,.20);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 9px 12px;
  }
  .site-header.header-hidden { transform: translateY(calc(-100% - 20px)); }
  .site-header:focus-within { transform: none; }
  .header-right { gap: 7px; }
  .lang-switcher { white-space: nowrap; }
  .theme-toggle, .menu-disclosure > summary {
    width: 42px;
    height: 42px;
  }
}

/* R09.3.3 · diagnóstico ilustrativo más legible en móvil. */
.diagnostic-demo > p { margin-bottom: 18px; }
.diagnostic-demo small { display:block; line-height:1.55; margin-top:18px; max-width:760px; }
@media (max-width:760px) {
  .diagnostic-demo { padding:22px 18px; }
  .demo-bars span { padding:11px 12px; font-size:14px; line-height:1.35; }
  .diagnostic-demo small { font-size:12px; }
}

/* Estado editorial visible de los documentos legales. */
.legal-status {
  display: inline-block;
  margin: 0 0 34px;
  padding: 10px 14px;
  border: 1px solid currentColor;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.4;
}
@media (max-width: 760px) { .legal-status { margin-bottom: 26px; } }

/* AupaZu 2026-10-08: unified project and visual founder */
#proyectos,#equipo,#formulario,#recorrido {scroll-margin-top:110px}
.unified-project {padding:clamp(70px,9vw,130px) 0;background:var(--acid);color:var(--ink)}
.unified-project h2 {font:400 clamp(32px,4.5vw,66px)/1.08 var(--sans);letter-spacing:-.04em;max-width:1050px;margin:25px 0}
.project-intro {max-width:820px;font-size:clamp(16px,1.6vw,21px)}
.project-steps {display:grid;grid-template-columns:repeat(4,1fr);gap:25px;margin:48px 0}
.project-steps article {border-top:1px solid var(--ink);padding-top:20px}
.project-steps span {font-size:13px;font-weight:400}.project-steps h3{font:400 22px var(--sans);margin:18px 0 12px}
.project-resources {display:grid;grid-template-columns:repeat(3,1fr);gap:28px;border-top:1px solid var(--ink);padding-top:28px}
.project-resources h3{font-size:16px;margin-bottom:10px}.zero-friction{margin-top:34px;padding-top:24px;border-top:1px solid var(--ink);font-size:clamp(20px,2.6vw,32px);font-weight:400;max-width:1050px}
.dark-theme .unified-project{background:#172f45;color:var(--paper)}
.dark-theme .project-steps article,.dark-theme .project-resources,.dark-theme .zero-friction{border-color:rgba(250,248,241,.35)}
.founder-visual {padding:70px 0;background:var(--paper);color:var(--ink)}
.founder-visual .container{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:55px}
.founder-visual h2{font:400 clamp(30px,4vw,62px)/1.1 var(--sans);letter-spacing:-.035em;max-width:500px}
.founder-visual figure{max-width:440px;margin:0}.founder-visual img{width:100%;height:auto;border-radius:18px}
.founder-visual figcaption{font-size:12px;letter-spacing:.12em;font-weight:400;margin-top:15px}
.dark-theme .founder-visual{background:#10233b;color:var(--paper)}
.hero-real .hero-title{font-size:clamp(40px,5.2vw,78px);line-height:1.06}
.hero-institutional{display:none}.hero-real .hero-actions{margin-top:26px}
.site-header .header-inner{background:rgba(16,35,59,.95);box-shadow:0 8px 24px #10233b22}
.mobile-nav .mobile-languages {display:flex;gap:20px;margin-top:10px}.mobile-nav .mobile-languages a{font-size:18px;border:0}
@media(max-width:1060px){.header-right>.lang-switcher{display:none}.header-logo img{height:34px}}
@media(max-width:760px){.project-steps{grid-template-columns:1fr 1fr;gap:28px 20px;margin:32px 0}.project-steps h3{font-size:19px}.project-resources{grid-template-columns:1fr}.founder-visual .container{grid-template-columns:1fr;gap:28px}.founder-visual figure{max-width:360px}.hero-real .hero-title{font-size:clamp(36px,10vw,51px)}.hero-real .conversion-actions{align-items:flex-start}.unified-project h2{font-size:34px}.project-steps p{font-size:14px}.r-contact .contact-copy h2{overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Visual support wall, same source logos and program labels as Ulertu. */
.support-visual{padding:20px 0 85px;background:var(--paper);color:var(--ink)}
.relation-tags{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.relation-row{background:#fff;border:1px solid #deddd5;border-radius:14px;padding:22px;display:flex;flex-direction:column;justify-content:space-between;gap:20px;min-width:0}
.relation-logos{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px;min-height:90px}
.logo-box{display:flex;align-items:center;justify-content:center;max-width:100%;min-width:0}
.logo-box img{height:var(--lh,40px);width:auto;max-width:150px;object-fit:contain}
.logo-box.dark-logo{background:#182d26;padding:10px;border-radius:6px}.relation-label{font-size:14px;text-align:center;line-height:1.5}
.dark-theme .support-visual{background:#10233b;color:var(--paper)}.dark-theme .relation-row{color:var(--ink)}
.r-faq-head,.r-faq-list,.faq-stats{min-width:0}.r-faq summary{min-width:0;overflow-wrap:anywhere}.r-faq h2{overflow-wrap:anywhere}
@media(max-width:760px){.relation-tags{grid-template-columns:1fr 1fr;gap:12px}.relation-row{padding:16px 10px}.relation-logos{min-height:100px;gap:14px}.logo-box img{height:auto;max-height:48px;max-width:115px}.relation-label{font-size:12px}.faq-stats{flex-wrap:wrap;gap:20px}.r-faq-grid{grid-template-columns:minmax(0,1fr)}.r-faq summary .plus{flex-shrink:0}.r-faq .answer{overflow:hidden}}

/* ===== AupaZu 2026-10-08 · ronda de mejoras (9 puntos) ===== */
/* 1 · Menú superior legible: la barra es siempre azul oscuro, el texto siempre claro */
html.light-theme .site-header .header-inner, html.dark-theme .site-header .header-inner { color:#FAF8F1; }
.site-header .header-nav a { color:#FAF8F1; opacity:1; }
.site-header .header-nav a:hover, .site-header .header-nav a:focus-visible { color:var(--acid); }
.site-header .lang-toggle:not(.active) { color:#FAF8F1; opacity:.9; }
.site-header .lang-sep { color:#FAF8F1; opacity:.5; }
html.light-theme .site-header .theme-toggle, html.dark-theme .site-header .theme-toggle { color:#FAF8F1; border-color:rgba(250,248,241,.6); }
.site-header .menu-disclosure > summary { color:#FAF8F1; }

/* 3 · Límites */
.citypilot-grid { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:900px; }

/* 4 · Recorrido en bocadillos */
.bubble-steps { gap:26px; margin:52px 0 56px; }
.bubble-steps .bubble { position:relative; border:0; padding:26px 24px 30px; border-radius:22px; background:#10233B; color:#FAF8F1; box-shadow:0 10px 26px rgba(16,35,59,.18); }
.bubble-steps .bubble::after { content:""; position:absolute; left:34px; bottom:-17px; width:0; height:0; border-left:8px solid transparent; border-right:26px solid transparent; border-top:18px solid #10233B; }
.bubble-steps .b2, .bubble-steps .b4 { background:#BC4F32; color:#fff; }
.bubble-steps .b2::after, .bubble-steps .b4::after { border-top-color:#BC4F32; }
.bubble-steps .bubble span { display:inline-grid; place-items:center; width:34px; height:34px; border-radius:50%; background:#DDE94B; color:#10233B; font:400 14px var(--sans); }
.bubble-steps .b2 span, .bubble-steps .b4 span { background:#FAF8F1; }
.bubble-steps .bubble h3 { font:400 clamp(21px,1.9vw,26px) var(--sans); margin:16px 0 10px; color:inherit; }
.bubble-steps .bubble p { font-size:16px; line-height:1.5; color:inherit; opacity:1; }
.dark-theme .bubble-steps .b1, .dark-theme .bubble-steps .b3 { background:#FAF8F1; color:#10233B; }
.dark-theme .bubble-steps .b1::after, .dark-theme .bubble-steps .b3::after { border-top-color:#FAF8F1; }
.dark-theme .bubble-steps .b1 span, .dark-theme .bubble-steps .b3 span { background:#10233B; color:#DDE94B; }

/* 5 · Campaña Ayúdame a ayudarte */
.r-campaign { background:var(--paper); color:var(--ink); padding:clamp(80px,10vw,140px) var(--pad); }
.r-campaign h2 { font:400 clamp(40px,6vw,92px)/.95 var(--sans); letter-spacing:-.045em; margin:22px 0 20px; }
.campaign-lead { max-width:720px; font-size:clamp(18px,1.8vw,24px); line-height:1.45; }
.campaign-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin-top:44px; }
.campaign-cards article { border-top:2px solid var(--ink); padding-top:16px; }
.campaign-cards span { font:italic 15px var(--serif); color:var(--terra); }
.campaign-cards h3 { font:400 clamp(20px,1.9vw,26px) var(--sans); margin:10px 0 8px; }
.campaign-cards p { font-size:15.5px; line-height:1.55; }
.campaign-note { margin-top:26px; font-size:14px; color:var(--ink-soft); max-width:720px; }
.campaign-formwrap { margin-top:52px; }
.campaign-formhead h3 { font:400 clamp(26px,3vw,40px)/1.1 var(--sans); letter-spacing:-.03em; }
.campaign-formhead p { margin:10px 0 22px; color:var(--ink-soft); }
.campaign-form .full, .campaign-form .need-group { grid-column:1 / -1; }
.campaign-form .form-group:nth-of-type(n) { grid-column:auto; }
.campaign-form .form-group.full { grid-column:1 / -1; }
.campaign-form textarea { width:100%; resize:vertical; border:0; border-bottom:1.5px solid var(--ink); background:transparent; padding:10px 2px; font:inherit; color:inherit; }
.need-group { border:0; padding:0; margin:0; min-width:0; }
.need-group legend { font:400 12px var(--sans); letter-spacing:.08em; text-transform:uppercase; margin-bottom:12px; padding:0; }
.need-group > div { display:flex; flex-wrap:wrap; gap:10px; }
.need { display:inline-flex; align-items:center; gap:8px; border:1.5px solid var(--ink); border-radius:100px; padding:9px 16px; font-size:14px; cursor:pointer; }
.need input { accent-color:var(--terra); width:16px; height:16px; }
.need:has(input:checked) { background:var(--ink); color:var(--paper); }
.dark-theme .r-campaign { background:#13263E; color:var(--paper); }
.dark-theme .campaign-cards article { border-top-color:rgba(250,248,241,.7); }
.dark-theme .campaign-cards span { color:#F09575; }
.dark-theme .campaign-note, .dark-theme .campaign-formhead p { color:rgba(250,248,241,.78); }
.dark-theme .campaign-form textarea { border-bottom-color:rgba(250,248,241,.85); }
.dark-theme .need { border-color:rgba(250,248,241,.75); }
.dark-theme .need:has(input:checked) { background:var(--paper); color:var(--ink); }
@media(max-width:760px){ .campaign-cards{grid-template-columns:1fr} .campaign-form .form-group{grid-column:1 / -1 !important} }

/* 6 · Quién está detrás */
.founder-visual .container { grid-template-columns:1.1fr .9fr; align-items:center; }
.founder-text h2 { margin-bottom:22px; }
.founder-text > p { font-size:clamp(16px,1.4vw,19px); line-height:1.55; max-width:560px; }
.founder-timeline { list-style:none; margin:30px 0 0; padding:0; display:grid; gap:0; max-width:560px; border-left:3px solid var(--terra); }
.founder-timeline li { display:grid; grid-template-columns:110px 1fr; column-gap:16px; padding:10px 0 10px 20px; align-items:baseline; }
.founder-timeline b { font:400 15px var(--sans); color:var(--terra); }
.founder-timeline strong { font:400 17px var(--sans); }
.founder-timeline span { grid-column:2; font-size:14px; opacity:.85; }
.dark-theme .founder-timeline b { color:#F09575; }
@media(max-width:760px){ .founder-visual .container{grid-template-columns:1fr} .founder-text{order:2} .founder-timeline li{grid-template-columns:1fr} .founder-timeline span{grid-column:1} }

/* 7 · Preguntas: título sin cortar y cifras sin solapar */
.r-faq-grid { grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr); }
.r-faq-head { position:static; min-width:0; }
.r-faq h2 { font-size:clamp(38px,4.6vw,76px); line-height:.95; overflow-wrap:normal; word-break:normal; hyphens:none; }
.faq-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.faq-stats dt { white-space:normal; font-size:clamp(17px,1.6vw,22px); line-height:1.15; }
.faq-stats dd { font-size:10px; }
@media(max-width:1060px){ .r-faq-grid{grid-template-columns:1fr} }
@media(max-width:560px){ .faq-stats{grid-template-columns:1fr 1fr} }

/* 8 · Cierre más contenido y sin negrita */
.r-close { min-height:0; padding-top:clamp(70px,8vw,110px); }
.r-close h2 { font-family:var(--body); font-weight:400; font-size:clamp(30px,4vw,56px); line-height:1.15; letter-spacing:-.02em; max-width:18em; margin:clamp(36px,6vh,70px) 0 clamp(28px,4vw,40px); }
@media(max-width:760px){ .r-close h2{font-size:clamp(28px,8vw,38px)} }

/* 9 · Contacto directo */
.contact-direct { margin-top:30px; }
.contact-direct p { margin:0 0 12px; font-size:16px; }
.contact-phones { list-style:none; margin:0 0 18px; padding:0; font:400 clamp(20px,2.1vw,28px) var(--sans); letter-spacing:-.02em; }
.contact-phones span { display:block; font:400 11px var(--sans); letter-spacing:.14em; text-transform:uppercase; margin-bottom:6px; opacity:.75; }
.contact-phones a { text-decoration:none; color:inherit; border-bottom:2px solid var(--terra); }
.contact-phones i { font-style:normal; opacity:.4; margin:0 6px; }
.wa-btn { display:inline-flex; align-items:center; background:#1FA855; color:#fff; text-decoration:none; font:400 13px var(--sans); letter-spacing:.08em; text-transform:uppercase; padding:15px 24px; border-radius:100px; }
.wa-btn:hover, .wa-btn:focus-visible { background:#168a45; }
.campaign-form textarea{min-height:64px}
@media(max-width:560px){.bubble-steps{grid-template-columns:1fr;gap:34px}}

/* 261009-8: peso regular en toda la landing, sin cambiar tamaños ni colores. */
h1, h2, h3, h4, h5, h6, b, strong { font-weight: 400; }

/* 261009-8: propuesta de criterio común para bloques numerados. */
.r-citypilot h2, .r-campaign h2 {
  font:400 clamp(32px,4.5vw,66px)/1.08 var(--sans);
  letter-spacing:-.04em; max-width:1050px; margin:25px 0;
}
.citypilot-lead, .campaign-lead { max-width:820px; font-size:clamp(16px,1.6vw,21px); line-height:1.5; }
.citypilot-grid, .campaign-cards { gap:26px; margin:52px 0 56px; align-items:stretch; }
.citypilot-grid article, .campaign-cards article {
  position:relative; border:0; padding:26px 24px 30px; border-radius:22px;
  background:#10233B; color:#FAF8F1; box-shadow:0 10px 26px rgba(16,35,59,.18);
}
.citypilot-grid article::after, .campaign-cards article::after {
  content:""; position:absolute; left:34px; bottom:-17px; width:0; height:0;
  border-left:8px solid transparent; border-right:26px solid transparent; border-top:18px solid #10233B;
}
.citypilot-grid article:nth-child(even), .campaign-cards article:nth-child(even) { background:#BC4F32; color:#fff; }
.citypilot-grid article:nth-child(even)::after, .campaign-cards article:nth-child(even)::after { border-top-color:#BC4F32; }
.citypilot-grid .cpn, .campaign-cards article > span {
  display:inline-grid; place-items:center; width:34px; height:34px; border-radius:50%;
  background:#DDE94B; color:#10233B; font:400 14px var(--sans);
}
.citypilot-grid article:nth-child(even) > span, .campaign-cards article:nth-child(even) > span { background:#FAF8F1; }
.citypilot-grid h3, .campaign-cards h3 { font:400 clamp(21px,1.9vw,26px) var(--sans); margin:16px 0 10px; color:inherit; }
.citypilot-grid p, .campaign-cards p { font-size:16px; line-height:1.5; color:inherit; opacity:1; }
.dark-theme .citypilot-grid article:nth-child(odd), .dark-theme .campaign-cards article:nth-child(odd) { background:#FAF8F1; color:#10233B; }
.dark-theme .citypilot-grid article:nth-child(odd)::after, .dark-theme .campaign-cards article:nth-child(odd)::after { border-top-color:#FAF8F1; }
.dark-theme .citypilot-grid article:nth-child(odd) > span, .dark-theme .campaign-cards article:nth-child(odd) > span { background:#10233B; color:#DDE94B; }
@media(max-width:760px){
  .r-citypilot h2, .r-campaign h2 { font-size:34px; }
  .citypilot-grid, .campaign-cards { grid-template-columns:1fr; gap:36px; margin:36px 0 48px; }
}
.r-citypilot .citypilot-grid article p { color:inherit; opacity:1; }
/* 261009-8: cifras FAQ en filas, sin columnas estrechas ni solapes. */
.faq-stats { display:grid; grid-template-columns:minmax(0,1fr); gap:0; max-width:440px; margin-top:36px; }
.faq-stats > div { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:18px; align-items:start; border-top:1px solid currentColor; padding:16px 0; min-width:0; }
.faq-stats dt { font:400 21px/1.3 var(--sans); overflow-wrap:anywhere; margin:0; }
.faq-stats dd { font:400 12px/1.5 var(--body); margin:0; letter-spacing:.04em; overflow-wrap:anywhere; }
html.light-theme .r-citypilot .citypilot-grid article p,
html.dark-theme .r-citypilot .citypilot-grid article p { color:inherit; opacity:1; }

/* Demostración ES: tres tarjetas; EU conserva sus dos tarjetas actuales. */
html[lang="es"] .citypilot-grid { grid-template-columns:repeat(3,minmax(0,1fr)); max-width:none; }
@media(max-width:760px){ html[lang="es"] .citypilot-grid { grid-template-columns:1fr; } }

/* V5 FAQ: dos puertas de entrada, sin compromiso ni envío al pulsar */
.faq-entry-cards{display:grid;gap:16px;margin-top:26px}
.faq-entry-card{background:var(--ink);color:var(--paper);border-radius:20px;padding:24px}
.faq-entry-card:nth-child(2){background:var(--terra)}
.faq-entry-card h3{font-family:var(--sans);font-size:clamp(20px,2vw,24px);font-weight:400;line-height:1.25}
.r-faq-head .faq-entry-card p{color:var(--paper);font-size:14px;line-height:1.55;margin:10px 0 16px}
.faq-entry-cta{display:block;min-height:44px;padding:14px 18px;background:var(--acid);color:var(--ink);text-decoration:none;text-align:center;border-radius:30px;font-family:var(--sans);font-size:14px;line-height:1.45;font-weight:400}
.faq-entry-cta:focus-visible{outline:3px solid var(--paper);outline-offset:4px}
.r-faq-head .faq-entry-note{font-size:13px;margin-top:18px;color:var(--ink-soft)}


/* v6: accesibilidad. Foco visible en dos tonos y etiquetas legibles. */
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #14284b;outline-offset:3px;box-shadow:0 0 0 6px #d4f25a}
html.dark-theme a:focus-visible,html.dark-theme button:focus-visible,html.dark-theme summary:focus-visible,html.dark-theme input:focus-visible,html.dark-theme select:focus-visible,html.dark-theme textarea:focus-visible{outline-color:#fff;box-shadow:0 0 0 6px #14284b}
.form-group label{font-size:12px;font-weight:500;letter-spacing:.08em;line-height:1.4;color:var(--ink);opacity:1}
.form-group label span{font-weight:400}

/* v6: nota bajo el boton de cierre y limites de la demostracion */
.r-close-bottom .cta-note{flex-basis:100%;max-width:none;margin:0;font-size:14px;line-height:1.45}
.hero-limits{margin:10px auto 0;max-width:34ch;font-size:12.5px;line-height:1.45;text-align:center;opacity:.9}

/* v6: la demostración tiene 3 tarjetas también en euskera */
html[lang="eu"] .citypilot-grid { grid-template-columns:repeat(3,minmax(0,1fr)); max-width:none; }
@media(max-width:760px){ html[lang="eu"] .citypilot-grid { grid-template-columns:1fr; } }
