:root { --bg-3:#111113; --accent-muted:rgba(255,202,27,.10); --accent-border:rgba(255,202,27,.22); --r3:16px; --r4:20px; --section:100px; }



@keyframes fadeUp { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@keyframes shimmer { 0%{background-position:-200% center} 100%{background-position:200% center} }

/* Hero */
#hero { padding:calc(160px + var(--promo-h)) 24px 80px; text-align:center; position:relative; overflow:hidden; }
.hero-orb { top:-60px; }
.hero-content { max-width:620px; }
.hero-content h1 { margin-bottom:18px; animation:fadeUp .8s ease .1s both; }
.hero-content p { font-size:19px; max-width:480px; margin:0 auto; animation:fadeUp .8s ease .2s both; }

/* Plans grid */
.plans-grid { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--border-1); border-radius:var(--r4); overflow:hidden; }
.plans-grid-2 { display:grid; grid-template-columns:repeat(2,1fr); border:1px solid var(--border-1); border-radius:var(--r4); overflow:hidden; max-width:700px; margin:0 auto; }
@media(max-width:720px) { .plans-grid-2 { grid-template-columns:1fr; } }
@media(max-width:900px) { .plans-grid { grid-template-columns:repeat(2,1fr); } }
@media(max-width:480px) { .plans-grid { grid-template-columns:1fr; } }

.plan { background:var(--bg-1); border-right:1px solid var(--border-1); padding:32px 24px; display:flex; flex-direction:column; gap:18px; position:relative; transition:background .2s; }
.plan:last-child { border-right:none; }
.plan:hover { background:var(--bg-2); }
.plan.hot { background:radial-gradient(ellipse 120% 60% at 50% 110%,rgba(255,202,27,.07) 0%,transparent 70%),var(--bg-2); }
@media(max-width:900px) { .plan { border-right:none; border-bottom:1px solid var(--border-1); } .plan:last-child { border-bottom:none; } }

.plan-name { font-size:18px; font-weight:500; color:var(--text-1); letter-spacing:-.015em; }
.disc-pill { font-size:11px; font-weight:600; letter-spacing:.04em; padding:3px 9px; border-radius:100px; background:rgba(255,202,27,.10); border:1px solid rgba(255,202,27,.25); color:var(--accent); white-space:nowrap; }
.plan-switch-row { display:flex; align-items:center; gap:8px; }
.psw-label { font-size:13px; color:var(--text-3); transition:color .2s; }
.psw-label.on { color:var(--text-2); }
.plan-feats { display:flex; flex-direction:column; gap:8px; flex:1; }
.plan-feat { font-size:15px; color:var(--text-2); display:flex; align-items:center; gap:8px; }
.plan-cta { width:100%; justify-content:center; margin-top:4px; }

/* ─── Comparison table ─── */
#comparativa { padding:var(--section) 0; }
.comp-scroll-wrap { position:relative; }
.comp-scroll { overflow-x:auto; -webkit-overflow-scrolling:touch; }

/* Right-edge fade */
@media(max-width:900px) {
  .comp-scroll-wrap::after {
    content:''; pointer-events:none; z-index:4;
    position:absolute; top:0; right:0; bottom:0; width:56px;
    background:linear-gradient(to right, transparent, var(--bg-0));
    transition:opacity .3s ease;
  }
  .comp-scroll-wrap.at-end::after { opacity:0; }
}

/* Swipe hint arrow in thead first cell */
.swipe-hint { display:none; }
@media(max-width:900px) {
  .swipe-hint {
    display:inline-flex; align-items:center; justify-content:center;
    width:32px; height:32px; border-radius:50%;
    background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1);
    color:var(--text-2);
    animation:swipe-nudge 1.6s ease-in-out infinite;
    transition:opacity .35s ease;
  }
  .swipe-hint.hidden { opacity:0; pointer-events:none; }
}
@keyframes swipe-nudge {
  0%,100% { transform:translateX(0); }
  50%      { transform:translateX(5px); }
}
.comp-table { width:100%; border-collapse:separate; border-spacing:0; min-width:900px; }
.comp-table thead tr { z-index:1; }
.comp-table th { background:var(--bg-0); padding:28px 20px; text-align:center; border-bottom:1px solid var(--border-1); vertical-align:middle; }
.comp-table th:first-child { text-align:left; padding-left:16px; width:300px; min-width:220px; }
.comp-th-hot { background:rgba(255,202,27,.04) !important; border-top:2px solid var(--accent); }
.comp-plan-name { font-size:22px; font-weight:600; color:var(--text-1); letter-spacing:-.02em; white-space:nowrap; }

/* Sticky plan-names nav */
#compNav { display:none; position:fixed; top:80px; left:0; right:0; z-index:200; background:rgba(2,2,4,.95); backdrop-filter:blur(32px) saturate(180%); -webkit-backdrop-filter:blur(32px) saturate(180%); border-bottom:1px solid var(--border-1); }
#compNav.show { display:block; }
.comp-nav-row { position:relative; height:62px; }
.comp-nav-col { position:absolute; top:0; bottom:0; display:flex; align-items:center; justify-content:center; font-size:22px; font-weight:600; color:var(--text-1); letter-spacing:-.02em; white-space:nowrap; }
.comp-nav-col.hot { background:rgba(255,202,27,.05); border-top:2px solid var(--accent); }

/* Data rows */
.comp-table td { padding:15px 20px; text-align:center; border-bottom:1px solid var(--border-0); font-size:14px; vertical-align:middle; color:var(--text-2); transition:background .1s; }
.comp-table td:first-child { text-align:left; padding-left:16px; color:var(--text-2); }
.comp-table tbody tr:last-child td { border-bottom:none; }
.comp-table tbody tr:not(.comp-cat):hover td { background:rgba(255,255,255,.013); }
.comp-td-hot { background:rgba(255,202,27,.022); }
.comp-table tbody tr:not(.comp-cat):hover .comp-td-hot { background:rgba(255,202,27,.045); }

/* Category rows — accordion */
.comp-cat { cursor:pointer; user-select:none; }
.comp-cat:hover .comp-cat-label { color:var(--text-1); }
.comp-cat td { padding:36px 0 14px; border-bottom:none; border-top:1px solid var(--border-1); background:transparent !important; }
.comp-cat:first-of-type td,.comp-cat:first-child td { border-top:none; padding-top:32px; }
.comp-cat-label { display:inline-flex; align-items:center; gap:8px; font-size:22px; font-weight:600; letter-spacing:-.02em; color:var(--text-1); transition:color .15s; }
.cat-chev { color:var(--text-3); transition:transform .22s ease; flex-shrink:0; }
.comp-cat.collapsed .cat-chev { transform:rotate(-90deg); }

/* Indicators */
.cok { display:inline-flex; align-items:center; justify-content:center; }
.cno { color:var(--text-3); font-size:17px; line-height:1; display:inline-block; }
.cval { font-size:13px; font-weight:500; color:var(--text-1); }
.cpref { font-size:13px; font-weight:500; color:var(--accent); }
.comp-ai-row td { background:transparent!important; border-top:1px solid rgba(255,202,27,.45)!important; border-bottom:1px solid rgba(255,202,27,.45)!important; }
.comp-ai-row td:first-child { color:var(--accent); font-weight:500; border-left:1px solid rgba(255,202,27,.45); border-radius:8px 0 0 8px; }
.comp-ai-row td:last-child { border-right:1px solid rgba(255,202,27,.45); border-radius:0 8px 8px 0; }
.comp-ai-row .comp-td-hot { background:transparent!important; }

/* CTA */
#cta { padding:var(--section) 0; text-align:center; position:relative; overflow:hidden; }
.cta-orb { position:absolute; width:500px; height:300px; top:50%; left:50%; transform:translate(-50%,-50%); background:radial-gradient(ellipse,rgba(255,202,27,.06) 0%,transparent 70%); filter:blur(80px); pointer-events:none; }
.cta-inner { position:relative; z-index:2; max-width:600px; margin:0 auto; }
.cta-h { margin:12px 0 16px; font-size:clamp(36px,4vw,52px); }
.cta-h em { color:var(--accent); font-style:normal; }
.cta-p { font-size:18px; margin-bottom:32px; max-width:440px; margin-left:auto; margin-right:auto; }
.cta-actions { display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; margin-bottom:20px; }
.cta-fine { font-size:13px; color:var(--text-3); }