@import url("https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700;800&display=swap");
:root {
  --ink: #1d1d1b;
  --green: #95c11f;
  --link: #3f5a08;
  --paper: #fff;
  --mist: #f4f5f1;
  --line: #dfe2d8;
  --muted: #62645d;
  --font: "Archivo", Arial, sans-serif;
  --wrap: 1160px;
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 90px;
}
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font: 16px/1.6 var(--font);
  -webkit-font-smoothing: antialiased;
}
img {
  max-width: 100%;
  height: auto;
  display: block;
}
a {
  color: var(--link);
  text-underline-offset: 4px;
}
a:hover {
  text-decoration-thickness: 2px;
}
button,
a {
  touch-action: manipulation;
}
a:focus-visible,
button:focus-visible,
summary:focus-visible {
  outline: 3px solid #577c0b;
  outline-offset: 4px;
}
.wrap {
  width: min(var(--wrap), calc(100% - 48px));
  margin-inline: auto;
}
.skip {
  position: absolute;
  left: -9999px;
  top: 8px;
  background: white;
  padding: 12px;
  z-index: 20;
}
.skip:focus {
  left: 8px;
}
.site-header {
  background: #fff;
  border-bottom: 1px solid var(--line);
  position: relative;
  z-index: 5;
}
.header-inner {
  min-height: 88px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.brand {
  display: block;
  width: 176px;
  flex: none;
}
.brand img {
  width: 100%;
}
.nav {
  display: flex;
  align-items: center;
  gap: clamp(12px, 2vw, 28px);
}
.nav a {
  text-decoration: none;
  color: var(--ink);
  font-size: 14px;
  font-weight: 600;
}
.nav a:hover,
.nav a[aria-current="page"] {
  color: var(--link);
}
.nav .nav-cta,
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 20px;
  background: var(--green);
  border: 0;
  color: var(--ink);
  font-weight: 700;
  text-decoration: none;
  border-radius: 2px;
  transition:
    transform 0.18s ease,
    background 0.18s ease;
}
.nav .nav-cta:hover,
.button:hover {
  background: #a9d53a;
  transform: translateY(-2px);
}
.mobile-nav {
  display: none;
}
.hero {
  padding: 66px 0 70px;
}
.hero-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}
.hero h1 {
  font-size: clamp(42px, 6vw, 76px);
  line-height: 1.03;
  letter-spacing: -0.055em;
  margin: 0 0 22px;
  max-width: 680px;
}
.hero p {
  font-size: 19px;
  line-height: 1.55;
  color: #454640;
  max-width: 570px;
  margin: 0 0 26px;
}
.hero-media {
  position: relative;
}
.hero-media img {
  width: 100%;
  aspect-ratio: 1.18;
  object-fit: cover;
}
.hero-media:after {
  content: "";
  position: absolute;
  width: 28%;
  height: 26%;
  right: -14px;
  bottom: -14px;
  border: 8px solid var(--green);
  z-index: -1;
}
.hero-caption {
  margin-top: 12px;
  font-size: 12px;
  color: var(--muted);
}
.eyebrow {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.11em;
  color: var(--link);
  font-weight: 700;
  margin: 0 0 13px;
}
.section {
  padding: 76px 0;
}
.section-soft {
  background: var(--mist);
}
.section-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 30px;
  margin-bottom: 34px;
}
.section h2,
.page-head h1 {
  font-size: clamp(34px, 4.5vw, 56px);
  line-height: 1.08;
  letter-spacing: -0.045em;
  margin: 0;
  max-width: 730px;
}
.section-head p {
  max-width: 450px;
  color: var(--muted);
  margin: 0;
}
.sector-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0 36px;
}
.sector {
  border-top: 1px solid #cdd1c5;
  padding: 24px 0 26px;
}
.sector h3 {
  font-size: 23px;
  margin: 0 0 8px;
  letter-spacing: -0.025em;
}
.sector p {
  margin: 0 0 12px;
  color: #53554e;
}
.sector a {
  font-weight: 700;
}
.sector-tag {
  color: var(--link);
  font-size: 12px;
  font-weight: 700;
  margin-left: 8px;
}
.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 65px;
}
.service-list {
  list-style: none;
  padding: 0;
  margin: 24px 0 0;
}
.service-list li {
  padding: 16px 0;
  border-top: 1px solid var(--line);
}
.service-list strong {
  display: block;
  font-size: 17px;
  margin-bottom: 4px;
}
.service-list span {
  color: #55574f;
}
.result-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 42px;
}
.result {
  padding: 24px 0;
  border-top: 1px solid #cdd1c5;
}
.result b {
  display: block;
  font-size: clamp(28px, 3vw, 38px);
  line-height: 1.15;
  letter-spacing: -0.04em;
  margin-bottom: 7px;
}
.result p {
  margin: 0;
  color: #55574f;
}
.fine {
  font-size: 13px;
  color: var(--muted);
}
.gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.gallery a {
  display: block;
  color: var(--ink);
  text-decoration: none;
}
.gallery img {
  width: 100%;
  aspect-ratio: 1.45;
  object-fit: cover;
  background: var(--mist);
  border: 1px solid var(--line);
}
.gallery span {
  display: block;
  padding: 10px 2px;
  font-size: 14px;
  font-weight: 700;
}
.trust-row {
  display: flex;
  align-items: center;
  gap: 48px;
}
.trust-row img {
  max-width: 470px;
  width: 60%;
}
.trust-copy {
  max-width: 480px;
}
.trust-copy p {
  color: var(--muted);
}
.dark-contact {
  background: #242522;
  color: #fff;
  padding: 76px 0;
}
.contact-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 52px;
  align-items: center;
}
.dark-contact h2 {
  font-size: clamp(38px, 5vw, 60px);
  line-height: 1.05;
  letter-spacing: -0.045em;
  margin: 0 0 18px;
}
.dark-contact p {
  color: #d5d6d1;
}
.dark-contact a:not(.button) {
  color: #c4e76c;
}
.contact-details {
  border-left: 1px solid #63655d;
  padding-left: 32px;
}
.contact-details p {
  margin: 0 0 14px;
}
.site-footer {
  padding: 28px 0;
  color: #5a5b55;
  font-size: 13px;
}
.footer-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.footer-links {
  display: flex;
  gap: 22px;
}
.footer-links a {
  color: var(--link);
}
.page-head {
  padding: 66px 0 44px;
  background: var(--mist);
}
.page-head p {
  font-size: 19px;
  max-width: 780px;
  color: #55574f;
  margin: 18px 0 0;
}
.content {
  padding: 54px 0 78px;
}
.content h2 {
  font-size: 32px;
  line-height: 1.15;
  letter-spacing: -0.035em;
  margin: 0 0 16px;
}
.content h3 {
  font-size: 22px;
  margin: 28px 0 8px;
}
.content p {
  max-width: 800px;
}
.feature-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 42px;
}
.feature {
  border-top: 1px solid var(--line);
  padding-top: 20px;
}
.feature img {
  width: 100%;
  aspect-ratio: 1.6;
  object-fit: cover;
  margin: 18px 0;
}
.steps {
  counter-reset: step;
  list-style: none;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.steps li {
  counter-increment: step;
  border-top: 2px solid var(--green);
  padding-top: 15px;
}
.steps li:before {
  content: "0" counter(step);
  display: block;
  font-size: 13px;
  color: var(--link);
  font-weight: 700;
  margin-bottom: 8px;
}
.funnel {
  display: flex;
  gap: 0;
  align-items: stretch;
  margin: 24px 0;
}
.funnel span {
  padding: 16px;
  background: #edf2df;
  flex: 1;
  text-align: center;
  border-right: 1px solid white;
  font-weight: 700;
}
.notice {
  background: #f0f3e8;
  border-left: 4px solid var(--green);
  padding: 18px 22px;
  margin: 28px 0;
}
.terms {
  columns: 2;
  column-gap: 60px;
}
.terms li {
  break-inside: avoid;
  margin: 0 0 10px;
}
.not-found {
  text-align: center;
  padding: 100px 0;
}
.not-found h1 {
  font-size: clamp(48px, 8vw, 90px);
  margin: 0;
}
.mobile-nav summary {
  list-style: none;
  cursor: pointer;
  font-weight: 700;
  padding: 12px 16px;
  border: 1px solid var(--line);
}
.mobile-nav summary::-webkit-details-marker {
  display: none;
}
.mobile-nav nav {
  padding: 12px 0 18px;
  display: grid;
  gap: 12px;
}
.mobile-nav nav a {
  text-decoration: none;
  color: var(--ink);
  padding: 5px 0;
}
.mobile-nav .nav-cta {
  display: inline-flex;
  width: max-content;
  padding: 10px 16px;
  background: var(--green);
  font-weight: 700;
}
.mobile-nav details[open] summary {
  border-color: var(--link);
}
@media (max-width: 900px) {
  .nav {
    gap: 12px;
  }
  .nav a {
    font-size: 13px;
  }
  .nav .nav-cta {
    padding-inline: 13px;
  }
  .hero-grid {
    gap: 28px;
  }
  .trust-row {
    gap: 25px;
  }
}
@media (max-width: 760px) {
  .wrap {
    width: min(100% - 36px, var(--wrap));
  }
  .header-inner {
    min-height: 76px;
  }
  .brand {
    width: 150px;
  }
  .nav {
    display: none;
  }
  .mobile-nav {
    display: block;
  }
  .hero {
    padding: 44px 0 55px;
  }
  .hero-grid,
  .split,
  .contact-grid,
  .feature-grid {
    grid-template-columns: 1fr;
  }
  .hero-grid {
    gap: 32px;
  }
  .hero h1 {
    font-size: clamp(42px, 12vw, 62px);
  }
  .hero p {
    font-size: 17px;
  }
  .hero .button {
    display: flex;
    width: fit-content;
  }
  .hero .button + .button {
    margin: 12px 0 0;
  }
  .hero-media {
    margin-right: 12px;
  }
  .section {
    padding: 58px 0;
  }
  .section-head {
    display: block;
  }
  .section-head p {
    margin-top: 16px;
  }
  .sector-grid {
    grid-template-columns: 1fr;
  }
  .result-list {
    grid-template-columns: 1fr;
  }
  .gallery {
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  .trust-row {
    display: block;
  }
  .trust-row img {
    width: 100%;
    margin: 0 0 25px;
  }
  .contact-details {
    padding: 24px 0 0;
    border-left: 0;
    border-top: 1px solid #63655d;
  }
  .page-head {
    padding: 50px 0 34px;
  }
  .page-head h1 {
    font-size: clamp(38px, 11vw, 56px);
  }
  .content {
    padding: 38px 0 58px;
  }
  .steps {
    grid-template-columns: 1fr 1fr;
  }
  .terms {
    columns: 1;
  }
  .footer-inner {
    align-items: flex-start;
    flex-direction: column;
  }
  .footer-links {
    flex-wrap: wrap;
  }
  .funnel {
    flex-direction: column;
  }
  .funnel span {
    border-bottom: 1px solid white;
  }
  .dark-contact {
    padding: 58px 0;
  }
}
@media (max-width: 390px) {
  .wrap {
    width: calc(100% - 32px);
  }
  .gallery {
    grid-template-columns: 1fr;
  }
  .button {
    max-width: 100%;
    white-space: normal;
    text-align: center;
  }
  .hero-media:after {
    right: -8px;
    bottom: -8px;
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition: none !important;
    animation: none !important;
  }
}

/* Aviso de privacidad */
.legal-date { font-size: 15px !important; color: #6b6d64 !important; }
.legal h2 { margin-top: 52px; scroll-margin-top: 100px; }
.legal h2:first-of-type { margin-top: 36px; }
.legal ul, .legal ol { max-width: 800px; padding-left: 22px; }
.legal li { margin: 0 0 8px; }
.legal-toc { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 22px 0; }
.legal-toc ol { columns: 2; column-gap: 48px; margin: 0; max-width: none; }
.legal-toc a { color: var(--link); }
@media (max-width: 760px) { .legal-toc ol { columns: 1; } .legal h2 { font-size: 26px; } }
/* Botón secundario */
.button-ghost { background: transparent; box-shadow: inset 0 0 0 2px var(--ink); }
.button-ghost:hover { background: var(--ink); color: #fff; }

/* ============ Capa de movimiento ============ */
.site-header { position: sticky; top: 0; transition: box-shadow .3s, background .3s; }
.site-header.scrolled { box-shadow: 0 8px 30px rgba(29,29,27,.08); background: rgba(255,255,255,.92); backdrop-filter: saturate(1.4) blur(10px); }
.progress { position: fixed; top: 0; left: 0; height: 3px; width: 100%; background: var(--green); transform-origin: 0 50%; transform: scaleX(0); z-index: 50; pointer-events: none; }

/* Revelado al hacer scroll (solo con JS) */
.js [data-reveal] { opacity: 0; transform: translateY(34px); transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); transition-delay: var(--d, 0s); }
.js [data-reveal].in { opacity: 1; transform: none; }

/* Kicker numerado */
.kicker { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #e9f5c9; margin: 0 0 18px; }
.kicker.dark { color: var(--link); }
.sec-n { display: inline-block; padding: 4px 10px; border: 1.5px solid currentColor; border-radius: 99px; letter-spacing: .06em; }

/* Hero con video */
.hero-v { position: relative; min-height: min(92vh, 860px); display: flex; align-items: flex-end; color: #fff; overflow: hidden; background: #111 url(../img/reel.jpg) center/cover; }
.hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.06); animation: slowzoom 18s ease-in-out infinite alternate; }
@keyframes slowzoom { to { transform: scale(1.14); } }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(17,17,15,.25) 0%, rgba(17,17,15,.35) 40%, rgba(17,17,15,.88) 100%), linear-gradient(90deg, rgba(17,17,15,.55), transparent 70%); }
.hero-v-inner { position: relative; padding: 140px 0 110px; }
.hero-title { font-size: clamp(44px, 7.6vw, 112px); line-height: .95; letter-spacing: -.055em; margin: 0 0 26px; max-width: 13ch; font-weight: 800; }
.hero-title .w { font-style: normal; position: relative; display: inline-block; transition: color .5s; }
.hero-title .w::after { content: ""; position: absolute; left: 0; right: 0; bottom: .02em; height: .09em; background: var(--green); transform: scaleX(0); transform-origin: 0 50%; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.hero-title .w.on { color: var(--green); }
.hero-title .w.on::after { transform: scaleX(1); }
.hero-lead { font-size: clamp(17px, 1.6vw, 21px); max-width: 620px; color: #e7e8e2; margin: 0 0 32px; }
.hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; }
.button-light { background: transparent; color: #fff; box-shadow: inset 0 0 0 2px #fff; }
.button-light:hover { background: #fff; color: var(--ink); }
.scroll-cue { position: absolute; right: max(24px, calc((100% - var(--wrap)) / 2)); bottom: 34px; color: #fff; text-decoration: none; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; writing-mode: vertical-rl; display: flex; align-items: center; gap: 12px; }
.scroll-cue span { width: 1.5px; height: 60px; background: rgba(255,255,255,.3); position: relative; overflow: hidden; }
.scroll-cue span::after { content: ""; position: absolute; left: 0; top: -40%; width: 100%; height: 40%; background: var(--green); animation: cue 1.8s ease-in-out infinite; }
@keyframes cue { to { top: 100%; } }
.js .hero-v-inner > * { animation: rise 1s cubic-bezier(.2,.7,.2,1) both; }
.js .hero-v-inner > :nth-child(2) { animation-delay: .12s; }
.js .hero-v-inner > :nth-child(3) { animation-delay: .24s; }
.js .hero-v-inner > :nth-child(4) { animation-delay: .36s; }
@keyframes rise { from { opacity: 0; transform: translateY(40px); } }

/* Marquesina */
.marquee { overflow: hidden; background: var(--green); color: var(--ink); padding: 18px 0; }
.marquee-track { display: flex; width: max-content; animation: mq 38s linear infinite; }
.marquee-track > div { display: flex; align-items: center; flex: none; }
.marquee span { font-size: clamp(22px, 3vw, 38px); font-weight: 800; letter-spacing: -.03em; padding: 0 22px; white-space: nowrap; }
.marquee b { font-size: 20px; }
.marquee:hover .marquee-track { animation-play-state: paused; }
@keyframes mq { to { transform: translateX(-50%); } }
.marquee-img { background: transparent; padding: 46px 0 0; }
.marquee-img .marquee-track.slow { animation-duration: 60s; }
.marquee-img img { height: clamp(180px, 22vw, 280px); width: auto; margin-right: 18px; border-radius: 6px; }

/* Rieles de giros */
.slider-nav { display: flex; gap: 10px; align-self: end; }
.arrow { width: 52px; height: 52px; border-radius: 50%; border: 1.5px solid var(--ink); background: #fff; font-size: 20px; cursor: pointer; transition: background .25s, color .25s, transform .25s; }
.arrow:hover { background: var(--ink); color: #fff; transform: scale(1.06); }
.giro-rail { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(290px, 360px); gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 8px max(24px, calc((100% - var(--wrap)) / 2)) 26px; scroll-padding-inline: max(24px, calc((100% - var(--wrap)) / 2)); scrollbar-width: thin; }
.giro { scroll-snap-align: start; position: relative; display: flex; flex-direction: column; min-height: 380px; padding: 28px; border-radius: 14px; background: var(--mist); color: var(--ink); text-decoration: none; overflow: hidden; isolation: isolate; transition: transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s; }
.giro::before { content: ""; position: absolute; inset: auto 0 0 0; height: 5px; background: var(--green); transform: scaleX(.18); transform-origin: 0 50%; transition: transform .5s cubic-bezier(.2,.7,.2,1); }
.giro:hover { transform: translateY(-8px); box-shadow: 0 24px 50px rgba(29,29,27,.14); }
.giro:hover::before { transform: scaleX(1); }
.giro.has-img { color: #fff; background-color: #222; background-size: cover; background-position: center; }
.giro.has-img::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.82)); }
.giro-n { font-size: 96px; font-weight: 800; letter-spacing: -.06em; line-height: .9; color: transparent; -webkit-text-stroke: 1.5px var(--link); transition: color .4s; }
.giro.has-img .giro-n { -webkit-text-stroke-color: #fff; }
.giro:hover .giro-n { color: var(--green); -webkit-text-stroke-color: var(--green); }
.giro:not(.has-img):hover { background: #edf3dc; }
.giro-tag { position: absolute; top: 28px; right: 28px; background: var(--green); color: var(--ink); font-size: 12px; font-weight: 800; padding: 5px 10px; border-radius: 99px; }
.giro h3 { margin: auto 0 10px; font-size: 28px; letter-spacing: -.035em; line-height: 1.05; }
.giro p { margin: 0 0 18px; opacity: .85; }
.giro-go { font-weight: 700; }
.giro-go i { display: inline-block; font-style: normal; transition: transform .3s; }
.giro:hover .giro-go i { transform: translateX(6px); }

/* Títulos grandes y contorno */
.big { font-size: clamp(42px, 5.6vw, 76px) !important; line-height: .98 !important; letter-spacing: -.05em !important; }
.outline { color: transparent; -webkit-text-stroke: 1.5px var(--ink); }
.dark-contact .outline { -webkit-text-stroke-color: #fff; }
.link-arrow { font-weight: 700; text-decoration: none; border-bottom: 2px solid var(--green); padding-bottom: 2px; }
.link-arrow i { font-style: normal; display: inline-block; transition: transform .3s; }
.link-arrow:hover i { transform: translateX(5px); }
.service-list li { transition: padding-left .3s, background .3s; }
.service-list li:hover { padding-left: 10px; background: linear-gradient(90deg, rgba(149,193,31,.14), transparent); }

/* Cifras */
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0 30px; margin-bottom: 30px; }
.stat { border-top: 2px solid var(--ink); padding-top: 22px; }
.stat b { display: block; font-size: clamp(52px, 6vw, 88px); line-height: 1; letter-spacing: -.06em; font-weight: 800; font-variant-numeric: tabular-nums; }
.stat strong { display: block; font-size: 20px; margin: 6px 0 10px; color: var(--link); }
.stat p { margin: 0; color: #55574f; font-size: 15px; }
.trust-nums { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.trust-nums b { display: block; font-size: clamp(56px, 7vw, 100px); line-height: 1; letter-spacing: -.06em; font-weight: 800; }
.trust-nums span:not(.count) { color: var(--muted); }
.brands { margin: 44px auto 0; opacity: .9; }

/* Galería con zoom */
.gallery a { overflow: hidden; border-radius: 10px; }
.gallery img { transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.gallery a:hover img { transform: scale(1.06); }

@media (max-width: 900px) {
  .stat-grid { grid-template-columns: 1fr 1fr; gap: 26px; }
}
@media (max-width: 760px) {
  .hero-v { min-height: 88vh; }
  .hero-v-inner { padding: 110px 0 90px; }
  .scroll-cue { display: none; }
  .slider-nav { display: none; }
  .giro-rail { grid-auto-columns: 82%; }
  .giro { min-height: 330px; }
  .stat-grid { grid-template-columns: 1fr; }
  .trust-nums { margin-bottom: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-video { display: none; }
  .marquee-track, .hero-video, .scroll-cue span::after { animation: none !important; }
  .js [data-reveal] { opacity: 1; transform: none; transition: none; }
  .js .hero-v-inner > * { animation: none; }
}

/* Familias de servicios y caso de estudio */
.family { max-width: 760px; margin: 0 0 34px; }
.family + .feature-grid + .family { margin-top: 90px; }
.family h2 { font-size: clamp(34px, 4.4vw, 56px) !important; line-height: 1 !important; letter-spacing: -.045em !important; }
.feature h3 { font-size: 26px; letter-spacing: -.03em; margin: 0 0 10px; }
.mega { font-size: clamp(76px, 11vw, 150px); line-height: .9; font-weight: 800; letter-spacing: -.07em; color: var(--ink); margin: 0 0 10px; font-variant-numeric: tabular-nums; }
.case-card { display: grid; grid-template-columns: .9fr 1.4fr; gap: 50px; padding: 48px; border-radius: 16px; background: var(--ink); color: #fff; margin: 0 0 60px; }
.case-card .mega { color: var(--green); }
.case-label { font-size: 20px; color: #d9dbd2; margin: 0; }
.case-card .kicker.dark { color: #c4e76c; }
.case-card h2 { font-size: clamp(30px, 3.4vw, 44px); line-height: 1.05; letter-spacing: -.04em; margin: 0 0 16px; }
.case-card p { color: #e1e3db; }
.quotes { list-style: none; padding: 0; margin: 22px 0; }
.quotes li { border-left: 3px solid var(--green); padding: 6px 0 6px 16px; margin: 0 0 12px; font-size: 18px; }
.hero-title.wide { max-width: 17ch; font-size: clamp(40px, 6.2vw, 92px); }
.hero-title .on-static { color: var(--green); }
#auditoria .mega { margin-top: -6px; }
@media (max-width: 760px) {
  .case-card { grid-template-columns: 1fr; gap: 20px; padding: 28px; }
}

/* Visor de imágenes */
.lightbox { border: 0; padding: 0; background: transparent; max-width: 100vw; max-height: 100vh; width: 100vw; height: 100vh; display: none; align-items: center; justify-content: center; }
.lightbox[open] { display: flex; }
.lightbox::backdrop { background: rgba(17,17,15,.9); backdrop-filter: blur(4px); }
.lightbox figure { margin: 0; max-width: min(1100px, 86vw); text-align: center; }
.lightbox img { max-height: 80vh; width: auto; margin: 0 auto; border-radius: 8px; box-shadow: 0 30px 80px rgba(0,0,0,.5); animation: lbin .35s cubic-bezier(.2,.7,.2,1); }
@keyframes lbin { from { opacity: 0; transform: scale(.96); } }
.lightbox figcaption { color: #e7e8e2; margin-top: 12px; font-size: 15px; }
.lightbox button { position: fixed; width: 52px; height: 52px; border-radius: 50%; border: 0; background: #fff; color: var(--ink); font-size: 22px; cursor: pointer; }
.lb-close { top: 18px; right: 18px; }
.lb-prev { left: 18px; top: 50%; transform: translateY(-50%); }
.lb-next { right: 18px; top: 50%; transform: translateY(-50%); }
.lightbox button:hover { background: var(--green); }
@media (max-width: 760px) { .lb-prev, .lb-next { top: auto; bottom: 18px; transform: none; } }

/* Producción: pestañas y galerías */
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ptabs { display: flex; flex-wrap: wrap; gap: 10px; }
.ptabs > label { cursor: pointer; padding: 12px 22px; border-radius: 99px; border: 1.5px solid var(--ink); font-weight: 700; transition: background .25s, color .25s; }
.ptabs > label small { opacity: .6; margin-left: 4px; }
.ptabs > label:hover { background: #edf3dc; }
.ptabs > input:checked + label { background: var(--ink); color: #fff; }
.ptabs > input:focus-visible + label { outline: 3px solid #577c0b; outline-offset: 3px; }
.ppane { display: none; width: 100%; padding-top: 30px; animation: rise .5s cubic-bezier(.2,.7,.2,1) both; }
#pt-fot:checked ~ .pp-fot, #pt-vid:checked ~ .pp-vid, #pt-dis:checked ~ .pp-dis { display: block; }
.psub { color: var(--muted); margin: 0 0 22px; }
.ph { font-size: 26px !important; margin: 46px 0 18px !important; }
.pp-dis .ph:first-child { margin-top: 0 !important; }
.pgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.pgrid.sq { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.pgrid.wide { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.pitem { position: relative; display: block; overflow: hidden; border-radius: 10px; background: var(--mist); text-decoration: none; color: #fff; }
.pitem img { width: 100%; aspect-ratio: 4/3; object-fit: cover; transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.pgrid.sq .pitem img { aspect-ratio: 1; }
.pgrid.wide .pitem img { aspect-ratio: 1.91; }
.pgrid.tall .pitem img { aspect-ratio: 4/5; }
.pitem span { position: absolute; left: 0; right: 0; bottom: 0; padding: 30px 14px 12px; font-size: 14px; font-weight: 600; background: linear-gradient(transparent, rgba(0,0,0,.75)); opacity: 0; transform: translateY(8px); transition: .35s; }
.pitem:hover img { transform: scale(1.06); }
.pitem:hover span, .pitem:focus-visible span { opacity: 1; transform: none; }
.vgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 18px; align-items: start; }
.vcard { margin: 0; }
.vcard video { width: 100%; aspect-ratio: 16/9; background: #111; border-radius: 10px; object-fit: cover; }
.vcard.vert video { aspect-ratio: 9/16; max-height: 520px; object-fit: contain; }
.vcard figcaption { padding: 10px 2px; }
.vcard small, .ytcard small { display: block; color: var(--muted); }
.ytgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 18px; }
.ytcard { text-decoration: none; color: var(--ink); }
.ytthumb { position: relative; display: block; overflow: hidden; border-radius: 10px; margin-bottom: 10px; background: #111; }
.ytthumb img { width: 100%; aspect-ratio: 16/9; object-fit: cover; transition: transform .6s; }
.ytthumb i { position: absolute; inset: 0; margin: auto; width: 58px; height: 58px; border-radius: 50%; background: var(--green); color: var(--ink); font-style: normal; display: grid; place-items: center; font-size: 20px; transition: transform .3s; }
.ytcard:hover .ytthumb img { transform: scale(1.06); }
.ytcard:hover .ytthumb i { transform: scale(1.12); }
.ytbox .ytframe { width: min(1100px, 92vw); aspect-ratio: 16/9; }
.ytbox .ytframe.short { width: min(420px, 90vw); aspect-ratio: 9/16; max-height: 86vh; }
.ytbox iframe { width: 100%; height: 100%; border: 0; border-radius: 10px; background: #000; }
@media (max-width: 760px) { .pgrid, .pgrid.sq { grid-template-columns: 1fr 1fr; gap: 10px; } .pgrid.wide { grid-template-columns: 1fr; } .pitem span { opacity: 1; transform: none; font-size: 12px; padding: 20px 8px 8px; } .ptabs > label { padding: 10px 16px; } }

/* Maquetas de teléfono */
.mock-wrap { display: grid; grid-template-columns: 220px 1fr; gap: 26px; align-items: center; margin: 18px 0; padding: 26px; background: linear-gradient(135deg, #f0f5e2, #f4f5f1); border-radius: 16px; }
.phone { width: 220px; aspect-ratio: 9/19; border-radius: 34px; background: #111; padding: 10px; box-shadow: 0 30px 60px rgba(29,29,27,.25), inset 0 0 0 2px #333; position: relative; }
.phone::before { content: ""; position: absolute; top: 16px; left: 50%; width: 64px; height: 18px; margin-left: -32px; background: #111; border-radius: 12px; z-index: 3; }
.phone-scr { position: relative; width: 100%; height: 100%; border-radius: 26px; overflow: hidden; background: #fff; }
.phone-scr img { width: 100%; height: auto; }
.phone-scr iframe { position: absolute; top: 0; left: 0; width: 390px; height: 844px; border: 0; transform: scale(.513); transform-origin: 0 0; background: transparent; }
.phone-scr.scroll img { animation: mailscroll 16s ease-in-out infinite alternate; }
@keyframes mailscroll { 0%, 8% { transform: translateY(0); } 92%, 100% { transform: translateY(calc(-100% + 390px)); } }
.mock-points { list-style: none; padding: 0; margin: 0; }
.mock-points li { padding: 9px 0 9px 26px; position: relative; border-bottom: 1px solid var(--line); }
.mock-points li::before { content: "✓"; position: absolute; left: 0; color: var(--link); font-weight: 800; }
.mock-points li:last-child { border: 0; }
.mock-points li:last-child::before { content: ""; }
.mock-kpis { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.mock-kpis .tagline { grid-column: 1 / -1; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: var(--link); }
.mock-kpis b { display: block; font-size: 32px; letter-spacing: -.04em; line-height: 1; }
.mock-kpis small { color: var(--muted); }
.feat-link { display: block; overflow: hidden; border-radius: 10px; }
.feat-link img { transition: transform .7s; }
.feat-link:hover img { transform: scale(1.05); }
@media (max-width: 760px) { .mock-wrap { grid-template-columns: 1fr; justify-items: center; } .phone { width: 210px; } .phone-scr iframe { transform: scale(.49); } }
@media (prefers-reduced-motion: reduce) { .phone-scr.scroll img { animation: none; } }
.feature .phone-scr img { aspect-ratio: auto; margin: 0; object-fit: initial; }
.phone-scr iframe { opacity: 0; transition: opacity .4s; }
.phone-scr iframe.ok { opacity: 1; }
.page-head .kicker { font-size: 13px; color: var(--link); margin: 0 0 18px; }

/* Certificaciones en el pie */
.footer-inner { flex-wrap: wrap; }
.certs { flex-basis: 100%; display: flex; align-items: center; flex-wrap: wrap; gap: 6px 18px; padding-bottom: 18px; margin-bottom: 6px; border-bottom: 1px solid var(--line); }
.certs span { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #5f6159; margin-right: 4px; }
.certs a { display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 50%; transition: background .25s, transform .25s; }
.certs svg { width: 22px; height: 22px; fill: #9a9c94; transition: fill .25s; }
.certs a:hover { background: var(--mist); transform: translateY(-2px); }
.certs a:hover svg, .certs a:focus-visible svg { fill: var(--ink); }
@media (max-width: 760px) { .certs { gap: 4px 8px; } .certs span { flex-basis: 100%; margin-bottom: 4px; } }
.kicker a { color: inherit; }

/* NOVA destacado */
.nova-sec { background: radial-gradient(circle at 85% 0%, rgba(149,193,31,.28), transparent 45%), #151613; color: #fff; }
.nova-sec h2, .nova-sec h3 { color: #fff; }
.nova-sec p { color: #d9dbd2; }
.nova-sec .fine { color: #9fa196; }
.nova-sec .kicker .sec-n { background: var(--green); color: var(--ink); border-color: var(--green); }
.nova-sec .steps li { border-top-color: var(--green); color: #fff; }
.nova-sec .steps li:before { color: var(--green); }
.nova-sec .funnel span { background: rgba(149,193,31,.16); color: #fff; border-right-color: #151613; }
.nova-sec .funnel span:last-child { background: var(--green); color: var(--ink); }
.nav .nav-nova, .mobile-nav .nav-nova { position: relative; }
.nav .nav-nova { margin-right: 10px; }
.nav .nav-nova::after { content: "IA"; position: absolute; top: -9px; right: -18px; font-size: 9px; font-weight: 800; background: var(--green); color: var(--ink); padding: 1px 4px; border-radius: 4px; }

/* Páginas de giro ampliadas */
.page-head-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items: center; }
.giro-hero { margin: 0; border-radius: 14px; overflow: hidden; box-shadow: 0 24px 50px rgba(29,29,27,.15); }
.giro-hero img { width: 100%; aspect-ratio: 3/2; object-fit: cover; }
.page-head-grid:not(:has(.giro-hero)):not(:has(.mega-box)) { grid-template-columns: 1fr; }
.giro-extra p { color: #3f413b; font-size: 17px; }
.how-steps li strong { display: block; font-size: 19px; margin-bottom: 6px; }
.how-steps li span { color: var(--muted); }
.faq-wrap { display: grid; grid-template-columns: .8fr 1.2fr; gap: 48px; align-items: start; }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item summary { cursor: pointer; list-style: none; padding: 20px 40px 20px 0; font-weight: 700; font-size: 18px; position: relative; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; position: absolute; right: 6px; top: 16px; font-size: 26px; color: var(--link); transition: transform .3s; }
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-item p { margin: 0 0 20px; color: #3f413b; }
@media (max-width: 900px) { .page-head-grid, .faq-wrap { grid-template-columns: 1fr; gap: 28px; } .how-steps { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .how-steps { grid-template-columns: 1fr; } }
.mega-box { padding: 32px; border-radius: 16px; background: var(--ink); color: #fff; }
.mega-box .mega { color: var(--green); margin: 0 0 10px; }
.mega-box p:last-child { color: #d9dbd2; font-size: 17px; margin: 0; }
.giro-extra-txt p { color: #3f413b; font-size: 17px; }
.page-head .mega-box .mega { font-size: clamp(76px, 9vw, 130px); margin: 0 0 10px; color: var(--green); max-width: none; }
.page-head .mega-box p:last-child { color: #d9dbd2; font-size: 17px; margin: 0; }
@media (max-width: 900px) { .page-head-grid:has(.mega-box) { grid-template-columns: 1fr; } }
.phone-hero { box-shadow: none; border-radius: 0; overflow: visible; display: flex; justify-content: center; }
.phone-hero .phone { width: 260px; }
.page-head-grid:has(.phone-hero) { grid-template-columns: 1.2fr .8fr; }
@media (max-width: 900px) { .page-head-grid:has(.phone-hero) { grid-template-columns: 1fr; } }

/* Escaneo de visibilidad (SEO local) */
.geo-sec { background: radial-gradient(circle at 10% 0%, rgba(149,193,31,.22), transparent 45%), #151613; color: #fff; }
.geo-sec h2, .geo-sec h3 { color: #fff; }
.geo-sec .section-head p, .geo-sec p { color: #d9dbd2; }
.geo-sec .kicker .sec-n { background: var(--green); color: var(--ink); border-color: var(--green); }
.geo-sec .fine { color: #9fa196; }
.geo-wrap { display: grid; grid-template-columns: 1.1fr .9fr; gap: 40px; align-items: center; margin-top: 10px; }
.geo-map { background: #1f211c; border: 1px solid #33352f; border-radius: 16px; padding: 24px; }
.geo-title { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 6px 16px; margin: 0 0 16px; font-size: 14px; }
.geo-title strong { color: #fff; }
.geo-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; aspect-ratio: 1.25; padding: 18px; border-radius: 12px; background:
  repeating-linear-gradient(0deg, rgba(255,255,255,.04) 0 1px, transparent 1px 36px),
  repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px 36px),
  linear-gradient(135deg, #2a2d26, #23251f); }
.geo-grid span { display: grid; place-items: center; border-radius: 10px; font-weight: 800; font-size: clamp(15px, 2vw, 22px); color: #fff; }
.js .geo-sec .in .geo-grid span, .js .geo-grid span { animation: geoin .5s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(var(--i) * 45ms); }
@keyframes geoin { from { opacity: 0; transform: scale(.6); } }
.g-top { background: #1f9d55; }
.g-mid { background: #d9a21b; color: var(--ink) !important; }
.g-low { background: #c8402e; }
.g-no { background: #6b6e66; font-size: 13px !important; opacity: .85; }
.g-me { outline: 3px solid #fff; outline-offset: 3px; }
.geo-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 14px 0 0; font-size: 13px; }
.geo-legend i { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.geo-kpis { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 18px; }
.geo-kpis div { background: #1f211c; border: 1px solid #33352f; border-radius: 12px; padding: 18px; }
.geo-kpis b { display: block; font-size: clamp(34px, 4vw, 48px); line-height: 1; letter-spacing: -.04em; color: var(--green); }
.geo-kpis span { display: block; margin-top: 8px; color: #d9dbd2; font-size: 14px; }
.geo-detail { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 48px; }
.geo-table { width: 100%; border-collapse: collapse; font-size: 15px; }
.geo-table th { text-align: left; color: #9fa196; font-weight: 600; border-bottom: 1px solid #44463f; padding: 8px 6px; }
.geo-table td { border-bottom: 1px solid #33352f; padding: 10px 6px; color: #e7e8e2; }
.geo-table tr.me td { background: rgba(149,193,31,.14); }
.geo-plan { list-style: none; padding: 0; margin: 0; }
.geo-plan li { border-left: 3px solid #d9a21b; padding: 6px 0 6px 14px; margin: 0 0 12px; color: #e7e8e2; font-size: 15px; }
.geo-plan li.hi { border-left-color: #c8402e; }
.geo-plan strong { color: #fff; }
.nav .nav-seo { white-space: nowrap; }
@media (max-width: 900px) { .geo-wrap, .geo-detail { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .geo-grid { gap: 6px; padding: 10px; } .geo-map { padding: 14px; } }
@media (prefers-reduced-motion: reduce) { .geo-grid span { animation: none !important; } }

/* Más aire en las secciones del escaneo */
.geo-sec { padding: 100px 0 96px; }
.geo-sec .section-head { margin-bottom: 30px; }
/* Versión clara para el inicio (separa del bloque oscuro de NOVA) */
.geo-light { background: radial-gradient(circle at 90% 0%, rgba(149,193,31,.18), transparent 45%), var(--mist); color: var(--ink); border-top: 1px solid var(--line); }
.geo-light h2, .geo-light h3 { color: var(--ink); }
.geo-light .section-head p, .geo-light p { color: #3f413b; }
.geo-light .kicker { color: var(--link); }
.geo-light .geo-kpis div { background: #fff; border-color: var(--line); }
.geo-light .geo-kpis b { color: var(--link); }
.geo-light .geo-kpis span { color: var(--muted); }
.geo-light .fine { color: var(--muted); }
/* Resultados esperados */
.seo-timeline { list-style: none; padding: 0; margin: 10px 0 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; counter-reset: none; }
.seo-timeline li { background: var(--mist); border-radius: 14px; padding: 22px; border-top: 4px solid var(--green); }
.seo-timeline .t-when { display: inline-block; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--link); margin-bottom: 8px; }
.seo-timeline strong { display: block; font-size: 19px; margin-bottom: 8px; letter-spacing: -.02em; }
.seo-timeline p { margin: 0; color: #4a4c45; font-size: 15px; }
.seo-gains { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 56px; align-items: start; }
.geo-check { list-style: none; padding: 0; margin: 0 0 16px; }
.geo-check li { padding: 10px 0 10px 28px; border-bottom: 1px solid var(--line); position: relative; }
.geo-check li::before { content: "✓"; position: absolute; left: 0; color: var(--link); font-weight: 800; }
.saver { background: var(--ink); color: #fff; border-radius: 16px; padding: 28px; }
.saver h3 { color: #fff; margin-top: 0; }
.saver p { color: #d9dbd2; }
.saver .fine { color: #9fa196; }
.saver label { display: block; font-size: 14px; color: #d9dbd2; margin: 14px 0 0; }
.saver input { display: block; width: 100%; margin-top: 6px; padding: 12px 14px; font: inherit; font-size: 18px; font-weight: 700; border-radius: 8px; border: 1px solid #44463f; background: #1f211c; color: #fff; }
.saver input:focus { outline: 2px solid var(--green); }
.saver-out { margin: 22px 0 6px; padding: 18px; border-radius: 12px; background: rgba(149,193,31,.12); }
.saver-out span { color: #d9dbd2; font-size: 14px; }
.saver-out b { display: block; font-size: clamp(38px, 5vw, 56px); line-height: 1.05; color: var(--green); letter-spacing: -.04em; }
.saver-out small { display: block; margin-top: 6px; color: #fff; font-weight: 700; }
@media (max-width: 1000px) { .seo-timeline { grid-template-columns: 1fr 1fr; } }
@media (max-width: 760px) { .seo-timeline, .seo-gains { grid-template-columns: 1fr; } .geo-sec { padding: 72px 0; } }
.geo-light .geo-map p, .geo-light .geo-map span:not([class^="g-"]) { color: #d9dbd2; }
.geo-light .geo-map .geo-title strong { color: #fff; }
.geo-sec .section-head { margin-bottom: 44px; }
.geo-results { padding-top: 96px; }

/* Escaneo explicado con el reporte real */
.scan-wrap { display: grid; grid-template-columns: .95fr 1.05fr; gap: 48px; align-items: start; }
.scan-doc { position: relative; display: block; max-height: 640px; overflow: hidden; border-radius: 14px; background: #fff; box-shadow: 0 30px 70px rgba(0,0,0,.35); text-decoration: none; }
.scan-doc::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 160px; background: linear-gradient(transparent, rgba(255,255,255,.96)); }
.scan-doc img { width: 100%; height: auto; transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.scan-doc:hover img { transform: translateY(-40px); }
.scan-zoom { position: absolute; z-index: 2; left: 50%; bottom: 18px; transform: translateX(-50%); background: var(--ink); color: #fff; font-weight: 700; font-size: 14px; padding: 10px 18px; border-radius: 99px; white-space: nowrap; }
.scan-explain h3 { font-size: 24px; margin: 0 0 14px; }
.scan-steps { counter-reset: s; list-style: none; padding: 0; margin: 0 0 18px; }
.scan-steps li { counter-increment: s; position: relative; padding: 0 0 18px 48px; line-height: 1.55; }
.scan-steps li::before { content: counter(s); position: absolute; left: 0; top: -2px; width: 32px; height: 32px; border-radius: 50%; background: var(--green); color: var(--ink); font-weight: 800; display: grid; place-items: center; }
.scan-steps .dot { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin: 0 4px 0 6px; vertical-align: -1px; }
.geo-sec .scan-steps li { color: #e7e8e2; }
.geo-sec .scan-steps strong { color: #fff; }
.geo-light .scan-steps li { color: #3f413b; }
.geo-light .scan-steps strong { color: var(--ink); }
.geo-light .scan-doc { box-shadow: 0 30px 60px rgba(29,29,27,.18); }
@media (max-width: 900px) { .scan-wrap { grid-template-columns: 1fr; } .scan-doc { max-height: 520px; } }

/* Caso a 90 días */
.case90 { margin-top: 64px; padding: 36px; border-radius: 18px; background: #fff; border: 1px solid var(--line); box-shadow: 0 20px 50px rgba(29,29,27,.06); }
.case90-head h3 { font-size: clamp(26px, 3vw, 36px); letter-spacing: -.035em; line-height: 1.1; margin: 0 0 10px; }
.case90-head p:not(.kicker) { color: var(--muted); margin: 0 0 26px; }
.case90 h4 { font-size: 17px; margin: 0 0 12px; }
.case90-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 40px; }
.case90-now ul { padding-left: 18px; margin: 0 0 22px; }
.case90-now li { margin: 0 0 10px; color: #3f413b; }
.case90-bar { background: var(--mist); border-radius: 12px; padding: 18px; }
.case90-bar div { display: grid; grid-template-columns: 90px 1fr 70px; align-items: center; gap: 10px; margin-bottom: 10px; font-size: 14px; }
.case90-bar i { display: block; height: 14px; border-radius: 99px; background: linear-gradient(90deg, #8a8c84 var(--w), #e1e3db var(--w)); }
.case90-bar i.goal { background: linear-gradient(90deg, var(--green) var(--w), #e1e3db var(--w)); }
.case90-bar b { text-align: right; }
.case90-bar small { color: var(--muted); }
.case90-table { width: 100%; border-collapse: collapse; font-size: 15px; }
.case90-table td { padding: 12px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.case90-table td:first-child { font-weight: 700; width: 44%; }
.case90-table td:last-child { color: #3f413b; }
.case90-notes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin: 32px 0 14px; }
.case90-notes > div { background: var(--mist); border-radius: 12px; padding: 20px; }
.case90-notes > div:first-child { border-left: 4px solid #c8402e; }
.case90-notes p { margin: 0; font-size: 15px; color: #3f413b; }
@media (max-width: 900px) { .case90 { padding: 22px; } .case90-grid, .case90-notes { grid-template-columns: 1fr; } .case90-table td:first-child { width: 40%; } }

/* SEO local = construcción de marca */
.brand-build { max-width: 980px; margin-bottom: 40px; }
.brand-build .hl { color: var(--link); }
.brand-lead { font-size: clamp(18px, 1.7vw, 22px); line-height: 1.55; color: #3f413b; max-width: 860px; margin: 22px 0 0; }
.rent-own { display: grid; grid-template-columns: 1fr auto 1fr; gap: 22px; align-items: stretch; margin-bottom: 26px; }
.ro-card { border-radius: 18px; padding: 30px; }
.ro-card h3 { font-size: clamp(24px, 2.6vw, 32px); letter-spacing: -.035em; margin: 4px 0 16px; }
.ro-card ul { list-style: none; padding: 0; margin: 0; }
.ro-card li { padding: 10px 0 10px 28px; position: relative; border-top: 1px solid rgba(0,0,0,.08); }
.ro-tag { margin: 0; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.ro-rent { background: var(--mist); color: #4a4c45; }
.ro-rent li::before { content: "↻"; position: absolute; left: 0; color: #8a8c84; font-weight: 800; }
.ro-rent .ro-tag { color: var(--muted); }
.ro-own { background: var(--ink); color: #fff; box-shadow: 0 30px 60px rgba(29,29,27,.2); }
.ro-own h3 { color: #fff; }
.ro-own .ro-tag { color: var(--green); }
.ro-own li { border-top-color: rgba(255,255,255,.12); color: #e7e8e2; }
.ro-own li::before { content: "▲"; position: absolute; left: 0; color: var(--green); font-size: 13px; top: 13px; }
.ro-vs { align-self: center; width: 52px; height: 52px; border-radius: 50%; background: var(--green); color: var(--ink); font-weight: 800; display: grid; place-items: center; }
.ro-close { font-size: 18px; color: #3f413b; max-width: 900px; margin: 0 0 44px; }
@media (max-width: 900px) { .rent-own { grid-template-columns: 1fr; } .ro-vs { justify-self: center; } }

/* Programa híbrido SEO + Maps Ads */
.hybrid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 44px; align-items: center; margin: 0 0 56px; padding: 40px; border-radius: 20px; background: radial-gradient(circle at 100% 0%, rgba(149,193,31,.25), transparent 50%), #151613; color: #fff; }
.hybrid h3 { color: #fff; font-size: clamp(26px, 3vw, 38px); line-height: 1.08; letter-spacing: -.035em; margin: 0 0 16px; }
.hybrid p { color: #d9dbd2; }
.hybrid .kicker .sec-n { background: var(--green); color: var(--ink); border-color: var(--green); }
.hybrid .fine { color: #9fa196; }
.hybrid-list { list-style: none; padding: 0; margin: 18px 0 24px; }
.hybrid-list li { padding: 10px 0; border-top: 1px solid rgba(255,255,255,.12); color: #e7e8e2; }
.hybrid-list strong { color: #fff; }
.hybrid-vis { background: #1f211c; border: 1px solid #33352f; border-radius: 16px; padding: 22px; }
.g-ad { background: #2b5fd9; font-size: 13px !important; letter-spacing: .04em; box-shadow: inset 0 0 0 2px rgba(255,255,255,.25); }
.geo-legend i.g-ad { background: #2b5fd9; }
.hybrid .geo-legend { color: #d9dbd2; }
@media (max-width: 900px) { .hybrid { grid-template-columns: 1fr; padding: 24px; } }
.hybrid-vis { display: grid; grid-template-columns: 1fr; gap: 18px; }
.hybrid-phone { margin: 0; display: grid; grid-template-columns: 150px 1fr; gap: 18px; align-items: center; padding-bottom: 18px; border-bottom: 1px solid #33352f; }
.phone.phone-sm { width: 150px; padding: 7px; border-radius: 24px; display: block; }
.phone.phone-sm::before { top: 11px; width: 40px; height: 11px; margin-left: -20px; }
.phone.phone-sm .phone-scr { display: block; border-radius: 18px; }
.phone.phone-sm img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.hybrid-phone figcaption { color: #d9dbd2; font-size: 15px; }
.hybrid-phone figcaption strong { color: #fff; display: block; margin-bottom: 4px; }
@media (max-width: 560px) { .hybrid-phone { grid-template-columns: 120px 1fr; } .phone.phone-sm { width: 120px; } }

/* Híbrido explicado en 3 pasos */
.hybrid { display: block; }
.hybrid-head { max-width: 900px; margin-bottom: 28px; }
.hy-steps { display: grid; grid-template-columns: 1fr auto 1fr 1fr; gap: 22px; align-items: start; }
.hy-map, .hy-phone { margin: 0; background: #1f211c; border: 1px solid #33352f; border-radius: 16px; padding: 18px; }
.hy-map figcaption, .hy-phone figcaption { font-weight: 800; color: #fff; margin-bottom: 14px; display: flex; align-items: center; gap: 10px; }
.hy-n { width: 28px; height: 28px; border-radius: 50%; background: var(--green); color: var(--ink); display: grid; place-items: center; font-size: 14px; flex: none; }
.hy-map .geo-grid { gap: 6px; padding: 10px; aspect-ratio: 1; }
.hy-map .geo-grid span { font-size: 15px; border-radius: 7px; }
.hy-map .g-ad { font-size: 16px !important; }
.hy-plus { align-self: center; font-size: 40px; font-weight: 800; color: var(--green); }
.hy-note { font-size: 14px; color: #d9dbd2 !important; margin: 12px 0 0; }
.hy-note .dot { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin: 0 4px 0 2px; vertical-align: -1px; }
.hy-phone { display: flex; flex-direction: column; align-items: center; text-align: center; }
.hy-phone figcaption { align-self: stretch; text-align: left; }
.hy-phone .phone.phone-sm { width: 170px; }
.hy-foot { display: flex; flex-wrap: wrap; gap: 18px 30px; align-items: center; justify-content: space-between; margin: 28px 0 12px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.12); }
.hy-foot p { max-width: 720px; margin: 0; color: #e7e8e2; font-size: 17px; }
.hy-foot strong { color: #fff; }
@media (max-width: 1100px) { .hy-steps { grid-template-columns: 1fr auto 1fr; } .hy-phone { grid-column: 1 / -1; } }
@media (max-width: 700px) { .hy-steps { grid-template-columns: 1fr; } .hy-plus { justify-self: center; line-height: 1; } }

/* Diferencia explicada fácil */
.diff-kids { margin: 0 0 56px; }
.diff-kids h3 { font-size: clamp(26px, 3vw, 38px); line-height: 1.1; letter-spacing: -.035em; margin: 0 0 26px; max-width: 900px; }
.dk-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.dk-card { border-radius: 18px; padding: 28px; position: relative; }
.dk-pin { background: #eaf0ff; }
.dk-seo { background: #eef5dc; }
.dk-ico { font-size: 40px; line-height: 1; display: block; margin-bottom: 10px; }
.dk-card h4 { font-size: 26px; letter-spacing: -.03em; margin: 0; }
.dk-sub { margin: 2px 0 14px; color: var(--muted); font-weight: 600; }
.dk-card ul { list-style: none; padding: 0; margin: 0 0 16px; }
.dk-card li { padding: 8px 0 8px 22px; position: relative; font-size: 17px; color: #2f312b; }
.dk-card li::before { content: "•"; position: absolute; left: 4px; font-weight: 800; }
.dk-pin li::before { color: #2b5fd9; }
.dk-seo li::before { color: var(--link); }
.dk-sum { margin: 0; font-size: 20px; padding-top: 12px; border-top: 1px solid rgba(0,0,0,.1); }
.dk-pin .dk-sum strong { color: #2b5fd9; }
.dk-seo .dk-sum strong { color: var(--link); }
.dk-together { display: flex; gap: 16px; align-items: flex-start; margin-top: 22px; padding: 22px 26px; border-radius: 16px; background: var(--mist); border-left: 5px solid var(--green); }
.dk-together .dk-ico { font-size: 34px; margin: 0; }
.dk-together p { margin: 0; font-size: 17px; color: #2f312b; }
@media (max-width: 760px) { .dk-grid { grid-template-columns: 1fr; } }

/* Submenú de servicios */
.nav-dd { position: relative; display: flex; align-items: center; }
.nav-dd .dd-top::after { content: "▾"; margin-left: 5px; font-size: 11px; }
.dd-menu { display: none; position: absolute; top: 100%; left: -18px; min-width: 270px; padding: 10px; margin-top: 10px; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 24px 50px rgba(29,29,27,.16); z-index: 30; }
.dd-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
.nav-dd:hover .dd-menu, .nav-dd:focus-within .dd-menu { display: grid; }
.dd-menu a { padding: 9px 12px; border-radius: 8px; font-size: 14px; font-weight: 600; white-space: nowrap; }
.dd-menu a:hover, .dd-menu a[aria-current="page"] { background: var(--mist); color: var(--link); }
.dd-menu .dd-all { margin-top: 4px; border-top: 1px solid var(--line); border-radius: 0 0 8px 8px; color: var(--link); }
.m-sub { display: grid; margin: 0 0 6px 14px; padding-left: 12px; border-left: 2px solid var(--green); }
.m-sub a { font-size: 15px !important; padding: 7px 0 !important; font-weight: 500 !important; }
.lgal { grid-template-columns: repeat(3, 1fr); }
.mail-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 26px; }
.mail-kpis div { background: var(--mist); border-radius: 12px; padding: 18px; }
.mail-kpis b { display: block; font-size: clamp(30px, 3.4vw, 44px); line-height: 1; letter-spacing: -.04em; color: var(--link); }
.mail-kpis span { color: var(--muted); font-size: 14px; }
.vid-hero video { width: 100%; aspect-ratio: 4/5; max-height: 520px; object-fit: cover; background: #111; display: block; }
@media (max-width: 760px) { .lgal { grid-template-columns: 1fr; } .mail-kpis { grid-template-columns: 1fr 1fr; } }
/* Menú móvil como panel completo */
@media (max-width: 760px) {
  .mobile-nav details[open] > nav { position: absolute; left: 0; right: 0; top: 100%; background: #fff; padding: 14px 24px 26px; border-bottom: 1px solid var(--line); box-shadow: 0 24px 40px rgba(29,29,27,.14); max-height: calc(100vh - 80px); overflow-y: auto; gap: 6px; }
  .mobile-nav details[open] > nav > a { font-size: 17px; font-weight: 600; }
}
.phone-scr.fit { background: #111; }
.phone-scr.fit img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
/* NOVA: chat ilustrativo y comparativo */
.phone-scr.wa-chat { background: #efe7dd; display: flex; flex-direction: column; font-size: 12.5px; line-height: 1.35; }
.wa-top { background: #075e54; color: #fff; padding: 34px 14px 10px; display: flex; flex-direction: column; }
.wa-top small { opacity: .75; font-size: 11px; }
.wa-body { flex: 1; padding: 10px; display: flex; flex-direction: column; gap: 6px; overflow: hidden; }
.wa-body p { margin: 0; padding: 7px 9px 14px; border-radius: 8px; max-width: 86%; position: relative; box-shadow: 0 1px 1px rgba(0,0,0,.08); }
.wa-body p i { position: absolute; right: 7px; bottom: 2px; font-style: normal; font-size: 9.5px; opacity: .55; }
.wa-body .in { background: #fff; align-self: flex-start; }
.wa-body .out { background: #dcf8c6; align-self: flex-end; }
.js .wa-body p { opacity: 0; transform: translateY(8px); animation: waIn .45s ease forwards; }
.wa-body p:nth-child(1){animation-delay:.3s}.wa-body p:nth-child(2){animation-delay:1.1s}.wa-body p:nth-child(3){animation-delay:2s}.wa-body p:nth-child(4){animation-delay:2.8s}.wa-body p:nth-child(5){animation-delay:3.7s}.wa-body p:nth-child(6){animation-delay:4.5s}.wa-body p:nth-child(7){animation-delay:5.4s}.wa-body p:nth-child(8){animation-delay:6.2s}
@keyframes waIn { to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .js .wa-body p { opacity: 1; transform: none; animation: none; } }
.nova-vs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 20px; }
.nova-vs div { border: 1px solid rgba(29,29,27,.12); border-radius: 14px; padding: 18px; display: flex; flex-direction: column; gap: 2px; }
.nova-vs span { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; opacity: .7; }
.nova-vs b { font-size: 40px; line-height: 1.05; }
.nova-vs .on { background: #1d1d1b; color: #fff; border-color: #1d1d1b; }
.nova-vs .on b { color: var(--green); }
.wa-body p { font-size: 12.5px; line-height: 1.35; color: #1d1d1b; }
.nova-sec .wa-body p { color: #1d1d1b; }
.nova-sec .nova-vs div { border-color: rgba(255,255,255,.18); }
.nova-sec .nova-vs .on { background: var(--green); border-color: var(--green); color: var(--ink); }
.nova-sec .nova-vs .on b { color: var(--ink); }
.nova-sec .nova-vs span { color: inherit; }
.wa-body { justify-content: flex-end; }