/* ===== Aeng Media — design system v1.0 ===== */
:root {
  --obsidian: #0B0B0B;
  --ink: #161615;
  --graphite: #2A2927;
  --stone: #8C8781;
  --bone: #EFEBE4;
  --alabaster: #FAF8F4;
  --paper: #FFFFFF;
  --hair: rgba(239, 235, 228, 0.16);      /* on dark */
  --hair-dark: rgba(11, 11, 11, 0.14);     /* on light */
  --maxw: 1160px;
  --serif: "Bodoni Moda", Didot, "Bodoni 72", Georgia, serif;
  --sans: "Jost", Futura, "Avenir Next", -apple-system, sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--obsidian);
  color: var(--bone);
  font-family: var(--sans);
  font-weight: 300;
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
.serif { font-family: var(--serif); font-optical-sizing: auto; font-weight: 400; }

/* ---- Shared type ---- */
.eyebrow {
  font-size: 11px; letter-spacing: 0.34em; text-transform: uppercase;
  font-weight: 400; color: var(--stone);
}
.eyebrow--center { display: block; text-align: center; margin-bottom: 2.8rem; }
.eyebrow--onDark { color: var(--stone); }
.display {
  font-size: clamp(30px, 4.4vw, 46px); font-weight: 400; line-height: 1.15;
  letter-spacing: -0.01em;
}
.lede { max-width: 62ch; color: #B8B3AC; font-size: 16.5px; }
.light .lede { color: #3A3936; }
.link-arrow {
  font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--stone); font-weight: 400; white-space: nowrap; transition: color 0.25s;
}
.link-arrow:hover { color: var(--bone); }
.light .link-arrow:hover { color: var(--ink); }

/* ---- Wordmark ---- */
.wm-horiz { display: inline-flex; align-items: center; gap: 14px; }
.wm__name { font-family: var(--serif); font-weight: 400; text-transform: uppercase; font-size: 26px; letter-spacing: 0.18em; text-indent: 0.18em; line-height: 1; }
.wm__bar { width: 1px; height: 20px; background: currentColor; opacity: 0.35; }
.wm__cat { font-family: var(--sans); font-weight: 300; text-transform: uppercase; font-size: 9px; letter-spacing: 0.48em; text-indent: 0.48em; opacity: 0.82; }

/* ---- Buttons (0px radius, tracked caps) ---- */
.btn {
  display: inline-block; font-family: var(--sans);
  font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; font-weight: 400;
  padding: 1rem 1.9rem; transition: all 0.3s; cursor: pointer; border: 1px solid transparent;
}
.btn--solid { background: var(--bone); color: var(--obsidian); }
.btn--solid:hover { background: #fff; }
.btn--outline { border-color: var(--hair); color: var(--bone); }
.btn--outline:hover { border-color: var(--bone); }
.btn--sm { padding: 0.7rem 1.25rem; }
.btn--lg { padding: 1.15rem 2.4rem; }
/* solid button on light sections */
.light .btn--solid { background: var(--obsidian); color: var(--bone); }
.light .btn--solid:hover { background: var(--graphite); }

/* ---- Nav ---- */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 20;
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  padding: 1.15rem clamp(1.5rem, 5vw, 2.5rem);
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: background 0.4s ease, border-color 0.4s ease, backdrop-filter 0.4s ease;
}
.nav > .wm { grid-column: 1; justify-self: start; }
.nav > .nav__links { grid-column: 2; justify-self: center; }
.nav > .nav__actions { grid-column: 3; justify-self: end; }
/* soft gradient so links stay legible over the video */
.nav::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(180deg, rgba(11,11,11,0.55), transparent);
  opacity: 1; transition: opacity 0.4s ease;
}
/* solid state once scrolled past the hero */
.nav--solid {
  background: color-mix(in srgb, var(--obsidian) 88%, transparent);
  backdrop-filter: blur(12px);
  border-bottom-color: var(--hair);
}
.nav--solid::before { opacity: 0; }
/* light-page nav (e.g. Work): solid cream with dark text, takes layout space */
.nav.nav--onLight {
  position: sticky;
  background: color-mix(in srgb, var(--alabaster) 92%, transparent);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--hair-dark);
}
.nav--onLight::before { display: none; }
.nav--onLight .wm__name,
.nav--onLight .wm__cat,
.nav--onLight .wm__bar { color: var(--ink); }
.nav--onLight .nav__links a { color: var(--ink); opacity: 0.75; }
.nav--onLight .nav__links a:hover { opacity: 1; }
.nav--onLight .btn--book { background: var(--obsidian); color: var(--bone); }
.nav__actions { display: inline-flex; align-items: center; gap: 0.6rem; }

/* Mobile hamburger + fullscreen menu (injected by main.js) */
.nav__toggle {
  display: none; background: none; border: 0; cursor: pointer; padding: 6px; width: 42px; height: 42px;
  flex-direction: column; justify-content: center; align-items: center; gap: 5px; color: var(--bone);
}
.nav--onLight .nav__toggle, .nav--solid .nav__toggle { color: var(--ink); }
.nav--menu-open .nav__toggle,
.nav--menu-open .wm__name, .nav--menu-open .wm__cat, .nav--menu-open .wm__bar { color: var(--bone); }
.nav__toggle span { display: block; width: 24px; height: 1.5px; background: currentColor; transition: transform 0.3s ease, opacity 0.2s ease; }
.nav__toggle.is-open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.nav__toggle.is-open span:nth-child(2) { opacity: 0; }
.nav__toggle.is-open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
.nav__mobile {
  position: fixed; inset: 0; z-index: 19; background: rgba(11,11,11,0.97);
  display: none; align-items: center; justify-content: center;
}
.nav__mobile.is-open { display: flex; }
.nav__mobile-inner { display: flex; flex-direction: column; align-items: center; gap: 1.7rem; }
.nav__mobile-link { color: var(--bone); font-family: var(--serif); font-size: 27px; letter-spacing: 0.03em; text-decoration: none; opacity: 0.9; }
.nav__mobile-link:hover { opacity: 1; }
.nav__mobile .btn { margin-top: 0.5rem; min-width: 210px; text-align: center; }
.nav--onLight .btn--outline { border-color: var(--hair-dark); color: var(--ink); }
.nav--onLight .btn--outline:hover { border-color: var(--ink); }
.nav .wm__name { font-size: 24px; }
.nav__links { display: flex; gap: 2rem; }
.nav__links a {
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--bone); font-weight: 300; opacity: 0.85; transition: opacity 0.2s;
}
.nav__links a:hover { opacity: 1; }

/* ---- Hero ---- */
.hero {
  position: relative; overflow: hidden;
  min-height: 100vh; min-height: 100svh; display: flex; align-items: center; justify-content: center;
  padding: 4rem clamp(1.5rem, 6vw, 4rem); text-align: center;
  background:
    radial-gradient(120% 80% at 50% 0%, rgba(60,58,54,0.5), transparent 60%),
    linear-gradient(180deg, #131312, var(--obsidian));
}
.hero__video {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; z-index: 0;
}
.hero__scrim {
  position: absolute; inset: 0; z-index: 1;
  background:
    radial-gradient(90% 70% at 50% 50%, rgba(11,11,11,0.55), rgba(11,11,11,0.35) 70%),
    linear-gradient(180deg, rgba(11,11,11,0.6) 0%, rgba(11,11,11,0.45) 45%, rgba(11,11,11,0.7) 100%);
}
.hero__inner { position: relative; z-index: 2; max-width: var(--maxw); width: 100%; margin: 0 auto; }
.hero .eyebrow { display: block; margin-bottom: 2rem; }
.hero__title {
  font-size: clamp(1.8rem, 3.8vw, 3rem); line-height: 1.1; letter-spacing: -0.015em;
  margin-bottom: 1.4rem;
}
.hero__sub { color: #fff; font-size: 15px; letter-spacing: 0.05em; margin-bottom: 3rem; max-width: 52ch; margin-left: auto; margin-right: auto; }
.hero__cta { display: flex; gap: 1rem; flex-wrap: wrap; justify-content: center; }

/* ---- Sections ---- */
.section { padding: clamp(4.5rem, 9vw, 8.5rem) clamp(1.5rem, 5vw, 2.5rem); border-top: 1px solid var(--hair); }
.section--tight-top { padding-top: clamp(5rem, 6vw, 5.5rem); }
.light {
  background: var(--alabaster); color: var(--ink); border-top-color: var(--hair-dark);
}
.light .eyebrow { color: var(--graphite); }
.wrap { max-width: var(--maxw); margin: 0 auto; }
.section__head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 3.2rem; gap: 1.5rem;
}
.section__head--stack { align-items: flex-end; }
.section__head--stack .eyebrow { display: block; margin-bottom: 1.2rem; }

/* ---- Work page header ---- */
.work-head { max-width: 60ch; margin-bottom: 3.5rem; }
.work-head .eyebrow { display: block; margin-bottom: 1.2rem; }
.work-head .display { margin-bottom: 1.2rem; }

/* ---- Contact page (form) ---- */
.cf-head { max-width: 60ch; margin: 0 auto 3rem; text-align: center; }
.cf-head .eyebrow { display: block; margin-bottom: 1.2rem; }
.cf-head .display { margin-bottom: 1.2rem; }
.cf-head em { font-style: italic; }
.cf-head .lede a { color: var(--ink); border-bottom: 1px solid var(--hair-dark); white-space: nowrap; }
.cf-head .lede a:hover { border-bottom-color: var(--ink); }

.cf-form { max-width: 640px; margin: 0 auto; display: grid; gap: 1.4rem; }
.cf-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.4rem; }
.cf-field { display: flex; flex-direction: column; }
.cf-field label { font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--stone); margin-bottom: 0.5rem; }
.cf-field input, .cf-field select, .cf-field textarea {
  font-family: var(--sans); font-weight: 300; font-size: 15px; color: var(--ink);
  background: var(--paper); border: 1px solid var(--hair-dark); border-radius: 0;
  padding: 0.85rem 1rem; width: 100%;
}
.cf-field textarea { resize: vertical; }
.cf-field input:focus, .cf-field select:focus, .cf-field textarea:focus { outline: none; border-color: var(--ink); }
.cf-submit { justify-self: center; margin-top: 0.6rem; cursor: pointer; }
.cf-note { font-size: 13px; letter-spacing: 0.02em; color: var(--stone); margin: 0; min-height: 1em; text-align: center; }

.cf-contact { display: flex; justify-content: center; gap: 2.5rem 3.5rem; flex-wrap: wrap; margin-top: 3.5rem; padding-top: 2rem; border-top: 1px solid var(--hair-dark); text-align: center; }
.cf-contact .eyebrow { display: block; margin-bottom: 0.4rem; }
.contact-val { font-size: 1.1rem; font-weight: 400; letter-spacing: 0.01em; color: var(--ink); }
.contact-val a { color: inherit; transition: opacity 0.2s; }
.contact-val a:hover { opacity: 0.55; }
@media (max-width: 640px) { .cf-row { grid-template-columns: 1fr; } }

/* ---- Services / Pricing ---- */
.light .btn--outline { border-color: var(--hair-dark); color: var(--ink); }
.light .btn--outline:hover { border-color: var(--ink); background: transparent; }

.pkg-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.pkg {
  position: relative; display: flex; flex-direction: column;
  background: var(--paper); border: 1px solid var(--hair-dark); padding: 2.6rem 2rem;
}
.pkg--featured { background: var(--obsidian); border-color: var(--obsidian); color: var(--bone); }
.pkg__tag {
  position: absolute; top: 0; right: 0; background: var(--bone); color: var(--obsidian);
  font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; padding: 0.45rem 0.9rem;
}
.pkg__name { font-size: 1.6rem; font-weight: 400; letter-spacing: 0.01em; }
.pkg__price { font-size: 3.2rem; font-weight: 400; letter-spacing: -0.02em; line-height: 1; margin: 0.4rem 0 0.6rem; }
.pkg__for { font-size: 12.5px; letter-spacing: 0.04em; color: #6B6762; margin-bottom: 1.6rem; }
.pkg--featured .pkg__for { color: var(--stone); }
.pkg__list { list-style: none; margin-bottom: 2rem; }
.pkg__list li { font-size: 13.5px; letter-spacing: 0.02em; color: #3A3936; padding: 0.7rem 0; border-top: 1px solid var(--hair-dark); }
.pkg__list li:first-child { border-top: none; }
.pkg--featured .pkg__list li { color: rgba(239,235,228,0.95); border-top-color: var(--hair); }
.pkg__cta { margin-top: auto; text-align: center; }
.pkg--featured .btn--solid { background: var(--bone); color: var(--obsidian); }
.pkg--featured .btn--solid:hover { background: #fff; }

.alc-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2.5rem 3.5rem; margin-top: 0.5rem; }
.alc__cat { display: block; margin-bottom: 1rem; }
.alc__row {
  display: flex; justify-content: space-between; align-items: baseline; gap: 1rem;
  padding: 0.75rem 0; border-bottom: 1px solid var(--hair);
  font-size: 14.5px; color: var(--bone);
}
.light .alc__row { color: #3A3936; border-bottom-color: var(--hair-dark); }
.alc__price { font-family: var(--serif); font-size: 18px; color: var(--bone); white-space: nowrap; }
.light .alc__price { color: var(--ink); }
.alc__note {
  margin-top: 3rem; padding-top: 1.8rem; border-top: 1px solid var(--hair);
  max-width: 72ch; font-size: 12.5px; color: var(--stone); line-height: 1.7;
}
@media (max-width: 820px) {
  .pkg-grid { grid-template-columns: 1fr; max-width: 460px; margin-left: auto; margin-right: auto; }
  .alc-grid { grid-template-columns: 1fr; }
}

/* ---- Listing detail page ---- */
.listing-head { max-width: 70ch; margin: 0 auto 3.5rem; text-align: center; }
.listing-head .eyebrow { display: block; margin-bottom: 1rem; }
.listing-head__title { margin-bottom: 1rem; }
.listing-head__subtitle { font-style: italic; font-size: clamp(18px, 2.2vw, 22px); color: var(--stone); margin-bottom: 1rem; }
.listing-head__desc { color: #3A3936; max-width: 62ch; margin: 0 auto; }
.listing-video { margin-bottom: 20px; display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; gap: 20px; }
.listing-video:empty { display: none; margin: 0; }
.listing-video__player { width: 100%; height: auto; display: block; background: var(--obsidian); }
/* vertical reels sit side by side (wrap to stack on narrow screens) */
.listing-video__player--vertical { flex: 0 1 auto; width: auto; height: 76vh; max-height: 720px; }
@media (max-width: 640px) { .listing-video__player--vertical { width: 100%; height: auto; max-height: none; } }
/* Wide media area — gallery spans wider than the text column, like Jacob's */
.listing-media { max-width: 1700px; margin: 0 auto; }
/* 3-column grid — large images, left-to-right in order */
/* Masonry columns — packs mixed portrait/landscape photos with no gaps. */
.listing-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; grid-auto-rows: 10px; margin-top: 20px; align-items: start; }
.listing-gallery:empty { display: none; margin: 0; }
.listing-gallery__img { width: 100%; height: auto; display: block; margin: 0; }
.listing-gallery__fig { position: relative; margin: 0; }
.listing-gallery__num {
  position: absolute; top: 8px; left: 8px;
  background: rgba(11,11,11,0.8); color: #fff;
  font-size: 15px; font-weight: 600; letter-spacing: 0.02em;
  padding: 4px 9px; border-radius: 2px; font-family: var(--sans);
}
.cta__buttons { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
@media (max-width: 860px) {
  .listing-gallery { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .listing-gallery { grid-template-columns: 1fr; }
}

/* ---- Featured Reels ---- */
.reels-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.reel { display: block; }
.reel__media { position: relative; aspect-ratio: 9/16; overflow: hidden; background: var(--obsidian); }
.reel__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.reel:hover .reel__video { transform: scale(1.04); }
.reel__cta {
  position: absolute; bottom: 1rem; right: 1rem; z-index: 2;
  font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--bone);
  background: rgba(11,11,11,0.55); padding: 0.4rem 0.7rem; opacity: 0; transition: opacity 0.3s;
}
.reel:hover .reel__cta { opacity: 1; }
.reel__caption {
  margin-top: 1.1rem; text-align: center;
  font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--stone);
}
@media (max-width: 860px) { .reels-row { grid-template-columns: repeat(2, 1fr); gap: 16px; } }
@media (max-width: 460px) { .reels-row { grid-template-columns: 1fr; max-width: 300px; margin: 0 auto; } }

/* ---- Work grid ---- */
.work-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.work-grid--wide { grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media (max-width: 900px) { .work-grid--wide { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .work-grid--wide { grid-template-columns: 1fr; } }
.work-card { position: relative; overflow: hidden; aspect-ratio: 3/2; cursor: pointer; }
.work-card__media {
  position: absolute; inset: 0;
  background: linear-gradient(150deg, #3a3936, #131312 72%);
  background-size: cover; background-position: center;
  transition: transform 0.7s ease;
}
.work-card::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(to top, rgba(11,11,11,0.92) 0%, rgba(11,11,11,0.35) 42%, transparent 62%),
    linear-gradient(to bottom, rgba(11,11,11,0.72), rgba(11,11,11,0.15) 22%, transparent 34%);
}
.work-card:hover .work-card__media { transform: scale(1.04); }
.work-card__loc {
  position: absolute; top: 1.3rem; left: 1.4rem; z-index: 2;
  font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase; color: rgba(239,235,228,0.85);
}
.work-card__caption { position: absolute; bottom: 1.3rem; left: 1.5rem; z-index: 2; color: var(--bone); }
.work-card__caption h3 { font-size: 26px; font-weight: 400; line-height: 1.1; letter-spacing: -0.01em; }
.work-card__caption p { font-size: 9px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--stone); margin-top: 0.5rem; }

/* ---- Services (tall cards) ---- */
.service-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.service-card { position: relative; overflow: hidden; aspect-ratio: 5/7; }
.service-card__media {
  position: absolute; inset: 0;
  background: linear-gradient(150deg, #2f2e2b, #141312 72%);
  background-size: cover; background-position: center;
  transition: transform 0.7s ease;
}
.service-card::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(11,11,11,0.85) 0%, rgba(11,11,11,0.15) 40%, transparent 62%);
}
.service-card:hover .service-card__media { transform: scale(1.04); }
.service-card__body { position: absolute; bottom: 1.5rem; left: 1.6rem; right: 1.2rem; z-index: 2; color: var(--bone); }
.service-card__body h3 { font-size: 26px; font-weight: 400; line-height: 1.1; }
.service-card__body p { font-size: 12.5px; letter-spacing: 0.03em; color: rgba(239,235,228,0.75); margin-top: 0.4rem; }

.service-extra {
  margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--hair);
  color: var(--stone); font-size: 13px; letter-spacing: 0.04em;
}
.light .service-extra { border-top-color: var(--hair-dark); color: #6B6762; }
.service-extra .eyebrow { margin-right: 1rem; }

/* ---- Book page (standalone) ---- */
body.book-page { background: var(--alabaster); }
body.book-page .cf-field input, body.book-page .cf-field select, body.book-page .cf-field textarea { background: #ECECEA; border-radius: 8px; }
body.book-page .cf-field label { color: var(--ink); }
body.book-page .bk-alc-cat { color: var(--ink); }
.bk-csz { grid-template-columns: 2fr 1.1fr 0.9fr; }
@media (max-width: 560px) { .bk-csz { grid-template-columns: 1fr; } }
.bk-terms { text-align: left; background: #ECECEA; border: 1px solid var(--hair-dark); border-radius: 14px; padding: 1.6rem 1.75rem; max-height: 300px; overflow-y: auto; }
.bk-terms__title { font-size: 22px; font-weight: 400; line-height: 1.15; color: var(--ink); margin: 0 0 0.8rem; }
.bk-terms__intro { font-family: var(--sans); font-size: 13px; line-height: 1.6; color: var(--graphite); margin: 0 0 0.3rem; }
.bk-terms h4 { font-family: var(--sans); font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink); font-weight: 400; margin: 1.4rem 0 0.4rem; }
.bk-terms p { font-family: var(--sans); font-size: 13.5px; line-height: 1.65; color: var(--graphite); margin: 0; }
.bk-terms__close { color: var(--ink) !important; margin-top: 1.6rem !important; }
.bk-sign-area { text-align: left; background: #ECECEA; border: 1px solid var(--hair-dark); border-radius: 14px; padding: 1.4rem 1.75rem 1.6rem; }
.bk-sign-area label { display: block; font-family: var(--sans); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink); margin-bottom: 0.65rem; }
.bk-sign-area input { width: 100%; background: var(--paper); border: 1px solid var(--hair-dark); border-radius: 8px; padding: 0.85rem 1rem; font-family: var(--serif); font-size: 18px; color: var(--ink); }
.bk-sign-note { text-align: center; font-family: var(--sans); font-size: 14px; line-height: 1.6; color: var(--ink); max-width: 54ch; margin: 1.3rem auto 0; }
.btn[hidden] { display: none; }
.book-topbar {
  display: flex; justify-content: center; align-items: center;
  padding: clamp(1.4rem, 3vw, 2rem) 1.5rem;
  background: var(--alabaster); color: var(--ink);
  border-bottom: 1px solid var(--hair-dark);
}

/* ---- Book wizard ---- */
.bk-shell { max-width: 780px; margin: 0 auto; }
.bk-progress { margin-bottom: 1.6rem; }
.bk-track { display: flex; gap: 6px; }
.bk-track__seg { flex: 1; height: 3px; background: var(--hair-dark); transition: background 0.3s; }
.bk-track__seg.is-done { background: var(--ink); }
.bk-steps {
  list-style: none; margin: 1.1rem 0 0; padding: 0;
  display: flex; gap: 6px;
}
.bk-steps__item {
  flex: 1; text-align: center;
  font-family: var(--sans); font-size: 11px; letter-spacing: 0.13em;
  text-transform: uppercase; color: var(--stone); white-space: nowrap;
  transition: color 0.25s;
}
.bk-steps__item.is-active { color: var(--ink); }
.bk-counter {
  margin: 1.5rem 0 0; font-size: 12px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--stone); text-align: center;
}
@media (max-width: 680px) { .bk-steps { display: none; } }

.bk-step { border: 0; margin: 0; padding: 0; min-inline-size: 0; display: grid; gap: 1.4rem; }
.bk-step[hidden] { display: none; }
.bk-step__title { font-size: clamp(23px, 3vw, 33px); font-weight: 400; line-height: 1.1; margin: 0; text-align: center; }
.bk-step__sub { text-align: center; max-width: 46ch; margin: 0 auto; font-size: 15px; line-height: 1.7; color: var(--stone); }

.bk-nav { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 2.6rem; }
.bk-nav .cf-submit { margin-top: 0; }

.bk-review { border: 1px solid var(--hair-dark); border-radius: 12px; background: #ECECEA; padding: 0.5rem 1.5rem; }
.bk-review__row {
  display: flex; justify-content: space-between; gap: 2rem;
  padding: 0.85rem 0; border-bottom: 1px solid var(--hair-dark);
}
.bk-review__row:last-child { border-bottom: none; }
.bk-review__k { font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink); flex: 0 0 auto; }
.bk-alc-cat.bk-review-head { color: var(--ink); }
.bk-review__v { font-size: 14px; color: var(--ink); text-align: right; }
.bk-note--success { color: var(--ink); font-size: 15px; }

/* ---- Book: schedule calendar ---- */
.bk-cal { max-width: 480px; margin: 0 auto; }
.bk-cal__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.4rem; }
.bk-cal__title { font-size: clamp(20px, 2.4vw, 26px); font-weight: 400; }
.bk-cal__nav { width: 42px; height: 42px; border: 1px solid var(--hair-dark); border-radius: 10px; background: var(--paper); color: var(--ink); font-size: 16px; cursor: pointer; transition: border-color 0.2s; }
.bk-cal__nav:hover { border-color: var(--ink); }
.bk-cal__weekdays { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; margin-bottom: 8px; }
.bk-cal__weekdays span { text-align: center; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--stone); }
.bk-cal__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; }
.bk-cal__cell { aspect-ratio: 1; display: flex; align-items: center; justify-content: center; border: 1px solid var(--hair-dark); border-radius: 10px; background: var(--paper); font-family: var(--sans); font-weight: 300; font-size: 15px; color: var(--ink); cursor: pointer; transition: background 0.15s, border-color 0.15s, color 0.15s; }
.bk-cal__cell--empty { border: none; background: transparent; cursor: default; }
.bk-cal__cell.is-past { color: var(--stone); opacity: 0.5; cursor: default; }
.bk-cal__cell:not(.is-past):not(.bk-cal__cell--empty):hover { border-color: var(--ink); }
.bk-cal__cell.is-selected { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.bk-step[data-name="Schedule"] input[type="date"] { border-radius: 8px; }
.bk-step[data-name="Schedule"] .bk-time-pills { justify-content: center; margin-top: 0.4rem; }
.bk-step[data-name="Schedule"] .bk-alc-cat { text-align: center; }
.bk-schedule-note { font-style: italic; color: var(--ink); font-size: 15px; line-height: 1.6; margin-top: 2.2rem; }

/* ---- Book: priced package cards ---- */
/* These cards are <label>s inside .cf-field — cancel the small-caps field-label styling */
.cf-field .bk-pkg, .cf-field .bk-svc, .cf-field .bk-pill, .cf-field .bk-status {
  text-transform: none; letter-spacing: normal; color: var(--ink); font-size: 14px; margin: 0;
}
/* Details: current-status cards */
.bk-statuses { display: grid; grid-template-columns: 1fr; gap: 0.7rem; }
@media (min-width: 560px) { .bk-statuses { grid-template-columns: 1fr 1fr; } }
.bk-status { display: flex; align-items: center; justify-content: space-between; gap: 1rem; border: 1px solid var(--hair-dark); border-radius: 10px; padding: 1.05rem 1.4rem; background: #ECECEA; cursor: pointer; transition: border-color 0.2s, background 0.2s; }
.bk-status:hover { border-color: var(--ink); }
.bk-status:has(input:checked) { border-color: var(--ink); background: #E2E2E0; }
.bk-status__name { font-size: 16px; color: var(--ink); }
.bk-status input { accent-color: var(--ink); width: 16px; height: 16px; flex: 0 0 auto; }
.bk-step[data-name="Details"] .cf-field > label { text-align: center; }
.bk-step[data-name="Details"] .bk-pills { justify-content: center; margin-top: 0.4rem; }
.bk-step[data-name="Details"] .bk-pill { text-transform: uppercase; letter-spacing: 0.06em; font-size: 12px; }
.bk-step[data-name="Details"] textarea { border-radius: 8px; }
/* Add-on pills */
.bk-alc-cat--left { text-align: left; }
.bk-pills { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.7rem; }
.bk-pill {
  display: inline-flex; align-items: center;
  border: 1px solid var(--hair-dark); border-radius: 999px;
  padding: 0.75rem 1.4rem; cursor: pointer; background: #ECECEA;
  font-size: 15px; color: var(--ink);
  transition: border-color 0.2s, background 0.2s, color 0.2s;
}
.bk-pill input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.bk-pill:hover { border-color: var(--ink); }
.bk-pill:has(input:checked) { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.bk-elevate-note {
  text-align: center; max-width: 58ch; margin: 2.8rem auto 0;
  font-size: 16px; line-height: 1.65; color: var(--ink);
}
.addon-section[hidden] { display: none; }
.bk-video-placeholder { text-align: center; color: var(--stone); font-size: 14px; line-height: 1.6; max-width: 52ch; margin: 0.5rem auto 0; }
.bk-speed { position: relative; max-width: 640px; margin: 0 auto; }
.bk-speed__rail { position: absolute; top: 9px; left: 10%; width: 80%; height: 2px; background: var(--hair-dark); z-index: 0; }
.bk-speed__fill { display: block; position: absolute; left: 0; top: 0; height: 100%; width: 50%; background: var(--ink); transition: width 0.2s ease; }
.bk-speed__nodes { position: relative; display: flex; z-index: 1; }
.bk-speed__node { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.7rem; background: none; border: 0; padding: 0; font: inherit; cursor: pointer; }
.bk-speed__dot { width: 18px; height: 18px; border-radius: 999px; border: 2px solid var(--hair-dark); background: var(--alabaster); box-sizing: border-box; transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease; }
.bk-speed__node.is-done .bk-speed__dot, .bk-speed__node.is-active .bk-speed__dot { border-color: var(--ink); background: var(--ink); }
.bk-speed__node.is-active .bk-speed__dot { transform: scale(1.28); }
.bk-speed__label { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--stone); text-align: center; line-height: 1.3; transition: color 0.2s ease; }
.bk-speed__node.is-active .bk-speed__label { color: var(--ink); }
.bk-music-field { margin-top: 2.2rem; }
.bk-music-field label, .bk-music-field .cf-hint { text-align: center; }
.bk-music-field .cf-hint { max-width: 54ch; margin-left: auto; margin-right: auto; }
.bk-music-field input { border-radius: 8px; }
/* Add-ons cards: 3 across, more compact */
@media (min-width: 620px) {
  .bk-step[data-name="Add-ons"] .bk-svcs { grid-template-columns: repeat(3, 1fr); }
}
.bk-step[data-name="Add-ons"] .bk-svc { padding: 0.85rem 1rem; gap: 0.6rem; }
.bk-step[data-name="Add-ons"] .bk-svc__name { font-size: 14px; }
.bk-step[data-name="Add-ons"] .bk-svc__price { font-size: 13px; }
.bk-step[data-name="Add-ons"] .bk-svc input { width: 14px; height: 14px; margin-top: 0.15rem; }
.bk-step[data-name="Add-ons"] .bk-svcs--center { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.8rem; }
.bk-step[data-name="Add-ons"] .bk-svcs--center .bk-svc { flex: 1 1 100%; }
@media (min-width: 620px) {
  .bk-step[data-name="Add-ons"] .bk-svcs--center .bk-svc { flex: 0 1 calc((100% - 1.6rem) / 3); }
}
.bk-tier { display: flex; gap: 0.25rem; width: fit-content; margin: 0 auto 1.6rem; padding: 4px; border: 1px solid var(--hair-dark); border-radius: 999px; background: var(--alabaster); }
.bk-tier__btn {
  border: 0; background: none; cursor: pointer; font: inherit; padding: 0.5rem 1.6rem;
  border-radius: 999px; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--stone); transition: background 0.2s ease, color 0.2s ease;
}
.bk-tier__btn.is-active { background: var(--ink); color: var(--alabaster); }
.bk-pkgs { display: grid; gap: 0.8rem; }
.bk-pkgs[hidden], .bk-tierset[hidden] { display: none; }
.bk-orient { display: grid; grid-template-columns: 1fr 1fr; gap: 0.8rem; max-width: 520px; margin: 0 auto 0.5rem; }
.bk-orient__opt { display: flex; align-items: center; gap: 0.7rem; border: 1px solid var(--hair-dark); border-radius: 12px; padding: 0.9rem 1rem; cursor: pointer; background: var(--bone); transition: border-color 0.15s ease, background 0.15s ease; }
.bk-orient__radio { position: absolute; opacity: 0; pointer-events: none; }
.bk-orient__icon { flex: 0 0 44px; width: 44px; display: flex; align-items: center; justify-content: center; color: var(--stone); transition: color 0.15s ease; }
.bk-orient__icon svg { width: 30px; height: 30px; display: block; }
.bk-orient__opt:has(input:checked) { border-color: var(--ink); background: var(--alabaster); }
.bk-orient__opt:has(input:checked) .bk-orient__icon { color: var(--ink); }
/* Booking calendar */
.bk-cal { max-width: 460px; margin: 0 auto 0.5rem; border: 1px solid var(--hair-dark); border-radius: 14px; padding: 1rem 1.1rem 1.2rem; background: var(--alabaster); }
.bk-cal__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.9rem; }
.bk-cal__title { font-size: 14px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink); }
.bk-cal__nav { width: 32px; height: 32px; border-radius: 999px; border: 1px solid var(--hair-dark); background: var(--paper); color: var(--ink); cursor: pointer; font-size: 14px; display: flex; align-items: center; justify-content: center; }
.bk-cal__nav:hover:not(:disabled) { background: var(--bone); }
.bk-cal__nav:disabled { opacity: 0.3; cursor: default; }
.bk-cal__dow { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-bottom: 6px; }
.bk-cal__dow span { text-align: center; font-size: 10px; letter-spacing: 0.1em; color: var(--stone); }
.bk-cal__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.bk-cal__cell { aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; border: 0; background: none; border-radius: 8px; font: inherit; font-size: 13px; color: var(--ink); cursor: pointer; }
.bk-cal__cell.is-empty { pointer-events: none; }
.bk-cal__cell:hover:not(.is-past):not(.is-empty) { background: var(--bone); }
.bk-cal__cell.is-past { color: var(--stone); opacity: 0.4; cursor: default; }
.bk-cal__cell.is-selected { background: var(--ink); color: var(--alabaster); }
.bk-cal__hint { text-align: center; }
/* Booking time slots */
.bk-times { max-width: 620px; margin: 0 auto; }
.bk-times__group { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink); margin: 1rem 0 0.6rem; }
.bk-times__group span { color: var(--stone); letter-spacing: 0; text-transform: none; margin-left: 0.4rem; font-size: 12px; }
.bk-times__row { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.bk-time { border: 1px solid var(--hair-dark); background: var(--paper); color: var(--ink); border-radius: 999px; padding: 0.5rem 1rem; font: inherit; font-size: 13px; cursor: pointer; transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease; }
.bk-time:hover { border-color: var(--stone); }
.bk-time.is-active { background: var(--ink); color: var(--alabaster); border-color: var(--ink); }
.bk-time__best { display: inline-block; margin-left: 0.4rem; font-size: 8px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--stone); border: 1px solid var(--hair-dark); border-radius: 999px; padding: 0.12rem 0.4rem; vertical-align: middle; }
.bk-time.is-active .bk-time__best { color: var(--alabaster); border-color: rgba(250, 248, 244, 0.5); }
.bk-launch-field { max-width: 460px; margin: 1.6rem auto 0; }
/* Booking compass (front-facing direction) */
.bk-compass { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.8rem; width: 100%; max-width: 620px; margin: 0 auto; }
.bk-compass__opt { position: relative; display: flex; align-items: center; justify-content: center; min-height: 68px; border: 1px solid var(--hair-dark); border-radius: 12px; padding: 1rem 0.5rem; text-align: center; cursor: pointer; background: var(--bone); font-size: 17px; letter-spacing: 0.06em; color: var(--ink); transition: border-color 0.15s ease, background 0.15s ease; }
.bk-compass__opt input { position: absolute; opacity: 0; pointer-events: none; }
.bk-compass__opt:has(input:checked) { border-color: var(--ink); background: var(--alabaster); }
@media (max-width: 520px) { .bk-compass { grid-template-columns: repeat(2, 1fr); } }
.bk-orient__body { display: flex; flex-direction: column; gap: 0.15rem; }
.bk-orient__name { font-size: 15px; color: var(--ink); }
.bk-orient__meta { font-size: 12px; color: var(--stone); }
.bk-orient__hint { text-align: center; }
@media (max-width: 520px) { .bk-orient { grid-template-columns: 1fr; } }
.bk-pkg {
  display: flex; gap: 1rem; align-items: flex-start;
  border: 1px solid var(--hair-dark); border-radius: 8px; padding: 1.2rem 1.35rem;
  cursor: pointer; background: #ECECEA; transition: border-color 0.2s, background 0.2s;
}
.bk-pkg:hover { border-color: var(--ink); }
.bk-pkg:has(input:checked) { border-color: var(--ink); background: #E2E2E0; }
.bk-pkg input { margin-top: 0.3rem; accent-color: var(--ink); width: 15px; height: 15px; flex: 0 0 auto; }
.bk-pkg__body { flex: 1; display: flex; flex-direction: column; gap: 0.55rem; }
.bk-pkg__head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.bk-pkg__name { font-size: clamp(17px, 1.6vw, 20px); font-weight: 400; letter-spacing: 0.005em; }
.bk-pkg__price { font-family: var(--sans); font-weight: 400; font-size: 15px; color: var(--ink); white-space: nowrap; }
.bk-pkg__desc { font-size: 13px; line-height: 1.6; color: #4A4743; }
.bk-pkg__list { list-style: none; margin: 0.2rem 0 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 0.45rem 1.6rem; }
@media (min-width: 560px) { .bk-pkg__list { grid-template-columns: 1fr 1fr; } }
.bk-pkg__list li { position: relative; padding-left: 1.1rem; font-size: 13px; line-height: 1.5; color: #4A4743; }
.bk-pkg__list li::before { content: "–"; position: absolute; left: 0; color: var(--stone); }

/* ---- Book: à la carte service cards ---- */
.bk-step[data-name="Services"] .cf-field > label { text-align: center; font-size: 14px; }
.bk-alc-cat { font-size: 14px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--stone); margin: 2.6rem 0 1.1rem; text-align: center; }
.bk-alc-cat:first-of-type { margin-top: 0.8rem; }
.bk-svcs { display: grid; grid-template-columns: 1fr; gap: 0.8rem; }
@media (min-width: 620px) { .bk-svcs { grid-template-columns: 1fr 1fr; } }
.bk-svc {
  display: flex; gap: 1rem; align-items: flex-start;
  border: 1px solid var(--hair-dark); border-radius: 8px; padding: 1.2rem 1.35rem; cursor: pointer;
  background: #ECECEA; transition: border-color 0.2s, background 0.2s;
}
.bk-svc[hidden] { display: none; }
.bk-svc:hover { border-color: var(--ink); }
.bk-svc:has(input:checked) { border-color: var(--ink); background: #E2E2E0; }
.bk-svc input { margin-top: 0.3rem; accent-color: var(--ink); width: 15px; height: 15px; flex: 0 0 auto; }
.bk-svc__body { flex: 1; display: flex; flex-direction: column; gap: 0.5rem; }
.bk-svc__head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.bk-svc__name { font-size: clamp(16px, 1.5vw, 18px); font-weight: 400; letter-spacing: 0.005em; }
.bk-svc__price { font-family: var(--sans); font-weight: 400; font-size: 14px; color: var(--ink); white-space: nowrap; }
.bk-svc__desc { font-size: 13px; line-height: 1.6; color: #4A4743; }
.bk-other-field { margin-top: 0.8rem; }
.bk-other-field textarea { border-radius: 8px; }
.bk-total { margin-top: 2.8rem; padding-top: 1.8rem; border-top: 1px solid var(--hair-dark); text-align: center; }
.bk-total__label { display: block; font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--stone); margin-bottom: 0.6rem; }
.bk-total__num { font-family: var(--serif); font-size: clamp(28px, 3.4vw, 38px); font-weight: 400; color: var(--ink); }

/* ---- Book form ---- */
.bk-optional { color: var(--stone); letter-spacing: 0; text-transform: none; font-size: 13px; }
.cf-hint { font-size: 12px; color: var(--stone); margin: 0.5rem 0 0; line-height: 1.5; letter-spacing: 0.01em; }
.bk-sqft { display: inline-flex; align-self: flex-start; align-items: flex-end; gap: 0.35rem; border-bottom: 1px solid var(--ink); }
.bk-sqft input {
  font-family: var(--serif); font-size: clamp(26px, 3.5vw, 36px); font-weight: 400;
  color: var(--ink); background: transparent; border: 0; border-radius: 0;
  padding: 0.1rem 0 0.4rem; width: 6ch; line-height: 1;
}
.bk-sqft input:focus { outline: none; border: 0; }
.bk-sqft input::placeholder { color: var(--stone); opacity: 0.45; }
.bk-sqft input::-webkit-outer-spin-button,
.bk-sqft input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.bk-sqft input[type="number"] { -moz-appearance: textfield; appearance: textfield; }
.bk-sqft__unit { font-family: var(--sans); font-size: 15px; color: var(--stone); padding-bottom: 0.6rem; flex: 0 0 auto; }
.bk-sqft-field { align-items: center; text-align: center; }
.bk-sqft-field .bk-sqft { align-self: center; }
.bk-sqft-field .cf-hint { text-align: center; }
.bk-options { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.7rem; }
@media (min-width: 620px) { .bk-options { grid-template-columns: repeat(4, 1fr); } }
.bk-option, .bk-check {
  display: flex; align-items: center; gap: 0.6rem;
  border: 1px solid var(--hair-dark); padding: 0.9rem 1rem;
  font-size: 14px; color: var(--ink); cursor: pointer;
  transition: border-color 0.2s, background 0.2s;
}
.bk-option span, .bk-check span { line-height: 1.2; }
.bk-option input, .bk-check input { accent-color: var(--ink); width: 15px; height: 15px; flex: 0 0 auto; }
.bk-option:hover, .bk-check:hover { border-color: var(--ink); }
.bk-option:has(input:checked), .bk-check:has(input:checked) {
  border-color: var(--ink); background: var(--paper);
}
.bk-checks { display: grid; grid-template-columns: 1fr; gap: 0.7rem; }
@media (min-width: 620px) { .bk-checks { grid-template-columns: repeat(2, 1fr); } }

/* ---- About ---- */
.about-story { max-width: 62ch; margin: 0 auto; text-align: center; }
.about-story p {
  font-size: clamp(16px, 1.5vw, 19px); line-height: 1.85;
  color: var(--ink); margin: 0 0 1.5rem;
}
.about-story p:last-child { margin-bottom: 0; }
/* Two-column story with portrait */
.about-split { display: grid; grid-template-columns: 1fr; gap: clamp(2.4rem, 5vw, 4.5rem); align-items: center; }
@media (min-width: 860px) { .about-split { grid-template-columns: 0.82fr 1fr; } }
.about-portrait__img { width: 100%; height: auto; display: block; }
.about-story--left { max-width: 56ch; margin: 0; text-align: left; }
.about-story--left p { font-size: clamp(15px, 1.35vw, 17px); line-height: 1.8; }
/* ---- Approach ---- */
.approach { display: grid; grid-template-columns: 1.15fr 1fr; gap: 4rem; align-items: center; }
.approach__text .eyebrow { display: block; margin-bottom: 1.5rem; }
.approach__text .display { margin-bottom: 1.8rem; max-width: 18ch; }
.approach__text .lede { margin-bottom: 2rem; }
.approach__photo { aspect-ratio: 4/5; background: linear-gradient(150deg, #cfc9bd, #a29a89); }

/* ---- Testimonials ---- */
.quote-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.quote-card { background: rgba(255,255,255,0.035); border: 1px solid var(--hair); padding: 2.8rem 2.5rem; }
.quote-card blockquote { font-size: 22px; font-weight: 400; line-height: 1.5; color: var(--bone); margin-bottom: 2rem; }
.quote-card blockquote::before { content: "\201C"; display: block; font-family: var(--serif); font-size: 46px; color: var(--stone); line-height: 0.4; margin-bottom: 1.2rem; }
.quote-card__name { display: block; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--bone); }
.quote-card__firm { display: block; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--stone); margin-top: 0.35rem; }
/* light-section variant */
.light .quote-card { background: var(--paper); border-color: var(--hair-dark); }
.light .quote-card blockquote { color: var(--ink); }
.light .quote-card__name { color: var(--ink); }
.light .quote-card__firm { color: #6B6762; }

/* ---- Final CTA ---- */
.cta { text-align: center; }
.cta .wrap { display: flex; flex-direction: column; align-items: center; gap: 2.4rem; }
.cta .eyebrow--center { margin-bottom: -0.7rem; }
.cta__title { margin: 0; max-width: none; }
.cta__sub { color: var(--stone); margin-bottom: 2.8rem; }
.light .cta__sub { color: #3A3936; }
.light .cta__contact { color: #6B6762; }
.cta__contact { margin-top: 0; font-size: 12.5px; letter-spacing: 0.06em; color: var(--stone); }

/* ---- Footer ---- */
.footer { background: var(--obsidian); color: var(--bone); padding: clamp(3.5rem, 6vw, 5rem) clamp(1.5rem, 5vw, 2.5rem) 2.2rem; border-top: 1px solid var(--hair); }
.footer__inner {
  max-width: var(--maxw); margin: 0 auto;
  display: flex; justify-content: space-between; gap: 3rem; flex-wrap: wrap;
  padding-bottom: 2.8rem; border-bottom: 1px solid var(--hair);
}
.footer__brand p { color: var(--stone); font-size: 12.5px; letter-spacing: 0.04em; margin-top: 1.4rem; line-height: 1.7; }
.footer__cols { display: flex; gap: 4.5rem; }
.footer__cols h4 { font-size: 10px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--stone); margin-bottom: 1.2rem; font-weight: 400; }
.footer__cols a { display: block; font-size: 13px; letter-spacing: 0.03em; color: rgba(239,235,228,0.8); margin-bottom: 0.7rem; transition: color 0.2s; }
.footer__cols a:hover { color: var(--bone); }
@media (max-width: 700px) { .footer__cols { justify-content: space-between; } }
.footer__base {
  max-width: var(--maxw); margin: 1.8rem auto 0;
  display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
  font-size: 11px; letter-spacing: 0.06em; color: var(--stone);
}

/* ---- Responsive ---- */
@media (max-width: 860px) {
  .nav__links { display: none; }
  .nav__actions .btn { display: none; }
  .nav__toggle { display: flex; }
  .approach { grid-template-columns: 1fr; }
  .approach__photo { max-width: 320px; }
  .service-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .nav__actions { gap: 0.4rem; }
  .nav__actions .btn--sm { padding: 0.55rem 0.85rem; letter-spacing: 0.08em; }
}
@media (max-width: 680px) {
  .work-grid, .quote-grid, .service-grid { grid-template-columns: 1fr; }
  .section__head--stack { flex-direction: column; align-items: flex-start; gap: 1.2rem; }
  .footer__inner { flex-direction: column; }
}