:root {
  --navy-950:#041329;
  --navy-900:#061a3a;
  --navy-800:#0a2855;
  --blue:#1478e8;
  --teal:#00aaa8;
  --teal-dark:#087579;
  --teal-soft:#dff8f6;
  --gold:#f7b82b;
  --ink:#10213a;
  --muted:#58687d;
  --line:#dce5ef;
  --mist:#f3f7fb;
  --white:#fff;
  --shadow:0 22px 60px rgba(4,19,41,.13);
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--white); font-family:"DM Sans",sans-serif; font-size:16px; line-height:1.65; }
a { color:inherit; }
.wrap { width:min(1040px,calc(100% - 40px)); margin-inline:auto; }

header { position:sticky; top:0; z-index:20; background:rgba(255,255,255,.96); border-bottom:1px solid var(--line); backdrop-filter:blur(14px); }
.nav { min-height:64px; display:flex; align-items:center; justify-content:space-between; gap:21px; }
.brand { width:200px; display:flex; align-items:center; }
.brand img { display:block; width:100%; height:auto; }
.nav-links { display:flex; align-items:center; justify-content:flex-end; gap:18px; }
.nav-links a { color:#30445e; font-weight:700; text-decoration:none; }
.nav-links a:hover,.nav-links a:focus-visible,.nav-links a[aria-current="page"] { color:var(--teal-dark); }
.nav-links .contact { padding:8px 13px; border-radius:8px; background:var(--navy-900); color:white; }
.development-note { padding:8px 20px; border-top:1px solid #c9ecea; background:#e8f8f7; color:#075b60; font-size:.86rem; font-weight:600; text-align:center; }

.page-hero { position:relative; overflow:hidden; padding:56px 0 52px; background:linear-gradient(120deg,#f5faff 0%,#fff 60%,#e8f9f7 100%); }
.page-hero::after { content:""; position:absolute; width:460px; height:460px; right:-240px; top:-280px; border:66px solid rgba(0,170,168,.08); border-radius:50%; }
.breadcrumb { margin-bottom:25px; color:#67788d; font-size:.88rem; }
.breadcrumb a { color:var(--teal-dark); font-weight:700; text-decoration:none; }
.eyebrow { display:inline-flex; align-items:center; gap:10px; color:var(--navy-800); font-size:.8rem; font-weight:800; letter-spacing:.075em; text-transform:uppercase; }
.eyebrow::before { content:""; width:25px; height:3px; border-radius:4px; background:var(--gold); }
h1,h2,h3 { margin-top:0; color:var(--navy-950); font-family:"Manrope",sans-serif; line-height:1.15; }
h1 { max-width:820px; margin:15px 0 18px; font-size:clamp(2.2rem,4vw,3.35rem); letter-spacing:-.045em; }
h2 { margin-bottom:13px; font-size:clamp(1.65rem,3vw,2.35rem); letter-spacing:-.035em; }
h3 { margin-bottom:9px; font-size:1.2rem; }
.lead { max-width:760px; margin:0; color:#43576f; font-size:1.04rem; }
.source-note { max-width:850px; margin-top:29px; padding:14px 17px; border-left:3px solid var(--gold); background:rgba(255,255,255,.85); color:#596b7f; font-size:.88rem; }
.page-hero-grid { position:relative; display:grid; grid-template-columns:1.25fr .55fr; gap:42px; align-items:center; }
.page-hero-grid.single { grid-template-columns:1fr; }
.page-hero-grid h1 { font-size:clamp(2.15rem,3.5vw,3rem); }
.editorial-photo { width:100%; justify-self:center; overflow:hidden; margin:0; border:1px solid rgba(187,205,222,.8); border-radius:17px; background:white; box-shadow:var(--shadow); }
.editorial-photo img { display:block; width:100%; aspect-ratio:1024/717; object-fit:cover; }

section { padding:62px 0; }
.section-heading { max-width:740px; margin-bottom:29px; }
.section-kicker { margin:0 0 10px; color:var(--teal-dark); font-size:.79rem; font-weight:800; letter-spacing:.075em; text-transform:uppercase; }
.section-heading>p:last-child { margin:0; color:var(--muted); font-size:1rem; }
.mist { background:var(--mist); }
.navy { background:var(--navy-950); color:white; }
.navy h2,.navy h3 { color:white; }
.navy .section-heading>p:last-child { color:#b9c9da; }

.stat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:11px; }
.stat { padding:18px; border:1px solid var(--line); border-radius:12px; background:white; }
.stat span { display:block; color:#64758a; font-size:.77rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.stat strong { display:block; margin-top:5px; color:var(--navy-950); font-family:"Manrope",sans-serif; font-size:1.35rem; }
.stat small { display:block; margin-top:3px; color:#77879a; }

.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.cards.two { grid-template-columns:repeat(2,1fr); }
.cards.one { grid-template-columns:1fr; }
.card { padding:20px; border:1px solid var(--line); border-radius:12px; background:white; }
.card p { margin:0; color:var(--muted); }
.card .num { width:42px; height:42px; display:grid; place-items:center; margin-bottom:18px; border-radius:10px; background:var(--teal-soft); color:var(--teal-dark); font-family:"Manrope",sans-serif; font-weight:800; }
.navy .card { border-color:rgba(187,211,229,.22); background:#0a2348; }
.navy .card p { color:#bed0e2; }
.objective-workflow-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; width:100%; }
.objective-workflow-column { width:100%; max-width:260px; justify-self:center; }
.objective-workflow-column .card { width:100%; min-height:218px; padding:0; border:0; border-radius:0; background:transparent; }
.objective-workflow-column .card .num { width:auto; height:auto; display:block; margin:0 0 18px; border-radius:0; background:transparent; }
.objective-workflow-column figure { width:100%; overflow:hidden; margin:24px 0 0; background:white; }
.objective-workflow-column img { display:block; width:100%; height:auto; object-fit:contain; }
.objective-workflow-column figcaption { min-height:48px; display:flex; align-items:center; justify-content:center; padding:9px 8px; color:var(--navy-800); font-size:.875rem; font-weight:700; line-height:1.25; text-align:center; }

.split { display:grid; grid-template-columns:.88fr 1.12fr; gap:49px; align-items:start; }
.sticky { position:sticky; top:118px; }
.sticky p { color:var(--muted); }
.steps { display:grid; gap:0; }
.step { position:relative; display:grid; grid-template-columns:44px 1fr; gap:15px; padding-bottom:21px; }
.step:not(:last-child)::before { content:""; position:absolute; top:43px; bottom:0; left:21px; width:2px; background:#cbd9e5; }
.step-num { z-index:1; width:44px; height:44px; display:grid; place-items:center; border-radius:50%; background:var(--navy-900); color:white; font-family:"Manrope",sans-serif; font-weight:800; }
.step p { margin:0; color:var(--muted); }

.budget { overflow:hidden; border:1px solid var(--line); border-radius:14px; background:white; }
.budget-row { display:grid; grid-template-columns:1fr 1.35fr auto; gap:16px; padding:13px 16px; border-bottom:1px solid var(--line); align-items:center; }
.budget-row:last-child { border-bottom:0; }
.budget-row.head { background:var(--navy-900); color:white; font-size:.78rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.budget-row strong:last-child { color:var(--navy-950); font-family:"Manrope",sans-serif; }
.budget-row.total { background:#eff9f8; }
.budget-row.total strong { color:#075b60; }

.formula { padding:21px; border:1px solid #b9dbd9; border-radius:13px; background:#f0fbfa; }
.formula strong { color:#075b60; }
.equation { margin:17px 0; padding:16px; border-radius:9px; background:white; color:var(--navy-900); font-family:"Manrope",sans-serif; font-size:1.05rem; font-weight:700; }
.warning { margin-top:18px; padding:16px 18px; border-left:3px solid var(--gold); background:#fffaf0; color:#66573a; }

.value-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.value-card { padding:20px; border-top:4px solid var(--teal); border-radius:12px; background:white; box-shadow:0 12px 35px rgba(6,26,58,.08); }
.value-card p { margin:0; color:var(--muted); }

.kpi-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px 28px; margin:0; padding:0; list-style:none; }
.kpi-grid li { position:relative; padding:12px 12px 12px 35px; border-bottom:1px solid var(--line); color:#435870; }
.kpi-grid li::before { content:"✓"; position:absolute; left:5px; color:var(--teal-dark); font-weight:900; }

.calculator { display:grid; grid-template-columns:.85fr 1.15fr; gap:19px; padding:20px; border-radius:15px; background:white; color:var(--ink); box-shadow:var(--shadow); }
.inputs { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
label { color:#4e6178; font-size:.84rem; font-weight:700; }
input { width:100%; margin-top:5px; padding:12px; border:1px solid #bfcddd; border-radius:8px; background:white; color:var(--navy-950); font:inherit; font-weight:700; }
input:focus { outline:3px solid rgba(20,120,232,.2); border-color:var(--blue); }
.results { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.result { padding:14px; border-radius:10px; background:var(--mist); }
.result span { display:block; color:#64758a; font-size:.76rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.result strong { display:block; margin-top:4px; color:var(--navy-950); font-family:"Manrope",sans-serif; font-size:1.3rem; }
.result.highlight { background:var(--teal-soft); }
.result.highlight strong { color:#075b60; }

.benchmark-table { overflow:hidden; border:1px solid var(--line); border-radius:13px; }
.benchmark-row { display:grid; grid-template-columns:1fr 1fr 1.2fr; gap:16px; padding:12px 16px; border-bottom:1px solid var(--line); }
.benchmark-row:last-child { border-bottom:0; }
.benchmark-row.head { background:var(--navy-900); color:white; font-size:.78rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.benchmark-row:not(.head) strong { color:var(--navy-950); }

.callout { padding:24px; border-radius:14px; background:var(--navy-900); color:white; }
.callout h2,.callout h3 { color:white; }
.callout p { color:#c5d4e4; }
.button { display:inline-flex; min-height:44px; align-items:center; justify-content:center; padding:10px 17px; border-radius:8px; background:var(--gold); color:var(--navy-950); font-weight:800; text-decoration:none; }
.button.secondary { border:1px solid #b7c7d8; background:white; color:var(--navy-900); }

footer { padding:33px 0; border-top:1px solid var(--line); }
.footer-grid { display:grid; grid-template-columns:auto 1fr auto; gap:13px 28px; align-items:center; color:#64758a; font-size:.88rem; }
.footer-brand { color:var(--navy-900); font-family:"Manrope",sans-serif; font-weight:800; }
.footer-address { grid-column:1/-1; margin:0; padding-top:12px; border-top:1px solid #e8eef4; font-style:normal; }

:focus-visible { outline:3px solid rgba(20,120,232,.35); outline-offset:3px; }

@media (max-width:1100px) {
  .nav { align-items:flex-start; flex-direction:column; padding:14px 0; }
  .nav-links { width:100%; justify-content:flex-start; flex-wrap:wrap; gap:10px 18px; }
  .page-hero { padding-top:58px; }
  .stat-grid { grid-template-columns:repeat(2,1fr); }
  .cards,.cards.two,.value-grid { grid-template-columns:1fr; }
  .split,.calculator,.page-hero-grid { grid-template-columns:1fr; gap:38px; }
  .sticky { position:static; }
  .editorial-photo { max-width:360px; }
}

@media (max-width:720px) {
  .objective-workflow-grid { grid-template-columns:1fr; gap:34px; }
}

@media (max-width:600px) {
  .wrap { width:min(100% - 28px,1120px); }
  .brand { width:185px; }
  .nav-links { font-size:.9rem; }
  .nav-links .contact { width:100%; }
  section { padding:54px 0; }
  .stat-grid,.inputs,.results { grid-template-columns:1fr; }
  .objective-workflow-column figcaption { min-height:42px; padding:7px 4px; font-size:.8rem; }
  .budget-row,.benchmark-row { grid-template-columns:1fr; gap:3px; }
  .budget-row.head,.benchmark-row.head { display:none; }
  .kpi-grid { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; align-items:start; }
  .footer-address { grid-column:1; width:100%; }
}
