/**
 * Reserva1 — estilos da landing pública.
 * Carregado por app/views/pages/landing.php
 */

  *, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }

  :root {
    --bg:       #05080f;
    --surface:  #0a1020;
    --card:     #0c1525;
    --blue:     #0ea5e9;
    --blue-b:   #38bdf8;
    --blue-d:   #0369a1;
    --orange:   #f97316;
    --orange-b: #fb923c;
    --gold:     #fbbf24;
    --border:   rgba(14,165,233,.15);
    --border-o: rgba(249,115,22,.22);
    --text:     #c8d8e8;      /* brighter base text */
    --text2:    #8baec8;      /* secondary text — still readable */
    --muted:    #5c7a92;
    --font-d: 'Exo 2', sans-serif;
    --font-b: 'Rajdhani', sans-serif;
  }

  html { scroll-behavior:smooth; }
  body {
    background:var(--bg);
    color:var(--text);
    font-family:var(--font-b);
    font-size:1.1rem;
    overflow-x:hidden;
  }

  /* grid bg */
  body::before {
    content:''; position:fixed; inset:0; z-index:0; pointer-events:none;
    background-image:
      linear-gradient(rgba(14,165,233,.12) 1px,transparent 1px),
      linear-gradient(90deg,rgba(14,165,233,.12) 1px,transparent 1px);
    background-size:48px 48px;
  }

  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
  }

  /* ══════════════════════════════════════
     ANIMATED GRADIENT BORDER MIXIN
     Works by an animated conic-gradient pseudo
  ══════════════════════════════════════ */
  .glow-card {
    position:relative;
    border-radius:14px;
    /* transparent real border; the glow comes from pseudo */
    border:1px solid transparent;
    background-clip:padding-box;
    transition:transform .3s cubic-bezier(.22,.68,0,1.4), box-shadow .3s;
  }
  .glow-card::before {
    content:'';
    position:absolute;
    inset:-2px;
    border-radius:16px;
    background:conic-gradient(
      from var(--angle,0deg),
      transparent 0%,
      transparent 40%,
      #0ea5e9 50%,
      #38bdf8 55%,
      #7dd3fc 60%,
      #0ea5e9 65%,
      transparent 75%,
      transparent 100%
    );
    opacity:0;
    transition:opacity .35s;
    z-index:-1;
    animation: none;
  }
  .glow-card:hover::before,
  .glow-card.active::before {
    opacity:1;
    animation: spin-border 2.2s linear infinite;
  }
  @property --angle {
    syntax:'<angle>';
    inherits:false;
    initial-value:0deg;
  }
  @keyframes spin-border {
    to { --angle: 360deg; }
  }

  /* inner fill so card bg sits on top of the glow pseudo */
  .glow-card-inner {
    background:var(--card);
    border-radius:13px;
    height:100%;
    overflow:hidden;
    position:relative;
    z-index:1;
    /* resting tech shadow */
    box-shadow:
      0 4px 24px rgba(0,0,0,.45),
      0 0 0 1px rgba(14,165,233,.08),
      inset 0 0 30px rgba(14,165,233,.03);
    transition: box-shadow .35s;
  }

  /* keep lift on hover + intensify inner glow */
  .glow-card:hover {
    transform:translateY(-6px);
    box-shadow:0 24px 64px rgba(0,0,0,.6), 0 0 50px rgba(14,165,233,.2);
  }
  .glow-card:hover .glow-card-inner {
    background: linear-gradient(145deg, #0f1e35 0%, #0c1525 100%);
    box-shadow:
      0 6px 32px rgba(0,0,0,.5),
      0 0 0 1px rgba(14,165,233,.28),
      inset 0 0 70px rgba(14,165,233,.10),
      inset 0 0 25px rgba(14,165,233,.07),
      0 0 50px rgba(14,165,233,.18);
  }
  .glow-card.active .glow-card-inner {
    background: linear-gradient(145deg, #0f2240 0%, #0c1a30 100%);
    box-shadow:
      0 0 0 1px rgba(14,165,233,.45),
      0 8px 40px rgba(0,0,0,.55),
      inset 0 0 90px rgba(14,165,233,.16),
      inset 0 0 35px rgba(14,165,233,.10),
      0 0 70px rgba(14,165,233,.25);
  }

  /* ══════════════════════════════════════
     NAV
  ══════════════════════════════════════ */
  .r1-nav {
    position:sticky; top:0; z-index:900;
    background:rgba(5,8,15,.88);
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
    border-bottom:1px solid var(--border);
    padding:.7rem 0;
  }
  .r1-logo {
    font-family:var(--font-d); font-weight:900; font-size:1.6rem; letter-spacing:.04em;
    color:#fff; text-decoration:none; display:flex; align-items:center; gap:.3rem;
  }
  .r1-logo .num {
    background:linear-gradient(135deg,var(--orange),var(--gold));
    -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  }
  .r1-logo .tag {
    font-size:.58rem; font-weight:700; letter-spacing:.12em;
    border:1px solid var(--border-o); color:var(--orange);
    padding:1px 5px; border-radius:3px; margin-left:2px;
    font-family:var(--font-b); -webkit-text-fill-color:var(--orange);
  }
  .r1-nav .nav-link {
    font-family:var(--font-b); font-size:.95rem; font-weight:600;
    letter-spacing:.06em; text-transform:uppercase;
    color:var(--text2); padding:.4rem .85rem; transition:color .2s;
  }
  .r1-nav .nav-link:hover { color:var(--blue-b); }

  /* Nav CTA — outlined (entrar), mesmo “feel” dos CTAs (glow + lift + partículas no JS) */
  .btn-nav-signin {
    display:inline-flex; align-items:center; justify-content:center;
    font-family:var(--font-d); font-weight:700; font-size:.88rem;
    letter-spacing:.08em; text-transform:uppercase;
    border:1.5px solid rgba(14,165,233,.35); color:var(--blue-b);
    background:rgba(14,165,233,.06); padding:.36rem 1rem; border-radius:4px;
    text-decoration:none; white-space:nowrap;
    position:relative; overflow:hidden; cursor:pointer;
    transition:border-color .2s, background .2s, box-shadow .2s, transform .18s cubic-bezier(.22,.68,0,1.5), color .2s;
  }
  .btn-nav-signin::before {
    content:''; position:absolute; inset:0;
    background:radial-gradient(ellipse at 50% 120%, rgba(14,165,233,.28), transparent 70%);
    opacity:0; transform:scaleY(0); transform-origin:bottom;
    transition:opacity .3s, transform .3s;
  }
  .btn-nav-signin:hover {
    border-color:var(--blue); background:rgba(14,165,233,.14); color:#fff;
    box-shadow:0 0 28px rgba(14,165,233,.35);
    transform:translateY(-2px) scale(1.04);
  }
  .btn-nav-signin:hover::before { opacity:1; transform:scaleY(1); }
  .btn-nav-signin:active { transform:scale(.97); }

  /* Nav CTA — filled (criar conta) */
  .btn-nav-cta {
    font-family:var(--font-d); font-weight:800; font-size:.88rem;
    letter-spacing:.08em; text-transform:uppercase;
    background:linear-gradient(135deg,var(--orange),var(--gold));
    color:#060200; border:none; padding:.4rem 1.1rem; border-radius:4px;
    text-decoration:none; white-space:nowrap;
    box-shadow:0 0 18px rgba(249,115,22,.35);
    transition:transform .15s, box-shadow .2s, filter .2s;
  }
  .btn-nav-cta:hover { transform:translateY(-2px) scale(1.04); box-shadow:0 0 32px rgba(249,115,22,.6); filter:brightness(1.08); color:#060200; }
  .btn-nav-cta:active { transform:scale(.97); }

  /* ══════════════════════════════════════
     BUTTONS (global)
  ══════════════════════════════════════ */
  .btn-fire {
    display:inline-flex; align-items:center; gap:.55rem;
    font-family:var(--font-d); font-weight:800; font-size:1.05rem;
    letter-spacing:.1em; text-transform:uppercase;
    background:linear-gradient(135deg,var(--orange) 0%,var(--gold) 100%);
    color:#060200; border:none; padding:.95rem 2.2rem; border-radius:6px;
    text-decoration:none; margin-top:2rem; position:relative; overflow:hidden;
    box-shadow:0 0 32px rgba(249,115,22,.4);
    transition:transform .18s cubic-bezier(.22,.68,0,1.5), box-shadow .2s, filter .2s;
  }
  .btn-fire::after {
    content:''; position:absolute; inset:0;
    background:linear-gradient(135deg,rgba(255,255,255,.18),transparent);
    opacity:0; transition:opacity .2s;
  }
  .btn-fire:hover { transform:translateY(-3px) scale(1.04); box-shadow:0 0 56px rgba(249,115,22,.7); filter:brightness(1.1); color:#060200; }
  .btn-fire:hover::after { opacity:1; }
  .btn-fire:active { transform:scale(.97); box-shadow:0 0 20px rgba(249,115,22,.3); }

  .btn-blue {
    display:inline-flex; align-items:center; gap:.5rem;
    font-family:var(--font-d); font-weight:700; font-size:1.05rem;
    letter-spacing:.08em; text-transform:uppercase;
    border:1.5px solid rgba(14,165,233,.35); color:var(--blue-b);
    background:rgba(14,165,233,.06); padding:.95rem 1.9rem; border-radius:6px;
    text-decoration:none; margin-top:2rem; position:relative; overflow:hidden;
    transition:border-color .2s, background .2s, box-shadow .2s, transform .18s cubic-bezier(.22,.68,0,1.5);
  }
  .btn-blue::before {
    content:''; position:absolute; inset:0;
    background:radial-gradient(ellipse at 50% 120%, rgba(14,165,233,.25), transparent 70%);
    opacity:0; transition:opacity .3s; transform:scaleY(0); transform-origin:bottom;
    transition:opacity .3s, transform .3s;
  }
  .btn-blue:hover { border-color:var(--blue); background:rgba(14,165,233,.14); box-shadow:0 0 28px rgba(14,165,233,.3); color:#fff; transform:translateY(-3px); }
  .btn-blue:hover::before { opacity:1; transform:scaleY(1); }
  .btn-blue:active { transform:scale(.97); }

  /* small variant */
  .btn-sm-blue {
    display:inline-flex; align-items:center; gap:.4rem;
    font-family:var(--font-d); font-weight:700; font-size:.88rem;
    letter-spacing:.08em; text-transform:uppercase;
    border:1.5px solid rgba(14,165,233,.3); color:var(--blue-b);
    background:rgba(14,165,233,.06); padding:.5rem 1.3rem; border-radius:5px;
    text-decoration:none; transition:all .2s;
  }
  .btn-sm-blue:hover { border-color:var(--blue); background:rgba(14,165,233,.14); color:#fff; box-shadow:0 0 18px rgba(14,165,233,.25); transform:translateY(-2px); }

  /* ══════════════════════════════════════
     HERO
  ══════════════════════════════════════ */
  .hero {
    position:relative; min-height:90vh;
    display:flex; align-items:center; overflow:hidden; padding:5rem 0 4rem;
  }
  .hero-mouse-glow {
    position: absolute;
    width: 500px; height: 500px;
    background: radial-gradient(circle, rgba(14,165,233,.2) 0%, transparent 65%);
    border-radius: 50%;
    pointer-events: none;
    transform: translate(-50%, -50%);
    left: -1000px; top: -1000px;
    z-index: 1;
    mix-blend-mode: screen;
  }
  .word-anim {
    display: inline-block;
    animation: fadeUpWord 0.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  }
  @keyframes fadeUpWord {
    0% { transform: translateY(20px); opacity: 0; }
    100% { transform: translateY(0); opacity: 1; }
  }
  .orb { position:absolute; border-radius:50%; filter:blur(90px); pointer-events:none; }
  .orb1 { width:600px;height:600px; top:-150px;left:-100px; background:radial-gradient(circle,rgba(14,165,233,.18),transparent 70%); }
  .orb2 { width:500px;height:500px; bottom:-80px;right:5%;   background:radial-gradient(circle,rgba(249,115,22,.15),transparent 70%); }
  .orb3 { width:280px;height:280px; top:30%;right:26%;       background:radial-gradient(circle,rgba(251,191,36,.08),transparent 70%); }
  .hero-slash {
    position:absolute; top:0; right:35%; width:1.5px; height:100%;
    background:linear-gradient(180deg,transparent,rgba(14,165,233,.3) 40%,rgba(249,115,22,.2) 70%,transparent);
    transform:rotate(-8deg); pointer-events:none;
  }

  .hero-eyebrow {
    display:inline-flex; align-items:center; gap:.5rem;
    font-family:var(--font-b); font-size:.8rem; font-weight:600;
    letter-spacing:.18em; text-transform:uppercase; color:var(--text2); margin-bottom:1.4rem;
  }
  .pulse-ring { width:10px;height:10px; border-radius:50%; background:var(--orange); position:relative; flex-shrink:0; }
  .pulse-ring::before {
    content:''; position:absolute; inset:-4px; border-radius:50%;
    border:1.5px solid var(--orange); opacity:.6;
    animation:rpulse 2s ease-in-out infinite;
  }
  @keyframes rpulse { 0%,100%{transform:scale(1);opacity:.6} 50%{transform:scale(1.7);opacity:0} }
  .hero-eyebrow em { color:var(--orange-b); font-style:normal; }

  .hero-title {
    font-family:var(--font-d); font-weight:900;
    font-size:clamp(3.8rem,9vw,8rem); line-height:.9;
    letter-spacing:.01em; text-transform:uppercase; color:#fff;
  }
  .grad-blue { background:linear-gradient(90deg,var(--blue-b),#7dd3fc); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
  .grad-fire { background:linear-gradient(90deg,var(--orange),var(--gold));  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }

  .hero-subtitle { font-size:1.2rem; font-weight:500; color:var(--text2); max-width:440px; line-height:1.65; margin-top:1.6rem; }

  /* hex grid */
  .hex-grid {
    display:grid; grid-template-columns:repeat(3,100px);
    grid-template-rows:repeat(3,100px); gap:12px;
    transform:rotate(-6deg); margin:auto;
  }
  .hx {
    width:100px;height:100px; border-radius:18px;
    display:flex;align-items:center;justify-content:center; font-size:2.8rem;
    border:1px solid var(--border);
    background:linear-gradient(135deg,rgba(14,165,233,.06),rgba(5,8,15,.8));
    animation:hfloat 5s ease-in-out infinite;
  }
  .hx.lo { border-color:rgba(249,115,22,.35); background:linear-gradient(135deg,rgba(249,115,22,.1),rgba(5,8,15,.8)); box-shadow:0 0 28px rgba(249,115,22,.12); }
  .hx.lb { border-color:rgba(14,165,233,.4);  background:linear-gradient(135deg,rgba(14,165,233,.12),rgba(5,8,15,.8)); box-shadow:0 0 28px rgba(14,165,233,.15); }
  .hx:nth-child(1){animation-delay:0s}.hx:nth-child(2){animation-delay:.4s}.hx:nth-child(3){animation-delay:.8s}
  .hx:nth-child(4){animation-delay:1.2s}.hx:nth-child(5){animation-delay:1.6s}.hx:nth-child(6){animation-delay:2s}
  .hx:nth-child(7){animation-delay:2.4s}.hx:nth-child(8){animation-delay:2.8s}.hx:nth-child(9){animation-delay:3.2s}
  @keyframes hfloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-12px)} }

  .corner-deco::before,.corner-deco::after { content:''; position:absolute; background:var(--orange); }
  .corner-deco.tl::before { top:0;left:0; width:2px;height:44px; }
  .corner-deco.tl::after  { top:0;left:0; width:44px;height:2px; }
  .corner-deco.br::before { bottom:0;right:0; width:2px;height:44px; }
  .corner-deco.br::after  { bottom:0;right:0; width:44px;height:2px; }

  /* ══════════════════════════════════════
     STATS
  ══════════════════════════════════════ */
  .stats-strip {
    position:relative; z-index:1;
    background:linear-gradient(90deg,rgba(14,165,233,.07),rgba(249,115,22,.04));
    border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:2rem 0;
  }
  .stat-item { text-align:center; }
  .stat-number { font-family:var(--font-d); font-size:2.8rem; font-weight:900; color:#fff; line-height:1; }
  .sn-blue { color:var(--blue-b); text-shadow:0 0 22px rgba(14,165,233,.55); }
  .sn-fire { color:var(--orange-b); text-shadow:0 0 22px rgba(249,115,22,.55); }
  .sn-gold { color:var(--gold); text-shadow:0 0 22px rgba(251,191,36,.45); }
  .stat-label { font-size:.8rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--text2); margin-top:.3rem; }
  .stat-sep { width:1px; background:var(--border); align-self:stretch; margin:0 .5rem; }

  /* ══════════════════════════════════════
     SECTION LABELS
  ══════════════════════════════════════ */
  .slabel {
    font-family:var(--font-b); font-size:.75rem; font-weight:600;
    letter-spacing:.22em; text-transform:uppercase; color:var(--orange);
    display:flex; align-items:center; gap:.6rem; margin-bottom:.5rem;
  }
  .slabel::before { content:''; display:inline-block; width:24px; height:2px; background:var(--orange); }
  .stitle { font-family:var(--font-d); font-size:clamp(2rem,4vw,3rem); font-weight:900; text-transform:uppercase; color:#fff; line-height:1; letter-spacing:.02em; }

  /* ══════════════════════════════════════
     MODALITIES — use glow-card
  ══════════════════════════════════════ */
  .modalities { padding:5.5rem 0; position:relative; z-index:1; }

  .mod-inner {
    padding:1.6rem 1.4rem;
    cursor:pointer;
  }
  .mod-icon { font-size:2.8rem; margin-bottom:1rem; display:block; }
  .mod-name { font-family:var(--font-d); font-size:1.25rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; color:#fff; }
  .mod-count { font-size:.88rem; color:var(--text2); margin-top:.25rem; font-weight:500; }
  .mod-tag { display:inline-block; font-size:.7rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:2px 8px; border-radius:3px; margin-top:.9rem; }
  .tag-hot { background:rgba(249,115,22,.18);color:var(--orange-b);border:1px solid rgba(249,115,22,.35); }
  .tag-new { background:rgba(14,165,233,.14);color:var(--blue-b);border:1px solid rgba(14,165,233,.35); }
  .tag-pop { background:rgba(251,191,36,.14);color:var(--gold);border:1px solid rgba(251,191,36,.3); }

  /* ══════════════════════════════════════
     HOW IT WORKS — accordion style
  ══════════════════════════════════════ */
  .how-it-works {
    padding:5.5rem 0; position:relative; z-index:1;
    background:var(--surface);
    border-top:1px solid var(--border); border-bottom:1px solid var(--border);
  }
  .how-it-works::before {
    content:''; position:absolute; inset:0; pointer-events:none;
    background:radial-gradient(ellipse 60% 80% at 80% 50%,rgba(249,115,22,.05),transparent 65%);
  }

  /* The 3-step row: always single line on desktop, each card shrinks to content */
  .steps-row {
    display:flex; gap:1rem;
    align-items:flex-start; /* CRITICAL: don't stretch — let each card be its own height */
  }
  @media(max-width:767px) { .steps-row { flex-direction:column; } }

  .step-col { flex:1; min-width:0; }

  /* step-card: no fixed height — grows only when active */
  .step-card {
    cursor:pointer;
    height:auto !important; /* override glow-card height:100% */
  }
  /* override glow-card-inner height too */
  .step-card .glow-card-inner {
    height:auto !important;
  }

  .step-inner {
    padding:1.6rem 1.5rem;
    user-select:none;
  }

  /* ── Expressive blue glow on hover/active ── */
  /* glow-card-inner already has base shadow; for steps we override */
  .step-card .glow-card-inner {
    transition: box-shadow .4s, background .4s;
  }
  .step-card:hover .glow-card-inner {
    background: linear-gradient(145deg, #0f1e35 0%, #0c1525 100%);
    box-shadow:
      0 0 0 1px rgba(14,165,233,.35),
      0 8px 32px rgba(0,0,0,.5),
      inset 0 0 60px rgba(14,165,233,.10),
      inset 0 0 20px rgba(14,165,233,.07),
      0 0 40px rgba(14,165,233,.15);
  }
  .step-card.active .glow-card-inner {
    background: linear-gradient(145deg, #0f2240 0%, #0c1a30 100%);
    box-shadow:
      0 0 0 1px rgba(14,165,233,.5),
      0 8px 40px rgba(0,0,0,.55),
      inset 0 0 80px rgba(14,165,233,.16),
      inset 0 0 30px rgba(14,165,233,.10),
      inset 0 -20px 60px rgba(14,165,233,.06),
      0 0 60px rgba(14,165,233,.22);
  }

  /* header row: number + title always visible */
  .step-header {
    display:flex; align-items:center; gap:.9rem;
  }
  .step-num {
    font-family:var(--font-d); font-size:3.2rem; font-weight:900; line-height:1;
    flex-shrink:0; transition:color .3s, text-shadow .3s;
  }
  .sn1 { color:rgba(14,165,233,.22); }
  .sn2 { color:rgba(249,115,22,.22); }
  .sn3 { color:rgba(251,191,36,.22); }
  .step-card:hover .sn1  { color:rgba(14,165,233,.6); text-shadow:0 0 20px rgba(14,165,233,.4); }
  .step-card:hover .sn2  { color:rgba(249,115,22,.6);  text-shadow:0 0 20px rgba(249,115,22,.4); }
  .step-card:hover .sn3  { color:rgba(251,191,36,.55); text-shadow:0 0 20px rgba(251,191,36,.35); }
  .step-card.active .sn1 { color:var(--blue-b);  text-shadow:0 0 28px rgba(14,165,233,.7); }
  .step-card.active .sn2 { color:var(--orange-b); text-shadow:0 0 28px rgba(249,115,22,.7); }
  .step-card.active .sn3 { color:var(--gold);     text-shadow:0 0 28px rgba(251,191,36,.6); }

  .step-title {
    font-family:var(--font-d); font-size:1.25rem; font-weight:800; text-transform:uppercase;
    letter-spacing:.04em; color:var(--text2);
    transition:color .3s;
  }
  .step-card:hover .step-title, .step-card.active .step-title { color:#fff; }

  .step-chevron {
    margin-left:auto; color:var(--muted); font-size:1.1rem;
    transition:transform .35s, color .3s;
    flex-shrink:0;
  }
  .step-card.active .step-chevron { transform:rotate(180deg); color:var(--blue-b); }
  .step-card:hover .step-chevron { color:var(--blue-b); }

  /* collapsible body — zero height when closed, grows when active */
  .step-body {
    overflow:hidden;
    max-height:0;
    opacity:0;
    transition:max-height .48s cubic-bezier(.4,0,.2,1), opacity .38s ease;
  }
  .step-card.active .step-body {
    max-height:200px;
    opacity:1;
  }

  .step-desc {
    font-size:1rem; color:var(--text2); line-height:1.7;
    padding-top:.9rem; font-weight:500;
    border-top:1px solid rgba(14,165,233,.18); margin-top:.9rem;
    transition:color .3s;
  }
  .step-card.active .step-desc { color:var(--text); }

  .step-badge {
    width:44px; height:44px; border-radius:10px;
    display:flex; align-items:center; justify-content:center; font-size:1.35rem;
    flex-shrink:0;
  }
  .sb-blue { background:rgba(14,165,233,.12); border:1px solid rgba(14,165,233,.25); }
  .sb-fire { background:rgba(249,115,22,.12); border:1px solid rgba(249,115,22,.25); }
  .sb-gold { background:rgba(251,191,36,.10); border:1px solid rgba(251,191,36,.2); }

  /* ══════════════════════════════════════
     PARTIDAS — use glow-card
  ══════════════════════════════════════ */
  .matches { padding:5.5rem 0; position:relative; z-index:1; }

  .mch-head {
    padding:1.1rem 1.4rem .9rem; border-bottom:1px solid var(--border);
    display:flex; justify-content:space-between; align-items:center;
    background:linear-gradient(90deg,rgba(14,165,233,.05),transparent);
  }
  .mch-sport {
    font-family:var(--font-d); font-size:1.05rem; font-weight:800;
    text-transform:uppercase; letter-spacing:.06em; color:#fff;
    display:flex; align-items:center; gap:.45rem;
  }
  .mbadge { font-size:.68rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase; padding:3px 9px; border-radius:20px; }
  .mbadge.open { background:rgba(14,165,233,.18); color:var(--blue-b); border:1px solid rgba(14,165,233,.35); }
  .mbadge.full { background:rgba(249,115,22,.18); color:var(--orange-b); border:1px solid rgba(249,115,22,.35); }

  .mch-body { padding:1.2rem 1.4rem; }
  .mch-info { display:flex; gap:1.2rem; flex-wrap:wrap; font-size:.9rem; color:var(--text2); margin-bottom:1rem; font-weight:500; }
  .mch-info i { color:var(--blue); margin-right:.25rem; }
  .mch-players { display:flex; align-items:center; gap:.35rem; margin-bottom:1rem; }
  .av { width:32px;height:32px; border-radius:50%; border:2px solid var(--bg); font-size:.74rem; display:flex; align-items:center; justify-content:center; font-weight:700; font-family:var(--font-d); }
  .av1{background:#1e40af}.av2{background:#7c3aed}.av3{background:#065f46}.av4{background:#9a3412}
  .av.more { background:var(--surface); border-color:var(--border); color:var(--muted); font-size:.6rem; }
  .mslots { font-size:.85rem; color:var(--text2); margin-left:.3rem; font-weight:600; }
  .mslots b { color:var(--blue-b); }

  .btn-enter {
    width:100%; font-family:var(--font-d); font-weight:800; font-size:.92rem;
    letter-spacing:.1em; text-transform:uppercase;
    background:transparent; border:1.5px solid var(--blue); color:var(--blue-b);
    padding:.55rem; border-radius:7px;
    transition:background .2s, box-shadow .2s, color .2s, transform .15s;
  }
  .btn-enter:hover { background:rgba(14,165,233,.16); box-shadow:0 0 22px rgba(14,165,233,.3); color:#fff; transform:translateY(-1px); }
  .btn-enter:active { transform:scale(.97); }
  .btn-enter.dis { border-color:var(--border); color:var(--muted); cursor:default; }
  .btn-enter.dis:hover { background:transparent; box-shadow:none; color:var(--muted); transform:none; }

  .matches-ver-mais-wrap {
    margin-top: 2rem;
    padding-top: .25rem;
  }
  .matches .btn-r1-landing-matches {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    font-family: var(--font-d);
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    background: linear-gradient(135deg,var(--orange),var(--gold));
    color: #060200;
    border: none;
    border-radius: 8px;
    position: relative;
    overflow: hidden;
    padding: .75rem 2rem;
    line-height: 1.2;
    box-shadow: 0 0 28px rgba(249,115,22,.42);
    cursor: pointer;
    transition: transform .18s cubic-bezier(.22,.68,0,1.5), box-shadow .2s, filter .2s, color .2s;
  }
  .matches .btn-r1-landing-matches::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255,255,255,.2), transparent);
    opacity: 0;
    transition: opacity .2s;
    pointer-events: none;
  }
  .matches .btn-r1-landing-matches:hover {
    transform: translateY(-3px) scale(1.04);
    box-shadow: 0 0 48px rgba(249,115,22,.62);
    filter: brightness(1.08);
    color: #060200;
  }
  .matches .btn-r1-landing-matches:hover::after { opacity: 1; }
  .matches .btn-r1-landing-matches:active {
    transform: scale(.97);
    box-shadow: 0 0 18px rgba(249,115,22,.35);
  }

  /* ══════════════════════════════════════
     PRICING — efeitos épicos
  ══════════════════════════════════════ */
  .pricing { padding:5.5rem 0; position:relative; z-index:1; }
  .pricing::before {
    content:''; position:absolute; inset:0; pointer-events:none;
    background:radial-gradient(ellipse 60% 70% at 50% 50%,rgba(14,165,233,.05),transparent 65%);
  }

  /* ── FREE CARD ── */
  .price-card-free {
    position:relative; overflow:hidden;
    background:var(--card);
    border:1px solid rgba(14,165,233,.2);
    border-radius:16px; padding:2.4rem 2rem; height:100%;
    cursor:pointer;
    box-shadow:
      0 4px 30px rgba(0,0,0,.5),
      0 0 0 1px rgba(14,165,233,.07),
      inset 0 0 40px rgba(14,165,233,.03);
    transition:transform .4s cubic-bezier(.22,.68,0,1.4), box-shadow .4s, border-color .4s, background .4s;
  }
  /* resting corner glow */
  .price-card-free::before {
    content:''; position:absolute;
    top:-60px; left:-60px;
    width:200px; height:200px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(14,165,233,.12) 0%, transparent 70%);
    filter:blur(30px);
    transition:all .5s;
    pointer-events:none;
  }
  /* bottom-right subtle accent */
  .price-card-free::after {
    content:''; position:absolute;
    bottom:-80px; right:-40px;
    width:180px; height:180px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(14,165,233,.07) 0%, transparent 70%);
    filter:blur(40px);
    transition:all .5s;
    pointer-events:none;
  }
  .price-card-free:hover {
    transform:translateY(-8px) scale(1.01);
    border-color:rgba(14,165,233,.55);
    background:linear-gradient(160deg, #0f2040 0%, #0c1525 60%, #0a1020 100%);
    box-shadow:
      0 28px 70px rgba(0,0,0,.65),
      0 0 0 1px rgba(14,165,233,.4),
      0 0 60px rgba(14,165,233,.18),
      inset 0 0 80px rgba(14,165,233,.08),
      inset 0 0 30px rgba(14,165,233,.05);
  }
  .price-card-free:hover::before {
    top:-20px; left:-20px;
    width:280px; height:280px;
    background:radial-gradient(circle, rgba(14,165,233,.2) 0%, transparent 70%);
  }
  .price-card-free:hover::after {
    bottom:-30px; right:-10px;
    width:240px; height:240px;
    background:radial-gradient(circle, rgba(14,165,233,.12) 0%, transparent 70%);
  }
  /* scan line sweep on hover */
  .price-card-free .scan-line {
    position:absolute; top:0; left:-100%;
    width:60%; height:100%;
    background:linear-gradient(90deg, transparent, rgba(14,165,233,.04) 50%, transparent);
    transform:skewX(-15deg);
    transition:left .7s ease;
    pointer-events:none;
  }
  .price-card-free:hover .scan-line { left:150%; }

  /* ── PRO CARD (uses glow-card wrapper) ── */
  .price-card-pro-inner {
    background:linear-gradient(145deg,#0e1f38 0%,#0c1525 50%,#0a1020 100%);
    border-radius:15px; padding:2.4rem 2rem; height:100%;
    position:relative; overflow:hidden; cursor:pointer;
    box-shadow:
      0 4px 30px rgba(0,0,0,.55),
      inset 0 0 60px rgba(249,115,22,.05),
      inset 0 0 100px rgba(14,165,233,.04);
    transition: background .5s, box-shadow .4s;
  }

  /* top gradient bar */
  .price-card-pro-inner::before {
    content:''; position:absolute; top:0;left:0;right:0;height:3px;
    background:linear-gradient(90deg,var(--blue),var(--orange),var(--gold),var(--orange),var(--blue));
    background-size:300% 100%;
    animation:bar-flow 3s linear infinite;
  }
  @keyframes bar-flow { 0%{background-position:0% 50%} 100%{background-position:300% 50%} }

  /* large fire orb bottom-right */
  .price-card-pro-inner .pro-orb-fire {
    position:absolute; bottom:-100px; right:-80px;
    width:300px; height:300px; border-radius:50%;
    background:radial-gradient(circle, rgba(249,115,22,.14) 0%, transparent 65%);
    filter:blur(40px);
    transition:all .5s;
    pointer-events:none;
  }
  /* blue orb top-left */
  .price-card-pro-inner .pro-orb-blue {
    position:absolute; top:-80px; left:-60px;
    width:250px; height:250px; border-radius:50%;
    background:radial-gradient(circle, rgba(14,165,233,.1) 0%, transparent 65%);
    filter:blur(40px);
    transition:all .5s;
    pointer-events:none;
  }
  /* grid overlay */
  .price-card-pro-inner .pro-grid {
    position:absolute; inset:0; pointer-events:none;
    background-image:
      linear-gradient(rgba(249,115,22,.03) 1px, transparent 1px),
      linear-gradient(90deg,rgba(249,115,22,.03) 1px, transparent 1px);
    background-size:32px 32px;
    opacity:0; transition:opacity .4s;
  }
  /* hover: shine sweep */
  .price-card-pro-inner .pro-shine {
    position:absolute; top:0; left:-120%;
    width:70%; height:100%;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.045) 50%, transparent);
    transform:skewX(-15deg);
    transition:left .8s ease;
    pointer-events:none;
  }
  .glow-card:hover .price-card-pro-inner .pro-shine { left:160%; }
  .glow-card:hover .price-card-pro-inner .pro-grid { opacity:1; }
  .glow-card:hover .price-card-pro-inner {
    background:linear-gradient(145deg,#111f38 0%,#0e1a2e 50%,#0c1525 100%);
    box-shadow:
      0 6px 40px rgba(0,0,0,.6),
      inset 0 0 80px rgba(249,115,22,.08),
      inset 0 0 120px rgba(14,165,233,.06);
  }
  .glow-card:hover .price-card-pro-inner .pro-orb-fire {
    bottom:-40px; right:-20px; width:380px; height:380px;
    background:radial-gradient(circle, rgba(249,115,22,.22) 0%, transparent 65%);
  }
  .glow-card:hover .price-card-pro-inner .pro-orb-blue {
    top:-30px; left:-10px; width:320px; height:320px;
    background:radial-gradient(circle, rgba(14,165,233,.18) 0%, transparent 65%);
  }

  /* particle dots */
  .pro-particles {
    position:absolute; inset:0; pointer-events:none; overflow:hidden;
  }
  .pro-particle {
    position:absolute; width:2px; height:2px; border-radius:50%;
    background:var(--orange-b); opacity:0;
    animation:particle-rise 4s ease-in-out infinite;
  }
  .pro-particle:nth-child(1)  { left:15%; animation-delay:0s;    background:var(--blue-b); }
  .pro-particle:nth-child(2)  { left:30%; animation-delay:.8s;   background:var(--gold); }
  .pro-particle:nth-child(3)  { left:50%; animation-delay:1.4s;  background:var(--orange-b); }
  .pro-particle:nth-child(4)  { left:68%; animation-delay:2.1s;  background:var(--blue-b); }
  .pro-particle:nth-child(5)  { left:82%; animation-delay:0.4s;  background:var(--gold); }
  .pro-particle:nth-child(6)  { left:25%; animation-delay:2.8s;  background:var(--orange-b); }
  .pro-particle:nth-child(7)  { left:75%; animation-delay:1.8s;  background:var(--blue-b); }
  @keyframes particle-rise {
    0%   { bottom:10%; opacity:0; transform:translateX(0) scale(1); }
    20%  { opacity:.9; }
    80%  { opacity:.4; }
    100% { bottom:95%; opacity:0; transform:translateX(calc((var(--rx,0) - 0.5) * 40px)) scale(.5); }
  }
  .pro-particle:nth-child(odd)  { --rx:.8; }
  .pro-particle:nth-child(even) { --rx:.2; }

  /* ── POPULAR TAG ── */
  .price-popular-tag {
    position:absolute; top:-1px; left:50%; transform:translateX(-50%);
    font-size:.65rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
    background:linear-gradient(135deg,var(--orange),var(--gold));
    color:#060200; padding:4px 18px; border-radius:0 0 10px 10px;
    white-space:nowrap;
    box-shadow:0 6px 20px rgba(249,115,22,.5);
    animation:tag-pulse 2.5s ease-in-out infinite;
  }
  @keyframes tag-pulse {
    0%,100% { box-shadow:0 6px 20px rgba(249,115,22,.5); }
    50%      { box-shadow:0 6px 32px rgba(249,115,22,.9), 0 0 24px rgba(251,191,36,.4); }
  }

  /* ── SHARED PRICE ELEMENTS ── */
  .price-badge {
    display:inline-flex; align-items:center; gap:.4rem;
    font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
    padding:3px 10px; border-radius:20px; margin-bottom:1.2rem;
  }
  .pb-free { background:rgba(14,165,233,.12); color:var(--blue-b); border:1px solid rgba(14,165,233,.25); }
  .pb-pro  { background:linear-gradient(90deg,rgba(249,115,22,.2),rgba(251,191,36,.15)); color:var(--gold); border:1px solid rgba(251,191,36,.3); }

  .price-name {
    font-family:var(--font-d); font-size:1.6rem; font-weight:900; text-transform:uppercase;
    letter-spacing:.04em; color:#fff; margin-bottom:.5rem;
  }
  .price-value { font-family:var(--font-d); font-weight:900; line-height:1; margin-bottom:.4rem; }
  .price-value .cur { font-size:1.4rem; vertical-align:super; color:var(--text2); }
  .price-value .amount { font-size:3.8rem; color:#fff; }
  .price-value .per { font-size:.9rem; color:var(--text2); }
  .price-value.free-price .amount { font-size:3rem; color:var(--blue-b); }
  .price-sub { font-size:.9rem; color:var(--text2); margin-bottom:1.8rem; font-weight:400; }
  .price-divider { border:none; border-top:1px solid var(--border); margin:1.4rem 0; }
  .price-feat-title {
    font-family:var(--font-b); font-size:.75rem; font-weight:700;
    letter-spacing:.15em; text-transform:uppercase; color:var(--muted); margin-bottom:.9rem;
  }
  .price-feature {
    display:flex; align-items:flex-start; gap:.7rem;
    font-size:.97rem; font-weight:500; color:var(--text2); margin-bottom:.65rem; line-height:1.4;
    transition: color .3s;
  }
  .price-card-free:hover .price-feature { color:var(--text); }
  .glow-card:hover .price-feature { color:var(--text); }
  .price-feature i { color:var(--blue-b); flex-shrink:0; font-size:1rem; margin-top:.15rem; }
  .price-feature.pro-feat i { color:var(--gold); }
  .price-feature.disabled { opacity:.4; }
  .price-feature.disabled i { color:var(--muted); }

  .btn-price-free {
    display:flex; align-items:center; justify-content:center; gap:.5rem;
    font-family:var(--font-d); font-weight:800; font-size:.95rem;
    letter-spacing:.1em; text-transform:uppercase;
    border:1.5px solid rgba(14,165,233,.3); color:var(--blue-b);
    background:rgba(14,165,233,.07); padding:.75rem; border-radius:7px;
    text-decoration:none; margin-top:1.6rem; position:relative; overflow:hidden;
    transition:transform .2s cubic-bezier(.22,.68,0,1.5), box-shadow .2s, border-color .2s, background .2s;
  }
  .btn-price-free:hover {
    border-color:var(--blue); background:rgba(14,165,233,.18); color:#fff;
    box-shadow:0 0 28px rgba(14,165,233,.35), inset 0 0 20px rgba(14,165,233,.1);
    transform:translateY(-3px) scale(1.02);
  }
  .btn-price-free:active { transform:scale(.97); }

  .btn-price-pro {
    display:flex; align-items:center; justify-content:center; gap:.5rem;
    font-family:var(--font-d); font-weight:800; font-size:.95rem;
    letter-spacing:.1em; text-transform:uppercase;
    background:linear-gradient(135deg,var(--orange) 0%,var(--gold) 100%);
    color:#060200; border:none; padding:.78rem; border-radius:7px;
    text-decoration:none; margin-top:1.6rem; position:relative; overflow:hidden;
    box-shadow:0 0 30px rgba(249,115,22,.45), inset 0 1px 0 rgba(255,255,255,.2);
    transition:transform .2s cubic-bezier(.22,.68,0,1.5), box-shadow .2s, filter .2s;
  }
  .btn-price-pro::after {
    content:''; position:absolute; inset:0;
    background:linear-gradient(135deg,rgba(255,255,255,.15),transparent 50%);
    opacity:0; transition:opacity .2s;
  }
  .btn-price-pro:hover {
    transform:translateY(-3px) scale(1.03);
    box-shadow:0 0 55px rgba(249,115,22,.7), 0 0 20px rgba(251,191,36,.4), inset 0 1px 0 rgba(255,255,255,.2);
    filter:brightness(1.1); color:#060200;
  }
  .btn-price-pro:hover::after { opacity:1; }
  .btn-price-pro:active { transform:scale(.97); }

  /* ══════════════════════════════════════
     CTA
  ══════════════════════════════════════ */
  .cta-band { padding:5.5rem 0; position:relative; z-index:1; overflow:hidden; }
  .cta-band::before { content:''; position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse 80% 100% at 50% 50%,rgba(249,115,22,.07),transparent 65%); }
  .cta-inner {
    position:relative; z-index:1;
    background:linear-gradient(135deg,rgba(14,165,233,.07),rgba(249,115,22,.05));
    border:1px solid rgba(249,115,22,.22); border-radius:18px;
    padding:4rem 3rem; text-align:center; overflow:hidden;
  }
  .cta-inner::before { content:''; position:absolute; top:0;left:0;right:0;height:2px; background:linear-gradient(90deg,var(--blue),var(--orange),var(--gold)); }
  .cta-inner::after { content:''; position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(rgba(14,165,233,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(14,165,233,.03) 1px,transparent 1px); background-size:32px 32px; }
  .cta-big { font-family:var(--font-d); font-size:clamp(2.4rem,5.5vw,4.8rem); font-weight:900; text-transform:uppercase; line-height:.92; color:#fff; margin-bottom:1.2rem; position:relative; z-index:1; }
  .cta-sub { color:var(--text2); font-size:1.1rem; max-width:500px; margin:0 auto 2.2rem; position:relative; z-index:1; font-weight:500; }
  .cta-btns { position:relative; z-index:1; }

  /* ══════════════════════════════════════
     FOOTER
  ══════════════════════════════════════ */
  footer { background:var(--surface); border-top:1px solid var(--border); padding:3.5rem 0 2rem; position:relative; z-index:1; }
  .foot-logo { font-family:var(--font-d); font-weight:900; font-size:1.45rem; color:#fff; text-decoration:none; display:inline-flex; align-items:center; gap:.25rem; letter-spacing:.04em; margin-bottom:.5rem; }
  .foot-logo .num { background:linear-gradient(135deg,var(--orange),var(--gold)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
  .foot-tagline { font-size:.95rem; color:var(--text2); font-weight:500; }
  .fcol-title { font-family:var(--font-b); font-size:.76rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--blue-b); margin-bottom:1rem; opacity:.7; }
  .flink { display:block; font-size:1rem; color:var(--text2); text-decoration:none; margin-bottom:.55rem; transition:color .2s, padding-left .2s; font-weight:500; }
  .flink:hover { color:#fff; padding-left:4px; }
  .soc { width:38px; height:38px; border-radius:8px; border:1px solid rgba(14,165,233,.25); display:inline-flex; align-items:center; justify-content:center; color:var(--text2); font-size:1.05rem; text-decoration:none; transition:border-color .2s,color .2s,background .2s; }
  .soc:hover { border-color:var(--orange); color:var(--orange-b); background:rgba(249,115,22,.1); }
  .foot-bottom { border-top:1px solid var(--border); margin-top:2.5rem; padding-top:1.4rem; font-size:.88rem; color:var(--text2); font-weight:500; }

  /* ══════════════════════════════════════
     FADE IN & PARTICLES
  ══════════════════════════════════════ */
  .fi { opacity:0; transform:translateY(30px); transition:opacity .7s ease,transform .7s ease; }
  .fi.on { opacity:1; transform:translateY(0); }

  .btn-particle {
    position: absolute;
    pointer-events: none;
    border-radius: 50%;
    z-index: 9999;
    animation: btnParticleAnim 1.6s ease-out forwards;
  }
  @keyframes btnParticleAnim {
    0%   { opacity: 0; transform: scale(0.4) translate(0, 0); }
    15%  { opacity: 0.8; }
    100% { opacity: 0; transform: scale(1.1) translate(var(--tx), var(--ty)); }
  }

  @media(max-width:991px) { .hero-right{display:none!important} .hero{min-height:auto;padding:4rem 0 3rem} }
  @media(max-width:767px) { .stat-sep{display:none!important} }
  @media(max-width:575px) { .cta-inner{padding:2.5rem 1.5rem} }

  .landing-modal .modal-content { background: var(--card); color: var(--text); border: 1px solid var(--border); border-radius: 14px; }
  .landing-modal .modal-header { border-bottom-color: var(--border); }
  .landing-modal .modal-title { font-family: var(--font-d); font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: #fff; }
  .landing-modal .form-control { background: rgba(5,8,15,.75); border-color: var(--border); color: #fff; }
  .landing-modal .form-control:focus { border-color: var(--blue); box-shadow: 0 0 0 .2rem rgba(14,165,233,.2); background: rgba(5,8,15,.9); color: #fff; }
  .landing-modal .form-label { color: var(--text2); font-weight: 600; }
  .landing-modal .btn-close { filter: invert(1); opacity: .75; }
  .landing-modal .auth-divider { text-align: center; color: var(--muted); font-size: .8rem; margin: 1rem 0; position: relative; }
  .landing-modal .auth-divider::before, .landing-modal .auth-divider::after { content: ''; position: absolute; top: 50%; width: 42%; height: 1px; background: var(--border); }
  .landing-modal .auth-divider::before { left: 0; }
  .landing-modal .auth-divider::after { right: 0; }
  .landing-modal .btn-google { display: flex; align-items: center; justify-content: center; gap: .5rem; width: 100%; padding: .55rem 1rem; border: 1px solid var(--border); border-radius: 8px; background: rgba(255,255,255,.04); color: #fff; text-decoration: none; font-weight: 600; transition: background .2s, border-color .2s; }
  .landing-modal .btn-google:hover { background: rgba(255,255,255,.08); border-color: var(--blue-b); color: #fff; }
  .landing-modal .btn-google img { width: 20px; height: 20px; }
  .landing-modal .btn-r1-landing {
    font-family: var(--font-d); font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
    background: linear-gradient(135deg,var(--orange),var(--gold)); color: #060200; border: none; border-radius: 8px;
    position: relative; overflow: hidden;
    box-shadow: 0 0 22px rgba(249,115,22,.38);
    transition: transform .18s cubic-bezier(.22,.68,0,1.5), box-shadow .2s, filter .2s, color .2s;
  }
  .landing-modal .btn-r1-landing::after {
    content: ''; position: absolute; inset: 0;
    background: linear-gradient(135deg, rgba(255,255,255,.2), transparent);
    opacity: 0; transition: opacity .2s; pointer-events: none;
  }
  .landing-modal .btn-r1-landing:hover {
    transform: translateY(-2px) scale(1.03);
    box-shadow: 0 0 40px rgba(249,115,22,.55);
    filter: brightness(1.08);
    color: #060200;
  }
  .landing-modal .btn-r1-landing:hover::after { opacity: 1; }
  .landing-modal .btn-r1-landing:active { transform: scale(.97); box-shadow: 0 0 18px rgba(249,115,22,.35); }
  .landing-modal .btn-r1-landing:disabled,
  .landing-modal .btn-r1-landing.btn-loading {
    transform: none; filter: none; opacity: .72; cursor: not-allowed; box-shadow: 0 0 12px rgba(249,115,22,.2);
  }
  .landing-modal .btn-r1-landing:disabled::after,
  .landing-modal .btn-r1-landing.btn-loading::after { opacity: 0; }
  .landing-modal .btn-outline-landing { border: 1.5px solid rgba(14,165,233,.4); color: var(--blue-b); background: rgba(14,165,233,.08); font-weight: 700; border-radius: 8px; }
  .landing-modal .btn-outline-landing:hover { background: rgba(14,165,233,.18); color: #fff; border-color: var(--blue); }
  .landing-modal .codigo-inputs { display: flex; gap: .45rem; justify-content: center; flex-wrap: wrap; }
  .landing-modal .codigo-input { width: 2.5rem; height: 2.75rem; text-align: center; font-size: 1.25rem; font-weight: 700; border-radius: 8px; border: 1px solid var(--border); background: rgba(5,8,15,.75); color: #fff; }
  .landing-modal .alert.alert-danger.r1-neon-error {
    background: linear-gradient(145deg, rgba(255, 0, 70, 0.18), rgba(255, 0, 110, 0.1));
    border: 1px solid rgba(255, 77, 140, 0.95);
    color: #ff5c8d;
    box-shadow:
      0 0 20px rgba(255, 0, 90, 0.45),
      0 0 40px rgba(255, 0, 60, 0.2),
      inset 0 0 24px rgba(255, 0, 80, 0.1);
    text-shadow: 0 0 14px rgba(255, 70, 130, 0.55);
    font-weight: 600;
  }
  .landing-modal a.link-landing-subtle { color: var(--orange-b); font-weight: 600; }
  .flink-modal-trigger {
    display: block; width: 100%; text-align: left;
    font: inherit; font-size: 1rem; font-weight: 500; color: var(--text2);
    margin-bottom: .55rem; padding: 0; border: 0; background: none; cursor: pointer;
    transition: color .2s, padding-left .2s;
  }
  .flink-modal-trigger:hover { color: #fff; padding-left: 4px; }
  .landing-modal-legal .legal-doc {
    font-size: .9rem; line-height: 1.6; color: var(--text2);
  }
  .landing-modal-legal .legal-modal-footer {
    border-top: 1px solid var(--border);
    justify-content: center;
    padding: 1rem 1.25rem 1.35rem;
    background: var(--card);
    border-radius: 0 0 13px 13px;
  }
  .landing-modal-legal .legal-doc .legal-meta { font-size: .8rem; color: var(--muted); margin-bottom: 1rem; }
  .landing-modal-legal .legal-doc h3 {
    font-family: var(--font-d); font-size: 1.05rem; font-weight: 700; color: #fff;
    margin: 1.25rem 0 .5rem; text-transform: none; letter-spacing: 0;
  }
  .landing-modal-legal .legal-doc h3:first-child { margin-top: 0; }
  .landing-modal-legal .legal-doc p { margin-bottom: .75rem; }
  .landing-modal-legal .legal-doc ul { margin: 0 0 .75rem; padding-left: 1.2rem; }
  .landing-modal-legal .legal-doc li { margin-bottom: .35rem; }
  .landing-modal-legal .legal-doc strong { color: #e2e8f0; font-weight: 600; }

  /* Login modal — coluna convite ao cadastro */
  .landing-login-aside {
    background: linear-gradient(160deg, rgba(14, 165, 233, 0.22) 0%, rgba(5, 8, 15, 0.95) 45%, rgba(249, 115, 22, 0.12) 100%);
    border-bottom: 1px solid rgba(14, 165, 233, 0.2);
  }
  @media (min-width: 768px) {
    .landing-login-aside {
      border-bottom: none;
      border-right: 1px solid rgba(14, 165, 233, 0.18);
    }
    .landing-login-form-col {
      border-left: 1px solid rgba(148, 163, 184, 0.15);
    }
  }
  @media (max-width: 767.98px) {
    .landing-login-form-col {
      border-top: 1px solid rgba(148, 163, 184, 0.12);
    }
  }
  .landing-login-aside-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-family: var(--font-d);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #7dd3fc;
  }
  .landing-login-aside-title {
    font-family: var(--font-d);
    font-size: 1.15rem;
    font-weight: 800;
    line-height: 1.25;
    color: #e0f2fe;
  }

  /* Modal “todos os esportes” — estilo arcade / vitrine */
  .landing-modal-esportes .modal-title {
    font-family: var(--font-d);
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    background: linear-gradient(90deg, var(--blue-b), #fff, var(--orange-b));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
  }
  .esporte-modal-kicker {
    font-family: var(--font-d);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--orange-b);
  }
  .esporte-arcade-card {
    position: relative;
    overflow: hidden;
    border-radius: 14px;
    padding: 1rem 0.75rem 1.1rem;
    text-align: center;
    min-height: 128px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    background: linear-gradient(145deg, rgba(12, 21, 37, 0.95), rgba(5, 8, 15, 0.98));
    border: 1px solid rgba(14, 165, 233, 0.22);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  }
  .esporte-arcade-card:hover {
    transform: translateY(-4px) rotate(-1deg);
    border-color: rgba(249, 115, 22, 0.45);
    box-shadow: 0 0 28px rgba(14, 165, 233, 0.22);
  }
  .esporte-arcade-shine {
    position: absolute;
    inset: -40% -20%;
    background: linear-gradient(
      120deg,
      transparent 40%,
      rgba(125, 211, 252, 0.14) 50%,
      transparent 60%
    );
    animation: esporteArcadeShine 4s ease-in-out infinite;
    pointer-events: none;
  }
  @keyframes esporteArcadeShine {
    0%, 100% { transform: translateX(-12%) rotate(8deg); opacity: 0.4; }
    50% { transform: translateX(18%) rotate(8deg); opacity: 0.85; }
  }
  .esporte-arcade-emoji {
    font-size: 2.1rem;
    line-height: 1;
    filter: drop-shadow(0 0 10px rgba(56, 189, 248, 0.35));
    position: relative;
    z-index: 1;
  }
  .esporte-arcade-name {
    position: relative;
    z-index: 1;
    font-family: var(--font-d);
    font-weight: 800;
    font-size: 0.92rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #fff;
  }
  .esporte-arcade-meta {
    position: relative;
    z-index: 1;
    font-size: 0.72rem;
    color: var(--text2);
    font-weight: 600;
  }

  .mch-players--landing {
    justify-content: center;
    margin-bottom: 0.75rem;
  }

  button.glow-card .glow-card-inner {
    width: 100%;
  }

  /* Backdrop das modais na landing: mais escuro + “pixel” pontilhado (pontos discretos) */
  body.landing-body.modal-open .modal-backdrop.show {
    opacity: 1 !important;
    background-color: rgba(2, 5, 12, 0.94);
    background-image:
      radial-gradient(rgba(125, 211, 252, 0.075) 1.1px, transparent 1.25px),
      radial-gradient(rgba(255, 255, 255, 0.028) 0.9px, transparent 1.05px);
    background-size: 5px 5px, 3px 3px;
    background-position: 0 0, 2px 2px;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
  }