/**
 * Digital Upendra — Location Pages
 * Extracted from reference HTML pages. Full design system:
 *   Bone #f8f4ef · Ink #0e0e0e · Rush Orange #f97316 · Terminal green #10d492
 *   Instrument Serif (hero H1) · Archivo (section headings) · Inter (body) · JetBrains Mono (data/terminal)
 *
 * Specificity note: .article-body typography is scoped tight so that CTA/testimonial
 * text doesn't get overridden. All new components (benefits/compare/process/testimonials
 * /portfolio/deliverables/roadmap/guarantee) are added to prevent conflicts.
 */

/* =========================================================================
   DESIGN SYSTEM — Pan-India Location Pages
   ========================================================================= */

:root {
  /* Palette */
  --bone: #f8f4ef;
  --off: #fafaf7;
  --white: #ffffff;
  --ink: #0e0e0e;
  --ink-2: #1a1a1a;
  --mid: #6b6862;
  --mid-2: #8a8783;
  --line: #e5e2d8;
  --line-2: #d4d0c4;

  /* Brand primary */
  --rush: #f97316;
  --rush-d: #c2410c;
  --rush-l: #ffedd5;

  /* SIGNATURE — Terminal GEO Audit blocks (used ONLY in Section 4) */
  --term-bg: #0a0f0d;
  --term-bg-2: #0f1613;
  --term-green: #10d492;
  --term-green-dim: #059669;
  --term-amber: #f5b043;
  --term-mid: #7a8b83;

  /* Semantic */
  --success: #10b981;
  --warn: #f59e0b;
  --danger: #ef4444;

  /* Type */
  --f-display: "Instrument Serif", "Times New Roman", ui-serif, serif;
  --f-heading: "Archivo", "Inter", system-ui, sans-serif;
  --f-body: "Inter", system-ui, -apple-system, sans-serif;
  --f-mono: "JetBrains Mono", "Menlo", ui-monospace, monospace;

  /* Fluid type scale */
  --t-xs: 11px;
  --t-sm: 13px;
  --t-base: 16px;
  --t-md: 17px;
  --t-lg: 19px;
  --t-xl: 22px;
  --t-2xl: 28px;
  --t-3xl: clamp(30px, 3.5vw, 40px);
  --t-4xl: clamp(38px, 4.5vw, 54px);
  --t-hero: clamp(56px, 8vw, 108px);

  /* Space */
  --s-xs: 4px;
  --s-sm: 8px;
  --s-md: 16px;
  --s-lg: 32px;
  --s-xl: clamp(48px, 6vw, 88px);
  --s-2xl: clamp(72px, 9vw, 128px);

  /* Layout */
  --wrap: 1360px;
  --content: 720px;
  --gutter: clamp(20px, 4vw, 48px);

  /* Effects */
  --r: 8px;
  --r-lg: 14px;
  --sh-sm: 0 1px 2px rgba(14,14,14,.04);
  --sh-md: 0 4px 20px rgba(14,14,14,.06);
  --sh-lg: 0 20px 60px rgba(14,14,14,.10);
}

/* =========================================================================
   RESET + BASE
   ========================================================================= */

*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  font-feature-settings: "kern", "liga", "calt", "cv02", "cv03", "cv04";
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

body {
  margin: 0;
  font-family: var(--f-body);
  font-size: var(--t-base);
  line-height: 1.6;
  color: var(--ink);
  background: var(--bone);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img, svg { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }

::selection { background: var(--rush); color: var(--white); }

/* =========================================================================
   ANNOUNCEMENT + NAV
   ========================================================================= */

.announce {
  background: var(--ink);
  color: rgba(255,255,255,.9);
  font-family: var(--f-mono);
  font-size: var(--t-xs);
  letter-spacing: 0.02em;
  padding: 10px 0;
}
.announce-inner {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
}
.announce a { color: var(--rush); text-decoration: none; }
.announce a:hover { color: var(--white); }
.announce-flags { display: flex; gap: 16px; }
@media (max-width: 720px) { .announce-flags { display: none; } }

.nav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(248, 244, 239, 0.85);
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
  border-bottom: 1px solid var(--line);
}
.nav-inner {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 16px var(--gutter);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--f-heading);
  font-weight: 700;
  font-size: 19px;
  letter-spacing: -0.02em;
  color: var(--ink);
}
.brand-mark {
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--ink); color: var(--rush);
  font-family: var(--f-heading); font-weight: 700; font-size: 13px;
  border-radius: 6px;
}
.nav-cta {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 20px;
  background: var(--ink); color: var(--white);
  border-radius: 999px;
  font-family: var(--f-heading); font-weight: 600; font-size: var(--t-sm);
  letter-spacing: -0.01em;
  transition: background .18s, transform .18s;
}
.nav-cta:hover { background: var(--rush); transform: translateY(-1px); }

/* =========================================================================
   LAYOUT PRIMITIVES
   ========================================================================= */

.wrap {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.content-wrap {
  max-width: var(--content);
  margin: 0 auto;
}
.section {
  padding: var(--s-2xl) 0;
}
.section-sm { padding: var(--s-xl) 0; }

/* =========================================================================
   BREADCRUMBS
   ========================================================================= */

.crumb {
  font-family: var(--f-mono);
  font-size: var(--t-xs);
  color: var(--mid);
  letter-spacing: 0.02em;
  padding: 20px 0;
}
.crumb a { color: var(--mid); border-bottom: 1px solid transparent; transition: color .15s, border-color .15s; }
.crumb a:hover { color: var(--ink); border-bottom-color: var(--rush); }
.crumb-sep { margin: 0 8px; color: var(--line-2); }

/* =========================================================================
   HERO — SECTION 1
   Editorial: kicker + serif display + subhead + meta
   ========================================================================= */

.hero {
  padding: clamp(48px, 8vw, 120px) 0 clamp(56px, 8vw, 96px);
  position: relative;
  overflow: hidden;
}
.hero-inner {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 380px);
  gap: clamp(32px, 5vw, 80px);
  align-items: end;
}
@media (max-width: 900px) { .hero-inner { grid-template-columns: 1fr; } }

.hero-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--f-mono);
  font-size: var(--t-xs);
  color: var(--rush);
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin-bottom: 32px;
}
.hero-kicker::before {
  content: "";
  width: 24px;
  height: 1px;
  background: var(--rush);
}

.hero-h1 {
  font-family: var(--f-display);
  font-weight: 400;
  font-size: var(--t-hero);
  line-height: 0.94;
  letter-spacing: -0.03em;
  color: var(--ink);
  margin: 0 0 clamp(24px, 3vw, 40px);
  font-feature-settings: "ss01", "ss02";
}
.hero-h1 em {
  font-style: italic;
  color: var(--rush);
}

.hero-sub {
  font-size: clamp(17px, 1.6vw, 21px);
  line-height: 1.5;
  color: var(--mid);
  max-width: 560px;
  margin: 0 0 var(--s-lg);
  font-weight: 400;
}
.hero-sub strong { color: var(--ink); font-weight: 600; }

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 15px 24px;
  border-radius: 999px;
  font-family: var(--f-heading);
  font-weight: 600;
  font-size: var(--t-sm);
  letter-spacing: -0.005em;
  transition: all .18s ease;
  border: 1.5px solid transparent;
  white-space: nowrap;
}
.btn-primary {
  background: var(--ink);
  color: var(--white);
  border-color: var(--ink);
}
.btn-primary:hover {
  background: var(--rush);
  border-color: var(--rush);
  transform: translateY(-1px);
}
.btn-ghost {
  background: transparent;
  color: var(--ink);
  border-color: var(--line-2);
}
.btn-ghost:hover {
  border-color: var(--ink);
  background: var(--white);
}
.btn-arrow {
  display: inline-block;
  transition: transform .2s;
}
.btn:hover .btn-arrow { transform: translateX(3px); }

/* Meta card — right side of hero */
.hero-meta {
  border-left: 1px solid var(--line);
  padding-left: clamp(20px, 3vw, 40px);
  font-family: var(--f-mono);
  font-size: var(--t-xs);
  color: var(--mid);
  letter-spacing: 0.02em;
}
@media (max-width: 900px) {
  .hero-meta { border-left: none; padding-left: 0; border-top: 1px solid var(--line); padding-top: 32px; }
}
.hero-meta dl { margin: 0; display: grid; gap: 18px; }
.hero-meta div { display: grid; grid-template-columns: 90px 1fr; gap: 16px; align-items: baseline; }
.hero-meta dt {
  color: var(--mid-2);
  text-transform: uppercase;
  font-size: 10px;
  letter-spacing: 0.16em;
}
.hero-meta dd {
  margin: 0;
  color: var(--ink);
  font-size: var(--t-sm);
  font-weight: 500;
}
.hero-meta dd span { color: var(--mid); font-weight: 400; }

/* =========================================================================
   ARTICLE LAYOUT — Main content + sticky TOC
   ========================================================================= */

.article {
  padding: 0 0 var(--s-2xl);
}
.article-layout {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 220px);
  gap: clamp(48px, 6vw, 96px);
  align-items: start;
}
@media (max-width: 1024px) {
  .article-layout { grid-template-columns: 1fr; }
  .toc { display: none; }
}
.article-body {
  max-width: 720px;
  margin: 0 auto;
  min-width: 0;
}

/* Sticky TOC */
.toc {
  position: sticky;
  top: 100px;
  align-self: start;
}
.toc-title {
  font-family: var(--f-mono);
  font-size: 10px;
  color: var(--mid);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.toc-list { list-style: none; margin: 0; padding: 0; }
.toc-list li { margin: 0; }
.toc-list a {
  display: block;
  padding: 8px 0;
  font-family: var(--f-body);
  font-size: var(--t-sm);
  color: var(--mid);
  line-height: 1.4;
  transition: color .15s;
  border-left: 2px solid transparent;
  padding-left: 12px;
  margin-left: -14px;
}
.toc-list a:hover { color: var(--ink); }
.toc-list a.active { color: var(--ink); border-left-color: var(--rush); }
.toc-num { display: inline-block; color: var(--mid-2); font-family: var(--f-mono); font-size: 10px; width: 22px; }

/* =========================================================================
   SECTION HEADINGS + BODY COPY
   ========================================================================= */

.section-eyebrow {
  display: flex;
  align-items: center;
  gap: 14px;
  font-family: var(--f-mono);
  font-size: var(--t-xs);
  color: var(--rush);
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin: 0 0 20px;
}
.section-eyebrow-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 22px;
  padding: 0 6px;
  background: var(--ink);
  color: var(--rush);
  border-radius: 4px;
  font-weight: 700;
}
.article-body h2 {
  scroll-margin-top: 100px;
  font-family: var(--f-heading);
  font-weight: 600;
  font-size: var(--t-3xl);
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0 0 28px;
}
.article-body h3 {
  font-family: var(--f-heading);
  font-weight: 600;
  font-size: var(--t-xl);
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 44px 0 16px;
}
.article-body p {
  font-size: var(--t-md);
  line-height: 1.7;
  color: var(--ink-2);
  margin: 0 0 20px;
}
.article-body p strong { color: var(--ink); font-weight: 600; }
.article-body p a {
  color: var(--ink);
  border-bottom: 1.5px solid var(--rush);
  padding-bottom: 1px;
  transition: color .15s, background .15s;
}
.article-body p a:hover { background: var(--rush-l); color: var(--ink); }
.article-body ul, .article-body ol {
  margin: 0 0 24px;
  padding-left: 22px;
  font-size: var(--t-md);
  line-height: 1.65;
  color: var(--ink-2);
}
.article-body ul li, .article-body ol li { margin-bottom: 10px; }
.article-body ul { list-style: none; padding-left: 0; }
.article-body ul li {
  padding-left: 24px;
  position: relative;
}
.article-body ul li::before {
  content: "→";
  position: absolute;
  left: 0;
  color: var(--rush);
  font-weight: 600;
}

.section-block {
  margin-bottom: var(--s-2xl);
}
.section-block:last-child { margin-bottom: 0; }

/* =========================================================================
   DATA PLATE — for Section 2 (business landscape)
   ========================================================================= */

.data-plate {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: clamp(28px, 3.5vw, 40px);
  margin: 32px 0 40px;
  box-shadow: var(--sh-md);
}
.data-plate-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding-bottom: 20px;
  margin-bottom: 24px;
  border-bottom: 1px dashed var(--line-2);
}
.data-plate-title {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--mid);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 600;
  margin: 0;
}
.data-plate-source {
  font-family: var(--f-mono);
  font-size: 10px;
  color: var(--mid-2);
  letter-spacing: 0.04em;
}
.data-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 24px 40px;
}
.data-item {
  display: grid;
  gap: 4px;
}
.data-label {
  font-family: var(--f-mono);
  font-size: 10px;
  color: var(--mid);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin: 0;
}
.data-value {
  font-family: var(--f-heading);
  font-size: 28px;
  font-weight: 600;
  color: var(--ink);
  letter-spacing: -0.02em;
  line-height: 1.1;
  margin: 0;
}
.data-value small {
  display: block;
  font-family: var(--f-body);
  font-size: 12px;
  font-weight: 400;
  color: var(--mid);
  letter-spacing: 0;
  margin-top: 4px;
}

/* Named companies chip row */
.company-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 20px;
}
.company-chip {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  background: var(--bone);
  border: 1px solid var(--line);
  border-radius: 6px;
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--ink-2);
  font-weight: 500;
}

/* =========================================================================
   SIGNATURE — LIVE GEO AUDIT TERMINAL BLOCK (Section 4)
   ========================================================================= */

.geo-audit {
  background: var(--term-bg);
  border-radius: var(--r-lg);
  padding: 0;
  margin: 40px 0 48px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(10,15,13,.25);
  position: relative;
}
.geo-audit::before {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at top left, rgba(16, 212, 146, .06), transparent 60%);
  pointer-events: none;
}
.geo-audit-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 28px;
  background: var(--term-bg-2);
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.geo-audit-dot {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.geo-audit-dot::before {
  content: "";
  width: 10px; height: 10px;
  background: var(--term-green);
  border-radius: 50%;
  box-shadow: 0 0 8px var(--term-green);
  animation: pulse 2s ease-in-out infinite;
}
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}
.geo-audit-label {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--term-green);
  letter-spacing: 0.14em;
  font-weight: 600;
  text-transform: uppercase;
}
.geo-audit-date {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--term-mid);
  letter-spacing: 0.06em;
}
.geo-audit-body {
  padding: 28px 28px 32px;
  font-family: var(--f-mono);
  font-size: 13px;
  line-height: 1.7;
  color: rgba(255,255,255,.85);
  position: relative;
  overflow-x: auto;
}
.geo-query {
  color: var(--term-amber);
  margin-bottom: 20px;
}
.geo-query::before {
  content: "$ ";
  color: var(--term-green);
}
.geo-divider {
  color: rgba(255,255,255,.15);
  margin: 12px 0;
  letter-spacing: 0.4em;
  font-size: 11px;
}
.geo-engine {
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 20px;
  padding: 8px 0;
  align-items: start;
}
.geo-engine-name {
  color: var(--term-green);
  font-weight: 600;
  letter-spacing: 0.06em;
}
.geo-engine-results {
  color: rgba(255,255,255,.85);
}
.geo-result-line { display: block; }
.geo-result-line::before {
  content: "▸ ";
  color: var(--term-green-dim);
}
.geo-result-note {
  color: var(--term-mid);
  font-size: 11px;
  margin-left: 8px;
}
.geo-audit-gap {
  margin-top: 24px;
  padding: 16px 20px;
  background: rgba(245, 176, 67, 0.08);
  border-left: 2px solid var(--term-amber);
  border-radius: 4px;
}
.geo-audit-gap-title {
  color: var(--term-amber);
  font-size: 11px;
  letter-spacing: 0.14em;
  font-weight: 600;
  margin-bottom: 8px;
}
.geo-audit-gap-line {
  color: rgba(255,255,255,.75);
  font-size: 12.5px;
  display: block;
  padding: 3px 0;
}
.geo-audit-gap-line::before {
  content: "→ ";
  color: var(--term-amber);
}

/* =========================================================================
   CASE STUDY CARD (Section 5)
   ========================================================================= */

.case-study {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  overflow: hidden;
  margin: 32px 0 40px;
  box-shadow: var(--sh-sm);
}
.case-study-header {
  padding: 20px 28px;
  background: var(--off);
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
.case-study-kicker {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--rush);
  letter-spacing: 0.14em;
  font-weight: 600;
  text-transform: uppercase;
}
.case-study-vertical {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--mid);
  letter-spacing: 0.06em;
}
.case-study-body {
  padding: 28px;
}
.case-study-title {
  font-family: var(--f-heading);
  font-size: var(--t-xl);
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 0 0 16px;
  line-height: 1.3;
}
.case-study-body p {
  font-size: 15.5px;
  line-height: 1.65;
  color: var(--ink-2);
  margin: 0 0 16px;
}
.case-study-results {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 20px;
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px dashed var(--line-2);
}
.case-study-result {
  display: grid;
  gap: 4px;
}
.case-study-result-num {
  font-family: var(--f-heading);
  font-size: 30px;
  font-weight: 700;
  color: var(--rush);
  letter-spacing: -0.02em;
  line-height: 1;
}
.case-study-result-label {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--mid);
  letter-spacing: 0.04em;
  line-height: 1.4;
}

/* =========================================================================
   SERVICE BLOCKS (Section 6)
   ========================================================================= */

.services {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
  margin: 28px 0 32px;
}
.service-card {
  padding: 24px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  position: relative;
  transition: border-color .2s, transform .2s;
}
.service-card:hover { border-color: var(--ink); transform: translateY(-2px); }
.service-card-num {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--rush);
  font-weight: 600;
  letter-spacing: 0.14em;
  margin-bottom: 12px;
}
.service-card-title {
  font-family: var(--f-heading);
  font-size: 18px;
  font-weight: 600;
  color: var(--ink);
  margin: 0 0 8px;
  letter-spacing: -0.01em;
}
.service-card-desc {
  font-size: 14px;
  line-height: 1.55;
  color: var(--mid);
  margin: 0;
}

/* =========================================================================
   FAQ
   ========================================================================= */

.faq {
  margin: 28px 0 40px;
  border-top: 1px solid var(--line);
}
.faq details {
  border-bottom: 1px solid var(--line);
}
.faq summary {
  padding: 22px 40px 22px 0;
  cursor: pointer;
  font-family: var(--f-heading);
  font-size: 17px;
  font-weight: 600;
  color: var(--ink);
  letter-spacing: -0.01em;
  list-style: none;
  position: relative;
  line-height: 1.4;
  transition: color .15s;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary:hover { color: var(--rush); }
.faq summary::after {
  content: "+";
  position: absolute;
  right: 0;
  top: 22px;
  font-size: 24px;
  font-weight: 300;
  color: var(--mid);
  transition: transform .2s;
  font-family: var(--f-body);
  line-height: 1;
}
.faq details[open] summary::after { transform: rotate(45deg); color: var(--rush); }
.faq details[open] summary { color: var(--rush); }
.faq details p {
  padding: 0 0 26px;
  font-size: 15.5px;
  line-height: 1.65;
  color: var(--ink-2);
  margin: 0;
}

/* =========================================================================
   CTA BLOCK
   ========================================================================= */

.cta-block {
  background: var(--ink);
  color: var(--white);
  border-radius: var(--r-lg);
  padding: clamp(32px, 5vw, 56px);
  margin: 48px 0;
  position: relative;
  overflow: hidden;
}
.cta-block::before {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(circle at top right, rgba(249, 115, 22, .15), transparent 60%);
  pointer-events: none;
}
.cta-inner { position: relative; z-index: 1; }
.cta-block .cta-eyebrow {
  font-family: var(--f-mono);
  font-size: var(--t-xs);
  color: var(--rush);
  letter-spacing: 0.14em;
  font-weight: 600;
  text-transform: uppercase;
  margin: 0 0 20px;
}
.cta-block .cta-title {
  font-family: var(--f-display);
  font-size: clamp(30px, 4vw, 44px);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--white);
  margin: 0 0 20px;
}
.cta-block .cta-title em { color: var(--rush); font-style: italic; }
.cta-block .cta-desc {
  font-size: 17px;
  line-height: 1.6;
  color: rgba(255,255,255,.75);
  max-width: 560px;
  margin: 0 0 32px;
}
.cta-block .btn-primary {
  background: var(--rush);
  border-color: var(--rush);
  color: var(--white);
}
.cta-block .btn-primary:hover { background: var(--white); color: var(--ink); border-color: var(--white); }
.cta-block .btn-ghost { color: var(--white); border-color: rgba(255,255,255,.25); }
.cta-block .btn-ghost:hover { background: rgba(255,255,255,.08); border-color: var(--white); }

/* =========================================================================
   RELATED CITIES BLOCK (Section 10)
   ========================================================================= */

.related {
  padding: var(--s-2xl) 0;
  background: var(--off);
  border-top: 1px solid var(--line);
}
.related-header {
  max-width: var(--wrap);
  margin: 0 auto 40px;
  padding: 0 var(--gutter);
}
.related-title {
  font-family: var(--f-heading);
  font-size: var(--t-2xl);
  font-weight: 600;
  color: var(--ink);
  margin: 0 0 8px;
  letter-spacing: -0.02em;
}
.related-sub {
  font-family: var(--f-mono);
  font-size: var(--t-xs);
  color: var(--mid);
  letter-spacing: 0.06em;
}
.related-grid {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
}
.related-card {
  padding: 24px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r);
  transition: border-color .2s, transform .2s;
}
.related-card:hover { border-color: var(--ink); transform: translateY(-2px); }
.related-card-city {
  font-family: var(--f-heading);
  font-size: 18px;
  font-weight: 600;
  color: var(--ink);
  margin: 0 0 4px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.related-card-city::after {
  content: "→";
  color: var(--rush);
  transition: transform .2s;
}
.related-card:hover .related-card-city::after { transform: translateX(4px); }
.related-card-note {
  font-family: var(--f-mono);
  font-size: 11.5px;
  color: var(--mid);
  letter-spacing: 0.02em;
}

/* =========================================================================
   FOOTER
   ========================================================================= */

.footer {
  background: var(--ink);
  color: rgba(255,255,255,.7);
  padding: var(--s-2xl) 0 40px;
  font-size: 14px;
}
.footer-inner {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 48px;
  padding-bottom: 48px;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
@media (max-width: 720px) { .footer-grid { grid-template-columns: 1fr; gap: 32px; } }
.footer-brand {
  font-family: var(--f-display);
  font-size: 28px;
  color: var(--white);
  margin: 0 0 12px;
  letter-spacing: -0.02em;
}
.footer-tag {
  color: rgba(255,255,255,.6);
  line-height: 1.55;
  margin: 0;
  max-width: 380px;
}
.footer-col h4 {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.5);
  margin: 0 0 16px;
  font-weight: 600;
}
.footer-col ul { list-style: none; padding: 0; margin: 0; }
.footer-col li { margin-bottom: 10px; }
.footer-col a { color: rgba(255,255,255,.75); transition: color .15s; }
.footer-col a:hover { color: var(--rush); }
.footer-bottom {
  padding-top: 32px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  font-family: var(--f-mono);
  font-size: 11px;
  color: rgba(255,255,255,.4);
  letter-spacing: 0.04em;
}

/* =========================================================================
   FOCUS STATES + ACCESSIBILITY
   ========================================================================= */

*:focus-visible {
  outline: 2px solid var(--rush);
  outline-offset: 3px;
  border-radius: 3px;
}
button:focus-visible, a:focus-visible {
  outline-offset: 4px;
}

.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* NEW: Benefits — Why all 3 arenas */
.benefits-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:28px 0 24px}
@media(max-width:800px){.benefits-grid{grid-template-columns:1fr}}
.benefit-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 22px;position:relative;transition:transform .2s,border-color .2s}
.benefit-card:hover{border-color:var(--ink);transform:translateY(-2px)}
.benefit-card::after{content:"";position:absolute;bottom:0;left:0;width:36%;height:2px;background:var(--rush)}
.benefit-arena{font-family:var(--f-mono);font-size:10px;color:var(--rush);letter-spacing:.14em;font-weight:600;text-transform:uppercase;margin:0 0 14px}
.benefit-stat{font-family:var(--f-display);font-size:56px;font-weight:400;color:var(--ink);letter-spacing:-.03em;line-height:1;margin:0 0 6px}
.benefit-stat sup{font-size:20px;color:var(--rush);vertical-align:super;font-family:var(--f-heading);font-weight:600;margin-left:2px}
.benefit-shift{font-family:var(--f-heading);font-size:15px;font-weight:600;color:var(--ink);margin:0 0 10px;letter-spacing:-.01em}
.benefit-desc{font-size:13.5px;line-height:1.55;color:var(--mid);margin:0}
.benefits-note{padding:20px 24px;background:var(--ink);color:#fff;border-radius:var(--r-lg);font-family:var(--f-mono);font-size:13px;line-height:1.6;margin:20px 0 0;letter-spacing:.005em}
.benefits-note strong{color:var(--rush);font-weight:600}

/* NEW: Comparison table */
.compare{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;margin:28px 0 36px;box-shadow:0 4px 20px rgba(14,14,14,.06)}
.compare-row{display:grid;grid-template-columns:130px repeat(3,1fr);border-bottom:1px solid var(--line)}
.compare-row:last-child{border-bottom:none}
.compare-row.compare-head{background:var(--off)}
.compare-cell{padding:14px 16px;font-size:13.5px;line-height:1.5;color:var(--ink-2);border-left:1px solid var(--line)}
.compare-cell:first-child{border-left:none;font-family:var(--f-mono);font-size:10.5px;color:var(--mid);letter-spacing:.06em;text-transform:uppercase;font-weight:600;background:var(--off);display:flex;align-items:center}
.compare-head .compare-cell{font-family:var(--f-mono);font-size:10.5px;color:var(--rush);letter-spacing:.14em;text-transform:uppercase;font-weight:600}
.compare-head .compare-cell:first-child{color:var(--mid)}
@media(max-width:720px){.compare-row{grid-template-columns:1fr}.compare-cell{border-left:none;border-top:1px solid var(--line);padding:10px 14px}.compare-cell:first-child{border-top:none;padding:12px 14px}}

/* NEW: Process timeline */
.process{margin:28px 0 40px}
.process-step{display:grid;grid-template-columns:56px 1fr;gap:20px;padding:14px 0;position:relative}
.process-step:not(:last-child)::before{content:"";position:absolute;left:27px;top:56px;bottom:-14px;width:2px;background:repeating-linear-gradient(to bottom,var(--line) 0 4px,transparent 4px 8px)}
.process-num{font-family:var(--f-mono);font-size:12px;color:var(--rush);letter-spacing:.06em;font-weight:700;background:#fff;border:2px solid var(--rush);border-radius:50%;width:42px;height:42px;display:flex;align-items:center;justify-content:center;position:relative;z-index:1}
.process-body h3{font-family:var(--f-heading);font-size:17px;font-weight:600;color:var(--ink);margin:0 0 5px;letter-spacing:-.01em}
.process-body p{font-size:14.5px;line-height:1.6;color:var(--mid);margin:0 0 6px}
.process-meta{display:inline-block;font-family:var(--f-mono);font-size:10.5px;color:var(--rush);letter-spacing:.06em;text-transform:uppercase;font-weight:600}

/* NEW: Why Me */
.why-me{margin:28px 0 32px;padding:32px 28px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:0 4px 20px rgba(14,14,14,.06);position:relative;overflow:hidden}
.why-me::before{content:"";position:absolute;top:-40px;right:-40px;width:220px;height:220px;background:radial-gradient(circle,rgba(249,115,22,.05) 0%,transparent 70%);pointer-events:none}
.why-me>*{position:relative;z-index:1}
.why-me-head{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;margin-bottom:24px;padding-bottom:22px;border-bottom:1px dashed var(--line-2)}
.why-me-avatar{width:64px;height:64px;border-radius:50%;background:var(--ink);color:var(--rush);display:flex;align-items:center;justify-content:center;font-family:var(--f-display);font-size:30px;font-weight:400;letter-spacing:-.02em}
.why-me-title{font-family:var(--f-heading);font-size:19px;font-weight:600;color:var(--ink);margin:0 0 4px;letter-spacing:-.01em}
.why-me-role{font-family:var(--f-mono);font-size:11.5px;color:var(--mid);letter-spacing:.04em}
.why-me .why-me-body p{font-size:15px;line-height:1.65;color:var(--ink-2);margin:0 0 16px}
.why-me .why-me-body p strong{color:var(--ink);font-weight:600}
.why-me-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:24px 0 20px;padding-top:20px;border-top:1px dashed var(--line-2)}
@media(max-width:640px){.why-me-stats{grid-template-columns:repeat(2,1fr)}}
.why-me-stat-num{font-family:var(--f-display);font-size:36px;font-weight:400;color:var(--ink);line-height:1;letter-spacing:-.02em;margin:0 0 4px}
.why-me-stat-num sup{font-size:15px;color:var(--rush);vertical-align:super;font-family:var(--f-heading);font-weight:600;margin-left:2px}
.why-me-stat-label{font-family:var(--f-mono);font-size:10px;color:var(--mid);letter-spacing:.1em;text-transform:uppercase;line-height:1.3}
.why-me-products-label{font-family:var(--f-mono);font-size:10px;color:var(--mid);letter-spacing:.14em;text-transform:uppercase;margin:20px 0 12px}
.why-me-products-list{display:flex;flex-wrap:wrap;gap:8px}
.why-me-product{padding:6px 12px;background:var(--bone);border:1px solid var(--line);border-radius:6px;font-family:var(--f-mono);font-size:12px;color:var(--ink-2);font-weight:500}


/* NEW: Testimonials */
.testimonials{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin:28px 0 32px}
@media(max-width:800px){.testimonials{grid-template-columns:1fr}}
.testimonial-card{background:var(--bone);border:1px solid var(--line);border-radius:var(--r-lg);padding:28px 26px 24px;position:relative}
.testimonial-card::before{content:"\201C";position:absolute;top:6px;right:22px;font-family:var(--f-display);font-size:88px;font-weight:400;color:var(--rush);opacity:.18;line-height:1;pointer-events:none;font-style:italic}
.testimonials .testimonial-quote{font-family:var(--f-display);font-size:19px;line-height:1.4;color:var(--ink);font-style:italic;margin:0 0 22px;letter-spacing:-.01em;position:relative;z-index:1}
.testimonial-attribution{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:center;padding-top:16px;border-top:1px dashed var(--line-2);position:relative;z-index:1}
.testimonial-avatar{width:44px;height:44px;border-radius:50%;background:var(--ink);color:var(--rush);display:flex;align-items:center;justify-content:center;font-family:var(--f-mono);font-size:12px;font-weight:700;letter-spacing:.02em}
.testimonial-attribution strong{display:block;font-family:var(--f-heading);font-size:14.5px;font-weight:600;color:var(--ink);letter-spacing:-.01em}
.testimonial-attribution span{display:block;font-family:var(--f-mono);font-size:11px;color:var(--mid);letter-spacing:.04em;margin-top:2px}

/* NEW: Guarantee */
.guarantee{display:grid;grid-template-columns:280px 1fr;gap:32px;margin:28px 0 36px;background:#fff;border:2px solid var(--ink);border-radius:var(--r-lg);padding:36px 32px;position:relative;overflow:hidden}
.guarantee::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--rush)}
@media(max-width:720px){.guarantee{grid-template-columns:1fr;gap:24px;padding:28px 22px}}
.guarantee-big{border-right:1px dashed var(--line-2);padding-right:32px;display:flex;flex-direction:column;justify-content:center;text-align:center}
@media(max-width:720px){.guarantee-big{border-right:none;border-bottom:1px dashed var(--line-2);padding-right:0;padding-bottom:24px}}
.guarantee-num{font-family:var(--f-display);font-size:clamp(72px,10vw,110px);font-weight:400;color:var(--ink);letter-spacing:-.05em;line-height:1;margin:0}
.guarantee-num .guarantee-slash{color:var(--rush);font-style:italic}
.guarantee-label{font-family:var(--f-mono);font-size:11px;color:var(--mid);letter-spacing:.14em;text-transform:uppercase;font-weight:600;margin-top:12px}
.guarantee .guarantee-terms h3{font-family:var(--f-heading);font-size:15px;font-weight:600;color:var(--ink);margin:0 0 8px;letter-spacing:-.01em}
.guarantee .guarantee-terms h3:not(:first-child){margin-top:20px}
.guarantee .guarantee-terms p{font-size:14.5px;line-height:1.6;color:var(--ink-2);margin:0 0 6px}
.guarantee .guarantee-terms p strong{color:var(--ink);font-weight:600;background:var(--rush-l);padding:1px 4px;border-bottom:none}
.guarantee .guarantee-terms ul{list-style:none;padding:0;margin:0;font-size:13.5px;line-height:1.55}
.guarantee .guarantee-terms ul li{padding-left:18px;position:relative;margin-bottom:6px;color:var(--ink-2)}
.guarantee .guarantee-terms ul li::before{content:"\2192";position:absolute;left:0;color:var(--rush);font-weight:600}

/* NEW: Deliverables */
.deliverables{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:28px 0 32px}
@media(max-width:900px){.deliverables{grid-template-columns:1fr}}
.deliverable-col{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:24px 22px;box-shadow:0 4px 20px rgba(14,14,14,.05)}
.deliverable-head{padding-bottom:16px;margin-bottom:16px;border-bottom:2px solid var(--ink)}
.deliverable-marker{display:inline-block;font-family:var(--f-mono);font-size:11px;color:var(--rush);letter-spacing:.14em;font-weight:700;text-transform:uppercase;padding:4px 10px;background:var(--rush-l);border-radius:4px;margin-bottom:10px}
.deliverable-title{display:block;font-family:var(--f-heading);font-size:16px;font-weight:600;color:var(--ink);letter-spacing:-.01em}
.deliverables .deliverable-list{list-style:none;padding:0;margin:0;font-size:13.5px;line-height:1.55;color:var(--ink-2)}
.deliverables .deliverable-list li{padding-left:22px;position:relative;margin-bottom:10px;color:var(--ink-2)}
.deliverables .deliverable-list li::before{content:"\2713";position:absolute;left:0;color:var(--rush);font-weight:700;font-size:14px}

/* NEW: Portfolio */
.portfolio{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:28px 0 32px}
@media(max-width:720px){.portfolio{grid-template-columns:1fr}}
.portfolio-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:24px 22px;transition:border-color .2s,transform .2s}
.portfolio-card:hover{border-color:var(--ink);transform:translateY(-2px)}
.portfolio-vertical{font-family:var(--f-mono);font-size:10.5px;color:var(--rush);letter-spacing:.14em;text-transform:uppercase;font-weight:600;margin:0 0 10px}
.portfolio-title{font-family:var(--f-heading);font-size:17px;font-weight:600;color:var(--ink);margin:0 0 10px;letter-spacing:-.01em;line-height:1.3}
.portfolio .portfolio-desc{font-size:13.5px;line-height:1.55;color:var(--mid);margin:0 0 16px}
.portfolio-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding-top:14px;border-top:1px dashed var(--line-2)}
.portfolio-metrics div{font-family:var(--f-mono);font-size:10.5px;color:var(--mid);letter-spacing:.02em;line-height:1.3}
.portfolio-metrics strong{display:block;font-family:var(--f-heading);font-size:14.5px;font-weight:600;color:var(--ink);letter-spacing:-.01em;margin-bottom:2px}

/* NEW: Roadmap 30/60/90 */
.roadmap{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:28px 0 32px}
@media(max-width:800px){.roadmap{grid-template-columns:1fr}}
.roadmap-phase{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:28px 24px 26px;position:relative;overflow:hidden;transition:border-color .2s,transform .2s}
.roadmap-phase:hover{border-color:var(--ink);transform:translateY(-2px)}
.roadmap-phase::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--rush)}
.roadmap-day{font-family:var(--f-display);font-size:72px;font-weight:400;color:var(--ink);letter-spacing:-.04em;line-height:1;margin:0 0 6px}
.roadmap-day sub{font-size:14px;color:var(--mid);vertical-align:baseline;font-family:var(--f-mono);letter-spacing:.04em;margin-left:6px;font-weight:400}
.roadmap-phase-label{font-family:var(--f-mono);font-size:11px;color:var(--rush);letter-spacing:.14em;text-transform:uppercase;font-weight:600;margin:0 0 18px;padding-bottom:16px;border-bottom:1px dashed var(--line-2)}
.roadmap .roadmap-outcomes{list-style:none;padding:0;margin:0;font-size:13.5px;line-height:1.55;color:var(--ink-2)}
.roadmap .roadmap-outcomes li{padding-left:20px;position:relative;margin-bottom:10px;color:var(--ink-2)}
.roadmap .roadmap-outcomes li::before{content:"\25B8";position:absolute;left:0;color:var(--rush);font-weight:600}

/* =============================================================
 * v2.0.2 — per-state accent variation
 * Rotates a secondary accent color for the section-eyebrow number,
 * hero kicker, data-plate strong values, and case-numbers strong
 * values so each state's pages have a unique visual signature.
 * Rush Orange (--rush) remains the primary brand color throughout.
 * ============================================================= */

:root { --accent-2: var(--rush); }

/* North — reds and rust */
.du-state-delhi           { --accent-2: #b91c1c; }
.du-state-haryana         { --accent-2: #a3620a; }
.du-state-punjab          { --accent-2: #c2410c; }
.du-state-uttar-pradesh   { --accent-2: #92400e; }
.du-state-uttarakhand     { --accent-2: #7c2d12; }
.du-state-himachal-pradesh{ --accent-2: #b45309; }
.du-state-jammu-and-kashmir{ --accent-2: #9a3412; }
.du-state-ladakh          { --accent-2: #78350f; }
.du-state-chandigarh      { --accent-2: #b91c1c; }

/* West — coastal blues and teals */
.du-state-maharashtra     { --accent-2: #0369a1; }
.du-state-gujarat         { --accent-2: #0e7490; }
.du-state-goa             { --accent-2: #0891b2; }
.du-state-rajasthan       { --accent-2: #0284c7; }
.du-state-dadra-and-nagar-haveli-and-daman-and-diu { --accent-2: #0e7490; }

/* South — greens and ochre */
.du-state-karnataka       { --accent-2: #15803d; }
.du-state-tamil-nadu      { --accent-2: #ca8a04; }
.du-state-kerala          { --accent-2: #166534; }
.du-state-andhra-pradesh  { --accent-2: #4d7c0f; }
.du-state-telangana       { --accent-2: #a16207; }
.du-state-puducherry      { --accent-2: #16a34a; }
.du-state-lakshadweep     { --accent-2: #0d9488; }

/* East — deep purple and burgundy */
.du-state-west-bengal     { --accent-2: #7e22ce; }
.du-state-odisha          { --accent-2: #86198f; }
.du-state-bihar           { --accent-2: #6b21a8; }
.du-state-jharkhand       { --accent-2: #701a75; }
.du-state-andaman-and-nicobar-islands { --accent-2: #a21caf; }

/* Central */
.du-state-madhya-pradesh  { --accent-2: #4338ca; }
.du-state-chhattisgarh    { --accent-2: #3730a3; }

/* Northeast — vivid, high-hue */
.du-state-assam           { --accent-2: #059669; }
.du-state-arunachal-pradesh { --accent-2: #047857; }
.du-state-manipur         { --accent-2: #065f46; }
.du-state-meghalaya       { --accent-2: #10b981; }
.du-state-mizoram         { --accent-2: #0d9488; }
.du-state-nagaland        { --accent-2: #14b8a6; }
.du-state-tripura         { --accent-2: #0f766e; }
.du-state-sikkim          { --accent-2: #059669; }

/* Apply --accent-2 to selective decorative elements ONLY.
 * The primary brand color (Rush Orange) still dominates CTAs, buttons,
 * benefit-nums, hero kicker text — this is a secondary accent for texture. */

.du-location-page .section-eyebrow-num  { color: var(--accent-2); }
.du-location-page .data-plate strong    { color: var(--accent-2); }
.du-location-page .case-numbers strong  { color: var(--accent-2); }
.du-location-page .roadmap-num          { color: var(--accent-2); }
.du-location-page .why-me-stats strong  { color: var(--accent-2); }
.du-location-page .hero-kicker::before  { background: var(--accent-2); }

/* State hubs get a subtle top-border accent on the hero */
.du-tier-state .hero {
  border-top: 3px solid var(--accent-2);
}
/* City pages get a subtle left-accent on the article body */
.du-tier-city .article-body {
  border-left: 2px solid transparent;
  padding-left: 4px;
}
.du-tier-city .article-body::before {
  content: "";
  display: block;
  height: 3px;
  width: 60px;
  background: var(--accent-2);
  margin-bottom: 24px;
  border-radius: 2px;
}

/* =============================================================
 * v2.0.6 — template alignment fixes
 * ============================================================= */

/* Templates render article-layout without a TOC sidebar — single column */
.article-layout.no-toc {
  grid-template-columns: minmax(0, 1fr);
}
.article-layout.no-toc .article-body {
  max-width: 860px;
  margin: 0 auto;
  width: 100%;
}

/* Breadcrumbs spacing under the site header */
.du-location-page .crumb {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 20px var(--gutter) 0;
  font-family: var(--f-mono, 'JetBrains Mono', monospace);
  font-size: 12px;
  letter-spacing: .04em;
  color: var(--mid);
}
.du-location-page .crumb a { color: var(--mid); text-decoration: none; }
.du-location-page .crumb a:hover { color: var(--rush); }
.du-location-page .crumb .crumb-sep { margin: 0 8px; opacity: .5; }
.du-location-page .crumb [aria-current="page"] { color: var(--ink); }

/* Related section + CTA in template context */
.du-location-page .related {
  /* full-width band; inner header/grid self-contain to var(--wrap) */
  width: 100%;
  margin-top: 64px;
}
.du-location-page .cta-block {
  width: min(var(--wrap), calc(100% - 2 * var(--gutter)));
  max-width: var(--wrap);
  margin: 48px auto 64px;
}

/* =============================================================
 * v2.3.0 — EEAT trust block
 * ============================================================= */
.du-eeat-block {
  max-width: 860px;
  margin: 64px auto 0;
  padding: 0 var(--gutter);
}
.du-eeat-inner {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 28px 32px;
  background: var(--bone-2, #faf7f2);
}
.du-eeat-author {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--line);
}
.du-eeat-avatar {
  flex: 0 0 56px;
  width: 56px; height: 56px;
  border-radius: 50%;
  background: var(--rush);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--f-heading);
  font-weight: 700;
  font-size: 20px;
}
.du-eeat-byline {
  margin: 0 0 4px;
  font-size: 15px;
  color: var(--ink);
}
.du-eeat-cred {
  margin: 0 0 8px;
  font-size: 13px;
  line-height: 1.55;
  color: var(--mid);
}
.du-eeat-links {
  margin: 0;
  font-size: 13px;
}
.du-eeat-links a { color: var(--rush); text-decoration: none; }
.du-eeat-links a:hover { text-decoration: underline; }
.du-eeat-meta {
  display: grid;
  gap: 10px;
  padding-top: 18px;
}
.du-eeat-meta-item {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 14px;
  align-items: baseline;
}
@media (max-width: 640px) { .du-eeat-meta-item { grid-template-columns: 1fr; gap: 2px; } }
.du-eeat-meta-label {
  font-family: var(--f-mono, 'JetBrains Mono', monospace);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--mid);
}
.du-eeat-meta-value {
  font-size: 13px;
  line-height: 1.55;
  color: var(--ink);
}

/* =============================================================
 * v2.4.0 — Root page region/state/city browser
 * ============================================================= */
.du-browser {
  max-width: var(--wrap);
  margin: 24px auto 48px;
  padding: 0 var(--gutter);
}
.du-browser-inner {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 0;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(14,14,14,.04);
}
@media (max-width: 860px) { .du-browser-inner { grid-template-columns: 1fr; } }

/* Sidebar */
.du-browser-side {
  padding: 28px 24px;
  border-right: 1px solid var(--line);
  background: var(--bone-2, #faf7f2);
}
@media (max-width: 860px) { .du-browser-side { border-right: none; border-bottom: 1px solid var(--line); } }
.du-browser-side-label {
  font-family: var(--f-mono, 'JetBrains Mono', monospace);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--rush);
  padding-bottom: 14px;
  margin-bottom: 14px;
  border-bottom: 1px solid var(--line);
}
.du-browser-tabs { display: flex; flex-direction: column; gap: 4px; }
.du-browser-tab {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 13px 16px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 10px;
  cursor: pointer;
  text-align: left;
  font-family: var(--f-heading);
  font-size: 15.5px;
  font-weight: 600;
  color: var(--ink);
  transition: background .15s, border-color .15s, color .15s;
}
.du-browser-tab:hover { background: rgba(249,115,22,.06); }
.du-browser-tab.is-active {
  background: rgba(249,115,22,.09);
  border-color: rgba(249,115,22,.35);
  color: var(--rush);
}
.du-browser-tab-count {
  font-family: var(--f-mono, monospace);
  font-size: 12.5px;
  font-weight: 600;
  color: var(--mid);
  white-space: nowrap;
}
.du-browser-tab.is-active .du-browser-tab-count { color: var(--rush); }
.du-browser-viewall {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 22px;
  padding: 11px 18px;
  border: 1.5px solid var(--rush);
  border-radius: 10px;
  font-family: var(--f-heading);
  font-size: 14px;
  font-weight: 600;
  color: var(--rush);
  text-decoration: none;
  transition: background .15s, color .15s;
}
.du-browser-viewall:hover { background: var(--rush); color: #fff; }

/* Panels */
.du-browser-main { padding: 28px 32px; min-height: 380px; }
.du-browser-panel { display: none; }
.du-browser-panel.is-active { display: block; }
.du-browser-panel-head {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  padding-bottom: 18px;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--line);
}
.du-browser-panel-title {
  font-family: var(--f-heading);
  font-size: clamp(22px, 2.6vw, 30px);
  font-weight: 600;
  letter-spacing: -.02em;
  color: var(--ink);
  margin: 0;
}
.du-browser-pill {
  background: var(--rush);
  color: #fff;
  font-family: var(--f-mono, monospace);
  font-size: 12px;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 999px;
  white-space: nowrap;
}

/* State blocks inside a panel */
.du-browser-state { padding: 14px 0; border-bottom: 1px dashed var(--line); }
.du-browser-state:last-child { border-bottom: none; }
.du-browser-state-name { margin-bottom: 8px; }
.du-browser-state-link {
  font-family: var(--f-heading);
  font-size: 16.5px;
  font-weight: 600;
  color: var(--ink);
  text-decoration: none;
  border-bottom: 2px solid rgba(249,115,22,.35);
  transition: color .15s, border-color .15s;
}
.du-browser-state-link:hover { color: var(--rush); border-color: var(--rush); }
.du-browser-cities {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 6px 18px;
}
.du-browser-cities li {
  position: relative;
  padding-left: 16px;
  font-size: 14.5px;
  line-height: 1.5;
}
.du-browser-cities li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: var(--rush);
}
.du-browser-city-link { color: var(--ink); text-decoration: none; transition: color .15s; }
.du-browser-city-link:hover { color: var(--rush); text-decoration: underline; }

/* Unpublished = muted */
.du-loc-soon { color: var(--mid); opacity: .55; cursor: default; border-bottom: none; }

/* All-states flat index containment */
.location-index { padding: 56px 0; background: var(--off); border-top: 1px solid var(--line); }
.location-index-inner { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }
.location-index-inner h2 {
  font-family: var(--f-heading);
  font-size: var(--t-2xl);
  font-weight: 600;
  letter-spacing: -.02em;
  margin: 0 0 28px;
  color: var(--ink);
}
.location-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 12px;
}
.location-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 18px 20px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r, 10px);
  text-decoration: none;
  transition: border-color .15s, transform .15s;
}
a.location-card:hover { border-color: var(--ink); transform: translateY(-2px); }
.location-card-title { font-family: var(--f-heading); font-size: 15.5px; font-weight: 600; color: var(--ink); }
.location-card-meta { font-family: var(--f-mono, monospace); font-size: 12px; color: var(--mid); }

/* v2.6.0 — services strip on root */
.du-services-strip { max-width: var(--wrap); margin: 0 auto 56px; padding: 0 var(--gutter); }
.du-services-strip-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.du-services-strip-head h2 { font-family: var(--f-heading); font-size: var(--t-2xl); font-weight: 600; letter-spacing: -.02em; color: var(--ink); margin: 0; }

/* v2.7.0 — city page industries strip */
.du-city-industries { max-width: var(--wrap); margin: 48px auto 0; padding: 0 var(--gutter); }
.du-city-industries-inner { border: 1px solid var(--line); border-radius: 12px; padding: 28px 32px; background: var(--white); }
.du-city-industries h2 { font-family: var(--f-heading); font-size: var(--t-xl); font-weight: 600; letter-spacing: -.02em; margin: 0 0 6px; color: var(--ink); }
.du-city-industries-sub { margin: 0 0 18px; font-size: 14px; color: var(--mid); }
.du-city-industries-links { display: flex; flex-wrap: wrap; gap: 10px; }
.du-ind-chip { display: inline-block; padding: 9px 16px; border: 1px solid var(--line); border-radius: 999px; font-size: 13.5px; font-weight: 500; color: var(--ink); text-decoration: none; transition: border-color .15s, color .15s, background .15s; }
.du-ind-chip:hover { border-color: var(--rush); color: var(--rush); }
.du-ind-chip-all { background: var(--rush); border-color: var(--rush); color: #fff; }
.du-ind-chip-all:hover { background: var(--ink); border-color: var(--ink); color: #fff; }