:root{
    --navy:#0A1A37; --navy-deep:#050E22; --navy-glow:#14315F; --navy-panel:#0C2147;
    --gold:#E7BA53; --gold-champ:#F6E6AC; --gold-deep:#B07F2A;
  }
  html{ scroll-behavior:smooth; }
  body{ background:var(--navy-deep); color:#E8EDF6; font-family:'Outfit',sans-serif; overflow-x:hidden; }
  section{ scroll-margin-top:90px; }

  /* ---- Brand background ---- */
  .bg-brussels{
    background:
      radial-gradient(1200px 700px at 50% -10%, #1c3f73 0%, #0d2147 38%, #07142c 70%, #050e22 100%);
  }
  .bg-veil{ position:relative; }
  .bg-veil::before{
    content:""; position:absolute; inset:0; pointer-events:none;
    background:
      radial-gradient(900px 500px at 85% 0%, rgba(231,186,83,.07), transparent 60%),
      radial-gradient(800px 600px at 0% 100%, rgba(20,49,95,.5), transparent 60%);
  }

  /* ---- Metallic gold type ---- */
  .gold-grad{
    background:linear-gradient(180deg,#FBF0C4 0%,#F2D98C 30%,#E7BA53 55%,#C8932F 100%);
    -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent; color:transparent;
  }
  .gold-hairline{ color:var(--gold); }

  /* ---- Logo lockup ---- */
  .wordmark{ font-family:'Cinzel',serif; line-height:.92; letter-spacing:.01em; }
  .tagline{ font-family:'Outfit',sans-serif; font-weight:300; text-transform:uppercase; color:var(--gold); }
  .lockup-ring{ flex:0 0 auto; }
  .lockup-ring svg{ display:block; }

  /* ---- Eyebrow ---- */
  .eyebrow{ font-weight:500; letter-spacing:.32em; text-transform:uppercase; font-size:.72rem; color:var(--gold); }
  .eyebrow-star{ width:14px; height:14px; display:inline-block; vertical-align:-1px; }

  /* ---- Buttons ---- */
  .btn{ display:inline-flex; align-items:center; gap:.55rem; font-weight:500; letter-spacing:.02em;
    padding:.85rem 1.6rem; border-radius:999px; cursor:pointer; transition:transform .2s ease, box-shadow .3s ease, background .3s ease, color .3s ease, border-color .3s ease; }
  .btn-gold{ background:linear-gradient(180deg,#F2D98C,#E7BA53 55%,#C8932F); color:#1a1206;
    box-shadow:0 10px 30px -10px rgba(231,186,83,.55), inset 0 1px 0 rgba(255,255,255,.4); }
  .btn-gold:hover{ box-shadow:0 16px 40px -10px rgba(231,186,83,.7), inset 0 1px 0 rgba(255,255,255,.5); transform:translateY(-2px); }
  .btn-ghost{ border:1px solid rgba(231,186,83,.45); color:var(--gold); background:rgba(231,186,83,.03); }
  .btn-ghost:hover{ border-color:var(--gold); background:rgba(231,186,83,.1); transform:translateY(-2px); }
  /* cool/neutral outline button — keeps gold for the primary CTA only */
  .btn-outline{ border:1px solid rgba(195,214,247,.32); color:#DCE6F7; background:rgba(255,255,255,.015); }
  .btn-outline:hover{ border-color:rgba(195,214,247,.7); background:rgba(255,255,255,.06); transform:translateY(-2px); }

  /* ---- Logo lockup (real star arc + Cinzel wordmark) ---- */
  /* The wordmark is what gets centred on the page; the star arc hangs to its
     left (absolute, so it doesn't shift the wordmark) and is vertically centred
     on the wordmark line — matching the master artwork. */
  .brand-lockup{ display:inline-block; }
  .brand-text{ position:relative; display:flex; flex-direction:column; align-items:flex-start; line-height:1; }
  /* the arc is placed by JS (positionStars) from real glyph metrics; the slight
     rotation (about the top star) lines the bottom star up under the top one */
  .lockup-stars{ position:absolute; left:0; top:0; width:auto; max-width:none; pointer-events:none;
    transform-origin:84.9% 7.5%; transform:rotate(-5.14deg); }

  /* ---- Hero: Earth photo background (parallax + slow zoom on scroll) ---- */
  #hero{ background:#05101e; }   /* fallback while the photo loads */
  .hero-photo{ position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; will-change:transform; }
  .hero-photo-img{ position:absolute; inset:0; width:100%; height:100%;
    max-width:none; max-height:none; /* override Tailwind base video{max-width:100%} */
    object-fit:cover; object-position:78% 16%; background:#05101e;
    will-change:transform; animation:heroDrift 44s ease-in-out infinite alternate; }
  @keyframes heroDrift{ from{ transform:scale(1.01);} to{ transform:scale(1.05);} }
  /* subtle drifting light over the clouds (no heavy compute) */
  .hero-clouds{ position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.55; mix-blend-mode:screen; will-change:transform;
    background:radial-gradient(42% 32% at 32% 60%, rgba(150,182,232,.10), transparent 70%),
               radial-gradient(30% 22% at 72% 70%, rgba(185,205,245,.08), transparent 72%);
    animation:cloudDrift 70s ease-in-out infinite alternate; }
  @keyframes cloudDrift{ from{ transform:translate3d(0,0,0);} to{ transform:translate3d(3.5%,-2%,0);} }
  /* navy tint for legibility (medium) */
  .hero-tint{ position:absolute; inset:0; z-index:2; pointer-events:none;
    background:
      radial-gradient(120% 82% at 50% 42%, rgba(5,12,28,.74), rgba(5,12,28,.42) 50%, rgba(5,12,28,.16) 74%),
      linear-gradient(180deg, rgba(5,12,28,.62) 0%, rgba(5,12,28,.34) 30%, rgba(5,12,28,.44) 66%, rgba(5,12,28,.80) 100%); }
  /* staggered hero reveal — logo first, then each text block, with a soft blur-in */
  #hero-inner .hero-rise{ opacity:0; transform:translateY(28px) scale(.985); filter:blur(8px); }
  #hero-inner.shown .hero-rise{ animation:heroRise 1.15s cubic-bezier(.16,1,.3,1) both; animation-delay:var(--d,0s); }
  @keyframes heroRise{ to{ opacity:1; transform:translateY(0) scale(1); filter:blur(0); } }
  /* the logo emerges on its own — slower and softer, so it never "pops" */
  #hero-inner #hero-lockup{ transform:scale(.9); filter:blur(16px); }
  #hero-inner.shown #hero-lockup{ animation:logoEmerge 2.2s cubic-bezier(.2,.62,.16,1) both; animation-delay:.12s; }
  @keyframes logoEmerge{ 0%{ opacity:0; transform:scale(.9); filter:blur(16px);} 60%{ filter:blur(0);} 100%{ opacity:1; transform:scale(1); filter:blur(0);} }
  .pe-auto{ pointer-events:auto; }

  /* ---- Why-exhibit: partnership network + interactive spotlight cards ---- */
  .why-net{ position:absolute; inset:0; width:100%; height:100%; z-index:0; pointer-events:none; opacity:.8; }
  .why-card{ position:relative; overflow:hidden;
    transition:transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease, box-shadow .35s ease; }
  .why-card::before{ content:""; position:absolute; inset:0; opacity:0; transition:opacity .35s ease; pointer-events:none;
    background:radial-gradient(340px circle at var(--x,50%) var(--y,50%), rgba(231,186,83,.16), transparent 60%); }
  .why-card:hover{ transform:translateY(-6px); border-color:rgba(231,186,83,.42); box-shadow:0 26px 54px -30px rgba(0,0,0,.85); }
  .why-card:hover::before{ opacity:1; }
  .why-ico{ transition:transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s ease, background .4s ease; }
  .why-card:hover .why-ico{ transform:translateY(-3px) scale(1.07); background:rgba(231,186,83,.18);
    box-shadow:0 0 0 1px rgba(231,186,83,.35), 0 10px 26px -8px rgba(231,186,83,.5); }

  /* ---- Visitors: interactive scroll-driven dot matrix ---- */
  .visit-grid{ position:absolute; inset:0; width:100%; height:100%; z-index:0; pointer-events:none; }

  /* ---- Visitors hero: drifting starfield photo (scroll parallax + two drift layers + dim) ---- */
  .visit-stars-scroll{ position:absolute; left:0; right:0; top:-20%; height:140%; z-index:0; pointer-events:none; will-change:transform; }
  .visit-stars{ position:absolute; inset:0; z-index:0; pointer-events:none;
    background:#050b1a url('starfield.jpg') center/cover no-repeat;
    will-change:transform; animation:starDrift 120s linear infinite alternate; }
  .visit-stars-far{ opacity:.55; mix-blend-mode:screen; animation:starDriftFar 190s linear infinite alternate; }
  .visit-stars-dim{ position:absolute; inset:0; z-index:0; pointer-events:none;
    background:
      linear-gradient(180deg, rgba(5,10,26,.7) 0%, rgba(5,10,26,.5) 42%, rgba(5,10,26,.8) 100%),
      linear-gradient(90deg, rgba(5,10,26,.72) 0%, rgba(5,10,26,.35) 55%, rgba(5,10,26,.12) 100%); }
  @keyframes starDrift{    from{ transform:translate3d(0,0,0) scale(1.06); }  to{ transform:translate3d(-4%,-3%,0) scale(1.14); } }
  @keyframes starDriftFar{ from{ transform:translate3d(0,0,0) scale(1.3); }   to{ transform:translate3d(3.5%,4%,0) scale(1.42); } }

  /* ---- Venue hero: building photo, parallax driven by JS on scroll ---- */
  .venue-hero-bg{ will-change:transform; }

  /* ---- Cool chips (hero) ---- */
  .chip-cool{ border-color:rgba(195,214,247,.20); color:#C7D3EA; background:rgba(255,255,255,.02); }
  .chip-cool svg{ color:#9fb4d6 !important; }

  /* ---- Interactive starfield ---- */
  #starfield{ position:absolute; inset:0; width:100%; height:100%; display:block; pointer-events:none; }

  /* ---- Purpose toggle (contact) ---- */
  .purpose-toggle{ display:inline-flex; padding:4px; border-radius:999px; border:1px solid rgba(231,186,83,.18); background:rgba(8,18,40,.6); gap:4px; }
  .pt-btn{ cursor:pointer; border:none; background:transparent; color:#9fb0cd; font-weight:500; font-size:.86rem; letter-spacing:.02em;
    padding:.5rem 1.15rem; border-radius:999px; transition:color .2s, background .25s; }
  .pt-btn:hover:not(.active){ color:#E7BA53; }
  .pt-btn.active{ color:#1a1206; background:linear-gradient(180deg,#F2D98C,#E7BA53 60%,#D4A53C); box-shadow:inset 0 1px 0 rgba(255,255,255,.4); }

  /* ---- Hairline frame / cards ---- */
  .frame{ border:1px solid rgba(231,186,83,.16); background:linear-gradient(180deg, rgba(22,44,82,.55), rgba(9,21,46,.55)); backdrop-filter:blur(4px); }
  .gilt-divider{ height:1px; background:linear-gradient(90deg, transparent, rgba(231,186,83,.55), transparent); }

  /* ---- Scroll reveal ---- */
  .reveal{ opacity:0; transform:translateY(26px); transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); }
  .reveal.in{ opacity:1; transform:none; }

  /* ---- Stand card ---- */
  .stand{ transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease, border-color .35s ease; }
  .stand:hover{ transform:translateY(-8px); border-color:rgba(231,186,83,.45); box-shadow:0 30px 60px -30px rgba(0,0,0,.8), 0 0 0 1px rgba(231,186,83,.18); }
  .stand-stage{ background:radial-gradient(120% 90% at 50% 30%, #15315c 0%, #0b1d3f 55%, #081634 100%); }

  /* ---- Steps ---- */
  .step-num{ font-family:'Cinzel',serif; }

  /* ---- Form ---- */
  .field{ width:100%; background:rgba(8,18,40,.6); border:1px solid rgba(231,186,83,.18); color:#EAF0FA;
    border-radius:12px; padding:.85rem 1rem; font-size:.95rem; transition:border-color .25s ease, box-shadow .25s ease; }
  .field::placeholder{ color:#7d8aa6; }
  .field:focus{ outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(231,186,83,.15); }
  label.lbl{ font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:#A9B6CF; }

  /* ---- Nav ---- */
  #nav{ transition:background .35s ease, backdrop-filter .35s ease, border-color .35s ease, padding .35s ease; }
  #nav.scrolled{ background:rgba(6,15,34,.82); backdrop-filter:blur(12px); border-color:rgba(231,186,83,.14); }
  .lang-btn{ cursor:pointer; padding:.25rem .5rem; border-radius:7px; font-size:.78rem; font-weight:500; letter-spacing:.05em; color:#9fb0cd; transition:color .2s, background .2s; }
  .lang-btn.active{ color:#1a1206; background:linear-gradient(180deg,#F2D98C,#E7BA53); }
  .lang-btn:hover:not(.active){ color:var(--gold); }
  .navlink{ position:relative; color:#C8D3E8; font-size:.9rem; transition:color .2s; }
  .navlink::after{ content:""; position:absolute; left:0; bottom:-6px; height:1px; width:0; background:var(--gold); transition:width .25s ease; }
  .navlink:hover{ color:#fff; } .navlink:hover::after{ width:100%; }

  .chip{ display:inline-flex; align-items:center; gap:.5rem; border:1px solid rgba(231,186,83,.28); border-radius:999px; padding:.45rem 1rem; font-size:.82rem; color:#E9D9A6; background:rgba(231,186,83,.05); }

  /* nav CTA hidden on small screens (mobile uses hero CTAs + menu) */
  .nav-cta{ display:none; }
  @media (min-width:640px){ .nav-cta{ display:inline-flex; } }

  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    .reveal{ transition:none; opacity:1; transform:none; }
    .stand{ transition:none; }
    .hero-photo-img, .hero-clouds{ animation:none; }
    .visit-stars{ animation:none; }
    .visit-stars-far{ animation:none; transform:scale(1.25); }
    .venue-hero-bg{ animation:none; }
    #hero-inner .hero-rise{ opacity:1; transform:none; filter:none; animation:none; }
    #hero-inner #hero-lockup{ opacity:1; transform:none; filter:none; animation:none; }
  }

  /* ---- Registration form ---- */
  .reg-check{ accent-color:#E7BA53; width:1.05rem; height:1.05rem; flex:0 0 auto; cursor:pointer; }

  /* ---- Venue gallery lightbox ---- */
  .gallery-img{ cursor:zoom-in; }
  .lightbox{ position:fixed; inset:0; z-index:100; display:none; align-items:center; justify-content:center;
    background:rgba(4,9,20,.93); backdrop-filter:blur(6px); padding:4vh 4vw; }
  .lightbox.open{ display:flex; }
  .lb-figure{ margin:0; max-width:92vw; max-height:88vh; display:flex; flex-direction:column; align-items:center; gap:.8rem; }
  .lb-img{ max-width:92vw; max-height:82vh; width:auto; height:auto; object-fit:contain; border-radius:14px;
    border:1px solid rgba(231,186,83,.25); box-shadow:0 30px 80px -20px rgba(0,0,0,.9); background:#0a1c3e; }
  .lb-cap{ color:#C3D0E6; font-size:.9rem; letter-spacing:.02em; text-align:center; }
  .lb-close{ position:absolute; top:16px; right:22px; background:none; border:none; color:var(--gold);
    font-size:2.4rem; line-height:1; cursor:pointer; padding:.1rem .5rem; }
  .lb-close:hover{ color:var(--gold-champ); }
  .lb-nav{ position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px; border-radius:999px;
    display:grid; place-items:center; font-size:1.9rem; line-height:1; cursor:pointer; color:var(--gold);
    background:rgba(8,18,40,.6); border:1px solid rgba(231,186,83,.3); transition:background .2s, border-color .2s; }
  .lb-nav:hover{ background:rgba(231,186,83,.15); border-color:var(--gold); }
  .lb-prev{ left:16px; } .lb-next{ right:16px; }
  @media (max-width:640px){ .lb-nav{ width:40px; height:40px; font-size:1.5rem; } .lb-close{ font-size:2rem; top:12px; right:14px; } }

  /* ---- Exhibitor page: comparison table ---- */
  .cmp-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .cmp-table{ width:100%; min-width:560px; border-collapse:collapse; }
  .cmp-table th, .cmp-table td{ padding:.8rem 1rem; text-align:center; border-bottom:1px solid rgba(231,186,83,.10); }
  .cmp-table thead th{ font-family:'Cinzel',serif; color:#F4EFE3; font-size:1.05rem; padding:1.1rem 1rem .9rem; border-bottom:1px solid rgba(231,186,83,.22); }
  .cmp-table thead th small{ display:block; font-family:'Outfit',sans-serif; font-weight:400; font-size:.72rem; color:var(--gold); letter-spacing:.02em; margin-top:.15rem; }
  .cmp-table th[scope="row"]{ text-align:left; font-weight:400; color:#C2CDE4; font-size:.95rem; }
  .cmp-table tbody tr:hover{ background:rgba(231,186,83,.04); }
  .cmp-val{ color:#EAF0FA; font-weight:500; }
  .cmp-no{ color:#465577; }
  .cmp-pop{ background:rgba(231,186,83,.05); }