/* ═══════════════════════════════════════
   MOBILE GUILD — Static v1
   Unified glow standard throughout
═══════════════════════════════════════ */
:root {
  --bg: #03050c;
  --bg2: #050810;
  --panel: rgba(255,255,255,.04);
  --line: rgba(255,255,255,.1);
  --text: #f0f4ff;
  --muted: #7a8599;
  --blue: #1840c8;
  --blue2: #2952e0;
  --blue3: #5580f8;
  --blue-glow: rgba(24,64,200,.35);
  --blue-soft: rgba(41,82,224,.12);

  /* ── SINGLE UNIFIED HOVER GLOW ──
     Every hoverable card uses exactly these values */
  --glow-border: rgba(85,128,248,.55);
  --glow-bg: rgba(41,82,224,.12);
  --glow-shadow: 0 0 0 1px rgba(85,128,248,.28), 0 8px 28px rgba(41,82,224,.28), 0 0 52px rgba(41,82,224,.12);
  --glow-lift: translateY(-4px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,'Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{text-decoration:none;color:inherit;cursor:pointer}
button{cursor:pointer;font-family:inherit}
img{max-width:100%;display:block}
::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:#1e3a6e;border-radius:2px}

.page{display:none}.page.active{display:block}
.shell{width:min(1200px,calc(100% - 40px));margin:0 auto}

/* ════ NAV ════ */
nav{height:76px;display:flex;align-items:center;position:sticky;top:0;z-index:100;background:transparent;border-bottom:none}
nav::before{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgba(3,5,12,.85),rgba(3,5,12,0));pointer-events:none;z-index:0}
.nav-inner{display:flex;align-items:center;justify-content:space-between;width:100%;position:relative;z-index:1}
.brand{display:flex;align-items:center;gap:13px}
.brand img.mono{height:44px;width:auto}
.brand img.wm{height:16px;width:auto;opacity:.88}
.nav-links{display:flex;gap:0}
.nav-links a{padding:8px 16px;font-size:14px;font-weight:500;color:var(--muted);transition:color .15s;white-space:nowrap}
.nav-links a:hover{color:var(--text)}
.nav-links a.active{color:var(--blue3);position:relative}
.nav-links a.active::after{content:'';position:absolute;left:16px;right:16px;bottom:-24px;height:2px;background:var(--blue3);border-radius:1px}
.nav-right{display:flex;align-items:center;gap:10px}

/* ── BUTTONS ── */
.btn-ghost{border:1px solid rgba(255,255,255,.15);background:transparent;color:#fff;padding:10px 18px;border-radius:9px;font-size:13.5px;font-weight:600;display:inline-flex;align-items:center;gap:7px;transition:all .2s}
.btn-ghost:hover{border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.06)}
.btn-primary{background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff;border:none;padding:11px 22px;border-radius:9px;font-size:13.5px;font-weight:700;display:inline-flex;align-items:center;gap:7px;box-shadow:0 4px 22px var(--blue-glow);transition:all .2s}
.btn-primary:hover{box-shadow:0 8px 36px rgba(24,64,200,.6);transform:translateY(-1px)}
.btn-outline{border:1.5px solid rgba(255,255,255,.18);background:transparent;color:#fff;padding:12px 22px;border-radius:9px;font-size:14px;font-weight:600;display:inline-flex;align-items:center;gap:7px;transition:all .15s}
.btn-outline:hover{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.04)}

/* LinkedIn button — same glow standard */
.btn-linkedin{
  border:1.5px solid var(--glow-border);
  background:var(--glow-bg);
  color:var(--blue3);padding:10px 18px;border-radius:9px;
  font-size:13.5px;font-weight:700;
  display:inline-flex;align-items:center;gap:7px;
  transition:all .22s;text-decoration:none;
  box-shadow:0 0 14px rgba(85,128,248,.15);
}
.btn-linkedin:hover{
  background:rgba(41,82,224,.22);
  border-color:var(--blue3);color:#fff;
  box-shadow:var(--glow-shadow);
  transform:var(--glow-lift);
}

/* ════ HOME ════ */
#home{background:radial-gradient(ellipse 80% 60% at 72% 42%,rgba(24,64,200,.16),transparent 55%),linear-gradient(180deg,var(--bg),var(--bg2) 60%,#020408 100%)}
.home-bg-layer{position:fixed;inset:0;z-index:0;background:url('../images/network-glow-1.png') center/cover no-repeat;opacity:.1;pointer-events:none}
.home-hero{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;padding:72px 0 40px}
.hero-copy{padding-right:48px}
.loc-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:6px;padding:8px 14px;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#94a3b8;margin-bottom:28px}
.hero-h1{font-size:clamp(48px,5.5vw,74px);font-weight:900;line-height:1.06;letter-spacing:-.03em;margin-bottom:20px}
.hero-h1 .blue{color:var(--blue3)}
.hero-sub{font-size:17px;color:#94a3b8;line-height:1.75;max-width:480px;margin-bottom:32px;font-weight:400}
.hero-btns{display:flex;gap:14px;flex-wrap:wrap}
.hero-btns .btn-primary{padding:14px 28px;font-size:15px}
.hero-visual{position:relative;height:540px;overflow:hidden}
.dubai-clip-wrap{position:absolute;inset:0;right:-60px}
.dubai-clip-wrap img{width:100%;height:100%;object-fit:cover;object-position:center 35%;border-radius:24px}
.dubai-clip-wrap::after{content:'';position:absolute;inset:0;border-radius:24px;background:linear-gradient(to right,var(--bg) 0%,transparent 28%),linear-gradient(to left,rgba(3,5,12,.65) 0%,transparent 28%),linear-gradient(to bottom,rgba(3,5,12,.45) 0%,transparent 20%),linear-gradient(to top,rgba(3,5,12,.65) 0%,transparent 26%)}
.float-card{position:absolute;bottom:32px;right:52px;z-index:5;background:rgba(5,8,22,.78);border:1px solid var(--glow-border);border-radius:14px;padding:18px 22px;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);max-width:260px;box-shadow:var(--glow-shadow)}
.float-card-inner{display:flex;align-items:flex-start;gap:12px}
.float-dot{width:8px;height:8px;border-radius:50%;background:var(--blue3);box-shadow:0 0 10px rgba(85,128,248,.8);flex-shrink:0;margin-top:4px}
.float-card p{font-size:13.5px;line-height:1.5;color:#d4dfff;font-weight:500}
.float-card-tag{display:inline-block;margin-top:10px;font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--blue3);opacity:.8}
.stats-bar{border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.03);display:grid;grid-template-columns:repeat(4,1fr)}
.stat{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:26px 20px;border-right:1px solid var(--line)}
.stat:last-child{border:none}
.stat-icon{width:36px;height:36px;object-fit:contain;margin-bottom:10px;flex-shrink:0}
.stat strong{display:block;font-size:28px;font-weight:900;letter-spacing:-.02em}
.stat p{color:#cbd5e1;font-size:13.5px;margin-top:4px}
.stat small{color:var(--muted);font-size:12px;margin-top:2px;display:block}

/* ════ SHARED ════ */
.eyebrow{color:var(--blue3);font-weight:800;text-transform:uppercase;font-size:13px;letter-spacing:.1em;display:flex;align-items:center;gap:6px;margin-bottom:14px}
.eyebrow::before{content:'●';font-size:6px}
.page-h1{font-size:clamp(40px,5vw,66px);font-weight:900;line-height:1.06;letter-spacing:-.04em;margin-bottom:16px}
.page-h1 .blue{color:var(--blue3)}
.accent-bar{width:44px;height:2px;background:var(--blue2);margin:20px 0;border-radius:1px}
.lead{font-size:16px;color:#94a3b8;line-height:1.8;font-weight:300;margin-bottom:12px}

/* ── UNIVERSAL CARD HOVER GLOW ──
   Applied to every card that glows on hover */
.glow-card{
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--panel);
  transition:border-color .22s, background .22s, transform .22s, box-shadow .22s;
}
.glow-card:hover{
  border-color:var(--glow-border);
  background:var(--glow-bg);
  transform:var(--glow-lift);
  box-shadow:var(--glow-shadow);
}

/* ════ ABOUT ════ */
.about-hero{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;padding:72px 0 40px}
.about-visual{position:relative;height:440px}
.about-photo{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:20px}
.stats-4{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.02);margin:0 0 48px}
.s4{padding:26px 22px;border-right:1px solid var(--line);text-align:center;transition:all .22s}
.s4:last-child{border-right:none}
.s4:hover{background:var(--glow-bg)}
.s4-icon{width:36px;height:36px;object-fit:contain;margin:0 auto 10px;display:block}
.s4-icon img{width:100%;height:100%;object-fit:contain}
.s4 strong{display:block;font-size:24px;font-weight:900;letter-spacing:-.02em}
.s4 p{color:#cbd5e1;font-size:13.5px;margin-top:5px}
.s4 small{color:var(--muted);font-size:11.5px;margin-top:3px;display:block}
.val-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin:20px 0 48px}
.val-card{padding:22px 18px}
.val-icon{width:44px;height:44px;border-radius:50%;background:var(--blue-soft);border:1px solid rgba(41,82,224,.25);display:grid;place-items:center;font-size:18px;margin-bottom:12px}
.val-card h3{font-size:14px;font-weight:700;margin-bottom:6px}
.val-card p{font-size:12.5px;color:var(--muted);line-height:1.65}
.founder-block{display:grid;grid-template-columns:1fr 1fr;gap:36px;border:1px solid var(--line);border-radius:20px;padding:36px;background:radial-gradient(circle at 10% 30%,rgba(24,64,200,.08),transparent 40%),rgba(5,8,16,.86);margin-bottom:36px}
.founder-left{display:grid;grid-template-columns:178px 1fr;gap:24px;align-items:flex-start}
.founder-img{width:178px;height:178px;border-radius:50%;object-fit:cover;object-position:center top;border:2px solid rgba(41,82,224,.35);box-shadow:0 14px 44px rgba(0,0,0,.45)}
.founder-role{color:var(--blue3);text-transform:uppercase;font-size:11px;font-weight:800;letter-spacing:.6px;margin-bottom:5px}
.founder-name{font-size:clamp(20px,2.5vw,26px);font-weight:900;letter-spacing:-.03em;margin-bottom:10px}
.founder-bio{font-size:14px;color:#94a3b8;line-height:1.8;font-weight:300;margin-bottom:14px}
.li-btn{display:inline-flex;align-items:center;gap:7px;background:var(--blue);color:#fff;border:none;padding:9px 18px;border-radius:8px;font-size:13px;font-weight:700;transition:all .2s}
.li-btn:hover{background:var(--blue2);transform:translateY(-1px)}
.quote-col{border-left:1px solid var(--line);padding-left:36px;display:flex;flex-direction:column;justify-content:center}
.q-mark{font-size:54px;color:var(--blue2);line-height:.7;font-family:Georgia,serif;margin-bottom:10px;opacity:.8}
.q-text{font-size:17px;font-weight:600;line-height:1.6;font-style:italic;margin-bottom:12px}
.q-src{color:var(--blue3);font-size:13px;font-weight:600}

/* ════ EVENTS COLLAGE ════ */
.event-collage {
  position: relative;
  width: 100%;
  height: 480px;
  /* Match the page background exactly so it's invisible */
  background: transparent;
  border-radius: 0;
  overflow: visible;
}
.event-collage::before { display: none; }
.event-collage::after  { display: none; }
.collage-web {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  pointer-events: none; z-index: 2;
  overflow: visible;
}



@media(max-width:900px){
  .event-collage { height: 320px; }
  
}

/* ════ EVENTS ════ */
.ev-hero{display:grid;grid-template-columns:.85fr 1.15fr;gap:40px;align-items:center;padding:40px 0 24px;min-height:auto}
.ev-visual{position:relative;height:420px}
.ev-visual img.ev-bg{width:100%;height:100%;object-fit:cover;border-radius:24px}
.ev-stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03);margin-bottom:36px}
.ev-stat{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px 16px;border-right:1px solid var(--line);transition:all .22s}
.ev-stat:last-child{border-right:none}
.ev-stat:hover{background:var(--glow-bg)}
.ev-stat-icon{width:36px;height:36px;object-fit:contain;flex-shrink:0;margin-bottom:10px}
.ev-stat strong{font-size:22px;font-weight:900;display:block;letter-spacing:-.02em}
.ev-stat p{color:#cbd5e1;font-size:13px;margin-top:3px}
.sec-title{font-size:22px;font-weight:800;letter-spacing:-.02em;margin-bottom:16px}
.past-table{border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:36px;background:rgba(255,255,255,.02)}
.past-hd{display:grid;grid-template-columns:150px 1fr 200px;padding:14px 24px;background:rgba(255,255,255,.04);border-bottom:1px solid var(--line)}
.past-hd span{font-size:11.5px;font-weight:700;letter-spacing:.08em;color:var(--muted);text-transform:uppercase}
.past-row{display:grid;grid-template-columns:150px 1fr 200px;padding:14px 24px;border-bottom:1px solid var(--line);align-items:center;transition:background .2s;gap:12px}
.past-row:last-child{border:none}
.past-row:hover{background:rgba(41,82,224,.06)}
.past-date{color:var(--blue3);font-size:14px;font-weight:700}
.past-row-event{display:flex;align-items:center;gap:16px}
.past-thumb{width:160px;height:90px;border-radius:10px;object-fit:cover;object-position:center;border:1px solid var(--line);flex-shrink:0;image-rendering:auto}
.past-name{font-size:15px;font-weight:600}
.past-venue{color:#94a3b8;font-size:13px;display:flex;align-items:center;gap:5px}
.ev-cta{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:22px;border:1px solid var(--line);border-radius:14px;padding:28px 32px;background:rgba(255,255,255,.02);margin-bottom:24px}
.ev-cta-icon{width:64px;height:64px;border-radius:12px;border:1px solid var(--line);background:var(--blue-soft);display:grid;place-items:center;font-size:28px;color:var(--blue3)}
.ev-cta h3{font-size:20px;font-weight:800;margin-bottom:4px;letter-spacing:-.02em}
.ev-cta p{color:#94a3b8;font-size:14px}

/* ════ PARTNERS ════ */
.pt-hero{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;padding:60px 0 40px;}
.globe-wrap{position:relative;height:460px;display:flex;align-items:center;justify-content:center}
.globe-img{width:100%;height:100%;object-fit:cover;border-radius:20px}
.pt-divider{display:flex;align-items:center;gap:16px;margin:32px 0 24px}
.pt-divider span{flex:1;height:1px;background:var(--line)}
.pt-divider p{color:var(--blue3);font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.pt-types{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:24px}
.pt-type-card{padding:28px 22px;text-align:center}
.pt-type-icon{width:56px;height:56px;border-radius:50%;background:var(--blue-soft);border:1px solid rgba(41,82,224,.25);display:grid;place-items:center;font-size:24px;margin:0 auto 14px}
.pt-type-card h3{font-size:17px;font-weight:700;margin-bottom:8px}
.pt-line{width:28px;height:2px;background:var(--blue2);border-radius:1px;margin:8px auto 10px}
.pt-type-card p{font-size:13.5px;color:var(--muted);line-height:1.7}
.pt-cta-bar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:22px;border:1px solid var(--line);border-radius:14px;padding:28px 32px;background:rgba(255,255,255,.02);margin-bottom:24px}
.pt-cta-icon{width:64px;height:64px;border-radius:50%;border:1px solid rgba(41,82,224,.25);background:var(--blue-soft);display:grid;place-items:center;font-size:28px}
.pt-cta-bar h3{font-size:22px;font-weight:800;margin-bottom:5px;letter-spacing:-.02em}
.pt-cta-bar p{color:#94a3b8;font-size:14px}

/* ════ FOOTER ════ */
.footer{margin-top:32px;padding:28px 0;border-top:1px solid var(--line);display:grid;grid-template-columns:280px 140px 200px;gap:48px;align-items:start}
.footer h4{font-size:13px;font-weight:700;margin-bottom:14px;text-transform:uppercase;letter-spacing:.08em;color:var(--text)}
.footer p,.footer a{font-size:13px;color:var(--muted);line-height:1.8;display:block}
.footer a:hover{color:#fff}
.footer h4{font-size:14px;font-weight:700;margin-bottom:10px}
.footer p,.footer a{font-size:13px;color:var(--muted);line-height:1.8;display:block}
.footer a:hover{color:#fff}
.li-link{display:inline-flex;align-items:center;gap:7px;background:var(--glow-bg);border:1px solid var(--glow-border);color:var(--blue3);padding:8px 14px;border-radius:8px;font-size:13px;font-weight:600;transition:all .22s;margin-top:10px}
.li-link:hover{background:rgba(41,82,224,.22);box-shadow:var(--glow-shadow);color:#fff;transform:var(--glow-lift)}
.foot-legal{grid-column:1/-1;display:flex;justify-content:flex-start;border-top:1px solid var(--line);padding-top:16px;margin-top:8px}
.foot-legal span{font-size:12px;color:var(--muted)}

/* ════ RESPONSIVE ════ */
@media(max-width:900px){
  .nav-links{display:none}
  .home-hero,.about-hero,.ev-hero,.pt-hero,.founder-block{grid-template-columns:1fr}
  .hero-visual,.globe-wrap{display:none}
  .stats-bar,.ev-stats,.stats-4{grid-template-columns:1fr 1fr}
  .val-grid,.pt-types{grid-template-columns:1fr 1fr}
  .ev-cta,.pt-cta-bar{grid-template-columns:1fr}
  .footer{grid-template-columns:1fr 1fr}
  .past-hd,.past-row{grid-template-columns:120px 1fr}
  .event-collage{height:320px;border-radius:14px}
  .collage-img{border-radius:10px}
}

/* ════ GLOBAL FIXES ════ */

/* Box sizing everywhere */
*{box-sizing:border-box}

/* Consistent layout — all heroes behave like About */
.home-hero{grid-template-columns:1fr 1fr;gap:40px;padding:72px 0 40px}
.about-hero{grid-template-columns:1fr 1fr;gap:64px;padding:72px 0 40px}
.ev-hero{grid-template-columns:.85fr 1.15fr;gap:40px;padding:40px 0 24px;min-height:auto}
.pt-hero{grid-template-columns:1fr 1fr;gap:44px;padding:60px 0 40px;}

/* Prevent text columns stretching on zoom */
.hero-copy,
.about-hero > div:first-child,
.ev-hero > div:first-child,
.pt-hero > div:first-child{min-width:0;overflow-wrap:break-word}

/* Hero visuals don't overflow */
.hero-visual,.about-visual,.ev-collage,.globe-wrap{min-width:0;width:100%}

/* Float card — translucent, no solid black */
.float-card{
  background:rgba(10,20,50,.42) !important;
  border:1px solid rgba(85,128,248,.42) !important;
  backdrop-filter:blur(20px) !important;
  -webkit-backdrop-filter:blur(20px) !important;
}

/* Founder block — glow on hover */
.founder-block{}

/* Past events table — Event column aligns flush with thumbnail */
.past-hd{display:grid;grid-template-columns:150px 1fr 200px;padding:14px 24px;background:rgba(255,255,255,.04);border-bottom:1px solid var(--line)}
.past-row{display:grid;grid-template-columns:150px 1fr 200px;padding:14px 24px;border-bottom:1px solid var(--line);align-items:center;gap:0}
.past-row-event{display:flex;align-items:center;gap:14px;padding:0}
.past-thumb{width:160px;height:90px;border-radius:10px;object-fit:cover;border:1px solid var(--line);flex-shrink:0}
.past-name{font-size:15px;font-weight:600}

/* Stat icon images — no alt text showing */
.stat-icon,.ev-stat-icon{display:block;font-size:0;line-height:0}
img.stat-icon,img.ev-stat-icon{font-size:0}

/* Collage image hover — bigger pop */
.collage-img:hover{
  border-color:rgba(147,197,253,.95) !important;
  box-shadow:0 20px 60px rgba(0,0,0,.7),0 0 56px rgba(0,130,255,.6) !important;
  z-index:10 !important;
}


.img-2:hover { transform: rotate(5deg) scale(1.08) !important; }
.img-4:hover { transform: rotate(-4deg) scale(1.08) !important; }
.img-5:hover { transform: rotate(4deg) scale(1.08) !important; }

/* ════ EVENTS MOSAIC COLLAGE ════ */
.event-collage {
  position: relative;
  width: 100%;
  height: 500px;
  background: transparent;
  border-radius: 0;
  overflow: visible;
}
.event-collage::before { display: none; }
.event-collage::after  { display: none; }
.collage-web {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  pointer-events: none; z-index: 1;
  overflow: visible;
}

/* Mosaic grid images */
.mosaic-img {
  position: absolute;
  object-fit: cover;
  border-radius: 14px;
  border: 1.5px solid rgba(59,130,246,.55);
  box-shadow: 0 8px 28px rgba(0,0,0,.5), 0 0 18px rgba(0,100,255,.15);
  transition: box-shadow .25s, border-color .25s, transform .25s, z-index 0s;
  z-index: 2;
}
.mosaic-img:hover {
  border-color: rgba(147,197,253,.9);
  box-shadow: 0 12px 36px rgba(0,0,0,.6), 0 0 40px rgba(0,120,255,.45);
  transform: scale(1.04);
  z-index: 10;
}

/* Row 1 — two equal photos, slight overlap at bottom */
.m1 { width: 49%; aspect-ratio: 16/9; top: 0; left: 0; }
.m2 { width: 49%; aspect-ratio: 16/9; top: 0; right: 0; }

/* Row 2 — wide left (60%) + narrow right (38%), overlaps row 1 bottom */
.m3 { width: 60%; aspect-ratio: 16/9; top: 34%; left: 0; }
.m4 { width: 38%; aspect-ratio: 4/3;  top: 32%; right: 0; }

/* Row 3 — narrow left (38%) + wide right (60%), overlaps row 2 bottom */
.m5 { width: 38%; aspect-ratio: 4/3;  bottom: 0; left: 0; }
.m6 { width: 60%; aspect-ratio: 16/9; bottom: 0; right: 0; }

@media(max-width:900px){
  .event-collage { height: 320px; }
  .mosaic-img { border-radius: 8px; }
}