:root{
      --bg:#07090c;
      --ink:#eef3fb;
      --muted:#b2bdd0;
      --faint:#7f8aa0;
      --line:rgba(255,255,255,.10);
      --accent:#f2c700;
      --accent2:#64a0ff;

      --max:1120px;
      --pad: clamp(18px, 3vw, 42px);

      --sans: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
      --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

      --shadow: 0 26px 60px rgba(0,0,0,.45);
      --r: 18px;
    }

    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0;
      font-family:var(--sans);
      background: var(--bg);
      color: var(--ink);
      line-height:1.25;
      letter-spacing:.2px;
      overflow-x:hidden;
    }
    a{color:inherit; text-decoration:none}
    .container{max-width:var(--max); margin:0 auto; padding:0 var(--pad)}
    .full{width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw)}
    .anchor{scroll-margin-top:80px}
    .mono{font-family:var(--mono)}
    .muted{color:var(--muted)}
    .line{border-top:1px solid var(--line)}

    /* Top bar */
    .topbar{
      position:sticky; top:0; z-index:50;
      background: rgba(7,9,12,.76);
      backdrop-filter: blur(12px);
      border-bottom: 1px solid var(--line);
    }
    .topbar .row{
      display:flex; align-items:center; justify-content:space-between; gap:14px;
      padding: 12px var(--pad);
    }
    .brand{
      display:flex;
      align-items:center;
    }
    .brand-link{
      display:flex;
      align-items:center;
    }

    .brand-logo{
      height: 100px;
      width: auto;
      display:block;
    }

    /* opcional: hover sutil */
    .brand-link:hover .brand-logo{
      opacity: .9;
    }    
    .mark{
      width:11px; height:11px; border-radius:999px;
      background:var(--accent);
      box-shadow: 0 0 0 6px rgba(242,199,0,.14);
    }
    .nav{
      display:flex; align-items:center; gap:10px; flex-wrap:wrap;
      color: var(--muted);
      font-family: var(--mono);
      font-size:12px;
    }
    .nav a{
      padding: 8px 10px;
      border-radius: 999px;
      border: 1px solid transparent;
    }
    .nav a:hover{border-color: rgba(242,199,0,.35); color: var(--ink)}
    .lang{
      display:flex; align-items:center; gap:6px;
      padding: 5px;
      border-radius: 999px;
      border: 1px solid var(--line);
      background: rgba(255,255,255,.03);
    }
    .lang button{
      border:0; cursor:pointer;
      padding: 6px 10px;
      border-radius: 999px;
      background: transparent;
      color: var(--muted);
      font-family: var(--mono);
      font-size:12px;
    }
    .lang button[aria-pressed="true"]{
      background: var(--accent);
      color: #111;
      font-weight:950;
    }

    /* Sections */
    section{padding: 92px 0}
    .alt{
      background:
        radial-gradient(1000px 650px at 15% 15%, rgba(242,199,0,.11), transparent 55%),
        radial-gradient(900px 600px at 85% 10%, rgba(100,160,255,.10), transparent 55%),
        linear-gradient(to bottom, rgba(255,255,255,.03), rgba(255,255,255,0));
      border-top: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
    }

    /* Hero */
    .kicker{
      font-family: var(--mono);
      text-transform: uppercase;
      letter-spacing: 1.4px;
      color: var(--muted);
      font-size: 12px;
    }
    .title{
      margin: 14px 0 0;
      font-weight: 1000;
      letter-spacing:.6px;
      text-transform: uppercase;
      font-size: clamp(46px, 7vw, 92px);
      line-height: .98;
    }
    .subtitle{
      margin: 16px 0 0;
      color: var(--muted);
      font-size: clamp(16px, 2.4vw, 22px);
      max-width: 70ch;
      line-height: 1.45;
    }
    .ctaRow{display:flex; gap:12px; flex-wrap:wrap; margin-top:22px}
    .btn{
      display:inline-flex; align-items:center; justify-content:center;
      padding: 12px 16px;
      border-radius: 999px;
      border: 1px solid var(--line);
      background: rgba(255,255,255,.03);
      box-shadow: var(--shadow);
      color: var(--ink);
      font-weight: 900;
      font-size: 14px;
    }
    .btn:hover{border-color: rgba(242,199,0,.35)}
    .btn.primary{
      background: var(--accent);
      color:#111;
      border-color: rgba(242,199,0,.9);
    }
    .note{margin-top:12px; color:rgba(178,189,208,.9); font-size:13.5px}

    /* Billboard sections */
    .billboard{
      min-height: 78vh;
      display:flex;
      align-items:center;
      justify-content:center;
      text-align:center;
      padding: 120px var(--pad);
      position:relative;
      border-top:1px solid var(--line);
      border-bottom:1px solid var(--line);
    }
    .billboard::before{
      content:"";
      position:absolute; inset:-2px;
      background:
        radial-gradient(900px 500px at 20% 20%, rgba(242,199,0,.12), transparent 55%),
        radial-gradient(900px 500px at 80% 40%, rgba(100,160,255,.09), transparent 55%);
      opacity:.9;
      pointer-events:none;
    }
    .billboard > .inner{
      position:relative;
      max-width: min(1050px, 92vw);
    }
    .bill{
      margin:0;
      font-weight: 1000;
      text-transform: uppercase;
      letter-spacing:.6px;
      font-size: clamp(34px, 5.6vw, 84px);
      line-height: 1.20;
    }
    .bill .hl{
      color:#111;
      background: var(--accent);
      padding: .10em .26em;
      border-radius: 12px;
      box-decoration-break: clone;
      -webkit-box-decoration-break: clone;
    }
    .billSub{
      margin: 18px auto 0;
      max-width: 70ch;
      color: var(--muted);
      font-size: clamp(15px, 2vw, 18px);
      line-height: 1.55;
    }

    /* Split: text + side panel */
    .split{
      display:grid;
      grid-template-columns: 1.2fr .8fr;
      gap: 36px;
      align-items:start;
    }
    @media (max-width: 920px){
      .split{grid-template-columns: 1fr}
      .nav{justify-content:flex-start}
    }

    .panel{
      border: 1px solid var(--line);
      border-radius: var(--r);
      background: rgba(255,255,255,.03);
      padding: 18px 18px;
      box-shadow: var(--shadow);
    }
    .panel h3{
      margin:0;
      font-family: var(--mono);
      text-transform:uppercase;
      letter-spacing: 1.2px;
      font-size: 12px;
      color: var(--muted);
    }
    .panel .p{
      margin: 12px 0 0;
      color: var(--ink);
      font-weight: 900;
      font-size: 18px;
      line-height: 1.2;
    }
    .list{
      margin: 14px 0 0;
      padding-left: 18px;
      color: var(--muted);
      line-height: 1.55;
    }
    .list li{margin:10px 0}

    /* Statements */
    .statWrap{
      border: 1px solid var(--line);
      border-radius: calc(var(--r) + 6px);
      background: rgba(255,255,255,.03);
      box-shadow: var(--shadow);
      overflow:hidden;
    }
    .statTop{
      display:flex; align-items:center; justify-content:space-between; gap:10px;
      padding: 14px 16px;
      border-bottom:1px solid var(--line);
      background: rgba(255,255,255,.02);
    }
    .statTop .label{
      font-family: var(--mono);
      text-transform: uppercase;
      letter-spacing: 1.2px;
      font-size: 12px;
      color: var(--muted);
    }
    .statTop .actions{display:flex; gap:10px; flex-wrap:wrap; align-items:center}
    .chip{
      font-family: var(--mono);
      font-size:12px;
      padding: 7px 10px;
      border-radius: 999px;
      border:1px solid var(--line);
      background: rgba(0,0,0,.12);
      color: rgba(238,243,251,.9);
      cursor:pointer;
    }
    .chip:hover{border-color: rgba(242,199,0,.35)}
    .statBody{
      padding: 26px 18px 22px;
      text-align:center;
    }
    .statement{
      margin:0 auto;
      max-width: 60ch;
      font-weight: 1000;
      text-transform: uppercase;
      letter-spacing:.55px;
      font-size: clamp(20px, 3.2vw, 44px);
      line-height: 1.06;
    }
    .statement .hl{
      color:#111;
      background: var(--accent);
      padding: .10em .24em;
      border-radius: 12px;
      box-decoration-break: clone;
      -webkit-box-decoration-break: clone;
    }
    .statHint{
      margin: 16px 0 0;
      color: var(--muted);
      font-size: 14px;
      line-height: 1.55;
    }
    .dots{
      display:flex; justify-content:center; gap:7px;
      padding: 14px 0 18px;
    }
    .dot{
      width:8px; height:8px; border-radius:999px;
      background: rgba(255,255,255,.18);
      border: 1px solid rgba(255,255,255,.14);
    }
    .dot.active{background: var(--accent); border-color: rgba(242,199,0,.8)}

    /* Final split CTA */
    .finalSplit{
      display:grid;
      grid-template-columns: 1fr 1fr;
      min-height: 78vh;
    }
    @media (max-width: 900px){
      .finalSplit{grid-template-columns: 1fr}
    }
    .bigCTA{
      display:flex;
      align-items:center;
      justify-content:center;
      padding: 90px var(--pad);
      text-align:left;
      position:relative;
      border-top:1px solid var(--line);
    }
    .bigCTA:nth-child(1){border-right:1px solid var(--line)}
    @media (max-width: 900px){
      .bigCTA:nth-child(1){border-right:0; border-bottom:1px solid var(--line)}
    }
    .bigCTA.company::before,
    .bigCTA.event::before{
      content:"";
      position:absolute; inset:-2px;
      pointer-events:none;
      opacity:.85;
    }
    .bigCTA.company::before{
      background: radial-gradient(900px 520px at 20% 30%, rgba(242,199,0,.14), transparent 55%);
    }
    .bigCTA.event::before{
      background: radial-gradient(900px 520px at 80% 30%, rgba(100,160,255,.14), transparent 55%);
    }
    .bigCTA .inner{position:relative; max-width: 540px}
    .bigCTA .tag{
      font-family: var(--mono);
      text-transform: uppercase;
      letter-spacing: 1.2px;
      color: var(--muted);
      font-size: 12px;
    }
    .bigCTA .head{
      margin: 10px 0 0;
      font-weight: 1000;
      text-transform: uppercase;
      letter-spacing:.55px;
      font-size: clamp(30px, 4.4vw, 56px);
      line-height: 1.02;
    }
    .bigCTA .desc{
      margin: 14px 0 0;
      color: var(--muted);
      font-size: 16px;
      line-height: 1.6;
      max-width: 60ch;
    }
    .bigCTA .go{
      margin-top: 18px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding: 14px 18px;
      border-radius: 999px;
      border: 1px solid var(--line);
      background: rgba(255,255,255,.03);
      box-shadow: var(--shadow);
      font-weight: 950;
      text-transform: uppercase;
      letter-spacing:.8px;
      font-size: 13px;
    }
    .bigCTA .go:hover{border-color: rgba(242,199,0,.35)}
    .bigCTA.company .go{border-color: rgba(242,199,0,.45)}
    .bigCTA.event .go{border-color: rgba(100,160,255,.45)}

    /* Footer */
    footer{
      border-top: 1px solid var(--line);
      padding: 22px 0 44px;
      color: rgba(178,189,208,.85);
      font-family: var(--mono);
      font-size: 12px;
    }