
:root{
  --orange:#FF8A2B;
  --coral:#FF5A6A;
  --magenta:#C63AB7;
  --purple:#6A3BD3;
  --indigo:#2D5BDB;
  --teal:#18B7C5;

  --ink:#0B1220;
  --slate:#334155;
  --muted:#64748b;

  --bg:#ffffff;
  --mist:#F6F7FB;
  --line:#E7EAF3;

  --radius-xl:24px;
  --radius-lg:18px;
  --shadow:0 10px 30px rgba(2,6,23,.08);
  --shadow-sm:0 6px 18px rgba(2,6,23,.06);

  --grad: linear-gradient(120deg, var(--orange) 0%, var(--magenta) 35%, var(--purple) 60%, var(--indigo) 82%, var(--teal) 100%);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  color:var(--ink);
  background:
    radial-gradient(900px 500px at 10% 10%, rgba(255,138,43,.12), transparent 60%),
    radial-gradient(900px 500px at 90% 20%, rgba(24,183,197,.12), transparent 60%),
    radial-gradient(900px 500px at 70% 90%, rgba(198,58,183,.10), transparent 60%),
    #fff;
}

img{max-width:100%;height:auto}
a{color:inherit}
.container{max-width:1120px;margin:0 auto;padding:0 16px}

.topbar{
  border-bottom:1px solid #eef2f7;
  background:rgba(255,255,255,.72);
  backdrop-filter: blur(10px);
}
.topbar .row{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; padding:10px 0; font-size:14px; color:var(--slate);
}
.badge{
  display:inline-flex; align-items:center; gap:10px;
  border:1px solid #e5e7eb; background:#fff;
  border-radius:999px; padding:6px 12px; font-weight:600;
  box-shadow: var(--shadow-sm);
}
.dot{width:10px;height:10px;border-radius:999px;display:inline-block;background:var(--teal)}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:999px; padding:12px 18px;
  font-weight:700; text-decoration:none; border:1px solid transparent;
  box-shadow: var(--shadow-sm);
}
.btn-primary{color:#fff;background-image:var(--grad)}
.btn-outline{background:#fff;border-color:#e5e7eb}
.btn:hover{transform: translateY(-1px)}
.btn:active{transform: translateY(0)}

.site-header{
  position:sticky; top:0; z-index:50;
  border-bottom:1px solid #eef2f7;
  background:rgba(255,255,255,.84);
  backdrop-filter: blur(10px);
}
.site-header .row{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 0; gap:12px;
}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.logo{
  width:44px;height:44px;border-radius:14px;overflow:hidden;
  border:1px solid #e5e7eb;background:#fff;
  box-shadow: var(--shadow-sm);
  display:flex; align-items:center; justify-content:center;
}
.brand .title{font-weight:900;letter-spacing:-.02em;line-height:1.1}
.brand .sub{font-size:12px;color:var(--muted);margin-top:2px}

.nav{
  display:flex; gap:22px; align-items:center;
  font-size:14px; font-weight:700; color:var(--slate);
}
.nav a{text-decoration:none}
.nav a:hover{color:var(--ink)}
.menu-toggle{
  display:none;
  border:1px solid #e5e7eb; background:#fff; border-radius:14px;
  padding:10px 12px; font-weight:900; box-shadow: var(--shadow-sm);
}
.mobile-nav{
  display:none;
  border-top:1px solid #eef2f7;
  background:#fff;
}
.mobile-nav a{
  display:block;
  padding:14px 14px;
  border:1px solid #f1f5f9;
  border-radius:16px;
  background:#f8fafc;
  text-decoration:none;
  font-weight:800;
}

.hero{
  margin-top:18px;
  border:1px solid #eef2f7;
  border-radius: var(--radius-xl);
  background:#fff;
  box-shadow: var(--shadow);
  overflow:hidden;
  position:relative;
}
.hero::before{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.92), rgba(255,255,255,.70));
  z-index:1;
}
.hero .bg{
  position:absolute; inset:0;
  background-size:cover;
  background-position:center;
  opacity:.10;
}
.hero .blob1, .hero .blob2{
  position:absolute; border-radius:999px; filter: blur(60px);
  z-index:1;
}
.hero .blob1{right:-120px; top:-120px; width:340px; height:340px; background:rgba(24,183,197,.18)}
.hero .blob2{left:-120px; bottom:-140px; width:420px; height:420px; background:rgba(198,58,183,.14)}
.hero .grid{
  position:relative; z-index:2;
  display:grid; gap:28px;
  padding:28px;
}
@media(min-width:900px){
  .hero .grid{grid-template-columns: 1.2fr .9fr; padding:44px}
}
.kicker{
  display:inline-flex; align-items:center; gap:10px;
  border:1px solid #e5e7eb; background:#fff;
  border-radius:999px; padding:8px 12px;
  font-size:12px; font-weight:800; color:var(--slate);
  box-shadow: var(--shadow-sm);
}
.kicker .spark{color:var(--purple)}
.h1{
  margin:14px 0 0;
  font-size:36px; line-height:1.05; letter-spacing:-.03em;
  font-weight:950;
}
@media(min-width:640px){.h1{font-size:44px}}
.grad-text{background-image:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.p{
  margin:14px 0 0;
  font-size:16px; line-height:1.6; color:var(--slate);
}
.actions{margin-top:20px; display:flex; gap:10px; flex-wrap:wrap}
.stats{
  margin-top:18px;
  display:grid; gap:10px;
}
@media(min-width:640px){.stats{grid-template-columns:repeat(3,1fr)}}
.card{
  border:1px solid #eef2f7; background:#fff;
  border-radius:22px; padding:18px;
  box-shadow: var(--shadow-sm);
}
.stat-label{font-size:12px; font-weight:800; color:var(--muted)}
.stat-value{margin-top:6px; display:flex; align-items:center; gap:10px; font-weight:900}
.section{margin-top:54px}
.section .eyebrow{font-size:12px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; color:var(--muted)}
.section .h2{margin:10px 0 0; font-size:28px; letter-spacing:-.02em; font-weight:950}
@media(min-width:640px){.section .h2{font-size:34px}}
.section .sub{margin-top:10px; font-size:14px; line-height:1.7; color:var(--slate); max-width:760px}
.grid{
  display:grid; gap:14px;
}
@media(min-width:640px){.grid.cols-2{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.grid.cols-3{grid-template-columns:repeat(3,1fr)} .grid.cols-4{grid-template-columns:repeat(4,1fr)}}
.pill{
  display:inline-flex; align-items:center;
  border-radius:999px;
  padding:7px 10px;
  font-size:12px; font-weight:900;
  color:#fff; background-image:var(--grad);
}
.service-title{font-size:18px;font-weight:950}
.service-text{margin-top:10px;color:var(--slate);font-size:14px;line-height:1.6}
.split{
  display:grid; gap:16px;
}
@media(min-width:1024px){.split{grid-template-columns:1fr 1fr}}
.avatar{
  width:56px;height:56px;border-radius:18px;overflow:hidden;border:1px solid #e5e7eb;background:#fff;
}
.person-title{font-weight:950;font-size:18px}
.person-sub{color:var(--muted);font-size:13px;margin-top:2px}
ul.clean{margin:12px 0 0; padding-left:18px; color:var(--slate)}
ul.clean li{margin:8px 0; line-height:1.5}
.form{
  display:grid; gap:12px;
}
.field label{display:block; font-size:12px; font-weight:900; color:var(--muted); margin-bottom:6px}
.field input,.field select,.field textarea{
  width:100%;
  border:1px solid #e5e7eb;
  border-radius:18px;
  padding:12px 14px;
  font-size:14px;
  box-shadow: var(--shadow-sm);
  outline:none;
}
.field textarea{min-height:140px; resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#cbd5e1}
.notice{
  background:#f8fafc; border:1px solid #eef2f7; border-radius:22px; padding:16px;
}
.footer{
  margin-top:50px;
  border-top:1px solid #eef2f7;
  background:#fff;
}
.footer .row{
  padding:40px 0;
  display:grid; gap:22px;
}
@media(min-width:900px){.footer .row{grid-template-columns:1.2fr 1fr 1fr}}
.small{font-size:12px; color:var(--muted)}
hr.soft{border:none;border-top:1px solid #eef2f7;margin:18px 0}

/* Utilities */
.hide-sm{display:none}
@media(min-width:640px){.hide-sm{display:inline-flex}}
