/* numericaconsulting.com, the 2026 design (REDESIGN-PLAN.md section 3; the Design canvas "Numerica website
   redesign"). Colours and fonts are the brand kit's custom properties only (brand.numerica.in, tokens.css),
   never copied by hand. The posts' and pages' WordPress bodies are styled by content.css. */

*, *::before, *::after { box-sizing: border-box; }
/* The room the sticky header takes at its fullest (about 125px on a computer), which anything else that
   sticks, and an anchor scrolled to, keeps clear of. */
:root { --header-room: 128px; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: var(--header-room); }
body { margin: 0; background: var(--nb-white); color: var(--nb-grey-600); font-family: var(--nb-font-ui); font-size: 16px; line-height: 1.6; }
img { max-width: 100%; height: auto; }
a { color: var(--nb-blue-600); }
a:hover { color: var(--nb-blue-800); }
button, input, select, textarea { font: inherit; }
:focus-visible { outline: 3px solid var(--nb-blue-600); outline-offset: 2px; }
.site-nav :focus-visible, .title-band :focus-visible, .menu-toggle:focus-visible { outline-color: var(--nb-blue-300); }
.site-nav .nav-panel :focus-visible { outline-color: var(--nb-blue-600); }
h1, h2, h3, h4 { color: var(--nb-blue-900); letter-spacing: -0.02em; line-height: 1.2; }
.wrap { max-width: 1240px; margin: 0 auto; padding: 0 32px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 16px; top: -48px; z-index: 100; background: var(--nb-white); padding: 8px 16px; border-radius: 8px; }
.skip-link:focus { top: 8px; }
.accent-rule { display: block; width: 32px; height: 4px; border-radius: 2px; background: var(--nb-red-500); margin-bottom: 16px; }

/* The header, the ribbon and the menu bar, stays at the top of the window; past the page's first band it
   tightens (site.js adds is-compact), leaving the page more room. */
.site-header { position: sticky; top: 0; z-index: 30; }
.ribbon .wrap, .ribbon-logo img, .nav-link, .nav-open { transition: padding 0.2s, height 0.2s, min-height 0.2s; }
.site-header.is-compact .ribbon .wrap { padding-top: 2px; padding-bottom: 2px; }
.site-header.is-compact .ribbon-logo img { height: 26px; }
.site-header.is-compact .nav-link, .site-header.is-compact .nav-open { min-height: 44px; }

/* The ribbon: the logo, the tagline and Client login, on white. */
.ribbon { border-bottom: 1px solid var(--nb-grey-200); background: var(--nb-white); }
.ribbon .wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; padding-top: 12px; padding-bottom: 12px; }
.ribbon-logo { display: inline-flex; align-items: center; min-height: 44px; }
.ribbon-logo img { height: 32px; width: auto; display: block; }
.ribbon-rule { width: 1px; height: 24px; background: var(--nb-grey-300); }
.ribbon-tagline { font-size: 14px; font-weight: 600; color: var(--nb-grey-700); }
.ribbon-login { margin-left: auto; color: var(--nb-blue-900); text-decoration: none; font-size: 14px; font-weight: 500; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; }
.menu-toggle { display: none; }

/* The menu bar, navy, with its drop-downs. */
.site-nav { position: relative; z-index: 20; background: var(--nb-blue-900); }
.site-nav > .wrap { padding: 0 16px; }
.nav-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.nav-item { display: flex; align-items: stretch; }
.nav-link { color: var(--nb-white); text-decoration: none; font-size: 15px; font-weight: 500; padding: 0 6px 0 16px; min-height: 56px; display: inline-flex; align-items: center; }
.nav-item:not(.has-panel) .nav-link { padding-right: 16px; }
.nav-home { gap: 8px; }
.nav-home svg { display: block; flex: none; }
.nav-link:hover, .nav-link:focus-visible { color: var(--nb-blue-100); }
.nav-link[aria-current] { box-shadow: inset 0 -3px 0 var(--nb-blue-300); font-weight: 600; }
.nav-open { border: 0; background: transparent; color: var(--nb-white); cursor: pointer; min-width: 36px; min-height: 56px; padding: 0 12px 0 4px; display: inline-flex; align-items: center; }
.nav-open svg { transition: transform 0.15s; }
.nav-open[aria-expanded="true"] svg { transform: rotate(180deg); }
.nav-item.is-open { background: var(--nb-blue-800); }
.nav-panel { position: absolute; left: 0; right: 0; top: 100%; background: var(--nb-white); border-bottom: 1px solid var(--nb-grey-200); box-shadow: 0 24px 48px rgb(16 24 40 / 12%); }
.nav-panel[hidden] { display: none; }
@media (min-width: 861px) {
  .nav-panel { max-height: calc(100vh - var(--header-room)); max-height: calc(100dvh - var(--header-room)); overflow-y: auto; }
}
.nav-panel .wrap { padding-top: 32px; padding-bottom: 32px; display: flex; flex-wrap: wrap; gap: 24px 40px; }
.nav-group { flex: 1 1 280px; min-width: 0; }
.nav-group-title { margin: 0 0 8px 12px; font-size: 12px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--nb-grey-500); }
.nav-group ul { list-style: none; margin: 0; padding: 0; }
.nav-panel a { display: block; padding: 12px; border-radius: 10px; text-decoration: none; }
.nav-panel a:hover, .nav-panel a:focus-visible, .nav-panel a[aria-current] { background: var(--nb-blue-50); }
.nav-panel-title { display: block; font-size: 16px; font-weight: 600; color: var(--nb-blue-900); }
.nav-panel-line { display: block; margin-top: 2px; font-size: 14px; line-height: 1.5; color: var(--nb-grey-600); }

/* A page's title band. */
.title-band { background: var(--nb-blue-900); border-top: 1px solid var(--nb-blue-800); color: var(--nb-blue-100); }
.title-band .wrap { padding-top: 28px; padding-bottom: 56px; min-height: 300px; }
.title-band h1 { margin: 40px 0 0; max-width: 860px; font-size: clamp(32px, 4vw, 48px); font-weight: 700; line-height: 1.1; letter-spacing: -0.025em; color: var(--nb-white); }
.title-band .lede { margin: 20px 0 0; max-width: 640px; font-size: 18px; line-height: 1.55; color: var(--nb-blue-100); }
.eyebrow { display: block; margin: 0 0 12px; font-size: 13px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--nb-blue-200); }
.breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; font-size: 14px; color: var(--nb-blue-200); }
.breadcrumb a { color: var(--nb-blue-100); text-decoration: none; }
.breadcrumb a:hover { color: var(--nb-white); text-decoration: underline; }
.breadcrumb [aria-current] { color: var(--nb-white); }
.breadcrumb li:not(:last-child)::after { content: "/"; margin-left: 8px; color: var(--nb-blue-300); }

/* A page's body and its side column. */
.page-body { padding-top: 56px; padding-bottom: 96px; display: flex; flex-wrap: wrap; gap: 48px 64px; align-items: flex-start; }
.page-main { flex: 999 1 600px; min-width: 0; }
.page-side { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.side-box { border: 1px solid var(--nb-grey-200); border-radius: 16px; padding: 24px; }
.side-box h2, .side-box h3 { margin-top: 0; font-size: 18px; }
.page-image, .post-image { margin: 0 0 28px; }
.page-image img, .post-image img { display: block; border-radius: 12px; }
.post-main { max-width: 820px; }
.post-image img { width: 100%; }
.post-topics { margin-top: 32px; font-size: 15px; }
.page-meta { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 20px; font-size: 14px; color: var(--nb-blue-100); }
.page-meta a { color: var(--nb-white); }

/* Buttons. */
.button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 24px; border-radius: 8px; border: 0; font-weight: 600; text-decoration: none; cursor: pointer; }
.button-primary { background: var(--nb-blue-600); color: var(--nb-white); }
.button-primary:hover { background: var(--nb-blue-700); color: var(--nb-white); }
.button-light { background: var(--nb-white); color: var(--nb-blue-900); }
.button-light:hover { background: var(--nb-blue-50); color: var(--nb-blue-900); }
.button-soft { background: var(--nb-blue-50); color: var(--nb-blue-600); }
.button-outline { background: transparent; color: var(--nb-white); box-shadow: inset 0 0 0 1px var(--nb-blue-300); }
.button-outline:hover { color: var(--nb-white); box-shadow: inset 0 0 0 1px var(--nb-blue-300); }

/* The call to action before the footer. */
.cta-band { background: var(--nb-blue-50); border-radius: 20px; padding: 40px 48px; display: flex; flex-wrap: wrap; align-items: center; gap: 24px 48px; }
.cta-band > div { flex: 999 1 420px; }
.cta-band h2 { margin: 0; font-size: 28px; }
.cta-band p { margin: 8px 0 0; color: var(--nb-grey-700); }
.cta-note { font-size: 13px; color: var(--nb-grey-600); }

/* Lists of posts. */
.cards { display: flex; flex-wrap: wrap; gap: 20px; }
.card { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 10px; padding: 24px; border: 1px solid var(--nb-grey-200); border-radius: 14px; text-decoration: none; color: var(--nb-grey-600); }
.card:hover { border-color: var(--nb-blue-200); color: var(--nb-grey-600); }
.card-image { margin: -24px -24px 8px; border-radius: 14px 14px 0 0; overflow: hidden; aspect-ratio: 16 / 9; background: var(--nb-grey-100); }
.card-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.card-meta { font-size: 13px; color: var(--nb-grey-500); }
.card .card-meta { order: -1; }
.card .card-image { order: -2; }
.card-title { margin: 0; font-size: 19px; font-weight: 600; line-height: 1.35; letter-spacing: -0.01em; color: var(--nb-blue-900); }
.card-excerpt { font-size: 15px; }
.pill { display: inline-block; background: var(--nb-blue-50); color: var(--nb-blue-700); border-radius: 999px; padding: 1px 10px; font-weight: 500; margin-right: 6px; }

/* The links to the discount-rate pages, each with a sketch of its curve (partials/2026/rate-links.njk). */
.rate-links { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 20px; }
.rate-link { flex: 1 1 420px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 20px 28px; background: var(--nb-grey-50); border-radius: 14px; text-decoration: none; color: var(--nb-grey-600); }
.rate-link:hover .rate-title { text-decoration: underline; }
.rate-title { display: block; font-size: 17px; font-weight: 600; color: var(--nb-blue-900); }
.rate-line { display: block; font-size: 14px; }
.pager { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 40px; }
.pager a, .pager span { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 12px; border-radius: 8px; border: 1px solid var(--nb-grey-200); text-decoration: none; }
.pager [aria-current] { background: var(--nb-blue-900); border-color: var(--nb-blue-900); color: var(--nb-white); }

/* A post's share links. */
.share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 24px; font-size: 14px; }
.share a, .share button { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border-radius: 50%; border: 1px solid var(--nb-blue-300); background: transparent; color: var(--nb-white); text-decoration: none; cursor: pointer; }
.share a:hover, .share button:hover { background: var(--nb-blue-800); color: var(--nb-white); }
.share-copied { display: none; font-size: 13px; color: var(--nb-white); }
.share .is-copied + .share-copied { display: inline; }

/* The footer, dark grey, as the WordPress design's; its links plain text until hovered. */
.site-footer { background: var(--nb-grey-800); color: var(--nb-grey-300); font-size: 14px; }
.site-footer a { color: var(--nb-grey-300); text-decoration: none; }
.site-footer a:hover { color: var(--nb-white); text-decoration: underline; }
.site-footer :focus-visible { outline-color: var(--nb-blue-300); }
.site-footer .wrap { padding-top: 56px; padding-bottom: 24px; display: flex; flex-wrap: wrap; gap: 32px 64px; align-items: flex-start; }
.footer-brand { flex: 1 1 240px; }
.footer-logo { margin: 0; }
.footer-logo img { height: 32px; width: auto; display: block; }
.footer-brand p { margin: 12px 0 0; }
.footer-offices { flex: 3 1 600px; display: flex; flex-wrap: wrap; gap: 16px 32px; }
.footer-office { flex: 1 1 160px; display: flex; flex-direction: column; }
.footer-office strong { color: var(--nb-white); }
.footer-office address { font-style: normal; }
.footer-tel { margin-top: auto; padding-top: 8px; }
.footer-nav { flex: 1 1 100%; display: flex; flex-wrap: wrap; gap: 0 28px; border-top: 1px solid var(--nb-grey-700); padding-top: 16px; }
.footer-nav a { display: inline-flex; min-height: 40px; align-items: center; }
.footer-legal { flex: 1 1 100%; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; color: var(--nb-grey-400); font-size: 13px; }
.footer-legal a { color: var(--nb-grey-400); }

/* Placeholders: missing content the preview shows and production refuses (REDESIGN-PLAN.md section 2). */
[data-nc-placeholder] { display: inline-block; border: 1px dashed var(--nb-red-500); border-radius: 6px; padding: 0 6px; color: var(--nb-red-700); background: var(--nb-red-50); }

/* The phone width: the menu behind a button, the drop-downs as sections. */
@media (max-width: 860px) {
  .wrap { padding: 0 20px; }
  .ribbon .wrap { flex-wrap: nowrap; gap: 8px; }
  .ribbon-logo img { height: 26px; }
  .ribbon-tagline, .ribbon-rule { display: none; }
  .ribbon-login { margin-left: auto; min-width: 44px; justify-content: center; }
  .ribbon-login-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .js .menu-toggle { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border: 0; border-radius: 8px; background: var(--nb-blue-900); color: var(--nb-white); font-weight: 600; cursor: pointer; }
  .js .site-nav:not(.is-open) { display: none; }
  .site-nav > .wrap { padding: 8px 0 16px; }
  .nav-list { flex-direction: column; }
  .nav-item { flex-wrap: wrap; border-bottom: 1px solid var(--nb-blue-800); }
  .nav-link { flex: 1 1 auto; font-size: 17px; padding: 0 20px; }
  .nav-open { padding: 0 20px; }
  .nav-item.is-open { background: transparent; }
  .nav-panel { position: static; flex: 1 1 100%; box-shadow: none; border: 0; background: var(--nb-blue-800); }
  .nav-panel .wrap { padding: 8px 12px 16px; gap: 8px; }
  .nav-group-title { color: var(--nb-blue-200); }
  .nav-panel a:hover, .nav-panel a:focus-visible, .nav-panel a[aria-current] { background: var(--nb-blue-700); }
  .nav-panel-title { color: var(--nb-white); }
  .nav-panel-line { display: none; }
  .site-nav .nav-panel :focus-visible { outline-color: var(--nb-blue-300); }
  .nav-panel .wrap { padding-left: 4px; }
  .title-band .wrap { padding-bottom: 48px; min-height: 240px; }
  .js .site-nav.is-open { max-height: calc(100vh - var(--header-room)); max-height: calc(100dvh - var(--header-room)); overflow-y: auto; }
  .nav-home-text { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; white-space: normal; }
  .title-band h1 { margin-top: 28px; }
  .page-body { padding-top: 40px; padding-bottom: 64px; }
  .cta-band { padding: 28px 24px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

/* An offering's page, a hub and Our work (layouts/2026/offering.njk, hub.njk, our-work.njk). */
.title-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 28px 0 0; }
.section-line { margin: 8px 0 0; max-width: 72ch; }
.offer-section { margin-top: 56px; }
.offer-section:first-child { margin-top: 0; }
.offer-section h2 { margin: 0 0 20px; font-size: 28px; }
/* The hint of red the home page's headings carry (.accent-rule), on the other pages: under the title band's title,
   above the sections' headings, and on bullets (never a list's numbers, which are text and need more contrast). */
.title-band h1::after, .offer-section > h2:not(.section-label)::before, .page-main.prose > h2::before { content: ""; display: block; width: 32px; height: 4px; border-radius: 2px; background: var(--nb-red-500); }
.title-band h1::after { margin-top: 20px; }
.offer-section > h2:not(.section-label)::before, .page-main.prose > h2::before { margin-bottom: 14px; }
.prose ul > li::marker, .faq-links > li::marker { color: var(--nb-red-500); }
.offer-lead { margin: 0 0 32px; max-width: 680px; font-size: 20px; line-height: 1.5; color: var(--nb-grey-700); }
.plan-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.plan-grid li { border: 1px solid var(--nb-grey-200); border-radius: 12px; padding: 16px 18px; }
.plan-title { display: block; font-weight: 600; color: var(--nb-blue-900); }
.plan-line { display: block; margin-top: 2px; font-size: 15px; line-height: 1.5; }
.tick-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.tick-list li { display: flex; gap: 12px; align-items: flex-start; color: var(--nb-grey-700); max-width: 72ch; }
.tick-list svg { flex: none; margin-top: 2px; }
.steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
.steps li { background: var(--nb-grey-50); border-radius: 14px; padding: 20px; }
.step-number { display: inline-flex; width: 32px; height: 32px; border-radius: 999px; background: var(--nb-blue-900); color: var(--nb-white); font-size: 14px; font-weight: 600; align-items: center; justify-content: center; }
.step-title { display: block; margin-top: 12px; font-weight: 600; color: var(--nb-blue-900); }
.step-line { display: block; margin-top: 4px; font-size: 15px; line-height: 1.5; }
.faqs { border-top: 1px solid var(--nb-grey-200); }
.faqs details { border-bottom: 1px solid var(--nb-grey-200); }
.faqs summary::marker { color: var(--nb-red-500); }
.faqs summary { cursor: pointer; padding: 16px 4px; min-height: 56px; font-weight: 600; color: var(--nb-blue-900); list-style-position: inside; }
.faqs details > .prose { padding: 0 4px 16px; font-size: 16px; }
.faqs summary h4 { display: inline; margin: 0; font: inherit; letter-spacing: inherit; }
.faq-group { margin: 32px 0 12px; }
.faq-links { margin: 12px 0 0; padding-left: 20px; font-size: 16px; }
.faq-links li { margin: 4px 0; }
.gallery-track { list-style: none; margin: 0; padding: 0; display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: thin; }
.gallery-track:focus-visible { outline-offset: 4px; }
.gallery-slide { flex: 0 0 100%; scroll-snap-align: start; }
.gallery-slide figure { margin: 0; }
.gallery-slide > img { box-shadow: 0 12px 24px rgb(16 24 40 / 8%); }
.gallery-slide img { display: block; width: 100%; height: auto; border: 1px solid var(--nb-grey-200); border-radius: 12px; }
.gallery-slide figcaption { margin-top: 12px; font-size: 15px; color: var(--nb-grey-600); }
.gallery-controls { display: none; }
.js .gallery-controls { display: flex; align-items: center; gap: 12px; margin: 16px 0 0; }
.gallery-button { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 999px; border: 1px solid var(--nb-grey-300); background: var(--nb-white); color: var(--nb-blue-900); cursor: pointer; }
.gallery-button:hover { border-color: var(--nb-blue-600); }
.gallery-button[aria-disabled="true"] { opacity: 0.4; cursor: default; }
.gallery-count { font-size: 14px; color: var(--nb-grey-600); min-width: 4ch; text-align: center; }
.how-to details { border: 1px solid var(--nb-grey-200); border-radius: 14px; padding: 0 20px; }
.how-to summary { cursor: pointer; padding: 16px 0; min-height: 56px; font-weight: 600; color: var(--nb-blue-900); list-style-position: inside; }
.how-to h3 { margin: 24px 0 8px; font-size: 18px; color: var(--nb-blue-900); }
.how-to details > .prose { font-size: 16px; }
.how-to details > .prose:last-child { padding-bottom: 20px; }
.side-sticky { position: sticky; top: var(--header-room); }
.side-box .side-heading, .side-heading { margin: 0 0 12px; font-size: 13px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--nb-grey-600); }
.glance { margin: 0 0 20px; display: grid; gap: 12px; }
.glance dt { font-size: 13px; color: var(--nb-grey-500); }
.glance dd { margin: 2px 0 0; font-weight: 500; color: var(--nb-grey-900); }
.rate-card { display: block; padding: 16px 20px; border-radius: 14px; background: var(--nb-grey-50); text-decoration: none; color: var(--nb-grey-600); }
.rate-card:hover .rate-title { text-decoration: underline; }
.rate-card .rate-title { display: block; font-weight: 600; color: var(--nb-blue-900); }
.rate-card .rate-line { display: block; font-size: 13px; }
.toc { margin: 24px 0 0; padding: 20px 24px; border-radius: 14px; background: var(--nb-grey-50); }
.toc h2 { margin: 0 0 8px; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--nb-grey-600); }
.toc ul { margin: 0; padding-left: 1.2em; columns: 2 220px; }
.toc li { margin: 0; padding: 2px 0; break-inside: avoid; }
.group-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.group-card { border: 1px solid var(--nb-grey-200); border-radius: 16px; padding: 24px; }
.group-card h2 { margin: 0 0 8px; font-size: 22px; }
.group-card ul { list-style: none; margin: 16px 0 0; padding: 0; }
.group-card li { border-top: 1px solid var(--nb-grey-200); }
.group-card a { display: block; padding: 12px 0; font-weight: 600; text-decoration: none; }
.group-card a:hover { text-decoration: underline; }
.quote-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr)); gap: 20px; }
.quote-card { margin: 0; border: 1px solid var(--nb-grey-200); border-radius: 16px; padding: 28px; display: flex; flex-direction: column; gap: 16px; background: var(--nb-white); }
.quote-card blockquote { margin: 0; font-size: 17px; line-height: 1.55; color: var(--nb-blue-900); }
.quote-card figcaption { margin-top: auto; font-size: 14px; }
.quote-card figcaption strong { display: block; color: var(--nb-grey-900); }
.more-quotes { margin-top: 20px; }
.more-quotes summary { cursor: pointer; display: inline-flex; align-items: center; min-height: 48px; padding: 0 22px; border-radius: 8px; background: var(--nb-blue-900); color: var(--nb-white); font-weight: 600; list-style: none; }
.more-quotes summary::-webkit-details-marker { display: none; }
.more-quotes[open] summary { margin-bottom: 20px; }
.client-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; }
.client-grid li { display: flex; align-items: center; justify-content: center; }
.client-grid img { display: block; max-width: 100%; height: auto; }
.project-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr)); gap: 20px; }
.project-card { border: 1px solid var(--nb-grey-200); border-radius: 16px; padding: 24px; display: flex; flex-direction: column; gap: 10px; }
.project-card h3 { margin: 0; font-size: 19px; }
.project-tags { display: flex; flex-wrap: wrap; gap: 6px; font-size: 13px; }
.project-tags span { border-radius: 999px; padding: 1px 10px; background: var(--nb-blue-50); color: var(--nb-blue-700); font-weight: 500; }
.band-grey { background: var(--nb-grey-50); border-top: 1px solid var(--nb-grey-200); border-bottom: 1px solid var(--nb-grey-200); }

@media (max-width: 860px) {
  .side-sticky { position: static; }
  .offer-section { margin-top: 40px; }
  .offer-section h2 { font-size: 24px; }
  .offer-lead { font-size: 18px; }
  .rate-link { padding: 16px 20px; }
  .rate-link svg { width: 96px; }
}
.more-section { border-top: 1px solid var(--nb-grey-200); padding-top: 32px; }
.jump-links { display: flex; flex-wrap: wrap; gap: 4px 20px; margin-top: 24px; }
.jump-links a { color: var(--nb-white); display: inline-flex; align-items: center; min-height: 44px; font-weight: 500; text-decoration: none; }
.jump-links a:hover { text-decoration: underline; }
.title-band .lede p { margin: 0; }
.section-label { margin: 0 0 8px; font-size: 13px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--nb-grey-600); }
.offer-section h2.section-label { margin: 0 0 8px; font-size: 13px; letter-spacing: 0.06em; }

/* The contact page: the quotes in blue so they stand out, the job plain; the other ways to reach us as
   buttons of one kind, each with its icon (the owner, 1 Nov 2026). */
.quick-routes { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-bottom: 40px; }
.quick-route { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 96px; padding: 20px 24px; border-radius: 14px; background: var(--nb-blue-600); color: var(--nb-white); font-size: 17px; font-weight: 600; line-height: 1.35; text-decoration: none; }
.quick-route:hover { background: var(--nb-blue-700); color: var(--nb-white); }
.quick-route svg { flex: none; }
.quick-route-plain { background: var(--nb-white); color: var(--nb-blue-900); box-shadow: inset 0 0 0 1px var(--nb-grey-300); }
.quick-route-plain:hover { background: var(--nb-blue-50); color: var(--nb-blue-900); }
.contact-ways { display: flex; flex-direction: column; gap: 10px; margin: 0; }
.contact-ways .button { justify-content: flex-start; width: 100%; padding: 0 16px; }
.contact-office a { color: inherit; text-decoration: none; }
.contact-office a:hover { color: var(--nb-blue-800); text-decoration: underline; }

/* A post's side column: related posts, topics and regions, and a call to action. */
.side-links { list-style: none; margin: 0; padding: 0; }
.side-links li { padding: 8px 0; border-top: 1px solid var(--nb-grey-100); }
.side-links li:first-child { border-top: 0; padding-top: 0; }
.side-links a { color: var(--nb-blue-900); font-weight: 500; line-height: 1.4; text-decoration: none; }
.side-links a:hover { color: var(--nb-blue-600); text-decoration: underline; }
.side-date { display: block; margin-top: 2px; font-size: 13px; color: var(--nb-grey-500); }
.side-action { background: var(--nb-blue-50); border-color: var(--nb-blue-50); }
.post-side { align-self: stretch; }
.post-side .side-action { position: sticky; top: var(--header-room); }
.side-action p { margin: 0 0 16px; }

/* Our work's sample reports: each card, a report's icon, opens the sample reports' form. */
.sample-icon { color: var(--nb-blue-600); }
.sample-card { text-decoration: none; color: var(--nb-grey-600); }
.sample-card:hover { border-color: var(--nb-blue-300); color: var(--nb-grey-600); }
.sample-card h3 { color: var(--nb-blue-900); }
.sample-action { margin-top: auto; display: inline-flex; align-items: center; gap: 8px; font-weight: 600; color: var(--nb-blue-600); }

/* The sample reports' form page: a sample of pages from one report in a carousel, beside the form. */
.samples-body h2 { margin: 0 0 20px; font-size: 24px; }
.sample-previews { flex: 999 1 520px; min-width: 0; }
.sample-previews .gallery { max-width: 480px; }
.samples-form { flex: 1 1 340px; min-width: 0; }