:root {
  --via-navy-950: #061632;
  --via-navy-900: #0a2556;
  --via-navy-800: #103b7a;
  --via-blue-600: #0969da;
  --via-blue-500: #0785e6;
  --via-cyan-500: #09accd;
  --via-teal-500: #0a9f9a;
  --via-green-500: #42a83d;
  --via-ink: #132744;
  --via-muted: #5b6b82;
  --via-line: #dce6f1;
  --via-surface: #ffffff;
  --via-surface-soft: #f5f9fd;
  --via-surface-tint: #eef7fb;
  --via-shadow-sm: 0 10px 30px rgba(15, 48, 87, 0.08);
  --via-shadow-lg: 0 26px 70px rgba(15, 48, 87, 0.14);
  --via-radius-sm: 12px;
  --via-radius-md: 20px;
  --via-radius-lg: 32px;
  --via-container: min(1180px, calc(100vw - 40px));
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--via-ink);
  background: #ffffff;
  font-family: "Segoe UI", Inter, system-ui, -apple-system, BlinkMacSystemFont, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body.is-menu-open { overflow: hidden; }
img { max-width: 100%; }
a { color: inherit; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid rgba(9, 133, 230, 0.5); outline-offset: 3px; }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.skip-link {
  position: fixed;
  left: 16px;
  top: 12px;
  z-index: 9999;
  transform: translateY(-160%);
  padding: 10px 14px;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: var(--via-shadow-sm);
  color: var(--via-navy-900);
  font-weight: 700;
  text-decoration: none;
}
.skip-link:focus { transform: translateY(0); }
.container { width: var(--via-container); margin-inline: auto; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  border-bottom: 1px solid rgba(220, 230, 241, 0.88);
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(18px);
}
.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 72px;
  gap: 24px;
}
.site-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  text-decoration: none;
}
.site-brand img { width: 72px; height: auto; display: block; }
.site-brand__text { display: grid; gap: 2px; }
.site-brand__text strong { color: var(--via-navy-900); font-size: 15px; line-height: 1.05; }
.site-brand__text span { color: var(--via-muted); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; }
.site-nav { display: flex; align-items: center; gap: 24px; }
.site-nav > a {
  color: #334b68;
  font-size: 14px;
  font-weight: 650;
  text-decoration: none;
}
.site-nav > a:hover { color: var(--via-blue-600); }
.site-nav__cta {
  padding: 10px 15px;
  border-radius: 999px;
  background: var(--via-navy-900);
  color: #ffffff !important;
  box-shadow: 0 8px 18px rgba(10, 37, 86, 0.18);
}
.language-nav {
  display: inline-flex;
  align-items: center;
  padding: 3px;
  border: 1px solid var(--via-line);
  border-radius: 999px;
  background: #fff;
}
.language-nav a {
  display: grid;
  place-items: center;
  min-width: 34px;
  min-height: 30px;
  border-radius: 999px;
  color: var(--via-muted);
  font-size: 11px;
  font-weight: 800;
  text-decoration: none;
}
.language-nav a[aria-current="page"] { background: var(--via-surface-tint); color: var(--via-navy-900); }
.menu-toggle {
  display: none;
  width: 44px;
  height: 44px;
  border: 1px solid var(--via-line);
  border-radius: 12px;
  background: #fff;
  color: var(--via-navy-900);
  cursor: pointer;
}
.menu-toggle span,
.menu-toggle::before,
.menu-toggle::after {
  content: "";
  display: block;
  width: 20px;
  height: 2px;
  margin: 4px auto;
  background: currentColor;
  transition: transform 180ms ease, opacity 180ms ease;
}
.menu-toggle[aria-expanded="true"] span { opacity: 0; }
.menu-toggle[aria-expanded="true"]::before { transform: translateY(6px) rotate(45deg); }
.menu-toggle[aria-expanded="true"]::after { transform: translateY(-6px) rotate(-45deg); }

.hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 80% 10%, rgba(9, 172, 205, 0.16), transparent 28%),
    radial-gradient(circle at 8% 70%, rgba(9, 105, 218, 0.10), transparent 32%),
    linear-gradient(135deg, #fbfdff 0%, #f3f8fc 55%, #edf8fb 100%);
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(16, 59, 122, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(16, 59, 122, 0.035) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,0.7), transparent 92%);
  pointer-events: none;
}
.hero__inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.07fr) minmax(360px, 0.93fr);
  align-items: center;
  min-height: 690px;
  gap: clamp(40px, 7vw, 90px);
  padding: 88px 0 78px;
}
.eyebrow {
  margin: 0 0 18px;
  color: var(--via-blue-600);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.hero h1 {
  max-width: 760px;
  margin: 0;
  color: var(--via-navy-950);
  font-size: clamp(42px, 5.2vw, 72px);
  font-weight: 720;
  letter-spacing: -0.045em;
  line-height: 1.02;
}
.hero__lead {
  max-width: 690px;
  margin: 24px 0 0;
  color: #40546f;
  font-size: clamp(18px, 1.55vw, 22px);
  line-height: 1.6;
}
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 48px;
  padding: 12px 18px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-weight: 750;
  text-decoration: none;
  transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease;
}
.button:hover { transform: translateY(-2px); }
.button--primary { background: var(--via-navy-900); color: #fff; box-shadow: 0 12px 30px rgba(10, 37, 86, 0.2); }
.button--secondary { border-color: #c9d9e8; background: rgba(255,255,255,0.82); color: var(--via-navy-900); }
.button--light { background: #fff; color: var(--via-navy-900); }
.hero__proof { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.proof-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 11px;
  border: 1px solid rgba(16, 59, 122, 0.12);
  border-radius: 999px;
  background: rgba(255,255,255,0.72);
  color: #47617e;
  font-size: 12px;
  font-weight: 650;
}
.proof-pill::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--via-teal-500); }
.hero__visual {
  position: relative;
  min-height: 520px;
  border: 1px solid rgba(9, 105, 218, 0.12);
  border-radius: 38px;
  background:
    radial-gradient(circle at 50% 20%, rgba(80, 215, 230, 0.20), transparent 32%),
    linear-gradient(160deg, rgba(255,255,255,0.94), rgba(234,246,251,0.9));
  box-shadow: var(--via-shadow-lg);
  overflow: hidden;
}
.hero__visual::before {
  content: "";
  position: absolute;
  inset: 8% 8% 10%;
  border: 1px solid rgba(9, 172, 205, 0.15);
  border-radius: 50%;
  box-shadow: 0 0 0 32px rgba(9, 172, 205, 0.035), 0 0 0 64px rgba(9, 105, 218, 0.025);
}
.hero__avatar { position: absolute; right: -4%; bottom: 0; width: min(88%, 500px); height: auto; filter: drop-shadow(0 20px 30px rgba(15, 48, 87, 0.18)); }
.hero__status-card {
  position: absolute;
  left: 22px;
  bottom: 22px;
  width: min(72%, 300px);
  padding: 16px;
  border: 1px solid rgba(9, 105, 218, 0.13);
  border-radius: 18px;
  background: rgba(255,255,255,0.91);
  box-shadow: var(--via-shadow-sm);
  backdrop-filter: blur(12px);
}
.hero__status-card span { display: block; color: var(--via-blue-600); font-size: 10px; font-weight: 850; letter-spacing: 0.11em; text-transform: uppercase; }
.hero__status-card strong { display: block; margin-top: 5px; color: var(--via-navy-950); font-size: 17px; }
.hero__status-card p { margin: 7px 0 0; color: var(--via-muted); font-size: 12px; line-height: 1.45; }

.section { padding: 92px 0; }
.section--soft { background: var(--via-surface-soft); }
.section--dark { background: var(--via-navy-950); color: #fff; }
.section__header { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 48px; align-items: end; margin-bottom: 42px; }
.section__header h2 { margin: 0; color: var(--via-navy-950); font-size: clamp(32px, 4vw, 52px); letter-spacing: -0.035em; line-height: 1.08; }
.section__header p { margin: 0; color: var(--via-muted); font-size: 18px; line-height: 1.65; }
.section--dark .section__header h2 { color: #fff; }
.section--dark .section__header p { color: rgba(255,255,255,0.72); }
.cards-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.info-card {
  min-height: 220px;
  padding: 26px;
  border: 1px solid var(--via-line);
  border-radius: var(--via-radius-md);
  background: #fff;
  box-shadow: var(--via-shadow-sm);
}
.info-card__number { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 11px; background: var(--via-surface-tint); color: var(--via-blue-600); font-size: 12px; font-weight: 850; }
.info-card h3 { margin: 22px 0 10px; color: var(--via-navy-950); font-size: 21px; }
.info-card p { margin: 0; color: var(--via-muted); line-height: 1.62; }

.flow-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; counter-reset: flow; }
.flow-step { position: relative; padding: 24px 24px 25px; border: 1px solid var(--via-line); border-radius: var(--via-radius-md); background: #fff; }
.flow-step::before { counter-increment: flow; content: counter(flow, decimal-leading-zero); display: inline-block; color: var(--via-cyan-500); font-size: 12px; font-weight: 900; letter-spacing: 0.12em; }
.flow-step h3 { margin: 16px 0 8px; color: var(--via-navy-950); font-size: 19px; }
.flow-step p { margin: 0; color: var(--via-muted); line-height: 1.55; }

.demo-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 0.82fr);
  gap: 34px;
  align-items: center;
  padding: clamp(28px, 5vw, 58px);
  border-radius: var(--via-radius-lg);
  background: linear-gradient(130deg, var(--via-navy-950), #0d3d71 66%, #0c6c86);
  color: #fff;
  box-shadow: var(--via-shadow-lg);
}
.demo-panel h2 { margin: 0; font-size: clamp(34px, 4vw, 52px); letter-spacing: -0.035em; }
.demo-panel p { max-width: 680px; margin: 18px 0 0; color: rgba(255,255,255,0.78); font-size: 17px; line-height: 1.65; }
.demo-panel__checks { display: grid; gap: 12px; margin-top: 24px; }
.demo-panel__checks span { display: flex; gap: 10px; color: rgba(255,255,255,0.84); }
.demo-panel__checks span::before { content: "✓"; color: #63e1dd; font-weight: 900; }
.demo-panel__card { padding: 24px; border: 1px solid rgba(255,255,255,0.16); border-radius: 24px; background: rgba(255,255,255,0.08); backdrop-filter: blur(14px); }
.demo-panel__card span { color: #63e1dd; font-size: 11px; font-weight: 850; letter-spacing: 0.12em; text-transform: uppercase; }
.demo-panel__card strong { display: block; margin-top: 9px; font-size: 22px; }
.demo-panel__card p { margin-top: 10px; font-size: 14px; }
.demo-panel__card .button { margin-top: 20px; }

.agents-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.agent-card { position: relative; overflow: hidden; min-height: 330px; padding: 22px; border: 1px solid var(--via-line); border-radius: 24px; background: #fff; box-shadow: var(--via-shadow-sm); }
.agent-card img { display: block; width: 100%; height: 150px; object-fit: contain; object-position: center bottom; }
.agent-card h3 { margin: 18px 0 5px; color: var(--via-navy-950); font-size: 20px; }
.agent-card__role { color: var(--via-blue-600); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; }
.agent-card p { margin: 12px 0 0; color: var(--via-muted); font-size: 14px; line-height: 1.55; }
.agent-card small { display: block; margin-top: 12px; color: #718096; line-height: 1.45; }

.trust-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.trust-card { padding: 30px; border-radius: 24px; border: 1px solid var(--via-line); background: #fff; }
.trust-card--roadmap { border-style: dashed; background: #f8fbfe; }
.trust-card__label { display: inline-flex; padding: 7px 10px; border-radius: 999px; background: #eaf7f5; color: #167267; font-size: 11px; font-weight: 850; letter-spacing: 0.09em; text-transform: uppercase; }
.trust-card--roadmap .trust-card__label { background: #edf2f8; color: #52687f; }
.trust-card h3 { margin: 18px 0 16px; color: var(--via-navy-950); font-size: 24px; }
.check-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.check-list li { position: relative; padding-left: 26px; color: #4d617a; line-height: 1.55; }
.check-list li::before { content: ""; position: absolute; left: 0; top: 0.52em; width: 10px; height: 10px; border-radius: 50%; background: var(--via-teal-500); box-shadow: 0 0 0 5px rgba(10,159,154,0.11); }
.trust-card--roadmap .check-list li::before { background: #94a3b8; box-shadow: 0 0 0 5px rgba(148,163,184,0.12); }

.evidence-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; overflow: hidden; border: 1px solid var(--via-line); border-radius: 24px; background: var(--via-line); }
.evidence-item { min-height: 142px; padding: 25px; background: #fff; }
.evidence-item strong { display: block; color: var(--via-navy-950); font-size: 21px; }
.evidence-item span { display: block; margin-top: 9px; color: var(--via-muted); font-size: 14px; line-height: 1.45; }

.founder-grid { display: grid; grid-template-columns: 0.82fr 1.18fr; gap: clamp(40px, 8vw, 100px); align-items: center; }
.founder-card { padding: 32px; border-radius: var(--via-radius-lg); background: linear-gradient(145deg, #edf7fb, #f9fcfe); border: 1px solid #d9e8f1; }
.founder-card__mark { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 22px; background: var(--via-navy-900); color: #fff; font-size: 24px; font-weight: 850; }
.founder-card h3 { margin: 22px 0 4px; color: var(--via-navy-950); font-size: 25px; }
.founder-card p { margin: 0; color: var(--via-muted); line-height: 1.55; }
.founder-copy h2 { margin: 0; color: var(--via-navy-950); font-size: clamp(34px, 4vw, 50px); letter-spacing: -0.035em; }
.founder-copy > p { margin: 20px 0 0; color: var(--via-muted); font-size: 17px; line-height: 1.7; }
.founder-copy__facts { display: grid; gap: 10px; margin-top: 24px; }
.founder-copy__facts span { padding: 13px 15px; border-left: 3px solid var(--via-cyan-500); background: var(--via-surface-soft); color: #415771; }

.pilot-steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.pilot-step { padding: 22px 18px; border: 1px solid rgba(255,255,255,0.14); border-radius: 20px; background: rgba(255,255,255,0.06); }
.pilot-step span { color: #63e1dd; font-size: 11px; font-weight: 850; letter-spacing: 0.12em; }
.pilot-step strong { display: block; margin-top: 12px; font-size: 17px; }
.pilot-step p { margin: 9px 0 0; color: rgba(255,255,255,0.68); font-size: 13px; line-height: 1.5; }
.pilot-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }

.resources-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.resource-card { display: flex; flex-direction: column; min-height: 210px; padding: 24px; border: 1px solid var(--via-line); border-radius: 22px; background: #fff; text-decoration: none; box-shadow: var(--via-shadow-sm); }
.resource-card span { color: var(--via-blue-600); font-size: 11px; font-weight: 850; letter-spacing: 0.1em; text-transform: uppercase; }
.resource-card strong { margin-top: 16px; color: var(--via-navy-950); font-size: 20px; }
.resource-card p { margin: 10px 0 0; color: var(--via-muted); line-height: 1.55; }
.resource-card small { margin-top: auto; padding-top: 18px; color: #6d8299; }
.resource-card:hover { border-color: rgba(9,105,218,0.35); transform: translateY(-2px); }

.page-hero { padding: 88px 0 62px; background: linear-gradient(135deg, #f7fbfe, #eef7fb); }
.page-hero__inner { max-width: 850px; }
.page-hero h1 { margin: 0; color: var(--via-navy-950); font-size: clamp(40px, 5vw, 62px); letter-spacing: -0.04em; line-height: 1.04; }
.page-hero p { margin: 22px 0 0; color: var(--via-muted); font-size: 19px; line-height: 1.7; }
.prose { width: min(860px, calc(100vw - 40px)); margin: 0 auto; padding: 68px 0 90px; }
.prose h2 { margin: 48px 0 14px; color: var(--via-navy-950); font-size: 28px; }
.prose h2:first-child { margin-top: 0; }
.prose h3 { margin: 32px 0 10px; color: var(--via-navy-900); font-size: 20px; }
.prose p, .prose li { color: #4d6178; font-size: 16px; line-height: 1.75; }
.prose ul, .prose ol { padding-left: 22px; }
.prose .notice { margin: 28px 0; padding: 20px; border-left: 4px solid var(--via-cyan-500); background: var(--via-surface-soft); border-radius: 0 14px 14px 0; }
.prose .status-table { width: 100%; border-collapse: collapse; margin: 24px 0; }
.prose .status-table th, .prose .status-table td { padding: 14px; border: 1px solid var(--via-line); text-align: left; vertical-align: top; }
.prose .status-table th { background: var(--via-surface-soft); color: var(--via-navy-900); }

.site-footer { padding: 52px 0 26px; background: #07182f; color: #fff; }
.site-footer__grid { display: grid; grid-template-columns: 1.25fr repeat(3, 0.75fr); gap: 38px; }
.site-footer__brand img { width: 78px; filter: brightness(0) invert(1); }
.site-footer__brand p { max-width: 360px; margin: 16px 0 0; color: rgba(255,255,255,0.66); line-height: 1.6; }
.site-footer h2 { margin: 0 0 14px; font-size: 13px; letter-spacing: 0.09em; text-transform: uppercase; }
.site-footer nav { display: grid; gap: 10px; }
.site-footer a { color: rgba(255,255,255,0.72); text-decoration: none; font-size: 14px; }
.site-footer a:hover { color: #fff; }
.site-footer__bottom { display: flex; justify-content: space-between; gap: 20px; margin-top: 44px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,0.10); color: rgba(255,255,255,0.52); font-size: 12px; }

.privacy-banner {
  position: fixed;
  left: 50%;
  bottom: 18px;
  z-index: 500;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 18px;
  width: min(860px, calc(100vw - 28px));
  padding: 18px;
  border: 1px solid #d7e3ef;
  border-radius: 20px;
  background: rgba(255,255,255,0.98);
  box-shadow: 0 22px 60px rgba(8, 33, 68, 0.22);
  transform: translateX(-50%);
}
.privacy-banner[hidden] { display: none; }
.privacy-banner p { margin: 0; color: #475c74; font-size: 13px; line-height: 1.5; }
.privacy-banner p strong { color: var(--via-navy-950); }
.privacy-banner__actions { display: flex; gap: 8px; }
.privacy-banner button { min-height: 40px; padding: 9px 13px; border-radius: 999px; cursor: pointer; font-weight: 750; }
.privacy-banner__accept { border: 1px solid var(--via-navy-900); background: var(--via-navy-900); color: #fff; }
.privacy-banner__reject { border: 1px solid #cbd8e5; background: #fff; color: var(--via-navy-900); }

@media (max-width: 1040px) {
  .site-nav { gap: 14px; }
  .site-nav > a:not(.site-nav__cta) { display: none; }
  .hero__inner { grid-template-columns: 1fr 0.82fr; }
  .agents-grid { grid-template-columns: repeat(2, 1fr); }
  .evidence-strip { grid-template-columns: repeat(2, 1fr); }
  .pilot-steps { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 780px) {
  :root { --via-container: min(100% - 28px, 720px); }
  .site-header__inner { min-height: 64px; }
  .site-brand__text span { display: none; }
  .site-nav {
    position: fixed;
    inset: 64px 0 auto;
    display: none;
    align-items: stretch;
    flex-direction: column;
    gap: 0;
    padding: 16px 20px 24px;
    border-bottom: 1px solid var(--via-line);
    background: rgba(255,255,255,0.99);
    box-shadow: var(--via-shadow-sm);
  }
  .site-nav.is-open { display: flex; }
  .site-nav > a:not(.site-nav__cta) { display: block; padding: 12px 4px; }
  .site-nav__cta { margin-top: 8px; text-align: center; }
  .language-nav { align-self: flex-start; margin: 10px 0; }
  .menu-toggle { display: block; }
  .hero__inner { grid-template-columns: 1fr; min-height: auto; padding: 68px 0 58px; }
  .hero h1 { font-size: clamp(40px, 12vw, 58px); }
  .hero__visual { min-height: 460px; }
  .section { padding: 70px 0; }
  .section__header { grid-template-columns: 1fr; gap: 18px; }
  .cards-3, .flow-grid, .resources-grid { grid-template-columns: 1fr; }
  .demo-panel { grid-template-columns: 1fr; }
  .trust-grid { grid-template-columns: 1fr; }
  .founder-grid { grid-template-columns: 1fr; }
  .pilot-steps { grid-template-columns: 1fr 1fr; }
  .site-footer__grid { grid-template-columns: 1fr 1fr; }
  .privacy-banner { grid-template-columns: 1fr; }
  .privacy-banner__actions { justify-content: flex-end; }
}

@media (max-width: 520px) {
  .site-brand img { width: 64px; }
  .hero__visual { min-height: 410px; }
  .hero__status-card { left: 14px; bottom: 14px; width: calc(100% - 28px); }
  .agents-grid, .evidence-strip, .pilot-steps, .site-footer__grid { grid-template-columns: 1fr; }
  .site-footer__bottom { flex-direction: column; }
  .privacy-banner__actions { display: grid; grid-template-columns: 1fr 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}

/* ========================================================================== 
   VIA WEB 16.4.0 — Escena corporativa sin scroll + video oficial
   ========================================================================== */

html:has(body.viewport-page),
body.viewport-page {
  width: 100%;
  height: 100%;
  min-height: 100%;
  overflow: hidden;
}

body.viewport-page {
  background: #f5f8fb;
}

.site-header--dark {
  position: relative;
  height: 72px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.11);
  background: linear-gradient(105deg, #2d3d4d 0%, #344859 48%, #405466 100%);
  box-shadow: 0 8px 24px rgba(13, 29, 45, 0.16);
  backdrop-filter: none;
}

.site-header--dark::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  background: linear-gradient(90deg, rgba(255,255,255,.25), rgba(255,255,255,.07) 48%, rgba(255,255,255,.2));
  pointer-events: none;
}

.site-header__inner--wide {
  display: grid;
  grid-template-columns: minmax(245px, 1fr) auto minmax(165px, 1fr);
  align-items: center;
  width: 100%;
  min-height: 72px;
  padding: 0 clamp(28px, 4vw, 72px);
  gap: 24px;
}

.site-brand--dark {
  justify-self: start;
  gap: 11px;
  color: #fff;
}

.site-brand--dark img {
  width: 90px;
  height: auto;
  margin-left: -10px;
  margin-right: -3px;
  transform: translateX(-1px);
  transform-origin: left center;
  filter: drop-shadow(0 2px 5px rgba(0,0,0,.18));
}

.site-brand--dark .site-brand__text strong {
  color: #fff;
  font-size: 13px;
  font-weight: 650;
  letter-spacing: .035em;
}

.site-nav--dark {
  justify-self: center;
  display: flex;
  align-items: center;
  gap: 12px;
}

.site-nav__pill {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 4px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 999px;
  background: rgba(15, 37, 55, .17);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}

.site-nav__pill a {
  display: grid;
  place-items: center;
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  color: rgba(255,255,255,.72);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .025em;
  text-decoration: none;
  white-space: nowrap;
  transition: color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.site-nav__pill a:hover,
.site-nav__pill a:focus-visible,
.site-nav__pill a[aria-current="page"] {
  color: #fff;
  background: linear-gradient(145deg, rgba(18, 142, 170, .72), rgba(18, 104, 139, .78));
  box-shadow: 0 5px 14px rgba(0,0,0,.16), inset 0 0 0 1px rgba(70,221,238,.24);
}

.language-nav--dark {
  border-color: rgba(255,255,255,.15);
  background: rgba(255,255,255,.06);
}

.language-nav--dark a {
  min-width: 28px;
  min-height: 28px;
  color: rgba(255,255,255,.62);
}

.language-nav--dark a[aria-current="page"] {
  color: #fff;
  background: rgba(255,255,255,.16);
}

.site-nav__cta--light {
  display: inline-grid;
  place-items: center;
  min-height: 38px;
  padding: 0 15px;
  line-height: 1;
  text-align: center;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.96);
  color: #17324f !important;
  box-shadow: 0 8px 18px rgba(8, 23, 39, .18);
  font-size: 11px !important;
  font-weight: 850 !important;
  white-space: nowrap;
}

.site-evin {
  justify-self: end;
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
}

.site-evin__prefix {
  color: #37d7ec;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .10em;
  text-transform: uppercase;
}

.site-evin strong {
  color: #fff;
  font-size: 21px;
  font-weight: 850;
  letter-spacing: .13em;
}

.menu-toggle--dark {
  border-color: rgba(255,255,255,.2);
  background: rgba(255,255,255,.08);
  color: #fff;
}

/* Portada visual: una escena, una pantalla, sin scroll. */
.home-stage {
  position: relative;
  width: 100vw;
  height: calc(100dvh - 72px);
  min-height: 520px;
  overflow: hidden;
  isolation: isolate;
  background: #f8fafc;
}

.home-stage__background,
.home-stage__background img {
  position: absolute;
  inset: 0;
  z-index: -3;
  width: 100%;
  height: 100%;
}

.home-stage__background img {
  object-fit: cover;
  object-position: center center;
  user-select: none;
  pointer-events: none;
}

.home-stage__veil {
  position: absolute;
  inset: 0;
  z-index: -2;
  background: transparent;
  pointer-events: none;
}

.home-message {
  position: absolute;
  left: clamp(58px, 7vw, 126px);
  top: 26%;
  z-index: 3;
  width: min(48vw, 720px);
}

.home-message h1 {
  display: grid;
  gap: clamp(14px, 1.9vh, 22px);
  margin: 0;
  color: #0a3470;
  font-size: clamp(42px, 4.7vw, 76px);
  font-weight: 730;
  letter-spacing: -.045em;
  line-height: .98;
  text-shadow: 0 1px 0 rgba(255,255,255,.45);
}

.home-message h1 span {
  display: block;
}

.home-message h1 span:first-child {
  color: #0b2c62;
}

.home-message h1 span:nth-child(2) {
  color: #0c4f8f;
}

.home-message h1 span:last-child {
  color: #078eaf;
}

.home-cap {
  position: absolute;
  right: clamp(26px, 4.2vw, 82px);
  bottom: -1px;
  z-index: 2;
  display: block;
  height: 100%;
  aspect-ratio: 9 / 16;
  max-width: 38vw;
  overflow: visible;
  text-decoration: none;
  animation: home-cap-in 760ms ease-out both;
}

.home-cap__video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  background: transparent;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 9%, #000 91%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, #000 9%, #000 91%, transparent 100%);
  transition: transform 220ms ease, filter 220ms ease;
}

.home-cap:hover .home-cap__video,
.home-cap:focus-visible .home-cap__video {
  transform: scale(1.008);
  filter: saturate(1.04) contrast(1.01);
}

.home-cap:focus-visible,
.home-oruga:focus-visible {
  outline: 3px solid rgba(0,174,233,.55);
  outline-offset: 6px;
  border-radius: 24px;
}

@keyframes home-cap-in {
  from { opacity: 0; transform: translateY(22px); }
  to { opacity: 1; transform: translateY(0); }
}

.home-oruga {
  position: absolute;
  left: 54.5%;
  bottom: 10.5%;
  z-index: 4;
  display: block;
  width: clamp(112px, 10.5vw, 182px);
  color: inherit;
  text-decoration: none;
  opacity: 0;
  transform: translateX(-110vw);
  animation: home-oruga-entry 3.9s 900ms cubic-bezier(.22,.82,.28,1) forwards;
}

.home-oruga img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 11px 14px rgba(43,72,95,.14));
  transition: transform 180ms ease;
}

.home-oruga:hover img,
.home-oruga:focus-visible img {
  transform: scale(1.04);
}

@keyframes home-oruga-entry {
  0% { opacity: 0; transform: translateX(-110vw); }
  8% { opacity: 1; }
  100% { opacity: 1; transform: translateX(0); }
}

.home-agents {
  position: absolute;
  left: clamp(56px, 5vw, 96px);
  bottom: clamp(20px, 4vh, 42px);
  z-index: 5;
  display: grid;
  grid-template-columns: repeat(3, minmax(142px, auto));
  gap: 8px;
}

.home-agents__label {
  grid-column: 1 / -1;
  margin-bottom: 4px;
  color: #405d7d;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .12em;
  text-align: center;
  text-transform: uppercase;
}

.home-agents a {
  display: grid;
  grid-template-columns: 40px auto;
  align-items: center;
  gap: 9px;
  min-height: 56px;
  padding: 6px 12px 6px 7px;
  border: 1px solid rgba(24,79,131,.12);
  border-radius: 16px;
  background: rgba(255,255,255,.76);
  box-shadow: 0 11px 26px rgba(34,63,93,.08);
  color: #24405f;
  text-decoration: none;
  backdrop-filter: blur(13px);
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.home-agents a:hover,
.home-agents a:focus-visible {
  transform: translateY(-3px);
  border-color: rgba(0,174,233,.28);
  box-shadow: 0 16px 32px rgba(18,73,117,.13);
}

.home-agents strong,
.home-agents small {
  display: block;
}

.home-agents strong {
  font-size: 12px;
  letter-spacing: .02em;
}

.home-agents small {
  margin-top: 2px;
  color: #75879a;
  font-size: 9px;
}

.home-agent-thumb {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  overflow: hidden;
  border-radius: 12px;
  background: rgba(247,251,255,.96);
}

.home-agent-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
}

.home-agent-thumb--oruga img {
  padding: 3px;
  object-position: center;
}


.home-visit-counter {
  position: absolute;
  left: clamp(56px, 5vw, 96px);
  bottom: 8px;
  z-index: 6;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 24px;
  padding: 4px 9px;
  border: 1px solid rgba(24,79,131,.10);
  border-radius: 999px;
  background: rgba(255,255,255,.68);
  box-shadow: 0 8px 20px rgba(34,63,93,.06);
  color: #5d7188;
  font-size: 8px;
  font-weight: 720;
  letter-spacing: .055em;
  text-transform: uppercase;
  backdrop-filter: blur(10px);
}

.home-visit-counter[hidden] { display: none !important; }
.home-visit-counter strong {
  color: #0b4f89;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0;
}
.home-visit-counter[data-state="cached"] { opacity: .78; }

/* Páginas corporativas: una pantalla por destino. */
.screen-stage {
  position: relative;
  width: 100vw;
  height: calc(100dvh - 72px);
  min-height: 520px;
  overflow: hidden;
  isolation: isolate;
  background: linear-gradient(135deg, #f9fbfd 0%, #f1f6fa 55%, #ebf5f8 100%);
}

.screen-stage__background {
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(249,251,253,.94), rgba(249,251,253,.76) 56%, rgba(240,248,251,.74)),
    url("../img/fondo-aio-1400.webp") center / cover no-repeat;
  opacity: .96;
}

.screen-shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto auto;
  gap: clamp(12px, 1.8vh, 20px);
  width: min(1260px, calc(100vw - 64px));
  height: 100%;
  margin: 0 auto;
  padding: clamp(26px, 4vh, 46px) 0 clamp(16px, 2.4vh, 28px);
}

.screen-shell--center {
  place-content: center;
  justify-items: center;
  text-align: center;
}

.screen-heading {
  display: grid;
  grid-template-columns: minmax(280px, .8fr) minmax(360px, 1.2fr);
  align-items: end;
  column-gap: clamp(32px, 6vw, 92px);
}

.screen-heading > p {
  grid-column: 1;
  margin: 0 0 9px;
  color: #087ea4;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.screen-heading h1 {
  grid-column: 1;
  margin: 0;
  color: #08295d;
  font-size: clamp(34px, 4.2vw, 62px);
  font-weight: 730;
  letter-spacing: -.045em;
  line-height: .98;
}

.screen-heading > span {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: end;
  color: #52667f;
  font-size: clamp(14px, 1.25vw, 18px);
  line-height: 1.55;
}

.screen-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: clamp(10px, 1.4vw, 18px);
  min-height: 0;
}

.screen-grid--resources {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  grid-template-rows: 1fr;
}

.screen-card {
  position: relative;
  min-width: 0;
  overflow: hidden;
  padding: clamp(15px, 2vh, 22px);
  border: 1px solid rgba(24,79,131,.13);
  border-radius: 20px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 14px 34px rgba(25,55,86,.08);
  backdrop-filter: blur(12px);
}

.screen-card > span {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 9px;
  border-radius: 999px;
  background: rgba(7,133,230,.09);
  color: #087ea4;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .09em;
}

.screen-card h2,
.screen-card strong {
  display: block;
  margin: clamp(9px, 1.4vh, 14px) 0 0;
  color: #0a3169;
  font-size: clamp(15px, 1.45vw, 20px);
  font-weight: 760;
  line-height: 1.16;
}

.screen-card p {
  margin: clamp(6px, 1vh, 10px) 0 0;
  color: #5a6c82;
  font-size: clamp(11px, .94vw, 14px);
  line-height: 1.45;
}

.screen-card--download {
  display: flex;
  flex-direction: column;
  color: inherit;
  text-decoration: none;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.screen-card--download small {
  margin-top: auto;
  padding-top: 14px;
  color: #73859a;
  font-size: 10px;
}

.screen-card--download:hover,
.screen-card--download:focus-visible {
  transform: translateY(-4px);
  border-color: rgba(0,174,233,.35);
  box-shadow: 0 18px 38px rgba(18,73,117,.13);
}

.screen-note {
  min-height: 34px;
  display: flex;
  align-items: center;
  padding: 8px 13px;
  border-left: 3px solid #08aaca;
  border-radius: 0 12px 12px 0;
  background: rgba(255,255,255,.64);
  color: #49627c;
  font-size: clamp(10px, .9vw, 12px);
  line-height: 1.35;
}

.screen-utility {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 34px;
}

.screen-utility a,
.screen-primary-action {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 11px;
  border: 1px solid rgba(24,79,131,.12);
  border-radius: 999px;
  background: rgba(255,255,255,.68);
  color: #47627d;
  font-size: 10px;
  font-weight: 750;
  text-decoration: none;
}

.screen-utility a:hover,
.screen-utility a:focus-visible,
.screen-utility a[aria-current="page"],
.screen-primary-action:hover,
.screen-primary-action:focus-visible {
  color: #fff;
  border-color: #0b789b;
  background: #0b789b;
}

@media (max-width: 1320px) {
  .site-header__inner--wide {
    grid-template-columns: minmax(210px, 1fr) auto minmax(120px, 1fr);
    padding-inline: 28px;
    gap: 14px;
  }
  .site-nav__pill a { padding-inline: 10px; }
  .site-evin__prefix { display: none; }
  .home-cap { right: 2vw; max-width: 40vw; }
  .home-message { left: 5vw; width: 50vw; }
}

@media (max-width: 1080px) {
  .site-header__inner--wide {
    grid-template-columns: auto 1fr auto;
  }
  .site-brand--dark .site-brand__text { display: none; }
  .site-nav--dark { justify-self: end; }
  .site-evin { display: none; }
  .site-nav__pill a { font-size: 10px; padding-inline: 9px; }
  .home-message h1 { font-size: clamp(39px, 5.6vw, 58px); }
  .home-cap { height: 88%; }
  .home-agents { grid-template-columns: repeat(3, minmax(125px, auto)); left: 28px; }
  .screen-shell { width: calc(100vw - 40px); }
  .screen-grid--resources { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); }
}

@media (max-width: 880px) {
  .site-header--dark { height: 64px; }
  .site-header__inner--wide { min-height: 64px; grid-template-columns: 1fr auto; padding-inline: 16px; }
  .site-brand--dark img { width: 78px; margin-left: -8px; }
  .menu-toggle--dark { display: block; justify-self: end; }
  .site-nav--dark {
    position: fixed;
    inset: 64px 0 auto;
    z-index: 300;
    display: none;
    align-items: stretch;
    flex-direction: column;
    gap: 12px;
    padding: 16px 18px 20px;
    border-bottom: 1px solid rgba(255,255,255,.13);
    background: rgba(45,61,77,.985);
    box-shadow: 0 18px 32px rgba(8,24,39,.23);
  }
  .site-nav--dark.is-open { display: flex; }
  .site-nav__pill { display: grid; grid-template-columns: 1fr 1fr; border-radius: 18px; }
  .site-nav__pill a { min-height: 40px; }
  .language-nav--dark { align-self: center; }
  .site-nav__cta--light { justify-content: center; margin-top: 0; }
  .site-evin { display: none; }
  .home-stage,
  .screen-stage { height: calc(100dvh - 64px); min-height: 500px; }
  .home-message { left: 24px; top: 14%; width: 62vw; }
  .home-message h1 { font-size: clamp(33px, 8vw, 50px); gap: 10px; }
  .home-cap { right: -2vw; height: 74%; max-width: 46vw; }
  .home-oruga { left: 48%; bottom: 15%; width: clamp(86px, 14vw, 120px); }
  .home-agents { left: 18px; bottom: 16px; grid-template-columns: repeat(3, 1fr); width: min(72vw, 520px); }
  .home-visit-counter { left: 18px; bottom: 82px; }
  .home-agents a { min-width: 0; grid-template-columns: 32px minmax(0,1fr); padding-right: 7px; }
  .home-agent-thumb { width: 32px; height: 32px; }
  .home-agents small { display: none; }
  .screen-shell { width: calc(100vw - 28px); padding-block: 18px 12px; gap: 10px; }
  .screen-heading { grid-template-columns: 1fr; gap: 8px; }
  .screen-heading > p,
  .screen-heading h1,
  .screen-heading > span { grid-column: 1; grid-row: auto; }
  .screen-heading h1 { font-size: clamp(28px, 7vw, 42px); }
  .screen-heading > span { font-size: 12px; line-height: 1.4; }
  .screen-grid { grid-template-columns: repeat(2, minmax(0,1fr)); grid-template-rows: repeat(3, minmax(0,1fr)); gap: 8px; }
  .screen-grid--resources { grid-template-columns: repeat(2, minmax(0,1fr)); grid-template-rows: repeat(3, minmax(0,1fr)); }
  .screen-card { padding: 11px; border-radius: 15px; }
  .screen-card h2,
  .screen-card strong { font-size: 13px; margin-top: 7px; }
  .screen-card p { font-size: 10px; margin-top: 5px; line-height: 1.35; }
  .screen-note { min-height: 28px; padding: 6px 9px; font-size: 9px; }
  .screen-utility { gap: 4px; }
  .screen-utility a { min-height: 26px; padding-inline: 8px; font-size: 8px; }
}

@media (max-width: 560px) {
  .home-message { top: 11%; width: 78vw; }
  .home-message h1 { font-size: clamp(30px, 10vw, 42px); gap: 9px; }
  .home-cap { right: -7vw; height: 66%; max-width: 54vw; }
  .home-oruga { left: 42%; bottom: 17%; width: 78px; }
  .home-agents { width: calc(100vw - 28px); left: 14px; gap: 5px; }
  .home-visit-counter { left: 14px; bottom: 78px; min-height: 20px; padding: 3px 7px; font-size: 7px; }
  .home-visit-counter strong { font-size: 9px; }
  .home-agents__label { font-size: 8px; }
  .home-agents a { min-height: 48px; border-radius: 13px; }
  .home-agents strong { font-size: 10px; }
  .screen-shell { padding-top: 13px; }
  .screen-heading > p { margin-bottom: 4px; font-size: 8px; }
  .screen-heading h1 { font-size: clamp(25px, 8vw, 36px); }
  .screen-heading > span { font-size: 10px; }
  .screen-card > span { min-height: 19px; padding-inline: 6px; font-size: 7px; }
  .screen-card h2,
  .screen-card strong { font-size: 11px; }
  .screen-card p { font-size: 8.6px; }
  .screen-note { display: none; }
}

@media (max-height: 680px) and (min-width: 881px) {
  .home-message { top: 20%; }
  .home-message h1 { font-size: clamp(38px, 4.6vw, 62px); }
  .home-cap { height: 92%; }
  .home-agents { bottom: 12px; }
  .home-visit-counter { bottom: 78px; }
  .screen-shell { padding-block: 18px 12px; gap: 9px; }
  .screen-heading h1 { font-size: clamp(30px, 3.7vw, 48px); }
  .screen-heading > span { font-size: 13px; }
  .screen-card { padding: 13px; }
  .screen-card h2,
  .screen-card strong { margin-top: 8px; font-size: 15px; }
  .screen-card p { margin-top: 5px; font-size: 10px; line-height: 1.35; }
  .screen-note { min-height: 28px; padding-block: 5px; }
  .screen-utility { min-height: 26px; }
}

@media (prefers-reduced-motion: reduce) {
  .home-oruga {
    opacity: 1;
    transform: translateX(0);
    animation: none !important;
  }
}

/* VIA WEB 16.4.0 — Video CAP VIA controlado por intención humana */
.home-cap {
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

.home-cap__play-indicator,
.home-cap__end-hint {
  position: absolute;
  z-index: 5;
  pointer-events: none;
  opacity: 0;
  transition: opacity 220ms ease, transform 220ms ease;
}

.home-cap__play-indicator {
  left: 50%;
  top: 50%;
  display: grid;
  place-items: center;
  width: clamp(50px, 4.4vw, 72px);
  aspect-ratio: 1;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 50%;
  background: rgba(7, 38, 72, .28);
  box-shadow: 0 12px 34px rgba(8, 39, 68, .18);
  color: #fff;
  backdrop-filter: blur(8px);
  transform: translate(-50%, -50%) scale(.94);
}

.home-cap__play-indicator span {
  margin-left: .08em;
  font-size: clamp(20px, 1.8vw, 29px);
  line-height: 1;
}

.home-cap:not(.is-playing):not(.is-ended) .home-cap__play-indicator,
.home-cap:hover:not(.is-playing):not(.is-ended) .home-cap__play-indicator,
.home-cap:focus-visible:not(.is-playing):not(.is-ended) .home-cap__play-indicator {
  opacity: .9;
  transform: translate(-50%, -50%) scale(1);
}

.home-cap__end-hint {
  left: 50%;
  bottom: clamp(24px, 4.6vh, 52px);
  max-width: 82%;
  padding: 8px 13px;
  border: 1px solid rgba(255, 255, 255, .7);
  border-radius: 999px;
  background: rgba(248, 252, 255, .78);
  box-shadow: 0 10px 28px rgba(16, 52, 81, .14);
  color: #173858;
  font-size: clamp(10px, .82vw, 13px);
  font-weight: 700;
  letter-spacing: .02em;
  text-align: center;
  white-space: nowrap;
  backdrop-filter: blur(10px);
  transform: translate(-50%, 8px);
}

.home-cap.is-ended .home-cap__end-hint {
  opacity: .92;
  transform: translate(-50%, 0);
  animation: cap-end-hint-pulse 2.8s ease-in-out infinite;
}

.home-cap.is-playing .home-cap__video {
  filter: saturate(1.04) contrast(1.01);
}

@keyframes cap-end-hint-pulse {
  0%, 100% { box-shadow: 0 10px 28px rgba(16, 52, 81, .14); }
  50% { box-shadow: 0 12px 34px rgba(0, 153, 204, .24); }
}

@media (prefers-reduced-motion: reduce) {
  .home-cap.is-ended .home-cap__end-hint { animation: none; }
}

/* VIA WEB — Presentación específica del PIT Compartido. Solo página Producto. */
.pit-product-stage .screen-stage__background {
  background:
    radial-gradient(circle at 62% 46%, rgba(255,255,255,.2), transparent 34%),
    linear-gradient(90deg, rgba(249,251,253,.97), rgba(247,250,252,.88) 48%, rgba(237,246,250,.78)),
    url("../img/fondo-aio-1400.webp") center / cover no-repeat;
}

.pit-product-shell {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: clamp(8px, 1.4vh, 14px);
  width: min(1440px, calc(100vw - 64px));
  height: 100%;
  margin: 0 auto;
  padding: clamp(20px, 3vh, 34px) 0 clamp(12px, 1.8vh, 20px);
}

.pit-showcase {
  display: grid;
  grid-template-columns: minmax(390px, .9fr) minmax(560px, 1.1fr);
  gap: clamp(24px, 3.5vw, 54px);
  min-height: 0;
}

.pit-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
  padding: clamp(4px, 1vh, 12px) 0;
}

.pit-eyebrow {
  margin: 0 0 clamp(8px, 1.1vh, 13px);
  color: #0788ab;
  font-size: clamp(9px, .72vw, 11px);
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.pit-copy h1 {
  margin: 0;
  color: #08295d;
  font-size: clamp(38px, 3.65vw, 62px);
  font-weight: 745;
  letter-spacing: -.045em;
  line-height: .99;
}

.pit-lead {
  max-width: 650px;
  margin: clamp(13px, 1.8vh, 20px) 0 0;
  color: #4f647d;
  font-size: clamp(13px, 1vw, 16px);
  line-height: 1.52;
}

.pit-quote {
  margin: clamp(12px, 1.7vh, 18px) 0 0;
  padding: clamp(10px, 1.3vh, 14px) clamp(14px, 1.5vw, 20px);
  border-left: 4px solid #08aaca;
  border-radius: 0 14px 14px 0;
  background: rgba(255,255,255,.7);
  box-shadow: 0 12px 28px rgba(25,55,86,.06);
  color: #0a376f;
  font-size: clamp(14px, 1.15vw, 18px);
  font-style: normal;
  font-weight: 760;
  line-height: 1.3;
}

.pit-principles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(8px, 1vw, 12px);
  margin-top: clamp(13px, 2vh, 20px);
}

.pit-principle {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  min-width: 0;
  padding: clamp(9px, 1.15vh, 12px);
  border: 1px solid rgba(24,79,131,.12);
  border-radius: 15px;
  background: rgba(255,255,255,.7);
  box-shadow: 0 10px 24px rgba(25,55,86,.055);
  backdrop-filter: blur(10px);
}

.pit-principle > span {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 10px;
  background: linear-gradient(145deg, rgba(7,133,230,.13), rgba(8,170,202,.11));
  color: #087ea4;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .05em;
}

.pit-principle strong,
.pit-principle small {
  display: block;
}

.pit-principle strong {
  color: #143d71;
  font-size: clamp(11px, .88vw, 13px);
  line-height: 1.2;
}

.pit-principle small {
  margin-top: 4px;
  color: #64778d;
  font-size: clamp(9px, .7vw, 10.5px);
  line-height: 1.35;
}

.pit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: clamp(12px, 1.8vh, 18px);
}

.pit-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0 15px;
  border: 1px solid rgba(24,79,131,.18);
  border-radius: 999px;
  background: rgba(255,255,255,.76);
  color: #244b73;
  font-size: 10px;
  font-weight: 800;
  text-decoration: none;
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.pit-action--primary {
  border-color: #0b789b;
  background: #0b789b;
  color: #fff;
}

.pit-action:hover,
.pit-action:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 12px 25px rgba(18,73,117,.14);
}

.pit-visual {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: clamp(8px, 1.2vh, 12px);
  min-width: 0;
  min-height: 0;
}

.pit-console {
  position: relative;
  min-width: 0;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(24,79,131,.16);
  border-radius: 25px;
  background: rgba(255,255,255,.8);
  box-shadow: 0 24px 54px rgba(22,59,94,.15);
}

.pit-console::after {
  position: absolute;
  inset: auto 0 0;
  height: 29%;
  background: linear-gradient(to top, rgba(6,31,66,.58), transparent);
  content: "";
  pointer-events: none;
}

.pit-console__bar {
  position: absolute;
  inset: 14px 14px auto;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 38px;
  padding: 0 13px;
  border: 1px solid rgba(255,255,255,.46);
  border-radius: 13px;
  background: rgba(13,48,82,.79);
  color: #fff;
  box-shadow: 0 12px 28px rgba(6,31,66,.18);
  backdrop-filter: blur(12px);
}

.pit-console__bar span {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
}

.pit-console__bar i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #1dd890;
  box-shadow: 0 0 0 4px rgba(29,216,144,.15);
}

.pit-console__bar small {
  color: #b9eaf3;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .08em;
}

.pit-console img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 45%;
}

.pit-console figcaption {
  position: absolute;
  z-index: 3;
  right: 22px;
  bottom: 18px;
  left: 22px;
  color: #fff;
  font-size: clamp(10px, .8vw, 12px);
  font-weight: 650;
  line-height: 1.4;
  text-shadow: 0 2px 14px rgba(5,27,52,.68);
}

.pit-capability {
  position: absolute;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid rgba(255,255,255,.6);
  border-radius: 999px;
  background: rgba(255,255,255,.86);
  color: #18466e;
  box-shadow: 0 9px 22px rgba(11,42,72,.13);
  font-size: 9px;
  font-weight: 800;
  backdrop-filter: blur(8px);
}

.pit-capability--one { left: 18px; top: 68px; }
.pit-capability--two { right: 18px; top: 68px; }
.pit-capability--three { right: 18px; bottom: 72px; }

.pit-flow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

.pit-flow > div {
  position: relative;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid rgba(24,79,131,.11);
  border-radius: 13px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 9px 22px rgba(25,55,86,.055);
  text-align: center;
}

.pit-flow > div:not(:last-child)::after {
  position: absolute;
  top: 50%;
  right: -7px;
  z-index: 2;
  width: 14px;
  color: #0aa4c4;
  content: "→";
  font-size: 13px;
  font-weight: 900;
  transform: translateY(-50%);
}

.pit-flow strong,
.pit-flow span {
  display: block;
}

.pit-flow strong {
  color: #103a6c;
  font-size: 10px;
}

.pit-flow span {
  margin-top: 2px;
  overflow: hidden;
  color: #687b90;
  font-size: 8px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pit-product-utility {
  min-height: 28px;
}

@media (max-width: 1120px) {
  .pit-product-shell { width: calc(100vw - 40px); }
  .pit-showcase { grid-template-columns: minmax(340px, .9fr) minmax(440px, 1.1fr); gap: 24px; }
  .pit-copy h1 { font-size: clamp(35px, 4.4vw, 51px); }
  .pit-principle small { font-size: 9px; }
  .pit-capability { font-size: 8px; }
}

@media (max-width: 880px) {
  .pit-product-shell {
    width: calc(100vw - 24px);
    padding-block: 12px 9px;
    gap: 7px;
  }
  .pit-showcase {
    grid-template-columns: 1fr;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 8px;
  }
  .pit-copy { padding: 0; }
  .pit-eyebrow { margin-bottom: 5px; font-size: 8px; }
  .pit-copy h1 { font-size: clamp(28px, 6.1vw, 40px); line-height: .98; }
  .pit-lead { margin-top: 7px; font-size: 10px; line-height: 1.35; }
  .pit-quote { margin-top: 7px; padding: 7px 10px; font-size: 11px; }
  .pit-principles { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; margin-top: 7px; }
  .pit-principle { grid-template-columns: 22px minmax(0,1fr); gap: 6px; padding: 6px; border-radius: 11px; }
  .pit-principle > span { width: 22px; height: 22px; border-radius: 7px; font-size: 7px; }
  .pit-principle strong { font-size: 9px; }
  .pit-principle small { display: none; }
  .pit-actions { margin-top: 7px; }
  .pit-action { min-height: 29px; padding-inline: 10px; font-size: 8px; }
  .pit-console { border-radius: 18px; }
  .pit-console__bar { inset: 8px 8px auto; min-height: 29px; padding-inline: 9px; border-radius: 10px; }
  .pit-console__bar span { font-size: 8px; }
  .pit-console__bar small { font-size: 6px; }
  .pit-capability { min-height: 22px; padding-inline: 7px; font-size: 7px; }
  .pit-capability--one { left: 10px; top: 45px; }
  .pit-capability--two { right: 10px; top: 45px; }
  .pit-capability--three { right: 10px; bottom: 52px; }
  .pit-console figcaption { right: 13px; bottom: 10px; left: 13px; font-size: 8px; }
  .pit-flow > div { padding: 6px 4px; border-radius: 9px; }
  .pit-flow strong { font-size: 8px; }
  .pit-flow span { font-size: 6.7px; }
  .pit-product-utility { min-height: 24px; }
}

@media (max-width: 560px) {
  .pit-product-shell { padding-top: 9px; }
  .pit-copy h1 { font-size: clamp(25px, 7.8vw, 33px); }
  .pit-lead { font-size: 8.7px; }
  .pit-quote { font-size: 9.5px; }
  .pit-principles { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .pit-principle:nth-child(n+3) { display: none; }
  .pit-actions { position: absolute; right: 12px; top: 9px; margin: 0; }
  .pit-action { display: none; }
  .pit-action--primary { display: inline-flex; min-height: 25px; padding-inline: 8px; font-size: 7px; }
  .pit-capability--three { display: none; }
  .pit-flow { gap: 4px; }
  .pit-flow > div { padding: 5px 2px; }
  .pit-flow > div:not(:last-child)::after { right: -5px; width: 10px; font-size: 10px; }
  .pit-flow span { display: none; }
  .pit-product-utility a { font-size: 7px; padding-inline: 7px; }
}

@media (max-height: 700px) and (min-width: 881px) {
  .pit-product-shell { padding-block: 14px 10px; gap: 7px; }
  .pit-copy h1 { font-size: clamp(33px, 3.4vw, 49px); }
  .pit-lead { margin-top: 10px; font-size: 12px; line-height: 1.38; }
  .pit-quote { margin-top: 9px; padding-block: 8px; font-size: 14px; }
  .pit-principles { margin-top: 9px; gap: 7px; }
  .pit-principle { padding: 8px; }
  .pit-principle small { font-size: 8.5px; }
  .pit-actions { margin-top: 9px; }
  .pit-console__bar { inset: 10px 10px auto; }
  .pit-capability--one,
  .pit-capability--two { top: 56px; }
  .pit-flow > div { padding-block: 6px; }
}


/* 16.4.0 — cierre institucional, evidencia PIT real y contacto navegable. */
.pit-console--real {
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #eef5f8, #f8fbfd);
}
.pit-console--real::after { height: 24%; }
.pit-console--real img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  padding: 58px 10px 34px;
}
.screen-note--actions {
  justify-content: space-between;
  gap: 12px;
}
.screen-note--actions > span { min-width: 0; }
.screen-note__actions {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  gap: 6px;
}
.screen-note__actions .screen-primary-action {
  min-height: 28px;
  background: rgba(255,255,255,.82);
}
.contact-email {
  overflow-wrap: anywhere;
  color: #0b527d !important;
  font-weight: 750;
}
.copy-email {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  margin-top: 10px;
  padding: 0 11px;
  border: 1px solid rgba(11,120,155,.25);
  border-radius: 999px;
  background: rgba(255,255,255,.88);
  color: #0b527d;
  font: inherit;
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
}
.copy-email:hover,
.copy-email:focus-visible { background: #0b789b; color: #fff; }
.copy-email__status {
  display: inline-block;
  min-height: 1em;
  margin-left: 7px;
  color: #517085;
  font-size: 9px;
}

@media (max-width: 880px) {
  .pit-console--real img { padding: 40px 6px 24px; }
  .screen-note--actions { align-items: flex-start; }
  .screen-note__actions .screen-primary-action { min-height: 24px; padding-inline: 8px; font-size: 8px; }
}
@media (max-width: 560px) {
  .pit-actions { position: static; margin-top: 7px; }
  .pit-action { display: inline-flex; min-height: 25px; padding-inline: 8px; font-size: 7px; }
  .pit-console--real img { padding: 34px 4px 18px; }
  .pit-console--real figcaption { display: none; }
  .screen-note--actions { display: flex; min-height: 30px; padding: 4px 6px; }
  .screen-note--actions > span { display: none; }
  .screen-note__actions { width: 100%; justify-content: center; }
  .screen-note__actions .screen-primary-action { min-height: 23px; padding-inline: 7px; font-size: 7px; }
  .copy-email { min-height: 24px; margin-top: 6px; padding-inline: 7px; font-size: 7.5px; }
  .copy-email__status { display: block; margin: 4px 0 0; font-size: 7px; }
}

/* VIA WEB 16.6.2 — contador agregado de visitas, opt-in y resiliente. */

/* VIA WEB 16.6.2 — identidad profesional del fundador. */
.screen-inline-link {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  margin-top: 8px;
  padding: 0 9px;
  border: 1px solid rgba(11,120,155,.22);
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: #0b527d;
  font-size: 9px;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
}
.screen-inline-link:hover,
.screen-inline-link:focus-visible { background: #0b789b; color: #fff; }
.screen-primary-action--external::after { content: " ↗"; }
@media (max-width: 560px) {
  .screen-inline-link { min-height: 21px; margin-top: 5px; padding-inline: 7px; font-size: 7px; }
}

/* ========================================================================== 
   VIA WEB 16.6.2 — Portada móvil en flujo + CTA post-video siempre visible
   Alcance: solo home en teléfonos. Desktop y páginas internas no se alteran.
   ========================================================================== */
@media (max-width: 560px) {
  html:has(body.viewport-page),
  body.viewport-page {
    height: auto;
    min-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
  }

  body.home-page {
    background: #f5f8fb;
  }

  .home-stage {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
    min-height: calc(100dvh - 64px);
    padding: 34px 16px 24px;
    overflow: hidden;
  }

  .home-stage__background,
  .home-stage__background img,
  .home-stage__veil {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }

  .home-stage__background img {
    object-fit: cover;
    object-position: 42% center;
  }

  .home-message {
    position: relative;
    left: auto;
    top: auto;
    z-index: 3;
    order: 1;
    width: 100%;
    margin: 0;
  }

  .home-message h1 {
    gap: 6px;
    width: 100%;
    font-size: clamp(34px, 9.8vw, 42px);
    line-height: .98;
  }

  .home-cap {
    position: relative;
    right: auto;
    bottom: auto;
    z-index: 4;
    order: 2;
    width: min(92vw, 430px);
    height: auto;
    max-width: 100%;
    aspect-ratio: 4 / 5;
    margin: 22px auto 0;
    overflow: hidden;
    border-radius: 24px;
    box-shadow: 0 18px 42px rgba(25, 59, 88, .13);
    animation: none;
  }

  .home-cap__video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 24%;
    -webkit-mask-image: none;
    mask-image: none;
  }

  .home-cap__play-indicator {
    width: 62px;
  }

  .home-cap__end-hint {
    left: 50%;
    bottom: 16px;
    z-index: 9;
    width: max-content;
    max-width: calc(100% - 28px);
    padding: 9px 14px;
    font-size: 11px;
    white-space: normal;
    line-height: 1.2;
  }

  .home-oruga {
    position: relative;
    left: -25%;
    bottom: auto;
    z-index: 6;
    order: 3;
    align-self: center;
    width: 76px;
    margin: -92px 0 25px;
    opacity: 1;
    transform: none;
    animation: none;
  }

  .home-agents {
    position: relative;
    left: auto;
    bottom: auto;
    z-index: 5;
    order: 4;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    gap: 7px;
    margin: 0;
  }

  .home-agents__label {
    margin: 0 0 5px;
    font-size: 8px;
    letter-spacing: .1em;
  }

  .home-agents a {
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 6px;
    min-width: 0;
    min-height: 54px;
    padding: 6px 7px;
    border-radius: 14px;
  }

  .home-agent-thumb {
    width: 34px;
    height: 34px;
    border-radius: 10px;
  }

  .home-agents strong {
    overflow: hidden;
    font-size: 10px;
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .home-agents small {
    display: none;
  }

  .home-visit-counter {
    position: relative;
    left: auto;
    bottom: auto;
    z-index: 5;
    order: 5;
    align-self: flex-start;
    min-height: 22px;
    margin: 9px 0 0;
    padding: 4px 8px;
    font-size: 7px;
  }

  .home-visit-counter strong {
    font-size: 9px;
  }
}

@media (max-width: 380px) {
  .home-stage {
    padding-inline: 12px;
  }

  .home-message h1 {
    font-size: clamp(31px, 9.7vw, 37px);
  }

  .home-cap {
    width: 100%;
    border-radius: 20px;
  }

  .home-agents {
    gap: 5px;
  }

  .home-agents a {
    grid-template-columns: 30px minmax(0, 1fr);
    min-height: 50px;
    padding: 5px;
  }

  .home-agent-thumb {
    width: 30px;
    height: 30px;
  }

  .home-agents strong {
    font-size: 9px;
  }
}


/* ========================================================================== 
   VIA WEB 16.6.2 — CAP integrada al entorno AIO + responsive
   ========================================================================== */
.commercial-home { min-height: 100%; overflow-x: hidden; background: #fff; }
.commercial-home .site-header--dark { position: sticky; top: 0; }
.home-commercial-hero {
  background: #e9ebef url("../img/fondo-aio-1400.webp") center / cover no-repeat;
}
.home-commercial-hero::before {
  z-index: 0;
  background: linear-gradient(90deg, rgba(244,248,252,.88) 0%, rgba(244,248,252,.70) 42%, rgba(244,248,252,.20) 68%, rgba(244,248,252,.04) 100%);
  background-size: auto;
  mask-image: none;
}
.home-commercial-hero .hero__inner { z-index: 1; }
.home-commercial-hero .hero__visual {
  min-height: 590px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}
.home-commercial-hero .hero__visual::before { display: none; }
.hero__cap-link {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  border-radius: 30px;
  text-decoration: none;
  cursor: pointer;
}
.home-commercial-hero .hero__avatar {
  position: relative;
  right: auto;
  bottom: auto;
  width: auto;
  height: min(650px, 77vh);
  max-width: 100%;
  object-fit: contain;
  object-position: right bottom;
  filter: drop-shadow(0 24px 34px rgba(20,54,88,.18));
  transform-origin: 62% 100%;
  transition: transform 180ms ease, filter 180ms ease;
}
.hero__cap-link:hover .hero__avatar,
.hero__cap-link:focus-visible .hero__avatar {
  transform: translateY(-4px) scale(1.012);
  filter: drop-shadow(0 28px 38px rgba(20,54,88,.24));
}
.hero__cap-link:focus-visible {
  outline: 3px solid rgba(9,105,218,.32);
  outline-offset: 6px;
}
.flow-grid--4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
.home-agent-card { color: inherit; text-decoration: none; transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; }
.home-agent-card:hover, .home-agent-card:focus-visible { transform: translateY(-4px); border-color: rgba(9,105,218,.34); box-shadow: 0 18px 38px rgba(18,73,117,.13); }
.home-agent-card img { object-fit: contain; }
.home-inline-link { display: inline-flex; margin-left: 12px; color: rgba(255,255,255,.82); font-size: 13px; font-weight: 750; text-decoration: none; }
.home-inline-link:hover, .home-inline-link:focus-visible { color: #fff; text-decoration: underline; }
.home-eyebrow-light { color: #63e1dd; }
.home-button-ghost { border-color: rgba(255,255,255,.28); background: transparent; color: #fff; }
.home-button-ghost:hover, .home-button-ghost:focus-visible { background: rgba(255,255,255,.08); }
.pit-fit { margin: 10px 0 0; color: #52667f; font-size: clamp(10px,.82vw,12px); line-height: 1.45; }
.pit-fit strong { color: #0a376f; }
.screen-grid--how-primary { grid-template-columns: repeat(4,minmax(0,1fr)); grid-template-rows: 1fr; }
.contact-mailto { display: inline-flex; align-items:center; justify-content:center; min-height: 30px; margin-top: 9px; padding: 0 11px; border-radius: 999px; background:#0b789b; color:#fff; font-size:9px; font-weight:850; text-decoration:none; }
.contact-mailto:hover,.contact-mailto:focus-visible { background:#085f7b; }
.aio-intro__actions { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:16px; }
.aio-intro__actions a { display:inline-flex; align-items:center; justify-content:center; min-height:34px; padding:0 12px; border:1px solid rgba(7,133,230,.18); border-radius:999px; background:rgba(255,255,255,.78); color:#164e7d; font-size:10px; font-weight:800; text-decoration:none; }
.aio-intro__actions a:first-child { border-color:#0b789b; background:#0b789b; color:#fff; }
@media (max-width: 1180px) {
  .flow-grid--4 { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .screen-grid--how-primary { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 880px) {
  .commercial-home .site-nav__pill { grid-template-columns: 1fr 1fr; }
  .home-commercial-hero .hero__visual { min-height: 500px; }
}
@media (max-width: 780px) {
  .commercial-home .site-nav--dark { inset: 64px 0 auto; }
  .commercial-home .site-nav__pill { display:grid; width:100%; grid-template-columns:1fr 1fr; border-radius:18px; }
  .commercial-home .site-nav__pill a { min-height:40px; }
  .commercial-home .hero__inner { padding-top:56px; }
  .flow-grid--4 { grid-template-columns:1fr; }
  .home-inline-link { margin: 12px 0 0; display:flex; }
}
@media (max-width: 780px) {
  .home-commercial-hero { background-position: 56% center; }
  .home-commercial-hero::before {
    background: linear-gradient(180deg, rgba(244,248,252,.90) 0%, rgba(244,248,252,.74) 48%, rgba(244,248,252,.18) 76%, rgba(244,248,252,.04) 100%);
  }
  .home-commercial-hero .hero__visual { min-height:500px; margin-top:-18px; }
  .hero__cap-link { justify-content:center; }
  .home-commercial-hero .hero__avatar { width:min(82vw,470px); height:auto; max-height:500px; object-position:center bottom; }
}
@media (max-width: 520px) {
  .commercial-home .hero h1 { font-size: clamp(38px,12vw,52px); }
  .commercial-home .hero__lead { font-size:16px; line-height:1.55; }
  .commercial-home .hero__actions { display:grid; grid-template-columns:1fr; }
  .commercial-home .button { width:100%; }
  .commercial-home .hero__proof { display:grid; grid-template-columns:1fr; }
  .home-commercial-hero { background-position: 58% center; }
  .home-commercial-hero::before {
    background: linear-gradient(180deg, rgba(244,248,252,.88) 0%, rgba(244,248,252,.68) 54%, rgba(244,248,252,.16) 78%, rgba(244,248,252,.04) 100%);
  }
  .home-commercial-hero .hero__visual { min-height:430px; border-radius:0; }
  .hero__cap-link { justify-content:center; }
  .home-commercial-hero .hero__avatar { width:min(92vw,430px); height:auto; max-height:430px; object-position:center bottom; }
  .section { padding:58px 0; }
  .section__header p { font-size:16px; }
  .demo-panel { padding:26px 20px; border-radius:24px; }
  .demo-panel h2 { font-size:34px; }
  .agent-card { min-height:auto; }
  .agent-card img { height:170px; }
  .evidence-item { min-height:auto; }
  .screen-grid--how-primary { grid-template-columns:1fr 1fr; }
  .aio-intro__actions { display:grid; grid-template-columns:1fr; width:100%; }
}
@media (max-width: 380px) {
  .screen-grid--how-primary { grid-template-columns:1fr; }
}


/* ========================================================================== 
   VIA WEB 16.6.2 — Cadena visual CAP → PIT → Persona → EVIN
   ========================================================================== */
.home-commercial-hero .hero h1 {
  max-width: 760px;
  font-size: clamp(40px, 4.55vw, 64px);
}

.screen-card--operation {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.operation-visual {
  position: relative;
  flex: 1 1 auto;
  min-height: 220px;
  margin: clamp(16px, 2.4vh, 26px) -4px -4px;
  color: #2a6d95;
}

.operation-visual::before {
  content: "";
  position: absolute;
  inset: 8% 2% 0;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 52%, rgba(8,170,202,.10), rgba(9,105,218,.035) 44%, transparent 72%);
  pointer-events: none;
}

.operation-visual svg {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  min-height: inherit;
  overflow: visible;
}

.operation-visual .op-surface {
  fill: rgba(255,255,255,.68);
  stroke: rgba(33,101,151,.22);
  stroke-width: 1.6;
}
.operation-visual .op-surface--strong {
  fill: rgba(244,251,253,.92);
  stroke: rgba(8,150,185,.34);
}
.operation-visual .op-frame {
  fill: rgba(247,251,253,.46);
  stroke: rgba(28,84,136,.24);
  stroke-width: 1.7;
}
.operation-visual .op-line {
  fill: none;
  stroke: rgba(42,92,135,.45);
  stroke-width: 3;
  stroke-linecap: round;
}
.operation-visual .op-route,
.operation-visual .op-link,
.operation-visual .op-memory,
.operation-visual .op-authority,
.operation-visual .op-archive {
  fill: none;
  stroke: rgba(9,130,168,.28);
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.operation-visual .op-route { stroke-dasharray: 5 7; }
.operation-visual .op-route--timeline { stroke-dasharray: none; stroke: rgba(24,84,134,.24); }
.operation-visual .op-link--strong { stroke: rgba(8,164,194,.52); stroke-width: 2.8; }
.operation-visual .op-halo {
  fill: rgba(14,181,199,.035);
  stroke: rgba(8,169,197,.16);
  stroke-width: 1.5;
  stroke-dasharray: 5 7;
}
.operation-visual .op-core {
  fill: rgba(235,249,251,.86);
  stroke: rgba(8,150,185,.38);
  stroke-width: 2.2;
}
.operation-visual .op-core-mark {
  fill: rgba(255,255,255,.86);
  stroke: rgba(17,88,140,.34);
  stroke-width: 1.7;
}
.operation-visual .op-core-dot,
.operation-visual .op-dot,
.operation-visual .op-terminal {
  fill: #0fa9bd;
}
.operation-visual .op-terminal--in { fill: #517b9d; }
.operation-visual .op-node {
  fill: #f9fcfd;
  stroke: rgba(35,94,141,.45);
  stroke-width: 2;
}
.operation-visual .op-node--accent,
.operation-visual .op-node--final {
  fill: #dff7f6;
  stroke: rgba(8,164,194,.72);
}
.operation-visual .op-accent-soft {
  fill: rgba(40,201,196,.16);
  stroke: rgba(8,164,194,.36);
  stroke-width: 1.5;
}
.operation-visual .op-check {
  fill: none;
  stroke: #0a9cae;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.operation-visual .op-check--large { stroke-width: 3; }
.operation-visual .op-person-head {
  fill: rgba(246,251,253,.96);
  stroke: rgba(26,85,137,.38);
  stroke-width: 2;
}
.operation-visual .op-person {
  fill: rgba(233,246,249,.72);
  stroke: rgba(26,85,137,.38);
  stroke-width: 2;
  stroke-linecap: round;
}
.operation-visual .op-person--small { stroke-width: 1.7; }
.operation-visual .op-tick {
  fill: none;
  stroke: rgba(25,93,143,.30);
  stroke-width: 1.7;
}

@media (max-width: 1180px) {
  .operation-visual { min-height: 190px; margin-top: 12px; }
}

@media (max-width: 880px) {
  .screen-page--how .screen-stage {
    height: auto;
    min-height: calc(100dvh - 64px);
    overflow: visible;
  }
  .screen-page--how .screen-shell {
    height: auto;
    min-height: calc(100dvh - 64px);
    grid-template-rows: auto auto auto auto;
    padding-bottom: 22px;
  }
  .screen-page--how .screen-grid--how-primary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
    grid-auto-rows: minmax(300px, auto);
  }
  .screen-page--how .screen-card--operation { min-height: 300px; }
  .operation-visual { min-height: 180px; }
}

@media (max-width: 560px) {
  .commercial-home .hero h1 { font-size: clamp(36px, 11vw, 48px); }
  .screen-page--how .screen-grid--how-primary {
    grid-template-columns: 1fr;
    grid-auto-rows: minmax(330px, auto);
  }
  .screen-page--how .screen-card--operation {
    min-height: 330px;
    padding: 16px;
  }
  .screen-page--how .screen-card--operation > span { font-size: 8px; }
  .screen-page--how .screen-card--operation h2 { font-size: 16px; }
  .screen-page--how .screen-card--operation p { font-size: 12px; line-height: 1.45; }
  .operation-visual { min-height: 215px; margin-top: 12px; }
  .screen-page--how .screen-note { display: flex; font-size: 9px; }
}

@media (max-width: 380px) {
  .screen-page--how .screen-grid--how-primary { grid-template-columns: 1fr; }
  .operation-visual { min-height: 195px; }
}

/* La página Cómo funciona necesita desplazamiento natural al pasar a 2×2/1 columna. */
@media (max-width: 880px) {
  html:has(body.screen-page--how),
  body.screen-page--how {
    height: auto;
    min-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
  }
}


/* ========================================================================== 
   VIA WEB 16.7.0 — Navegación por pantallas, sin scroll de página
   Cada destino ocupa un viewport; el recorrido continúa mediante botones.
   ========================================================================== */
html { height: 100%; }
body.no-scroll-home,
body.viewport-page,
body.journey-page { height: 100dvh; min-height: 100%; overflow: hidden !important; }

.no-scroll-home #main-content {
  position: relative;
  height: calc(100dvh - 72px);
  overflow: hidden;
}
.no-scroll-home .home-commercial-hero {
  height: 100%;
  min-height: 0;
  padding: 0;
}
.no-scroll-home .home-commercial-hero .hero__inner {
  height: 100%;
  min-height: 0;
  padding-top: clamp(28px, 5vh, 70px);
  padding-bottom: clamp(54px, 8vh, 86px);
}
.no-scroll-home .site-footer { display: none !important; }

.journey-stage,
.journey-page .screen-stage {
  height: calc(100dvh - 72px) !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
.journey-shell,
.journey-page .screen-shell {
  height: 100% !important;
  min-height: 0 !important;
  grid-template-rows: auto minmax(0,1fr) auto;
  padding-bottom: clamp(12px,2vh,20px);
}
.journey-page .screen-note { display: none; }

.journey-nav {
  display: grid;
  grid-template-columns: minmax(116px,1fr) auto minmax(116px,1fr);
  align-items: center;
  gap: 10px;
  min-height: 42px;
}
.journey-nav--home {
  position: absolute;
  z-index: 10;
  right: max(22px, calc((100vw - 1180px)/2));
  bottom: clamp(12px,2.2vh,22px);
  width: min(520px, calc(100vw - 44px));
  grid-template-columns: auto minmax(160px,1fr);
}
.journey-nav__step {
  justify-self: center;
  color: #668096;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .12em;
  white-space: nowrap;
}
.journey-nav__button {
  display: grid;
  gap: 1px;
  min-height: 40px;
  padding: 7px 13px;
  border: 1px solid rgba(24,79,131,.13);
  border-radius: 15px;
  background: rgba(255,255,255,.82);
  color: #284d69;
  text-decoration: none;
  box-shadow: 0 9px 24px rgba(25,55,86,.07);
  backdrop-filter: blur(12px);
}
.journey-nav__button--next { justify-self: end; text-align: right; }
.journey-nav__button--prev { justify-self: start; }
.journey-nav__button small { color:#7890a3; font-size:7.5px; font-weight:750; text-transform:uppercase; letter-spacing:.08em; }
.journey-nav__button strong { font-size:10.5px; line-height:1.1; }
.journey-nav__button:hover,
.journey-nav__button:focus-visible { border-color:#0b789b; background:#0b789b; color:#fff; outline:none; }
.journey-nav__button:hover small,
.journey-nav__button:focus-visible small { color:rgba(255,255,255,.72); }

.journey-heading { align-items:center; }
.journey-grid { display:grid; min-height:0; gap:clamp(10px,1.4vw,18px); }
.journey-grid--3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.journey-card {
  min-height:0;
  padding:clamp(20px,3vh,34px);
  border:1px solid rgba(24,79,131,.13);
  border-radius:24px;
  background:rgba(255,255,255,.78);
  box-shadow:0 16px 36px rgba(25,55,86,.08);
  backdrop-filter:blur(12px);
}
.journey-card > span,
.journey-agent span { color:#06a4c5; font-size:9px; font-weight:900; letter-spacing:.11em; }
.journey-card h2 { margin:13px 0 0; color:#0a3169; font-size:clamp(19px,1.6vw,25px); line-height:1.12; }
.journey-card p { margin:10px 0 0; color:#596d82; font-size:clamp(12px,1vw,15px); line-height:1.55; }
.journey-card--problem { display:flex; flex-direction:column; justify-content:center; }

.journey-demo {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(340px,.72fr);
  align-items:center;
  gap:clamp(26px,5vw,80px);
  min-height:0;
  overflow:hidden;
}
.journey-demo__copy { align-self:center; }
.journey-demo__checks { display:grid; gap:10px; }
.journey-demo__checks span {
  display:flex; align-items:center; min-height:44px; padding:0 16px 0 42px; position:relative;
  border:1px solid rgba(24,79,131,.12); border-radius:15px; background:rgba(255,255,255,.72);
  color:#42617a; font-size:13px; font-weight:720;
}
.journey-demo__checks span::before { content:'✓'; position:absolute; left:15px; color:#099bae; font-weight:900; }
.journey-demo__actions { display:flex; flex-wrap:wrap; gap:9px; margin-top:18px; }
.journey-demo__visual { align-self:stretch; display:flex; align-items:flex-end; justify-content:center; min-height:0; text-decoration:none; }
.journey-demo__visual img { display:block; width:auto; max-width:100%; height:min(100%,640px); object-fit:contain; object-position:center bottom; filter:drop-shadow(0 25px 32px rgba(20,54,88,.17)); }

.journey-grid--agents { grid-template-columns:repeat(4,minmax(0,1fr)); }
.journey-agent {
  display:grid; grid-template-rows:minmax(0,1fr) auto; min-height:0; overflow:hidden;
  border:1px solid rgba(24,79,131,.13); border-radius:22px; background:rgba(255,255,255,.78);
  color:inherit; text-decoration:none; box-shadow:0 14px 34px rgba(25,55,86,.08);
}
.journey-agent img { width:100%; height:100%; min-height:0; object-fit:contain; object-position:center bottom; padding:8px 10px 0; }
.journey-agent div { padding:12px 15px 15px; }
.journey-agent h2 { margin:5px 0 0; color:#0a3169; font-size:17px; }
.journey-agent p { margin:5px 0 0; color:#5a6c82; font-size:10.5px; line-height:1.35; }
.journey-agent:hover,.journey-agent:focus-visible { border-color:rgba(8,164,194,.5); transform:translateY(-2px); outline:none; }

.journey-grid--trust { grid-template-columns:repeat(4,minmax(0,1fr)); }
.journey-card--trust { display:flex; flex-direction:column; justify-content:center; }

/* Página Cómo funciona: elimina el fallback con scroll de 16.6.2. */
html:has(body.screen-page--how),
body.screen-page--how { height:100dvh !important; min-height:100% !important; overflow:hidden !important; }
.screen-page--how .screen-stage { height:calc(100dvh - 72px) !important; min-height:0 !important; overflow:hidden !important; }
.screen-page--how .screen-shell { height:100% !important; min-height:0 !important; grid-template-rows:auto minmax(0,1fr) auto !important; padding-bottom:clamp(12px,2vh,20px) !important; }
.screen-page--how .screen-grid--how-primary { min-height:0; }
.screen-page--how .screen-note { display:none !important; }

@media (max-width:880px) {
  body.no-scroll-home #main-content,
  .journey-stage,
  .journey-page .screen-stage,
  .screen-page--how .screen-stage { height:calc(100dvh - 64px) !important; min-height:0 !important; }
  html:has(body.viewport-page), body.viewport-page { height:100dvh !important; min-height:100% !important; overflow:hidden !important; }
  .journey-page .screen-shell,
  .screen-page--how .screen-shell { width:calc(100vw - 24px); padding:12px 0 10px !important; gap:8px; }
  .journey-heading { gap:4px; }
  .journey-heading h1 { font-size:clamp(27px,6.7vw,38px); }
  .journey-heading > span { font-size:10px; line-height:1.32; }
  .journey-grid--3 { grid-template-columns:1fr; grid-template-rows:repeat(3,minmax(0,1fr)); gap:7px; }
  .journey-card { padding:11px 14px; border-radius:16px; }
  .journey-card h2 { margin-top:5px; font-size:14px; }
  .journey-card p { margin-top:4px; font-size:10px; line-height:1.3; }
  .journey-nav { grid-template-columns:1fr auto 1fr; min-height:36px; gap:6px; }
  .journey-nav__button { min-height:34px; padding:5px 8px; border-radius:12px; }
  .journey-nav__button small { font-size:6.5px; }
  .journey-nav__button strong { font-size:8.5px; }
  .journey-nav__step { font-size:7px; letter-spacing:.06em; }
  .journey-demo { grid-template-columns:1fr 42%; gap:12px; }
  .journey-demo__checks { gap:6px; }
  .journey-demo__checks span { min-height:34px; padding:0 10px 0 32px; border-radius:11px; font-size:9px; }
  .journey-demo__checks span::before { left:11px; }
  .journey-demo__actions { display:grid; grid-template-columns:1fr; gap:5px; margin-top:8px; }
  .journey-demo__actions .button { min-height:34px; padding:0 10px; font-size:9px; }
  .journey-demo__visual img { height:100%; max-height:420px; }
  .journey-grid--agents { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(0,1fr)); gap:7px; }
  .journey-agent { grid-template-columns:38% 1fr; grid-template-rows:1fr; border-radius:15px; }
  .journey-agent img { padding:4px 0 0 4px; }
  .journey-agent div { align-self:center; padding:8px; }
  .journey-agent span { font-size:6.5px; }
  .journey-agent h2 { font-size:12px; margin-top:2px; }
  .journey-agent p { font-size:8.5px; margin-top:3px; }
  .journey-grid--trust { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(0,1fr)); gap:7px; }

  .screen-page--how .screen-grid--how-primary { grid-template-columns:repeat(2,minmax(0,1fr)) !important; grid-template-rows:repeat(2,minmax(0,1fr)) !important; grid-auto-rows:unset !important; gap:7px; }
  .screen-page--how .screen-card--operation { min-height:0 !important; padding:9px; }
  .screen-page--how .operation-visual { min-height:0 !important; margin:5px -2px -2px; }
}

@media (max-width:560px) {
  .no-scroll-home .home-commercial-hero { background-position:58% center; }
  .no-scroll-home .home-commercial-hero::before { background:linear-gradient(180deg,rgba(244,248,252,.93) 0%,rgba(244,248,252,.84) 50%,rgba(244,248,252,.18) 82%,rgba(244,248,252,.02) 100%); }
  .no-scroll-home .home-commercial-hero .hero__inner { display:block; position:relative; width:calc(100% - 28px); padding:18px 0 48px; }
  .no-scroll-home .home-commercial-hero .hero__inner > div:first-child { position:relative; z-index:3; width:100%; }
  .no-scroll-home .commercial-home .hero h1,
  .no-scroll-home .hero h1 { max-width:100%; font-size:clamp(34px,10.2vw,46px); line-height:.98; }
  .no-scroll-home .commercial-home .hero__lead { max-width:94%; margin-top:12px; font-size:13px; line-height:1.36; }
  .no-scroll-home .commercial-home .hero__actions { display:flex; flex-wrap:wrap; gap:6px; margin-top:13px; }
  .no-scroll-home .commercial-home .button { width:auto; min-height:36px; padding:0 12px; font-size:9px; }
  .no-scroll-home .commercial-home .hero__proof { display:flex; flex-wrap:wrap; gap:4px; margin-top:10px; max-width:78%; }
  .no-scroll-home .proof-pill { min-height:22px; padding:0 7px; font-size:7px; }
  .no-scroll-home .home-commercial-hero .hero__visual { position:absolute; z-index:1; right:-10%; bottom:0; width:66%; height:52%; min-height:0; margin:0; }
  .no-scroll-home .hero__cap-link { width:100%; height:100%; align-items:flex-end; justify-content:flex-end; }
  .no-scroll-home .home-commercial-hero .hero__avatar { width:auto; height:100%; max-height:100%; object-fit:contain; object-position:right bottom; }
  .journey-nav--home { right:12px; bottom:8px; width:calc(100vw - 24px); grid-template-columns:auto minmax(112px,1fr); }
  .journey-nav--home .journey-nav__step { justify-self:start; }

  .journey-page .screen-shell,
  .screen-page--how .screen-shell { width:calc(100vw - 20px); padding:9px 0 7px !important; gap:5px; }
  .journey-heading > p,.screen-page--how .screen-heading > p { font-size:7px; margin-bottom:1px; }
  .journey-heading h1,.screen-page--how .screen-heading h1 { font-size:clamp(22px,7vw,30px); line-height:1; }
  .journey-heading > span,.screen-page--how .screen-heading > span { font-size:8.4px; line-height:1.22; }
  .journey-card { padding:8px 10px; }
  .journey-card > span { font-size:6.5px; }
  .journey-card h2 { font-size:12px; margin-top:3px; }
  .journey-card p { font-size:8.5px; line-height:1.2; margin-top:3px; }
  .journey-nav { min-height:31px; }
  .journey-nav__button { min-height:29px; padding:3px 6px; }
  .journey-nav__button small { display:none; }
  .journey-nav__button strong { font-size:7.5px; }
  .journey-nav__step { font-size:6.2px; }

  .journey-demo { grid-template-columns:minmax(0,1fr) 42%; gap:7px; }
  .journey-demo__checks span { min-height:28px; padding:0 7px 0 24px; font-size:7.5px; }
  .journey-demo__checks span::before { left:8px; }
  .journey-demo__actions .button { min-height:29px; font-size:7.5px; }

  .journey-grid--agents { gap:5px; }
  .journey-agent { grid-template-columns:35% 1fr; border-radius:12px; }
  .journey-agent div { padding:5px 6px; }
  .journey-agent span { font-size:5.8px; }
  .journey-agent h2 { font-size:10.5px; }
  .journey-agent p { font-size:7px; line-height:1.18; }
  .journey-grid--trust { gap:5px; }

  .screen-page--how .screen-grid--how-primary {
    grid-template-columns:1fr !important;
    grid-template-rows:repeat(4,minmax(0,1fr)) !important;
    gap:4px !important;
  }
  .screen-page--how .screen-card--operation {
    display:grid !important;
    grid-template-columns:74px minmax(0,1fr);
    grid-template-rows:auto auto 1fr;
    min-height:0 !important;
    padding:5px 7px !important;
    border-radius:12px;
  }
  .screen-page--how .screen-card--operation > span { grid-column:2; grid-row:1; justify-self:start; min-height:15px; font-size:5.7px; padding-inline:5px; }
  .screen-page--how .screen-card--operation h2 { grid-column:2; grid-row:2; margin:2px 0 0; font-size:9.5px; }
  .screen-page--how .screen-card--operation p { grid-column:2; grid-row:3; margin:2px 0 0; font-size:6.8px; line-height:1.16; }
  .screen-page--how .operation-visual { grid-column:1; grid-row:1 / span 3; width:68px; height:68px; min-height:0 !important; margin:0 !important; align-self:center; }
  .screen-page--how .operation-visual svg { width:68px; height:68px; min-height:0; }
}

@media (max-width:380px), (max-height:690px) and (max-width:560px) {
  .no-scroll-home .commercial-home .hero h1,.no-scroll-home .hero h1 { font-size:clamp(30px,9vw,38px); }
  .no-scroll-home .commercial-home .hero__lead { font-size:11px; margin-top:8px; max-width:90%; }
  .no-scroll-home .commercial-home .hero__actions { margin-top:8px; }
  .no-scroll-home .commercial-home .button { min-height:31px; font-size:7.5px; }
  .no-scroll-home .commercial-home .hero__proof { margin-top:6px; max-width:75%; }
  .no-scroll-home .proof-pill { min-height:19px; font-size:6px; }
  .no-scroll-home .home-commercial-hero .hero__visual { height:48%; width:64%; }
  .journey-heading > span,.screen-page--how .screen-heading > span { font-size:7.3px; }
  .journey-card h2 { font-size:10.5px; }
  .journey-card p { font-size:7.4px; }
  .journey-agent p { display:none; }
  .screen-page--how .screen-card--operation { grid-template-columns:60px minmax(0,1fr); }
  .screen-page--how .operation-visual,.screen-page--how .operation-visual svg { width:55px; height:55px; }
}

@media (max-height:520px) and (min-width:561px) {
  .journey-heading > span { font-size:9px; }
  .journey-card { padding:9px; }
  .journey-card p { font-size:9px; }
  .journey-demo__checks span { min-height:28px; font-size:9px; }
  .journey-agent p { display:none; }
}

/* Ajuste intermedio: tablet mantiene composición lateral para no reintroducir scroll. */
@media (min-width:561px) and (max-width:880px) {
  .no-scroll-home .home-commercial-hero .hero__inner {
    display:grid !important;
    grid-template-columns:minmax(0,1.08fr) minmax(230px,.92fr) !important;
    align-items:center;
    gap:18px;
    min-height:0 !important;
    padding:24px 0 58px !important;
  }
  .no-scroll-home .home-commercial-hero .hero__visual {
    position:relative;
    min-height:0 !important;
    height:100%;
    margin:0 !important;
  }
  .no-scroll-home .home-commercial-hero .hero__avatar {
    width:auto;
    height:min(68dvh,560px);
    max-width:100%;
    object-fit:contain;
    object-position:center bottom;
  }
  .no-scroll-home .commercial-home .hero h1,
  .no-scroll-home .hero h1 { font-size:clamp(38px,6.5vw,54px); }
  .no-scroll-home .commercial-home .hero__lead { font-size:14px; line-height:1.4; }
  .no-scroll-home .commercial-home .hero__actions { gap:7px; }
  .no-scroll-home .commercial-home .button { min-height:38px; padding:0 13px; font-size:9px; }
  .no-scroll-home .commercial-home .hero__proof { gap:5px; }
  .no-scroll-home .proof-pill { min-height:24px; padding:0 8px; font-size:7px; }
}

/* Alturas seguras para portátiles: la escena principal no depende de min-height histórico. */
.no-scroll-home .home-commercial-hero .hero__visual {
  min-height: 0 !important;
  height: 100%;
  align-self: stretch;
}
.no-scroll-home .home-commercial-hero .hero__avatar {
  max-height: 100%;
}

/* ========================================================================== 
   VIA WEB 16.7.3 — Señales públicas discretas en portada
   Contador agregado opt-in + acceso directo al LinkedIn del fundador.
   No altera la composición central ni la navegación sin scroll.
   ========================================================================== */
.home-identity-rail {
  position: absolute;
  z-index: 11;
  left: max(22px, calc((100vw - 1180px) / 2));
  bottom: clamp(12px, 2.2vh, 22px);
  display: inline-flex;
  align-items: center;
  gap: 7px;
  max-width: calc(100vw - 590px);
}
.home-identity-rail .home-visit-counter {
  position: static;
  left: auto;
  bottom: auto;
  flex: 0 0 auto;
  min-height: 30px;
  padding: 5px 10px;
  border-color: rgba(24,79,131,.12);
  background: rgba(255,255,255,.78);
  box-shadow: 0 9px 24px rgba(25,55,86,.07);
  color: #5d7188;
  font-size: 7.5px;
  backdrop-filter: blur(12px);
}
.home-identity-rail .home-visit-counter strong { font-size: 10px; }
.home-identity-rail .home-visit-counter[data-state="preview"] { opacity: .72; }
.home-linkedin-link {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 5px 10px;
  border: 1px solid rgba(24,79,131,.12);
  border-radius: 999px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 9px 24px rgba(25,55,86,.07);
  color: #49657d;
  font-size: 7.5px;
  font-weight: 760;
  letter-spacing: .035em;
  text-decoration: none;
  white-space: nowrap;
  backdrop-filter: blur(12px);
}
.home-linkedin-link strong {
  color: #0b4f89;
  font-size: 8px;
  font-weight: 900;
}
.home-linkedin-link:hover,
.home-linkedin-link:focus-visible {
  border-color: #0b789b;
  background: #0b789b;
  color: rgba(255,255,255,.78);
  outline: none;
}
.home-linkedin-link:hover strong,
.home-linkedin-link:focus-visible strong { color: #fff; }

@media (max-width: 880px) {
  .home-identity-rail {
    left: 12px;
    bottom: 52px;
    max-width: calc(100vw - 24px);
    gap: 5px;
  }
  .home-identity-rail .home-visit-counter,
  .home-linkedin-link {
    min-height: 25px;
    padding: 3px 7px;
    font-size: 6.5px;
  }
  .home-identity-rail .home-visit-counter strong,
  .home-linkedin-link strong { font-size: 7.5px; }
}

@media (max-width: 560px) {
  .home-identity-rail {
    left: 12px;
    bottom: 45px;
    gap: 4px;
  }
  .home-identity-rail .home-visit-counter,
  .home-linkedin-link {
    min-height: 22px;
    padding: 2px 6px;
    font-size: 5.8px;
    box-shadow: 0 6px 14px rgba(25,55,86,.06);
  }
  .home-identity-rail .home-visit-counter strong,
  .home-linkedin-link strong { font-size: 6.7px; }
  .home-linkedin-link__person { display: none; }
}


/* VIA WEB 16.7.3 — contacto resiliente: VIA primero, aplicación de correo como opción secundaria. */
.screen-page--contact .contact-channel-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
}
.contact-channel-card {
  display: flex;
  flex-direction: column;
}
.contact-channel-card--recommended {
  border-color: rgba(0, 170, 202, .34);
  background: linear-gradient(145deg, rgba(244,253,255,.96), rgba(255,255,255,.84));
  box-shadow: 0 16px 38px rgba(8, 103, 143, .12);
}
.contact-channel-card--recommended::after {
  content: "RECOMENDADO";
  position: absolute;
  top: 14px;
  right: 14px;
  color: #07809e;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .09em;
}
html[lang="en"] .contact-channel-card--recommended::after { content: "RECOMMENDED"; }
html[lang="pt"] .contact-channel-card--recommended::after { content: "RECOMENDADO"; }
.contact-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  min-height: 31px;
  margin-top: auto;
  padding: 0 12px;
  border: 1px solid rgba(11,120,155,.22);
  border-radius: 999px;
  font-size: 9px;
  font-weight: 850;
  text-decoration: none;
}
.contact-action--primary { border-color: #0b789b; background: #0b789b; color: #fff; }
.contact-action--primary:hover,
.contact-action--primary:focus-visible { background: #085f7b; }
.contact-action--secondary { background: rgba(255,255,255,.86); color: #0b527d; }
.contact-action--secondary:hover,
.contact-action--secondary:focus-visible { background: #0b789b; color: #fff; }
.contact-email--channel { margin-top: auto !important; padding-top: 8px; font-size: clamp(10px,.88vw,13px) !important; }
.copy-email--channel { align-self: flex-start; margin-top: 7px; }
.contact-resilience-note > span { font-weight: 650; }
@media (max-width: 880px) {
  .screen-page--contact .contact-channel-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(3, minmax(0, 1fr));
  }
  .contact-channel-card--recommended::after { top: 9px; right: 9px; font-size: 6.5px; }
  .contact-action { min-height: 25px; padding-inline: 8px; font-size: 7.5px; }
  .contact-email--channel { font-size: 8.5px !important; }
}
@media (max-width: 560px) {
  .screen-page--contact .screen-heading > span { font-size: 9.5px; line-height: 1.28; }
  .screen-page--contact .contact-channel-grid { gap: 6px; }
  .screen-page--contact .contact-channel-card { padding: 8px; }
  .screen-page--contact .contact-channel-card > span { min-height: 18px; padding-inline: 6px; font-size: 6px; }
  .screen-page--contact .contact-channel-card h2 { font-size: 10.5px; margin-top: 5px; }
  .screen-page--contact .contact-channel-card p { font-size: 7.5px; line-height: 1.25; margin-top: 3px; }
  .contact-channel-card--recommended::after { display: none; }
  .contact-action { min-height: 21px; margin-top: 4px; padding-inline: 6px; font-size: 6.5px; }
  .copy-email--channel { min-height: 21px; margin-top: 4px; padding-inline: 6px; font-size: 6.2px; }
  .contact-email--channel { padding-top: 3px; font-size: 7px !important; }
  .contact-resilience-note > span { display: none; }
}

/* ========================================================================== 
   VIA WEB 16.7.4 — Responsive híbrido
   Desktop/notebook: experiencia cerrada sin scroll.
   Celular y tablet vertical: flujo natural con scroll y tipografía legible.
   ========================================================================== */
@media (max-width: 880px), (max-width: 1180px) and (orientation: portrait) {
  html,
  html:has(body.viewport-page),
  html:has(body.screen-page--how) {
    height: auto !important;
    min-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.no-scroll-home,
  body.viewport-page,
  body.journey-page,
  body.screen-page--how {
    height: auto !important;
    min-height: 100dvh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.no-scroll-home #main-content,
  .screen-stage,
  .journey-stage,
  .journey-page .screen-stage,
  .screen-page--how .screen-stage {
    height: auto !important;
    min-height: calc(100dvh - 64px) !important;
    overflow: visible !important;
  }

  .screen-shell,
  .journey-shell,
  .journey-page .screen-shell,
  .screen-page--how .screen-shell {
    width: min(920px, calc(100vw - 28px)) !important;
    height: auto !important;
    min-height: 0 !important;
    grid-template-rows: auto !important;
    gap: 16px !important;
    padding: 24px 0 22px !important;
    overflow: visible !important;
  }

  .screen-heading,
  .journey-heading {
    gap: 7px !important;
  }
  .screen-heading > p,
  .journey-heading > p {
    font-size: 10px !important;
    line-height: 1.3 !important;
  }
  .screen-heading h1,
  .journey-heading h1 {
    font-size: clamp(34px, 7vw, 52px) !important;
    line-height: 1.02 !important;
  }
  .screen-heading > span,
  .journey-heading > span {
    max-width: 760px;
    font-size: clamp(12px, 2.1vw, 16px) !important;
    line-height: 1.48 !important;
  }

  .journey-grid,
  .screen-grid {
    min-height: 0 !important;
    overflow: visible !important;
  }
  .journey-grid--3,
  .journey-grid--agents,
  .journey-grid--trust {
    grid-template-columns: 1fr !important;
    grid-template-rows: none !important;
    grid-auto-rows: auto !important;
    gap: 12px !important;
  }

  .journey-card,
  .screen-card {
    min-height: 0 !important;
    padding: 18px !important;
    border-radius: 18px !important;
  }
  .journey-card > span,
  .screen-card > span {
    font-size: 8px !important;
  }
  .journey-card h2,
  .screen-card h2 {
    margin-top: 7px !important;
    font-size: clamp(17px, 3.3vw, 22px) !important;
    line-height: 1.18 !important;
  }
  .journey-card p,
  .screen-card p {
    margin-top: 7px !important;
    font-size: clamp(12px, 2.3vw, 14px) !important;
    line-height: 1.48 !important;
  }

  .journey-demo {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    overflow: visible !important;
  }
  .journey-demo__checks {
    gap: 8px !important;
  }
  .journey-demo__checks span {
    min-height: 42px !important;
    padding: 9px 12px 9px 38px !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
  }
  .journey-demo__checks span::before { left: 14px !important; }
  .journey-demo__actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-top: 12px !important;
  }
  .journey-demo__actions .button {
    min-height: 40px !important;
    padding: 0 14px !important;
    font-size: 10px !important;
  }
  .journey-demo__visual {
    min-height: 360px !important;
    overflow: visible !important;
  }
  .journey-demo__visual img {
    width: min(100%, 520px) !important;
    height: auto !important;
    max-height: none !important;
    margin-inline: auto;
  }

  .journey-agent {
    grid-template-columns: minmax(110px, 32%) minmax(0, 1fr) !important;
    grid-template-rows: auto !important;
    min-height: 190px !important;
    overflow: hidden !important;
  }
  .journey-agent img {
    height: 100% !important;
    min-height: 180px !important;
    padding: 8px 0 0 8px !important;
  }
  .journey-agent div {
    align-self: center !important;
    padding: 14px !important;
  }
  .journey-agent span { font-size: 7.5px !important; }
  .journey-agent h2 { margin-top: 4px !important; font-size: 17px !important; }
  .journey-agent p { display: block !important; margin-top: 6px !important; font-size: 11px !important; line-height: 1.42 !important; }

  .screen-page--how .screen-grid--how-primary {
    grid-template-columns: 1fr !important;
    grid-template-rows: none !important;
    grid-auto-rows: auto !important;
    gap: 12px !important;
  }
  .screen-page--how .screen-card--operation {
    display: block !important;
    min-height: 0 !important;
    padding: 18px !important;
    border-radius: 18px !important;
  }
  .screen-page--how .screen-card--operation > span {
    display: inline-flex !important;
    min-height: 24px !important;
    padding-inline: 9px !important;
    font-size: 8px !important;
  }
  .screen-page--how .screen-card--operation h2 {
    margin-top: 8px !important;
    font-size: 18px !important;
  }
  .screen-page--how .screen-card--operation p {
    margin-top: 7px !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
  }
  .screen-page--how .operation-visual {
    width: 100% !important;
    height: auto !important;
    min-height: 205px !important;
    margin: 12px 0 0 !important;
  }
  .screen-page--how .operation-visual svg {
    width: 100% !important;
    height: auto !important;
    min-height: 205px !important;
  }

  .journey-page .screen-note,
  .screen-page--how .screen-note {
    display: flex !important;
  }

  .journey-nav {
    margin-top: 4px;
    min-height: 44px !important;
    gap: 8px !important;
  }
  .journey-nav__button {
    min-height: 40px !important;
    padding: 7px 10px !important;
    border-radius: 13px !important;
  }
  .journey-nav__button small { display: block !important; font-size: 7px !important; }
  .journey-nav__button strong { font-size: 9.5px !important; }
  .journey-nav__step { font-size: 7.5px !important; }

  .screen-page--contact .contact-channel-grid {
    grid-template-columns: 1fr !important;
    grid-template-rows: none !important;
    grid-auto-rows: auto !important;
    gap: 10px !important;
  }
  .screen-page--contact .contact-channel-card {
    padding: 16px !important;
  }
  .screen-page--contact .contact-channel-card h2 {
    font-size: 17px !important;
  }
  .screen-page--contact .contact-channel-card p,
  .contact-email--channel {
    font-size: 12px !important;
    line-height: 1.42 !important;
  }
  .contact-action,
  .copy-email--channel {
    min-height: 36px !important;
    padding-inline: 11px !important;
    font-size: 9px !important;
  }
  .contact-resilience-note > span { display: block !important; }

  .screen-note,
  .screen-note--actions {
    flex-wrap: wrap !important;
    gap: 10px !important;
    padding: 12px !important;
  }
  .screen-note__actions,
  .screen-utility {
    flex-wrap: wrap !important;
  }

  .no-scroll-home .home-commercial-hero {
    height: auto !important;
    min-height: calc(100dvh - 64px) !important;
    padding: 0 !important;
    overflow: visible !important;
  }
  .no-scroll-home .home-commercial-hero .hero__inner {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: min(920px, calc(100vw - 28px)) !important;
    height: auto !important;
    min-height: calc(100dvh - 64px) !important;
    gap: 18px !important;
    padding: 28px 0 20px !important;
  }
  .no-scroll-home .home-commercial-hero .hero__visual {
    position: relative !important;
    right: auto !important;
    bottom: auto !important;
    width: min(82vw, 520px) !important;
    height: auto !important;
    min-height: 360px !important;
    margin: 0 auto !important;
  }
  .no-scroll-home .hero__cap-link {
    width: 100% !important;
    height: auto !important;
    min-height: 360px !important;
    align-items: flex-end !important;
    justify-content: center !important;
  }
  .no-scroll-home .home-commercial-hero .hero__avatar {
    width: min(100%, 470px) !important;
    height: auto !important;
    max-height: none !important;
    object-position: center bottom !important;
  }
  .no-scroll-home .commercial-home .hero h1,
  .no-scroll-home .hero h1 {
    max-width: 760px !important;
    font-size: clamp(40px, 8.5vw, 64px) !important;
    line-height: .98 !important;
  }
  .no-scroll-home .commercial-home .hero__lead {
    max-width: 720px !important;
    margin-top: 15px !important;
    font-size: clamp(14px, 2.6vw, 18px) !important;
    line-height: 1.5 !important;
  }
  .no-scroll-home .commercial-home .hero__actions {
    margin-top: 18px !important;
    gap: 9px !important;
  }
  .no-scroll-home .commercial-home .button {
    min-height: 42px !important;
    padding: 0 15px !important;
    font-size: 10px !important;
  }
  .no-scroll-home .commercial-home .hero__proof {
    max-width: 100% !important;
    margin-top: 13px !important;
    gap: 6px !important;
  }
  .no-scroll-home .proof-pill {
    min-height: 28px !important;
    padding: 0 9px !important;
    font-size: 8px !important;
  }

  .home-identity-rail,
  .journey-nav--home {
    position: static !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: min(920px, calc(100vw - 28px)) !important;
    max-width: none !important;
    margin: 0 auto 12px !important;
  }
  .home-identity-rail {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
  }
  .home-identity-rail .home-visit-counter,
  .home-linkedin-link {
    min-height: 30px !important;
    padding: 5px 9px !important;
    font-size: 7.5px !important;
  }
  .home-identity-rail .home-visit-counter strong,
  .home-linkedin-link strong { font-size: 8.5px !important; }
  .home-linkedin-link__person { display: inline !important; }
  .journey-nav--home {
    grid-template-columns: auto minmax(150px, 1fr) !important;
    padding-bottom: max(8px, env(safe-area-inset-bottom));
  }
}

@media (max-width: 560px) {
  .screen-shell,
  .journey-shell,
  .journey-page .screen-shell,
  .screen-page--how .screen-shell,
  .no-scroll-home .home-commercial-hero .hero__inner,
  .home-identity-rail,
  .journey-nav--home {
    width: calc(100vw - 24px) !important;
  }

  .journey-agent {
    grid-template-columns: 1fr !important;
  }
  .journey-agent img {
    width: 100% !important;
    height: auto !important;
    max-height: 280px !important;
    object-fit: contain !important;
  }
  .journey-agent div { padding: 14px 16px 16px !important; }

  .no-scroll-home .home-commercial-hero .hero__visual,
  .no-scroll-home .hero__cap-link {
    min-height: 330px !important;
  }
  .no-scroll-home .commercial-home .hero h1,
  .no-scroll-home .hero h1 {
    font-size: clamp(36px, 11vw, 50px) !important;
  }
  .no-scroll-home .commercial-home .hero__lead {
    max-width: 100% !important;
    font-size: 14px !important;
  }
  .journey-nav {
    grid-template-columns: 1fr auto 1fr !important;
  }
}

/* ========================================================================== 
   VIA WEB 16.7.5 — Parche exclusivamente mobile
   Desktop (>760px): sin cambios visuales respecto de v16.7.4.
   Mobile (<=760px): mensaje -> acciones -> CAP -> evidencias, con scroll natural.
   ========================================================================== */
@media (max-width: 760px) {
  body.no-scroll-home .home-commercial-hero {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    background-position: 58% center !important;
  }

  body.no-scroll-home .home-commercial-hero .hero__inner {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: calc(100vw - 24px) !important;
    height: auto !important;
    min-height: 0 !important;
    gap: 0 !important;
    padding: 24px 0 22px !important;
  }

  /* Aplanamos solo en mobile el contenedor de copy para poder colocar CAP
     antes de las evidencias sin duplicar contenido ni alterar desktop. */
  body.no-scroll-home .home-commercial-hero .hero__inner > div:first-child {
    display: contents !important;
  }

  body.no-scroll-home .home-commercial-hero .eyebrow {
    order: 1;
    margin: 0 0 12px !important;
    font-size: 9.5px !important;
    line-height: 1.35 !important;
    letter-spacing: .12em !important;
  }

  body.no-scroll-home .home-commercial-hero h1 {
    order: 2;
    max-width: 100% !important;
    margin: 0 !important;
    font-size: clamp(36px, 10vw, 46px) !important;
    line-height: .99 !important;
    letter-spacing: -.045em !important;
  }

  body.no-scroll-home .home-commercial-hero .hero__lead {
    order: 3;
    max-width: 100% !important;
    margin: 20px 0 0 !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
  }

  body.no-scroll-home .home-commercial-hero .hero__actions {
    order: 4;
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    gap: 10px !important;
    margin: 24px 0 0 !important;
  }

  body.no-scroll-home .home-commercial-hero .hero__actions .button {
    width: 100% !important;
    min-height: 44px !important;
    padding: 10px 16px !important;
    font-size: 11px !important;
  }

  /* Corrección principal v16.7.5: en mobile CAP deja de heredar el
     posicionamiento absoluto de desktop y vuelve al flujo del documento. */
  body.no-scroll-home .home-commercial-hero .hero__visual {
    order: 5;
    position: relative !important;
    inset: auto !important;
    right: auto !important;
    bottom: auto !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 22px auto 0 !important;
    overflow: visible !important;
  }

  body.no-scroll-home .hero__cap-link {
    position: relative !important;
    inset: auto !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    border-radius: 0 !important;
  }

  body.no-scroll-home .home-commercial-hero .hero__avatar {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: min(92vw, 430px) !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    object-position: center bottom !important;
    transform: none !important;
  }

  body.no-scroll-home .home-commercial-hero .hero__proof {
    order: 6;
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    max-width: none !important;
    gap: 7px !important;
    margin: 10px 0 0 !important;
  }

  body.no-scroll-home .home-commercial-hero .proof-pill {
    justify-content: flex-start !important;
    width: 100% !important;
    min-height: 34px !important;
    padding: 7px 12px !important;
    font-size: 9.5px !important;
    line-height: 1.25 !important;
  }

  /* Señales públicas y navegación: siguen después del hero, ya en flujo. */
  body.no-scroll-home .home-identity-rail,
  body.no-scroll-home .journey-nav--home {
    position: static !important;
    inset: auto !important;
    width: calc(100vw - 24px) !important;
    max-width: none !important;
    margin-inline: auto !important;
  }

  body.no-scroll-home .home-identity-rail {
    margin-top: 4px !important;
    margin-bottom: 10px !important;
    gap: 6px !important;
  }

  body.no-scroll-home .home-identity-rail .home-visit-counter,
  body.no-scroll-home .home-linkedin-link {
    min-height: 30px !important;
    padding: 5px 9px !important;
    font-size: 7.5px !important;
  }

  body.no-scroll-home .journey-nav--home {
    margin-top: 0 !important;
    margin-bottom: max(12px, env(safe-area-inset-bottom)) !important;
  }
}

@media (max-width: 420px) {
  body.no-scroll-home .home-commercial-hero h1 {
    font-size: clamp(35px, 10.2vw, 42px) !important;
  }

  body.no-scroll-home .home-commercial-hero .hero__lead {
    font-size: 14px !important;
  }

  body.no-scroll-home .home-commercial-hero .hero__avatar {
    width: min(94vw, 405px) !important;
  }
}


/* ========================================================================== 
   VIA WEB 16.7.6 — Ajuste fino mobile del hero y cabecera
   Objetivo: mejorar composición en celular sin alterar desktop.
   ========================================================================== */
@media (max-width: 760px) {
  .site-header__inner--wide {
    padding-inline: 18px !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
  }

  .site-brand--dark {
    justify-self: start !important;
    padding-left: 2px !important;
  }

  .site-brand--dark img {
    width: 86px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
  }

  .menu-toggle--dark {
    margin-right: 2px !important;
  }

  body.no-scroll-home .home-commercial-hero .eyebrow {
    margin-bottom: 14px !important;
    color: var(--via-blue-600) !important;
  }

  body.no-scroll-home .home-commercial-hero h1 {
    color: var(--via-navy-900) !important;
    font-size: clamp(31px, 8.8vw, 39px) !important;
    line-height: 1.04 !important;
    letter-spacing: -0.04em !important;
    text-wrap: balance;
  }

  body.no-scroll-home .home-commercial-hero .hero__lead {
    margin-top: 16px !important;
    color: #566b83 !important;
    font-size: 15px !important;
    line-height: 1.58 !important;
  }

  body.no-scroll-home .home-commercial-hero .hero__actions {
    margin-top: 22px !important;
  }

  body.no-scroll-home .home-commercial-hero .hero__visual {
    margin-top: 18px !important;
  }

  body.no-scroll-home .home-commercial-hero .proof-pill {
    color: #55708d !important;
    font-size: 10px !important;
  }
}

@media (max-width: 420px) {
  .site-brand--dark img {
    width: 82px !important;
  }

  body.no-scroll-home .home-commercial-hero h1 {
    font-size: clamp(29px, 8.6vw, 36px) !important;
  }
}


/* ========================================================================== 
   VIA WEB 16.7.7 — Orden visual mobile: menú + pie del index
   Alcance estricto: solo <=760px. Desktop y contenido permanecen intactos.
   ========================================================================== */
@media (max-width: 760px) {
  /* Menú móvil: drawer lateral derecho, jerarquía vertical clara. */
  .site-nav--dark {
    top: 64px !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    inset: 64px 0 0 auto !important;
    width: min(82vw, 340px) !important;
    max-width: 340px !important;
    height: calc(100dvh - 64px) !important;
    max-height: none !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 14px !important;
    padding: 20px 18px max(20px, env(safe-area-inset-bottom)) !important;
    border: 0 !important;
    border-left: 1px solid rgba(255,255,255,.12) !important;
    border-radius: 22px 0 0 0 !important;
    background: rgba(45,61,77,.985) !important;
    box-shadow: -18px 18px 38px rgba(8,24,39,.24) !important;
    overflow-y: auto !important;
  }

  .site-nav--dark .site-nav__pill,
  .commercial-home .site-nav__pill {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 6px !important;
    width: 100% !important;
    padding: 8px !important;
    border-radius: 18px !important;
    background: rgba(15,37,55,.22) !important;
  }

  .site-nav--dark .site-nav__pill a,
  .commercial-home .site-nav__pill a {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-height: 44px !important;
    padding: 0 14px !important;
    border: 1px solid rgba(255,255,255,.07) !important;
    border-radius: 12px !important;
    background: rgba(255,255,255,.025) !important;
    color: rgba(255,255,255,.82) !important;
    font-size: 12px !important;
    letter-spacing: .01em !important;
  }

  .site-nav--dark .site-nav__pill a:hover,
  .site-nav--dark .site-nav__pill a:focus-visible,
  .site-nav--dark .site-nav__pill a[aria-current="page"] {
    border-color: rgba(55,215,236,.22) !important;
    background: linear-gradient(145deg, rgba(18,142,170,.58), rgba(18,104,139,.66)) !important;
    color: #fff !important;
  }

  .site-nav--dark .language-nav--dark {
    align-self: stretch !important;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 4px !important;
  }

  .site-nav--dark .language-nav--dark a {
    min-width: 0 !important;
    min-height: 38px !important;
  }

  .site-nav--dark .site-nav__cta--light {
    width: 100% !important;
    min-height: 46px !important;
    margin-top: 2px !important;
    border-radius: 14px !important;
    font-size: 12px !important;
  }

  /* Atenúa la página detrás del drawer sin cambiar ningún contenido. */
  body.is-menu-open main::after {
    content: "";
    position: fixed;
    z-index: 240;
    inset: 64px 0 0;
    background: rgba(6,22,50,.26);
    pointer-events: none;
  }

  /* Pie del index: dos filas compactas y alineadas. */
  body.no-scroll-home .home-identity-rail,
  body.no-scroll-home .journey-nav--home {
    width: calc(100vw - 24px) !important;
    max-width: 620px !important;
    margin-inline: auto !important;
    border: 1px solid rgba(24,79,131,.10) !important;
    border-radius: 18px !important;
    background: rgba(248,251,254,.90) !important;
    box-shadow: 0 10px 26px rgba(25,55,86,.06) !important;
  }

  body.no-scroll-home .home-identity-rail {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) auto !important;
    align-items: center !important;
    gap: 8px !important;
    margin-top: 8px !important;
    margin-bottom: 8px !important;
    padding: 8px !important;
  }

  body.no-scroll-home .home-linkedin-link,
  body.no-scroll-home .home-identity-rail .home-visit-counter {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 7px 11px !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: none !important;
    font-size: 10px !important;
  }

  body.no-scroll-home .home-linkedin-link {
    min-width: 0 !important;
    width: 100% !important;
    justify-content: flex-start !important;
  }

  body.no-scroll-home .home-identity-rail .home-visit-counter {
    min-width: 82px !important;
  }

  body.no-scroll-home .home-identity-rail .home-visit-counter strong,
  body.no-scroll-home .home-linkedin-link strong {
    font-size: 11px !important;
  }

  body.no-scroll-home .home-identity-rail .home-visit-counter[hidden] {
    display: none !important;
  }

  body.no-scroll-home .journey-nav--home {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) auto !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 0 !important;
    margin-top: 0 !important;
    margin-bottom: max(14px, env(safe-area-inset-bottom)) !important;
    padding: 8px !important;
  }

  body.no-scroll-home .journey-nav--home .journey-nav__step {
    justify-self: start !important;
    padding-left: 4px !important;
    color: #647d93 !important;
    font-size: 8.5px !important;
    letter-spacing: .08em !important;
  }

  body.no-scroll-home .journey-nav--home .journey-nav__button--next {
    justify-self: end !important;
    min-width: 126px !important;
    min-height: 44px !important;
    padding: 7px 12px !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: none !important;
  }
}

@media (max-width: 390px) {
  .site-nav--dark {
    width: min(86vw, 320px) !important;
  }

  body.no-scroll-home .home-linkedin-link__person {
    display: none !important;
  }

  body.no-scroll-home .home-identity-rail {
    grid-template-columns: minmax(0,1fr) 76px !important;
  }
}
