:root {
  --bg: #0b0b0d;
  --bg-2: #121216;
  --panel: rgba(255,255,255,0.07);
  --panel-strong: rgba(255,255,255,0.11);
  --line: rgba(255,255,255,0.12);
  --text: #f8f4ee;
  --muted: #ddd1bf;
  --brand: #ff3b1f;
  --brand-dark: #b51605;
  --brand-hot: #ff6a00;
  --brand-soft: rgba(255,59,31,.14);
  --accent: #ffd84d;
  --accent-soft: rgba(255,216,77,.14);
  --green: #9cff57;
  --green-soft: rgba(156,255,87,.12);
  --kc-blue: #1c8dff;
  --kc-blue-dark: #0c56b8;
  --kc-blue-soft: rgba(28,141,255,.18);
  --white: #ffffff;
  --black: #050505;
  --shadow: 0 20px 52px rgba(0,0,0,.34);
  --radius: 24px;
  --max: 1180px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--text);
  font-family: Inter, Arial, Helvetica, sans-serif;
  background:
    radial-gradient(circle at 10% 14%, rgba(255,59,31,.34), transparent 24%),
    radial-gradient(circle at 82% 14%, rgba(28,141,255,.26), transparent 22%),
    radial-gradient(circle at 78% 62%, rgba(255,216,77,.10), transparent 18%),
    radial-gradient(circle at 24% 42%, rgba(28,141,255,.12), transparent 24%),
    linear-gradient(180deg, #050507 0%, #0b0b0f 36%, #0a0b10 100%);
  line-height: 1.65;
  position: relative;
}
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(120deg, rgba(255,255,255,.015) 0%, transparent 20%, rgba(255,255,255,.01) 40%, transparent 60%),
    radial-gradient(circle at 20% 0%, rgba(255,59,31,.08), transparent 28%),
    radial-gradient(circle at 80% 10%, rgba(28,141,255,.07), transparent 25%);
  opacity: .85;
  z-index: -1;
}
a { color: var(--brand); text-decoration: none; }
a:hover { color: var(--white); }
img { max-width: 100%; display: block; }
.container { width: min(var(--max), calc(100% - 2rem)); margin: 0 auto; }
section { padding: 4.2rem 0; }
.topbar {
  background: linear-gradient(90deg, #0f3d8f 0%, #1f66d8 45%, #17499a 75%, #0c244d 100%);
  border-bottom: 1px solid rgba(255,255,255,.08);
  font-size: .92rem;
}
.topbar-inner { display:flex; justify-content:space-between; gap:1rem; padding:.7rem 0; }
.topbar a { color: #ffe08a; }
.site-header {
  position: sticky; top:0; z-index:60;
  background: linear-gradient(180deg, rgba(3,10,22,.96), rgba(4,12,28,.90));
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(255,255,255,.06);
  box-shadow: 0 16px 46px rgba(0,0,0,.28);
}
main { overflow: clip; }
.nav-wrap {
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  min-height:118px; position: relative; padding-top:.7rem; padding-bottom:.25rem;
}
.brand {
  display:inline-flex;
  align-items:flex-end;
  gap:.85rem;
  color:var(--white);
  font-weight:800;
  letter-spacing:.03em;
  position: relative;
  z-index: 4;
  transform: translateY(44px);
  transition: transform .28s ease;
}
.brand img { width:48px; height:48px; }
.brand .brand-logo-full {
  width: 420px;
  max-width: min(38vw, 420px);
  height: auto;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  filter: drop-shadow(0 18px 38px rgba(0,0,0,.50)) drop-shadow(0 0 22px rgba(28,141,255,.16));
  transition: width .28s ease, max-width .28s ease, filter .28s ease;
}
.brand .brand-wordmark { display:none; }
.site-header.is-scrolled .brand { transform: translateY(10px); }
.site-header.is-scrolled .brand .brand-logo-full {
  width: 260px;
  max-width: min(26vw, 260px);
  filter: drop-shadow(0 12px 28px rgba(0,0,0,.38)) drop-shadow(0 0 16px rgba(28,141,255,.12));
}
.site-nav { display:flex; align-items:center; gap:1.25rem; margin-left:auto; }
.header-cta { margin-left:1rem; }
.nav-link { color: rgba(255,255,255,.82); font-weight:700; position:relative; }
.nav-link.active, .nav-link:hover { color: var(--white); }
.nav-link.active::after, .nav-link:hover::after {
  content:''; position:absolute; left:0; right:0; bottom:-.45rem; height:2px; border-radius:99px;
  background: linear-gradient(90deg, var(--brand), var(--accent), var(--kc-blue));
}
.menu-toggle { display:none; }
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:.45rem;
  border-radius:999px; padding:1rem 1.4rem; font-weight:800; border:1px solid transparent;
  transition: .22s ease; cursor:pointer; text-align:center;
}
.btn:hover { transform: translateY(-1px); }
.btn-primary {
  background: linear-gradient(135deg, #1d64f2 0%, #348bff 55%, #ffcf55 100%);
  color:#fff;
  box-shadow: 0 18px 42px rgba(18,74,181,.36), 0 0 22px rgba(89,165,255,.18), 0 0 0 1px rgba(255,207,85,.12);
}
.btn-primary, .btn-secondary, .pill, .eyebrow { transition: .22s ease, box-shadow .22s ease, border-color .22s ease; }
.btn-primary:hover { color:#fff; }
.btn-secondary {
  background: linear-gradient(135deg, rgba(255,255,255,.05), rgba(34,112,255,.12), rgba(255,255,255,.03));
  color:var(--white);
  border-color: rgba(95,163,255,.34);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 10px 24px rgba(34,112,255,.14);
}
.btn-secondary:hover { border-color: rgba(255,216,77,.28); }
.hero { padding: 7.4rem 0 3.6rem; }
.hero-grid { display:grid; grid-template-columns: 1.15fr .85fr; gap:2rem; align-items:center; }
.hero-grid-home { align-items:start; }
.eyebrow {
  display:inline-flex;
  padding:.48rem .9rem;
  border-radius:999px;
  background: linear-gradient(135deg, rgba(255,59,31,.14), rgba(255,216,77,.08), rgba(28,141,255,.10));
  border:1px solid rgba(255,106,0,.34);
  color:#ffe6bf;
  box-shadow: inset 0 0 0 1px rgba(255,216,77,.08), 0 10px 24px rgba(255,59,31,.08);
  font-size:.9rem; font-weight:800; letter-spacing:.015em;
}
.hero h1, .page-hero h1 { font-size: clamp(2.7rem, 5.8vw, 5.2rem); line-height: .98; margin: 1rem 0 1.1rem; letter-spacing: -.03em; max-width: 11ch; }
.hero p, .page-hero p, .section-copy { color: var(--muted); }
.hero-lead { font-size:1.12rem; max-width: 62ch; }
.hero-actions { display:flex; gap:1rem; flex-wrap:wrap; margin-top:1.8rem; }
.kicker {
  margin:0 0 .75rem; display:inline-block; color:#ffe36f; text-transform:uppercase; letter-spacing:.12em; font-size:.79rem; font-weight:800;
}
.hero-showcase { display:grid; gap:1rem; }
.showcase-panel, .card, .service-card, .contact-panel, .proof-card, .stack-card, .stat {
  border-radius: var(--radius);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
}
.showcase-panel {
  padding: 1.65rem;
  background: linear-gradient(180deg, rgba(9,25,52,.78), rgba(7,20,42,.68));
  position: relative;
  overflow: hidden;
}
.showcase-panel::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(41,108,255,.18), rgba(255,207,85,.08), rgba(93,166,255,.12));
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  padding: 1px;
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.showcase-panel h2 { margin: 0 0 .8rem; font-size: 1.9rem; }
.showcase-stack { display:grid; gap:.9rem; }
.stack-card { padding:1.1rem 1.15rem; }
.accent-red { background: linear-gradient(135deg, rgba(23,80,194,.28), rgba(62,132,255,.12), rgba(255,207,85,.08), rgba(255,255,255,.05)); }
.accent-yellow { background: linear-gradient(135deg, rgba(255,207,85,.16), rgba(74,138,255,.08), rgba(255,255,255,.04)); }
.accent-dark { background: linear-gradient(135deg, rgba(2,8,20,.52), rgba(20,74,182,.10), rgba(58,126,255,.08), rgba(255,255,255,.04)); }
.stack-label { display:inline-flex; margin-bottom:.45rem; padding:.28rem .58rem; border-radius:999px; background: rgba(255,255,255,.08); font-size:.78rem; font-weight:800; }
.hero-proof-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin-top:1.6rem; }
.proof-card {
  padding:1.1rem 1rem; background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
}
.proof-card strong { display:block; margin-bottom:.45rem; font-size:1.04rem; }
.value-strip { padding-top: 1rem; }
.value-strip-grid {
  display:grid; grid-template-columns:1fr .95fr; gap:2rem; align-items:center;
  padding:1.8rem; background: linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,59,31,.1), rgba(255,216,77,.08));
  border-radius: var(--radius); border:1px solid var(--line);
}
.section-head { margin-bottom:1.4rem; }
.section-title { font-size: clamp(1.9rem, 3.6vw, 3.2rem); line-height:1.05; margin: .35rem 0 .8rem; letter-spacing: -.02em; }
.grid-2, .grid-3, .grid-4 { display:grid; gap:1.25rem; }
.grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.grid-4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.feature-card, .service-card, .card, .contact-panel, .stat { padding: 1.45rem; background: linear-gradient(180deg, rgba(10,24,48,.76), rgba(8,20,40,.62)); }
.feature-card { position:relative; overflow:hidden; }
.feature-card::after {
  content:""; position:absolute; inset:auto -40px -40px auto; width:120px; height:120px; border-radius:50%;
  background: radial-gradient(circle, rgba(43,112,255,.22), transparent 65%);
}
.feature-card::before {
  content:""; position:absolute; inset:-20px auto auto -20px; width:110px; height:110px; border-radius:50%;
  background: radial-gradient(circle, rgba(102,170,255,.15), transparent 68%);
}
.card-tag { margin:0 0 .55rem; color:#ffe36f; text-transform:uppercase; letter-spacing:.1em; font-size:.76rem; font-weight:800; }
.split { display:grid; grid-template-columns: 1.05fr .95fr; gap:1.7rem; align-items:start; }
.contrast-section { background: linear-gradient(180deg, rgba(0,0,0,.14), rgba(255,255,255,0)); }
.larger-list li { margin:.75rem 0; font-size:1.02rem; }
.checklist, .clean-list, .tier-list { list-style:none; padding:0; margin:0; }
.checklist li, .clean-list li { position:relative; padding-left:1.45rem; margin:.6rem 0; color:var(--muted); }
.checklist li::before, .clean-list li::before { content:'•'; position:absolute; left:0; color:var(--accent); }
.pricing-card h3 { margin-top:.1rem; }
.tier-list { display:grid; gap:.9rem; margin-top:1rem; }
.tier-row { padding: .9rem 1rem; border-radius: 18px; background: rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.08); }
.tier-row strong { display:block; margin-bottom:.25rem; }
.small-note { margin-top:1rem; color:#ffe8ad; }
.page-hero { padding: 3.8rem 0 1.6rem; }
.stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin-top:1.4rem; }
.stat strong { display:block; font-size:1.9rem; }
.cta-band {
  padding:2.3rem; border-radius:var(--radius); border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(135deg, rgba(18,72,181,.32), rgba(53,126,255,.20) 48%, rgba(255,207,85,.12) 100%);
}
.cta-band-strong { box-shadow: 0 22px 50px rgba(0,0,0,.26); }
.service-area-list { display:flex; flex-wrap:wrap; gap:.8rem; }
.pill {
  display:inline-flex; padding:.62rem .9rem; border-radius:999px;
  background: linear-gradient(135deg, rgba(255,255,255,.05), rgba(86,152,255,.09), rgba(255,207,85,.06));
  border:1px solid rgba(104,170,255,.16); color:var(--white);
}
form { display:grid; gap:1rem; }
label { display:grid; gap:.45rem; font-weight:700; }
input, textarea, select {
  width:100%; padding: .95rem 1rem; border-radius: 14px; border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05); color:var(--white); font:inherit;
}
textarea { min-height: 160px; resize: vertical; }
input::placeholder, textarea::placeholder { color:#c7baa6; }
.hp { position:absolute; left:-9999px; }
.notice { padding:1rem 1.1rem; border-radius:16px; background:rgba(42,108,255,.12); border:1px solid rgba(104,170,255,.22); }
.site-footer { margin-top:2rem; padding:2.7rem 0 1.3rem; border-top:1px solid rgba(255,255,255,.08); background: linear-gradient(180deg, rgba(4,11,25,.50), rgba(6,15,30,.92)); }
.footer-grid { display:grid; grid-template-columns:1.15fr .85fr .85fr; gap:1.4rem; }
.footer-logo { width:220px; height:auto; margin-bottom:.85rem; filter: drop-shadow(0 12px 24px rgba(0,0,0,.28)); }
.footer-grid ul { list-style:none; padding:0; margin:0; }
.footer-grid li { margin:.55rem 0; color:var(--muted); }
.footer-bottom { border-top:1px solid rgba(255,255,255,.08); margin-top:1rem; padding-top:1rem; display:flex; justify-content:space-between; gap:1rem; color:var(--muted); font-size:.93rem; }
@media (max-width: 980px) {
  .brand { transform: translateY(14px); }
  .brand .brand-logo-full { width: 200px; }
  .site-header.is-scrolled .brand .brand-logo-full { width: 165px; }
  section { padding: 3.2rem 0; }
  .hero-grid, .hero-proof-grid, .value-strip-grid, .split, .grid-3, .grid-4, .footer-grid, .stats { grid-template-columns: 1fr; }
  .grid-2 { grid-template-columns:1fr; }
  .site-nav {
    position:absolute; left:1rem; right:1rem; top:104px; display:none; flex-direction:column; align-items:stretch;
    padding:1rem; border-radius:18px; background:#121218; border:1px solid rgba(255,255,255,.1);
  }
  .site-nav.open { display:flex; }
  .menu-toggle {
    display:inline-flex; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.04); color:var(--white);
    border-radius:12px; padding:.8rem 1rem;
  }
  .header-cta { display:none; }
  .topbar-inner, .footer-bottom { flex-direction:column; }
  .hero h1, .page-hero h1 { max-width: none; }
}

.hero-home {
  position: relative;
}
.hero-home::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(2,8,20,.82) 0%, rgba(4,12,28,.78) 30%, rgba(6,18,40,.62) 58%, rgba(9,28,60,.70) 100%),
    linear-gradient(180deg, rgba(4,10,22,.18), rgba(4,10,22,.68)),
    url('/assets/img/hero-studio-bg.webp') center/cover no-repeat;
  opacity: .84;
}

.hero h1, .page-hero h1 {
  text-shadow: 0 10px 40px rgba(0,0,0,.32);
}
.nav-link.active, .nav-link:hover, .topbar a:hover {
  color: #fff3ae;
}
.showcase-panel {
  box-shadow: 0 22px 56px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.05);
}
.stack-card {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
.card-tag {
  color: var(--accent);
}
.site-header::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, rgba(27,89,214,.40), rgba(255,207,85,.15), rgba(91,164,255,.35));
}
.proof-card strong, .stack-card strong, .tier-row strong {
  color: #fff7e2;
}
.btn-secondary:hover {
  border-color: rgba(104,170,255,.26);
  box-shadow: 0 12px 28px rgba(36,102,227,.18), 0 0 18px rgba(89,165,255,.10);
}
.header-cta { white-space: nowrap; }


.hero-home {
  position: relative;
}
.hero-home::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(2,8,20,.82) 0%, rgba(4,12,28,.78) 30%, rgba(6,18,40,.62) 58%, rgba(9,28,60,.70) 100%),
    linear-gradient(180deg, rgba(4,10,22,.18), rgba(4,10,22,.68)),
    url('/assets/img/hero-studio-bg.webp') center/cover no-repeat;
  opacity: .84;
}

.hero-grid, .value-strip-grid, .cta-band, .showcase-panel, .proof-card, .stack-card, .service-card, .card, .contact-panel, .stat {
  backdrop-filter: blur(4px);
}
.showcase-panel {
  background: linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.035));
}
.value-strip-grid {
  background: linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,59,31,.12), rgba(255,216,77,.06), rgba(28,141,255,.10));
}
@media (max-width: 1100px) {
  .brand .brand-logo-full { width: 350px; max-width: 34vw; }
  .site-header.is-scrolled .brand .brand-logo-full { width: 230px; max-width: 24vw; }
}
@media (max-width: 900px) {
  .nav-wrap { min-height: 96px; }
  .brand { transform: translateY(24px); }
  .brand .brand-logo-full { width: 270px; max-width: 62vw; }
  .site-header.is-scrolled .brand { transform: translateY(8px); }
  .site-header.is-scrolled .brand .brand-logo-full { width: 210px; max-width: 48vw; }
  .hero { padding-top: 5.8rem; }
}


.process-intro-section { padding-top: 0; }
.process-intro-card {
  padding: 2rem 2rem 2.1rem;
  border-radius: calc(var(--radius) + 4px);
  border: 1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 14% 22%, rgba(255,59,31,.22), transparent 25%),
    radial-gradient(circle at 88% 22%, rgba(28,141,255,.2), transparent 26%),
    linear-gradient(135deg, rgba(255,255,255,.05), rgba(255,255,255,.03));
  box-shadow: 0 24px 50px rgba(0,0,0,.24);
}
.process-section { padding-top: 2.2rem; }
.process-grid {
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 1.3rem;
}
.process-card {
  position:relative;
  overflow:hidden;
  padding: 1.5rem 1.45rem 1.5rem;
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,.11);
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.03)),
    linear-gradient(135deg, rgba(255,59,31,.06), rgba(28,141,255,.05));
  box-shadow: 0 18px 36px rgba(0,0,0,.18);
}
.process-card::before {
  content:"";
  position:absolute;
  top:-35px;
  right:-35px;
  width:130px;
  height:130px;
  border-radius:50%;
  background: radial-gradient(circle, rgba(255,216,77,.18), transparent 68%);
  pointer-events:none;
}
.process-card::after {
  content:"";
  position:absolute;
  left:-30px;
  bottom:-30px;
  width:120px;
  height:120px;
  border-radius:50%;
  background: radial-gradient(circle, rgba(28,141,255,.12), transparent 70%);
  pointer-events:none;
}
.process-card h3 { margin:.2rem 0 .7rem; font-size:1.35rem; }
.process-card p { position:relative; z-index:1; }
.process-meaning {
  margin-top: 1rem;
  padding-top: .95rem;
  border-top: 1px solid rgba(255,255,255,.09);
  color: #fff0c8;
}
.process-section-tight { padding-top: .5rem; }
@media (max-width: 980px) {
  .process-grid { grid-template-columns: 1fr; }
  .process-intro-card { padding: 1.5rem; }
}

/* === Homepage dashboard refresh === */
:root {
  --power-blue: #1f6fff;
  --power-blue-2: #56a6ff;
  --power-blue-deep: #091a38;
  --gold-soft: #ffd66b;
}

body {
  background: linear-gradient(180deg, #050b16 0%, #08111f 40%, #0b1526 100%);
}

.topbar {
  background: linear-gradient(90deg, #0f2347 0%, #1b4d9e 35%, #245fc0 68%, #0e2e61 100%);
}

.site-header {
  background: linear-gradient(180deg, rgba(3,7,14,.92), rgba(4,10,20,.82));
  backdrop-filter: blur(12px);
}

.btn-primary {
  background: linear-gradient(135deg, #1553d7 0%, #1f6fff 42%, #56a6ff 76%, #ffd66b 100%);
  box-shadow: 0 18px 42px rgba(31,111,255,.35), 0 0 0 1px rgba(255,214,107,.14);
}

.btn-secondary {
  background: linear-gradient(135deg, rgba(255,255,255,.05), rgba(31,111,255,.12), rgba(86,166,255,.08));
  border-color: rgba(86,166,255,.24);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 10px 24px rgba(31,111,255,.12);
}

.nav-link.active::after, .nav-link:hover::after {
  background: linear-gradient(90deg, var(--power-blue), var(--power-blue-2), var(--gold-soft));
}

.hero-dashboard {
  position: relative;
  padding: 7.9rem 0 4.1rem;
  overflow: hidden;
}

.hero-dashboard .hero-bg {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(4,10,20,.88) 0%, rgba(6,15,31,.78) 35%, rgba(9,26,56,.68) 72%, rgba(10,30,64,.74) 100%),
    linear-gradient(180deg, rgba(6,12,22,.14), rgba(6,12,22,.58)),
    url('/assets/img/hero-studio-bg.webp') center center / cover no-repeat;
  transform: scale(1.02);
}

.hero-dashboard::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 14% 36%, rgba(31,111,255,.28), transparent 24%),
    radial-gradient(circle at 82% 18%, rgba(86,166,255,.22), transparent 24%),
    radial-gradient(circle at 70% 74%, rgba(255,214,107,.08), transparent 16%);
  pointer-events: none;
}

.hero-dash-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: 1.6rem;
  align-items: start;
}

.hero-copy {
  padding: 1.4rem 0;
}

.hero-copy h1 {
  font-size: clamp(3rem, 6.2vw, 5.8rem);
  max-width: 10.5ch;
  text-wrap: balance;
}

.hero-copy .hero-lead {
  max-width: 58ch;
  color: #d5e0f3;
}

.hero-mini-points {
  margin-top: 1.5rem;
  display: grid;
  gap: .85rem;
}

.mini-point {
  padding: 1rem 1.05rem;
  border-radius: 18px;
  border: 1px solid rgba(115,175,255,.2);
  background: linear-gradient(180deg, rgba(12,22,40,.72), rgba(9,18,34,.56));
  backdrop-filter: blur(8px);
  box-shadow: 0 16px 28px rgba(0,0,0,.18);
}

.mini-point strong {
  display: block;
  margin-bottom: .25rem;
  color: #fff;
}

.mini-point span {
  color: #cdd8eb;
}

.growth-dashboard {
  border-radius: 30px;
  border: 1px solid rgba(113,174,255,.18);
  background: linear-gradient(180deg, rgba(8,18,36,.88), rgba(11,22,41,.76));
  box-shadow: 0 28px 70px rgba(0,8,20,.42);
  backdrop-filter: blur(12px);
  overflow: hidden;
}

.dashboard-head {
  padding: 1.5rem 1.5rem 1rem;
  border-bottom: 1px solid rgba(113,174,255,.12);
}

.dashboard-head h2 {
  margin: .25rem 0 .55rem;
  font-size: clamp(1.65rem, 2.6vw, 2.4rem);
  line-height: 1.04;
}

.dashboard-note {
  color: #c1cfe5;
  font-size: .98rem;
  max-width: 60ch;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: 1rem;
  padding: 1.35rem;
}

.dashboard-inputs {
  display: grid;
  gap: .95rem;
}

.dashboard-inputs label {
  padding: 1rem;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
  border: 1px solid rgba(113,174,255,.12);
}

.dashboard-inputs input[type="range"] {
  padding: 0;
  height: 8px;
  accent-color: var(--power-blue-2);
  background: transparent;
}

.field-row {
  margin-top: .6rem;
}

.field-row input[type="number"] {
  max-width: 170px;
  background: rgba(4,12,24,.56);
}

.toggle-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem;
}

.toggle-card {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .9rem 1rem;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.022));
  border: 1px solid rgba(113,174,255,.12);
  font-weight: 700;
  color: #eef4ff;
}

.toggle-card input {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--power-blue);
}

.dashboard-outputs {
  display: grid;
  gap: .95rem;
}

.output-panel {
  padding: 1.1rem 1.15rem;
  border-radius: 22px;
  border: 1px solid rgba(113,174,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
}

.current-state {
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
}

.improved-state {
  background: linear-gradient(180deg, rgba(23,76,173,.32), rgba(18,49,112,.24));
  box-shadow: 0 18px 38px rgba(31,111,255,.16);
}

.opportunity-panel {
  background: linear-gradient(135deg, rgba(15,43,95,.52), rgba(27,83,178,.22), rgba(255,214,107,.08));
}

.metric {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: baseline;
  padding: .82rem 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.metric:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.metric span {
  color: #c8d4e8;
  font-weight: 600;
}

.metric strong {
  color: #fff;
  font-size: clamp(1.05rem, 2vw, 1.5rem);
  text-align: right;
}

.process-intro-card,
.process-card,
.service-card,
.feature-card,
.pricing-card,
.cta-band,
.proof-card,
.stack-card,
.stat,
.showcase-panel {
  background: linear-gradient(180deg, rgba(10,20,38,.82), rgba(9,17,31,.68));
  border: 1px solid rgba(112,174,255,.12);
}

.eyebrow {
  background: linear-gradient(135deg, rgba(31,111,255,.18), rgba(86,166,255,.12), rgba(255,214,107,.08));
  border: 1px solid rgba(86,166,255,.24);
  color: #e7efff;
}

.kicker, .card-tag, .small-note {
  color: #ffd66b;
}

.process-card p,
.section-copy,
.feature-card p,
.service-card p,
.checklist li,
.clean-list li,
.tier-row span,
.hero-proof-grid span,
.proof-card span {
  color: #c8d4e7;
}

.feature-card::after {
  background: radial-gradient(circle, rgba(31,111,255,.28), transparent 66%);
}

.feature-card::before {
  background: radial-gradient(circle, rgba(86,166,255,.18), transparent 68%);
}

.cta-band {
  background: linear-gradient(135deg, rgba(12,30,63,.92), rgba(18,56,119,.84), rgba(255,214,107,.08));
}

.site-footer {
  background: linear-gradient(180deg, rgba(5,10,20,.58), rgba(4,8,16,.92));
}

.hero-showcase,
.showcase-stack,
.hero-proof-grid {
  display: none;
}

.brand-wordmark {
  display: none;
}

@media (max-width: 1100px) {
  .hero-dash-grid,
  .dashboard-grid {
    grid-template-columns: 1fr;
  }

  .hero-copy h1 {
    max-width: 12ch;
  }
}

@media (max-width: 780px) {
  .hero-dashboard {
    padding-top: 7rem;
  }

  .toggle-grid {
    grid-template-columns: 1fr;
  }

  .metric {
    flex-direction: column;
    align-items: flex-start;
  }

  .metric strong {
    text-align: left;
  }
}


.hero-home{position:relative;overflow:hidden;isolation:isolate;}
.hero-home .container{position:relative;z-index:2;}
.hero-home::after{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 34%, rgba(41,108,255,.22), transparent 24%),
    radial-gradient(circle at 82% 18%, rgba(255,207,85,.10), transparent 18%),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(2,8,18,.18));
  z-index:1;
}
.hero-dashboard{padding-top:6.6rem;}
.growth-dashboard,.process-intro-card,.process-card,.feature-card,.service-card,.showcase-panel,.proof-card,.stack-card,.stat,.cta-band,.tier-row{
  backdrop-filter: blur(12px);
}
.growth-dashboard,.process-intro-card,.process-card,.feature-card,.service-card,.showcase-panel,.proof-card,.stack-card,.stat,.tier-row{
  background: linear-gradient(180deg, rgba(8,22,46,.76), rgba(7,18,38,.68));
  border-color: rgba(108,171,255,.14);
}
.dashboard-head,.output-panel,.dashboard-inputs label,.toggle-card{
  background: linear-gradient(180deg, rgba(6,18,38,.42), rgba(6,18,38,.22));
}
.eyebrow{
  background: linear-gradient(135deg, rgba(30,93,224,.16), rgba(255,207,85,.10), rgba(95,163,255,.10));
  border:1px solid rgba(89,165,255,.30);
  color:#eaf2ff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 10px 24px rgba(36,102,227,.12);
}
.hero h1,.page-hero h1{max-width:10.5ch;text-wrap:balance;}
.hero-copy{max-width:680px;}
.hero-lead,.section-copy,.process-card p,.mini-point span,.dashboard-note,.metric span,.service-card p,.feature-card p,.proof-card p,.stack-card p,.clean-list li,.checklist li{color:#d6e1f1;}
.nav-link.active,.nav-link:hover,.topbar a:hover{color:#ffffff;}
.topbar a{color:#ffe3a0;}
.growth-dashboard .kicker,.card-tag{color:#ffcf55;}
.metric strong,.output-panel strong,.proof-card strong,.stack-card strong,.tier-row strong{color:#fff;}
.btn-primary{color:#fff;}
.btn-secondary{background: linear-gradient(135deg, rgba(255,255,255,.05), rgba(43,112,255,.14), rgba(255,255,255,.04));}
.btn-secondary:hover{border-color: rgba(255,207,85,.22);}
.site-header::after{background: linear-gradient(90deg, rgba(31,101,216,.44), rgba(255,207,85,.16), rgba(89,165,255,.34));}
.process-grid,.grid-3,.grid-4{align-items:stretch;}
.site-footer{background: linear-gradient(180deg, rgba(4,11,25,.72), rgba(4,11,25,.96));}
@media (max-width: 980px){
  .hero-home::before{
    background:
      linear-gradient(180deg, rgba(2,8,20,.84), rgba(4,12,28,.78)),
      url('/assets/img/hero-studio-bg.webp') center/cover no-repeat;
  }
}