/* ============================================================================
   Data Games — Landing pública (rediseño 2026, dirección "broadcast")
   Autónoma: no depende de datagames.css ni de theme.js. Todo el tema vive en
   #dgRoot y se conmuta con la clase .dg-light (ver js/landing.js).
   Tokens y valores calcados del handoff (design_handoff_landing_datagames).
   ========================================================================== */

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:hidden}
body{background:#05070E;font-family:'Geist',system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden;max-width:100%}
a{color:#3B82F6;text-decoration:none}
a:hover{color:#7DD3FC}
summary::-webkit-details-marker{display:none}
img{max-width:100%;display:block}

@keyframes dgPulse{0%,100%{opacity:1}50%{opacity:.22}}
@keyframes dgTick{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---- Tokens: oscuro (default) ---- */
#dgRoot{
  --bg:#05070E;--bg2:#080D18;--surf:#0C121F;--surf2:#111827;
  --line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.16);
  --text:#E8EDF6;--muted:#8B97AC;--muted2:#4C5769;
  --accent:#3B82F6;--accent-hover:#2563EB;--bright:#7DD3FC;
  --soft:rgba(59,130,246,.1);--logofx:invert(1);--paper:#FFFFFF;
  --ease-out:cubic-bezier(.23,1,.32,1);
  background:var(--bg);color:var(--text);min-height:100dvh;line-height:1.5;
  font-family:'Geist',system-ui,sans-serif;
  transition:background 200ms linear,color 200ms linear;
}
/* ---- Tokens: claro ---- */
#dgRoot.dg-light{
  --bg:#F7F8FA;--bg2:#EFF2F6;--surf:#FFFFFF;--surf2:#F2F5F9;
  --line:rgba(15,22,38,.13);--line2:rgba(15,22,38,.22);
  --text:#0F1626;--muted:#52637D;--muted2:#8A97AB;
  --accent:#1D4ED8;--accent-hover:#1E40AF;--bright:#0369A1;
  --soft:rgba(29,78,216,.08);--logofx:none;--paper:#FFFFFF;
}

/* Utilidad: numerales/cifras */
.dg-num{font-family:'Space Grotesk',sans-serif;font-variant-numeric:tabular-nums}

/* ============================ 1. Patrocinadores ============================ */
.dg-sponsors{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:28px;height:96px;padding:0 24px;border-bottom:1px solid var(--line);overflow:hidden}
.dg-sponsors__label{font-size:9.5px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--muted2)}
.dg-sponsors__track{overflow:hidden;min-width:0}
.dg-sponsors__marquee{display:flex;align-items:center;gap:56px;width:max-content;animation:dgTick 34s linear infinite}
.dg-sponsors__item{display:flex;align-items:center;gap:16px;flex:0 0 auto}
.dg-mask{display:block;background:var(--bright);opacity:.72;transition:opacity 200ms linear,background 200ms linear}
.dg-sponsors__item:hover .dg-mask{opacity:1;background:var(--accent)}
.dg-mask--10x10{width:55px;height:34px;-webkit-mask:url(/static/img/mono-10x10.png) center/contain no-repeat;mask:url(/static/img/mono-10x10.png) center/contain no-repeat}
.dg-mask--dsl{width:96px;height:26px;-webkit-mask:url(/static/img/mono-dsl.png) center/contain no-repeat;mask:url(/static/img/mono-dsl.png) center/contain no-repeat}
.dg-mask--csv{width:46px;height:44px;-webkit-mask:url(/static/img/mono-csv.png) center/contain no-repeat;mask:url(/static/img/mono-csv.png) center/contain no-repeat}
.dg-dot{width:4px;height:4px;border-radius:50%;background:var(--muted2)}
.dg-sponsors__cta{font-size:9.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--text);transition:color 150ms linear;white-space:nowrap}
.dg-sponsors__cta:hover{color:var(--accent)}

/* ============================ 2. Menú píldora ============================= */
#dgNavWrap{position:fixed;top:112px;left:50%;z-index:70;transform:translateX(-50%);max-width:calc(100vw - 24px);transition:top 360ms var(--ease-out)}
#dgPill{position:relative;display:flex;align-items:center;max-width:100%;height:54px;overflow:hidden;border:1px solid var(--line2);border-radius:999px;background:var(--surf);box-shadow:0 18px 40px -24px rgba(0,0,0,.85);transition:width 420ms var(--ease-out),transform 200ms var(--ease-out)}
.dg-pill__item{transition:opacity 260ms var(--ease-out),transform 260ms var(--ease-out),color 150ms linear,background 150ms linear}
.dg-pill__brand{display:flex;align-items:center;gap:9px;padding:0 14px 0 18px;color:var(--text);font-weight:800;letter-spacing:.2em;text-transform:uppercase;font-size:11.5px;white-space:nowrap}
.dg-pill__link{padding:0 11px;font-size:12.5px;font-weight:600;color:var(--muted);white-space:nowrap}
.dg-pill__link:hover{color:var(--text)}
.dg-pill__theme{width:30px;height:30px;margin-left:8px;display:grid;place-items:center;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);cursor:pointer;flex:0 0 auto}
.dg-pill__theme:hover{color:var(--text)}
/* Selector de idioma (montado por i18n.js dentro de la píldora) — tokens del tema de la landing */
.dg-pill__langslot{display:none}
#dgPill #dg-lang{margin:0 0 0 8px;gap:4px;flex:0 0 auto;transition:opacity 200ms var(--ease-out)}
#dgPill #dg-lang .dg-lang-ic{width:15px;height:15px;color:var(--muted)}
#dgPill #dg-lang select{background-color:transparent;color:var(--text);border-color:var(--line);font-weight:700}
#dgPill[data-expanded="0"] #dg-lang{opacity:0;pointer-events:none}
.dg-pill__cta{margin:0 6px 0 10px;padding:10px 18px;border-radius:999px;background:var(--accent);color:#fff;font-size:12.5px;font-weight:700;white-space:nowrap;flex:0 0 auto}
.dg-pill__cta:hover{background:var(--accent-hover);color:#fff}
#dgPillIcon{position:absolute;inset:0;display:grid;place-items:center;opacity:0;transform:scale(.8);pointer-events:none;color:var(--text);transition:opacity 200ms var(--ease-out),transform 200ms var(--ease-out)}

/* ============================ 3. Hero ==================================== */
#top{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);border-bottom:1px solid var(--line);overflow:hidden}
.dg-hero__left{padding:150px 24px 56px;display:flex;flex-direction:column;justify-content:center;position:relative;z-index:1}
.dg-hero__inner{max-width:820px}
.dg-hero__h1{margin:0 0 20px;font-size:clamp(44px,5.2vw,80px);font-weight:800;line-height:.92;letter-spacing:-.05em;text-wrap:balance;text-transform:uppercase}
.dg-hero__h1 .accent{color:var(--bright)}
.dg-hero__p{max-width:56ch;font-size:16.5px;line-height:1.62;color:var(--muted);text-wrap:pretty}
.dg-hero__cta-row{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}
.dg-btn{display:inline-flex;align-items:center;gap:9px;padding:14px 24px;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer}
.dg-btn--primary{background:var(--accent);color:#fff;border:0;transition:background 150ms linear,transform 120ms var(--ease-out)}
.dg-btn--primary:hover{background:var(--accent-hover);color:#fff}
.dg-btn--primary:active{transform:scale(.97)}
.dg-btn--ghost{border:1px solid var(--line2);color:var(--text);transition:border-color 150ms linear,transform 120ms var(--ease-out)}
.dg-btn--ghost:hover{border-color:var(--text)}
.dg-btn--ghost:active{transform:scale(.97)}
.dg-hero__right{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:130px 8px 30px;margin-left:-70px}
.dg-hero__media{position:relative;width:100%;max-width:640px;aspect-ratio:1/1;margin:0 auto;overflow:visible}
.dg-hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.92;-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 58%,rgba(0,0,0,.7) 74%,transparent 92%);mask-image:radial-gradient(circle at 50% 50%,#000 58%,rgba(0,0,0,.7) 74%,transparent 92%)}
.dg-hero__veil{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,var(--bg) 0%,rgba(0,0,0,0) 22%,rgba(0,0,0,0) 62%,var(--bg) 100%),linear-gradient(90deg,var(--bg) 0%,rgba(0,0,0,0) 26%,rgba(0,0,0,0) 82%,var(--bg) 100%);opacity:.86}
/* Modo claro: el video es un balón brillante sobre negro. En blanco, 'screen' lo desvanecía.
   Con invert + hue-rotate + mix-blend-mode:multiply el balón se dibuja en su color SOBRE el
   blanco (tipo blueprint): el negro se vuelve blanco y se funde, y el balón queda VISIBLE e
   integrado en degradé. La máscara radial remata los bordes. */
#dgRoot.dg-light .dg-hero__video{mix-blend-mode:multiply;opacity:1;filter:invert(1) hue-rotate(180deg) saturate(1.35) contrast(1.04)}
.dg-sport-names{position:absolute;top:14px;left:50%;transform:translateX(-50%);display:flex;gap:22px;z-index:2;pointer-events:none}
.dg-sport-name{font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);transition:color 400ms var(--ease-out)}
.dg-sport-name.is-on{color:var(--text)}

/* ============================ 4. Franja del torneo ======================= */
#torneo{background:var(--paper);border-bottom:1px solid var(--line)}
.dg-torneo__head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px;border-bottom:1px solid rgba(15,22,38,.1)}
.dg-torneo__eyebrow{font-size:9px;font-weight:800;letter-spacing:.26em;text-transform:uppercase;color:#7C8CA4}
.dg-torneo__grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.dg-torneo__logo{width:100%;height:340px;object-fit:contain;object-position:left center;padding:40px 32px 40px 24px}
.dg-torneo__panel{display:flex;flex-direction:column;gap:20px;justify-content:center;padding:36px 24px;border-left:1px solid rgba(15,22,38,.1)}
.dg-torneo__facts{display:flex;flex-direction:column;gap:9px;font-size:14px;color:#52637D}
.dg-fact{display:flex;justify-content:space-between;gap:16px}
.dg-fact--sep{padding-bottom:9px;border-bottom:1px solid rgba(15,22,38,.09)}
.dg-fact__k{font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#7C8CA4}
.dg-fact__v{color:#0F1626;font-weight:700}
.dg-torneo__cta{align-self:flex-start;display:inline-flex;align-items:center;gap:9px;padding:13px 22px;border-radius:8px;background:#0F1626;color:#fff;font-size:14px;font-weight:700;transition:background 150ms linear,transform 120ms var(--ease-out)}
.dg-torneo__cta:hover{background:#1D4ED8;color:#fff}
.dg-torneo__cta:active{transform:scale(.97)}
/* Otros torneos públicos (dinámico) — dentro de la tarjeta clara del torneo inaugural */
.dg-torneo__more{border-top:1px solid rgba(15,22,38,.1);padding:20px 24px 24px}
.dg-torneo__more-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}
.dg-torneo__more-all{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#1D4ED8}
.dg-torneo__more-all:hover{text-decoration:underline}
.dg-torneo__cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.dg-tcard{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid rgba(15,22,38,.12);border-radius:10px;background:#fff;transition:border-color 150ms linear,transform 120ms var(--ease-out)}
.dg-tcard:hover{border-color:#1D4ED8;transform:translateY(-2px)}
.dg-tcard:active{transform:scale(.98)}
.dg-tcard__ava{width:40px;height:40px;flex:0 0 auto;border-radius:9px;object-fit:contain;background:#F1F4F9;border:1px solid rgba(15,22,38,.08);display:flex;align-items:center;justify-content:center;font-family:'Space Grotesk',sans-serif;font-weight:800;font-size:14px;color:#1D4ED8}
.dg-tcard__main{min-width:0;flex:1 1 auto}
.dg-tcard__t{font-size:14px;font-weight:700;color:#0F1626;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-tcard__s{font-size:11.5px;color:#7C8CA4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.dg-tcard.is-live .dg-tcard__s{color:#1D4ED8;font-weight:700}
.dg-tcard__dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#1D4ED8;margin-right:5px;vertical-align:middle}
/* Cifras reales (prueba social) — hairlines, Space Grotesk */
.dg-torneo__stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(15,22,38,.1)}
.dg-tstat{display:flex;flex-direction:column;gap:3px;padding:20px 24px;border-left:1px solid rgba(15,22,38,.09)}
.dg-tstat:first-child{border-left:0}
.dg-tstat__n{font-size:30px;font-weight:800;line-height:1;color:#0F1626;letter-spacing:-.01em}
.dg-tstat__k{font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#7C8CA4}
@media(max-width:640px){.dg-torneo__stats{grid-template-columns:repeat(2,1fr)}.dg-tstat:nth-child(2){border-left:0}}
/* Franja Extracurriculares Colegio Británico (misma tarjeta clara que el torneo) */
#britanico{background:var(--paper);border-bottom:1px solid var(--line)}
.dg-xc{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}
.dg-xc__body{padding:36px 24px;display:flex;flex-direction:column;gap:15px;align-items:flex-start}
.dg-xc__h{font-size:clamp(22px,3vw,30px);font-weight:800;letter-spacing:-.01em;line-height:1.15;color:#0F1626;margin:0;max-width:22ch}
.dg-xc__p{font-size:15px;color:#52637D;margin:0;max-width:52ch;line-height:1.5}
.dg-xc__facts{display:flex;flex-direction:column;gap:9px;font-size:14px;color:#52637D;width:100%;margin:2px 0 4px}
.dg-xc__badge{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;border-left:1px solid rgba(15,22,38,.1);padding:32px 24px;text-align:center;transition:background 150ms linear}
.dg-xc__badge:hover{background:rgba(15,22,38,.02)}
.dg-xc__seal{width:132px;height:132px;flex:0 0 auto;border-radius:50%;background:#fff;border:1px solid rgba(15,22,38,.10);box-shadow:0 8px 24px rgba(15,22,38,.08);display:grid;place-items:center;padding:20px;position:relative}
.dg-xc__seal::before{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px solid rgba(29,78,216,.20)}
.dg-xc__seal img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.dg-xc__school{display:block}
.dg-xc__school strong{display:block;font-size:14.5px;font-weight:800;color:#0F1626;letter-spacing:-.01em;line-height:1.25}
.dg-xc__tag{display:inline-block;font-size:9.5px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#1D4ED8;margin-top:8px;background:rgba(29,78,216,.09);padding:4px 11px;border-radius:999px}
.dg-fact__open{display:inline-flex;align-items:center;gap:8px;color:#15803d}
.dg-livedot{width:8px;height:8px;flex:0 0 auto;border-radius:50%;background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.18)}
@media(max-width:720px){.dg-xc{grid-template-columns:1fr}.dg-xc__badge{border-left:0;border-top:1px solid rgba(15,22,38,.1);flex-direction:row;gap:16px;padding:22px 24px;justify-content:flex-start;text-align:left}.dg-xc__seal{width:74px;height:74px;padding:11px}.dg-xc__seal::before{inset:-5px}}

/* ============================ Cabecera de sección ======================== */
.dg-section{padding:80px 24px;border-bottom:1px solid var(--line)}
.dg-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:34px}
.dg-h2{font-size:clamp(28px,3.2vw,44px);font-weight:800;letter-spacing:-.045em;line-height:1;text-wrap:balance;color:var(--bright)}
.dg-section-head p{font-size:14px;color:var(--muted);max-width:42ch;text-wrap:pretty}

/* ============================ 5. Deportes ================================ */
.dg-sports__list{border-top:1px solid var(--line)}
.dg-sport-row{display:grid;grid-template-columns:52px minmax(0,1fr) minmax(0,1.2fr);gap:26px;align-items:baseline;padding:26px 0;border-bottom:1px solid var(--line);transition:padding-left 260ms var(--ease-out)}
.dg-sport-row:hover{padding-left:14px}
.dg-sport-row__n{font-size:12px;font-weight:700;color:var(--muted2)}
.dg-sport-row__name{font-size:clamp(24px,2.4vw,34px);font-weight:800;letter-spacing:-.04em}
.dg-sport-row__desc{font-size:14.5px;color:var(--muted)}

/* ============================ 6. Funcionalidades ========================= */
.dg-feats__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:64px;align-items:start}
.dg-feats__tabs{border-bottom:1px solid var(--line)}
.dg-feat-tab{display:flex;align-items:baseline;gap:18px;padding:20px 8px 20px 0;border:0;border-top:1px solid var(--line);background:transparent;text-align:left;font-family:inherit;cursor:pointer;width:100%;color:var(--muted);transition:padding-left 240ms var(--ease-out),color 240ms var(--ease-out)}
.dg-feat-tab:hover{padding-left:10px;color:var(--text)}
.dg-feat-tab.is-active{color:var(--bright)}
.dg-feat-tab__n{font-size:11.5px;font-weight:700;color:var(--muted2)}
.dg-feat-tab__label{font-size:clamp(19px,1.9vw,26px);font-weight:800;letter-spacing:-.035em;color:inherit}
.dg-feats__panels{position:sticky;top:130px;padding:6px 0 0}
.dg-feat-panel{display:none;flex-direction:column;gap:20px}
.dg-feat-panel.is-active{display:flex}
.dg-feat-panel__eyebrow{font-size:10px;font-weight:800;letter-spacing:.26em;text-transform:uppercase;color:var(--bright)}
.dg-feat-panel__lead{font-size:clamp(18px,1.9vw,23px);line-height:1.4;letter-spacing:-.02em;color:var(--text);text-wrap:pretty}
.dg-feat-panel__points{display:flex;flex-direction:column}
.dg-point{display:flex;align-items:baseline;gap:16px;padding:14px 0;border-top:1px solid var(--line);font-size:14.5px;color:var(--muted)}
.dg-point__n{font-size:11px;font-weight:700;color:var(--muted2)}

/* ============================ 7. Banda parallax ========================== */
.dg-parallax{position:relative;height:min(72vh,560px);overflow:hidden;border-bottom:1px solid var(--line)}
#dgParallax{position:absolute;inset:-12% 0;will-change:transform}
.dg-parallax__video{width:100%;height:100%;object-fit:cover;opacity:.9;-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 26%,#000 74%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 26%,#000 74%,transparent 100%)}
.dg-parallax__veil{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,var(--bg) 0%,rgba(0,0,0,.35) 52%,rgba(0,0,0,0) 78%,var(--bg) 100%)}
.dg-parallax__content{position:relative;height:100%;display:flex;flex-direction:column;justify-content:center;padding:0 24px;max-width:900px}
.dg-parallax__eyebrow{font-size:10px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--bright)}
.dg-parallax__title{margin-top:20px;font-size:clamp(26px,3.4vw,46px);font-weight:800;line-height:1.06;letter-spacing:-.04em;color:var(--text);text-wrap:balance}

/* ============================ 8. Plataforma ============================== */
#plataforma{background:var(--bg2);border-bottom:1px solid var(--line)}
.dg-platform__head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px;border-bottom:1px solid var(--line)}
.dg-platform__eyebrow{font-size:9px;font-weight:800;letter-spacing:.26em;text-transform:uppercase;color:var(--muted2)}
.dg-platform__grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
.dg-platform__col{padding:28px 24px}
.dg-platform__col--l{border-right:1px solid var(--line)}
.dg-block-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.dg-block-head__k{font-size:9.5px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:var(--muted2)}
.dg-block-head__v{font-size:9.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--bright)}
.dg-table{width:100%;border-collapse:collapse;font-size:13.5px}
.dg-table thead tr{color:var(--muted2);font-size:10px;letter-spacing:.14em;text-transform:uppercase}
.dg-table th{text-align:right;padding:0 0 12px 12px;font-weight:700}
.dg-table th:first-child{text-align:left;padding:0 0 12px}
.dg-table tbody{font-variant-numeric:tabular-nums}
.dg-table tbody tr{border-top:1px solid var(--line);transition:background 200ms linear}
.dg-table tbody tr:hover{background:var(--surf)}
.dg-table td{text-align:right;padding:11px 0 11px 12px;color:var(--muted)}
.dg-table td:first-child{text-align:left;padding:11px 0;font-weight:700;color:var(--text)}
.dg-table td.pts{font-weight:800;color:var(--text)}
.dg-table tr.lead td.pts{color:var(--bright)}
.dg-bracket-note{font-size:13.5px;color:var(--muted);margin-bottom:18px;text-wrap:pretty}
.dg-bracket{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:center}
.dg-bracket__seeds{display:flex;flex-direction:column;gap:8px}
.dg-bracket__seed{padding:11px 13px;border:1px solid var(--line);border-radius:6px;background:var(--surf);font-size:13px;font-weight:600}
.dg-bracket__semis{display:flex;flex-direction:column;gap:36px}
.dg-bracket__semi{padding:11px 13px;border:1px solid var(--line2);border-radius:6px;background:var(--soft);font-size:13px;font-weight:700}
.dg-bracket__final{margin-top:14px;padding:11px 13px;border:1px solid var(--line2);border-radius:6px;background:var(--surf2);font-size:13px;font-weight:700;text-align:center}

/* ============================ 9. Planilla digital ======================== */
.dg-planilla{padding:88px 24px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.7fr);gap:56px;align-items:center}
.dg-planilla__eyebrow{font-size:10px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--bright)}
.dg-planilla__h2{margin:16px 0 18px;font-size:clamp(28px,3.2vw,44px);font-weight:800;letter-spacing:-.045em;line-height:1.02;text-wrap:balance;color:var(--bright)}
.dg-planilla__p{font-size:16px;color:var(--muted);max-width:50ch;line-height:1.62;text-wrap:pretty}
.dg-planilla__list{display:flex;flex-direction:column;margin-top:28px;border-top:1px solid var(--line)}
.dg-check-row{display:flex;gap:14px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--line)}
.dg-check-row svg{margin-top:3px;flex:0 0 auto}
.dg-check-row span{font-size:15px;color:var(--muted)}
.dg-check-row strong{color:var(--text);font-weight:700}
.dg-phone{justify-self:center;width:276px;padding:10px;border:1px solid var(--line2);border-radius:30px;background:var(--surf)}
.dg-phone__screen{border-radius:22px;background:var(--bg);padding:18px 16px;display:flex;flex-direction:column;gap:13px}
.dg-phone__row{display:flex;align-items:center;justify-content:space-between}
.dg-phone__k{font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted2)}
.dg-live-chip{display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:4px;background:#B91C1C;color:#fff;font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.dg-live-chip__dot{width:5px;height:5px;border-radius:50%;background:#fff;animation:dgPulse 1.5s ease-in-out infinite}
.dg-phone__score{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;padding:14px 10px;border:1px solid var(--line);border-radius:10px;background:var(--surf)}
.dg-phone__team{font-size:11.5px;font-weight:700;text-align:center}
.dg-phone__num{font-family:'Space Grotesk',sans-serif;font-size:24px;font-weight:700;font-variant-numeric:tabular-nums;transition:transform 400ms var(--ease-out)}
.dg-phone__label{font-size:9.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--muted2)}
.dg-phone__btns{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.dg-phone__btn{min-height:52px;border:1px solid var(--line);border-radius:10px;background:var(--surf);color:var(--text);font-size:13.5px;font-weight:700;font-family:inherit;cursor:pointer;transition:transform 120ms var(--ease-out)}
.dg-phone__btn--primary{border:0;background:var(--accent);color:#fff}
.dg-phone__btn:active{transform:scale(.97)}
.dg-phone__jerseys{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}
.dg-jersey{display:grid;place-items:center;min-height:44px;border:1px solid var(--line);border-radius:8px;background:var(--surf);font-family:'Space Grotesk',sans-serif;font-size:15px;font-weight:700}
.dg-jersey.is-on{border:1px solid var(--line2);background:var(--soft);color:var(--bright)}
.dg-phone__last{padding:11px 13px;border:1px solid var(--line);border-radius:8px;background:var(--surf);font-size:11.5px;color:var(--muted)}

/* ============================ 10. Paso a paso ============================ */
.dg-how__track{position:relative}
.dg-how__line{position:absolute;left:23px;right:23px;top:23px;height:1px;background:linear-gradient(90deg,var(--bright) 0%,var(--accent) 55%,var(--bright) 100%);opacity:.5}
.dg-how__grid{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.dg-how__node{position:relative;display:flex;flex-direction:column;gap:14px;padding:0 26px 0 0}
/* Fondo en el grupo del nodo para que la línea de progreso quede DETRÁS del título
   (no cruzándolo): la línea solo se ve en los tramos entre un nodo y el siguiente. */
.dg-how__node-head{display:flex;align-items:center;gap:14px;position:relative;background:var(--bg);padding-right:16px;width:fit-content;max-width:100%}
.dg-how__circle{position:relative;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;border:1px solid var(--line2);background:var(--bg);font-family:'Space Grotesk',sans-serif;font-size:15px;font-weight:700;color:var(--bright);font-variant-numeric:tabular-nums;flex:0 0 auto}
.dg-how__circle.is-live{border:1px solid var(--bright)}
.dg-how__live-dot{position:absolute;top:-3px;right:-3px;width:9px;height:9px;border-radius:50%;background:var(--bright);animation:dgPulse 1.4s ease-in-out infinite}
.dg-how__title{font-size:19px;font-weight:800;letter-spacing:-.03em;color:var(--bright)}
.dg-how__node p{font-size:14.5px;line-height:1.6;color:var(--muted);max-width:34ch;text-wrap:pretty}
.dg-how__node strong{color:var(--text);font-weight:700}

/* ============================ 11. FAQ ==================================== */
.dg-faq{padding:80px 24px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(0,.55fr) minmax(0,1fr);gap:56px;align-items:start}
.dg-faq__h2{font-size:clamp(28px,3.2vw,44px);font-weight:800;letter-spacing:-.045em;line-height:1;position:sticky;top:88px;color:var(--bright)}
.dg-faq details{border-top:1px solid var(--line);padding:20px 0}
.dg-faq details:last-child{border-bottom:1px solid var(--line)}
.dg-faq summary{display:flex;justify-content:space-between;align-items:center;gap:16px;cursor:pointer;list-style:none;font-size:16px;font-weight:700;letter-spacing:-.01em;color:var(--bright)}
.dg-faq summary .plus{color:var(--muted2);font-size:18px;line-height:1;transition:transform 200ms var(--ease-out)}
.dg-faq details[open] summary .plus{transform:rotate(45deg)}
.dg-faq details p{margin-top:12px;font-size:14.5px;color:var(--muted);max-width:66ch;line-height:1.6}

/* ============================ 12. CTA final + footer ===================== */
.dg-cta-final{padding:56px 24px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap}
.dg-cta-final h2{font-size:clamp(22px,2.2vw,30px);font-weight:800;letter-spacing:-.04em;line-height:1.05;color:var(--bright)}
.dg-cta-final p{margin-top:8px;font-size:15px;color:var(--muted)}
.dg-cta-final__btns{display:flex;gap:12px;flex-wrap:wrap}
.dg-footer{padding:28px 24px 44px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:12px;color:var(--muted2)}
.dg-footer__brand{display:flex;align-items:center;gap:10px;color:var(--muted)}
.dg-footer__links{display:flex;gap:20px;flex-wrap:wrap}
.dg-footer__links a{color:var(--muted2)}
.dg-footer__links a:hover{color:var(--text)}

/* ============================ Reveal por scroll ========================== */
[data-reveal]{}
.dg-reveal-hidden{opacity:0;transform:translateY(16px)}

/* ============================ Responsive ================================= */
@media (max-width:1024px){
  #top{grid-template-columns:1fr}
  .dg-hero__left{padding:132px 22px 24px}
  .dg-hero__right{margin-left:0;padding:8px 22px 40px}
  .dg-hero__media{max-width:460px}
  .dg-torneo__grid{grid-template-columns:1fr}
  .dg-torneo__logo{height:200px;object-position:center;padding:32px 24px}
  .dg-torneo__panel{border-left:0;border-top:1px solid rgba(15,22,38,.1)}
  .dg-feats__grid{grid-template-columns:1fr;gap:34px}
  .dg-feats__panels{position:static;top:auto}
  .dg-platform__grid{grid-template-columns:1fr}
  .dg-platform__col--l{border-right:0;border-bottom:1px solid var(--line)}
  .dg-planilla{grid-template-columns:1fr;gap:40px}
  .dg-faq{grid-template-columns:1fr;gap:28px}
  .dg-faq__h2{position:static}
}
@media (max-width:760px){
  .dg-section{padding:60px 20px}
  .dg-hero__left{padding:126px 20px 22px}
  .dg-hero__h1{font-size:clamp(34px,8.6vw,80px)}
  .dg-hero__right{padding:6px 20px 36px}
  .dg-sport-row{grid-template-columns:32px 1fr;gap:12px 16px}
  .dg-sport-row__desc{grid-column:1 / -1;padding-left:48px}
  .dg-how__line{display:none}
  .dg-how__grid{grid-template-columns:1fr;gap:26px}
  .dg-how__node{padding:0}
  .dg-planilla{padding:60px 20px}
  .dg-platform__col{overflow-x:auto}
  .dg-cta-final{padding:44px 20px}
  /* Píldora: en móvil solo marca + tema + iniciar sesión */
  .dg-pill__link{display:none}
  #dgNavWrap{width:calc(100% - 28px);max-width:420px}
  #dgPill{width:100%!important;justify-content:space-between}
  .dg-sport-names{gap:14px}
  /* Franja de patrocinadores: una sola pista acotada */
  .dg-sponsors{grid-template-columns:minmax(0,1fr);gap:0;padding:0 16px}
  .dg-sponsors__label,.dg-sponsors__cta{display:none}
}
@media (max-width:420px){
  .dg-sport-names{gap:10px}
  .dg-sport-name{font-size:9.5px;letter-spacing:.14em}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition-duration:.001ms!important}
  html{scroll-behavior:auto}
}