/*
Theme Name: WeoAds
Theme URI: https://weoads.com
Author: WeoAds
Author URI: https://weoads.com
Description: Custom WordPress theme for WeoAds — performance marketing for advertisers and publishers.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: weoads
*/

:root{
  --bg: #060915;
  --bg-panel: #0c1226;
  --bg-panel-2: #10182f;
  --line: rgba(148,163,184,0.14);
  --text: #f5f7fb;
  --muted: #93a0bd;
  --purple: #7c5cff;
  --purple-2: #5b3df0;
  --cyan: #29e0d6;
  --mint: #3ee29a;
  --grad: linear-gradient(90deg, var(--purple) 0%, var(--cyan) 100%);
  --radius: 16px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background: var(--bg);
  color: var(--text);
  font-family: 'Inter', sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
h1,h2,h3,.display{ font-family:'Sora', sans-serif; }
.mono{ font-family:'JetBrains Mono', monospace; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
img{ max-width:100%; display:block; }
.wrap{ max-width:1320px; margin:0 auto; padding:0 32px; }
@media (max-width:900px){ .wrap{ padding:0 20px; } }

a:focus-visible, button:focus-visible{ outline:2px solid var(--cyan); outline-offset:3px; border-radius:6px; }
@media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; } }

/* ---------- Topbar ---------- */
.topbar{ background: #05070f; border-bottom: 1px solid var(--line); font-size: 13px; color: var(--muted); }
.topbar .wrap{ display:flex; align-items:center; justify-content:space-between; height:40px; }
.topbar-left{ display:flex; align-items:center; gap:8px; }
.topbar-left .dot{ width:6px; height:6px; border-radius:50%; background:var(--grad); flex:none; }
.topbar-right{ display:flex; align-items:center; gap:22px; }
.topbar-right a{ color:var(--muted); }
.topbar-right a:hover{ color:var(--text); }
@media (max-width:760px){ .topbar-left span{ display:none; } }

/* ---------- Header / Nav ---------- */
header.site{ position: sticky; top:0; z-index:50; background: rgba(6,9,21,0.85); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.nav-row{ display:flex; align-items:center; justify-content:space-between; height:82px; gap:24px; }
.logo{ display:flex; align-items:center; gap:10px; font-family:'Sora'; font-weight:800; font-size:22px; letter-spacing:-0.5px; flex:none; }
.logo .mark{ width:34px; height:34px; border-radius:9px; background: var(--grad); display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:800; color:#fff; }
.logo .o-hi{ background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }

nav.primary{ display:flex; align-items:center; gap:4px; }
nav.primary > ul{ display:flex; align-items:center; gap:2px; }
.nav-item{ position:relative; }
.nav-item > a, .nav-item > button{ display:flex; align-items:center; gap:6px; background:none; border:none; color:var(--text); cursor:pointer; font-size:15px; font-weight:500; padding:10px 14px; border-radius:8px; font-family:'Inter'; }
.nav-item > a:hover, .nav-item > button:hover{ background:rgba(255,255,255,0.05); }
.nav-item .chev{ transition: transform .18s ease; opacity:.7; }
.nav-item.open .chev{ transform: rotate(180deg); }
.nav-item.active > a{ position:relative; }
.nav-item.active > a::after{ content:''; position:absolute; left:14px; right:14px; bottom:2px; height:2px; border-radius:2px; background:var(--grad); }

.header-actions{ display:flex; align-items:center; gap:18px; flex:none; }
.btn{ display:inline-flex; align-items:center; gap:8px; padding:12px 20px; border-radius:10px; font-weight:600; font-size:14.5px; border:1px solid transparent; cursor:pointer; white-space:nowrap; }
.btn-grad{ background:var(--grad); color:#fff; box-shadow:0 8px 24px -8px rgba(124,92,255,0.6); }
.btn-grad:hover{ filter:brightness(1.08); }
.btn-outline{ background:transparent; border-color: rgba(245,247,251,0.25); color:var(--text); }
.btn-outline:hover{ border-color: var(--text); }
.burger{ display:none; background:none; border:none; color:var(--text); cursor:pointer; font-size:20px; }

/* Mega menu */
.mega{ position:absolute; top:calc(100% + 10px); left:50%; transform:translateX(-50%) translateY(6px); width:640px; background: var(--bg-panel-2); border:1px solid var(--line); border-radius:14px; padding:22px; display:none; grid-template-columns: 1.1fr 1fr 1fr; gap:0; box-shadow: 0 24px 60px -20px rgba(0,0,0,0.6); opacity:0; pointer-events:none; transition:opacity .16s ease, transform .16s ease; }
.nav-item.open .mega{ display:grid; opacity:1; transform:translateX(-50%) translateY(0); pointer-events:auto; }
.mega-col h4{ font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); margin-bottom:12px; font-weight:600; }
.mega-col a{ display:flex; align-items:flex-start; gap:10px; padding:9px 10px; border-radius:8px; margin:0 -10px 2px; }
.mega-col a:hover{ background: rgba(255,255,255,0.05); }
.mega-ic{ width:30px; height:30px; border-radius:8px; flex:none; display:flex; align-items:center; justify-content:center; background: rgba(124,92,255,0.14); color:var(--cyan); font-size:15px; }
.mega-col a .label{ font-size:14px; font-weight:600; display:block; }
.mega-col a .desc{ font-size:12px; color:var(--muted); display:block; margin-top:1px; }
.mega-feature{ grid-column:3; background:linear-gradient(160deg, rgba(124,92,255,0.16), rgba(41,224,214,0.08)); border:1px solid var(--line); border-radius:12px; padding:16px; display:flex; flex-direction:column; justify-content:space-between; }
.mega-feature .tag{ font-size:11px; color:var(--cyan); font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.mega-feature h5{ font-size:15px; margin:8px 0 4px; font-family:'Sora'; }
.mega-feature p{ font-size:12.5px; color:var(--muted); line-height:1.5; }
.mega-feature .go{ margin-top:14px; font-size:13px; font-weight:600; color:var(--text); display:inline-flex; gap:6px; align-items:center; }

@media (max-width:1100px){ nav.primary{ display:none; } .burger{ display:block; } .header-actions .btn-outline{ display:none; } }

/* ---------- Hero ---------- */
.hero{ position:relative; padding:88px 0 70px; overflow:hidden; }
.hero-bg{ position:absolute; inset:0; z-index:0; pointer-events:none; background: radial-gradient(600px 400px at 82% 18%, rgba(124,92,255,0.20), transparent 60%), radial-gradient(500px 400px at 100% 60%, rgba(41,224,214,0.14), transparent 60%); }
.hero-grid{ position:relative; z-index:1; display:grid; grid-template-columns: 1fr 1fr; gap:40px; align-items:center; }
@media (max-width:980px){ .hero-grid{ grid-template-columns:1fr; } }

.eyebrow{ display:inline-flex; align-items:center; gap:8px; padding:8px 16px; border-radius:999px; background:rgba(124,92,255,0.12); border:1px solid rgba(124,92,255,0.35); font-size:13px; font-weight:600; margin-bottom:26px; color:#c9c1ff; }
.eyebrow .bolt{ color:var(--cyan); }
h1.headline{ font-size:56px; line-height:1.05; font-weight:800; letter-spacing:-1.4px; }
h1.headline .grad{ background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
@media (max-width:600px){ h1.headline{ font-size:38px; } }

.sub{ color:var(--muted); font-size:17px; line-height:1.65; max-width:520px; margin:22px 0 34px; }
.cta-row{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:28px; }
.btn-lg{ padding:15px 26px; font-size:15px; border-radius:12px; }

.trust-checks{ display:flex; gap:26px; flex-wrap:wrap; font-size:14px; color:#cbd3e6; }
.trust-checks li{ display:flex; align-items:center; gap:8px; }
.trust-checks .ck{ width:18px; height:18px; border-radius:50%; border:1.5px solid var(--cyan); color:var(--cyan); display:flex; align-items:center; justify-content:center; font-size:11px; flex:none; }

/* Hero visual */
.hero-visual{ position:relative; height:520px; display:flex; align-items:center; justify-content:center; }
.orbit-scene{ position:relative; width:440px; height:440px; }
.globe{ position:absolute; inset:40px; border-radius:50%; background: radial-gradient(circle at 32% 28%, rgba(124,92,255,0.55), rgba(10,14,30,0.9) 62%), #0b1230; box-shadow: inset 0 0 60px rgba(41,224,214,0.25), 0 0 90px -20px rgba(124,92,255,0.6); overflow:hidden; }
.globe::before{ content:''; position:absolute; inset:0; background-image: radial-gradient(rgba(148,163,255,0.5) 1px, transparent 1.4px); background-size: 14px 14px; mask-image: radial-gradient(circle, black 60%, transparent 78%); animation: spin 26s linear infinite; }
.ring{ position:absolute; inset:-10px; border-radius:50%; border:1.5px solid rgba(124,92,255,0.45); transform: rotate(-18deg) scaleY(0.42); }
.ring.two{ inset:14px; border-color: rgba(41,224,214,0.35); transform:rotate(-18deg) scaleY(0.42) scale(1.16); }
@keyframes spin{ to{ background-position: 140px 0; } }

.rocket{ position:absolute; top:8%; right:6%; width:120px; z-index:3; filter: drop-shadow(0 12px 24px rgba(41,224,214,0.35)); animation: float 5s ease-in-out infinite; }
@keyframes float{ 0%,100%{ transform: translateY(0) rotate(28deg);} 50%{ transform: translateY(-14px) rotate(28deg);} }

.stat-card{ position:absolute; background: rgba(12,18,38,0.85); backdrop-filter: blur(8px); border:1px solid var(--line); border-radius:14px; padding:14px 16px; min-width:150px; box-shadow: 0 20px 40px -18px rgba(0,0,0,0.65); }
.stat-card .lbl{ font-size:12px; color:var(--muted); margin-bottom:6px; }
.stat-card .val{ font-size:22px; font-weight:700; font-family:'JetBrains Mono'; }
.stat-card .val.mint{ color: var(--mint); }
.stat-card .val.cyan{ color: var(--cyan); }
.sc-1{ top:2%; left:-6%; } .sc-2{ top:36%; right:-12%; } .sc-3{ bottom:20%; left:-10%; } .sc-4{ bottom:0%; right:-4%; }
@media (max-width:980px){ .hero-visual{ height:400px; } .orbit-scene{ width:320px; height:320px; } .rocket{ width:90px; } .stat-card{ min-width:120px; padding:10px 12px;} .stat-card .val{ font-size:17px; } }
@media (max-width:640px){ .stat-card{ display:none; } }

/* ---------- Trust bar ---------- */
.trust-bar{ padding:44px 0; border-top:1px solid var(--line); }
.trust-bar .kicker{ text-align:center; color:var(--muted); font-size:14px; margin-bottom:28px; }
.trust-bar .kicker strong{ color:var(--text); }
.logo-row{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:32px; opacity:.75; }
.logo-row span{ font-family:'Sora'; font-weight:700; font-size:19px; color:#cfd6ea; }

/* ---------- Stat strip ---------- */
.stat-strip{ padding:8px 0 90px; }
.strip-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:18px; }
@media (max-width:980px){ .strip-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .strip-grid{ grid-template-columns:1fr; } }
.strip-card{ background: var(--bg-panel); border:1px solid var(--line); border-radius:14px; padding:22px; display:flex; gap:14px; align-items:flex-start; transition: transform .15s ease, border-color .15s ease; }
.strip-card:hover{ transform: translateY(-3px); border-color: rgba(124,92,255,0.4); }
.strip-ic{ width:46px; height:46px; border-radius:11px; display:flex; align-items:center; justify-content:center; font-size:20px; flex:none; }
.strip-ic.p1{ background:linear-gradient(135deg,#7c5cff,#5b3df0); }
.strip-ic.p2{ background:linear-gradient(135deg,#2d6bff,#2942c9); }
.strip-ic.p3{ background:linear-gradient(135deg,#29e0d6,#1aa89f); }
.strip-ic.p4{ background:linear-gradient(135deg,#8a5cff,#5b3df0); }
.strip-ic.p5{ background:linear-gradient(135deg,#2d6bff,#1c4fd6); }
.strip-card .num{ font-family:'Sora'; font-weight:800; font-size:22px; }
.strip-card .lbl1{ font-size:14px; color:#dbe1f1; margin-top:2px; }
.strip-card .lbl2{ font-size:12.5px; color:var(--muted); }

/* ---------- Section shared ---------- */
section.pad{ padding:96px 0; }
.sec-head{ text-align:center; max-width:640px; margin:0 auto 56px; }
.sec-eyebrow{ color:var(--cyan); font-weight:700; font-size:13px; letter-spacing:.08em; text-transform:uppercase; margin-bottom:14px; }
.sec-head h2{ font-size:36px; font-weight:800; letter-spacing:-0.8px; margin-bottom:14px; }
.sec-head p{ color:var(--muted); font-size:16px; line-height:1.6; }

/* Services */
.services-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
@media (max-width:900px){ .services-grid{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .services-grid{ grid-template-columns:1fr;} }
.svc-card{ background:var(--bg-panel); border:1px solid var(--line); border-radius:16px; padding:26px; }
.svc-card .ic{ width:44px; height:44px; border-radius:12px; background:rgba(124,92,255,0.15); color:var(--cyan); display:flex; align-items:center; justify-content:center; font-size:20px; margin-bottom:18px; }
.svc-card h3{ font-size:17px; margin-bottom:8px; }
.svc-card p{ color:var(--muted); font-size:14px; line-height:1.6; }

/* Ad formats */
.formats{ background:var(--bg-panel); border-radius:24px; padding:56px; border:1px solid var(--line); }
@media (max-width:700px){ .formats{ padding:32px 22px; } }
.format-pills{ display:flex; flex-wrap:wrap; gap:10px; margin:26px 0 34px; }
.pill{ padding:9px 16px; border-radius:999px; background:rgba(255,255,255,0.05); border:1px solid var(--line); font-size:13.5px; font-weight:500; }
.pill.on{ background:var(--grad); border-color:transparent; color:#fff; font-weight:600; }
.format-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:36px; }
@media (max-width:800px){ .format-3{ grid-template-columns:1fr; } }
.format-3 .f-ic{ font-size:22px; margin-bottom:10px; }
.format-3 h4{ font-size:15.5px; margin-bottom:6px; }
.format-3 p{ font-size:13.5px; color:var(--muted); line-height:1.6; }

/* FAQ */
.faq-item{ border-bottom:1px solid var(--line); }
.faq-item summary{ cursor:pointer; list-style:none; padding:20px 4px; display:flex; align-items:center; justify-content:space-between; font-weight:600; font-size:15.5px; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary .plus{ color:var(--cyan); font-size:20px; transition:transform .2s ease; }
.faq-item[open] summary .plus{ transform:rotate(45deg); }
.faq-item p{ color:var(--muted); font-size:14.5px; line-height:1.65; padding:0 4px 20px; max-width:760px; }
.faq-wrap{ max-width:800px; margin:0 auto; }

/* CTA band */
.cta-band{ background:linear-gradient(120deg, rgba(124,92,255,0.18), rgba(41,224,214,0.10)); border:1px solid var(--line); border-radius:24px; padding:64px 40px; text-align:center; }
.cta-band h2{ font-size:30px; margin-bottom:14px; }
.cta-band p{ color:var(--muted); margin-bottom:28px; }

/* Footer */
footer{ border-top:1px solid var(--line); padding:70px 0 30px; }
.foot-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; margin-bottom:50px; }
@media (max-width:800px){ .foot-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .foot-grid{ grid-template-columns:1fr; } }
footer h4{ font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin-bottom:18px; }
footer ul li{ margin-bottom:11px; }
footer ul a{ color:#cbd3e6; font-size:14.5px; }
footer ul a:hover{ color:var(--cyan); }
footer p.desc{ color:var(--muted); font-size:14px; max-width:280px; margin-top:14px; line-height:1.6; }
.foot-bottom{ display:flex; justify-content:space-between; align-items:center; padding-top:26px; border-top:1px solid var(--line); color:var(--muted); font-size:13px; flex-wrap:wrap; gap:12px; }
.social{ display:flex; gap:12px; }
.social a{ width:34px; height:34px; border-radius:9px; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; }
.social a:hover{ border-color:var(--cyan); color:var(--cyan); }
