:root {
  --bg: #07090f;
  --bg-soft: #0d111a;
  --panel: rgba(17, 22, 34, 0.78);
  --panel-strong: #111723;
  --border: rgba(255, 255, 255, 0.08);
  --text: #f7f9ff;
  --muted: #9da7ba;
  --accent: #7357ff;
  --accent-2: #4c8dff;
  --accent-soft: rgba(115, 87, 255, 0.16);
  --success: #6df2a7;
  --shadow: 0 24px 70px rgba(0, 0, 0, 0.34);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: 'Inter', sans-serif;
  color: var(--text);
  background:
    radial-gradient(circle at top, rgba(65, 75, 120, 0.12), transparent 36%),
    var(--bg);
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
.container { width: min(1160px, calc(100% - 40px)); margin: 0 auto; }
.section-pad { padding: 110px 0; position: relative; }

.page-glow { position: fixed; width: 420px; height: 420px; border-radius: 50%; filter: blur(110px); opacity: .17; pointer-events: none; z-index: -2; }
.glow-one { background: #6f50ff; top: 8%; right: -180px; }
.glow-two { background: #276bff; left: -220px; top: 55%; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  border-bottom: 1px solid transparent;
  transition: .25s ease;
}
.site-header.scrolled {
  background: rgba(7, 9, 15, .84);
  backdrop-filter: blur(20px);
  border-color: var(--border);
}
.nav-wrap { height: 78px; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: 12px; }
.brand-mark {
  width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px;
  font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 22px;
  background: linear-gradient(135deg, var(--accent), var(--accent-2)); box-shadow: 0 10px 30px rgba(88, 80, 255, .28);
}
.brand-copy { display: flex; flex-direction: column; line-height: 1.05; }
.brand-copy strong { font-family: 'Space Grotesk', sans-serif; letter-spacing: .05em; }
.brand-copy span { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .12em; margin-top: 4px; }
.main-nav { display: flex; align-items: center; gap: 30px; }
.main-nav a { font-size: 14px; color: #c9d0dd; transition: .2s; }
.main-nav a:hover { color: #fff; }
.nav-cta { padding: 11px 16px; border: 1px solid var(--border); border-radius: 10px; background: rgba(255,255,255,.035); }
.menu-toggle { display: none; border: 0; background: transparent; padding: 8px; cursor: pointer; }
.menu-toggle span { display: block; width: 24px; height: 2px; background: #fff; margin: 5px 0; border-radius: 10px; }

.hero { padding-top: 96px; min-height: 760px; display: flex; align-items: center; }
.hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 70px; align-items: center; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; color: #bcb4ff; text-transform: uppercase; letter-spacing: .14em; font-weight: 700; font-size: 12px; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--success); box-shadow: 0 0 16px var(--success); }
h1,h2,h3 { font-family: 'Space Grotesk', sans-serif; margin-top: 0; }
.hero h1 { font-size: clamp(52px, 6.5vw, 86px); line-height: .97; letter-spacing: -.055em; margin: 24px 0; }
.hero h1 span { background: linear-gradient(90deg, #a58cff, #69a7ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero-text { color: var(--muted); font-size: 18px; line-height: 1.75; max-width: 670px; }
.hero-actions { display: flex; gap: 14px; margin-top: 34px; }
.btn { display: inline-flex; justify-content: center; align-items: center; min-height: 48px; padding: 0 20px; border-radius: 12px; font-weight: 700; font-size: 14px; border: 1px solid transparent; cursor: pointer; transition: .22s ease; }
.btn-primary { color: white; background: linear-gradient(135deg, var(--accent), #5677ff); box-shadow: 0 14px 36px rgba(86, 87, 255, .24); }
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 18px 42px rgba(86, 87, 255, .35); }
.btn-secondary { border-color: var(--border); background: rgba(255,255,255,.035); color: #dfe4ef; }
.btn-secondary:hover { background: rgba(255,255,255,.065); transform: translateY(-2px); }
.hero-stats { display: flex; gap: 36px; margin-top: 45px; flex-wrap: wrap; }
.hero-stats div { display: flex; flex-direction: column; gap: 4px; }
.hero-stats strong { font-size: 17px; }
.hero-stats span { color: var(--muted); font-size: 12px; }

.hero-panel { position: relative; min-height: 490px; border: 1px solid var(--border); border-radius: 24px; background: linear-gradient(150deg, rgba(25,31,49,.93), rgba(11,14,23,.9)); box-shadow: var(--shadow); overflow: visible; }
.window-bar { height: 56px; display: flex; align-items: center; padding: 0 18px; gap: 7px; border-bottom: 1px solid var(--border); }
.window-bar > span { width: 9px; height: 9px; border-radius: 50%; background: #596072; }
.window-bar small { margin-left: 10px; color: #6e778c; font-size: 11px; }
.code-card { padding: 34px 28px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 14px; line-height: 2.05; color: #dbe4f1; }
.line-no { width: 34px; display: inline-block; color: #4f596d; user-select: none; }
.code-purple { color: #ba88ff; } .code-blue { color: #73a8ff; } .code-green { color: #76e6aa; }
.terminal-line { margin-top: 24px; padding: 13px 15px; border-radius: 11px; background: #090d14; border: 1px solid rgba(255,255,255,.05); color: #9eabc0; }
.terminal-line > span:first-child { color: #7e65ff; margin-right: 8px; }
.typing-dots { animation: pulseText 1.1s infinite; }
@keyframes pulseText { 0%,100%{opacity:.25} 50%{opacity:1} }
.mini-card { position: absolute; display: flex; align-items: center; gap: 11px; padding: 13px 15px; border: 1px solid rgba(255,255,255,.09); border-radius: 14px; background: rgba(15,19,30,.94); box-shadow: 0 20px 45px rgba(0,0,0,.3); backdrop-filter: blur(14px); }
.mini-card-one { left: -28px; bottom: 58px; }
.mini-card-two { right: -26px; top: 116px; }
.mini-icon { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: var(--accent-soft); color: #aa9cff; }
.mini-card div { display:flex; flex-direction:column; gap:3px; }
.mini-card strong { font-size: 13px; } .mini-card small { color: var(--muted); font-size: 10px; }

.trust-strip { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: rgba(255,255,255,.018); }
.trust-inner { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 24px; overflow-x:auto; }
.trust-inner span { color: #7f899d; font-weight: 700; white-space: nowrap; font-size: 13px; letter-spacing: .04em; }

.section-heading { max-width: 720px; margin-bottom: 48px; }
.section-heading h2, .about-card h2, .contact-copy h2 { font-size: clamp(38px, 5vw, 62px); line-height: 1.05; letter-spacing: -.04em; margin: 14px 0 18px; }
.section-heading p, .about-card p, .contact-copy p { color: var(--muted); line-height: 1.75; font-size: 16px; }
.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.service-card { padding: 26px; border: 1px solid var(--border); border-radius: 18px; background: linear-gradient(150deg, rgba(255,255,255,.035), rgba(255,255,255,.014)); transition: .25s ease; }
.service-card:hover { transform: translateY(-5px); border-color: rgba(133,113,255,.35); background: linear-gradient(150deg, rgba(115,87,255,.08), rgba(255,255,255,.018)); }
.service-icon { width: 40px; height: 40px; display:grid; place-items:center; border-radius: 12px; background: var(--accent-soft); color:#b5a8ff; font-size:12px; font-weight:800; margin-bottom:26px; }
.service-card h3 { font-size: 20px; margin-bottom: 12px; }
.service-card p { color: var(--muted); line-height: 1.7; font-size: 14px; min-height: 96px; }
.service-card > span { color: #707b91; text-transform: uppercase; letter-spacing: .08em; font-size: 10px; font-weight: 700; }

.projects-section { background: linear-gradient(180deg, transparent, rgba(255,255,255,.018), transparent); }
.project-grid { display:grid; grid-template-columns: 1.2fr .8fr; gap: 18px; }
.project-card { border:1px solid var(--border); border-radius:20px; background:rgba(255,255,255,.02); overflow:hidden; }
.project-large { grid-row: span 2; }
.project-visual { min-height: 250px; background: linear-gradient(140deg,#111723,#0a0d14); position:relative; overflow:hidden; }
.project-large .project-visual { min-height: 420px; }
.project-copy { padding:24px; }
.project-copy > span { color:#9b8cff; text-transform:uppercase; font-size:10px; letter-spacing:.12em; font-weight:800; }
.project-copy h3 { font-size:24px; margin:9px 0; }
.project-copy p { color:var(--muted); font-size:14px; line-height:1.65; margin-bottom:0; }
.dashboard-visual { display:flex; padding:28px; gap:18px; }
.dash-sidebar { width:70px; border:1px solid var(--border); border-radius:14px; background:#0d121b; padding:18px 14px; }
.dash-sidebar span { display:block; height:10px; border-radius:10px; background:#2c3444; margin-bottom:18px; }
.dash-main { flex:1; }
.dash-top { height:42px; border-radius:12px; background:#141b29; border:1px solid var(--border); margin-bottom:16px; }
.dash-row { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.dash-row i { height:82px; border-radius:12px; background:linear-gradient(135deg,rgba(112,83,255,.26),#131a27); border:1px solid rgba(255,255,255,.05); }
.dash-chart { height:180px; margin-top:14px; border-radius:14px; border:1px solid var(--border); background: repeating-linear-gradient(0deg,transparent,transparent 35px,rgba(255,255,255,.035) 36px), linear-gradient(145deg,#111827,#0d121b); position:relative; }
.dash-chart:after { content:""; position:absolute; inset:35% 6% 15% 6%; border-bottom:3px solid #7460ff; border-radius:50%; transform:skewY(-8deg); opacity:.8; }
.dispatch-visual { min-height:210px; }
.map-grid { position:absolute; inset:0; background-image: linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px); background-size:28px 28px; transform:rotate(-8deg) scale(1.2); }
.pulse { position:absolute; width:14px; height:14px; border-radius:50%; background:#725cff; box-shadow:0 0 0 7px rgba(114,92,255,.12),0 0 30px rgba(114,92,255,.8); }
.p1{left:22%;top:38%}.p2{left:58%;top:54%}.p3{right:14%;top:23%}
.ui-visual { display:grid; place-items:center; min-height:210px; }
.phone-shell { width:122px; height:186px; border:1px solid rgba(255,255,255,.12); border-radius:20px; background:#0c111a; padding:12px; box-shadow:0 22px 45px rgba(0,0,0,.35); transform:rotate(5deg); }
.phone-top{height:8px;width:38px;margin:0 auto 14px;border-radius:10px;background:#293244}.phone-card{height:60px;border-radius:10px;background:linear-gradient(135deg,rgba(115,87,255,.4),#1a2231);margin-bottom:8px}.phone-card.small{height:38px;background:#151d2a}.phone-buttons{display:flex;gap:7px}.phone-buttons i{height:24px;flex:1;border-radius:8px;background:#1b2434}

.process-wrap { max-width: 940px; }
.timeline { border-left: 1px solid rgba(255,255,255,.1); margin-left: 18px; }
.timeline-item { display:grid; grid-template-columns:72px 1fr; padding: 0 0 42px 0; position:relative; }
.timeline-item > span { width:38px; height:38px; border-radius:50%; display:grid; place-items:center; background:#101621; border:1px solid rgba(132,111,255,.4); color:#a998ff; font-size:11px; font-weight:800; position:relative; left:-19px; }
.timeline-item h3 { font-size:22px; margin-bottom:8px; }
.timeline-item p { color:var(--muted); line-height:1.7; margin:0; }

.about-section { background: rgba(255,255,255,.012); border-top:1px solid rgba(255,255,255,.04); border-bottom:1px solid rgba(255,255,255,.04); }
.about-grid { display:grid; grid-template-columns:1fr .8fr; gap:52px; align-items:center; }
.about-points { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:28px; }
.about-points div { display:flex; gap:9px; color:#d8deea; font-size:14px; }
.about-points b { color:#88f0b6; }
.stack-card { border:1px solid var(--border); border-radius:20px; background:#0d121b; padding:12px; box-shadow:var(--shadow); }
.stack-head { display:flex; justify-content:space-between; align-items:center; padding:18px 16px; }
.stack-head span { font-weight:700; }.stack-head strong{color:#7864ff;font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.stack-item { display:flex; justify-content:space-between; padding:17px 16px; border-top:1px solid rgba(255,255,255,.055); font-size:13px; }
.stack-item span{color:#cfd6e2}.stack-item b{color:#758095;font-size:11px;font-weight:600}

.contact-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:70px; align-items:start; }
.contact-note { margin-top:30px; padding:18px; border-left:2px solid #725bff; background:rgba(115,87,255,.07); display:flex; flex-direction:column; gap:5px; }
.contact-note span{color:var(--muted);font-size:12px}.contact-note strong{font-size:14px}
.contact-form { border:1px solid var(--border); background:rgba(255,255,255,.025); border-radius:20px; padding:26px; }
.field-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.contact-form label { display:flex; flex-direction:column; gap:8px; font-size:12px; color:#bbc4d3; font-weight:600; margin-bottom:14px; }
.contact-form input,.contact-form textarea,.contact-form select { width:100%; border:1px solid rgba(255,255,255,.08); background:#0b1018; color:#fff; border-radius:11px; padding:14px; outline:none; transition:.2s; }
.contact-form textarea{resize:vertical;min-height:145px}
.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus{border-color:rgba(121,96,255,.7);box-shadow:0 0 0 3px rgba(115,87,255,.1)}
.contact-form select option{background:#0b1018;color:white}.submit-btn{width:100%;margin-top:4px}.form-message{min-height:18px;font-size:12px;margin:12px 0 0;color:#8ef0b6}.form-message.error{color:#ff8d9b}

.site-footer { border-top:1px solid var(--border); padding:46px 0; background:#06080d; }
.footer-grid { display:grid; grid-template-columns:1fr auto auto; gap:50px; align-items:end; }
.footer-brand { margin-bottom:14px; }.footer-grid p{color:#717b8f;font-size:12px}.footer-links{display:flex;gap:22px}.footer-links a{color:#8f99aa;font-size:12px}.footer-meta{display:flex;flex-direction:column;gap:8px;color:#646e80;font-size:11px;text-align:right}

.reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity: 1; transform: none; }
.delay-1 { transition-delay: .08s; }.delay-2 { transition-delay: .16s; }

@media (max-width: 980px) {
  .hero-grid,.about-grid,.contact-grid { grid-template-columns:1fr; }
  .hero { padding-top:72px; }
  .hero-panel { max-width:720px; width:100%; }
  .services-grid { grid-template-columns:1fr 1fr; }
  .project-grid { grid-template-columns:1fr; }
  .project-large { grid-row:auto; }
  .project-large .project-visual { min-height:340px; }
  .contact-grid { gap:38px; }
  .footer-grid { grid-template-columns:1fr; align-items:start; }.footer-meta{text-align:left}
}

@media (max-width: 760px) {
  .container { width:min(100% - 28px, 1160px); }
  .section-pad { padding:82px 0; }
  .menu-toggle { display:block; }
  .main-nav { position:absolute; left:14px; right:14px; top:72px; flex-direction:column; align-items:stretch; gap:0; background:#0c1119; border:1px solid var(--border); border-radius:16px; padding:10px; box-shadow:var(--shadow); opacity:0; pointer-events:none; transform:translateY(-8px); transition:.2s; }
  .main-nav.open { opacity:1; pointer-events:auto; transform:none; }
  .main-nav a { padding:13px 12px; }
  .nav-cta { text-align:center; margin-top:5px; }
  .hero { min-height:auto; }
  .hero h1 { font-size:clamp(46px, 15vw, 70px); }
  .hero-grid { gap:50px; }
  .hero-actions { flex-direction:column; align-items:stretch; }
  .hero-stats { gap:24px; }
  .mini-card-two { right:10px; top:100px; }.mini-card-one{left:10px;bottom:20px}
  .services-grid,.field-grid,.about-points { grid-template-columns:1fr; }
  .service-card p { min-height:auto; }
  .trust-inner { justify-content:flex-start; }
  .dashboard-visual { padding:16px; }.dash-sidebar{width:52px}.dash-row{grid-template-columns:1fr}.dash-row i:nth-child(n+2){display:none}
  .project-large .project-visual { min-height:300px; }
  .footer-links { flex-wrap:wrap; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior:auto !important; animation:none !important; transition:none !important; }
  .reveal { opacity:1; transform:none; }
}


/* KBT service + portfolio additions */
.five-services { grid-template-columns: repeat(6, 1fr); }
.five-services .service-card { grid-column: span 2; }
.five-services .service-card:nth-child(4) { grid-column: 2 / span 2; }
.five-services .service-card:nth-child(5) { grid-column: 4 / span 2; }
.featured-service { border-color: rgba(133,113,255,.28); background: linear-gradient(150deg, rgba(115,87,255,.09), rgba(255,255,255,.018)); }
.portfolio-feature { display:grid; grid-template-columns:1.32fr .68fr; border:1px solid var(--border); background:rgba(255,255,255,.02); border-radius:24px; overflow:hidden; box-shadow:var(--shadow); }
.portfolio-image-link { display:block; min-height:470px; position:relative; overflow:hidden; background:#0b0f16; }
.portfolio-image-link img { width:100%; height:100%; object-fit:cover; object-position:center top; display:block; transition:transform .5s ease; }
.portfolio-image-link:hover img { transform:scale(1.018); }
.visit-badge { position:absolute; right:20px; bottom:20px; padding:11px 14px; border-radius:10px; background:rgba(7,9,15,.9); border:1px solid rgba(255,255,255,.14); font-size:12px; font-weight:800; backdrop-filter:blur(12px); }
.portfolio-copy { padding:44px 38px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }
.portfolio-copy h3 { font-size:clamp(32px,4vw,52px); letter-spacing:-.04em; margin:14px 0; }
.portfolio-copy p { color:var(--muted); line-height:1.75; margin:0 0 24px; }
.portfolio-tags { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:28px; }
.portfolio-tags span { padding:8px 10px; border:1px solid var(--border); background:rgba(255,255,255,.03); border-radius:8px; color:#aeb8c9; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.capability-row { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:18px; }
.capability-card { padding:24px; border:1px solid var(--border); border-radius:18px; background:rgba(255,255,255,.018); }
.capability-card > span { color:#9b8cff; font-size:11px; font-weight:800; }
.capability-card h3 { margin:14px 0 8px; font-size:20px; }
.capability-card p { margin:0; color:var(--muted); font-size:13px; line-height:1.65; }
@media (max-width:980px) { .five-services {grid-template-columns:1fr 1fr}.five-services .service-card,.five-services .service-card:nth-child(4),.five-services .service-card:nth-child(5){grid-column:auto}.portfolio-feature{grid-template-columns:1fr}.portfolio-image-link{min-height:360px} }
@media (max-width:760px) { .five-services,.capability-row{grid-template-columns:1fr}.portfolio-image-link{min-height:260px}.portfolio-copy{padding:28px 22px}.visit-badge{right:12px;bottom:12px} }

/* KBT brand logo */
.brand-logo {
  width: 52px;
  height: 52px;
  object-fit: cover;
  border-radius: 12px;
  flex: 0 0 auto;
  box-shadow: 0 0 24px rgba(41, 207, 255, 0.14), 0 0 28px rgba(255, 48, 178, 0.12);
}

@media (max-width: 640px) {
  .brand-logo { width: 44px; height: 44px; border-radius: 10px; }
}

/* Direct contact form delivery */
.optional { color:#6f7a8d; font-size:10px; font-weight:600; margin-left:5px; }
.form-honeypot { position:absolute !important; left:-10000px !important; width:1px !important; height:1px !important; overflow:hidden !important; }
.submit-btn:disabled { opacity:.65; cursor:wait; transform:none; }
.form-message.success { color:#8ef0b6; }

/* Two clear KBT service divisions */
.service-division { position: relative; overflow: hidden; }
.service-division::before { content:""; position:absolute; width:520px; height:520px; border-radius:50%; filter:blur(100px); opacity:.08; pointer-events:none; }
.web-division::before { right:-180px; top:70px; background:#39d9ff; }
.fivem-division::before { left:-190px; top:90px; background:#ff3bae; }
.fivem-division { border-top:1px solid var(--border); border-bottom:1px solid var(--border); background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,.008)); }
.division-header { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr); gap:70px; align-items:end; margin-bottom:46px; }
.division-header > div { position:relative; }
.division-number { display:block; margin-bottom:15px; font-family:"Space Grotesk",sans-serif; font-size:13px; font-weight:800; letter-spacing:.16em; color:#69758b; }
.division-header h2 { font-size:clamp(40px,5vw,66px); line-height:1.02; letter-spacing:-.045em; margin:13px 0 0; max-width:800px; }
.division-header > p { color:var(--muted); line-height:1.8; font-size:16px; margin:0; padding-bottom:5px; }
.web-feature { margin-bottom:18px; }
.web-capabilities { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.fivem-service-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.fivem-service-grid .service-card { min-height:270px; }
.fivem-service-grid .service-card p { min-height:unset; }
.fivem-stack { margin-top:18px; padding:20px 22px; border:1px solid var(--border); border-radius:16px; background:rgba(255,255,255,.018); display:flex; justify-content:space-between; align-items:center; gap:22px; }
.fivem-stack > span { color:var(--muted); font-size:13px; }
.fivem-stack > div { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.fivem-stack b { padding:8px 10px; border-radius:8px; border:1px solid var(--border); background:rgba(255,255,255,.025); color:#aeb8c9; font-size:10px; letter-spacing:.04em; }
@media (max-width:980px) {
  .division-header { grid-template-columns:1fr; gap:18px; }
  .web-capabilities { grid-template-columns:1fr 1fr; }
  .fivem-stack { align-items:flex-start; flex-direction:column; }
  .fivem-stack > div { justify-content:flex-start; }
}
@media (max-width:760px) {
  .web-capabilities,.fivem-service-grid { grid-template-columns:1fr; }
  .division-header { margin-bottom:32px; }
}

/* =========================================================
   KBT DEVELOPMENT — CYAN / PINK BRAND UI
   Palette sampled from the supplied KBT logo.
   ========================================================= */
:root {
  --bg: #05070c;
  --bg-soft: #090d15;
  --panel: rgba(12, 18, 29, 0.86);
  --panel-strong: #0d1420;
  --border: rgba(126, 195, 255, 0.12);
  --text: #f8fbff;
  --muted: #93a0b4;
  --cyan: #22dcff;
  --blue: #148cff;
  --pink: #ff43bc;
  --magenta: #ff278f;
  --accent: var(--cyan);
  --accent-2: var(--pink);
  --accent-soft: rgba(34, 220, 255, 0.12);
  --pink-soft: rgba(255, 67, 188, 0.12);
  --success: #62f1b1;
  --shadow: 0 28px 80px rgba(0, 0, 0, 0.42);
  --brand-gradient: linear-gradient(100deg, var(--cyan) 0%, var(--blue) 38%, var(--pink) 70%, var(--magenta) 100%);
}

body {
  background:
    radial-gradient(circle at 16% 5%, rgba(29, 192, 255, .10), transparent 29%),
    radial-gradient(circle at 86% 18%, rgba(255, 53, 175, .09), transparent 27%),
    linear-gradient(180deg, #05070c 0%, #070a11 52%, #05070c 100%);
}
body::before {
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-3;
  opacity:.17;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px, transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.75),transparent 72%);
}

.glow-one { background: var(--pink); top: 6%; right: -180px; opacity:.13; }
.glow-two { background: var(--cyan); left: -220px; top: 50%; opacity:.13; }

.site-header.scrolled {
  background: rgba(5, 8, 14, .86);
  border-color: rgba(66, 190, 255, .13);
  box-shadow: 0 14px 35px rgba(0,0,0,.20);
}
.site-header::after {
  content:"";
  position:absolute;
  left:0; right:0; bottom:-1px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(34,220,255,.30),rgba(255,67,188,.30),transparent);
  opacity:.55;
}
.brand-logo {
  width:56px;
  height:56px;
  border-radius:15px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 0 28px rgba(34,220,255,.13),0 0 34px rgba(255,67,188,.11);
}
.brand-copy strong {
  font-size:18px;
  background:var(--brand-gradient);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.main-nav a { position:relative; color:#b9c4d4; }
.main-nav a:not(.nav-cta)::after {
  content:"";
  position:absolute;
  left:0; right:100%; bottom:-9px;
  height:2px;
  border-radius:4px;
  background:var(--brand-gradient);
  transition:right .22s ease;
}
.main-nav a:not(.nav-cta):hover::after { right:0; }
.main-nav a:hover { color:#fff; }
.nav-cta {
  border-color:rgba(34,220,255,.22);
  background:linear-gradient(100deg,rgba(34,220,255,.11),rgba(255,67,188,.10));
  box-shadow:inset 0 0 18px rgba(255,255,255,.018);
}
.nav-cta:hover { border-color:rgba(255,67,188,.38); }

.eyebrow { color:#8eeeff; }
.hero .eyebrow { color:#d9e8f7; }
.status-dot { background:var(--cyan); box-shadow:0 0 16px var(--cyan); }
.hero h1 span,
.brand-gradient-text {
  background:var(--brand-gradient);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.hero-panel {
  background:
    radial-gradient(circle at 100% 0%,rgba(255,55,180,.10),transparent 34%),
    radial-gradient(circle at 0% 100%,rgba(34,220,255,.10),transparent 34%),
    linear-gradient(150deg,rgba(15,23,36,.96),rgba(7,11,18,.95));
  border-color:rgba(126,195,255,.15);
}
.hero-panel::before {
  content:"";
  position:absolute;
  inset:-1px;
  padding:1px;
  border-radius:24px;
  background:linear-gradient(135deg,rgba(34,220,255,.48),transparent 34%,transparent 62%,rgba(255,67,188,.46));
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
}
.window-bar > span:nth-child(1){background:var(--pink)}
.window-bar > span:nth-child(2){background:#6d7d96}
.window-bar > span:nth-child(3){background:var(--cyan)}
.code-purple { color:#ff77ce; }
.code-blue { color:#67ddff; }
.terminal-line > span:first-child { color:var(--cyan); }
.mini-card { border-color:rgba(102,190,255,.14); background:rgba(8,14,23,.94); }
.mini-icon { background:linear-gradient(135deg,rgba(34,220,255,.14),rgba(255,67,188,.13)); color:#8cecff; }

.btn-primary {
  background:var(--brand-gradient);
  color:#fff;
  box-shadow:0 14px 34px rgba(24,145,255,.15),0 10px 34px rgba(255,43,150,.11);
  position:relative;
  overflow:hidden;
}
.btn-primary::after {
  content:"";
  position:absolute;
  top:-60%; left:-25%; width:25%; height:220%;
  transform:rotate(20deg);
  background:rgba(255,255,255,.22);
  transition:left .4s ease;
}
.btn-primary:hover::after { left:118%; }
.btn-primary:hover { box-shadow:0 18px 44px rgba(34,220,255,.16),0 14px 44px rgba(255,67,188,.15); }
.btn-secondary { border-color:rgba(126,195,255,.13); background:rgba(255,255,255,.025); }
.btn-secondary:hover { border-color:rgba(34,220,255,.22); background:rgba(34,220,255,.045); }

.trust-strip {
  background:rgba(7,12,20,.82);
  border-color:rgba(126,195,255,.10);
}
.trust-inner span { color:#8795aa; }
.trust-inner span:nth-child(odd) { color:#a9eefa; }
.trust-inner span:nth-child(even) { color:#eeb1da; }

.service-division { isolation:isolate; }
.service-division::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.18;
  background-image:radial-gradient(circle at 1px 1px,rgba(255,255,255,.08) 1px,transparent 0);
  background-size:26px 26px;
  mask-image:linear-gradient(to bottom,transparent,black 20%,black 80%,transparent);
}
.web-division::before { background:var(--cyan); opacity:.12; }
.fivem-division::before { background:var(--pink); opacity:.12; }
.web-division .eyebrow,.web-division .division-number { color:#69e7ff; }
.fivem-division .eyebrow,.fivem-division .division-number { color:#ff80ce; }
.division-header h2 { color:#f7fbff; }
.division-header h2::after {
  content:"";
  display:block;
  width:78px;
  height:3px;
  border-radius:99px;
  margin-top:22px;
  background:var(--brand-gradient);
}

.service-card,
.capability-card,
.contact-form,
.stack-card,
.portfolio-feature,
.fivem-stack {
  border-color:rgba(126,195,255,.105);
  background:linear-gradient(150deg,rgba(18,27,41,.76),rgba(8,13,21,.78));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
.service-card { position:relative; overflow:hidden; }
.service-card::before {
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height:2px;
  opacity:.55;
  background:linear-gradient(90deg,transparent,var(--cyan),var(--pink),transparent);
}
.web-capabilities .service-card::before { background:linear-gradient(90deg,transparent,var(--cyan),var(--blue),transparent); }
.fivem-service-grid .service-card::before { background:linear-gradient(90deg,transparent,var(--pink),var(--magenta),transparent); }
.service-card:hover {
  transform:translateY(-6px);
  border-color:rgba(34,220,255,.25);
  background:linear-gradient(150deg,rgba(24,41,57,.78),rgba(11,16,26,.82));
  box-shadow:0 18px 50px rgba(0,0,0,.25),0 0 32px rgba(34,220,255,.035);
}
.fivem-service-grid .service-card:hover { border-color:rgba(255,67,188,.27); box-shadow:0 18px 50px rgba(0,0,0,.25),0 0 32px rgba(255,67,188,.04); }
.service-icon {
  background:linear-gradient(135deg,rgba(34,220,255,.13),rgba(255,67,188,.12));
  border:1px solid rgba(126,195,255,.11);
  color:#d9f8ff;
}
.web-capabilities .service-icon { color:#85ecff; background:rgba(34,220,255,.09); }
.fivem-service-grid .service-icon { color:#ff9bd8; background:rgba(255,67,188,.09); }
.featured-service {
  border-color:rgba(255,67,188,.23);
  background:radial-gradient(circle at 100% 0%,rgba(255,67,188,.09),transparent 36%),linear-gradient(150deg,rgba(18,27,41,.82),rgba(8,13,21,.82));
}

.portfolio-feature { position:relative; }
.portfolio-feature::before {
  content:"";
  position:absolute;
  inset:0;
  border-radius:24px;
  pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(34,220,255,.04);
}
.portfolio-image-link::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,transparent 68%,rgba(5,9,15,.45));
  pointer-events:none;
}
.visit-badge {
  border-color:rgba(34,220,255,.23);
  background:rgba(5,11,18,.90);
  color:#b8f4ff;
}
.portfolio-copy .eyebrow { color:#61e6ff; }
.portfolio-tags span { border-color:rgba(34,220,255,.12); background:rgba(34,220,255,.035); color:#a9c7d1; }

.fivem-stack b {
  border-color:rgba(255,67,188,.12);
  background:rgba(255,67,188,.035);
  color:#d7b7cb;
}

.timeline { border-left-color:rgba(95,210,255,.13); }
.timeline-item > span {
  background:#0b1520;
  border-color:rgba(34,220,255,.30);
  color:#7de9ff;
  box-shadow:0 0 22px rgba(34,220,255,.06);
}
.timeline-item:nth-child(even) > span { border-color:rgba(255,67,188,.30); color:#ff91d5; box-shadow:0 0 22px rgba(255,67,188,.06); }

.about-section {
  background:linear-gradient(180deg,rgba(34,220,255,.018),rgba(255,67,188,.014));
  border-color:rgba(126,195,255,.07);
}
.about-points b { color:#55ddff; }
.stack-head strong { color:#ff75ca; }

.contact-note {
  border-left:2px solid transparent;
  border-image:linear-gradient(to bottom,var(--cyan),var(--pink)) 1;
  background:linear-gradient(90deg,rgba(34,220,255,.055),rgba(255,67,188,.025));
}
.contact-form { position:relative; overflow:hidden; }
.contact-form::before {
  content:"";
  position:absolute;
  left:0; top:0; right:0;
  height:2px;
  background:var(--brand-gradient);
}
.contact-form input,.contact-form textarea,.contact-form select {
  background:#080d15;
  border-color:rgba(126,195,255,.10);
}
.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus {
  border-color:rgba(34,220,255,.55);
  box-shadow:0 0 0 3px rgba(34,220,255,.075),0 0 22px rgba(255,67,188,.025);
}
.form-message.success { color:#6df2b0; }

.site-footer {
  background:#04060a;
  border-color:rgba(126,195,255,.08);
  position:relative;
}
.site-footer::before {
  content:"";
  position:absolute;
  left:0;right:0;top:-1px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(34,220,255,.26),rgba(255,67,188,.26),transparent);
}
.footer-links a:hover { color:#91ecff; }

::selection { background:rgba(255,67,188,.28); color:#fff; }

@media (max-width:760px) {
  .main-nav {
    background:rgba(7,12,20,.97);
    border-color:rgba(126,195,255,.13);
  }
  .main-nav a:not(.nav-cta)::after { display:none; }
  .brand-logo { width:48px; height:48px; }
}

/* Multi-page KBT v7 */
.gateway-hero{min-height:calc(100vh - 78px);padding:90px 0 110px;display:flex;flex-direction:column;justify-content:center}.gateway-inner{text-align:center;max-width:900px;margin:0 auto 52px}.gateway-inner h1{font-size:clamp(52px,7vw,92px);line-height:.95;letter-spacing:-.055em;margin:20px 0}.gateway-inner h1 span{background:linear-gradient(90deg,#30dfff,#ff3bae);-webkit-background-clip:text;background-clip:text;color:transparent}.gateway-inner p{color:var(--muted);font-size:18px;line-height:1.7;max-width:720px;margin:auto}.division-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.division-choice{position:relative;overflow:hidden;min-height:390px;padding:38px;border:1px solid var(--border);border-radius:26px;background:#0b0f17;box-shadow:var(--shadow);transition:.28s}.division-choice:before{content:"";position:absolute;width:340px;height:340px;border-radius:50%;filter:blur(95px);opacity:.16;right:-120px;top:-120px}.web-choice:before{background:#1fdcff}.fivem-choice:before{background:#ff2eaa}.division-choice:hover{transform:translateY(-7px)}.web-choice:hover{border-color:rgba(47,220,255,.45)}.fivem-choice:hover{border-color:rgba(255,59,174,.45)}.choice-top{display:flex;justify-content:space-between;color:#8f9aad;text-transform:uppercase;font-size:11px;letter-spacing:.11em}.choice-top b{color:#fff}.division-choice h2{font-size:clamp(34px,4vw,54px);line-height:1.02;letter-spacing:-.045em;margin:66px 0 18px;max-width:560px}.division-choice p{color:var(--muted);line-height:1.7;max-width:580px}.choice-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:28px}.choice-tags span{border:1px solid var(--border);padding:7px 10px;border-radius:999px;font-size:10px;color:#a8b2c3}.choice-link{position:absolute;left:38px;bottom:35px;font-size:13px}.web-choice .choice-link{color:#56e4ff}.fivem-choice .choice-link{color:#ff72c2}
.division-hero{min-height:760px;display:flex;align-items:center;padding:100px 0 80px}.division-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:72px;align-items:center}.division-hero h1{font-size:clamp(52px,6.4vw,86px);line-height:.96;letter-spacing:-.055em;margin:20px 0 24px}.division-hero p{color:var(--muted);font-size:18px;line-height:1.75;max-width:680px}.web-page .division-hero h1 span,.web-page .eyebrow{color:#55e6ff}.fivem-page .division-hero h1 span,.fivem-page .eyebrow{color:#ff6fc1}.web-page .btn-primary{background:linear-gradient(135deg,#13c9ef,#157cff);box-shadow:0 14px 36px rgba(19,201,239,.22)}.fivem-page .btn-primary{background:linear-gradient(135deg,#ff2da8,#8a43ff);box-shadow:0 14px 36px rgba(255,45,168,.22)}.web-glow{background:#1edcff;right:-170px;top:10%;opacity:.16}.fivem-glow{background:#ff2da8;right:-170px;top:10%;opacity:.16}.active-web{color:#56e4ff!important}.active-fivem{color:#ff72c2!important}.division-visual{border:1px solid var(--border);border-radius:24px;background:#0d121b;box-shadow:var(--shadow);overflow:hidden}.browser-mock{padding:18px}.browser-top{height:48px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:7px;color:#677287;font-size:11px}.browser-top i{width:9px;height:9px;border-radius:50%;background:#4a5260}.browser-top span{margin-left:10px}.browser-body{padding:36px}.mock-nav{height:11px;width:48%;border-radius:10px;background:#24313c}.mock-title{height:60px;width:78%;margin-top:55px;border-radius:12px;background:linear-gradient(90deg,#27d8ff,#167cff)}.mock-copy{height:12px;width:66%;margin-top:22px;border-radius:10px;background:#28313f}.mock-buttons{display:flex;gap:12px;margin-top:30px}.mock-buttons b{width:120px;height:42px;border-radius:10px;background:#172331;border:1px solid #264759}.mock-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:52px}.mock-grid i{height:100px;border-radius:14px;background:#111a24;border:1px solid #1b3340}.standalone-code{min-height:430px;padding:52px 38px}.fivem-visual{background:radial-gradient(circle at top right,rgba(255,45,168,.12),transparent 45%),#0b0e15}.web-services{background:linear-gradient(180deg,rgba(28,203,255,.025),transparent)}.fivem-process{background:linear-gradient(180deg,rgba(255,45,168,.025),transparent)}
@media(max-width:980px){.division-choice-grid,.division-hero-grid{grid-template-columns:1fr}.division-hero{min-height:auto}.division-visual{max-width:760px}.gateway-hero{padding-top:70px}}@media(max-width:760px){.division-choice-grid{grid-template-columns:1fr}.division-choice{min-height:360px;padding:28px}.choice-link{left:28px}.division-hero{padding:70px 0}.division-hero h1{font-size:clamp(46px,14vw,68px)}.gateway-inner h1{font-size:clamp(48px,14vw,72px)}}

/* v8 cleaned FiveM portfolio */
.fivem-page .section-heading{max-width:820px;margin-bottom:42px}.section-intro{color:var(--muted);line-height:1.75;font-size:15px;max-width:720px;margin:14px 0 0}.fivem-page .service-card{min-height:0;padding:30px}.fivem-page .service-card h3{margin-top:20px}.fivem-page .service-card span:last-child{display:block;margin-top:22px}.fivem-page .division-hero{overflow:hidden}.fivem-page .standalone-code{width:100%}.fivem-page .code-card .line{white-space:normal;overflow-wrap:anywhere}.script-showcase{border-top:1px solid rgba(255,255,255,.055);border-bottom:1px solid rgba(255,255,255,.055);background:radial-gradient(circle at 90% 15%,rgba(255,45,168,.065),transparent 27%),radial-gradient(circle at 10% 80%,rgba(34,220,255,.05),transparent 27%),#060910}.script-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.script-card{min-width:0;overflow:hidden;border-radius:20px;border:1px solid rgba(126,195,255,.12);background:#090e16;box-shadow:0 18px 55px rgba(0,0,0,.24);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}.script-card:hover{transform:translateY(-5px);border-color:rgba(255,67,188,.32);box-shadow:0 24px 65px rgba(0,0,0,.32),0 0 35px rgba(255,67,188,.035)}.script-card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#070a10}.script-card-copy{padding:20px 22px 22px;border-top:1px solid rgba(255,255,255,.06)}.script-card-copy span{color:#ff7bcb;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.script-card-copy h3{margin:8px 0 0;font-family:"Space Grotesk",sans-serif;font-size:20px;line-height:1.25;letter-spacing:-.025em}.script-card-wide{grid-column:1/-1}.script-card-wide img{aspect-ratio:2.15/1}@media(max-width:980px){.fivem-page .division-hero-grid{gap:42px}.fivem-page .standalone-code{min-height:0;padding:34px 26px}}@media(max-width:760px){.script-grid{grid-template-columns:1fr;gap:16px}.script-card-wide{grid-column:auto}.script-card-wide img{aspect-ratio:16/9}.script-card-copy{padding:17px 18px 19px}.script-card-copy h3{font-size:18px}.fivem-page .service-card{padding:24px}.fivem-page .division-hero{padding-top:56px}}


/* v9 navigation + portfolio reliability */
html { scroll-behavior: smooth; }
section[id] { scroll-margin-top: 96px; }
.active-home { color:#fff!important; }
.active-home::after, .active-web::after, .active-fivem::after { left:0!important; right:0!important; }
.script-card img { min-height: 180px; visibility: visible!important; opacity:1!important; }
.script-card { isolation:isolate; }
.script-card-copy { position:relative; z-index:2; }
@media (max-width:760px) {
  body.menu-open { overflow:hidden; }
  .site-header { z-index:1000; }
  .main-nav { max-height:calc(100vh - 96px); overflow-y:auto; }
  .main-nav.open { display:flex; }
  .main-nav a { min-height:48px; display:flex; align-items:center; }
  .script-card img { min-height:0; }
}


/* v10 — homepage card layout fix + FiveM store/community links */

/* Home division cards: remove absolute CTA placement and keep content in clean flow */
.division-choice {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.division-choice h2 {
  margin: 56px 0 18px;
}
.division-choice p {
  margin: 0;
}
.choice-footer {
  margin-top: auto;
  padding-top: 30px;
}
.choice-tags {
  margin-top: 0;
  margin-bottom: 18px;
}
.choice-link {
  position: static !important;
  display: inline-flex;
  align-items: center;
  line-height: 1.2;
  padding: 3px 0;
}
.division-choice-grid {
  align-items: stretch;
}
.division-choice {
  padding-bottom: 34px;
}
.gateway-inner {
  margin-bottom: 46px;
}

/* FiveM external destinations */
.fivem-hero-actions {
  flex-wrap: wrap;
}
.fivem-hero-actions .btn {
  min-width: 0;
}
.store-btn:hover {
  border-color: rgba(255, 68, 186, .55);
  box-shadow: 0 0 26px rgba(255, 68, 186, .08);
}
.discord-btn:hover {
  border-color: rgba(88, 101, 242, .68);
  box-shadow: 0 0 26px rgba(88, 101, 242, .10);
}

.fivem-links-section {
  padding: 38px 0 4px;
  background:
    radial-gradient(circle at 15% 0%, rgba(36, 216, 255, .045), transparent 30%),
    radial-gradient(circle at 85% 0%, rgba(255, 57, 174, .05), transparent 30%);
}
.fivem-link-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}
.external-link-card {
  position: relative;
  overflow: hidden;
  display: block;
  min-width: 0;
  padding: 28px 30px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: rgba(10, 14, 22, .92);
  box-shadow: var(--shadow);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.external-link-card::after {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  right: -80px;
  top: -90px;
  border-radius: 50%;
  filter: blur(55px);
  opacity: .16;
  pointer-events: none;
}
.tebex-card::after { background: #ff3bae; }
.discord-card::after { background: #5865f2; }
.external-link-card:hover {
  transform: translateY(-4px);
}
.tebex-card:hover {
  border-color: rgba(255, 59, 174, .42);
  box-shadow: 0 18px 55px rgba(0,0,0,.28), 0 0 32px rgba(255,59,174,.035);
}
.discord-card:hover {
  border-color: rgba(88, 101, 242, .48);
  box-shadow: 0 18px 55px rgba(0,0,0,.28), 0 0 32px rgba(88,101,242,.045);
}
.external-kicker {
  display: block;
  margin-bottom: 10px;
  color: #ff78c7;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.discord-card .external-kicker {
  color: #9ca6ff;
}
.external-link-card h2 {
  margin: 0 0 10px;
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(24px, 2.5vw, 34px);
  letter-spacing: -.035em;
}
.external-link-card p {
  max-width: 540px;
  margin: 0 0 20px;
  color: var(--muted);
  line-height: 1.65;
}
.external-link-card strong {
  color: #fff;
  font-size: 13px;
}

@media (max-width: 980px) {
  .division-choice h2 { margin-top: 44px; }
}
@media (max-width: 760px) {
  .division-choice { padding: 26px; }
  .choice-footer { padding-top: 26px; }
  .fivem-link-grid { grid-template-columns: 1fr; }
  .external-link-card { padding: 24px; }
  .fivem-hero-actions { display: grid; grid-template-columns: 1fr; }
  .fivem-hero-actions .btn { width: 100%; justify-content: center; }
}

/* v11 unified navigation + enquiry forms */
.nav-wrap{display:flex;align-items:center;gap:22px}.brand{flex:0 0 auto}
.main-nav{margin-left:auto;display:flex;align-items:center;justify-content:flex-end;gap:clamp(12px,1.25vw,22px);min-width:0}
.main-nav a{white-space:nowrap;font-size:11px;line-height:1}.main-nav a.active-nav{color:#fff}
.form-context-badge{display:inline-flex;width:fit-content;margin:0 0 18px;padding:8px 12px;border-radius:999px;border:1px solid rgba(40,217,255,.25);background:rgba(40,217,255,.055);color:#69e6ff;font-size:10px;font-weight:800;letter-spacing:.11em;text-transform:uppercase}
.form-context-badge.fivem-badge{border-color:rgba(255,67,188,.28);background:rgba(255,67,188,.06);color:#ff86cf}
.contact-form{min-width:0}.contact-form input,.contact-form select,.contact-form textarea{width:100%;min-width:0}
@media(max-width:1220px){.main-nav{gap:12px}.main-nav a{font-size:10px}}
@media(max-width:1040px){
.main-nav{position:fixed;top:76px;left:16px;right:16px;display:none;flex-direction:column;align-items:stretch;gap:0;padding:12px;border:1px solid var(--border);border-radius:16px;background:rgba(7,10,16,.98);box-shadow:0 24px 70px rgba(0,0,0,.42);z-index:999}
.main-nav.open{display:flex}.main-nav a{width:100%;padding:14px 12px;font-size:12px}.menu-toggle{display:inline-flex!important;margin-left:auto}}
@media(min-width:1041px){.menu-toggle{display:none!important}}