:root{
      --brand:#0B3D91;      /* azul deportivo */
      --accent:#FFB01C;     /* dorado premios/CTA */
      --ink:#0f172a;        /* texto principal */
      --muted:#475569;      /* texto secundario */
      --bg:#f8fafc;         /* fondo */
      --card:#ffffff;       /* tarjetas */
      --ok:#16a34a;         /* éxito */
      --danger:#dc2626;     /* alertas */
      --brand2:#721513;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0; font-family:Montserrat,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu;
      color:var(--ink); background:var(--bg); line-height:1.6;
    }
    .logo{width:auto; height:80px;}
    a{color:var(--brand); text-decoration:none}
    img{max-width:100%; height:auto; display:block}
    .wrap{max-width:1100px; margin-inline:auto; padding:0 20px}
    header.nav{
      position:sticky; top:0; z-index:50; background:var(--brand2); backdrop-filter:saturate(120%) blur(6px);
      color:#fff; border-bottom:1px solid #0b377f;
    }
    .nav__row{display:flex; align-items:center; justify-content:space-between; padding:12px 0}
    .logo{font-weight:800; letter-spacing:.2px}
    .nav__links{display:flex; gap:16px; flex-wrap:wrap; align-items:center}
    .nav__links a{color:#fff; font-weight:600; font-size:.95rem; opacity:.95}
    .btn{
      display:inline-block; padding:12px 18px; border-radius:999px; font-weight:700; letter-spacing:.3px;
      background:var(--accent); color:#1f2937; border:2px solid #e29d16;
      box-shadow:0 6px 16px rgba(255,176,28,.35);
    }
    .btn.outline{background:transparent; color:#fff; border-color:#fff}
    .hero{
      background:
        linear-gradient(180deg, rgba(11,61,145,.92), rgba(11,61,145,.70)),
        url('banner_liga_internacional_del_estado_lara.png') center/cover no-repeat;
      color:#fff;
    }
    .hero__in{padding:80px 0 64px}
    .kicker{font-weight:700; letter-spacing:.15em; text-transform:uppercase; opacity:.95}
    h1{font-size:clamp(28px,4vw,44px); line-height:1.15; margin:10px 0 12px}
    .sub{font-size:clamp(16px,2.6vw,20px); opacity:.95}
    .hero__cta{display:flex; gap:12px; margin-top:22px; flex-wrap:wrap}
    .badges{display:flex; gap:12px; margin-top:18px; flex-wrap:wrap}
    .tag{background:#ffffff; color:#0b3d91; padding:6px 10px; border-radius:8px; font-weight:700; font-size:.85rem}
    section{padding:60px 0}
    h2{font-size:clamp(22px,3.2vw,32px); margin:0 0 12px}
    .lead{color:var(--muted); max-width:820px}
    .grid{display:grid; gap:18px}
    .grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
    .grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
    @media (max-width:900px){.grid.cols-2,.grid.cols-3{grid-template-columns:1fr}}
    .card{
      background:var(--card); border:1px solid #e2e8f0; border-radius:16px; padding:18px;
      box-shadow:0 6px 20px rgba(2,8,23,.04);
    }
    .list{margin:10px 0 0; padding-left:18px}
    .pill{display:inline-block; background:#e2e8f0; color:#0f172a; padding:6px 10px; border-radius:999px; font-weight:600; font-size:.9rem}
    .notice{background:#fef3c7; border:1px dashed #f59e0b; color:#6b4f1d}
    .table{width:100%; border-collapse:separate; border-spacing:0; overflow:auto; font-size:.95rem}
    .table th,.table td{padding:10px 12px; border-bottom:1px solid #e2e8f0}
    .table th{background:#f1f5f9; text-align:left}
    .faq details{border:1px solid #e2e8f0; background:#fff; border-radius:12px; padding:14px 16px}
    .faq details+details{margin-top:10px}
    .faq summary{cursor:pointer; font-weight:700}
    footer{background:#0f1220;color:#e4e7f2;padding:36px 0;margin-top:20px}
    footer .rif{font-size:13px;line-height:1.6}
    .footer-grid{display:grid;grid-template-columns:2fr 1fr;gap:24px}
    .mini{font-size:.9rem}
    .rif{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; background:#0f172a; color:#e2e8f0; border-radius:12px; padding:14px; border:1px solid #334155}
    .foot-grid{display:grid; gap:18px; grid-template-columns:1.4fr .8fr}
    @media (max-width:900px){.foot-grid{grid-template-columns:1fr}}
    .cta-bar{
      position:fixed; inset:auto 0 14px; z-index:40; display:flex; justify-content:center; pointer-events:none;
    }
    .cta-bar__in{
      pointer-events:auto; background:var(--brand2); color:#fff; border:1px solid var(--brand2); border-radius:999px; padding:8px 10px;
      display:flex; gap:10px; align-items:center; box-shadow:0 10px 30px rgba(11,61,145,.35)
    }
    .cta-bar a{color:#1f2937}
    form .row{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
    @media (max-width:900px){form .row{grid-template-columns:1fr}}
    input,select,textarea{
      width:100%; padding:12px 12px; border-radius:10px; border:1px solid #cbd5e1; background:#fff; font:inherit;
    }
    label{font-weight:700; font-size:.95rem}

    /* ====== MOBILE MENU (nuevo) ====== */
    .nav__toggle{
      display:none; background:transparent; border:0; color:#fff; padding:8px; margin-left:8px; border-radius:8px;
    }
    .nav__toggle:focus{outline:2px solid #fff; outline-offset:2px}
    .nav__cta--mobile{display:none; text-align: center;}

    @media (max-width:900px){
      .nav__row{gap:10px}
      /* ocultar CTA de cabecera en móvil */
      .nav__row > .btn{display:none}
      .nav__toggle{display:inline-flex; align-items:center; justify-content:center}
      /* el panel se vuelve dropdown */
      .nav__links{
        position:absolute; left:0; right:0; top:100%;
        background:var(--brand2);
        flex-direction:column; align-items:flex-start; gap:0;
        padding:10px 20px 14px;
        border-bottom:1px solid #0b377f;
        display:none; /* cerrado por defecto */
      }
      .nav__links.is-open{display:flex}
      .nav__links a{
        width:100%; padding:10px 0; border-bottom:1px solid rgba(255,255,255,.08);
        font-size:1rem; opacity:1;
      }
      .nav__links a:last-child{border-bottom:0}
      .nav__cta--mobile{display:inline-block; margin-top:6px}
    }

    @media (max-width:980px){
      .footer-grid{grid-template-columns:1fr}
    }