/* TechPartners LATAM — styles
 * Hallmark · macrostructure: Bento + Split Hero · nav: floating-pill aw
 * Theme locked to tokens.css vars only.
 */

*,*::before,*::after{box-sizing:border-box}
html{
  scroll-behavior:smooth;
  scroll-padding-top:5rem;
  background:var(--color-paper);
  overflow-x:clip;
}
body{
  margin:0;
  min-width:320px;
  overflow-x:clip;
  color:var(--color-ink);
  background:var(--color-paper);
  font-family:var(--font-body);
  font-size:1rem;
  line-height:var(--leading-normal);
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
img,svg{display:block;max-width:100%}
a{color:inherit}
button,input{font:inherit}
h1,h2,h3,p,ul,ol,figure,blockquote,dl,dd{margin:0}
h1,h2,h3{font-family:var(--font-display);text-wrap:balance;overflow-wrap:anywhere;min-width:0}
p{text-wrap:pretty}
ul,ol{padding:0;list-style:none}

::selection{color:var(--color-accent-ink);background:var(--color-accent)}
:focus-visible{outline:2px solid var(--color-focus);outline-offset:3px;border-radius:2px}
:where(a,button,summary):focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}

.tnum{font-variant-numeric:tabular-nums lining-nums;font-family:var(--font-mono)}
.mono{font-family:var(--font-mono)}
.accent{color:var(--color-accent)}

/* Skip link */
.skip-link{
  position:fixed;
  inset:.75rem auto auto 1rem;
  z-index:9999;
  padding:.7rem 1rem;
  border-radius:var(--radius-sm);
  color:var(--color-paper);
  background:var(--color-ink);
  font-weight:700;
  font-size:var(--text-sm);
  text-decoration:none;
  transform:translateY(-180%);
  transition:transform var(--dur-short) var(--ease-out);
}
.skip-link:focus-visible{transform:translateY(0)}

/* Layout helpers */
.container{
  width:min(100% - 2*var(--page-gutter), var(--content-max));
  margin-inline:auto;
}
.eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;
  color:var(--color-muted);
  font-family:var(--font-mono);
  font-size:11px;
  font-weight:600;
  letter-spacing:0.14em;
  text-transform:uppercase;
}
.eyebrow::before{
  content:"";width:18px;height:1px;background:currentColor;opacity:.5;
}
.section-title{
  font-size:clamp(1.85rem, 3.5vw, 2.85rem);
  font-weight:700;
  line-height:var(--leading-tight);
  letter-spacing:var(--tracking-tighter);
  color:var(--color-ink);
}
.section-lede{
  max-width:52ch;
  margin-top:.85rem;
  color:var(--color-muted);
  font-size:clamp(1rem,1.4vw,1.08rem);
  line-height:1.65;
}
.section-head{
  margin-bottom:2.25rem;
}

/* Nav — floating pill blurred */
.nav-wrap{
  position:sticky;
  top:0;
  z-index:var(--z-nav);
  padding:.85rem var(--page-gutter);
  background:transparent;
  transition:padding var(--dur-short) var(--ease-out);
}
.nav-wrap.is-scrolled{padding-top:.6rem;padding-bottom:.6rem}
.nav{
  width:min(100%, var(--content-max));
  margin-inline:auto;
  min-height:3.75rem;
  display:flex;
  align-items:center;
  gap:1rem;
  padding:.5rem .6rem .5rem 1rem;
  background:color-mix(in oklch, var(--color-paper-elevated) 88%, transparent);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-pill);
  box-shadow:var(--shadow-nav);
  backdrop-filter:blur(16px) saturate(1.2);
}
.nav__brand{
  display:inline-flex;align-items:center;gap:.7rem;
  text-decoration:none;
  flex-shrink:0;
}
.nav__logo-mark{
  width:36px;height:36px;
  display:grid;place-items:center;
  background:var(--color-navy);
  color:var(--color-paper);
  border-radius:10px;
  flex-shrink:0;
}
:root[data-theme="dark"] .nav__logo-mark{background:var(--color-paper-2);border:1px solid var(--color-rule-strong)}
.nav__logo-mark svg{width:22px;height:22px}
.nav__wordmark{
  line-height:1;
}
.nav__wordmark-main{
  display:flex;align-items:baseline;gap:.18rem;
  font-family:var(--font-display);
  font-weight:800;
  font-size:1.02rem;
  letter-spacing:-0.02em;
  color:var(--color-ink);
}
.nav__wordmark-main em{font-style:normal;color:var(--color-accent)}
.nav__wordmark-sub{
  display:flex;align-items:center;gap:.35rem;
  font-family:var(--font-mono);
  font-size:.62rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--color-muted);
  margin-top:2px;
}
.nav__wordmark-sub span{opacity:.45}
.nav__links{
  display:flex;align-items:center;gap:.25rem;
  margin-left:auto;
}
.nav__links a{
  padding:.5rem .85rem;
  border-radius:var(--radius-pill);
  color:var(--color-ink-2);
  font-size:.875rem;
  font-weight:500;
  text-decoration:none;
  transition:background var(--dur-micro) var(--ease-out), color var(--dur-micro) var(--ease-out);
}
.nav__links a:hover{background:var(--color-paper-3);color:var(--color-ink)}
.nav__links a[aria-current="page"]{background:var(--color-ink);color:var(--color-paper)}
.nav__actions{
  display:flex;align-items:center;gap:.5rem;
  flex-shrink:0;
}
.btn{
  min-height:2.75rem;
  display:inline-flex;align-items:center;justify-content:center;gap:.4rem;
  padding:.7rem 1.15rem;
  border:1px solid transparent;
  border-radius:var(--radius-pill);
  font-family:var(--font-display);
  font-weight:650;
  font-size:.9rem;
  line-height:1;
  text-decoration:none;
  white-space:nowrap;
  cursor:pointer;
  transition:transform var(--dur-micro) var(--ease-out), background var(--dur-micro) var(--ease-out), border-color var(--dur-micro) var(--ease-out), box-shadow var(--dur-micro) var(--ease-out), opacity var(--dur-micro) var(--ease-out);
}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn--primary{color:var(--color-accent-ink);background:var(--color-accent)}
.btn--primary:hover{background:var(--color-accent-hover);box-shadow:0 6px 20px var(--color-accent-ring)}
.btn--primary-amber{color:var(--color-amber-ink);background:var(--color-amber);border-color:transparent}
.btn--primary-amber:hover{filter:brightness(1.05);box-shadow:0 8px 24px oklch(75% 0.16 70 / .25)}
.btn--ghost{color:var(--color-ink);background:var(--color-paper-2);border-color:var(--color-rule)}
.btn--ghost:hover{background:var(--color-paper-3);border-color:var(--color-rule-strong)}
.btn--sm{min-height:2.35rem;padding:.5rem .9rem;font-size:.84rem}
.btn--lg{min-height:3.25rem;padding:.9rem 1.35rem;font-size:.95rem}
.btn--full{width:100%}

.theme-toggle{
  width:2.35rem;height:2.35rem;
  display:grid;place-items:center;
  padding:0;
  color:var(--color-ink-2);
  background:var(--color-paper-3);
  border:1px solid var(--color-rule);
  border-radius:50%;
  cursor:pointer;
  flex-shrink:0;
}
.theme-toggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7}
.theme-toggle .icon-sun{display:none}
:root[data-theme="dark"] .theme-toggle .icon-moon{display:none}
:root[data-theme="dark"] .theme-toggle .icon-sun{display:block}

.nav__hamburger{
  display:none;
  width:2.35rem;height:2.35rem;
  place-items:center;
  background:var(--color-ink);
  color:var(--color-paper);
  border:0;
  border-radius:50%;
  cursor:pointer;
}
.nav__hamburger svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8}

/* Mobile nav overlay */
.nav__mobile-panel{
  display:none;
  position:absolute;
  top:calc(100% + .5rem);
  left:var(--page-gutter);
  right:var(--page-gutter);
  padding:1rem;
  background:var(--color-paper-elevated);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg);
}
.nav__mobile-panel.is-open{display:block}
.nav__mobile-panel a{
  display:flex;align-items:center;justify-content:space-between;
  padding:.85rem .25rem;
  border-bottom:1px solid var(--color-rule);
  color:var(--color-ink);
  font-weight:550;
  text-decoration:none;
}
.nav__mobile-panel a:last-child{border-bottom:0}

/* Hero — split 2 columns */
.hero{
  position:relative;
  overflow:clip;
  background:var(--color-paper);
  border-bottom:1px solid var(--color-rule);
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:var(--gradient-mesh);
  pointer-events:none;
}
.hero__inner{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0, 1.05fr) minmax(0, .95fr);
  gap:clamp(2rem, 5vw, 4rem);
  align-items:center;
  padding-block:clamp(2rem, 6vw, 4.5rem) clamp(2.5rem, 6vw, 5rem);
  min-height:min(78vh, 42rem);
}
.hero__copy{max-width:36rem}
.hero__eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.35rem .65rem .35rem .4rem;
  background:var(--color-accent-soft);
  border:1px solid color-mix(in oklch, var(--color-accent) 14%, transparent);
  border-radius:var(--radius-pill);
  font-family:var(--font-mono);
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--color-accent);
}
.hero__eyebrow i{
  width:22px;height:22px;
  display:grid;place-items:center;
  background:var(--color-accent);
  color:var(--color-accent-ink);
  border-radius:50%;
  font-style:normal;
}
.hero__title{
  margin-top:1.1rem;
  font-size:var(--text-hero);
  font-weight:800;
  line-height:.95;
  letter-spacing:var(--tracking-tighter);
}
.hero__title span{
  position:relative;
  color:var(--color-accent);
}
.hero__title span::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:.12em;
  height:.28em;
  background:color-mix(in oklch, var(--color-accent) 14%, transparent);
  z-index:-1;
  border-radius:2px;
}
.hero__lede{
  margin-top:1rem;
  max-width:48ch;
  color:var(--color-muted);
  font-size:clamp(1rem, 1.35vw, 1.15rem);
  line-height:1.6;
}
.hero__price{
  display:flex;align-items:baseline;gap:.75rem;
  margin-top:1.4rem;
  flex-wrap:wrap;
}
.hero__price-main{
  display:flex;align-items:baseline;gap:.15rem;
  font-family:var(--font-mono);
  font-weight:700;
  letter-spacing:-0.04em;
  line-height:1;
}
.hero__price-main b{font-size:clamp(2.75rem, 5vw, 3.75rem)}
.hero__price-main span{font-size:1rem;font-weight:600;opacity:.7}
.hero__price-note{
  padding:.35rem .6rem;
  background:var(--color-amber-soft);
  border:1px solid var(--color-amber-border);
  border-radius:var(--radius-pill);
  color:var(--color-amber-ink);
  font-size:.78rem;
  font-weight:600;
}
:root[data-theme="dark"] .hero__price-note{color:var(--color-amber)}
.hero__actions{
  display:flex;flex-wrap:wrap;gap:.65rem;
  margin-top:1.35rem;
}
.hero__trust{
  display:flex;flex-wrap:wrap;gap:1rem;
  margin-top:1.1rem;
  color:var(--color-muted);
  font-size:.8rem;
}
.hero__trust span{display:inline-flex;align-items:center;gap:.35rem}
.hero__trust svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.6;opacity:.8}

/* Hero card — mockup stack */
.hero__visual{
  position:relative;
  min-width:0;
}
.hero__card{
  position:relative;
  background:var(--color-paper-elevated);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow-lg);
  overflow:hidden;
}
.hero__card-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:.9rem 1rem;
  border-bottom:1px solid var(--color-rule);
  background:var(--color-paper-3);
}
.hero__card-head b{
  display:flex;align-items:center;gap:.5rem;
  font-size:.82rem;
  font-weight:700;
}
.hero__dots{display:flex;gap:.3rem}
.hero__dots i{width:8px;height:8px;border-radius:50%;background:var(--color-rule-strong);display:block}
.hero__stack{
  padding:1rem;
  display:grid;gap:.75rem;
}
.provider-mini{
  display:flex;align-items:center;gap:.75rem;
  padding:.75rem .85rem;
  background:var(--color-paper);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-md);
  transition:transform var(--dur-short) var(--ease-out), box-shadow var(--dur-short) var(--ease-out), border-color var(--dur-short) var(--ease-out);
}
.provider-mini:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm);border-color:var(--color-accent-ring)}
.provider-mini__logo{
  width:36px;height:36px;
  display:grid;place-items:center;
  border-radius:9px;
  font-family:var(--font-display);
  font-weight:800;
  font-size:.78rem;
  letter-spacing:-0.02em;
  color:white;
  flex-shrink:0;
}
.provider-mini__meta{flex:1;min-width:0}
.provider-mini__meta b{display:block;font-size:.88rem;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.provider-mini__meta span{color:var(--color-muted);font-size:.75rem}
.provider-mini__badge{
  padding:.25rem .5rem;
  background:var(--color-accent);
  color:var(--color-accent-ink);
  border-radius:var(--radius-pill);
  font-family:var(--font-mono);
  font-size:.68rem;
  font-weight:700;
  white-space:nowrap;
}
.hero__floating{
  position:absolute;
  inset:auto -0.5rem -1rem auto;
  display:flex;align-items:center;gap:.55rem;
  padding:.6rem .75rem;
  background:var(--color-ink);
  color:var(--color-paper);
  border-radius:var(--radius-pill);
  box-shadow:var(--shadow-md);
  font-size:.78rem;
  font-weight:600;
}
.hero__floating i{
  width:28px;height:28px;
  display:grid;place-items:center;
  background:var(--color-amber);
  color:var(--color-amber-ink);
  border-radius:50%;
  font-style:normal;
  font-weight:800;
}

/* Trust bar 4 */
.trust{
  background:var(--color-paper-2);
  border-bottom:1px solid var(--color-rule);
}
.trust__grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:0;
}
.trust__grid li{
  display:flex;gap:.85rem;
  padding:1.4rem 1.25rem;
}
.trust__grid li + li{border-left:1px solid var(--color-rule)}
.trust__icon{
  width:38px;height:38px;
  display:grid;place-items:center;
  background:var(--color-paper-3);
  border:1px solid var(--color-rule);
  border-radius:11px;
  flex-shrink:0;
}
.trust__icon svg{width:18px;height:18px;stroke:var(--color-accent);fill:none;stroke-width:1.7}
.trust__grid h3{font-size:.92rem;font-weight:700;line-height:1.2}
.trust__grid p{margin-top:.25rem;color:var(--color-muted);font-size:.84rem;line-height:1.5}

/* Banda chips scrolleable */
.banda{
  padding-block:1.15rem;
  background:var(--color-paper);
  border-bottom:1px solid var(--color-rule);
  overflow:hidden;
}
.banda__head{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  margin-bottom:.85rem;
}
.banda__head h2{font-size:.92rem;font-weight:700;letter-spacing:-0.01em}
.banda__head span{color:var(--color-muted);font-size:.82rem}
.chips{
  display:flex;gap:.5rem;
  overflow-x:auto;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  padding-bottom:.4rem;
  cursor:grab;
}
.chips:active{cursor:grabbing}
.chips::-webkit-scrollbar{display:none}
.chip{
  flex-shrink:0;
  min-height:2.15rem;
  padding:.5rem .9rem;
  background:var(--color-paper-2);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-pill);
  color:var(--color-ink-2);
  font-size:.84rem;
  font-weight:600;
  white-space:nowrap;
  cursor:pointer;
  transition:background var(--dur-micro) var(--ease-out), color var(--dur-micro) var(--ease-out), border-color var(--dur-micro) var(--ease-out), transform var(--dur-micro) var(--ease-out);
}
.chip:hover{border-color:var(--color-rule-strong);transform:translateY(-1px)}
.chip.is-active{color:var(--color-accent-ink);background:var(--color-accent);border-color:var(--color-accent)}
.chip:focus-visible{outline-offset:2px}

/* Providers section */
.providers{
  padding-block:clamp(2.5rem, 5vw, 4rem);
  background:var(--color-paper);
}
.providers__toolbar{
  display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;
  margin-bottom:1.1rem;
}
.search{
  position:relative;
  flex:1;
  min-width:14rem;
  max-width:28rem;
}
.search input{
  width:100%;
  min-height:2.75rem;
  padding:.7rem .9rem .7rem 2.4rem;
  background:var(--color-paper-2);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-pill);
  color:var(--color-ink);
  font-size:.9rem;
}
.search input::placeholder{color:var(--color-muted-2)}
.search input:focus{outline:2px solid var(--color-focus);outline-offset:0;border-color:transparent}
.search svg{
  position:absolute;left:.85rem;top:50%;transform:translateY(-50%);
  width:16px;height:16px;stroke:var(--color-muted);fill:none;stroke-width:1.7;
  pointer-events:none;
}
.providers__meta{
  display:flex;align-items:center;gap:.75rem;
  margin-left:auto;
  color:var(--color-muted);
  font-size:.84rem;
  white-space:nowrap;
}
.providers__meta b{color:var(--color-ink);font-family:var(--font-mono)}
.providers__grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:1rem;
}
@media (min-width:1024px){.providers__grid{grid-template-columns:repeat(4, minmax(0,1fr))}}

.card{
  position:relative;
  display:flex;
  flex-direction:column;
  min-width:0;
  background:var(--color-paper-elevated);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-lg);
  overflow:hidden;
  transition:transform var(--dur-short) var(--ease-out), box-shadow var(--dur-short) var(--ease-out), border-color var(--dur-short) var(--ease-out);
}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:color-mix(in oklch, var(--color-accent) 18%, var(--color-rule))}
.card__top{
  display:flex;align-items:center;gap:.7rem;
  padding:1rem 1rem .85rem;
}
.card__logo{
  width:42px;height:42px;
  display:grid;place-items:center;
  border-radius:12px;
  color:white;
  font-family:var(--font-display);
  font-weight:800;
  font-size:.85rem;
  flex-shrink:0;
}
.card__name{flex:1;min-width:0}
.card__name b{display:block;font-size:.95rem;line-height:1.1;letter-spacing:-0.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card__name span{
  display:inline-flex;align-items:center;gap:.3rem;
  margin-top:.2rem;
  color:var(--color-muted);
  font-family:var(--font-mono);
  font-size:.68rem;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.card__badge{
  position:absolute;
  top:.7rem;right:.7rem;
  padding:.28rem .5rem;
  background:var(--color-ink);
  color:var(--color-paper);
  border-radius:var(--radius-pill);
  font-family:var(--font-mono);
  font-size:.66rem;
  font-weight:700;
  letter-spacing:.04em;
}
.card__badge--accent{background:var(--color-accent);color:var(--color-accent-ink)}
.card__badge--amber{background:var(--color-amber);color:var(--color-amber-ink)}
.card__body{
  padding:0 1rem 1rem;
  flex:1;
}
.card__desc{color:var(--color-muted);font-size:.84rem;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card__foot{
  display:flex;align-items:center;gap:.5rem;
  padding:.85rem 1rem;
  border-top:1px solid var(--color-rule);
  background:color-mix(in oklch, var(--color-paper-3) 65%, transparent);
}
.card__price{font-family:var(--font-mono);font-weight:700;font-size:.88rem}
.card__price s{color:var(--color-muted-2);font-weight:500;font-size:.78rem;margin-left:.25rem}
.card__cta{
  margin-left:auto;
  min-height:2rem;
  padding:.45rem .75rem;
  border-radius:var(--radius-pill);
  background:var(--color-ink);
  color:var(--color-paper);
  font-size:.78rem;
  font-weight:650;
  text-decoration:none;
  white-space:nowrap;
}
.card__cta:hover{background:var(--color-accent)}
.card.is-hidden{display:none !important}
.card__empty{
  grid-column:1/-1;
  padding:2rem;
  text-align:center;
  color:var(--color-muted);
  border:1px dashed var(--color-rule-strong);
  border-radius:var(--radius-lg);
}

/* drag scroll helper */
.drag-scroll{
  overflow-x:auto;
  scrollbar-width:none;
  cursor:grab;
}
.drag-scroll:active{cursor:grabbing}
.drag-scroll::-webkit-scrollbar{display:none}

/* Bento beneficios */
.bento-section{
  padding-block:clamp(2.5rem, 5vw, 4rem);
  background:var(--color-paper-2);
  border-block:1px solid var(--color-rule);
}
.bento{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  grid-template-rows:auto auto;
  gap:1rem;
}
.bento__cell{
  position:relative;
  overflow:hidden;
  padding:1.5rem;
  background:var(--color-paper-elevated);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-xl);
  min-width:0;
}
.bento__cell--lead{
  grid-row:1 / span 2;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background:linear-gradient(180deg, color-mix(in oklch, var(--color-accent-soft) 85%, white) 0%, var(--color-paper-elevated) 65%);
  border-color:color-mix(in oklch, var(--color-accent) 14%, var(--color-rule));
}
:root[data-theme="dark"] .bento__cell--lead{background:linear-gradient(180deg, color-mix(in oklch, var(--color-accent-soft) 90%, transparent) 0%, var(--color-paper-elevated) 60%)}
.bento__icon{
  width:42px;height:42px;
  display:grid;place-items:center;
  background:var(--color-paper-3);
  border:1px solid var(--color-rule);
  border-radius:12px;
}
.bento__icon svg{width:20px;height:20px;stroke:var(--color-accent);fill:none;stroke-width:1.7}
.bento__cell h3{margin-top:1rem;font-size:1.15rem;line-height:1.15;letter-spacing:-0.02em}
.bento__cell p{margin-top:.5rem;color:var(--color-muted);font-size:.9rem;line-height:1.6;max-width:38ch}
.bento__list{margin-top:.9rem;display:grid;gap:.5rem}
.bento__list li{display:flex;gap:.5rem;color:var(--color-ink-2);font-size:.88rem;line-height:1.5}
.bento__list li::before{content:"✓";color:var(--color-accent);font-weight:800;flex-shrink:0}
.bento__stat{
  margin-top:1.25rem;
  display:flex;align-items:baseline;gap:.5rem;
}
.bento__stat b{font-family:var(--font-mono);font-size:2.1rem;letter-spacing:-0.04em;line-height:1}
.bento__stat span{color:var(--color-muted);font-size:.84rem}
.bento__mini-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-top:1rem;
}
.bento__mini{
  padding:.9rem;
  background:var(--color-paper);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-md);
}
.bento__mini b{display:block;font-size:1.05rem;line-height:1}
.bento__mini span{color:var(--color-muted);font-size:.78rem}

/* Comparativa */
.compare{
  padding-block:clamp(2.5rem, 5vw, 4rem);
}
.compare__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
  align-items:start;
}
.compare__col{
  padding:1.25rem;
  border-radius:var(--radius-lg);
  border:1px solid var(--color-rule);
  background:var(--color-paper-elevated);
}
.compare__col--pro{
  background:var(--color-ink);
  color:var(--color-paper);
  border-color:var(--color-ink);
}
:root[data-theme="dark"] .compare__col--pro{background:var(--color-paper-3);border-color:var(--color-rule-strong)}
.compare__col h3{font-size:1rem;display:flex;align-items:center;gap:.5rem}
.compare__col--pro h3{color:var(--color-paper)}
.compare__col ul{margin-top:1rem;display:grid;gap:.65rem}
.compare__col li{display:flex;gap:.6rem;font-size:.9rem;line-height:1.5}
.compare__col li svg{width:18px;height:18px;flex-shrink:0;margin-top:1px}
.compare__col--pro li{color:var(--color-paper)}
.compare__col li.is-no{opacity:.55}
.compare__badge{
  display:inline-flex;align-items:center;gap:.35rem;
  padding:.3rem .55rem;
  background:var(--color-amber);
  color:var(--color-amber-ink);
  border-radius:var(--radius-pill);
  font-family:var(--font-mono);
  font-size:.68rem;
  font-weight:700;
  margin-left:auto;
}

/* Pricing */
.pricing{
  padding-block:clamp(2.5rem, 5vw, 4rem);
  background:var(--color-paper-2);
  border-top:1px solid var(--color-rule);
}
.pricing__grid{
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:1rem;
  align-items:stretch;
  max-width:56rem;
  margin-inline:auto;
}
.price-card{
  display:flex;
  flex-direction:column;
  padding:1.4rem;
  background:var(--color-paper-elevated);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-xl);
}
.price-card--pro{
  position:relative;
  border-color:color-mix(in oklch, var(--color-amber) 55%, var(--color-rule));
  box-shadow:var(--shadow-md);
  transform:translateY(-4px);
}
.price-card--pro::before{
  content:"Recomendado";
  position:absolute;
  top:-11px;left:50%;transform:translateX(-50%);
  padding:.3rem .7rem;
  background:var(--color-amber);
  color:var(--color-amber-ink);
  border-radius:var(--radius-pill);
  font-family:var(--font-mono);
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  white-space:nowrap;
}
.price-card h3{font-size:1.05rem}
.price-card__price{
  display:flex;align-items:baseline;gap:.3rem;
  margin-top:.85rem;
  font-family:var(--font-mono);
  font-weight:800;
  letter-spacing:-0.05em;
  line-height:1;
}
.price-card__price b{font-size:2.75rem}
.price-card__price small{font-size:.85rem;font-weight:600;opacity:.6}
.price-card__price s{font-size:1rem;font-weight:600;color:var(--color-muted-2);margin-left:.35rem}
.price-card__note{margin-top:.5rem;color:var(--color-muted);font-size:.82rem}
.price-card ul{margin-top:1rem;display:grid;gap:.6rem;flex:1}
.price-card li{display:flex;gap:.5rem;font-size:.88rem;line-height:1.45}
.price-card li svg{width:16px;height:16px;flex-shrink:0;margin-top:2px;stroke:var(--color-success);fill:none;stroke-width:2}
.price-card li.is-muted{color:var(--color-muted-2)}
.price-card li.is-muted svg{stroke:var(--color-muted-2)}
.price-card .btn{margin-top:1rem}

/* Testimonios */
.testis{
  padding-block:clamp(2.5rem, 5vw, 4rem);
}
.testis__grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:1rem;
}
.testi{
  padding:1.25rem;
  background:var(--color-paper-elevated);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-lg);
}
.testi__quote{
  color:var(--color-ink-2);
  font-size:.95rem;
  line-height:1.6;
}
.testi__quote::before{content:"“";color:var(--color-accent);font-family:var(--font-display);font-weight:800;font-size:1.4rem;line-height:1;margin-right:.15rem}
.testi__foot{
  display:flex;align-items:center;gap:.7rem;
  margin-top:1rem;
  padding-top:1rem;
  border-top:1px solid var(--color-rule);
}
.testi__avatar{
  width:38px;height:38px;
  display:grid;place-items:center;
  background:var(--color-paper-3);
  border:1px solid var(--color-rule);
  border-radius:50%;
  font-family:var(--font-display);
  font-weight:700;
  font-size:.8rem;
}
.testi__who b{display:block;font-size:.88rem;line-height:1.1}
.testi__who span{color:var(--color-muted);font-size:.78rem}

/* FAQ */
.faq{
  padding-block:clamp(2.5rem, 5vw, 4rem);
  background:var(--color-paper-2);
  border-block:1px solid var(--color-rule);
}
.faq__layout{
  display:grid;
  grid-template-columns:.9fr 1.3fr;
  gap:clamp(1.5rem, 4vw, 3rem);
  align-items:start;
}
.faq__list{
  border-top:1px solid var(--color-rule-strong);
}
.faq__list details{border-bottom:1px solid var(--color-rule-strong)}
.faq__list summary{
  min-height:3.75rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1rem .25rem;
  color:var(--color-ink);
  font-family:var(--font-display);
  font-size:.98rem;
  font-weight:600;
  line-height:1.35;
  cursor:pointer;
  list-style:none;
}
.faq__list summary::-webkit-details-marker{display:none}
.faq__list summary::after{
  content:"+";
  flex:none;
  width:28px;height:28px;
  display:grid;place-items:center;
  background:var(--color-paper-3);
  border:1px solid var(--color-rule);
  border-radius:50%;
  color:var(--color-accent);
  font-family:var(--font-mono);
  font-size:1rem;
  line-height:1;
  transition:transform var(--dur-short) var(--ease-out), background var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out);
}
.faq__list details[open] summary::after{transform:rotate(45deg);background:var(--color-accent);color:var(--color-accent-ink);border-color:var(--color-accent)}
.faq__list details p{
  max-width:60ch;
  padding:0 .25rem 1.15rem;
  color:var(--color-muted);
  font-size:.92rem;
  line-height:1.65;
}

/* CTA final */
.final-cta{
  padding-block:clamp(2.5rem, 6vw, 4.5rem);
}
.final-cta__box{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:1.2fr auto;
  gap:1.5rem;
  align-items:center;
  padding:clamp(1.5rem, 4vw, 2.75rem);
  background:var(--color-ink);
  color:var(--color-paper);
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow-lg);
}
:root[data-theme="dark"] .final-cta__box{background:var(--color-paper-3);border:1px solid var(--color-rule-strong)}
.final-cta__box::after{
  content:"";
  position:absolute;
  width:42rem;height:42rem;
  right:-12rem;top:-14rem;
  background:radial-gradient(closest-side, oklch(58% 0.18 230 / .22), transparent 70%);
  pointer-events:none;
}
.final-cta__box h2{position:relative;font-size:clamp(1.6rem, 3vw, 2.4rem);line-height:1.05;letter-spacing:-0.03em;max-width:16ch}
.final-cta__box p{position:relative;margin-top:.6rem;color:color-mix(in oklch, var(--color-paper) 75%, transparent);max-width:44ch;font-size:.95rem}
.final-cta__actions{position:relative;display:flex;flex-direction:column;gap:.6rem;align-items:stretch;min-width:15rem}
.final-cta__note{color:color-mix(in oklch, var(--color-paper) 60%, transparent);font-size:.78rem;text-align:center}

/* Footer */
.footer{
  padding-block:2.5rem 1.5rem;
  border-top:1px solid var(--color-rule);
  background:var(--color-paper-2);
}
.footer__grid{
  display:grid;
  grid-template-columns:1.2fr .8fr .8fr;
  gap:2rem;
}
.footer__brand p{margin-top:.6rem;max-width:34ch;color:var(--color-muted);font-size:.86rem;line-height:1.6}
.footer__links h3{font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:var(--color-muted);margin-bottom:.75rem}
.footer__links a{display:block;padding:.3rem 0;color:var(--color-ink-2);font-size:.88rem;text-decoration:none}
.footer__links a:hover{color:var(--color-accent);text-decoration:underline}
.footer__bottom{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;
  margin-top:2rem;
  padding-top:1.25rem;
  border-top:1px solid var(--color-rule);
  color:var(--color-muted);
  font-size:.78rem;
}
.footer__legal{max-width:52ch;line-height:1.6}

/* PromoGoogle specifics */
.promo-hero{
  position:relative;
  overflow:clip;
  background:var(--color-paper);
  border-bottom:1px solid var(--color-rule);
}
.promo-hero::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(90% 90% at 20% 15%, oklch(58% 0.18 230 / .10) 0%, transparent 55%), radial-gradient(80% 80% at 85% 85%, oklch(75% 0.16 70 / .08) 0%, transparent 60%);
  pointer-events:none;
}
.promo-hero__inner{
  position:relative;
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:clamp(1.5rem, 4vw, 3rem);
  align-items:center;
  padding-block:clamp(2rem, 5vw, 3.75rem);
}
.promo-hero__badge{
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.35rem .6rem;
  background:var(--color-paper-2);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-pill);
  font-family:var(--font-mono);
  font-size:.7rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--color-muted);
}
.promo-hero__badge i{width:6px;height:6px;background:var(--color-success);border-radius:50%;display:block;animation:pulse 1.8s infinite}
.promo-hero h1{
  margin-top:.85rem;
  font-size:clamp(2rem, 4.5vw, 3.4rem);
  line-height:.97;
  letter-spacing:-0.04em;
}
.promo-hero h1 span{color:var(--color-accent)}
.promo-hero__lede{margin-top:.75rem;max-width:48ch;color:var(--color-muted);font-size:clamp(1rem,1.3vw,1.1rem);line-height:1.6}
.promo-hero__price{
  display:flex;align-items:baseline;gap:.6rem;
  margin-top:1.1rem;
  flex-wrap:wrap;
}
.promo-hero__price b{font-family:var(--font-mono);font-size:clamp(2.5rem, 5vw, 3.5rem);letter-spacing:-0.05em;line-height:1}
.promo-hero__price s{color:var(--color-muted-2);font-family:var(--font-mono);font-size:1.1rem}
.promo-hero__save{
  padding:.3rem .55rem;
  background:var(--color-success);
  color:white;
  border-radius:var(--radius-pill);
  font-family:var(--font-mono);
  font-size:.72rem;
  font-weight:700;
}
.coupon{
  margin-top:1rem;
  display:grid;gap:.5rem;
  max-width:28rem;
}
.coupon__row{
  display:flex;gap:.5rem;
}
.coupon__row input{
  flex:1;
  min-height:2.85rem;
  padding:.7rem .9rem;
  background:var(--color-paper-2);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-pill);
  color:var(--color-ink);
  font-family:var(--font-mono);
  font-size:.9rem;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.coupon__row input::placeholder{letter-spacing:.04em;text-transform:none;font-weight:500}
.coupon__row input:focus{outline:2px solid var(--color-focus);outline-offset:0;border-color:transparent}
.coupon__row input.is-error{border-color:var(--color-danger);animation:shake .35s var(--ease-out)}
.coupon__row input.is-success{border-color:var(--color-success);background:color-mix(in oklch, var(--color-success) 8%, var(--color-paper-2))}
.coupon__msg{min-height:1.2rem;font-size:.82rem;line-height:1.4}
.coupon__msg--error{color:var(--color-danger)}
.coupon__msg--success{color:var(--color-success);font-weight:600}
.coupon__hint{color:var(--color-muted);font-size:.78rem}

.promo-card{
  background:var(--color-paper-elevated);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow-lg);
  overflow:hidden;
}
.promo-card__head{
  display:flex;align-items:center;justify-content:space-between;
  padding:1rem 1.15rem;
  background:var(--color-ink);
  color:var(--color-paper);
}
:root[data-theme="dark"] .promo-card__head{background:var(--color-paper-3);border-bottom:1px solid var(--color-rule)}
.promo-card__head b{font-size:.9rem}
.promo-card__head span{padding:.25rem .5rem;background:var(--color-amber);color:var(--color-amber-ink);border-radius:var(--radius-pill);font-family:var(--font-mono);font-size:.68rem;font-weight:700}
.promo-card__body{padding:1.15rem}
.promo-card__price{
  display:flex;align-items:baseline;gap:.5rem;
  font-family:var(--font-mono);font-weight:800;letter-spacing:-0.04em;
}
.promo-card__price b{font-size:2.5rem}
.promo-card__price s{color:var(--color-muted-2);font-size:1rem}
.promo-card__price small{color:var(--color-muted);font-family:var(--font-body);font-size:.82rem;font-weight:600;letter-spacing:0}
.promo-card__meta{margin-top:.35rem;color:var(--color-muted);font-size:.82rem}
.promo-card__stock{
  margin-top:.85rem;
  display:flex;align-items:center;gap:.45rem;
  padding:.5rem .65rem;
  background:var(--color-amber-soft);
  border:1px solid var(--color-amber-border);
  border-radius:var(--radius-md);
  color:var(--color-amber-ink);
  font-size:.78rem;
  font-weight:600;
}
:root[data-theme="dark"] .promo-card__stock{color:var(--color-amber)}
.promo-card__stock i{width:7px;height:7px;background:var(--color-danger);border-radius:50%;animation:pulse 1.6s infinite}
.promo-card .btn{width:100%;margin-top:1rem}
.promo-card__foot{padding:.75rem 1.15rem;background:var(--color-paper-3);border-top:1px solid var(--color-rule);color:var(--color-muted);font-size:.78rem;text-align:center}

/* Reveal */
.reveal{opacity:0;transform:translateY(14px);transition:opacity var(--dur-medium) var(--ease-out), transform var(--dur-medium) var(--ease-out)}
.reveal.is-in{opacity:1;transform:none}
.reveal{transition-delay:calc(var(--i,0) * 60ms)}

/* Hover lift already */
@keyframes shake{
  0%,100%{transform:translateX(0)}
  20%{transform:translateX(-6px)}
  40%{transform:translateX(6px)}
  60%{transform:translateX(-4px)}
  80%{transform:translateX(4px)}
}
@keyframes pulse{
  0%,100%{opacity:1;transform:scale(1)}
  50%{opacity:.6;transform:scale(.85)}
}
@keyframes hero-enter{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:none}
}

/* Responsive */
@media (max-width: 62rem){
  .nav__links{display:none}
  .nav__hamburger{display:grid}
  .hero__inner{grid-template-columns:1fr;min-height:auto}
  .hero__visual{order:-1}
  .trust__grid{grid-template-columns:repeat(2,1fr)}
  .trust__grid li:nth-child(3){border-left:0;border-top:1px solid var(--color-rule)}
  .trust__grid li:nth-child(4){border-top:1px solid var(--color-rule)}
  .providers__grid{grid-template-columns:repeat(2,1fr)}
  .bento{grid-template-columns:1fr}
  .bento__cell--lead{grid-row:auto}
  .compare__grid{grid-template-columns:1fr}
  .pricing__grid{grid-template-columns:1fr;max-width:32rem}
  .price-card--pro{transform:none}
  .testis__grid{grid-template-columns:1fr}
  .faq__layout{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:1fr 1fr}
  .final-cta__box{grid-template-columns:1fr}
  .promo-hero__inner{grid-template-columns:1fr}
}

@media (max-width: 46rem){
  .nav{padding:.45rem .5rem .45rem .75rem;gap:.5rem}
  .nav__wordmark-main{font-size:.92rem}
  .providers__toolbar{flex-direction:column;align-items:stretch}
  .search{max-width:none}
  .providers__meta{margin-left:0}
  .providers__grid{grid-template-columns:1fr}
  .chips{gap:.4rem}
  .bento__mini-grid{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:1fr}
  .hero__actions{flex-direction:column}
  .hero__actions .btn{width:100%}
  .trust__grid{grid-template-columns:1fr}
  .trust__grid li + li{border-left:0;border-top:1px solid var(--color-rule)}
  .coupon__row{flex-direction:column}
  .coupon__row .btn{width:100%}
}

@media (hover:none){
  .card:hover,.provider-mini:hover,.chip:hover,.btn:hover{transform:none}
}

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

/* Waitlist dialog */
.waitlist-dialog{
  border:0;
  padding:0;
  background:transparent;
  width:min(560px, calc(100% - 2rem));
  max-width:560px;
  margin:auto;
  inset:0;
  height:fit-content;
  max-height:calc(100dvh - 2rem);
  overflow:visible;
}
.waitlist-dialog:not([open]){display:none}
.waitlist-dialog::backdrop{
  background:oklch(18% 0.02 250 / .55);
  backdrop-filter:blur(6px) saturate(1.05);
}
@supports not selector(::backdrop){
  .waitlist-dialog[open]{background:oklch(18% 0.02 250 / .55)}
}
.waitlist-dialog__form{
  background:var(--color-paper-elevated);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow-lg);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  max-height:calc(100dvh - 2rem);
  overflow-y:auto;
}
.waitlist-dialog__head{
  position:relative;
  padding:1.4rem 1.4rem 1rem;
  border-bottom:1px solid var(--color-rule);
  background:var(--color-paper-2);
}
.waitlist-dialog__head h2{
  font-family:var(--font-display);
  font-size:clamp(1.15rem, 2.5vw, 1.45rem);
  line-height:1.15;
  letter-spacing:-0.02em;
  padding-right:2rem;
}
.waitlist-dialog__head p{
  margin-top:.45rem;
  color:var(--color-muted);
  font-size:.88rem;
  line-height:1.5;
  max-width:48ch;
}
.waitlist-dialog__close{
  position:absolute;
  top:1rem;
  right:1rem;
  width:2.15rem;
  height:2.15rem;
  display:grid;
  place-items:center;
  background:var(--color-paper-3);
  border:1px solid var(--color-rule);
  border-radius:50%;
  color:var(--color-ink-2);
  font-size:1.35rem;
  line-height:1;
  cursor:pointer;
}
.waitlist-dialog__close:hover{background:var(--color-paper);border-color:var(--color-rule-strong)}
.waitlist-dialog__fields{
  padding:1.2rem 1.4rem;
  display:grid;
  gap:.75rem;
}
.waitlist-label{
  font-size:.84rem;
  font-weight:600;
  color:var(--color-ink);
  margin-top:.25rem;
}
.waitlist-optional{font-weight:500;color:var(--color-muted);font-size:.78rem}
.waitlist-dialog__fields input,
.waitlist-dialog__fields select{
  min-height:2.75rem;
  padding:.7rem .9rem;
  background:var(--color-paper-2);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-md);
  color:var(--color-ink);
  font-size:.92rem;
  width:100%;
}
.waitlist-dialog__fields input::placeholder{color:var(--color-muted-2)}
.waitlist-dialog__fields input:focus,
.waitlist-dialog__fields select:focus{outline:2px solid var(--color-focus);outline-offset:0;border-color:transparent}
.waitlist-dialog__fields input.is-error,
.waitlist-dialog__fields select.is-error{border-color:var(--color-danger)}
.waitlist-hint{color:var(--color-muted);font-size:.78rem;margin-top:-.35rem}
.waitlist-error{color:var(--color-danger);font-size:.82rem;font-weight:600;min-height:1.1rem}
.waitlist-error[hidden]{display:none}
.waitlist-consent{
  display:flex;
  gap:.6rem;
  align-items:flex-start;
  padding:.85rem;
  background:var(--color-paper-2);
  border:1px solid var(--color-rule);
  border-radius:var(--radius-md);
  font-size:.84rem;
  line-height:1.45;
  color:var(--color-ink-2);
  cursor:pointer;
}
.waitlist-consent input{margin-top:.2rem;accent-color:var(--color-accent);flex-shrink:0;width:16px;height:16px}
.waitlist-dialog__actions{
  padding:1rem 1.4rem 1.2rem;
  border-top:1px solid var(--color-rule);
  background:var(--color-paper);
  display:grid;
  gap:.6rem;
}
.waitlist-submit{width:100%}
.waitlist-submit:disabled{opacity:.6;cursor:not-allowed;transform:none}
.waitlist-status{
  min-height:1.2rem;
  font-size:.86rem;
  line-height:1.45;
  text-align:center;
}
.waitlist-status--success{color:var(--color-success);font-weight:650}
.waitlist-status--error{color:var(--color-danger);font-weight:600}
.waitlist-status--info{color:var(--color-accent);font-weight:600}
.waitlist-status--loading{color:var(--color-muted)}
.waitlist-fallback{color:var(--color-muted);font-size:.78rem;text-align:center}
.waitlist-fallback a{color:var(--color-accent);font-weight:600}
.waitlist-legal{
  padding:0 1.4rem 1.2rem;
  color:var(--color-muted);
  font-size:.74rem;
  text-align:center;
  line-height:1.5;
}
.waitlist-legal a{color:var(--color-muted);text-decoration:underline}
.hero__waitlist-count{
  margin-top:.6rem;
  color:var(--color-muted);
  font-size:.82rem;
  font-weight:500;
}
.hero__waitlist-count:not([hidden]){display:block}

@media (prefers-reduced-motion: reduce){
  .waitlist-dialog::backdrop{backdrop-filter:none}
}

/* Utility */
.visually-hidden{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}