/* Base reset for the standalone static build. Mirrors only what these pages need. */
*,*::before,*::after{box-sizing:border-box;border-width:0;border-style:solid}
html{-webkit-text-size-adjust:100%;line-height:1.5;tab-size:4}
body{margin:0;line-height:inherit}
h1,h2,h3,h4,h5,h6,p,ul,ol,dl,dd,dt,figure,blockquote,pre,fieldset,legend{margin:0;padding:0}
ul,ol{list-style:none}
img,video,svg,canvas{display:block;max-width:100%;height:auto}
button,input,select,textarea{font:inherit;color:inherit;background:transparent;margin:0}
button{cursor:pointer}
a{color:inherit;text-decoration:inherit}
table{border-collapse:collapse}
[hidden]{display:none}


/* ---- site.css ---- */
/* ==========================================================================
   Golden Hour Turnovers - the site's own brand layer.
   A `type: "website"` build: no Quanta, no q-* tokens, no Higgsfield surface.
   Loaded at the top of styles.css so these unlayered rules win over every
   Tailwind/Quanta layer.

   Corner rule: every surface is 14px. The one exception is the primary quote
   CTA, which is a deliberate full pill so it reads as the single action on a
   page rather than as another card.
   ========================================================================== */

/* --- tokens ------------------------------------------------------------- */
:root {
  --gh-espresso: #1c1611;
  --gh-espresso-2: #241c15;
  --gh-paper: #f7f2e7;
  --gh-paper-2: #efe8d9;
  --gh-ink: #2a2118;
  --gh-ink-soft: #6e5c46;
  --gh-gold: #d69b74;
  --gh-bronze: #8a5a32;
  --gh-line: #dfd5c2;
  --gh-white: #ffffff;
  --gh-alert: #8a3320;

  --gh-serif: "Cormorant Garamond", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --gh-sans: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --gh-r: 14px;
  --gh-wrap: 78rem;
  --gh-header-h: 76px;
  --gh-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* --- base --------------------------------------------------------------- */
html {
  background-color: var(--gh-paper) !important;
  color-scheme: light !important;
  scroll-padding-top: calc(var(--gh-header-h) + 18px);
  -webkit-text-size-adjust: 100%;
}

html,
body {
  overflow-x: clip;
}

body.gh-body {
  margin: 0;
  min-height: 100dvh;
  background-color: var(--gh-paper);
  color: var(--gh-ink);
  font-family: var(--gh-sans);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

:where(.gh-body) * {
  border-color: var(--gh-line);
}

:where(.gh-body) img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Zero-specificity so every CTA garment keeps its own text colour. */
:where(.gh-body) a {
  color: inherit;
  text-decoration: none;
}

:where(.gh-body) button {
  font: inherit;
  color: inherit;
}

:where(.gh-body) :focus-visible {
  outline: 3px solid var(--gh-bronze);
  outline-offset: 3px;
  border-radius: 4px;
}

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

.gh-skip {
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 200;
  padding: 0.75rem 1.25rem;
  background: var(--gh-espresso);
  color: var(--gh-paper);
  border-radius: 0 0 var(--gh-r) var(--gh-r);
  font-weight: 600;
  transform: translate(-50%, -110%);
  transition: transform 0.25s var(--gh-ease);
}

.gh-skip:focus {
  transform: translate(-50%, 0);
}

/* --- layout ------------------------------------------------------------- */
.gh-wrap {
  width: 100%;
  max-width: var(--gh-wrap);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 5vw, 3.5rem);
}

.gh-wrap--narrow {
  max-width: 56rem;
}

.gh-section {
  position: relative;
  padding-block: clamp(4rem, 8.5vw, 8rem);
}

.gh-section--tight {
  padding-block: clamp(2.75rem, 5vw, 4.5rem);
}

.gh-section--paper2 {
  background: var(--gh-paper-2);
}

.gh-section--dark {
  background: var(--gh-espresso);
  color: var(--gh-paper);
}

.gh-section--dark .gh-display,
.gh-section--dark .gh-h1,
.gh-section--dark .gh-h2,
.gh-section--dark .gh-h3,
.gh-section--dark .gh-h4 {
  color: var(--gh-paper);
}

.gh-section--dark .gh-body-text,
.gh-section--dark .gh-lede {
  color: color-mix(in srgb, var(--gh-paper) 78%, transparent);
}

.gh-section--dark .gh-eyebrow {
  color: var(--gh-gold);
}

/* --- type --------------------------------------------------------------- */
.gh-display,
.gh-h1,
.gh-h2,
.gh-h3,
.gh-h4 {
  font-family: var(--gh-serif);
  font-weight: 400;
  color: var(--gh-ink);
  text-wrap: balance;
  margin: 0;
}

.gh-display {
  font-size: clamp(2.9rem, 7vw, 6rem);
  line-height: 0.98;
  letter-spacing: -0.02em;
}

.gh-h1 {
  font-size: clamp(2.5rem, 5.6vw, 4.6rem);
  line-height: 1.02;
  letter-spacing: -0.018em;
}

.gh-h2 {
  font-size: clamp(2rem, 4.2vw, 3.35rem);
  line-height: 1.06;
  letter-spacing: -0.014em;
}

.gh-h3 {
  font-size: clamp(1.4rem, 2.1vw, 1.85rem);
  line-height: 1.18;
  font-weight: 500;
}

.gh-h4 {
  font-family: var(--gh-sans);
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0;
}

.gh-display em,
.gh-h1 em,
.gh-h2 em {
  font-style: italic;
  font-weight: 400;
}

.gh-eyebrow {
  margin: 0 0 1.15rem;
  color: var(--gh-bronze);
  font-family: var(--gh-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.gh-lede {
  max-width: 46ch;
  margin: 1.5rem 0 0;
  color: var(--gh-ink-soft);
  font-size: clamp(1.075rem, 1.35vw, 1.3rem);
  line-height: 1.62;
}

.gh-body-text {
  max-width: 65ch;
  margin: 0;
  color: var(--gh-ink-soft);
  font-size: 1.0125rem;
  line-height: 1.7;
}

.gh-body-text + .gh-body-text {
  margin-top: 1.15rem;
}

.gh-body-text strong {
  color: var(--gh-ink);
  font-weight: 600;
}

.gh-note {
  color: var(--gh-ink-soft);
  font-size: 0.84rem;
  line-height: 1.6;
}

.gh-section--dark .gh-note {
  color: color-mix(in srgb, var(--gh-paper) 65%, transparent);
}

.gh-rule {
  height: 1px;
  border: 0;
  margin: 0;
  background: var(--gh-line);
}

.gh-section--dark .gh-rule {
  background: color-mix(in srgb, var(--gh-paper) 18%, transparent);
}

/* --- motion ------------------------------------------------------------- */
@keyframes gh-rise {
  from {
    opacity: 0;
    transform: translate3d(0, 20px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes gh-unveil {
  from {
    clip-path: inset(0 0 12% 0);
    transform: scale(1.04);
  }
  to {
    clip-path: inset(0 0 0 0);
    transform: scale(1);
  }
}

.gh-rise {
  animation: gh-rise 0.82s var(--gh-ease) both;
  animation-delay: var(--gh-delay, 0s);
}

.gh-unveil {
  animation: gh-unveil 1.05s var(--gh-ease) both;
  animation-delay: var(--gh-delay, 0s);
}

.gh-lift {
  transition: transform 0.42s var(--gh-ease);
}

@media (prefers-reduced-motion: reduce) {
  .gh-rise,
  .gh-unveil {
    animation: none !important;
  }
  .gh-lift,
  .gh-lift:hover {
    transition: none !important;
    transform: none !important;
  }
  .gh-body {
    scroll-behavior: auto !important;
  }
}

/* --- header ------------------------------------------------------------- */
.gh-header {
  position: sticky;
  top: 0;
  z-index: 90;
  background: color-mix(in srgb, var(--gh-paper) 92%, transparent);
  backdrop-filter: saturate(140%) blur(14px);
  border-bottom: 1px solid var(--gh-line);
}

.gh-header__inner {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2.4vw, 2.25rem);
  min-height: var(--gh-header-h);
}

.gh-header__logo {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  flex: 0 0 auto;
}

.gh-header__logo img {
  height: 44px;
  width: auto;
}

@media (max-width: 720px) {
  .gh-header__logo img {
    height: 36px;
  }
}

.gh-header__nav {
  flex: 1 1 auto;
  display: flex;
  justify-content: center;
}

.gh-nav {
  display: flex;
  align-items: center;
  gap: clamp(0.5rem, 1.5vw, 1.35rem);
  margin: 0;
  padding: 0;
  list-style: none;
}

.gh-nav__item {
  position: relative;
}

.gh-nav__link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.5rem 0.15rem;
  color: var(--gh-ink);
  font-size: 0.905rem;
  font-weight: 500;
  white-space: nowrap;
}

.gh-nav__link::after {
  content: "";
  position: absolute;
  left: 0.15rem;
  right: 0.15rem;
  bottom: 0.1rem;
  height: 1.5px;
  background: var(--gh-gold);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.4s var(--gh-ease);
}

.gh-nav__link:hover::after,
.gh-nav__link:focus-visible::after,
.gh-nav__link[aria-current="page"]::after {
  transform: scaleX(1);
}

.gh-nav__caret {
  display: inline-block;
  width: 0.5rem;
  height: 0.5rem;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg) translate(-1px, -1px);
  transition: transform 0.3s var(--gh-ease);
}

.gh-nav__item:hover .gh-nav__caret,
.gh-nav__item:focus-within .gh-nav__caret {
  transform: rotate(225deg) translate(-1px, 1px);
}

.gh-nav__menu {
  position: absolute;
  top: calc(100% + 0.6rem);
  left: 50%;
  z-index: 95;
  width: max-content;
  min-width: 17rem;
  margin: 0;
  padding: 0.6rem;
  list-style: none;
  background: var(--gh-paper);
  border: 1px solid var(--gh-line);
  border-radius: var(--gh-r);
  box-shadow: 0 26px 50px -30px rgb(28 22 17 / 0.45);
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, -6px);
  transition: opacity 0.28s var(--gh-ease), transform 0.28s var(--gh-ease),
    visibility 0.28s;
}

.gh-nav__item:hover .gh-nav__menu,
.gh-nav__item:focus-within .gh-nav__menu {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}

.gh-nav__menu-link {
  display: block;
  padding: 0.62rem 0.75rem;
  border-radius: 9px;
  color: var(--gh-ink);
  font-size: 0.9rem;
  font-weight: 500;
}

.gh-nav__menu-link:hover,
.gh-nav__menu-link:focus-visible {
  background: var(--gh-paper-2);
}

.gh-nav__menu-note {
  display: block;
  margin-top: 0.15rem;
  color: var(--gh-ink-soft);
  font-size: 0.78rem;
  font-weight: 400;
}

.gh-header__actions {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  flex: 0 0 auto;
}

.gh-emergency-chip {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.55rem 0.9rem;
  border: 1px solid color-mix(in srgb, var(--gh-alert) 40%, transparent);
  border-radius: var(--gh-r);
  color: var(--gh-alert);
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  overflow: hidden;
  isolation: isolate;
}

.gh-emergency-chip::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--gh-espresso);
  transform: translateY(101%);
  transition: transform 0.42s var(--gh-ease);
}

.gh-emergency-chip:hover,
.gh-emergency-chip:focus-visible {
  color: var(--gh-paper);
}

.gh-emergency-chip:hover::before,
.gh-emergency-chip:focus-visible::before {
  transform: translateY(0);
}

.gh-emergency-chip__dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: currentColor;
}

.gh-burger {
  display: none;
  width: 46px;
  height: 46px;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 1px solid var(--gh-line);
  border-radius: var(--gh-r);
  cursor: pointer;
}

.gh-burger__bars {
  position: relative;
  display: block;
  width: 18px;
  height: 2px;
  background: var(--gh-ink);
  transition: background 0.2s linear;
}

.gh-burger__bars::before,
.gh-burger__bars::after {
  content: "";
  position: absolute;
  left: 0;
  width: 18px;
  height: 2px;
  background: var(--gh-ink);
  transition: transform 0.32s var(--gh-ease);
}

.gh-burger__bars::before {
  top: -6px;
}

.gh-burger__bars::after {
  top: 6px;
}

.gh-burger[aria-expanded="true"] .gh-burger__bars {
  background: transparent;
}

.gh-burger[aria-expanded="true"] .gh-burger__bars::before {
  transform: translateY(6px) rotate(45deg);
}

.gh-burger[aria-expanded="true"] .gh-burger__bars::after {
  transform: translateY(-6px) rotate(-45deg);
}

@media (max-width: 1140px) {
  .gh-header__nav {
    display: none;
  }
  .gh-burger {
    display: inline-flex;
  }
}

@media (max-width: 620px) {
  .gh-emergency-chip__label {
    display: none;
  }
  .gh-emergency-chip {
    padding: 0.55rem 0.7rem;
  }
}

/* --- mobile drawer ------------------------------------------------------ */
.gh-mobile-nav {
  position: fixed;
  inset: var(--gh-header-h) 0 0;
  z-index: 88;
  background: var(--gh-paper);
  border-top: 1px solid var(--gh-line);
  overflow-y: auto;
  padding: 1.5rem 0 calc(6rem + env(safe-area-inset-bottom));
  display: none;
}

.gh-mobile-nav[data-open="true"] {
  display: block;
}

.gh-mobile-nav__group {
  padding-block: 0.4rem;
}

.gh-mobile-nav__link {
  display: block;
  padding: 0.85rem 0;
  border-bottom: 1px solid var(--gh-line);
  font-family: var(--gh-serif);
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--gh-ink);
}

.gh-mobile-nav__sub {
  display: block;
  padding: 0.6rem 0 0.6rem 1rem;
  border-bottom: 1px solid var(--gh-line);
  color: var(--gh-ink-soft);
  font-size: 0.95rem;
}

.gh-mobile-nav__sub:last-of-type {
  border-bottom: 0;
}

/* --- sticky mobile action bar ------------------------------------------ */
.gh-mobilebar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 92;
  display: none;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: color-mix(in srgb, var(--gh-paper) 30%, transparent);
  border-top: 1px solid color-mix(in srgb, var(--gh-gold) 35%, transparent);
  padding-bottom: env(safe-area-inset-bottom);
}

@media (max-width: 860px) {
  .gh-mobilebar {
    display: grid;
  }
}

.gh-mobilebar__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 56px;
  padding: 0.7rem 1rem;
  background: var(--gh-espresso);
  color: var(--gh-paper);
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
}

.gh-mobilebar__btn--call {
  background: var(--gh-espresso-2);
  color: var(--gh-gold);
}

.gh-mobilebar__btn:active {
  transform: translateY(1px);
}

/* --- page hero (inner routes) ------------------------------------------ */
.gh-phero {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: min(74dvh, 42rem);
  overflow: hidden;
  background: var(--gh-espresso);
  color: var(--gh-paper);
}

.gh-phero--short {
  min-height: min(58dvh, 32rem);
}

.gh-phero__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.gh-phero__scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(
      to top,
      rgb(20 15 11 / 0.94) 0%,
      rgb(20 15 11 / 0.72) 34%,
      rgb(20 15 11 / 0.25) 66%,
      rgb(20 15 11 / 0.42) 100%
    ),
    linear-gradient(to right, rgb(20 15 11 / 0.6), transparent 62%);
}

.gh-phero__inner {
  position: relative;
  z-index: 2;
  width: 100%;
  padding-block: clamp(3rem, 8vw, 5.5rem) clamp(2.5rem, 5vw, 4rem);
}

.gh-phero__eyebrow {
  margin: 0 0 1rem;
  color: var(--gh-gold);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.gh-phero__title {
  max-width: 22ch;
  margin: 0;
  font-family: var(--gh-serif);
  font-size: clamp(2.4rem, 5.4vw, 4.4rem);
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: -0.018em;
  color: var(--gh-paper);
  text-wrap: balance;
}

.gh-phero__sub {
  max-width: 54ch;
  margin: 1.35rem 0 0;
  color: color-mix(in srgb, var(--gh-paper) 82%, transparent);
  font-size: clamp(1.0125rem, 1.3vw, 1.16rem);
  line-height: 1.62;
}

.gh-phero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem 1.5rem;
  align-items: center;
  margin-top: 2rem;
}

/* --- cards -------------------------------------------------------------- */
.gh-cards {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(1rem, 1.6vw, 1.5rem);
  margin: 0;
  padding: 0;
  list-style: none;
}

.gh-card {
  position: relative;
  display: flex;
  flex-direction: column;
  grid-column: span 2;
  background: var(--gh-paper);
  border: 1px solid var(--gh-line);
  border-radius: var(--gh-r);
  overflow: hidden;
  transition: transform 0.5s var(--gh-ease), box-shadow 0.5s var(--gh-ease);
}

.gh-card--wide {
  grid-column: span 3;
}

.gh-card--tall .gh-card__media {
  aspect-ratio: 4 / 5;
}

.gh-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 48px -30px rgb(28 22 17 / 0.42);
}

.gh-card__media {
  aspect-ratio: 3 / 2;
  overflow: hidden;
  background: var(--gh-paper-2);
}

.gh-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.85s var(--gh-ease);
}

.gh-card:hover .gh-card__media img {
  transform: scale(1.05);
}

.gh-card__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 0.55rem;
  padding: 1.5rem 1.5rem 1.65rem;
}

.gh-card__title {
  margin: 0;
  font-family: var(--gh-serif);
  font-size: 1.55rem;
  font-weight: 500;
  line-height: 1.15;
  color: var(--gh-ink);
}

.gh-card__text {
  margin: 0;
  color: var(--gh-ink-soft);
  font-size: 0.95rem;
  line-height: 1.6;
}

.gh-card__link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-top: auto;
  padding-top: 0.75rem;
  color: var(--gh-bronze);
  font-size: 0.88rem;
  font-weight: 600;
}

.gh-card__link::after {
  content: "";
  position: absolute;
  inset: 0;
}

.gh-card__link svg {
  transition: transform 0.35s var(--gh-ease);
}

.gh-card:hover .gh-card__link svg {
  transform: translateX(4px);
}

@media (max-width: 1080px) {
  .gh-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gh-card,
  .gh-card--wide {
    grid-column: span 1;
  }
}

@media (max-width: 640px) {
  .gh-cards {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* --- generic two-column blocks ----------------------------------------- */
.gh-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(1.75rem, 5vw, 4.5rem);
  align-items: center;
}

.gh-split--text-image {
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
}

.gh-split--top {
  align-items: start;
}

@media (max-width: 900px) {
  .gh-split,
  .gh-split--text-image {
    grid-template-columns: minmax(0, 1fr);
  }
}

.gh-figure {
  margin: 0;
  border-radius: var(--gh-r);
  overflow: hidden;
  background: var(--gh-paper-2);
}

.gh-figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gh-panel {
  padding: clamp(1.5rem, 3vw, 2.75rem);
  background: var(--gh-paper);
  border: 1px solid var(--gh-line);
  border-radius: var(--gh-r);
}

.gh-panel--dark {
  background: var(--gh-espresso);
  border-color: color-mix(in srgb, var(--gh-paper) 14%, transparent);
  color: var(--gh-paper);
}

.gh-panel--dark .gh-h3,
.gh-panel--dark .gh-h4 {
  color: var(--gh-paper);
}

.gh-panel--dark .gh-body-text,
.gh-panel--dark .gh-note {
  color: color-mix(in srgb, var(--gh-paper) 76%, transparent);
}

/* --- checklist ---------------------------------------------------------- */
.gh-checklist {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem 2rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

@media (max-width: 640px) {
  .gh-checklist {
    grid-template-columns: minmax(0, 1fr);
  }
}

.gh-checklist__item {
  position: relative;
  padding-left: 1.7rem;
  color: var(--gh-ink-soft);
  font-size: 0.97rem;
  line-height: 1.55;
}

.gh-checklist__item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.42rem;
  width: 0.85rem;
  height: 0.45rem;
  border-left: 2px solid var(--gh-bronze);
  border-bottom: 2px solid var(--gh-bronze);
  transform: rotate(-45deg);
}

.gh-section--dark .gh-checklist__item,
.gh-panel--dark .gh-checklist__item {
  color: color-mix(in srgb, var(--gh-paper) 80%, transparent);
}

.gh-section--dark .gh-checklist__item::before,
.gh-panel--dark .gh-checklist__item::before {
  border-color: var(--gh-gold);
}

/* --- tags --------------------------------------------------------------- */
.gh-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
}

.gh-tags__item {
  padding: 0.4rem 0.7rem;
  border: 1px solid var(--gh-line);
  border-radius: 9px;
  color: var(--gh-ink-soft);
  font-size: 0.8rem;
  font-weight: 500;
}

.gh-section--dark .gh-tags__item,
.gh-panel--dark .gh-tags__item {
  border-color: color-mix(in srgb, var(--gh-paper) 22%, transparent);
  color: color-mix(in srgb, var(--gh-paper) 84%, transparent);
}

/* --- emergency band ----------------------------------------------------- */
.gh-emergency {
  position: relative;
  overflow: hidden;
  background: var(--gh-espresso);
  color: var(--gh-paper);
}

.gh-emergency::after {
  content: "";
  position: absolute;
  top: -30%;
  right: -12%;
  width: 46rem;
  height: 46rem;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    color-mix(in srgb, var(--gh-gold) 26%, transparent) 0%,
    transparent 68%
  );
  pointer-events: none;
}

.gh-emergency__inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: center;
}

@media (max-width: 900px) {
  .gh-emergency__inner {
    grid-template-columns: minmax(0, 1fr);
  }
}

.gh-emergency__title {
  max-width: 16ch;
  margin: 0;
  font-family: var(--gh-serif);
  font-size: clamp(2.4rem, 5.6vw, 4.5rem);
  font-weight: 400;
  line-height: 0.99;
  letter-spacing: -0.018em;
  color: var(--gh-paper);
  text-wrap: balance;
}

.gh-emergency__text {
  max-width: 48ch;
  margin: 1.5rem 0 0;
  color: color-mix(in srgb, var(--gh-paper) 80%, transparent);
  font-size: clamp(1.0125rem, 1.3vw, 1.18rem);
  line-height: 1.62;
}

.gh-emergency__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 1.5rem;
  align-items: center;
  margin-top: 2.25rem;
}

.gh-emergency__note {
  max-width: 52ch;
  margin: 1.75rem 0 0;
  color: color-mix(in srgb, var(--gh-paper) 62%, transparent);
  font-size: 0.84rem;
  line-height: 1.62;
}

.gh-callblock {
  padding: clamp(1.5rem, 3vw, 2.5rem);
  border: 1px solid color-mix(in srgb, var(--gh-gold) 40%, transparent);
  border-radius: var(--gh-r);
  background: color-mix(in srgb, var(--gh-gold) 7%, transparent);
}

.gh-callblock__label {
  margin: 0;
  color: var(--gh-gold);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.gh-callblock__number {
  display: inline-block;
  margin-top: 1rem;
  font-family: var(--gh-serif);
  font-size: clamp(1.9rem, 4.2vw, 3rem);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.01em;
  color: var(--gh-paper);
}

.gh-callblock__number span {
  position: relative;
}

.gh-callblock__number span::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -0.18em;
  height: 2px;
  background: var(--gh-gold);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.5s var(--gh-ease);
}

.gh-callblock__number:hover span::after,
.gh-callblock__number:focus-visible span::after {
  transform: scaleX(1);
}

.gh-callblock__note {
  margin: 1.15rem 0 0;
  color: color-mix(in srgb, var(--gh-paper) 68%, transparent);
  font-size: 0.86rem;
  line-height: 1.6;
}

/* --- image-as-canvas ---------------------------------------------------- */
.gh-canvas {
  position: relative;
  min-height: clamp(24rem, 60vh, 40rem);
  border-radius: var(--gh-r);
  overflow: hidden;
  background: var(--gh-espresso);
}

.gh-canvas__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gh-canvas__panel {
  position: absolute;
  right: clamp(1rem, 4vw, 3rem);
  bottom: clamp(1rem, 4vw, 3rem);
  left: clamp(1rem, 4vw, 3rem);
  width: auto;
  max-width: 32rem;
  margin-left: auto;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: var(--gh-paper);
  border-radius: var(--gh-r);
  box-shadow: 0 30px 60px -34px rgb(20 15 11 / 0.6);
}

@media (max-width: 640px) {
  .gh-canvas {
    min-height: 30rem;
  }
  .gh-canvas__panel {
    position: relative;
    inset: auto;
    max-width: none;
    margin: 16rem 0 0;
    box-shadow: none;
    border-radius: 0 0 var(--gh-r) var(--gh-r);
  }
}

/* --- gallery ------------------------------------------------------------ */
.gh-gallery {
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-template-rows: repeat(2, minmax(9rem, 1fr));
  gap: clamp(0.75rem, 1.4vw, 1.25rem);
}

.gh-gallery__item {
  margin: 0;
  border-radius: var(--gh-r);
  overflow: hidden;
  background: var(--gh-paper-2);
}

.gh-gallery__item--wide {
  grid-row: span 2;
}

.gh-gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.9s var(--gh-ease);
}

.gh-gallery__item:hover img {
  transform: scale(1.04);
}

@media (max-width: 780px) {
  .gh-gallery {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: none;
  }
  .gh-gallery__item--wide {
    grid-row: auto;
  }
  .gh-gallery__item {
    aspect-ratio: 3 / 2;
  }
}

/* --- areas -------------------------------------------------------------- */
.gh-areas {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  border-top: 1px solid var(--gh-line);
}

@media (max-width: 900px) {
  .gh-areas {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .gh-areas {
    grid-template-columns: minmax(0, 1fr);
  }
}

.gh-area {
  padding: 1.6rem 1.75rem 1.75rem;
  border-bottom: 1px solid var(--gh-line);
  border-right: 1px solid var(--gh-line);
}

.gh-area__name {
  margin: 0;
  font-family: var(--gh-serif);
  font-size: 1.6rem;
  font-weight: 500;
  color: var(--gh-ink);
}

.gh-area__note {
  margin: 0.5rem 0 0;
  color: var(--gh-ink-soft);
  font-size: 0.9rem;
  line-height: 1.6;
}

.gh-area--home {
  background: var(--gh-paper-2);
}

.gh-area--home .gh-area__name {
  color: var(--gh-bronze);
}

/* --- steps -------------------------------------------------------------- */
.gh-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(1.5rem, 3vw, 2.75rem);
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: gh-step;
}

@media (max-width: 1000px) {
  .gh-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .gh-steps {
    grid-template-columns: minmax(0, 1fr);
  }
}

.gh-step {
  padding-top: 1.5rem;
  border-top: 1px solid var(--gh-line);
}

.gh-step__num {
  display: block;
  font-family: var(--gh-serif);
  font-size: 2.6rem;
  font-weight: 300;
  line-height: 1;
  color: var(--gh-gold);
}

.gh-step__title {
  margin: 1rem 0 0;
  font-family: var(--gh-sans);
  font-size: 1.02rem;
  font-weight: 600;
  color: var(--gh-ink);
}

.gh-step__text {
  margin: 0.5rem 0 0;
  color: var(--gh-ink-soft);
  font-size: 0.94rem;
  line-height: 1.6;
}

/* --- pricing table ------------------------------------------------------ */
.gh-prices {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  border-top: 1px solid var(--gh-line);
}

@media (max-width: 860px) {
  .gh-prices {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .gh-prices {
    grid-template-columns: minmax(0, 1fr);
  }
}

.gh-price {
  padding: 1.5rem 1.6rem 1.65rem;
  border-bottom: 1px solid var(--gh-line);
  border-right: 1px solid var(--gh-line);
}

.gh-price__label {
  margin: 0;
  font-size: 0.86rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  color: var(--gh-ink);
}

.gh-price__value {
  display: block;
  margin-top: 0.6rem;
  font-family: var(--gh-serif);
  font-size: 1.9rem;
  font-weight: 500;
  line-height: 1.1;
  color: var(--gh-bronze);
}

.gh-price__note {
  margin: 0.6rem 0 0;
  color: var(--gh-ink-soft);
  font-size: 0.86rem;
  line-height: 1.55;
}

/* --- FAQ ---------------------------------------------------------------- */
.gh-faq {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 clamp(1.75rem, 4vw, 4rem);
  align-items: start;
}

@media (max-width: 900px) {
  .gh-faq {
    grid-template-columns: minmax(0, 1fr);
  }
}

.gh-faq__column {
  border-top: 1px solid var(--gh-line);
}

.gh-faq__item {
  border-bottom: 1px solid var(--gh-line);
}

.gh-faq__q {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.25rem;
  padding: 1.3rem 0;
  cursor: pointer;
  list-style: none;
  font-size: 1.0125rem;
  font-weight: 600;
  line-height: 1.45;
  color: var(--gh-ink);
}

.gh-faq__q::-webkit-details-marker {
  display: none;
}

.gh-faq__q::after {
  content: "";
  flex: 0 0 auto;
  width: 0.72rem;
  height: 0.72rem;
  margin-top: 0.35rem;
  border-right: 1.5px solid var(--gh-bronze);
  border-bottom: 1.5px solid var(--gh-bronze);
  transform: rotate(45deg);
  transition: transform 0.32s var(--gh-ease);
}

.gh-faq__item[open] .gh-faq__q::after {
  transform: rotate(225deg);
}

.gh-faq__a {
  padding: 0 2.5rem 1.4rem 0;
  margin: 0;
  color: var(--gh-ink-soft);
  font-size: 0.96rem;
  line-height: 1.68;
}

/* --- CTAs --------------------------------------------------------------- */

/* 1. Request a quote - solid espresso, arrow steps right. Pill by design rule. */
.gh-cta-quote {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.95rem 1.6rem;
  border: 0;
  border-radius: 999px;
  background: var(--gh-espresso);
  color: var(--gh-paper);
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.35s var(--gh-ease), transform 0.18s var(--gh-ease);
}

.gh-cta-quote svg {
  transition: transform 0.35s var(--gh-ease);
}

.gh-cta-quote:hover {
  background: var(--gh-espresso-2);
}

.gh-cta-quote:hover svg {
  transform: translateX(4px);
}

.gh-cta-quote:active {
  transform: translateY(1px);
}

.gh-cta-quote--light {
  background: var(--gh-paper);
  color: var(--gh-espresso);
}

.gh-cta-quote--light:hover {
  background: var(--gh-white);
}

/* 2. Call - tel: link whose gold underline draws in from the left. */
.gh-cta-call {
  position: relative;
  display: inline-flex;
  align-items: baseline;
  gap: 0.5rem;
  padding-bottom: 0.2rem;
  color: var(--gh-ink);
  font-size: 0.95rem;
  font-weight: 600;
}

.gh-cta-call::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: var(--gh-gold);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.45s var(--gh-ease);
}

.gh-cta-call:hover::after,
.gh-cta-call:focus-visible::after {
  transform: scaleX(1);
}

.gh-cta-call--dark {
  color: var(--gh-paper);
}

/* 3. Emergency - outline banner, gold sweeps up behind the label. */
.gh-cta-emergency {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 1rem 1.5rem;
  border: 1px solid color-mix(in srgb, var(--gh-gold) 55%, transparent);
  border-radius: var(--gh-r);
  color: var(--gh-paper);
  font-size: 0.95rem;
  font-weight: 600;
  overflow: hidden;
  isolation: isolate;
  transition: color 0.4s var(--gh-ease);
}

.gh-cta-emergency::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--gh-gold);
  transform: translateY(101%);
  transition: transform 0.45s var(--gh-ease);
}

.gh-cta-emergency:hover,
.gh-cta-emergency:focus-visible {
  color: var(--gh-espresso);
}

.gh-cta-emergency:hover::before,
.gh-cta-emergency:focus-visible::before {
  transform: translateY(0);
}

/* 4. Inline arrow link - the arrow steps forward. */
.gh-cta-arrow {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: var(--gh-bronze);
  font-size: 0.95rem;
  font-weight: 600;
}

.gh-cta-arrow svg {
  transition: transform 0.35s var(--gh-ease);
}

.gh-cta-arrow:hover svg,
.gh-cta-arrow:focus-visible svg {
  transform: translateX(5px);
}

.gh-section--dark .gh-cta-arrow {
  color: var(--gh-gold);
}

/* 5. Contractor block - cut corner that fills gold. */
.gh-cta-contractor {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  padding: 1.05rem 3.1rem 1.05rem 1.5rem;
  border: 1px solid var(--gh-line);
  border-radius: 0 var(--gh-r) var(--gh-r) var(--gh-r);
  color: var(--gh-ink);
  font-size: 0.95rem;
  font-weight: 600;
  overflow: hidden;
  isolation: isolate;
  transition: color 0.4s var(--gh-ease);
}

.gh-cta-contractor::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--gh-gold);
  transform: translateX(-101%);
  transition: transform 0.5s var(--gh-ease);
}

.gh-cta-contractor:hover,
.gh-cta-contractor:focus-visible {
  color: var(--gh-espresso);
  border-color: var(--gh-gold);
}

.gh-cta-contractor:hover::after,
.gh-cta-contractor:focus-visible::after {
  transform: translateX(0);
}

/* 6. Form submit - ink block, full width on phones. */
.gh-cta-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  padding: 1.05rem 2rem;
  border: 1px solid var(--gh-espresso);
  border-radius: var(--gh-r);
  background: var(--gh-espresso);
  color: var(--gh-paper);
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.32s var(--gh-ease), color 0.32s var(--gh-ease),
    transform 0.18s var(--gh-ease);
}

.gh-cta-submit:hover {
  background: var(--gh-white);
  color: var(--gh-espresso);
}

.gh-cta-submit:active {
  transform: translateY(1px);
}

.gh-cta-submit[disabled] {
  opacity: 0.62;
  cursor: progress;
}

@media (max-width: 640px) {
  .gh-cta-submit {
    width: 100%;
  }
}

/* --- quote form --------------------------------------------------------- */
.gh-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem clamp(1rem, 2.4vw, 2rem);
  margin-top: 2.5rem;
}

@media (max-width: 760px) {
  .gh-form {
    grid-template-columns: minmax(0, 1fr);
  }
}

.gh-field {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.gh-field--full {
  grid-column: 1 / -1;
}

.gh-field__label {
  font-size: 0.845rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--gh-ink);
}

.gh-field__hint {
  color: var(--gh-ink-soft);
  font-size: 0.78rem;
}

.gh-field__input,
.gh-field__select,
.gh-field__textarea {
  width: 100%;
  padding: 0.8rem 0.9rem;
  border: 1px solid var(--gh-line);
  border-radius: 10px;
  background: var(--gh-white);
  color: var(--gh-ink);
  font-family: var(--gh-sans);
  font-size: 0.97rem;
  line-height: 1.4;
  transition: border-color 0.25s var(--gh-ease), box-shadow 0.25s var(--gh-ease);
}

.gh-field__textarea {
  min-height: 8rem;
  resize: vertical;
}

.gh-field__input::placeholder,
.gh-field__textarea::placeholder {
  color: #9a8a76;
}

.gh-field__input:focus,
.gh-field__select:focus,
.gh-field__textarea:focus {
  outline: none;
  border-color: var(--gh-bronze);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--gh-bronze) 22%, transparent);
}

.gh-field[data-invalid="true"] .gh-field__input,
.gh-field[data-invalid="true"] .gh-field__select,
.gh-field[data-invalid="true"] .gh-field__textarea {
  border-color: var(--gh-alert);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--gh-alert) 16%, transparent);
}

.gh-field__error {
  color: var(--gh-alert);
  font-size: 0.8rem;
  font-weight: 500;
  line-height: 1.4;
}

.gh-checks {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem 1.5rem;
  margin: 0;
  padding: 0;
  border: 0;
}

@media (max-width: 640px) {
  .gh-checks {
    grid-template-columns: minmax(0, 1fr);
  }
}

.gh-check {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  color: var(--gh-ink-soft);
  font-size: 0.93rem;
  line-height: 1.5;
  cursor: pointer;
}

.gh-check input {
  flex: 0 0 auto;
  width: 1.15rem;
  height: 1.15rem;
  margin: 0.15rem 0 0;
  accent-color: var(--gh-bronze);
}

.gh-checkset {
  margin: 0;
  padding: 1.5rem 0 0;
  border: 0;
  border-top: 1px solid var(--gh-line);
}

.gh-checkset__legend {
  padding: 0;
  font-family: var(--gh-sans);
  font-size: 0.845rem;
  font-weight: 600;
  color: var(--gh-ink);
}

.gh-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 1.5rem;
  align-items: center;
  margin-top: 0.75rem;
}

.gh-form__status {
  margin: 1.75rem 0 0;
  padding: 1.15rem 1.35rem;
  border-radius: var(--gh-r);
  font-size: 0.95rem;
  line-height: 1.6;
}

.gh-form__status--ok {
  background: color-mix(in srgb, var(--gh-bronze) 12%, var(--gh-paper));
  border: 1px solid color-mix(in srgb, var(--gh-bronze) 40%, transparent);
  color: var(--gh-ink);
}

.gh-form__status--fail {
  background: color-mix(in srgb, var(--gh-alert) 9%, var(--gh-paper));
  border: 1px solid color-mix(in srgb, var(--gh-alert) 35%, transparent);
  color: var(--gh-ink);
}

.gh-form__readiness {
  margin: 1rem 0 0;
  color: var(--gh-ink-soft);
  font-size: 0.84rem;
  line-height: 1.6;
}

/* --- footer ------------------------------------------------------------- */
.gh-footer {
  background: var(--gh-espresso);
  color: color-mix(in srgb, var(--gh-paper) 78%, transparent);
  padding-block: clamp(3rem, 6vw, 5rem) 0;
}

.gh-footer__grid {
  display: grid;
  grid-template-columns: minmax(0, 4fr) repeat(3, minmax(0, 3fr));
  gap: clamp(2rem, 4vw, 3.5rem);
  padding-bottom: clamp(2.5rem, 5vw, 4rem);
}

@media (max-width: 1000px) {
  .gh-footer__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .gh-footer__grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

.gh-footer__logo {
  height: 62px;
  width: auto;
  margin-bottom: 1.25rem;
  border-radius: 8px;
  background: var(--gh-paper);
  padding: 0.5rem 0.75rem;
}

.gh-footer__heading {
  margin: 0 0 1rem;
  color: var(--gh-gold);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.gh-footer__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.gh-footer__list li + li {
  margin-top: 0.55rem;
}

.gh-footer__link {
  font-size: 0.93rem;
  line-height: 1.5;
}

.gh-footer__link:hover,
.gh-footer__link:focus-visible {
  color: var(--gh-paper);
  text-decoration: underline;
  text-decoration-color: var(--gh-gold);
  text-underline-offset: 0.25em;
}

.gh-footer__phone {
  display: inline-block;
  margin-top: 1.5rem;
  color: var(--gh-paper);
  font-family: var(--gh-serif);
  font-size: 1.5rem;
  font-weight: 500;
}

.gh-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 2rem;
  align-items: center;
  justify-content: space-between;
  padding-block: 1.5rem;
  border-top: 1px solid color-mix(in srgb, var(--gh-paper) 16%, transparent);
  font-size: 0.82rem;
}

.gh-footer__legal {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.5rem;
}

.gh-footer__legal a:hover,
.gh-footer__legal a:focus-visible {
  color: var(--gh-paper);
}

/* --- scroll-scrub fit --------------------------------------------------- */
/* The engine owns its own palette/CSS; these rules only position it under the
   site header and clear the sticky mobile action bar. */
.scroll-scrub__route {
  top: calc(var(--gh-header-h) + clamp(0.75rem, 2vw, 1.5rem));
}

@media (max-width: 860px) {
  .scroll-scrub__chapter-pin {
    padding-bottom: calc(7rem + env(safe-area-inset-bottom));
  }
}

.gh-journey {
  background: var(--gh-espresso);
}

/* --- page shell --------------------------------------------------------- */
.gh-page {
  display: block;
}

.gh-main {
  display: block;
}

/* --- misc blocks -------------------------------------------------------- */
.gh-stat-line {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.75rem;
  align-items: baseline;
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--gh-ink-soft);
  font-size: 0.9rem;
}

.gh-stat-line li {
  position: relative;
  padding-left: 1.15rem;
}

.gh-stat-line li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 50%;
  background: var(--gh-gold);
}

.gh-narrow-head {
  max-width: 34ch;
}

.gh-center {
  text-align: center;
}

.gh-center .gh-lede,
.gh-center .gh-body-text,
.gh-center .gh-narrow-head {
  margin-inline: auto;
}

.gh-mt-sm {
  margin-top: 1.25rem;
}

.gh-mt-md {
  margin-top: 2rem;
}

.gh-mt-lg {
  margin-top: 3rem;
}

.gh-people {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: clamp(1.75rem, 4vw, 4rem);
  align-items: center;
}

@media (max-width: 900px) {
  .gh-people {
    grid-template-columns: minmax(0, 1fr);
  }
}

.gh-people__photo {
  margin: 0;
  border-radius: var(--gh-r);
  overflow: hidden;
  background: var(--gh-paper-2);
}

.gh-people__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 4 / 5;
}

.gh-people__row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(0.75rem, 1.6vw, 1.25rem);
  margin-top: clamp(0.75rem, 1.6vw, 1.25rem);
}

@media (max-width: 560px) {
  .gh-people__row {
    grid-template-columns: minmax(0, 1fr);
  }
}


/* ---- components/site/site-chrome.css ---- */
/* Chrome that the shared brand layer (src/site.css) does not need to carry. */

.gh-header__wordmark {
  display: flex;
  flex-direction: column;
  line-height: 1;
}

.gh-header__wordmark-top {
  color: var(--gh-ink);
  font-family: var(--gh-serif);
  font-size: 1.28rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
  text-transform: uppercase;
}

.gh-header__wordmark-sub {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.32rem;
  color: var(--gh-ink-soft);
  font-family: var(--gh-sans);
  font-size: 0.55rem;
  font-weight: 600;
  letter-spacing: 0.34em;
  text-transform: uppercase;
}

.gh-header__wordmark-sub::before,
.gh-header__wordmark-sub::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: var(--gh-line);
}

@media (max-width: 620px) {
  .gh-header__wordmark-top {
    font-size: 1.06rem;
  }
  .gh-header__wordmark-sub {
    display: none;
  }
  .gh-header__logo img {
    height: 38px;
    width: 38px;
  }
}

/* Keep the header to one clean line. The drawer and the sticky action bar
   carry call and quote on smaller screens. Six nav items plus the emergency
   chip need a little more room than five did. */
@media (max-width: 1360px) {
  .gh-header__actions .gh-cta-call {
    display: none;
  }
}

@media (max-width: 1280px) {
  .gh-header__nav {
    display: none;
  }
  .gh-burger {
    display: inline-flex;
  }
}

@media (max-width: 1080px) {
  .gh-header__actions .gh-cta-quote {
    display: none;
  }
}

.gh-card--wide .gh-card__media {
  aspect-ratio: 16 / 10;
}

/* Site 404 / error surfaces, styled as part of the brand rather than chrome. */
.gh-notfound {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-height: 78dvh;
  max-width: 46rem;
  margin-inline: auto;
  padding: 6rem clamp(1.25rem, 5vw, 3.5rem);
}


/* ---- components/site/site-ui.css ---- */
/* Page-level bits that the shared brand layer does not carry. */

.gh-chapter-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem 1.5rem;
  align-items: center;
}

.gh-chapter-actions .gh-cta-call {
  color: var(--gh-paper);
}

/* On the dark scroll-scrub chapters the call link sits on the film. */
.gh-chapter-actions .gh-cta-call::after {
  background: var(--gh-gold);
}

/* Full-bleed image band. Sits outside a .gh-wrap on purpose. */
.gh-band {
  display: block;
  margin: 0;
  background: var(--gh-paper-2);
}

.gh-band img {
  width: 100%;
  height: clamp(16rem, 46vw, 34rem);
  object-fit: cover;
  object-position: center;
}

.gh-finalcta {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: center;
}

@media (max-width: 900px) {
  .gh-finalcta {
    grid-template-columns: minmax(0, 1fr);
  }
}

.gh-finalcta__actions {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  align-items: flex-start;
}

/* The footer carries the inverse of the owner's logo, so it needs no plate. */
.gh-footer .gh-footer__logo {
  width: 190px;
  height: auto;
  padding: 0;
  margin-bottom: 1.5rem;
  background: none;
}

.gh-quotes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.25rem, 2.5vw, 2rem);
}

@media (max-width: 900px) {
  .gh-quotes {
    grid-template-columns: minmax(0, 1fr);
  }
}

.gh-quote {
  margin: 0;
  padding: 1.75rem;
  border: 1px solid var(--gh-line);
  border-radius: var(--gh-r);
}

.gh-quote__text {
  margin: 0;
  color: var(--gh-ink);
  font-size: 1.05rem;
  line-height: 1.6;
}

.gh-quote__who {
  margin-top: 1rem;
  color: var(--gh-ink-soft);
  font-size: 0.86rem;
}

/* Long-form prose blocks used by the legal and service-area pages. */
.gh-prose {
  max-width: 68ch;
}

.gh-prose h2 {
  margin: 2.5rem 0 0.75rem;
  font-family: var(--gh-serif);
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  font-weight: 500;
  line-height: 1.2;
  color: var(--gh-ink);
}

.gh-prose p,
.gh-prose li {
  color: var(--gh-ink-soft);
  font-size: 1rem;
  line-height: 1.72;
}

.gh-prose p {
  margin: 0 0 1rem;
}

.gh-prose ul {
  margin: 0 0 1.25rem;
  padding-left: 1.15rem;
}

.gh-prose li {
  margin-bottom: 0.5rem;
}

.gh-prose em {
  color: var(--gh-ink-soft);
  font-size: 0.9rem;
}


/* ---- components/site/pricing.css ---- */
/* Pricing page furniture. Built on the shared brand tokens in src/site.css. */

.gh-pricegroup {
  padding-block: clamp(2.75rem, 5.5vw, 4.5rem);
  border-top: 1px solid var(--gh-line);
}

.gh-pricegroup:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.gh-pricegroup__head {
  display: flex;
  align-items: baseline;
  gap: 1.1rem;
}

.gh-pricegroup__num {
  color: var(--gh-gold);
  font-family: var(--gh-serif);
  font-size: 1.55rem;
  font-weight: 300;
  line-height: 1;
}

.gh-pricegroup__title {
  margin: 0;
  font-family: var(--gh-serif);
  font-size: clamp(1.85rem, 3.6vw, 2.9rem);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -0.012em;
  color: var(--gh-ink);
}

.gh-pricegroup__intro {
  max-width: 62ch;
  margin: 1rem 0 2rem;
  color: var(--gh-ink-soft);
  font-size: 1.0125rem;
  line-height: 1.68;
}

.gh-pricegrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1rem, 1.8vw, 1.5rem);
}

.gh-pricegrid--three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.gh-pricegrid--four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 1040px) {
  .gh-pricegrid--three,
  .gh-pricegrid--four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .gh-pricegrid,
  .gh-pricegrid--three,
  .gh-pricegrid--four {
    grid-template-columns: minmax(0, 1fr);
  }
}

.gh-pricecard {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: clamp(1.4rem, 2.4vw, 2rem);
  background: var(--gh-paper);
  border: 1px solid var(--gh-line);
  border-radius: var(--gh-r);
}

.gh-pricecard--feature {
  grid-column: 1 / -1;
  background: var(--gh-espresso);
  border-color: transparent;
  color: var(--gh-paper);
}

.gh-pricecard__title {
  margin: 0;
  color: var(--gh-ink);
  font-family: var(--gh-sans);
  font-size: 0.98rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.4;
}

/* "Starting at" stays literally attached to the number. */
.gh-pricecard__from {
  display: block;
  margin-top: 1.15rem;
  color: var(--gh-bronze);
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.gh-pricecard__price {
  display: block;
  margin-top: 0.15rem;
  color: var(--gh-ink);
  font-family: var(--gh-serif);
  font-size: clamp(2.3rem, 4.6vw, 3.3rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.02;
}

.gh-pricecard__price small {
  display: inline-block;
  margin-left: 0.45rem;
  color: var(--gh-ink-soft);
  font-family: var(--gh-sans);
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0;
}

.gh-pricecard--feature .gh-pricecard__title,
.gh-pricecard--feature .gh-pricecard__price {
  color: var(--gh-paper);
}

.gh-pricecard--feature .gh-pricecard__from {
  color: var(--gh-gold);
}

.gh-pricecard--feature .gh-pricecard__price small {
  color: color-mix(in srgb, var(--gh-paper) 72%, transparent);
}

.gh-pricecard__note {
  margin: 1.05rem 0 0;
  color: var(--gh-ink-soft);
  font-size: 0.93rem;
  line-height: 1.62;
}

.gh-pricecard--feature .gh-pricecard__note {
  max-width: 68ch;
  color: color-mix(in srgb, var(--gh-paper) 84%, transparent);
}

.gh-pricecard__detail {
  margin: 1rem 0 0;
  padding-top: 1rem;
  border-top: 1px solid var(--gh-line);
  color: var(--gh-ink-soft);
  font-size: 0.86rem;
  line-height: 1.6;
}

.gh-pricecard--feature .gh-pricecard__detail {
  border-color: color-mix(in srgb, var(--gh-paper) 18%, transparent);
  color: color-mix(in srgb, var(--gh-paper) 78%, transparent);
}

/* Deliberately not styled as alarming small print. */
.gh-pricefineprint {
  margin: 1.15rem 0 0;
  padding: 1rem 1.15rem;
  background: var(--gh-paper-2);
  border-radius: 10px;
  color: var(--gh-ink-soft);
  font-size: 0.86rem;
  line-height: 1.62;
}

.gh-pricecard--feature .gh-pricefineprint {
  background: color-mix(in srgb, var(--gh-paper) 10%, transparent);
  color: color-mix(in srgb, var(--gh-paper) 78%, transparent);
}

.gh-pricelist {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.4rem 1.4rem;
  margin: 1.25rem 0 0;
  padding: 0;
  list-style: none;
}

.gh-pricelist li {
  position: relative;
  padding-left: 1.1rem;
  color: var(--gh-ink-soft);
  font-size: 0.92rem;
  line-height: 1.55;
}

.gh-pricelist li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.58em;
  width: 0.32rem;
  height: 0.32rem;
  border-radius: 50%;
  background: var(--gh-gold);
}

.gh-pricecard--feature .gh-pricelist li {
  color: color-mix(in srgb, var(--gh-paper) 82%, transparent);
}

.gh-excludes {
  margin-top: 2rem;
  padding: clamp(1.35rem, 2.4vw, 2rem);
  background: var(--gh-paper-2);
  border-radius: var(--gh-r);
}

.gh-excludes__title {
  margin: 0 0 0.5rem;
  color: var(--gh-ink);
  font-family: var(--gh-sans);
  font-size: 0.95rem;
  font-weight: 600;
}

.gh-excludes__text {
  max-width: 68ch;
  margin: 0 0 0.25rem;
  color: var(--gh-ink-soft);
  font-size: 0.93rem;
  line-height: 1.62;
}

/* --- pricing groups on a dark band --------------------------------------- */
.gh-section--dark .gh-pricegroup {
  border-top-color: color-mix(in srgb, var(--gh-paper) 16%, transparent);
}

.gh-section--dark .gh-pricegroup__title {
  color: var(--gh-paper);
}

.gh-section--dark .gh-pricegroup__intro {
  color: color-mix(in srgb, var(--gh-paper) 78%, transparent);
}

.gh-section--dark .gh-pricecard {
  background: color-mix(in srgb, var(--gh-paper) 7%, transparent);
  border-color: color-mix(in srgb, var(--gh-gold) 26%, transparent);
}

.gh-section--dark .gh-pricecard__title,
.gh-section--dark .gh-pricecard__price {
  color: var(--gh-paper);
}

.gh-section--dark .gh-pricecard__from {
  color: var(--gh-gold);
}

.gh-section--dark .gh-pricecard__note,
.gh-section--dark .gh-pricecard__detail {
  color: color-mix(in srgb, var(--gh-paper) 80%, transparent);
}

.gh-section--dark .gh-pricecard__detail {
  border-color: color-mix(in srgb, var(--gh-paper) 16%, transparent);
}

.gh-section--dark .gh-pricefineprint {
  background: color-mix(in srgb, var(--gh-paper) 10%, transparent);
  color: color-mix(in srgb, var(--gh-paper) 78%, transparent);
}

.gh-section--dark .gh-pricelist li {
  color: color-mix(in srgb, var(--gh-paper) 80%, transparent);
}

.gh-section--dark .gh-pricecard__price small {
  color: color-mix(in srgb, var(--gh-paper) 76%, transparent);
}

/* --- the slim emergency pricing bar under the header --------------------- */
.gh-emergbar {
  background: var(--gh-espresso);
  color: var(--gh-paper);
  border-bottom: 1px solid color-mix(in srgb, var(--gh-gold) 28%, transparent);
}

.gh-emergbar__inner {
  display: flex;
  align-items: center;
  gap: 0.5rem 1.4rem;
  min-height: 44px;
  padding-block: 0.35rem;
}

.gh-emergbar__label {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: var(--gh-gold);
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  white-space: nowrap;
}

.gh-emergbar__dot {
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background: currentColor;
}

.gh-emergbar__items {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  gap: 0.3rem 1.15rem;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.gh-emergbar__items::-webkit-scrollbar {
  display: none;
}

.gh-emergbar__item {
  display: inline-flex;
  align-items: baseline;
  gap: 0.4rem;
  white-space: nowrap;
  color: color-mix(in srgb, var(--gh-paper) 70%, transparent);
  font-size: 0.78rem;
}

.gh-emergbar__item b {
  color: var(--gh-paper);
  font-family: var(--gh-serif);
  font-size: 1.02rem;
  font-weight: 500;
}

.gh-emergbar__call {
  flex: 0 0 auto;
  color: var(--gh-gold);
  font-size: 0.8rem;
  font-weight: 600;
  white-space: nowrap;
}

.gh-emergbar__call:hover,
.gh-emergbar__call:focus-visible {
  text-decoration: underline;
  text-underline-offset: 0.28em;
}

@media (max-width: 720px) {
  .gh-emergbar__label span:last-child {
    display: none;
  }
}

/* --- closing statement --------------------------------------------------- */
.gh-pricingnote {
  max-width: 82ch;
  margin: 0;
  color: var(--gh-ink-soft);
  font-size: 0.87rem;
  line-height: 1.68;
}


/* ---- components/scroll-scrub/scroll-scrub.css ---- */
.scroll-scrub {
  --ss-progress: 0;
  position: relative;
  isolation: isolate;
  color: var(--ss-ink);
  background: var(--ss-bg);
}

.scroll-scrub__stage {
  position: sticky;
  top: 0;
  z-index: 0;
  width: 100%;
  height: 100dvh;
  overflow: hidden;
  background: var(--ss-bg);
}

.scroll-scrub__media,
.scroll-scrub__layer,
.scroll-scrub__picture,
.scroll-scrub__poster,
.scroll-scrub__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.scroll-scrub__media {
  z-index: 0;
}

.scroll-scrub__layer {
  margin: 0;
  overflow: hidden;
  opacity: 0;
  will-change: opacity;
}

.scroll-scrub__layer:first-child {
  opacity: 1;
}

.scroll-scrub__poster,
.scroll-scrub__video {
  display: block;
  object-fit: cover;
  object-position: var(--ss-object-position);
}

.scroll-scrub__poster {
  z-index: 0;
}

.scroll-scrub__video {
  z-index: 1;
}

.scroll-scrub__layer[data-video-painted="true"] .scroll-scrub__poster {
  visibility: hidden;
}

.scroll-scrub__progress {
  position: absolute;
  z-index: 5;
  top: 0;
  right: 0;
  left: 0;
  height: 2px;
  background: color-mix(in srgb, var(--ss-ink) 14%, transparent);
  pointer-events: none;
}

.scroll-scrub__progress span {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--ss-accent);
  transform: scaleX(var(--ss-progress));
  transform-origin: left center;
}

.scroll-scrub__route {
  position: absolute;
  z-index: 6;
  top: clamp(1rem, 3vw, 2rem);
  right: clamp(1rem, 4vw, 4rem);
  left: clamp(1rem, 4vw, 4rem);
  display: flex;
  justify-content: flex-end;
  gap: 0.25rem;
  pointer-events: auto;
}

.scroll-scrub__route-button {
  min-height: 2.75rem;
  padding: 0.65rem 0.9rem;
  border: 0;
  color: var(--ss-muted);
  background: transparent;
  font: inherit;
  cursor: pointer;
}

.scroll-scrub__route-button:hover,
.scroll-scrub__route-button[aria-current="step"] {
  color: var(--ss-ink);
}

.scroll-scrub__route-button[aria-current="step"] {
  text-decoration: underline;
  text-decoration-color: var(--ss-accent);
  text-decoration-thickness: 0.15em;
  text-underline-offset: 0.3em;
}

.scroll-scrub__route-button:focus-visible {
  outline: 2px solid var(--ss-accent);
  outline-offset: 3px;
}

.scroll-scrub__story {
  position: relative;
  z-index: 3;
  margin-top: -100dvh;
  pointer-events: none;
}

.scroll-scrub__chapter,
.scroll-scrub__connector-band {
  position: relative;
}

.scroll-scrub__chapter-pin {
  position: sticky;
  top: 0;
  display: flex;
  align-items: center;
  min-height: 100dvh;
  padding: clamp(5rem, 9vw, 8rem) clamp(1.25rem, 6vw, 6rem);
  pointer-events: none;
}

.scroll-scrub__chapter[data-align="right"] .scroll-scrub__chapter-pin {
  justify-content: flex-end;
}

.scroll-scrub__copy {
  position: relative;
  width: min(40rem, 48vw);
  pointer-events: auto;
}

.scroll-scrub__copy::before {
  position: absolute;
  z-index: -1;
  inset: -3rem -5rem;
  content: "";
  background: radial-gradient(
    ellipse at center,
    color-mix(in srgb, var(--ss-bg) 88%, transparent) 0%,
    color-mix(in srgb, var(--ss-bg) 58%, transparent) 52%,
    transparent 76%
  );
  pointer-events: none;
}

.scroll-scrub__kicker {
  max-width: 30ch;
  margin: 0 0 1rem;
  color: var(--ss-accent);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.scroll-scrub__title {
  max-width: 13ch;
  margin: 0;
  color: var(--ss-ink);
  font: inherit;
  font-size: clamp(2.75rem, 6vw, 6.75rem);
  font-weight: 700;
  line-height: 0.94;
  letter-spacing: -0.045em;
  text-wrap: balance;
}

.scroll-scrub__body {
  max-width: 42ch;
  margin: 1.5rem 0 0;
  color: var(--ss-muted);
  font-size: clamp(1rem, 1.35vw, 1.2rem);
  line-height: 1.55;
}

.scroll-scrub__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
}

.scroll-scrub__tags li {
  padding: 0.45rem 0.7rem;
  border: 1px solid color-mix(in srgb, var(--ss-ink) 20%, transparent);
  color: var(--ss-ink);
  font-size: 0.82rem;
}

.scroll-scrub__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 2rem;
}

@media (max-width: 860px) {
  .scroll-scrub__poster,
  .scroll-scrub__video {
    object-position: var(--ss-mobile-position);
  }

  .scroll-scrub__route {
    right: max(0.75rem, env(safe-area-inset-right));
    left: max(0.75rem, env(safe-area-inset-left));
    justify-content: flex-start;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
  }

  .scroll-scrub__route-button {
    flex: 0 0 auto;
  }

  .scroll-scrub__chapter-pin,
  .scroll-scrub__chapter[data-align="right"] .scroll-scrub__chapter-pin {
    align-items: flex-end;
    justify-content: flex-start;
    padding: 6.5rem max(1.25rem, env(safe-area-inset-right))
      calc(4rem + env(safe-area-inset-bottom))
      max(1.25rem, env(safe-area-inset-left));
  }

  .scroll-scrub__copy {
    width: min(100%, 36rem);
  }

  .scroll-scrub__copy::before {
    inset: -3rem -2rem;
    background: linear-gradient(
      to top,
      var(--ss-bg) 0%,
      color-mix(in srgb, var(--ss-bg) 82%, transparent) 58%,
      transparent 100%
    );
  }

  .scroll-scrub__title {
    max-width: 14ch;
    font-size: clamp(2.3rem, 11vw, 4.5rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .scroll-scrub__chapter {
    min-height: 100dvh !important;
  }

  .scroll-scrub__connector-band {
    display: none;
  }

  .scroll-scrub__progress span {
    transition: none;
  }
}
