/* GamesAdv marketing site v2 — original GamesAdv palette */
@font-face{font-family:"Geist";src:url("fonts/geist.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}

:root{
  --bg:#070A1D;--bg2:#0C1025;--card:#11162C;
  --ink:#F5F4FF;--soft:#C5CBE0;--muted:#A5ADC7;--muted2:#8C93B0;
  --line:#FFFFFF1F;--line2:#FFFFFF14;
  --lav:#BD98FF;--pink:#EE69CB;--pink-soft:#F7B6E4;
  --grad-text:linear-gradient(100deg,#AC7CFF,#EE69CB);
  --grad-btn:linear-gradient(115deg,#952CF4,#733CEF);
  --grad-btn-hover:linear-gradient(115deg,#AA4FFF,#8D5BFA);
  --grad-card:linear-gradient(145deg,#191B35,#10152B);
  --grad-card-purple:linear-gradient(140deg,#23132E,#11162C 65%);
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --r:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--lav)}
a:hover{color:var(--ink)}
h1,h2,h3{margin:0;letter-spacing:-.035em;line-height:1.05;font-weight:800;text-wrap:balance}
p{margin:0}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--bg);padding:10px 14px;border-radius:8px;z-index:10}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--lav);outline-offset:3px}

.wrap{max-width:1240px;margin:0 auto;padding:0 32px}
.narrow{max-width:820px;margin:0 auto;padding:0 32px}
.section{padding:104px 0}
.section-tight{padding:0 0 104px}
.section-alt{background:var(--bg2);border-top:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.section-purple{background:var(--grad-card-purple);border-top:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.stack{display:flex;flex-direction:column;gap:16px}
.stack-lg{display:flex;flex-direction:column;gap:40px}
.row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--lav)}
.eyebrow.pink{color:var(--pink-soft)}
.eyebrow.grey{color:var(--muted)}
.muted{color:var(--muted)}
.muted2{color:var(--muted2)}
.small{font-size:13px;color:var(--muted2)}
.gt{background:var(--grad-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#C599FF}
.h1{font-size:clamp(42px,5.4vw,80px);line-height:1;letter-spacing:-.04em}
.h2{font-size:clamp(34px,4vw,48px)}
.h2-sm{font-size:clamp(30px,3.4vw,40px)}
.h3{font-size:22px;letter-spacing:-.02em;line-height:1.2;font-weight:700}
.lead{font-size:clamp(17px,1.6vw,20px);line-height:1.6;color:var(--muted)}
.lead.soft{color:var(--soft)}
.body{font-size:17px;line-height:1.65;color:var(--muted)}
.mw-560{max-width:560px}.mw-680{max-width:680px}.mw-760{max-width:760px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:14px 24px;border-radius:12px;background:var(--grad-btn);color:#fff;text-decoration:none;font-weight:600;font-size:16px;border:1px solid #B57CFF40;box-shadow:0 9px 30px #7927EB2B;cursor:pointer;font-family:inherit}
.btn:hover{background:var(--grad-btn-hover);color:#fff}
.btn-sm{min-height:44px;padding:10px 18px;font-size:15px;border-radius:10px}
.btn-ghost{display:inline-flex;align-items:center;min-height:50px;padding:14px 24px;border-radius:12px;border:1px solid #FFFFFF33;color:var(--ink);text-decoration:none;font-weight:600;font-size:16px}
.btn-ghost:hover{border-color:#FFFFFF80;color:var(--ink)}
.btn-ghost.sm{min-height:44px;padding:10px 18px;font-size:15px;border-radius:10px}

/* Header / footer */
.site-header{border-bottom:1px solid #FFFFFF18;position:relative;z-index:3;background:var(--bg)}
.header-row{display:flex;align-items:center;gap:28px;padding-top:14px;padding-bottom:14px}
.logo img{height:34px;width:auto}
.nav{display:flex;gap:28px;margin-left:auto}
.nav a{color:var(--ink);text-decoration:none;font-size:15px;font-weight:500;white-space:nowrap}
.nav a:hover,.nav a[aria-current="page"]{color:var(--lav)}
.site-footer{border-top:1px solid var(--line2);padding:36px 0;font-size:14px;color:var(--muted2)}
.footer-row{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.footer-links{display:flex;gap:20px;flex-wrap:wrap}
.footer-links a{color:var(--muted)}

/* Hero */
.hero{position:relative;overflow:hidden;padding:88px 0 104px;background:radial-gradient(ellipse 60% 70% at 78% 40%,#3B1C6A55,transparent 70%),radial-gradient(ellipse 40% 50% at 10% 10%,#23132E,transparent 70%)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:48px;align-items:center}
.pill{display:inline-flex;align-self:flex-start;align-items:center;gap:10px;border:1px solid #FFFFFF26;background:var(--card);border-radius:999px;padding:8px 14px;font-family:var(--mono);font-size:12px;letter-spacing:.12em;color:var(--soft);text-transform:uppercase}
.pill .dot{width:7px;height:7px;border-radius:9px;background:var(--pink)}
.hero-visual{position:relative;height:580px}
.hero-visual .main{position:absolute;right:0;top:0;width:78%;height:460px;border-radius:22px;overflow:hidden;border:1px solid #FFFFFF26;box-shadow:0 30px 80px #00000099}
.hero-visual .main>img.cover{width:100%;height:100%;object-fit:cover}
.hero-visual .main::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#070A1D00 45%,#070A1DCC 100%)}
.hero-visual .main .logo-over{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);width:64%;z-index:1}
.hero-visual .sub{position:absolute;left:0;bottom:0;width:44%;height:260px;border-radius:18px;overflow:hidden;border:1px solid #FFFFFF26;box-shadow:0 24px 60px #000000AA;transform:rotate(-3deg)}
.hero-visual .sub img{width:100%;height:100%;object-fit:cover}

/* Full-bleed case hero */
.case-hero{position:relative;overflow:hidden;min-height:720px;display:flex;align-items:flex-end}
.case-hero .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.case-hero .shade{position:absolute;inset:0;background:linear-gradient(180deg,#070A1D66 0%,#070A1D33 35%,#070A1DF0 82%,#070A1D 100%)}
.case-hero.side .shade{background:linear-gradient(90deg,#070A1DF2 0%,#070A1DCC 38%,#070A1D10 70%),linear-gradient(0deg,#070A1D 0%,#070A1D00 30%)}
.case-hero .rider{position:absolute;right:10%;bottom:0;height:560px;width:auto}
.case-hero .content{position:relative;padding-bottom:64px;width:100%}
.crumb{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--soft);text-transform:uppercase}
.crumb a{color:var(--soft);text-decoration:none}
.case-logo{width:420px;max-width:80%;align-self:flex-start}
.client-logo{height:34px;width:auto;align-self:flex-start}

/* Work cards (home) */
.work-card{position:relative;min-height:560px;border-radius:24px;overflow:hidden;border:1px solid var(--line);display:flex;align-items:flex-end}
.work-card.sr{background:var(--grad-card-purple)}
.work-card.fr{min-height:520px;background:var(--card)}
.work-card .art{position:absolute;top:20px;height:540px;width:auto}
.work-card .art.a{right:26%}
.work-card .art.b{right:-20px}
.work-card .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.work-card .rider{position:absolute;right:12%;bottom:0;height:440px;width:auto}
.work-card .shade{position:absolute;inset:0;background:linear-gradient(90deg,#11162CF5 0%,#11162CCC 38%,#11162C00 70%)}
.work-card.fr .shade{background:linear-gradient(90deg,#070A1DF2 0%,#070A1DB3 40%,#070A1D00 70%)}
.work-card .body{position:relative;padding:48px;max-width:520px;display:flex;flex-direction:column;gap:16px}
.work-card .wordmark{width:320px}
.tag{align-self:flex-start;border-radius:999px;padding:6px 12px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.tag.pink{background:#EE69CB26;border:1px solid #EE69CB66;color:var(--pink-soft)}
.tag.lav{background:#AC7CFF26;border:1px solid #AC7CFF66;color:#D6C1FF}

/* Grids & cards */
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.grid-5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}
.grid-6{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.grid-7{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px;list-style:none;margin:0;padding:0}
.split{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px}
.split.center{align-items:center}.split.end{align-items:end}.split.start{align-items:start}
.card{background:var(--grad-card);border:1px solid #FFFFFF18;border-radius:var(--r);padding:26px;display:flex;flex-direction:column;gap:10px}
.card.flat{background:var(--bg2);border-color:var(--line)}
.card.dark{background:var(--bg);border-color:var(--line)}
.card.purple{background:var(--grad-card-purple);border-color:#EE69CB55}
.card.lav{border-color:#AC7CFF55}
.card .num{font-family:var(--mono);font-size:12px;color:var(--pink)}
.card p{font-size:15px;line-height:1.55;color:var(--muted)}
.tier{padding:30px;border-radius:22px;gap:14px}
.tier .price{margin-top:auto;font-size:20px;font-weight:700}

.steps li{border-top:2px solid #AC7CFF;padding-top:16px;display:flex;flex-direction:column;gap:8px}
.steps li:nth-child(3),.steps li:nth-child(4){border-top-color:#C373E6}
.steps li:nth-child(5),.steps li:nth-child(6){border-top-color:#D96ED8}
.steps li:nth-child(7){border-top-color:var(--pink)}
.steps .n{font-family:var(--mono);font-size:12px;color:var(--muted2)}
.steps strong{font-size:17px}
.steps span:last-child{font-size:14px;line-height:1.45;color:var(--muted)}

.division{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:22px;display:flex;gap:14px;align-items:center}
.division img{width:52px;height:52px;flex:none}
.division strong{display:block;font-size:16px}
.division span{font-size:13px;line-height:1.4;color:var(--muted)}
.logos{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.logos div{background:var(--ink);border-radius:12px;height:76px;display:flex;align-items:center;justify-content:center;padding:8px}
.logos img{height:44px;width:auto}

.demo{display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--ink);font-size:14px;font-weight:600}
.demo img{border-radius:14px;border:1px solid var(--line)}
.demo:hover img{border-color:#AC7CFF99}

.sponsor-box{border-radius:26px;border:1px solid var(--line);background:var(--grad-card-purple);padding:48px}
.court-row{display:flex;gap:14px;justify-content:center}
.court-row img{width:30%;border-radius:14px;border:1px solid #FFFFFF26}
.court-row img:nth-child(2){margin-top:32px}

/* FAQ */
.faq details{border-top:1px solid var(--line);padding:20px 0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{font-size:18px;font-weight:600;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--lav);font-weight:400;font-size:22px;line-height:1}
.faq details[open] summary::after{content:"−"}
.faq p{margin-top:12px;color:var(--muted);line-height:1.6}

/* Contact */
.contact{background:radial-gradient(ellipse 60% 80% at 20% 0%,#3B1C6A55,transparent 70%),var(--bg2);border-top:1px solid var(--line2)}
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;background:var(--bg);border:1px solid var(--line);border-radius:22px;padding:30px}
.field{display:flex;flex-direction:column;gap:8px}
.field.full,.form .full{grid-column:1/-1}
.field label{font-size:13px;font-weight:500;color:var(--soft)}
.field input,.field select,.field textarea{font:inherit;font-size:15px;color:var(--ink);background:var(--bg);border:1px solid #FFFFFF33;border-radius:10px;padding:12px 14px;min-height:48px;width:100%}
.field textarea{resize:vertical;min-height:120px}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--lav);outline:none}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.5;color:var(--muted);cursor:pointer}
.consent input{width:20px;height:20px;margin:1px 0 0;accent-color:#952CF4;flex:none}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-status{font-size:15px;line-height:1.5;min-height:1.5em}
.form-status.ok{color:#9BE7B5}
.form-status.err{color:#FFB4C6}
.form .btn{width:100%}

/* Case pages */
.meta-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0}
.meta-row div{display:flex;flex-direction:column;gap:6px}
.meta-row span:first-child{font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--muted2)}
.stat{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:24px;display:flex;flex-direction:column;gap:6px}
.stat b{font-size:clamp(30px,3vw,42px);font-weight:800;letter-spacing:-.03em;line-height:1.05;white-space:nowrap}
.stat span{font-size:14px;color:var(--muted);line-height:1.4}
.quote-line{font-size:19px;line-height:1.65;border-left:3px solid var(--pink);padding-left:20px}
.cast-art{display:flex;border-radius:20px;overflow:hidden;background:#070A1D80;border:1px solid var(--line)}
.cast-art img{width:50%}
.heroes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.hero-card{background:#070A1DB3;border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:4px}
.hero-card .skill{font-size:13px;color:var(--lav)}
.hero-card .skill.atk{color:var(--pink)}
.hero-card span:last-child{font-size:12px;color:var(--muted);line-height:1.4}
.story-art{width:78%;margin:0 auto;border-radius:22px;border:1px solid #FFFFFF26;box-shadow:0 30px 80px #00000099}
.courts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.courts figure{margin:0;display:flex;flex-direction:column;gap:8px}
.courts img{border-radius:14px;border:1px solid #FFFFFF26}
.courts figcaption{font-size:13px;color:var(--muted)}
.feature-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.feature-list li{display:flex;gap:12px;background:var(--bg2);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.feature-list strong{min-width:140px}
.feature-list span{color:var(--muted)}
.framed{border-radius:22px;border:1px solid #FFFFFF26;box-shadow:0 30px 80px #00000099;width:100%}
.rider-box{display:flex;justify-content:center;background:#070A1D80;border-radius:22px;border:1px solid var(--line);padding:24px 0 0}
.rider-box img{height:420px;width:auto}
.next-case{display:flex;flex-direction:column;border-radius:22px;overflow:hidden;border:1px solid #FFFFFF26;text-decoration:none;color:var(--ink);background:var(--bg2)}
.next-case:hover{border-color:#AC7CFF99;color:var(--ink)}
.next-case-media{height:260px;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 60%,#3B1C6A88,transparent 70%)}
.next-case-media img.cover{width:100%;height:100%;object-fit:cover}
.next-case-media img.mark{width:62%}
.next-case-body{padding:22px 24px;display:flex;justify-content:space-between;align-items:center;font-size:22px}
.next-case-body div{display:flex;flex-direction:column;gap:4px}
.next-case-body .mono{font-size:11px}

/* Brand experiences page */
.compare dl{margin:0;display:grid;grid-template-columns:130px minmax(0,1fr);gap:12px 16px;font-size:15px;line-height:1.5}
.compare dt{color:var(--muted2)}
.compare dd{margin:0}
.compare .big{font-size:30px;font-weight:800;letter-spacing:-.02em}
.stage-list{list-style:none;margin:0;padding:0}
.stage-list li{display:grid;grid-template-columns:64px minmax(0,1fr) minmax(0,1fr);gap:24px;padding:22px 0;border-top:1px solid var(--line);align-items:baseline}
.stage-list li:last-child{border-bottom:1px solid var(--line)}
.stage-list .n{font-family:var(--mono);font-size:13px;color:var(--lav)}
.stage-list .n.pink{color:var(--pink)}
.stage-list .n.grey{color:var(--muted2)}
.stage-list strong{font-size:18px}
.stage-list span:last-child{font-size:14px;color:var(--muted)}
.sprint{border-radius:26px;border:1px solid #AC7CFF55;background:radial-gradient(ellipse 60% 90% at 90% 50%,#3B1C6A66,transparent 70%),var(--grad-card);padding:48px}
.sprint-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.sprint-list li{display:flex;gap:14px;align-items:center;background:#070A1DB3;border:1px solid var(--line);border-radius:14px;padding:18px 20px;font-size:16px}
.sprint-list .num{font-family:var(--mono);font-size:12px;color:var(--pink)}
.proof-card{display:flex;flex-direction:column;border-radius:22px;overflow:hidden;border:1px solid #FFFFFF26;text-decoration:none;color:var(--ink);background:var(--bg2)}
.proof-card:hover{border-color:#AC7CFF99;color:var(--ink)}
.proof-card .media{height:280px;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 60%,#3B1C6A88,transparent 70%)}
.proof-card.sr{background:var(--grad-card-purple)}
.proof-card .media img.cover{width:100%;height:100%;object-fit:cover}
.proof-card .media img.mark{width:66%}
.proof-card .body{padding:22px 26px;display:flex;flex-direction:column;gap:6px}
.proof-card strong{font-size:24px}

@media (max-width:1100px){
  .grid-7{grid-template-columns:repeat(4,minmax(0,1fr))}
  .grid-6{grid-template-columns:repeat(3,minmax(0,1fr))}
  .grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .logos{grid-template-columns:repeat(3,minmax(0,1fr))}
  .courts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .meta-row{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:860px){
  .wrap,.narrow{padding:0 20px}
  .section{padding:72px 0}.section-tight{padding:0 0 72px}
  .header-row{flex-wrap:wrap;gap:12px 20px}
  .header-row .btn{margin-left:auto}
  .nav{order:3;width:100%;margin:0;gap:18px;overflow-x:auto;padding-bottom:2px}
  .nav a{font-size:14px}
  .hero{padding:56px 0 72px}
  .hero-grid,.split,.grid-2,.grid-3{grid-template-columns:minmax(0,1fr)}
  .split{gap:32px}
  .hero-visual{height:420px}
  .hero-visual .main{width:88%;height:320px}
  .hero-visual .sub{width:52%;height:180px}
  .work-card,.work-card.fr{min-height:520px}
  .work-card .body{padding:28px}
  .work-card .art{height:360px;top:12px}
  .work-card .art.a{right:30%}
  .work-card .shade,.work-card.fr .shade{background:linear-gradient(0deg,#0B0E22F5 0%,#0B0E22D9 48%,#0B0E2200 85%)}
  .work-card .rider{height:300px}
  .work-card .wordmark{width:240px}
  .grid-7,.grid-4,.meta-row,.heroes{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid-5{grid-template-columns:minmax(0,1fr)}
  .sponsor-box,.sprint{padding:28px}
  .case-hero{min-height:620px}
  .case-hero .rider{height:360px;right:0;opacity:.55}
  .stage-list li{grid-template-columns:44px minmax(0,1fr)}
  .stage-list span:last-child{grid-column:2}
  .compare dl{grid-template-columns:110px minmax(0,1fr)}
  .form{grid-template-columns:minmax(0,1fr);padding:22px}
  .story-art{width:100%}
  .rider-box img{height:300px}
  .feature-list li{flex-direction:column;gap:4px}
}
@media (max-width:520px){
  .grid-6,.logos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid-7,.grid-4,.heroes,.courts{grid-template-columns:minmax(0,1fr)}
  .meta-row{grid-template-columns:minmax(0,1fr)}
  .stat b{font-size:36px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
