:root {
  --bg: #f8fafc;
  --surface: #ffffff;
  --ink: #0b2d42;
  --muted: #64748b;
  --line: #e0e7ec;
  --brand: #2e8b7d;
  --brand-dark: #246f65;
  --accent: #e3f2ef;
  --navy: #0b2d42;
  --shadow: 0 20px 60px rgba(14, 45, 59, 0.10);
  --radius: 22px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--bg);
  line-height: 1.6;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
.container { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: rgba(245,248,251,0.92);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(220,229,234,0.85);
}
.nav-wrap { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 11px; font-weight: 700; letter-spacing: -0.02em; }
.brand-symbol { width: 44px; height: 44px; flex: 0 0 44px; object-fit: contain; }
.brand-wordmark { display: grid; gap: 2px; line-height: 1; }
.brand-wordmark-main { color: var(--navy); font-size: 18px; font-weight: 800; letter-spacing: -0.035em; }
.brand-wordmark-sub { color: var(--muted); font-size: 8px; font-weight: 700; letter-spacing: .34em; padding-left: 1px; }
.site-nav { display: flex; align-items: center; gap: 28px; font-size: 14px; font-weight: 600; }
.site-nav a { color: #30454f; }
.site-nav a:hover { color: var(--brand); }
.nav-cta { padding: 11px 16px; border: 1px solid #b7c9cf; border-radius: 12px; background: white; }
.menu-toggle { display:none; background:transparent; border:1px solid var(--line); border-radius:10px; padding:8px 12px; font-weight:700; }

.hero { padding: 92px 0 72px; overflow: hidden; position: relative; }
.hero::before { content:""; position:absolute; width:520px; height:520px; border-radius:50%; background:radial-gradient(circle, rgba(55,170,166,.16), rgba(55,170,166,0)); right:-160px; top:-180px; pointer-events:none; }
.hero-grid { display:grid; grid-template-columns: 1.15fr .85fr; gap:72px; align-items:center; }
.eyebrow { margin:0 0 12px; color:var(--brand); text-transform:uppercase; letter-spacing:.14em; font-size:12px; font-weight:800; }
.eyebrow.light { color:#83d2ce; }
h1,h2,h3,h4 { line-height:1.12; letter-spacing:-.04em; margin-top:0; }
h1 { font-size:clamp(46px,6vw,76px); max-width:780px; margin-bottom:24px; }
h1 span { color:var(--brand); }
h2 { font-size:clamp(34px,4vw,52px); margin-bottom:18px; }
h3 { font-size:24px; margin-bottom:14px; }
h4 { font-size:18px; margin-bottom:10px; }
.hero-lead { max-width:720px; font-size:19px; color:var(--muted); margin:0 0 30px; }
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:30px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 19px; border-radius:13px; font-weight:700; font-size:14px; border:1px solid transparent; cursor:pointer; }
.button.primary { background:var(--brand); color:white; box-shadow:0 12px 30px rgba(12,107,111,.20); }
.button.primary:hover { background:var(--brand-dark); }
.button.secondary { background:white; border-color:var(--line); }
.button.small { min-height:42px; padding:0 15px; font-size:13px; }
.button.full { width:100%; }
.hero-proof { display:flex; gap:9px; flex-wrap:wrap; }
.hero-proof span, .tech-stack span, .case-outcomes span, .stat-chips span, .outcome-list span { border:1px solid var(--line); background:white; padding:7px 10px; border-radius:999px; font-size:12px; font-weight:700; color:#425660; }

.hero-panel { background:linear-gradient(180deg,#102f38,#0c222d); color:white; padding:28px; border-radius:28px; box-shadow:var(--shadow); position:relative; }
.panel-label { font-size:12px; text-transform:uppercase; letter-spacing:.14em; color:#8bd5d2; font-weight:800; margin-bottom:24px; }
.flow-step { display:grid; grid-template-columns:40px 1fr; gap:14px; align-items:start; }
.flow-step b { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; background:rgba(126,211,206,.12); color:#8bd5d2; font-size:11px; }
.flow-step strong { display:block; font-size:16px; margin-bottom:2px; }
.flow-step span { display:block; color:#a8b9bf; font-size:13px; }
.flow-line { width:1px; height:28px; background:rgba(255,255,255,.14); margin:5px 0 5px 17px; }

.trust-strip { padding:0 0 30px; }
.trust-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:18px; overflow:hidden; }
.trust-grid > div { background:white; padding:22px 24px; }
.trust-grid strong { display:block; font-size:14px; margin-bottom:4px; }
.trust-grid span { color:var(--muted); font-size:13px; }

.section { padding:100px 0; }
.section.alt { background:#eef4f6; }
.section.dark { background:var(--navy); color:white; }
.section-heading { max-width:760px; margin-bottom:44px; }
.section-heading.narrow { max-width:680px; }
.section-heading > p:last-child { color:var(--muted); font-size:18px; margin:0; }
.card-grid { display:grid; gap:20px; }
.services-grid { grid-template-columns:repeat(3,1fr); }
.service-card { background:white; border:1px solid var(--line); border-radius:var(--radius); padding:30px; position:relative; box-shadow:0 6px 24px rgba(16,33,43,.04); }
.service-card.featured { border-color:#b3deda; }
.service-number { color:var(--brand); font-size:12px; font-weight:800; letter-spacing:.1em; margin-bottom:34px; }
.service-card p { color:var(--muted); }
.service-card ul { padding-left:18px; color:#334a55; margin:24px 0; }
.service-card li { margin:7px 0; }
.service-card a { color:var(--brand); font-weight:700; font-size:14px; }

.case-list { display:grid; gap:22px; }
.case-card { background:white; border:1px solid var(--line); border-radius:var(--radius); padding:30px; box-shadow:0 8px 28px rgba(16,33,43,.04); }
.case-meta { color:var(--brand); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; margin-bottom:20px; }
.case-content { display:grid; grid-template-columns:1.35fr .65fr; gap:40px; align-items:end; }
.case-content p { color:var(--muted); }
.case-problem { margin-bottom:8px; }
.case-outcomes { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.detailed-case { align-items:start; grid-template-columns:1.45fr .55fr; }
.case-main > p { max-width:820px; }
.case-detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:24px; }
.case-detail { border:1px solid #e0e8ec; background:#f8fbfc; border-radius:16px; padding:18px; }
.case-detail > strong, .case-label { display:block; color:#193843; font-size:13px; font-weight:800; margin-bottom:9px; }
.case-detail ul { margin:0; padding-left:18px; color:#536772; font-size:14px; }
.case-detail li { margin:7px 0; }
.case-side { border-left:1px solid var(--line); padding-left:28px; }
.case-architecture { font-size:13px; line-height:1.7; color:#3b5661; font-weight:700; background:var(--accent); border-radius:14px; padding:14px 16px; margin-bottom:18px; }
.case-architecture span { color:var(--brand); padding:0 3px; }
.case-side .case-outcomes { justify-content:flex-start; }
.case-actions { margin-top:22px; }

.process-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:70px; align-items:start; }
.sticky-heading { position:sticky; top:120px; margin-bottom:0; }
.process-list { display:grid; gap:12px; }
.process-list article { display:grid; grid-template-columns:55px 1fr; gap:20px; border-top:1px solid var(--line); padding:24px 0; }
.process-list article:first-child { border-top:0; padding-top:0; }
.process-list span { width:44px; height:44px; border-radius:14px; display:grid; place-items:center; background:var(--accent); color:var(--brand-dark); font-weight:800; font-size:12px; }
.process-list h3 { margin-bottom:7px; font-size:21px; }
.process-list p { margin:0; color:var(--muted); }

.about-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:80px; }
.dark h2 { color:white; }
.about-copy p { color:#bfd0d6; font-size:17px; }
.tech-stack { display:flex; gap:8px; flex-wrap:wrap; margin-top:26px; }
.tech-stack span { background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.15); color:#dce9ed; }

.contact-section { background:linear-gradient(180deg,#f5f8fb,#edf4f5); }
.contact-card { background:white; border:1px solid var(--line); border-radius:30px; padding:44px; display:grid; grid-template-columns:1fr .85fr; gap:60px; box-shadow:var(--shadow); }
.contact-card > div > p:last-child { color:var(--muted); font-size:17px; }
.contact-form { display:grid; gap:14px; }
.contact-form label { font-size:13px; font-weight:700; color:#30454f; }
.contact-form input, .contact-form textarea { width:100%; margin-top:6px; border:1px solid #cbd8de; border-radius:12px; padding:12px 13px; font:inherit; background:#fbfdfe; }
.contact-form input:focus, .contact-form textarea:focus { outline:2px solid rgba(12,107,111,.16); border-color:var(--brand); }
.form-note { margin:0; color:#768790; font-size:11px; }

.site-footer { background:#091923; color:white; padding:36px 0; }
.footer-grid { display:grid; grid-template-columns:1fr auto; gap:20px 40px; align-items:center; }
.footer-brand .brand-wordmark-main { color:#f8fafc; }
.footer-brand .brand-wordmark-sub { color:#a9d9d1; }
.footer-brand .brand-symbol { width:46px; height:46px; }
.footer-grid p { color:#9db0b7; font-size:13px; margin-bottom:0; }
.footer-links { display:flex; gap:20px; font-size:13px; color:#c0d0d5; }
.legal { grid-column:1/-1; border-top:1px solid rgba(255,255,255,.1); padding-top:20px; }

/* Case study pages */
.case-hero {
  padding: 86px 0 34px;
  background: linear-gradient(180deg, #f5f8fb 0%, #eef4f6 100%);
}
.breadcrumbs { display:flex; flex-wrap:wrap; gap:10px; font-size:13px; color:#65808b; margin-bottom:18px; }
.breadcrumbs span { color:#8da1ab; }
.case-hero-grid { display:grid; grid-template-columns: 1.15fr .85fr; gap:40px; align-items:start; }
.case-hero-copy p { color:var(--muted); font-size:18px; max-width:760px; }
.case-summary { background:white; border:1px solid var(--line); border-radius:22px; padding:24px; box-shadow:var(--shadow); }
.case-summary-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px; margin-top:16px; }
.summary-item { padding:14px; border-radius:16px; background:#f8fbfc; border:1px solid #e2eaee; }
.summary-item strong { display:block; font-size:12px; color:var(--brand); text-transform:uppercase; letter-spacing:.08em; margin-bottom:5px; }
.summary-item span { display:block; font-weight:700; color:#20404a; }
.stat-chips { display:flex; gap:8px; flex-wrap:wrap; margin-top:18px; }

.case-study-layout { display:grid; gap:24px; }
.case-section-card { background:white; border:1px solid var(--line); border-radius:24px; padding:30px; box-shadow:0 8px 28px rgba(16,33,43,.04); }
.section-kicker { color:var(--brand); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.1em; margin-bottom:10px; }
.two-col { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.insight-box { border:1px solid #e0e8ec; background:#f8fbfc; border-radius:18px; padding:20px; }
.insight-box p:last-child { margin-bottom:0; }
.insight-box ul { margin:10px 0 0; padding-left:18px; color:#51646f; }
.insight-box li { margin:7px 0; }

.before-after-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.before-card, .after-card { border:1px solid #dbe5e9; border-radius:20px; padding:22px; }
.before-card { background:#fff9f5; }
.after-card { background:#f4fbfa; }
.before-card h4, .after-card h4 { margin-bottom:8px; }
.before-card ul, .after-card ul { margin:0; padding-left:18px; color:#536772; }
.before-card li, .after-card li { margin:8px 0; }
.label-badge { display:inline-block; padding:6px 10px; border-radius:999px; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; margin-bottom:12px; }
.before-card .label-badge { background:#ffe8da; color:#9a4f14; }
.after-card .label-badge { background:#d7f3ee; color:#0b635d; }

.workflow-diagram { display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; align-items:stretch; }
.flow-box { background:#f8fbfc; border:1px solid #dfe8ed; border-radius:18px; padding:18px; position:relative; min-height:170px; }
.flow-box strong { display:block; font-size:14px; margin-bottom:8px; color:#193843; }
.flow-box p { color:#566a75; font-size:14px; margin:0; }
.flow-box::after {
  content:"→";
  position:absolute;
  right:-12px;
  top:50%;
  transform:translateY(-50%);
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:var(--brand);
  color:white;
  font-size:12px;
  font-weight:800;
}
.workflow-diagram .flow-box:last-child::after { display:none; }

.dashboard-shell { border:1px solid #dce5ea; background:#f7fafb; border-radius:22px; overflow:hidden; }
.dashboard-topbar { background:#102f38; color:white; padding:16px 18px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.dashboard-topbar strong { font-size:15px; }
.dashboard-topbar span { color:#b9d1d8; font-size:13px; }
.dashboard-body { padding:18px; display:grid; gap:18px; }
.dashboard-kpis { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px; }
.kpi-card { background:white; border:1px solid #dce5ea; border-radius:18px; padding:16px; }
.kpi-card small { display:block; color:#667c86; font-size:12px; text-transform:uppercase; letter-spacing:.06em; margin-bottom:10px; }
.kpi-card strong { display:block; font-size:28px; letter-spacing:-.03em; }
.kpi-card span { display:block; color:#58717c; font-size:13px; margin-top:6px; }
.dashboard-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:14px; }
.chart-card, .table-card { background:white; border:1px solid #dce5ea; border-radius:18px; padding:16px; }
.chart-title, .table-title { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:14px; }
.chart-title strong, .table-title strong { font-size:14px; }
.chart-title span, .table-title span { font-size:12px; color:#6e838d; }
.bar-chart { display:flex; align-items:flex-end; gap:10px; height:170px; padding:10px 4px 0; }
.bar { flex:1; background:linear-gradient(180deg, #76d3c2 0%, #0c6b6f 100%); border-radius:12px 12px 4px 4px; position:relative; min-width:24px; }
.bar::after { content:attr(data-label); position:absolute; bottom:-24px; left:50%; transform:translateX(-50%); font-size:11px; color:#6f848e; }
.mini-donut { width:180px; height:180px; margin:10px auto 0; border-radius:50%; background: conic-gradient(#0c6b6f 0 68%, #7ed8ca 68% 84%, #dceff0 84% 100%); position:relative; }
.mini-donut::after { content:"68%\ALive SLA"; white-space:pre; position:absolute; inset:26px; background:white; border-radius:50%; display:grid; place-items:center; font-weight:800; color:#15343f; text-align:center; line-height:1.2; }
.synthetic-table { width:100%; border-collapse:collapse; font-size:13px; }
.synthetic-table th, .synthetic-table td { text-align:left; padding:10px 8px; border-bottom:1px solid #ebf0f2; }
.synthetic-table th { color:#6a7f89; font-size:12px; text-transform:uppercase; letter-spacing:.06em; }
.status-dot { display:inline-flex; align-items:center; gap:7px; }
.status-dot::before { content:""; width:10px; height:10px; border-radius:50%; background:#0c6b6f; }
.status-dot.warning::before { background:#eb9a3d; }
.status-dot.risk::before { background:#d25b5b; }

.outcome-list { display:flex; gap:8px; flex-wrap:wrap; margin-top:16px; }
.metrics-grid { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:14px; margin-top:18px; }
.metric-block { background:#f8fbfc; border:1px solid #dfe8ed; border-radius:18px; padding:18px; }
.metric-block strong { display:block; font-size:28px; margin-bottom:4px; }
.metric-block span { color:#5e7480; font-size:14px; }

.timeline-grid { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:14px; }
.timeline-step { background:#f8fbfc; border:1px solid #dfe8ed; border-radius:18px; padding:18px; }
.timeline-step b { display:inline-grid; place-items:center; width:32px; height:32px; border-radius:10px; background:var(--accent); color:var(--brand-dark); font-size:12px; margin-bottom:10px; }
.timeline-step p { margin:0; color:#536772; font-size:14px; }
.timeline-step strong { display:block; margin-bottom:6px; }

.back-link { display:inline-flex; align-items:center; gap:8px; font-weight:700; color:var(--brand); }
.case-nav-links { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-top:26px; }

@media (max-width: 900px) {
  .hero-grid, .process-grid, .about-grid, .contact-card, .case-content, .case-hero-grid, .two-col, .before-after-grid, .dashboard-grid { grid-template-columns:1fr; }
  .dashboard-kpis, .metrics-grid, .timeline-grid, .workflow-diagram, .case-summary-grid { grid-template-columns:1fr 1fr; }
  .case-detail-grid { grid-template-columns:1fr; }
  .case-side { border-left:0; border-top:1px solid var(--line); padding-left:0; padding-top:22px; }
  .hero { padding-top:70px; }
  .services-grid { grid-template-columns:1fr; }
  .trust-grid { grid-template-columns:1fr; }
  .sticky-heading { position:static; }
  .case-outcomes { justify-content:flex-start; }
  .contact-card { padding:30px; }
  .site-nav { display:none; position:absolute; top:70px; right:20px; left:20px; flex-direction:column; align-items:stretch; background:white; border:1px solid var(--line); border-radius:16px; padding:18px; box-shadow:var(--shadow); }
  .site-nav.open { display:flex; }
  .menu-toggle { display:block; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-links { flex-wrap:wrap; }
  .flow-box::after { display:none; }
}

@media (max-width: 560px) {
  .container { width:min(100% - 26px,1180px); }
  h1 { font-size:43px; }
  .section { padding:72px 0; }
  .hero-actions .button { width:100%; }
  .hero-panel { padding:22px; }
  .service-card, .case-card, .case-section-card { padding:24px; }
  .contact-card { padding:24px; border-radius:22px; }
  .dashboard-kpis, .metrics-grid, .timeline-grid, .workflow-diagram, .case-summary-grid { grid-template-columns:1fr; }
  .case-hero { padding-top:64px; }
}

/* Founder / About section */
.about-intro-grid {
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:72px;
  align-items:start;
}
.about-lead {
  color:#bfd0d6;
  font-size:18px;
  max-width:720px;
  margin:0;
}
.about-principles {
  display:grid;
  gap:12px;
}
.about-principles > div {
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.045);
  border-radius:18px;
  padding:18px 20px;
}
.about-principles strong {
  display:block;
  color:white;
  margin-bottom:4px;
  font-size:15px;
}
.about-principles span {
  display:block;
  color:#a9bcc4;
  font-size:14px;
}
.founder-panel {
  margin-top:48px;
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:48px;
  padding:34px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:26px;
  background:linear-gradient(135deg, rgba(255,255,255,.055), rgba(255,255,255,.025));
  box-shadow:0 20px 60px rgba(0,0,0,.12);
}
.founder-identity {
  display:flex;
  gap:20px;
  align-items:flex-start;
}
.founder-avatar {
  flex:0 0 auto;
  width:84px;
  height:84px;
  border-radius:24px;
  display:grid;
  place-items:center;
  background:linear-gradient(145deg, #1d7c7f, #0b5559);
  color:white;
  font-size:22px;
  font-weight:800;
  letter-spacing:.08em;
  box-shadow:0 14px 34px rgba(0,0,0,.2);
}
.founder-kicker {
  margin:0 0 7px;
  color:#83d2ce;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:11px;
  font-weight:800;
}
.founder-identity h3,
.founder-capabilities h3 {
  color:white;
  margin-bottom:6px;
}
.founder-role {
  margin:0 0 14px;
  color:#bfd0d6;
  font-size:15px;
}
.founder-meta {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.founder-meta span {
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  padding:6px 9px;
  color:#d5e4e8;
  background:rgba(255,255,255,.04);
  font-size:11px;
  font-weight:700;
}
.founder-copy p {
  color:#c3d3d8;
  font-size:16px;
  margin-top:0;
}
.founder-copy p:last-child { margin-bottom:0; }
.founder-capabilities {
  margin-top:28px;
  padding:30px 0 0;
}
.founder-capabilities > div:first-child {
  max-width:760px;
  margin-bottom:24px;
}
.founder-capabilities > div:first-child p:last-child {
  color:#bfd0d6;
  font-size:16px;
}
.capability-grid {
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:14px;
}
.capability-grid > div {
  border-top:1px solid rgba(255,255,255,.14);
  padding-top:18px;
}
.capability-grid strong {
  display:block;
  color:white;
  font-size:14px;
  margin-bottom:6px;
}
.capability-grid span {
  display:block;
  color:#a9bcc4;
  font-size:13px;
  line-height:1.55;
}

@media (max-width:900px) {
  .about-intro-grid,
  .founder-panel { grid-template-columns:1fr; }
  .capability-grid { grid-template-columns:1fr 1fr; }
}

@media (max-width:560px) {
  .founder-panel { padding:24px; }
  .founder-identity { flex-direction:column; }
  .capability-grid { grid-template-columns:1fr; }
}


/* Commercial packages */
.services-heading { margin-bottom:28px; }
.package-note {
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:16px 18px;
  margin-bottom:28px;
  border:1px solid #cfe4e3;
  background:#f0f9f8;
  border-radius:16px;
  color:#46606b;
  font-size:14px;
}
.package-note strong { color:var(--brand-dark); white-space:nowrap; }
.service-category-list { display:grid; gap:22px; }
.service-category {
  display:grid;
  grid-template-columns:minmax(230px,.72fr) minmax(0,1.58fr);
  gap:30px;
  padding:30px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow:0 8px 28px rgba(16,33,43,.04);
}
.service-category-intro { padding:2px 8px 2px 0; }
.service-category-intro .service-number { margin-bottom:18px; }
.service-kicker {
  margin:0 0 10px;
  color:var(--brand);
  font-size:12px;
  line-height:1.2;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.service-category-intro h3 { margin:0 0 12px; font-size:25px; line-height:1.22; }
.service-category-intro > p:last-child { margin:0; color:var(--muted); font-size:14px; }
.package-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.package-card {
  display:flex;
  flex-direction:column;
  min-height:100%;
  padding:22px;
  border:1px solid #dfe8ec;
  border-radius:18px;
  background:#f8fbfc;
}
.package-card.featured { background:#f0f9f8; border-color:#b9dfdc; }
.package-topline { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; margin-bottom:14px; }
.package-topline > span { font-weight:800; color:#17333e; font-size:15px; line-height:1.25; }
.package-topline > strong { color:var(--brand); font-size:16px; line-height:1.25; white-space:nowrap; }
.package-card > p { margin:0 0 16px; color:var(--muted); font-size:14px; }
.package-card ul { margin:0 0 20px; padding-left:18px; color:#3f5660; font-size:13px; }
.package-card li { margin:7px 0; }
.package-meta {
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:center;
  margin-top:auto;
  padding-top:14px;
  border-top:1px solid #dfe8ec;
  font-size:12px;
}
.package-meta span { color:#6f8189; }
.package-meta strong { color:#274652; }
.services-cta {
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:center;
  margin:26px 0 60px;
  padding:22px 24px;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
}
.services-cta p { margin:0; color:var(--muted); }
.services-cta p strong { color:var(--ink); }
.services-cta .button { flex:0 0 auto; }

/* Care plans */
.care-panel {
  padding:36px;
  border-radius:28px;
  background:linear-gradient(145deg,#0d2632,#102f38);
  color:#fff;
  box-shadow:var(--shadow);
}
.care-intro { max-width:760px; margin-bottom:28px; }
.care-intro .eyebrow { color:#8bd5d2; }
.care-intro h2 { margin-bottom:12px; color:#fff; }
.care-intro > p:not(.eyebrow) { color:#b7c6cc; margin:0 0 14px; }
.care-note {
  display:inline-flex;
  padding:8px 11px;
  border:1px solid rgba(139,213,210,.24);
  border-radius:999px;
  background:rgba(139,213,210,.08);
  color:#b9deda;
  font-size:12px;
  font-weight:700;
}
.care-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.care-card {
  padding:24px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:20px;
  background:rgba(255,255,255,.055);
}
.care-card.care-plus { border-color:rgba(139,213,210,.34); background:rgba(139,213,210,.09); }
.care-card-head { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; }
.care-label { display:block; margin-bottom:7px; color:#8bd5d2; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.care-card h3 { margin:0; color:#fff; font-size:32px; line-height:1; }
.care-card h3 span { font-size:13px; font-weight:600; color:#9fb3ba; margin-left:4px; }
.care-badge {
  padding:6px 9px;
  border-radius:999px;
  background:rgba(139,213,210,.14);
  color:#aee1de;
  font-size:10px;
  font-weight:800;
  letter-spacing:.04em;
  white-space:nowrap;
}
.care-card ul { margin:22px 0 18px; padding-left:18px; color:#d2dde1; font-size:14px; }
.care-card li { margin:8px 0; }
.care-small { margin:0; color:#98abb3; font-size:12px; }
.care-footer {
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:center;
  margin-top:20px;
  padding-top:20px;
  border-top:1px solid rgba(255,255,255,.12);
  color:#9fb1b8;
  font-size:12px;
}
.care-footer a { color:#8bd5d2; font-weight:800; white-space:nowrap; }

@media (max-width: 980px) {
  .service-category { grid-template-columns:1fr; }
  .service-category-intro { max-width:720px; padding-right:0; }
}

@media (max-width: 720px) {
  .package-pair, .care-grid { grid-template-columns:1fr; }
  .package-note, .services-cta, .care-footer { flex-direction:column; align-items:flex-start; }
  .package-note strong { white-space:normal; }
  .services-cta .button { width:100%; }
  .care-panel { padding:26px; }
}

@media (max-width: 560px) {
  .service-category { padding:22px; }
  .package-card { padding:19px; }
  .package-topline { flex-direction:column; gap:5px; }
  .care-card-head { flex-direction:column; }
  .care-panel { padding:22px; border-radius:22px; }
}

/* Project enquiry & discovery */
.sr-only {
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}
.enquiry-heading { margin-bottom:30px; }
.discovery-promise {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-top:26px;
}
.discovery-promise > div {
  padding:20px;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(255,255,255,.78);
}
.discovery-promise span {
  display:inline-grid;
  place-items:center;
  width:30px;
  height:30px;
  margin-bottom:14px;
  border-radius:10px;
  background:var(--accent);
  color:var(--brand-dark);
  font-size:11px;
  font-weight:800;
}
.discovery-promise strong { display:block; margin-bottom:6px; font-size:15px; }
.discovery-promise p { margin:0; color:var(--muted); font-size:13px; }

.enquiry-shell {
  display:grid;
  grid-template-columns:minmax(250px,.66fr) minmax(0,1.5fr);
  gap:26px;
  align-items:start;
}
.enquiry-side {
  position:sticky;
  top:104px;
  padding:26px;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:0 10px 30px rgba(16,33,43,.05);
}
.enquiry-side-kicker {
  margin:0 0 16px;
  color:var(--brand);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.enquiry-checklist { list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.enquiry-checklist li { display:flex; gap:10px; align-items:flex-start; color:#415761; font-size:14px; }
.enquiry-checklist li span {
  flex:0 0 22px;
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:#e8f6f4;
  color:var(--brand);
  font-size:12px;
  font-weight:800;
}
.enquiry-side-note {
  margin-top:22px;
  padding-top:20px;
  border-top:1px solid var(--line);
}
.enquiry-side-note strong { display:block; margin-bottom:6px; font-size:14px; }
.enquiry-side-note p { margin:0; color:var(--muted); font-size:13px; }
.fit-card {
  margin-top:20px;
  padding:18px;
  border-radius:18px;
  background:linear-gradient(145deg,#0f2934,#123842);
  color:#fff;
}
.fit-label {
  display:block;
  margin-bottom:7px;
  color:#8bd5d2;
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.1em;
}
.fit-card strong { display:block; margin-bottom:7px; font-size:16px; }
.fit-card p { margin:0; color:#b8c8ce; font-size:12px; }

.discovery-form {
  padding:32px;
  border:1px solid var(--line);
  border-radius:28px;
  background:#fff;
  box-shadow:var(--shadow);
}
.form-progress {
  display:grid;
  grid-template-columns:auto 1fr auto 1fr auto;
  gap:12px;
  align-items:center;
  margin-bottom:30px;
  padding-bottom:24px;
  border-bottom:1px solid var(--line);
}
.progress-step {
  display:flex;
  align-items:center;
  gap:8px;
  padding:0;
  border:0;
  background:transparent;
  color:#819199;
  font:inherit;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
}
.progress-step span {
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:999px;
  border:1px solid #cfdce1;
  background:#f8fbfc;
  color:#68808a;
  font-size:11px;
}
.progress-step.active { color:var(--brand-dark); }
.progress-step.active span { background:var(--brand); color:#fff; border-color:var(--brand); }
.progress-step.complete { color:#365761; }
.progress-step.complete span { background:#dff3f0; color:var(--brand-dark); border-color:#b7ded9; }
.progress-line { height:1px; background:#d9e4e8; }
.form-step-heading { margin-bottom:22px; }
.form-step-heading > span {
  display:block;
  margin-bottom:7px;
  color:var(--brand);
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.form-step-heading h3 { margin-bottom:8px; font-size:28px; }
.form-step-heading p { margin:0; color:var(--muted); font-size:14px; }
.choice-fieldset, .tool-fieldset { margin:0; padding:0; border:0; }
.project-choice { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.choice-card { display:block; cursor:pointer; }
.choice-card.wide { grid-column:1/-1; }
.choice-card input { position:absolute; opacity:0; pointer-events:none; }
.choice-card > span {
  min-height:100%;
  display:block;
  padding:17px;
  border:1px solid #dbe5e9;
  border-radius:16px;
  background:#f9fbfc;
  transition:.16s ease;
}
.choice-card strong { display:block; margin-bottom:5px; color:#203b46; font-size:14px; }
.choice-card small { display:block; color:#687b84; font-size:12px; line-height:1.45; }
.choice-card:hover > span { border-color:#b8d6d6; background:#f4fbfa; }
.choice-card input:checked + span {
  border-color:var(--brand);
  background:#edf8f7;
  box-shadow:0 0 0 2px rgba(12,107,111,.08);
}
.choice-card input:focus-visible + span { outline:3px solid rgba(12,107,111,.18); outline-offset:2px; }

.form-grid { display:grid; gap:14px; margin-top:18px; }
.form-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.form-grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.field-label { display:block; color:#2f4853; font-size:13px; font-weight:800; }
.field-label > span { display:block; margin-top:3px; color:#819097; font-size:11px; font-weight:500; }
.field-label input,
.field-label textarea,
.field-label select {
  width:100%;
  margin-top:8px;
  border:1px solid #cbd8de;
  border-radius:12px;
  padding:12px 13px;
  background:#fbfdfe;
  color:var(--ink);
  font:inherit;
  font-size:14px;
}
.field-label textarea { resize:vertical; min-height:112px; }
.field-label input:focus,
.field-label textarea:focus,
.field-label select:focus {
  outline:2px solid rgba(12,107,111,.14);
  border-color:var(--brand);
}
.field-label.invalid input,
.field-label.invalid textarea,
.field-label.invalid select { border-color:#b74b4b; background:#fffafa; }
.field-error { display:none; margin:7px 0 0; color:#a33d3d !important; font-size:11px !important; font-weight:600 !important; }
.field-error.show { display:block; }

.tool-fieldset { margin-top:4px; }
.tool-fieldset legend { margin-bottom:12px; color:#2f4853; font-size:13px; font-weight:800; }
.tool-fieldset legend span { color:#83929a; font-size:11px; font-weight:500; }
.tool-grid { display:flex; flex-wrap:wrap; gap:8px; }
.tool-grid label { cursor:pointer; }
.tool-grid input { position:absolute; opacity:0; pointer-events:none; }
.tool-grid span {
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:0 12px;
  border:1px solid #d8e3e7;
  border-radius:999px;
  background:#f9fbfc;
  color:#50656f;
  font-size:12px;
  font-weight:700;
}
.tool-grid input:checked + span { border-color:#9bcfcc; background:#eaf7f5; color:var(--brand-dark); }
.tool-grid input:focus-visible + span { outline:3px solid rgba(12,107,111,.16); outline-offset:2px; }
.budget-field { margin-top:18px; max-width:420px; }
.form-actions {
  display:flex;
  justify-content:space-between;
  gap:12px;
  margin-top:26px;
  padding-top:22px;
  border-top:1px solid var(--line);
}
.form-actions.end { justify-content:flex-end; }
.enquiry-privacy-note {
  margin-top:18px;
  padding:14px 16px;
  border:1px solid #dce7ea;
  border-radius:14px;
  background:#f8fbfc;
  color:#61747d;
  font-size:12px;
}
.enquiry-privacy-note strong { color:#304b56; }
.final-fit-summary {
  margin-top:18px;
  padding:17px;
  border-left:4px solid var(--brand);
  border-radius:0 14px 14px 0;
  background:#eef8f7;
}
.final-fit-summary span {
  display:block;
  margin-bottom:5px;
  color:var(--brand);
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.final-fit-summary strong { display:block; margin-bottom:5px; color:#183c46; }
.final-fit-summary p { margin:0; color:#60747d; font-size:12px; }
.form-status { margin-top:12px; color:var(--brand-dark); font-size:12px; font-weight:700; }
.contact-fields { margin-top:0; }

@media (max-width: 980px) {
  .enquiry-shell { grid-template-columns:1fr; }
  .enquiry-side { position:static; }
}
@media (max-width: 760px) {
  .discovery-promise { grid-template-columns:1fr; }
  .project-choice, .form-grid.two, .form-grid.three { grid-template-columns:1fr; }
  .choice-card.wide { grid-column:auto; }
  .discovery-form { padding:24px; }
  .form-progress { grid-template-columns:repeat(3,1fr); gap:8px; }
  .progress-line { display:none; }
  .progress-step { justify-content:center; flex-direction:column; gap:5px; text-align:center; }
}
@media (max-width: 560px) {
  .enquiry-side, .discovery-form { padding:20px; border-radius:20px; }
  .form-actions { flex-direction:column-reverse; }
  .form-actions .button { width:100%; }
  .form-actions.end { flex-direction:column; }
  .form-step-heading h3 { font-size:24px; }
}


/* FlowNorth final identity */
.site-header { background: rgba(248,250,252,.94); }
.hero::before { background: radial-gradient(circle, rgba(46,139,125,.15), rgba(46,139,125,0)); }
.button.primary { box-shadow: 0 12px 30px rgba(46,139,125,.20); }
.hero-panel { background: linear-gradient(180deg,#123b4b,#0b2d42); }
.panel-label { color:#8bd2c8; }
.flow-step b { color:#9bd9d0; background:rgba(46,139,125,.15); }
.flow-step span { color:#afc2cb; }
.site-footer { background:#071f2f; }
@media (max-width: 680px) {
  .brand-symbol { width:39px; height:39px; flex-basis:39px; }
  .brand-wordmark-main { font-size:16px; }
  .brand-wordmark-sub { font-size:7px; letter-spacing:.28em; }
}

/* Exact Concept 7 logo assets */
.site-header { background: rgba(249,249,249,.96); }
.brand-logo-link { line-height: 0; flex: 0 0 auto; }
.brand-logo-exact {
  width: 270px;
  height: auto;
  display: block;
}
.footer-logo-exact {
  width: 310px;
  height: auto;
  display: block;
  max-width: 100%;
}
.site-footer { background:#132b38; }
@media (max-width: 680px) {
  .nav-wrap { min-height: 86px; }
  .brand-logo-exact { width: 235px; }
  .footer-logo-exact { width: 280px; }
}
@media (max-width: 420px) {
  .brand-logo-exact { width: 218px; }
  .nav-wrap { gap: 12px; }
}


/* Direct enquiry submission */
.hp-field {
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  clip:rect(0 0 0 0) !important;
  white-space:nowrap !important;
  clip-path:inset(50%) !important;
}
.form-status { display:none; }
.form-status.sending,
.form-status.success,
.form-status.error {
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-top:16px;
  padding:14px 16px;
  border-radius:14px;
  line-height:1.45;
}
.form-status.sending {
  background:#f4f8fa;
  border:1px solid #dce7ea;
  color:#48616c;
}
.form-status.success {
  background:#edf8f5;
  border:1px solid #b9dfd4;
  color:#174f46;
}
.form-status.error {
  background:#fff5f5;
  border:1px solid #edcccc;
  color:#8b3333;
}
.form-status strong { font-size:13px; }
.form-status span { font-size:12px; font-weight:500; }
#enquiry-submit:disabled { opacity:.72; cursor:not-allowed; }