:root{
  --bg: #0f1110;
  --bg2: #141513;
  --paper: #f7f1e6;
  --paper2:#efe6d6;
  --ink: #141311;
  --muted: rgba(20,19,17,.72);
  --line: rgba(20,19,17,.12);
  --earth: #7a5a3a;
  --earth2:#a77b47;
  --moss:#1a3329;
  --clay:#c79a68;
  /* Drop shadows disabled sitewide — use borders / outlines only */
  --shadow: none;
  --radius: 0;
  --radius2: 0;
  --container: 1120px;
  /* Sticky header (padding + logo row) — hero height subtracts this so one screen = header + hero; safe area avoids notch clip */
  --site-header-height: calc(78px + env(safe-area-inset-top, 0px));
  /* noble-marketing-cursor-spec.md — footer */
  --color-surface: #F4F2EE;
  --color-border: #E2DED8;
  --color-text-muted: #7A7570;
  /* Universal UI text: thin sans (headings still use Arome / specials where set) */
  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-body-size: 16px;
  --font-body-weight: 300;
  /* Subheaders: Hollow Sky Bold 18pt (see @font-face "Hollow Sky") */
  --font-subhead-hollow: "Hollow Sky", "Hollowsky", ui-handwriting, cursive;
  --font-subhead-hollow-size: 18pt;
  /* Buttons — Arome (sitewide) */
  --font-button: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  --font-button-weight: 400;
  --font-button-size: clamp(14px, 1.1vw, 18px);
  /* Bump for h1 / h2 display typography (+1pt) */
  --heading-size-add: 1pt;
}

/* Arome OT ligatures: enabled only alongside all-caps presentation (typically text-transform: uppercase).
   For lowercase, sentence case, or title case, rules set font-variant-ligatures: none explicitly. */

@font-face{
  font-family: "Arome";
  src:
    url("Font/Arome.otf") format("opentype"),
    url("Font/Arome.woff2") format("woff2"),
    url("Font/Arome.woff") format("woff"),
    url("Font/Arome.ttf") format("truetype");
  font-display: swap;
  font-style: normal;
  font-weight: 400;
}

/* Hollow Sky: display accents (e.g. founder name); buttons use Arome */
@font-face{
  font-family: "Hollow Sky";
  src:
    url("Font/Hollow%20Sky%20Regular.ttf") format("truetype"),
    url("Font/Hollow%20Sky%20Regular.otf") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 400;
}
@font-face{
  font-family: "Hollow Sky";
  src:
    url("Font/Hollow%20Sky%20Regular.ttf") format("truetype"),
    url("Font/Hollow%20Sky%20Regular.otf") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 700;
}
@font-face{
  font-family: "Hollow Sky";
  src:
    url("Font/Hollow%20Sky%20Regular.ttf") format("truetype"),
    url("Font/Hollow%20Sky%20Regular.otf") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 800;
}
@font-face{
  font-family: "Hollow Sky";
  src:
    url("Font/Hollow%20Sky%20Regular.ttf") format("truetype"),
    url("Font/Hollow%20Sky%20Regular.otf") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 900;
}

*{box-sizing:border-box}
/* Photos: default smooth scaling — avoid extra CSS contrast/saturation that amplifies JPEG grain */
main img{
  image-rendering: auto;
}
html{
  scroll-behavior: smooth;
  overflow-x: clip;
  max-width: 100%;
}
@supports not (overflow-x: clip){
  html{
    overflow-x: hidden;
  }
}
body{
  margin:0;
  color: var(--ink);
  background-color: #d9cbb8;
  /* Grain; circular wordmark stamps; warm gradients */
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23a)' opacity='0.07'/%3E%3C/svg%3E"),
    url("./graphics/noble-stamp-1.svg"),
    url("./graphics/noble-stamp-2.svg"),
    url("./graphics/noble-stamp-3.svg"),
    radial-gradient(1400px 900px at 20% -10%, rgba(122,90,58,.14), transparent 55%),
    radial-gradient(900px 700px at 110% 20%, rgba(26,51,41,.1), transparent 55%),
    linear-gradient(180deg, rgba(247,241,230,.92), rgba(235,224,206,.95));
  background-size:
    120px 120px,
    clamp(280px, 34vw, 420px) auto,
    clamp(240px, 30vw, 360px) auto,
    clamp(200px, 26vw, 300px) auto,
    auto,
    auto,
    auto;
  background-position:
    0 0,
    94% 4%,
    4% 92%,
    50% 42%,
    center,
    center,
    0 0;
  background-repeat:
    repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat;
  font-family: var(--font-body);
  font-size: var(--font-body-size);
  line-height: 1.62;
  font-weight: var(--font-body-weight);
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
  max-width: 100%;
  overscroll-behavior-x: none;
}
@supports not (overflow-x: clip){
  body{
    overflow-x: hidden;
  }
}

/* Body copy: sans-serif everywhere (overrides any stray serif on paragraphs / lists) */
p,
ul,
ol,
li,
blockquote,
figcaption,
dd,
dt,
address,
.lead,
.hero-subtitle,
.service-desc,
.founder-body,
.founder-headline-lead,
.faq-panel,
.review-quote,
.review-editorial__body{
  font-family: var(--font-body);
}

p,
blockquote,
figcaption,
dd,
dt,
address,
.lead,
.hero-subtitle,
.service-desc,
.review-quote,
.review-editorial__body{
  font-size: var(--font-body-size);
}

p{font-weight: var(--font-body-weight)}
.lead{font-weight: var(--font-body-weight)}

input,
select,
textarea{
  font-family: var(--font-body);
  font-weight: var(--font-body-weight);
}

/* Buttons & button-styled controls: Arome, uppercase */
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
a.button{
  font-family: var(--font-button);
  font-weight: var(--font-button-weight);
  font-size: var(--font-button-size);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.container{
  width:min(var(--container), calc(100% - 48px));
  margin-inline:auto;
}

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

.skip-link{
  position:fixed;
  left:16px; top:12px;
  padding:10px 12px;
  z-index:9999;
  transform:translateY(-180%);
  transition:transform .2s ease;
  background:rgba(247,241,230,.96);
  border:1px solid var(--line);
  border-radius:12px;
  color:var(--ink);
  text-decoration:none;
  box-shadow: none;
}
.skip-link:focus{transform:translateY(0)}

/* Fixed back-to-top: right edge, ring = scroll progress */
.back-to-top{
  position:fixed;
  right:max(16px, env(safe-area-inset-right, 0px));
  bottom:max(20px, env(safe-area-inset-bottom, 0px) + 12px);
  z-index:950;
  pointer-events:none;
  opacity:0;
  transform:translate3d(8px, 12px, 0) scale(0.92);
  transition:
    opacity .35s cubic-bezier(.4,0,.2,1),
    transform .45s cubic-bezier(.34,1.56,.64,1);
}
body.home-nav-fixed-bottom .back-to-top{
  bottom:calc(var(--home-bottom-nav-h, 88px) + 14px + env(safe-area-inset-bottom, 0px));
}
.back-to-top.is-visible{
  pointer-events:auto;
  opacity:1;
  transform:translate3d(0, 0, 0) scale(1);
}
.back-to-top__btn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:52px;
  height:52px;
  padding:0;
  border:none;
  border-radius:50%;
  cursor:pointer;
  background:rgba(247,241,230,.94);
  color:var(--ink, #141311);
  box-shadow:0 4px 20px rgba(20,19,17,.12), 0 0 0 1px rgba(20,19,17,.08);
  transition:background .2s ease, box-shadow .2s ease, transform .2s ease;
}
.back-to-top__btn:hover{
  background:#fff;
  box-shadow:0 6px 24px rgba(20,19,17,.16), 0 0 0 1px rgba(20,19,17,.1);
  transform:translateY(-2px);
}
.back-to-top__btn:focus-visible{
  outline:2px solid var(--moss, #1a3329);
  outline-offset:3px;
}
.back-to-top__svg{
  display:block;
}
.back-to-top__track{
  stroke:rgba(20,19,17,.14);
}
.back-to-top__progress{
  stroke:var(--moss, #1a3329);
  stroke-linecap:round;
  transition:stroke-dashoffset .12s ease-out;
}
.back-to-top__arrow{
  stroke:currentColor;
}
@media (prefers-reduced-motion: reduce){
  .back-to-top{
    transition:opacity .2s ease;
    transform:none;
  }
  .back-to-top.is-visible{transform:none}
  .back-to-top__btn{transition:background .2s ease, box-shadow .2s ease}
  .back-to-top__btn:hover{transform:none}
  .back-to-top__progress{transition:none}
}

/* Phones: pin scroll-to-top to bottom-left (clears thumb zone + home bottom nav) */
@media (max-width: 760px){
  .back-to-top{
    right: auto;
    left: max(12px, env(safe-area-inset-left, 0px) + 8px);
    bottom: max(12px, env(safe-area-inset-bottom, 0px) + 8px);
    transform: translate3d(-10px, 10px, 0) scale(0.92);
  }
  .back-to-top.is-visible{
    transform: translate3d(0, 0, 0) scale(1);
  }
  body.home-nav-fixed-bottom .back-to-top{
    bottom: calc(var(--home-bottom-nav-h, 88px) + max(6px, env(safe-area-inset-bottom, 0px)));
  }
}

.site-header{
  position:fixed;
  left:0;
  right:0;
  top:0;
  z-index:1000;
  padding-top: env(safe-area-inset-top, 0px);
  box-sizing: border-box;
  border-bottom:1px solid rgba(20,19,17,.08);
  backdrop-filter: blur(12px);
  background: rgba(247,241,230,.72);
  transition: transform .35s cubic-bezier(.4,0,.2,1), background .2s ease;
}
.site-header.is-scroll-hidden{
  transform: translateY(-100%);
  pointer-events:none;
}
.site-header.is-elevated{
  background: rgba(247,241,230,.92);
  box-shadow: none;
}
body:not(.home-nav-fixed-bottom) .site-header,
body:not(.home-nav-fixed-bottom) .site-header.is-elevated{
  background: rgba(26, 51, 41, 0.96);
}
body:not(.home-nav-fixed-bottom) .nav-link{
  color: rgba(255, 255, 255, 0.88);
}
body:not(.home-nav-fixed-bottom) .nav-link:hover{
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.45);
}
body:not(.home-nav-fixed-bottom) .nav-link.is-active,
body:not(.home-nav-fixed-bottom) .nav-link[aria-current="page"]{
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.75);
}
body:not(.home-nav-fixed-bottom) .nav-dropdown:has(.nav-dropdown-link[aria-current="page"]) > .nav-link{
  border-bottom-color: rgba(255, 255, 255, 0.75);
  color: #fff;
}
body:not(.home-nav-fixed-bottom) .nav-dropdown:hover > .nav-link{
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.4);
}
body:not(.home-nav-fixed-bottom) .nav-dropdown:hover:has(.nav-dropdown-link[aria-current="page"]) > .nav-link{
  border-bottom-color: rgba(255, 255, 255, 0.75);
  color: #fff;
}
body:not(.home-nav-fixed-bottom) .header-discovery{
  color: rgba(255, 255, 255, 0.9);
}
body:not(.home-nav-fixed-bottom) .header-discovery:hover{
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.55);
}
body:not(.home-nav-fixed-bottom) .brand-mark{
  filter: brightness(0) invert(1);
  opacity: 0.95;
}
body:not(.home-nav-fixed-bottom) .nav-toggle{
  border-color: rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.08);
}
body:not(.home-nav-fixed-bottom) .nav-toggle-lines::before,
body:not(.home-nav-fixed-bottom) .nav-toggle-lines::after{
  background: rgba(255, 255, 255, 0.92);
}
body:not(.home-nav-fixed-bottom) .nav-dropdown-flyout{
  background: rgba(26, 51, 41, 0.98);
  border-color: rgba(255, 255, 255, 0.2);
}
body:not(.home-nav-fixed-bottom) .nav-dropdown-link{
  color: rgba(255, 255, 255, 0.9);
}
body:not(.home-nav-fixed-bottom) .nav-dropdown-link:hover{
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.45);
}
body:not(.home-nav-fixed-bottom) .nav-dropdown-link[aria-current="page"]{
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.75);
}
#main{
  padding-top: var(--site-header-height);
  position: relative;
  z-index: 1;
}

/* Homepage: nav bottom-aligns to hero bottom (JS sets top), then sticks to viewport top — no padding interpolation (avoids scroll jank) */
body.home-nav-fixed-bottom{
  --home-bottom-nav-h: 88px;
}
body.home-nav-fixed-bottom #main{
  padding-top: 0;
  padding-bottom: calc(var(--home-bottom-nav-h) + env(safe-area-inset-bottom, 0px));
}
/* Homepage phones: header stays at top (not bottom-docked); drop main bottom pad reserved for bottom bar */
@media (max-width: 760px){
  /* Wrapped discovery CTA row can exceed a fixed px guess — script sets --site-header-measured
     from the real header box so #main padding and .hero negative margin cancel (no paper strip). */
  body.home-nav-fixed-bottom{
    --site-header-height: var(
      --site-header-measured,
      calc(108px + env(safe-area-inset-top, 0px))
    );
  }
  body.home-nav-fixed-bottom #main{
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
}
body.home-nav-fixed-bottom.home-header-nav-top #main{
  padding-top: var(--site-header-height);
  padding-bottom: 0;
}
/* Pull hero back up so padding doesn't reflow the hero (fixes jump / "second band" when nav pins) */
body.home-nav-fixed-bottom.home-header-nav-top .hero{
  margin-top: calc(-1 * var(--site-header-height));
}
body.home-nav-fixed-bottom .site-header{
  top: 0;
  bottom: auto;
  left: 0;
  right: 0;
  border-bottom: none;
  border-top: 1px solid rgba(20, 19, 17, 0.1);
  box-shadow: none;
  /* Approximate "nav at bottom of viewport" before first JS frame (inline transform overrides after) */
  transform: translate3d(0, calc(100dvh - var(--home-bottom-nav-h)), 0);
  /* Position follows scroll via inline transform — no transition on transform (avoids lag) */
  transition: background 0.2s ease;
}
@supports not (height: 100dvh){
  body.home-nav-fixed-bottom .site-header{
    transform: translate3d(0, calc(100vh - var(--home-bottom-nav-h)), 0);
  }
}
body.home-nav-fixed-bottom .site-header.is-elevated{
  box-shadow: none;
}
body.home-nav-fixed-bottom .site-header.is-scroll-hidden{
  transform: translateY(calc(100% + 16px));
}
body.home-nav-fixed-bottom .header-inner{
  position: relative;
}
/* Homepage only (body.home-nav-fixed-bottom): Services is a single link — no sub-menu */
body.home-nav-fixed-bottom .nav-dropdown-flyout{
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
body.home-nav-fixed-bottom .site-header.home-header--pinned-top{
  border-top: none;
  border-bottom: 1px solid rgba(20, 19, 17, 0.1);
}
body.home-nav-fixed-bottom .hero-band{
  min-height: 640px;
  height: calc(100vh + clamp(48px, 8vh, 120px));
}
@supports (height: 100dvh){
  body.home-nav-fixed-bottom .hero-band{
    height: calc(100dvh + clamp(48px, 8vh, 120px));
  }
}
/* Homepage — Services band (#services) on solid white instead of .section-alt cream wash */
body.home-nav-fixed-bottom #services.section-alt{
  background: #ffffff;
}
/* Homepage — Client voices: sticky image column + three full-viewport testimonial panels */
/* No .section-alt wash/borders here — avoids tan bars above/below; panels keep their own fills */
body.home-nav-fixed-bottom .home-client-voices.section-alt{
  overflow-x: clip;
  background: #ffffff;
  border-top: none;
  border-bottom: none;
}
.home-client-voices__split{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: start;
  width: 100%;
}
.home-client-voices__sticky{
  position: sticky;
  top: 0;
  align-self: start;
  height: 100vh;
  height: 100dvh;
  min-height: 520px;
  margin: 0;
  padding: 0;
  z-index: 0;
}
body.home-nav-fixed-bottom.home-header-nav-top .home-client-voices__sticky{
  top: var(--site-header-height);
  height: calc(100vh - var(--site-header-height));
  height: calc(100dvh - var(--site-header-height));
  min-height: calc(560px - var(--site-header-height));
}
.home-client-voices__figure{
  margin: 0;
  height: 100%;
  min-height: 100%;
  overflow: hidden;
  background: rgba(20, 19, 17, 0.08);
}
.home-client-voices__figure img{
  width: 100%;
  height: 100%;
  min-height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.home-client-voices__stack{
  min-width: 0;
}
.home-client-voices__panel{
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100dvh;
  padding: clamp(40px, 6vw, 72px) clamp(28px, 4vw, 56px) clamp(48px, 8vw, 100px);
}
body.home-nav-fixed-bottom:not(.home-header-nav-top) .home-client-voices__panel{
  min-height: calc(100dvh - var(--home-bottom-nav-h));
  padding-bottom: max(
    clamp(48px, 8vw, 100px),
    calc(var(--home-bottom-nav-h) + env(safe-area-inset-bottom, 0px) + 24px)
  );
}
body.home-nav-fixed-bottom.home-header-nav-top .home-client-voices__panel{
  min-height: calc(100dvh - var(--site-header-height));
  padding-top: max(clamp(40px, 6vw, 72px), calc(env(safe-area-inset-top, 0px) + 8px));
}
.home-client-voices__panel-inner{
  width: 100%;
  max-width: 40rem;
}
.home-client-voices__panel--cream{
  background: #faf8f4;
}
.home-client-voices__panel--tan{
  background: #e9dfd2;
}
.home-client-voices__quote{
  margin: 0 0 clamp(18px, 2.5vw, 28px);
  padding: 0;
  border: none;
}
.home-client-voices__quote p{
  margin: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(1.45rem, 2.6vw, 2.2rem);
  font-weight: 400;
  font-style: normal;
  font-variant-ligatures: none;
  font-feature-settings: normal;
  line-height: 1.2;
  letter-spacing: 0.02em;
  text-transform: none;
  color: #141311;
}
.home-client-voices__body{
  margin: 0;
  font-family: var(--font-body);
  font-size: clamp(14px, 1.15vw, 17px);
  font-weight: var(--font-body-weight);
  line-height: 1.66;
  color: rgba(20, 19, 17, 0.78);
  max-width: 52ch;
}
.home-client-voices__attr{
  margin: clamp(22px, 3vw, 32px) 0 0;
  font-family: var(--font-body);
  font-size: clamp(13px, 1.05vw, 15px);
  font-style: italic;
  font-weight: 500;
  color: rgba(20, 19, 17, 0.52);
}
/* Narrow viewports: photo first (full width), then quotes — flex column so sticky photo works while panels scroll */
@media (max-width: 900px){
  .home-client-voices__split{
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: clamp(14px, 3vw, 24px);
    width: 100%;
  }
  .home-client-voices__sticky{
    position: sticky;
    top: 0;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
    height: min(44vh, 420px);
    max-height: min(520px, 52vh);
    min-height: min(220px, 36vh);
  }
  body.home-nav-fixed-bottom:not(.home-header-nav-top) .home-client-voices__sticky{
    top: 0;
    height: min(42vh, 400px);
    max-height: min(480px, 48vh);
    min-height: 200px;
  }
  body.home-nav-fixed-bottom.home-header-nav-top .home-client-voices__sticky{
    top: var(--site-header-height);
    height: min(40vh, 380px);
    max-height: min(440px, 46vh);
    min-height: 200px;
  }
  .home-client-voices__stack{
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
  }
  .home-client-voices__panel{
    min-height: 100vh;
    min-height: 100dvh;
    padding: clamp(32px, 8vw, 56px) clamp(14px, 3.5vw, 24px) clamp(40px, 8vw, 72px);
  }
  body.home-nav-fixed-bottom:not(.home-header-nav-top) .home-client-voices__panel{
    min-height: calc(100vh - var(--home-bottom-nav-h));
    min-height: calc(100dvh - var(--home-bottom-nav-h));
    padding-bottom: max(
      clamp(40px, 8vw, 72px),
      calc(var(--home-bottom-nav-h) + env(safe-area-inset-bottom, 0px) + 20px)
    );
  }
  body.home-nav-fixed-bottom.home-header-nav-top .home-client-voices__panel{
    min-height: calc(100vh - var(--site-header-height));
    min-height: calc(100dvh - var(--site-header-height));
    padding-top: max(clamp(32px, 8vw, 56px), calc(env(safe-area-inset-top, 0px) + 6px));
  }
  .home-client-voices__quote p{
    font-size: clamp(1.05rem, 4.6vw, 1.55rem);
  }
}

/* Homepage — Who we are: editorial split (copy left, dual images right) */
.home-who-we-are-split{
  background: #fff;
  border-top: 1px solid rgba(20, 19, 17, 0.06);
  border-bottom: 1px solid rgba(20, 19, 17, 0.06);
}
.home-who-we-are-split__grid{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 0.95fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: center;
  padding-block: clamp(8px, 1.5vw, 12px);
}
.home-who-we-are-split__copy{
  text-align: left;
  max-width: 42ch;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.home-who-we-are-split__title{
  margin: 0 0 clamp(14px, 2vw, 22px);
  max-width: min(36rem, 100%);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.85rem, 3.6vw, 2.75rem) + var(--heading-size-add));
  font-weight: 400;
  line-height: 1.12;
  letter-spacing: 0.02em;
  text-transform: none;
  text-wrap: balance;
  color: #1e1c1a;
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.home-who-we-are-split__lead{
  margin: 0;
  font-family: var(--font-body);
  font-size: clamp(14px, 1.15vw, 17px);
  font-weight: var(--font-body-weight);
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.62);
}
.home-who-we-are-split__link.button.primary{
  margin-top: clamp(22px, 3.2vw, 36px);
  align-self: flex-start;
}
.home-who-we-are-split__gallery{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(10px, 1.4vw, 16px);
  align-items: stretch;
  width: 100%;
  min-height: min(52vh, 520px);
}
.home-who-we-are-split__figure{
  margin: 0;
  min-width: 0;
  height: 100%;
  min-height: min(48vh, 480px);
  overflow: hidden;
  background: rgba(20, 19, 17, 0.06);
}
.home-who-we-are-split__figure img{
  width: 100%;
  height: 100%;
  min-height: min(48vh, 480px);
  object-fit: cover;
  object-position: center;
  display: block;
}
.home-who-we-are-split__figure--portrait img{
  filter: grayscale(1) contrast(1.04);
}
@media (max-width: 900px){
  .home-who-we-are-split__grid{
    grid-template-columns: 1fr;
    gap: clamp(24px, 5vw, 40px);
  }
  .home-who-we-are-split__copy{
    max-width: none;
    order: 1;
  }
  .home-who-we-are-split__gallery{
    order: 2;
    min-height: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(8px, 2.2vw, 14px);
  }
  .home-who-we-are-split__figure{
    min-height: min(34vh, 320px);
  }
  .home-who-we-are-split__figure img{
    min-height: min(34vh, 320px);
  }
}

/* Homepage — recent projects bento (links to case studies + portfolio index) */
.home-recent-projects{
  padding-block: clamp(56px, 8vw, 92px);
  background: linear-gradient(168deg, #1a3329 0%, var(--moss) 46%, #1a3329 100%);
  border-top: 1px solid rgba(247, 241, 230, 0.09);
  border-bottom: 1px solid rgba(247, 241, 230, 0.09);
  color: rgba(247, 241, 230, 0.92);
}
.home-recent-projects .container{
  max-width: min(var(--container), 1120px);
}
.home-recent-projects__header{
  margin-bottom: clamp(28px, 4vw, 44px);
}
.home-recent-projects__header-row{
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: clamp(16px, 3vw, 28px);
}
.home-recent-projects__eyebrow{
  margin: 0 0 0.35em;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(247, 241, 230, 0.55);
}
.home-recent-projects__title{
  margin: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.65rem, 3vw, 2.35rem) + var(--heading-size-add));
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: 0.02em;
  color: #f7f1e6;
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.home-recent-projects__lead{
  margin: clamp(14px, 2vw, 22px) 0 0;
  max-width: 52ch;
  font-family: var(--font-body);
  font-size: clamp(14px, 1.12vw, 17px);
  font-weight: var(--font-body-weight);
  line-height: 1.65;
  color: rgba(247, 241, 230, 0.72);
}
.home-recent-projects__portfolio-link{
  position: relative;
  z-index: 2;
  flex-shrink: 0;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #f7f1e6;
  text-decoration: none;
  border-bottom: 1px solid rgba(247, 241, 230, 0.45);
  padding-bottom: 3px;
  transition: opacity 0.2s ease, border-color 0.2s ease;
}
.home-recent-projects__portfolio-link:hover{
  opacity: 0.85;
  border-bottom-color: rgba(247, 241, 230, 0.85);
}
.home-recent-projects__portfolio-link:focus-visible{
  outline: 2px solid rgba(247, 241, 230, 0.9);
  outline-offset: 4px;
}
.home-recent-projects__grid{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(10px, 1.2vw, 14px);
}
.home-recent-projects__cell{
  grid-column: span 4;
  margin: 0;
  min-height: 0;
}
.home-recent-projects__cell--large{
  grid-column: span 7;
  grid-row: span 1;
}
.home-recent-projects__cell--top{
  grid-column: span 5;
}
.home-recent-projects__card{
  position: relative;
  display: block;
  height: 100%;
  min-height: min(32vw, 280px);
  overflow: hidden;
  text-decoration: none;
  color: #f7f1e6;
  border: 1px solid rgba(247, 241, 230, 0.16);
  background: rgba(0, 0, 0, 0.18);
  transition: border-color 0.22s ease, transform 0.22s ease;
}
.home-recent-projects__cell--large .home-recent-projects__card{
  min-height: min(34vw, 320px);
}
.home-recent-projects__card:hover{
  border-color: rgba(247, 241, 230, 0.42);
  transform: translateY(-3px);
}
.home-recent-projects__card:focus-visible{
  outline: 2px solid rgba(247, 241, 230, 0.95);
  outline-offset: 3px;
}
.home-recent-projects__media{
  display: block;
  position: absolute;
  inset: 0;
}
.home-recent-projects__media img:not(.portfolio-mag-card__logo-overlay){
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.35s ease, opacity 0.35s ease;
}
.home-recent-projects__media--brookstone img{
  object-position: center 34%;
}
.home-recent-projects__media--blaze-yoga img{
  object-position: center 38%;
}
.home-recent-projects__media--lakewood-reserve img{
  object-position: center 46%;
}
.home-recent-projects__media--pennwood img{
  object-position: center 42%;
}
.home-recent-projects__card:hover .home-recent-projects__media img:not(.portfolio-mag-card__logo-overlay){
  transform: scale(1.04);
}
.home-recent-projects__caption{
  position: absolute;
  inset: auto 0 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: clamp(12px, 2vw, 18px) clamp(14px, 2vw, 20px);
  background: linear-gradient(180deg, transparent, rgba(15, 17, 16, 0.82));
  font-family: var(--font-body);
  font-size: clamp(12px, 1vw, 13px);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.home-recent-projects__arrow{
  flex-shrink: 0;
  opacity: 0.85;
  transition: transform 0.22s ease;
}
.home-recent-projects__card:hover .home-recent-projects__arrow{
  transform: translateX(4px);
}
@media (max-width: 960px){
  .home-recent-projects__grid{
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .home-recent-projects__cell--large{
    grid-column: span 6;
  }
  .home-recent-projects__cell--top{
    grid-column: span 6;
  }
  .home-recent-projects__cell:not(.home-recent-projects__cell--large):not(.home-recent-projects__cell--top){
    grid-column: span 3;
  }
  /* Same thumbnail height for every card (large / top / small share one min-height) */
  .home-recent-projects__card,
  .home-recent-projects__cell--large .home-recent-projects__card{
    min-height: min(36vw, 260px);
  }
}
@media (max-width: 560px){
  .home-recent-projects__header-row{
    flex-direction: column;
    align-items: flex-start;
  }
  .home-recent-projects__grid{
    grid-template-columns: 1fr;
  }
  .home-recent-projects__cell,
  .home-recent-projects__cell--large,
  .home-recent-projects__cell--top{
    grid-column: 1 / -1;
  }
  /* Single column: identical thumbnail dimensions (override large-cell min-height) */
  .home-recent-projects__card,
  .home-recent-projects__cell--large .home-recent-projects__card{
    min-height: 0;
    aspect-ratio: 16 / 10;
  }
}

.header-inner{
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  align-items:center;
  gap:18px;
  padding:14px 0;
}
.brand{
  grid-column: 1;
  justify-self: start;
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  color:inherit;
  min-width: 0;
}
.brand-mark{width:42px;height:42px;object-fit:contain}
/* Noble Icon.png is light marks on transparent; homepage header stays cream — read as ink */
body.home-nav-fixed-bottom .brand-mark{
  filter: brightness(0);
  opacity: 0.9;
}
.portfolio-page--magazine .brand-mark{
  filter: brightness(0) invert(1);
}
.brand-wordmark{height:30px; width:auto; object-fit:contain}

.site-nav{
  grid-column: 2;
  justify-self: center;
  display:flex;
  align-items:center;
  gap:18px;
}
.header-end{
  grid-column: 3;
  justify-self: end;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
}
.header-discovery{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(16px, 1.45vw, 20px);
  font-weight: 400;
  font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
  font-feature-settings: "liga" 1, "clig" 1, "calt" 1, "dlig" 1;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink);
  text-decoration: none;
  white-space: nowrap;
  line-height: 1.2;
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 4px 2px 6px;
  border-bottom: 2px solid transparent;
  transition: color .18s ease, border-color .18s ease;
}
.header-discovery:hover{
  color: var(--moss);
  border-bottom-color: rgba(26, 51, 41, 0.45);
}
.header-discovery__label--mobile{
  display: none;
}
.header-discovery__label--desktop{
  display: inline;
}
.nav-link{
  font-family: var(--font-body);
  text-transform: uppercase;
  font-size: clamp(14px, 1.15vw, 17px);
  font-weight: 500;
  letter-spacing: .09em;
  text-decoration: none;
  color:rgba(20,19,17,.78);
  padding: 10px 6px 8px;
  border-radius: 0;
  border-bottom: 2px solid transparent;
  background: none;
  transition: color .2s ease, border-color .2s ease;
}
.nav-link:hover{
  color:rgba(20,19,17,.92);
  border-bottom-color: rgba(122,90,58,.5);
}
.nav-link.is-active,
.nav-link[aria-current="page"]{
  color: rgba(20,19,17,.95);
  border-bottom-color: var(--moss);
}
.nav-dropdown:has(.nav-dropdown-link[aria-current="page"]) > .nav-link{
  border-bottom-color: var(--moss);
  color: rgba(20,19,17,.95);
}
.nav-cta{
  background: none;
  border: none;
}
.nav-cta:hover{
  background: none;
}

.nav-dropdown{
  position: relative;
  display: flex;
  align-items: center;
}
.nav-dropdown:hover > .nav-link{
  color: rgba(20,19,17,.92);
  border-bottom-color: rgba(122,90,58,.5);
}
.nav-dropdown:hover:has(.nav-dropdown-link[aria-current="page"]) > .nav-link{
  border-bottom-color: var(--moss);
  color: rgba(20,19,17,.95);
}
.nav-dropdown-flyout{
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  min-width: 240px;
  padding: 8px 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  background: rgba(247, 241, 230, 0.98);
  border: 1px solid rgba(20, 19, 17, 0.12);
  border-radius: 14px;
  box-shadow: none;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.2s ease, visibility 0.2s ease;
  z-index: 1002;
}
.nav-dropdown:hover .nav-dropdown-flyout,
.nav-dropdown:focus-within .nav-dropdown-flyout{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.nav-dropdown-link{
  font-family: var(--font-body);
  text-transform: uppercase;
  font-size: clamp(12px, 1.05vw, 14px);
  letter-spacing: 0.1em;
  padding: 10px 12px 8px;
  color: rgba(20, 19, 17, 0.82);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  transition: color 0.2s ease, border-color 0.2s ease;
  white-space: nowrap;
}
.nav-dropdown-link:hover{
  background: none;
  color: rgba(20, 19, 17, 0.95);
  border-bottom-color: rgba(122, 90, 58, 0.45);
}
.nav-dropdown-link[aria-current="page"]{
  color: var(--moss);
  font-weight: 600;
  border-bottom-color: var(--moss);
}

.nav-toggle{
  display:none;
  flex: 0 0 auto;
  appearance:none;
  border:1px solid rgba(20,19,17,.12);
  background: rgba(247,241,230,.9);
  padding:10px 12px;
  border-radius:0;
  cursor:pointer;
}
.nav-toggle-lines{
  display:block;
  width:22px;height:14px;
  position:relative;
}
.nav-toggle-lines::before,
.nav-toggle-lines::after,
.nav-toggle-lines{
  background:transparent;
}
.nav-toggle-lines::before,
.nav-toggle-lines::after{
  content:"";
  position:absolute;
  left:0; right:0;
  height:2px;
  background: rgba(20,19,17,.8);
  border-radius:2px;
  transition: transform .2s ease, top .2s ease, opacity .2s ease;
}
.nav-toggle-lines::before{top:1px}
.nav-toggle-lines::after{top:11px}
.nav-toggle[aria-expanded="true"] .nav-toggle-lines::before{top:6px; transform:rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle-lines::after{top:6px; transform:rotate(-45deg)}

.hero{
  position:relative;
  padding: 0;
  overflow: visible;
}
.hero-band{
  position:relative;
  /* Taller than one viewport band so the hero feels more spacious */
  height: calc(100vh - var(--site-header-height) + clamp(72px, 12vh, 200px));
  min-height: 640px;
  border-radius: 0;
  overflow: visible;
  border:0;
  box-shadow: none;
  background: rgba(15,17,16,.06);
}
@supports (height: 100dvh){
  .hero-band{
    height: calc(100dvh - var(--site-header-height) + clamp(72px, 12vh, 200px));
  }
}
.hero-media{
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 100%;
  overflow: hidden;
  background-image: var(--hero-img);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.hero-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(15,17,16,.68), rgba(15,17,16,.12) 62%, rgba(15,17,16,0)),
    linear-gradient(180deg, rgba(15,17,16,.16), rgba(15,17,16,.44));
  pointer-events:none;
}
/* Homepage hero — wordmark above headline in card (white from dark PNG on photo) */
body.home-nav-fixed-bottom .hero-card .hero-home-wordmark{
  display: inline-block;
  line-height: 0;
  text-decoration: none;
  margin: 0 0 clamp(10px, 1.8vw, 20px);
}
body.home-nav-fixed-bottom .hero-card .hero-home-wordmark:focus-visible{
  outline: 2px solid rgba(255, 255, 255, 0.85);
  outline-offset: 6px;
}
body.home-nav-fixed-bottom .hero-card .hero-home-wordmark img{
  display: block;
  width: min(210px, 62vw);
  height: auto;
  max-height: clamp(38px, 7vh, 68px);
  object-fit: contain;
  object-position: left center;
  filter: brightness(0) invert(1) drop-shadow(0 2px 14px rgba(0, 0, 0, 0.35));
  opacity: 0.96;
}
.hero-inner{
  position:absolute;
  inset:0;
  z-index: 2;
  display:flex;
  align-items:center;
  padding-block: clamp(20px, 5vh, 56px);
}
body.home-nav-fixed-bottom .hero-inner{
  z-index: 3;
}
.hero-card{
  width: min(720px, 92%);
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
  box-shadow: none;
  color: #fff;
}
.hero-brand-block{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 6px;
}
.hero-notagline{
  width: min(200px, 70%);
  max-height: 64px;
  height: auto;
  object-fit: contain;
  display: block;
  margin-left: clamp(-28px, -3.5vw, -8px);
  align-self: flex-start;
}
.hero-card .eyebrow{
  color: rgba(255,255,255,.88);
  text-transform: uppercase;
  letter-spacing: .12em;
}
.hero-card .hero-title{
  color: #fff;
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.hero-card .hero-subtitle{
  color: rgba(255,255,255,.9);
  text-transform: none;
}
body.home-nav-fixed-bottom .hero-card .hero-subtitle{
  margin-top: clamp(4px, 1vw, 10px);
  margin-bottom: 0;
  max-width: none;
  white-space: nowrap;
  font-size: clamp(10px, 3.1vw, 22px);
  line-height: 1.45;
  letter-spacing: 0.01em;
}
.hero-card .dot{color: rgba(255,255,255,.92)}
.eyebrow{
  margin:0 0 10px;
  color: rgba(20,19,17,.72);
  font-family: var(--font-body);
  font-style: italic;
  font-weight: var(--font-body-weight);
  letter-spacing: .06em;
  text-transform: none;
  font-size: 12px;
}

/* Headings (primary): Arome — h1 & h2 only */
h1,
h2{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
  font-feature-settings: "liga" 1, "clig" 1, "calt" 1, "dlig" 1;
  text-transform: uppercase;
  font-weight: 400;
}
/* Arome ships as normal weight only — no italic master; avoid browser-synthesized slant */
h1 em,
h2 em{
  font-style: normal;
}

/* Subheaders: sans italic by default (h3-h6); package-style titles use Hollow Sky below */
h3,
h4,
h5,
h6{
  font-family: var(--font-body);
  font-style: italic;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0.02em;
  font-variant-ligatures: normal;
  font-feature-settings: normal;
}

h3.package-title,
h3.branding-showcase-title{
  font-family: var(--font-subhead-hollow);
  font-style: normal;
  font-weight: 900;
  font-size: var(--font-subhead-hollow-size);
  letter-spacing: 0.03em;
  line-height: 1.28;
  text-transform: none;
}

.section-title,
.service-title{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
  font-feature-settings: "liga" 1, "clig" 1, "calt" 1, "dlig" 1;
  text-transform: uppercase;
  font-weight: 400;
}
.acc-title{
  font-family: inherit;
  font-style: inherit;
  font-feature-settings: inherit;
}
.hero-title{
  margin:0 0 12px;
  font-size: calc(clamp(28px, 3.9vw, 48px) + var(--heading-size-add));
  line-height: 1.12;
  letter-spacing: -0.015em;
  font-weight: 400;
  text-transform: none;
}
.hero-title .hero-title-lock{
  white-space: nowrap;
}
.dot{color: var(--earth2)}
.hero-subtitle{
  margin: 0 0 22px;
  max-width: 62ch;
  color: rgba(20,19,17,.72);
  font-size: 18px;
}

.hero-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin: 0 0 28px;
}

.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 14px 18px;
  border-radius: 0;
  border: 1px solid rgba(20,19,17,.14);
  text-decoration:none;
  font-family: var(--font-button);
  font-weight: var(--font-button-weight);
  font-size: var(--font-button-size);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink);
  background: rgba(247,241,230,.75);
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
  cursor:pointer;
}
.button:hover{transform: translateY(-1px); background: rgba(247,241,230,.92)}
.button.primary{
  background: linear-gradient(180deg, rgba(26,51,41,.96), rgba(26,51,41,.86));
  color: rgba(247,241,230,.98);
  border-color: rgba(26,51,41,.28);
}
.button.primary:hover{background: linear-gradient(180deg, rgba(26,51,41,1), rgba(26,51,41,.9))}
.button.ghost{
  background: rgba(122,90,58,.10);
  border-color: rgba(122,90,58,.20);
}
/* Hero CTAs: solid fills on image */
.hero-card .button{
  padding: 12px 22px;
  border-radius: 0;
  margin-right: 0;
  backdrop-filter: none;
}
.hero-card .button:hover{
  transform: translateY(-1px);
  text-decoration: none;
}
.hero-card .button.primary{
  color: #f7f1e6;
  background: var(--moss);
  border: 1px solid rgba(15, 17, 16, 0.35);
}
.hero-card .button.primary:hover{
  color: #fff;
  background: #1a3329;
  border-color: rgba(15, 17, 16, 0.45);
}
.hero-card .button.ghost{
  color: var(--ink);
  background: var(--paper);
  border: 1px solid rgba(20, 19, 17, 0.2);
}
.hero-card .button.ghost:hover{
  color: var(--ink);
  background: var(--paper2);
  border-color: rgba(20, 19, 17, 0.28);
}

/* Bracketed highlights — first block flush with container/tagline left; second stays bottom-right */
.hero-side-stats{
  position: absolute;
  z-index: 3;
  inset: 0;
  right: auto;
  width: 100%;
  pointer-events: none;
}
.hero-side-stat{
  margin: 0;
  flex-shrink: 0;
  max-width: min(220px, 40vw);
  color: #fff;
  transform: rotate(90deg);
  text-shadow: none;
}
/* Same horizontal start as .container / .hero-subtitle */
.hero-side-stat:first-child{
  position: absolute;
  left: calc((100% - min(var(--container), calc(100% - 48px))) / 2 - clamp(72px, 12vw, 152px));
  /* Intentional Process: sit lower so rotated copy is not clipped at the top */
  top: clamp(196px, 31vh, 328px);
  right: auto;
  transform: rotate(270deg);
  transform-origin: left center;
}
.hero-side-stat:first-child .hero-side-stat-line{
  text-align: right;
  justify-content: flex-end;
}
.hero-side-stat:first-child .hero-side-stat-stack{
  align-items: flex-end;
}
.hero-side-stat:last-child{
  position: absolute;
  /* Inset farther from the right edge so the rotated stack sits slightly left on desktop */
  right: clamp(28px, 4.2vw, 72px);
  /* Crafted Visuals: higher on the band so copy clears the bottom (incl. bottom nav overlap) */
  bottom: clamp(112px, 22vh, 220px);
  transform-origin: right center;
}
.hero-side-stat-line{
  display: flex;
  flex-direction: row;
  align-items: stretch;
  justify-content: flex-end;
  gap: 0.35em;
  margin: 0;
  text-align: right;
  font-family: var(--font-body);
  font-style: normal;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.82);
}
.hero-side-bracket{
  font-style: normal;
  opacity: 0.72;
  font-size: 1em;
  line-height: 1.2;
  flex-shrink: 0;
}
.hero-side-stat-stack{
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  min-width: 0;
}
.hero-side-stat-kicker{
  display: block;
  font-family: var(--font-body);
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: none;
  font-weight: 400;
  font-style: italic;
  color: rgba(255, 255, 255, 0.94);
}
.hero-side-stat-value{
  display: block;
  font-family: inherit;
  font-size: 12px;
  line-height: 1.32;
  font-weight: 400;
  font-style: normal;
  color: rgba(255, 255, 255, 0.9);
}

.stat{
  padding: 14px 14px;
  border-radius: 18px;
  border:1px solid rgba(20,19,17,.10);
  background: rgba(247,241,230,.65);
}
.stat-kicker{
  display:block;
  font-family: var(--font-body);
  font-style: italic;
  font-weight: var(--font-body-weight);
  letter-spacing: .04em;
  text-transform: none;
  font-size: 12px;
  color: rgba(20,19,17,.72);
}
.stat-value{
  display:block;
  font-weight: var(--font-body-weight);
  margin-top: 6px;
  color: rgba(20,19,17,.92);
}

/* Three-column intro — below hero */
.noble-intro-band{
  padding: clamp(40px, 6vw, 72px) 0;
  background: var(--moss);
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.noble-intro-grid{
  display: grid;
  grid-template-columns: minmax(0, auto) minmax(0, 1fr) minmax(0, auto);
  gap: clamp(20px, 4vw, 48px);
  align-items: center;
}
.noble-intro-side{
  margin: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(12px, 1.1vw, 14px);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.96);
  line-height: 1.2;
  white-space: nowrap;
}
.noble-intro-body{
  min-width: 0;
}
.noble-intro-bio{
  margin: 0 auto;
  max-width: 56ch;
  text-align: center;
  font-family: var(--font-body);
  font-size: var(--font-body-size);
  font-weight: var(--font-body-weight);
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.92);
}
@media (max-width: 760px){
  .noble-intro-grid{
    grid-template-columns: 1fr;
    gap: 16px;
    text-align: center;
  }
  .noble-intro-side{
    white-space: normal;
  }
  .noble-intro-side--left{ order: 1; }
  .noble-intro-body{ order: 2; }
  .noble-intro-side--right{ order: 3; }
  .noble-intro-bio{
    font-size: calc(var(--font-body-size) * 0.9375);
  }
}

.home-meta-inner{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: var(--font-body-weight);
  letter-spacing: .02em;
  color: rgba(20,19,17,.62);
}
.cta-copy .cta-meta.home-meta-inner{
  margin: clamp(12px, 2vw, 20px) 0 4px;
  width: 100%;
  max-width: min(52ch, 100%);
}
.cta-studio-line{
  margin: 0 0 clamp(10px, 1.8vw, 18px);
  max-width: min(52ch, 100%);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: var(--font-body-weight);
  letter-spacing: 0.02em;
  line-height: 1.35;
  color: rgba(20, 19, 17, 0.62);
}
.home-meta-note{font-style: italic;}
.home-meta-email{
  color: rgba(20,19,17,.62);
  text-decoration: none;
  font-style: italic;
}
.home-meta-email:hover{
  color: rgba(20,19,17,.88);
  text-decoration: underline;
}

/* Founder / About — editorial split (image ~40%, overlap headline, two-column body) */
.section-founder{
  padding: clamp(56px, 7vw, 96px) clamp(24px, 4vw, 56px) clamp(64px, 8vw, 100px);
  background: #fdf9f3;
}
.founder-grid{
  display: grid;
  grid-template-columns: minmax(0, 40%) minmax(0, 1fr);
  gap: 0;
  align-items: stretch;
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  min-height: min(720px, 88vh);
}
.founder-visual{
  grid-column: 1;
  grid-row: 1;
  position: relative;
  align-self: stretch;
  min-height: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: rgba(20, 19, 17, 0.06);
}
.founder-visual img{
  display: block;
  width: 100%;
  height: 100%;
  min-height: 420px;
  object-fit: cover;
  object-position: center;
}
.founder-copy{
  grid-column: 2;
  grid-row: 1;
  align-self: start;
  min-width: 0;
  padding: clamp(28px, 4vw, 56px) 0 clamp(28px, 4vw, 56px) clamp(28px, 5vw, 72px);
  box-sizing: border-box;
}
.founder-headline{
  margin: 0 0 clamp(20px, 3vw, 32px);
  margin-left: 0;
  position: relative;
  z-index: auto;
  max-width: none;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-variant-ligatures: common-ligatures contextual;
  font-weight: 400;
  font-style: normal;
  font-size: calc(clamp(26px, 3.6vw, 40px) + var(--heading-size-add));
  line-height: 1.08;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #1a3329;
  text-align: left;
}
.founder-headline-line{
  display: block;
  font-style: normal;
  font-weight: 400;
  text-align: left;
  padding-left: 0;
  margin-left: 0;
}
.founder-headline-line + .founder-headline-line{
  margin-top: 0.12em;
}
.founder-lead{
  margin: 0 0 clamp(22px, 3.5vw, 36px);
  max-width: 58ch;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(17px, 1.35vw, 20px);
  font-style: normal;
  font-weight: 400;
  line-height: 1.6;
  font-variant-ligatures: none;
  font-feature-settings: "liga" 0, "clig" 0, "calt" 0;
  color: rgba(20, 19, 17, 0.78);
}
.founder-columns{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(20px, 3vw, 40px);
  max-width: 100%;
}
.founder-body-col{
  margin: 0;
  font-family: var(--font-body);
  font-size: clamp(14px, 1.05vw, 16px);
  font-weight: var(--font-body-weight);
  line-height: 1.7;
  color: rgba(20, 19, 17, 0.82);
}
.founder-footer{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 20px 32px;
  margin-top: clamp(32px, 5vw, 48px);
  padding-top: clamp(8px, 1.5vw, 16px);
}
.founder-more-link{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(14px, 1.45vw, 18px);
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none;
  color: #1a3329;
  border-bottom: 1px solid transparent;
  transition: color 0.2s ease, border-color 0.2s ease;
}
.founder-more-link:hover{
  color: #1a3329;
  border-bottom-color: currentColor;
}
.founder-signature{
  font-family: "Hollow Sky", "Hollowsky", "Brush Script MT", cursive;
  font-size: clamp(32px, 4.5vw, 48px);
  font-weight: 400;
  line-height: 1;
  color: #1a3329;
  letter-spacing: 0.02em;
}
.founder-em{
  font-style: italic;
  font-weight: 400;
}
.founder-name-hollow-sky{
  font-family: "Hollow Sky", "Hollowsky", ui-handwriting, cursive;
  font-style: normal;
  font-weight: var(--font-button-weight);
  text-transform: none;
  letter-spacing: 0.03em;
  color: var(--ink);
  text-shadow: none;
}
.button-editorial{
  border-radius: 0;
  padding: 16px 34px;
  background: #141311;
  color: rgba(250,248,244,.98);
  border: 1px solid #141311;
  letter-spacing: 0.06em;
  font-weight: var(--font-button-weight);
  font-size: clamp(14px, 1.05vw, 16px);
}
.button-editorial:hover{
  background: #2a2826;
  border-color: #2a2826;
  color: rgba(250,248,244,1);
}
@media (max-width: 900px){
  .founder-grid{
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .founder-visual{
    grid-column: 1;
    grid-row: 1;
    min-height: 320px;
    max-height: min(52vh, 480px);
  }
  .founder-visual img{
    min-height: 0;
    height: 100%;
  }
  .founder-copy{
    grid-column: 1;
    grid-row: 2;
    padding: clamp(28px, 5vw, 44px) 0 0;
  }
  .founder-headline{
    margin-left: 0;
  }
  .founder-columns{
    grid-template-columns: 1fr;
  }
}

/* About page — hero (cream band: title + full bio) */
.page-about main > .about-hero-split:first-child{
  margin-top: 0;
}
.about-hero-split{
  background: #faf9f7;
  border-bottom: 1px solid rgba(20, 19, 17, 0.06);
}
.about-hero-split__split{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  min-height: 0;
  max-width: none;
}
.about-hero-split__copy{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: clamp(18px, 2.8vw, 28px);
  min-width: 0;
  box-sizing: border-box;
  padding-top: clamp(48px, 8vw, 100px);
  padding-bottom: clamp(48px, 8vw, 100px);
  /* Match main container horizontal inset on both sides */
  padding-left: max(24px, env(safe-area-inset-left, 0px), calc((100vw - min(var(--container), calc(100vw - 48px))) / 2));
  padding-right: max(24px, env(safe-area-inset-right, 0px), calc((100vw - min(var(--container), calc(100vw - 48px))) / 2));
}
.about-hero-split__title{
  margin: 0;
  width: 100%;
  max-width: 100%;
  overflow-wrap: break-word;
  text-wrap: balance;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(30px, 3.8vw, 52px) + var(--heading-size-add));
  font-weight: 400;
  line-height: 1.12;
  letter-spacing: -0.02em;
  text-transform: none;
  color: #14120f;
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.about-hero-split .about-editorial__bio.about-hero-split__bio{
  margin-top: clamp(20px, 3vw, 32px);
  padding-top: 0;
  border-top: none;
  width: 100%;
  max-width: min(52ch, 100%);
  margin-left: 0;
  margin-right: 0;
  scroll-margin-top: clamp(72px, 10vw, 100px);
}
.about-hero-split .about-editorial__bio.about-hero-split__bio p{
  font-size: clamp(15px, 1.08vw, 17px);
  line-height: 1.72;
  color: rgba(20, 19, 17, 0.76);
}
.about-hero-mobile-photo{
  display: block;
  width: 100%;
  margin: clamp(10px, 2vw, 18px) 0 0;
  justify-self: stretch;
}
.about-hero-mobile-photo img{
  width: 100%;
  height: auto;
  display: block;
}
@media (min-width: 901px){
  .about-hero-split__split{
    grid-template-columns: minmax(0, 1fr) minmax(260px, 36vw);
    align-items: start;
    column-gap: clamp(20px, 4vw, 72px);
  }
  .about-hero-mobile-photo{
    margin: clamp(52px, 8vw, 96px) max(24px, env(safe-area-inset-right, 0px), calc((100vw - min(var(--container), calc(100vw - 48px))) / 2)) 0 0;
    align-self: start;
    justify-self: end;
    width: min(100%, 520px);
  }
}
@media (max-width: 900px){
  .page-about{
    overflow-x: clip;
  }
  .about-hero-split__copy{
    padding-top: clamp(40px, 7vw, 72px);
    padding-bottom: clamp(40px, 7vw, 72px);
    padding-left: max(22px, env(safe-area-inset-left, 0px), calc((100vw - min(var(--container), calc(100vw - 48px))) / 2));
    padding-right: max(22px, env(safe-area-inset-right, 0px), calc((100vw - min(var(--container), calc(100vw - 48px))) / 2));
  }
  .about-hero-split__title{
    max-width: none;
    font-size: calc(clamp(32px, 7vw, 44px) + var(--heading-size-add));
  }
  .about-hero-mobile-photo{
    width: 100%;
    max-width: none;
    margin: clamp(6px, 1.8vw, 14px) 0 0;
    padding-left: max(22px, env(safe-area-inset-left, 0px), calc((100vw - min(var(--container), calc(100vw - 48px))) / 2));
    padding-right: max(22px, env(safe-area-inset-right, 0px), calc((100vw - min(var(--container), calc(100vw - 48px))) / 2));
    box-sizing: border-box;
  }
  .about-hero-mobile-photo img{
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center top;
  }
}

/* About — How I work (qualities: intro + editorial strip with shared photo bg) */
.about-how-i-work{
  background: #fff;
  color: var(--moss);
  padding: clamp(52px, 8vw, 96px) 0 0;
  border-top: 1px solid rgba(26, 51, 41, 0.1);
}
.about-how-i-work__top{
  padding-bottom: clamp(28px, 5vw, 44px);
}
.about-how-i-work__intro{
  margin: 0;
  padding-top: clamp(4px, 0.8vw, 10px);
  max-width: min(52ch, 100%);
}
.about-how-i-work__eyebrow{
  margin: 0 0 clamp(10px, 1.5vw, 16px);
  font-family: var(--font-body);
  font-size: 11px;
  font-style: normal;
  font-weight: var(--font-body-weight);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(26, 51, 41, 0.62);
}
.about-how-i-work__title{
  margin: 0;
  max-width: 100%;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(2rem, 4.2vw, 3.1rem) + var(--heading-size-add));
  font-weight: 400;
  font-style: normal;
  font-variant-ligatures: none;
  font-feature-settings: normal;
  letter-spacing: 0.01em;
  line-height: 1.15;
  text-transform: none;
  color: var(--moss);
}
.about-how-i-work__title-line{
  display: block;
}
.about-how-i-work__title-em{
  font-style: normal;
  font-weight: 400;
}
.about-how-i-work__strip{
  margin-top: 0;
  padding: clamp(40px, 6.5vw, 88px) 0 clamp(52px, 8vw, 100px);
  background: #fff;
}
.about-how-i-work__strip-inner{
  max-width: min(var(--container), calc(100% - 48px));
  margin-inline: auto;
}
.about-how-i-work__grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(16px, 2.4vw, 24px);
  margin: 0;
  padding: 0;
  list-style: none;
}
.about-how-i-work__card{
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: clamp(12px, 1.8vw, 16px);
  margin: 0;
  padding: clamp(24px, 3.4vw, 40px) clamp(18px, 2.8vw, 32px);
  box-sizing: border-box;
  min-height: clamp(300px, 36vw, 420px);
  border-radius: 0;
  border: 1px solid rgba(26, 51, 41, 0.14);
  box-shadow: 0 12px 32px rgba(26, 51, 41, 0.1);
  background-color: #f5f4f2;
  background-image:
    linear-gradient(125deg, rgba(255, 255, 255, 0.94) 0%, rgba(255, 255, 255, 0.62) 45%, rgba(255, 255, 255, 0.32) 100%),
    url("./Photos/about-qualities-card-bg.png");
  background-size: cover, cover;
  background-repeat: no-repeat;
  background-position: center, center center;
}
.about-how-i-work__card:nth-child(1){
  background-position: center, 48% 38%;
}
.about-how-i-work__card:nth-child(2){
  background-position: center, 62% 48%;
}
.about-how-i-work__card:nth-child(3){
  background-position: center, 36% 58%;
}
.about-how-i-work__card:nth-child(4){
  background-position: center, 72% 42%;
}
.about-how-i-work__card-title{
  flex: 0 0 auto;
  margin: 0;
  width: 100%;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(0.88rem, 1.2vw, 1.05rem);
  font-weight: 400;
  font-style: normal;
  font-variant-ligatures: none;
  font-feature-settings: normal;
  letter-spacing: 0.12em;
  line-height: 1.3;
  text-transform: uppercase;
  color: var(--moss);
}
.about-how-i-work__card-body{
  flex: 1 1 auto;
  margin: 0;
  min-width: 0;
  font-family: var(--font-body);
  font-size: clamp(14px, 1.25vw, 16px);
  font-weight: 400;
  font-style: normal;
  line-height: 1.58;
  color: rgba(26, 51, 41, 0.92);
}
@media (max-width: 900px){
  .about-how-i-work__title{
    max-width: 100%;
  }
}
@media (max-width: 700px){
  .about-how-i-work__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .about-how-i-work__card{
    min-height: clamp(240px, 52vw, 360px);
  }
}
@media (prefers-reduced-motion: reduce){
  .about-how-i-work__card{
    background-image:
      linear-gradient(125deg, rgba(255, 255, 255, 0.97) 0%, rgba(255, 255, 255, 0.78) 55%, rgba(255, 255, 255, 0.55) 100%),
      url("./Photos/about-qualities-card-bg.png");
  }
}

/* About page — editorial hero pattern (Services hub studio block) */
.about-editorial{
  background: #faf9f7;
  padding: clamp(56px, 7vw, 104px) 0 clamp(64px, 9vw, 120px);
  border-bottom: 1px solid rgba(20, 19, 17, 0.06);
}
.about-editorial__inner{
  width: min(var(--container), calc(100% - 48px));
  margin-inline: auto;
}
.about-editorial__top{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: end;
}
.about-editorial__intro{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(16px, 2.2vw, 24px);
  min-width: 0;
  padding-bottom: 4px;
}
.about-editorial__title{
  margin: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(32px, 4.5vw, 58px) + var(--heading-size-add));
  font-weight: 400;
  line-height: 1.06;
  letter-spacing: -0.02em;
  color: #14120f;
  font-variant-ligatures: none;
  font-feature-settings: normal;
  text-transform: none;
}
.about-editorial__tagline{
  margin: 0;
  max-width: 36ch;
  font-family: var(--font-body);
  font-size: var(--font-body-size);
  font-weight: var(--font-body-weight);
  line-height: 1.55;
  color: rgba(20, 19, 17, 0.66);
}
.about-editorial__contact-link{
  margin-top: clamp(4px, 1.5vw, 12px);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  text-decoration: none;
  color: #14120f;
  border-bottom: 1px solid currentColor;
  padding-bottom: 4px;
  transition: opacity 0.2s ease, color 0.2s ease;
}
.about-editorial__contact-link:hover{
  opacity: 0.72;
  color: #000;
}
.about-editorial__photos{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(10px, 1.8vw, 18px);
  align-items: stretch;
}
.about-editorial__figure{
  margin: 0;
  overflow: hidden;
  background: rgba(20, 19, 17, 0.05);
  aspect-ratio: 3 / 4;
}
.about-editorial__figure img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.about-editorial__bio{
  margin-top: clamp(44px, 6.5vw, 88px);
  padding-top: clamp(36px, 5vw, 64px);
  border-top: 1px solid rgba(20, 19, 17, 0.1);
  max-width: min(920px, 100%);
  margin-left: auto;
  margin-right: auto;
  scroll-margin-top: clamp(72px, 10vw, 100px);
}
.about-editorial__bio p{
  margin: 0 0 1.35em;
  font-family: var(--font-body);
  font-size: clamp(16px, 1.12vw, 18px);
  font-weight: var(--font-body-weight);
  line-height: 1.78;
  color: rgba(20, 19, 17, 0.78);
}
.about-editorial__bio p:last-child{
  margin-bottom: 0;
}
@media (max-width: 900px){
  .about-editorial__top{
    grid-template-columns: 1fr;
    align-items: start;
    gap: clamp(32px, 5vw, 48px);
  }
  .about-editorial__photos{
    max-width: 560px;
  }
  .about-editorial__title{
    font-size: calc(clamp(38px, 6vw, 56px) + var(--heading-size-add));
    line-height: 1.05;
  }
}
@media (max-width: 520px){
  .about-editorial__photos{
    grid-template-columns: 1fr;
    max-width: none;
  }
  .about-editorial__figure{
    aspect-ratio: 4 / 5;
  }
  .about-editorial__title{
    font-size: calc(clamp(42px, 9vw, 52px) + var(--heading-size-add));
    line-height: 1.04;
    letter-spacing: -0.025em;
  }
}

/* Services hub — studio banner (same editorial pattern as About hero, duo photography) */
.page-services-hub .services-hub-studio-block.about-editorial{
  margin-top: 0;
}

/* About — Our process (how it works, four steps) */
.about-our-process{
  background: #f8f8f8;
  color: var(--moss);
  padding: clamp(52px, 8vw, 96px) 0;
  border-top: 1px solid rgba(26, 51, 41, 0.1);
}
.about-our-process__inner{
  display: flex;
  flex-direction: column;
  gap: 0;
}
.about-our-process__header{
  margin: 0;
  padding-bottom: clamp(20px, 3vw, 28px);
}
.about-our-process__eyebrow{
  margin: 0 0 clamp(10px, 1.5vw, 14px);
  font-family: var(--font-body);
  font-size: 11px;
  font-style: normal;
  font-weight: var(--font-body-weight);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(26, 51, 41, 0.62);
}
.about-our-process__title{
  margin: 0;
  max-width: 26ch;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.65rem, 3.4vw, 2.65rem) + var(--heading-size-add));
  font-weight: 400;
  font-style: normal;
  font-variant-ligatures: none;
  font-feature-settings: normal;
  letter-spacing: 0.01em;
  line-height: 1.18;
  text-transform: none;
  color: var(--moss);
}
.about-our-process__title-em{
  font-style: normal;
  font-weight: 400;
}
.about-our-process__divider{
  height: 0;
  margin: 0 0 clamp(28px, 4vw, 40px);
  border: 0;
  border-top: 1px solid rgba(26, 51, 41, 0.16);
}
.about-our-process__steps{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(20px, 3vw, 36px) clamp(16px, 2.5vw, 28px);
  margin: 0;
  padding: 0;
  list-style: none;
}
.about-our-process__step{
  margin: 0;
  padding: 0;
  min-width: 0;
}
.about-our-process__step-label{
  margin: 0 0 10px;
  font-family: var(--font-body);
  font-size: 10px;
  font-style: normal;
  font-weight: var(--font-body-weight);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(26, 51, 41, 0.55);
}
.about-our-process__step-label-inner{
  display: inline-block;
}
.about-our-process__step-title{
  margin: 0 0 clamp(12px, 1.6vw, 18px);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(1.2rem, 1.85vw, 1.5rem);
  font-weight: 600;
  font-style: normal;
  letter-spacing: 0.06em;
  line-height: 1.22;
  text-transform: uppercase;
  color: var(--moss);
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.about-our-process__step-body{
  margin: 0;
  font-family: var(--font-body);
  font-size: clamp(13px, 1.05vw, 15px);
  font-weight: var(--font-body-weight);
  font-style: normal;
  line-height: 1.55;
  color: rgba(26, 51, 41, 0.78);
}
@media (max-width: 960px){
  .about-our-process__steps{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 520px){
  .about-our-process__steps{
    grid-template-columns: 1fr;
  }
  .about-our-process__title{
    max-width: none;
  }
}
@media (max-width: 760px){
  /* HTML uses <br /> before the em dash; hide on small screens so "brand" stays with "in the right order." */
  .about-our-process__title br{
    display: none;
  }
}

/* About page — who we serve (local + regional SEO) */
.section.about-who-we-serve{
  padding: clamp(44px, 6vw, 72px) 0;
  background:
    radial-gradient(1200px 700px at 10% 0%, rgba(255, 255, 255, 0.05), transparent 58%),
    radial-gradient(900px 500px at 100% 100%, rgba(0, 0, 0, 0.22), transparent 58%),
    var(--moss);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  color: #f7f5f0;
}
.about-who-we-serve__heading{
  margin: 0 0 clamp(28px, 4vw, 48px);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.85rem, 3.4vw, 2.65rem) + var(--heading-size-add));
  font-weight: 400;
  line-height: 1.12;
  letter-spacing: 0.02em;
  text-transform: none;
  text-align: center;
  color: rgba(247, 245, 240, 0.98);
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.about-who-we-serve__body{
  min-width: 0;
}
.about-who-we-serve__region-content{
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: clamp(16px, 2.4vw, 26px);
  align-items: start;
}
.about-who-we-serve__state-markers{
  flex-shrink: 0;
}
.about-who-we-serve__state-markers img{
  display: block;
  width: auto;
  max-width: min(88px, 20vw);
  height: auto;
  object-fit: contain;
  flex-shrink: 0;
  filter: brightness(0) invert(90%) sepia(18%) saturate(260%) hue-rotate(350deg) brightness(1.02);
  transform-origin: 50% 55%;
  opacity: 0.96;
}
.about-who-we-serve__state-markers--stack{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
.about-who-we-serve__state-markers--stack img:nth-child(2){
  margin-top: -6px;
}
.about-who-we-serve__state-markers--stack img:nth-child(3){
  margin-top: -8px;
}
.about-who-we-serve__regions{
  min-width: 0;
}
.about-who-we-serve__regions--two-cols{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(48px, 10vw, 104px);
  row-gap: clamp(24px, 4vw, 44px);
  align-items: start;
  position: relative;
}
/* Vertical rule centered in the column gap (equal 1fr columns) */
.about-who-we-serve__regions--two-cols::after{
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 1px;
  transform: translateX(-50%);
  background: rgba(255, 255, 255, 0.24);
  pointer-events: none;
}
.about-who-we-serve__region + .about-who-we-serve__region{
  margin-top: clamp(22px, 3vw, 32px);
  padding-top: clamp(18px, 2.5vw, 26px);
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}
.about-who-we-serve__regions--two-cols .about-who-we-serve__region + .about-who-we-serve__region{
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}
.about-who-we-serve__subhead{
  margin: 0 0 clamp(14px, 2vw, 18px);
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.68);
}
.about-who-we-serve__region p{
  margin: 0;
  max-width: 64ch;
  font-family: var(--font-body);
  font-size: clamp(14px, 1.02vw, 16px);
  line-height: 1.66;
  color: rgba(255, 255, 255, 0.9);
}
.about-who-we-serve__region p strong{
  color: #fff;
  font-weight: 600;
}
@media (max-width: 820px){
  .about-who-we-serve__regions--two-cols{
    grid-template-columns: 1fr;
    column-gap: 0;
  }
  .about-who-we-serve__regions--two-cols::after{
    display: none;
  }
  .about-who-we-serve__regions--two-cols .about-who-we-serve__region + .about-who-we-serve__region{
    margin-top: clamp(22px, 3vw, 32px);
    padding-top: clamp(18px, 2.5vw, 26px);
    border-top: 1px solid rgba(255, 255, 255, 0.14);
  }
}
@media (max-width: 640px){
  .about-who-we-serve__region-content{
    grid-template-columns: 1fr;
  }
  .about-who-we-serve__state-markers img{
    max-width: min(88px, 26vw);
  }
  .about-who-we-serve__state-markers--stack{
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 10px;
  }
  .about-who-we-serve__state-markers--stack img:nth-child(2),
  .about-who-we-serve__state-markers--stack img:nth-child(3){
    margin-top: 0;
  }
}

/* About page — remote collaborations (editorial split: large title + copy | dual 3:4 photos) */
.section.about-remote-collab{
  border-top: 0;
  background: #faf9f7;
  /* Inner `.about-remote-collab` already sets vertical padding — avoid stacking with default `.section` */
  padding-top: 0;
  padding-bottom: 0;
}
.about-remote-collab{
  padding: clamp(56px, 7vw, 104px) 0 clamp(64px, 9vw, 120px);
  background: #faf9f7;
}
.about-remote-collab__inner{
  width: min(var(--container), calc(100% - 48px));
  margin-inline: auto;
  box-sizing: border-box;
}
.about-remote-collab__split{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: end;
  min-height: 0;
}
.about-remote-collab__copy{
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0 0 4px;
  background: transparent;
  text-align: left;
}
.about-remote-collab__copy-inner{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(14px, 2vw, 22px);
  width: 100%;
  max-width: none;
  margin: 0;
  min-width: 0;
}
.about-remote-collab__title{
  margin: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(32px, 4.5vw, 58px) + var(--heading-size-add));
  font-weight: 400;
  font-style: normal;
  line-height: 1.06;
  letter-spacing: -0.02em;
  color: #14120f;
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.about-remote-collab__title-em{
  font-style: normal;
  font-weight: 400;
}
.about-remote-collab__lead{
  margin: 0;
  max-width: 42ch;
  font-family: var(--font-body);
  font-size: var(--font-body-size);
  font-weight: var(--font-body-weight);
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.72);
}
.about-remote-collab__body{
  margin: 0;
  max-width: 48ch;
  font-family: var(--font-body);
  font-size: var(--font-body-size);
  font-weight: var(--font-body-weight);
  line-height: 1.72;
  color: rgba(20, 19, 17, 0.76);
}
.about-remote-collab__body:last-of-type{
  margin-bottom: 0;
}
.about-remote-collab__list{
  margin: 0;
  padding: 0;
  max-width: 36rem;
  list-style: none;
  text-align: left;
  font-family: var(--font-body);
  font-size: clamp(14px, 1.05vw, 16px);
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.76);
}
.about-remote-collab__list li{
  position: relative;
  margin: 0 0 0.75em;
  padding-left: 1.1em;
}
.about-remote-collab__list li::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(20, 19, 17, 0.35);
}
.about-remote-collab__list li:last-child{
  margin-bottom: 0;
}
.about-remote-collab__media{
  display: block;
  padding: 0;
  background: transparent;
  min-width: 0;
}
.about-remote-collab__photos{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(10px, 1.8vw, 18px);
  align-items: stretch;
}
.about-remote-collab__figure{
  margin: 0;
  overflow: hidden;
  background: rgba(20, 19, 17, 0.05);
  aspect-ratio: 3 / 4;
}
.about-remote-collab__figure img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
/* Legacy: single image (no .about-remote-collab__photos wrapper) */
.about-remote-collab__media > .about-remote-collab__figure:only-child{
  max-width: min(420px, 88vw);
  margin-inline: auto;
  aspect-ratio: 3 / 4;
}
@media (max-width: 900px){
  .about-remote-collab__split{
    grid-template-columns: 1fr;
    align-items: start;
    gap: clamp(32px, 5vw, 48px);
  }
  .about-remote-collab__photos{
    max-width: 560px;
    margin-inline: auto;
  }
  .about-remote-collab__title{
    font-size: calc(clamp(38px, 6vw, 56px) + var(--heading-size-add));
    line-height: 1.05;
  }
}
@media (max-width: 520px){
  /* Keep two photos side-by-side on phones (was single column) */
  .about-remote-collab__photos{
    max-width: none;
    margin-inline: 0;
    grid-template-columns: 1fr 1fr;
    gap: clamp(8px, 2.2vw, 14px);
  }
  .about-remote-collab__figure{
    aspect-ratio: 4 / 5;
  }
  .about-remote-collab__title{
    font-size: calc(clamp(42px, 9vw, 52px) + var(--heading-size-add));
    line-height: 1.04;
    letter-spacing: -0.025em;
  }
}
@media (max-width: 760px){
  .about-remote-collab{
    padding-top: clamp(28px, 6vw, 44px);
    padding-bottom: clamp(48px, 8vw, 88px);
  }
}

/* About page — industries & client types (SEO / AEO-friendly structure) */
/* Must beat later `.section` padding; keep bottom tight so the band isn’t followed by a tall cream gap */
.section.about-industries-we-serve{
  padding: clamp(40px, 5vw, 72px) 0 0;
  background: #fff;
}
.about-industries-we-serve .container{
  display: flex;
  flex-direction: column;
  align-items: center;
}
.about-industries-we-serve .section-title{
  margin-bottom: clamp(12px, 2vw, 20px);
  width: 100%;
  max-width: 42rem;
  text-align: center;
}
.about-industries-we-serve .lead{
  margin-bottom: clamp(18px, 2.5vw, 28px);
  max-width: 72ch;
  width: 100%;
  text-align: center;
}
.about-industries-marquee{
  width: 100%;
  max-width: 100%;
  position: relative;
  left: auto;
  transform: none;
  margin-top: clamp(4px, 1vw, 10px);
  margin-bottom: 0;
  padding: clamp(12px, 1.8vw, 16px) 0 clamp(14px, 2.2vw, 18px);
  background: var(--moss);
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  box-sizing: border-box;
  overflow: hidden;
  align-self: stretch;
}
.about-industries-marquee__viewport{
  overflow: hidden;
  width: 100%;
  background: var(--moss);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.about-industries-marquee__track{
  display: flex;
  width: max-content;
  flex-wrap: nowrap;
  align-items: center;
  will-change: transform;
  animation: about-industries-marquee-scroll 52s linear infinite;
  backface-visibility: hidden;
}
.about-industries-marquee__line{
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
  white-space: nowrap;
  /* Pull duplicate runs together: letter-spacing adds extra width after the last glyph of each line */
  margin-inline-end: -0.055em;
}
.about-industries-marquee__items{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(15px, 2.1vw, 22px);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.03em;
  color: rgba(255, 255, 255, 0.95);
  text-transform: lowercase;
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
@keyframes about-industries-marquee-scroll{
  from{
    transform: translate3d(0, 0, 0);
  }
  to{
    transform: translate3d(-50%, 0, 0);
  }
}
@media (prefers-reduced-motion: reduce){
  .about-industries-marquee__track{
    animation: none;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    max-width: min(52rem, 100%);
    margin: 0 auto;
    row-gap: 0.35em;
  }
  .about-industries-marquee__line[aria-hidden="true"]{
    display: none;
  }
  .about-industries-marquee__line{
    margin-inline-end: 0;
    white-space: normal;
    text-align: center;
    padding: 0 clamp(16px, 4vw, 28px);
  }
  .about-industries-marquee__viewport{
    mask-image: none;
  }
}
.about-industries-we-serve__list{
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(32px, 4.5vw, 48px) clamp(32px, 5vw, 64px);
  width: 100%;
  max-width: 960px;
  margin-inline: auto;
}
.about-industries-we-serve__list > div{
  margin: 0;
  padding: clamp(18px, 2.2vw, 24px) clamp(18px, 2.2vw, 22px);
  border: 1px solid rgba(20, 19, 17, 0.14);
  background: rgba(247, 241, 230, 0.55);
  text-align: left;
}
@media (max-width: 640px){
  .about-industries-we-serve__list{
    grid-template-columns: 1fr;
    gap: clamp(26px, 4vw, 36px);
    max-width: 720px;
  }
}
.about-industries-we-serve__list dt{
  margin: 0 0 6px;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(15px, 1.2vw, 18px);
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.88);
}
.about-industries-we-serve__list dd{
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--font-body-size);
  line-height: 1.72;
  color: rgba(20, 19, 17, 0.76);
}
.about-industries-we-serve__close{
  margin: clamp(14px, 2vw, 20px) 0 0;
  max-width: 62ch;
  font-family: var(--font-body);
  font-size: var(--font-body-size);
  line-height: 1.7;
  color: rgba(20, 19, 17, 0.78);
}
.about-industries-we-serve__close a{
  color: #14120f;
  font-weight: 500;
  text-underline-offset: 3px;
}
.about-industries-we-serve__close a:hover{
  color: var(--moss);
}

/* Homepage — stats strip (serif numbers, vertical rules, count-up) */
.home-stats-strip{
  padding: clamp(48px, 7vw, 72px) 0;
  background: #fff;
  border-top: 1px solid var(--clay);
}
.home-stats-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  align-items: stretch;
  max-width: 960px;
  margin: 0 auto;
}
.home-stats-cell{
  position: relative;
  text-align: center;
  padding: clamp(20px, 4vw, 36px) clamp(16px, 3vw, 28px);
  box-sizing: border-box;
}
.home-stats-cell:not(:last-child)::after{
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 1px;
  height: min(68%, 132px);
  background: var(--clay);
  opacity: 0.85;
}
.home-stats-figure{
  margin: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-style: normal;
  font-weight: 400;
  font-size: clamp(44px, 6.5vw, 72px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--moss);
  font-variant-numeric: tabular-nums;
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.home-stats-affix{
  font-size: 0.62em;
  letter-spacing: -0.02em;
  margin-left: 0.02em;
}
.home-stats-label{
  margin: clamp(12px, 2vw, 18px) 0 0;
  font-family: var(--font-body);
  font-size: clamp(11px, 1.05vw, 13px);
  font-weight: var(--font-body-weight);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--moss);
}
.home-stats-label--two-lines{
  letter-spacing: 0.11em;
  font-size: clamp(10px, 1vw, 12px);
}
.home-stats-label--two-lines .home-stats-label-line{
  display: block;
  line-height: 1.35;
  white-space: nowrap;
}
.home-stats-label--two-lines .home-stats-label-line + .home-stats-label-line{
  margin-top: 0.18em;
}
@media (max-width: 380px){
  .home-stats-label--two-lines .home-stats-label-line{
    white-space: normal;
  }
}
@media (max-width: 640px){
  .home-stats-grid{
    grid-template-columns: 1fr;
  }
  .home-stats-grid.home-stats-grid--4{
    grid-template-columns: 1fr;
  }
  .home-stats-cell:not(:last-child)::after{
    display: none;
  }
  .home-stats-cell{
    border-top: 1px solid var(--clay);
    padding-top: clamp(24px, 5vw, 32px);
    padding-bottom: clamp(24px, 5vw, 32px);
  }
  .home-stats-cell:first-child{
    border-top: 0;
    padding-top: 0;
  }
}

/* Work case — Blaze Yoga organic social metrics (homepage stats layout, moss field + cream type) */
/* Four columns from 641px up only — unconditional repeat(4) here was overriding the mobile 1-column rule */
.home-stats-grid.home-stats-grid--4{
  max-width: min(1120px, 100%);
}
@media (min-width: 641px){
  .home-stats-grid.home-stats-grid--4{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
/* Client / work case pages — metrics in a 2×2 grid (two per row); single column stays below 641px */
@media (min-width: 641px){
  .page-work-case .home-stats-grid.home-stats-grid--4{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .page-work-case .home-stats-grid.home-stats-grid--4 .home-stats-cell:nth-child(2n)::after{
    display: none;
  }
  .page-work-case .home-stats-grid.home-stats-grid--4 .home-stats-cell:nth-child(n+3){
    border-top: 1px solid var(--clay);
    padding-top: clamp(24px, 4vw, 40px);
  }
  .page-work-case .home-stats-strip.home-stats-strip--moss-social .home-stats-grid.home-stats-grid--4 .home-stats-cell:nth-child(n+3){
    border-top-color: rgba(247, 241, 230, 0.22);
  }
}
/* Organic social KPI strips — moss field + cream type (add .home-stats-strip--moss-social on the section) */
.home-stats-strip.home-stats-strip--moss-social{
  background: var(--moss);
  border-top: 1px solid rgba(247, 241, 230, 0.12);
}
.home-stats-strip.home-stats-strip--moss-social .home-stats-figure{
  color: #f7f1e6;
}
.home-stats-strip.home-stats-strip--moss-social .home-stats-affix{
  color: #f7f1e6;
}
.home-stats-strip.home-stats-strip--moss-social .home-stats-label{
  color: rgba(247, 241, 230, 0.92);
}
.home-stats-strip.home-stats-strip--moss-social .home-stats-label--two-lines{
  color: rgba(247, 241, 230, 0.92);
}
/* Outback Toys case — first KPI label is longer; keep sentence case as authored */
.home-stats-strip--outback-toys-case.home-stats-strip--moss-social .home-stats-cell:first-child > .home-stats-label{
  text-transform: none;
  letter-spacing: 0.04em;
  font-size: clamp(11px, 1.12vw, 13px);
  line-height: 1.38;
  max-width: min(28rem, 100%);
  margin-left: auto;
  margin-right: auto;
}
.home-stats-strip.home-stats-strip--moss-social .home-stats-cell:not(:last-child)::after{
  background: rgba(247, 241, 230, 0.38);
  opacity: 1;
}
@media (max-width: 640px){
  .home-stats-strip.home-stats-strip--moss-social .home-stats-cell{
    border-top: 1px solid rgba(247, 241, 230, 0.2);
  }
  .home-stats-strip.home-stats-strip--moss-social .home-stats-cell:first-child{
    border-top: 0;
  }
}

/* Homepage — client stamp grid on warm cream (no framed cells) */
.section-clients-stamp{
  padding: clamp(56px, 8vw, 88px) 0 clamp(64px, 9vw, 96px);
  background: #ffffff;
}
.clients-stamp-head{
  text-align: center;
  max-width: 52ch;
  margin: 0 auto clamp(36px, 5vw, 52px);
}
.clients-stamp-title{
  white-space: nowrap;
}
.clients-stamp-lead{
  margin-top: 14px;
  color: rgba(20, 19, 17, 0.68);
}
.clients-stamp-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(8px, 1.5vw, 16px);
  align-items: center;
  justify-items: center;
}
.clients-stamp-cell{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 0;
  padding: clamp(5px, 1.1vw, 11px);
}
.clients-stamp-link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  line-height: 0;
}
.clients-stamp-link:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.75);
  outline-offset: 6px;
}
.clients-stamp-cell img{
  max-width: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  /* Further reduced homepage logo cap */
  max-height: 260px;
  transition:
    transform 0.38s cubic-bezier(0.33, 1, 0.48, 1),
    filter 0.38s ease;
}
.clients-stamp-cell:hover img{
  transform: translateY(-4px) scale(1.04);
  filter: brightness(1.06);
}
.clients-stamp-cell--blaze img{
  max-height: 130px;
}
.clients-stamp-cell--hsf img{
  max-height: 130px;
}
.clients-stamp-cell--gradys img{
  max-height: 110px;
}
.clients-stamp-cell--pennwood img{
  max-height: 130px;
}
.clients-stamp-cell--vizion img{
  max-height: 110px;
}
.clients-stamp-cell--everflame img{
  max-height: 130px;
}
.clients-stamp-cell--revd img{
  max-height: 56px;
  max-width: min(220px, 100%);
}
.clients-stamp-cell--outback img{
  max-height: 72px;
  max-width: min(280px, 100%);
  filter: drop-shadow(0 1px 2px rgba(20, 19, 17, 0.08));
}
.clients-stamp-cell--da-targets img{
  max-height: 48px;
  max-width: min(240px, 100%);
}
.clients-stamp-cell--cta{
  min-height: clamp(140px, 22vw, 240px);
}
/* Homepage clients grid: fourth row is only “See more” — span full width */
body.home-nav-fixed-bottom #clients .clients-stamp-cell--cta{
  grid-column: 1 / -1;
}
/* Homepage clients grid: HSF alone on its own row after 3×3+1 logo layout */
body.home-nav-fixed-bottom #clients .clients-stamp-cell--clients-stamp-row-solo{
  grid-column: 1 / -1;
}
/* Hollow Sky + subtle curved underline draws in on hover (Selected client work only) */
.clients-see-more-link{
  position: relative;
  display: inline-block;
  font-family: "Hollow Sky", "Hollowsky", ui-handwriting, cursive;
  font-size: clamp(36px, 4.7vw, 48px);
  font-weight: var(--font-button-weight);
  letter-spacing: 0.03em;
  text-transform: none;
  color: #1a3329;
  text-decoration: none;
  padding-bottom: 4px;
  transition: color 0.25s ease;
  text-shadow: none;
}
.clients-see-more-link::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 8px;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 6' preserveAspectRatio='none'%3E%3Cpath d='M0 4.2 Q120 1.6 240 4.2' fill='none' stroke='%231a3329' stroke-width='1.1' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 0% 100%;
  transition: background-size 0.7s cubic-bezier(0.33, 1, 0.48, 1);
}
.clients-see-more-link:hover,
.clients-see-more-link:focus-visible{
  color: var(--moss);
  text-shadow: none;
}
.clients-see-more-link:hover::after,
.clients-see-more-link:focus-visible::after{
  background-size: 100% 100%;
}
@media (prefers-reduced-motion: reduce){
  .clients-see-more-link::after{
    transition-duration: 0.01ms;
  }
  .clients-stamp-cell img{
    transition: none;
  }
  .clients-stamp-cell:hover img{
    transform: none;
    filter: none;
  }
}

/* Homepage — partner logos band (dark band; selective white knockouts) */
.home-partners-strip{
  background: #0a0a0a;
  color: rgba(255, 255, 255, 0.94);
  padding: clamp(40px, 6vw, 72px) 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
body.home-nav-fixed-bottom .home-partners-strip{
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.home-partners-strip__inner{
  max-width: var(--container);
  margin-inline: auto;
}
.home-partners-strip__title{
  margin: 0 auto clamp(22px, 3.5vw, 36px);
  max-width: 36ch;
  text-align: center;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.2rem, 2.1vw, 1.65rem) + var(--heading-size-add));
  font-weight: 400;
  font-style: normal;
  font-variant-ligatures: none;
  font-feature-settings: normal;
  letter-spacing: 0.02em;
  line-height: 1.25;
  color: rgba(255, 255, 255, 0.96);
  text-transform: none;
}
.home-partners-strip__logos{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(18px, 3vw, 32px) clamp(12px, 2vw, 24px);
  margin: 0;
  padding: 0;
  list-style: none;
}
.home-partners-strip__cell{
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.home-partners-strip__link{
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(6px, 1vw, 10px) clamp(4px, 1vw, 12px);
  line-height: 0;
  opacity: 0.94;
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.home-partners-strip__link:hover{
  opacity: 1;
  transform: translateY(-1px);
}
.home-partners-strip__link:focus-visible{
  outline: 2px solid rgba(255, 255, 255, 0.85);
  outline-offset: 4px;
  border-radius: 2px;
}
.home-partners-strip__logo{
  display: block;
  height: clamp(34px, 4.2vw, 50px);
  width: auto;
  max-width: min(168px, 32vw);
  object-fit: contain;
}
.home-partners-strip__logo--knockout-white{
  filter: brightness(0) invert(1);
}
@media (max-width: 720px){
  .home-partners-strip__logos{
    justify-content: center;
  }
  .home-partners-strip__cell{
    flex: 0 1 calc(50% - 12px);
  }
}

/* Homepage — featured case tiles (magazine cards; no filter UI) */
body.home-nav-fixed-bottom .home-featured-section{
  padding: clamp(56px, 8vw, 96px) 0 clamp(64px, 10vw, 100px);
  background: #fdf9f3;
  border-top: 1px solid rgba(20, 19, 17, 0.06);
}
body.home-nav-fixed-bottom .home-featured-head{
  text-align: center;
  max-width: 56ch;
  margin: 0 auto clamp(28px, 4vw, 40px);
}
body.home-nav-fixed-bottom .home-featured-kicker{
  margin: 0 0 8px;
  font-family: var(--font-body);
  font-size: 12px;
  font-style: italic;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.48);
}
body.home-nav-fixed-bottom .home-featured-title{
  margin: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
  font-feature-settings: "liga" 1, "clig" 1, "calt" 1, "dlig" 1;
  font-size: calc(clamp(1.85rem, 4vw, 2.35rem) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.94);
}
body.home-nav-fixed-bottom .home-featured-lead{
  margin: 14px 0 0;
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.55;
  color: rgba(20, 19, 17, 0.58);
}
body.home-nav-fixed-bottom .home-featured-section .portfolio-mag-grid{
  margin-top: clamp(4px, 1.5vw, 12px);
}

.section-portfolio-page{
  padding-top: clamp(48px, 8vw, 80px);
  padding-bottom: clamp(64px, 10vw, 100px);
}
.portfolio-page-lead{
  max-width: 62ch;
  margin-top: 18px;
}
.portfolio-page-cta{
  margin-top: 28px;
}

/* Portfolio — client grid + case pages */
.portfolio-client-grid{
  list-style: none;
  margin: clamp(32px, 4vw, 48px) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: clamp(14px, 2.5vw, 22px);
}
.portfolio-client-card{
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  border: 1px solid rgba(20, 19, 17, 0.12);
  background: rgba(255, 255, 255, 0.72);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.2s ease, transform 0.18s ease, box-shadow 0.2s ease;
}
.portfolio-client-card:hover{
  border-color: rgba(26, 51, 41, 0.28);
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(20, 19, 17, 0.06);
}
.portfolio-client-card:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.45);
  outline-offset: 3px;
}
.portfolio-client-card__media{
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 120px;
  padding: clamp(16px, 3vw, 24px);
  background: rgba(247, 241, 230, 0.65);
  border-bottom: 1px solid rgba(20, 19, 17, 0.08);
}
.portfolio-client-card__media img{
  max-width: 100%;
  max-height: 72px;
  width: auto;
  height: auto;
  object-fit: contain;
}
.portfolio-client-card__body{
  padding: 14px 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1 1 auto;
}
.portfolio-client-card__name{
  margin: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(17px, 1.35vw, 20px);
  font-weight: 400;
  letter-spacing: 0.02em;
  color: rgba(20, 19, 17, 0.94);
  line-height: 1.2;
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.portfolio-client-card__hint{
  margin: 0;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: var(--font-body-weight);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.5);
}
.work-case{
  padding-top: clamp(48px, 8vw, 80px);
  padding-bottom: clamp(64px, 10vw, 100px);
}
.page-work-case{
  background: #ffffff;
}
.work-case__inner{
  max-width: min(720px, 100%);
}
.work-case__tags{
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  margin: clamp(18px, 2.5vw, 26px) 0 0;
  padding: 0;
  list-style: none;
}
.work-case__tag{
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border: 1px solid rgba(20, 19, 17, 0.14);
  font-family: var(--font-body);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.62);
  background: rgba(247, 241, 230, 0.45);
}
.work-case__body{
  margin-top: clamp(22px, 3vw, 32px);
}
.work-case__body p{
  margin: 0 0 1em;
  color: rgba(20, 19, 17, 0.78);
  line-height: 1.7;
}
.work-case__body p:last-child{
  margin-bottom: 0;
}
.work-case__cta{
  margin-top: clamp(28px, 4vw, 40px);
}
.work-case-client-quote{
  margin-top: clamp(28px, 4vw, 44px);
  padding: clamp(26px, 3.6vw, 38px);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 14px;
  background: #1a3329;
  text-align: left;
  max-width: min(900px, 100%);
}
.work-case-client-quote__text{
  margin: 0;
  font-family: var(--font-body);
  font-size: clamp(18px, 2.1vw, 27px);
  line-height: 1.45;
  letter-spacing: 0.01em;
  color: rgba(255, 255, 255, 0.96);
}
.work-case-client-quote__text::before{
  content: "★★★★★";
  display: block;
  margin-bottom: 12px;
  font-size: clamp(18px, 2vw, 24px);
  line-height: 1;
  letter-spacing: 0.18em;
  color: #ffffff;
}
.work-case-client-quote__attr{
  margin: 16px 0 0;
  font-family: var(--font-display);
  font-size: clamp(14px, 1.4vw, 18px);
  font-style: italic;
  letter-spacing: 0.01em;
  color: rgba(255, 255, 255, 0.9);
  text-align: right;
}
.work-case-client-end{
  margin-top: 0;
  padding-top: clamp(36px, 5vw, 52px);
  border-top: 1px solid rgba(20, 19, 17, 0.1);
  text-align: center;
}
.work-case-client-end .work-case__cta{
  margin-top: 0;
}
.work-case-highlight-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 20px);
  min-height: min(160px, 28vw);
  margin: 0;
  padding: clamp(20px, 3vw, 28px);
  border: 1px dashed rgba(20, 19, 17, 0.16);
  border-radius: 12px;
  background: rgba(247, 241, 230, 0.22);
  box-sizing: border-box;
}
.work-case-highlight-grid figure{
  margin: 0;
}
.work-case-highlight-grid img{
  display: block;
  width: 100%;
  height: auto;
  border-radius: 10px;
  border: 1px solid rgba(20, 19, 17, 0.1);
  box-sizing: border-box;
}
.cosmo-moodboard,
.brookstone-moodboard,
.revd-moodboard,
.witness-moodboard{
  margin: clamp(4px, 1vw, 10px) 0 0;
}
.cosmo-moodboard img,
.brookstone-moodboard img,
.revd-moodboard img,
.witness-moodboard img{
  display: block;
  width: 100%;
  height: auto;
  vertical-align: middle;
  border-radius: 12px;
  border: 1px solid rgba(20, 19, 17, 0.1);
  box-sizing: border-box;
}
.hsf-moodboard{
  margin: clamp(8px, 1.4vw, 14px) 0 0;
}
.hsf-moodboard img{
  display: block;
  width: min(100%, 1024px);
  height: auto;
  margin-inline: auto;
  border-radius: 12px;
  border: 1px solid rgba(20, 19, 17, 0.12);
  box-sizing: border-box;
}

/* REVD Toys — style guide: logo lineup, palette, type notes */
.revd-logo-identity-section{
  background: rgb(255, 255, 255);
  border-radius: 12px;
}
.revd-logo-identity-section .work-case-showcase__lede{
  margin-top: clamp(-4px, -0.2vw, 0);
  margin-bottom: clamp(16px, 2.2vw, 22px);
  max-width: 62ch;
}
.revd-logo-identity-section .work-case-showcase__lede a{
  color: inherit;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.revd-logo-identity-section .work-case-showcase__lede a:hover{
  color: var(--moss);
}
.revd-logo-line{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 24px);
}
.revd-logo-line__item{
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.revd-logo-line .branding-case-logo__pad{
  width: 100%;
}
.revd-logo-line .branding-case-logo__pad img{
  max-height: min(110px, 28vw);
  max-width: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}
.revd-logo-line__item--icon .branding-case-logo__pad img{
  max-height: min(200px, 42vw);
}
.revd-logo-line .branding-case-logo__pad--dark .revd-logo-wordmark--inverse{
  filter: invert(1);
}

/* Hey Peaches — logo lineup (pads + section flush to page — no stacked white/cream tiles) */
.hey-peaches-logo-identity-section{
  background: transparent;
  border-radius: 0;
}
.hey-peaches-logo-line .branding-case-logo__pad--white{
  background: transparent;
  border: none;
}
.hey-peaches-logo-identity-section .work-case-showcase__lede{
  margin-top: clamp(-4px, -0.2vw, 0);
  margin-bottom: clamp(16px, 2.2vw, 22px);
  max-width: 62ch;
}
.hey-peaches-logo-line{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 24px);
}
.hey-peaches-logo-line__item{
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.hey-peaches-logo-line .branding-case-logo__pad{
  width: 100%;
}
.hey-peaches-logo-line .branding-case-logo__pad img{
  max-height: min(132px, 34vw);
  max-width: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}
@media (max-width: 560px){
  .hey-peaches-logo-line{
    grid-template-columns: 1fr;
  }
}

.revd-brand-swatches{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(10px, 2vw, 16px);
  margin: clamp(18px, 2.5vw, 26px) 0 0;
  padding: 0;
  list-style: none;
}
.revd-brand-swatch{
  min-height: 92px;
  border-radius: 10px;
  border: 1px solid rgba(20, 19, 17, 0.12);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 4px;
  padding: 12px 14px;
  font-family: var(--font-body);
  font-size: 13px;
  line-height: 1.35;
  box-sizing: border-box;
}
.revd-brand-swatch__name{
  display: block;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 10px;
}
.revd-brand-swatch--black{
  background: rgb(29, 28, 26);
  color: rgb(255, 255, 255);
}
.revd-brand-swatch--white{
  background: rgb(255, 255, 255);
  color: rgb(29, 28, 26);
}
.revd-brand-swatch--red{
  background: rgb(175, 0, 0);
  color: rgb(255, 255, 255);
}
.revd-brand-swatch--grey{
  background: rgb(95, 95, 95);
  color: rgb(255, 255, 255);
}
@media (max-width: 900px){
  .revd-brand-swatches{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 520px){
  .revd-brand-swatches{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 400px){
  .revd-brand-swatches{
    grid-template-columns: 1fr;
  }
}

.work-case-highlight-grid--wide{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-height: min(200px, 32vw);
}
.work-case-highlight-grid--hey-peaches-icons{
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: clamp(12px, 2vw, 18px);
  padding: clamp(18px, 2.5vw, 26px);
  min-height: 0;
  background: #141312;
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.12);
}
.work-case-highlight-grid--hey-peaches-icons figure{
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  min-height: clamp(100px, 18vw, 140px);
  padding: clamp(10px, 1.6vw, 16px);
  box-sizing: border-box;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.35);
}
.work-case-highlight-grid--hey-peaches-icons img{
  display: block;
  width: 100%;
  max-height: min(148px, 26vw);
  height: auto;
  object-fit: contain;
  border: none;
  border-radius: 8px;
}
@media (max-width: 900px){
  .work-case-highlight-grid--hey-peaches-icons{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 700px){
  .work-case-highlight-grid:not(.work-case-highlight-grid--hey-peaches-icons),
  .work-case-highlight-grid--wide{
    grid-template-columns: 1fr;
  }
  .work-case-highlight-grid--hey-peaches-icons{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Hey Peaches — texture & pattern swatches (CSS tiles) */
.hey-peaches-texture-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 22px);
  margin-top: clamp(6px, 1.2vw, 12px);
}
.hey-peaches-texture-card{
  margin: 0;
}
.hey-peaches-texture-media{
  aspect-ratio: 1 / 1;
  width: 100%;
  border-radius: 12px;
  border: 1px solid rgba(20, 19, 17, 0.1);
  box-sizing: border-box;
  overflow: hidden;
  background: rgba(20, 19, 17, 0.04);
}
.hey-peaches-texture-card img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.hey-peaches-texture-card figcaption{
  margin-top: 8px;
  font-family: var(--font-body);
  font-size: clamp(11px, 0.95vw, 13px);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.62);
}
@media (max-width: 720px){
  .hey-peaches-texture-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 400px){
  .hey-peaches-texture-grid{
    grid-template-columns: 1fr;
  }
}

.work-case__inner--gallery{
  max-width: min(1040px, calc(100% - 48px));
  margin-inline: auto;
  width: 100%;
  padding-top: clamp(36px, 5vw, 56px);
  margin-top: clamp(28px, 4vw, 44px);
  border-top: 1px solid rgba(20, 19, 17, 0.1);
  box-sizing: border-box;
}
.work-case__inner--intro-split{
  max-width: min(1120px, calc(100% - 48px));
}
.work-case-intro-split{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
  gap: clamp(28px, 4vw, 48px);
  align-items: start;
}
.work-case-intro-split__copy .portfolio-page-lead{
  margin-top: 0;
}
.work-case-intro-split__hero{
  margin: 0;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(20, 19, 17, 0.1);
  background: rgba(20, 19, 17, 0.04);
  aspect-ratio: 4 / 3;
  max-height: min(52vh, 520px);
}
.work-case-intro-split__hero img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Case study — 50/50 client board (portfolio case pages) */
.work-case.section-portfolio-page.work-case--has-client-board,
.work-case.work-case--has-client-board{
  padding-top: 0;
}
/* Flush client board under fixed header: remove #main top padding gap + fill pad with split column colors */
#main:has(> article.work-case--has-client-board){
  padding-top: 0;
}
body.page-work-case .site-header{
  border-bottom: 0;
}
.work-case-client-board{
  width: 100%;
  box-sizing: border-box;
  padding-top: var(--site-header-height);
  background: linear-gradient(90deg, #ffffff 50%, #1a3329 50%);
}
@media (max-width: 860px){
  .work-case-client-board{
    background: #ffffff;
  }
}
.work-case-client-board__grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-height: min(78vh, 760px);
  align-items: stretch;
  position: relative;
}
.work-case-client-board__left{
  display: flex;
  flex-direction: column;
  padding: clamp(28px, 4vw, 52px) clamp(24px, 4vw, 56px) clamp(28px, 4vw, 48px);
  background: #ffffff;
  border-bottom: 0;
  box-sizing: border-box;
}
.work-case-client-board__back{
  margin: 0 0 clamp(20px, 3vw, 28px);
}
.work-case-client-board__back a{
  color: rgba(20, 19, 17, 0.55);
  text-decoration: none;
  font-size: 14px;
}
.work-case-client-board__back a:hover{
  color: rgba(20, 19, 17, 0.85);
  text-decoration: underline;
}
.work-case-client-board__mark{
  display: block;
  max-width: min(200px, 72%);
  max-height: 88px;
  width: auto;
  height: auto;
  object-fit: contain;
  margin: 0 0 16px;
}
.work-case-client-board__logo{
  margin: 0 0 clamp(10px, 2vw, 18px);
}
.work-case-client-board__logo--cultivate{
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(280px, 88%);
  margin-left: 0;
  margin-right: 0;
  padding: clamp(22px, 5vw, 40px);
  background: radial-gradient(circle at 50% 42%, #6a4a42 0%, #2a211e 78%);
  border-radius: 50%;
  aspect-ratio: 1;
  box-sizing: border-box;
}
.work-case-client-board__logo--cultivate .work-case-client-board__mark{
  max-width: 92%;
  max-height: 92%;
  margin: 0;
}
.work-case-client-board__mark--hero{
  max-width: min(320px, 92%);
  max-height: min(200px, 30vh);
  margin-bottom: 0;
}
.work-case-client-board__mark--large{
  max-width: min(440px, 100%);
  max-height: min(380px, 52vh);
}
.work-case-client-board__mark--xlarge{
  max-width: min(560px, 100%);
  max-height: min(520px, 62vh);
}
.page-outback-toys-case #main .work-case-client-board__logo--obt-reverse-primary{
  display: inline-block;
  margin-left: 0;
  margin-right: 0;
  padding: clamp(14px, 2.5vw, 22px) clamp(18px, 3vw, 28px);
  background: linear-gradient(165deg, #2c2722 0%, #141210 92%);
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-sizing: border-box;
}
.page-outback-toys-case #main .work-case-client-board__logo--obt-reverse-primary .work-case-client-board__mark{
  margin-bottom: 0;
}
/* Grady's — primary red wordmark on the cream client-board column */
.page-gradys-case #main .work-case-client-board__logo .work-case-gradys-logo-mark,
.page-gradys-case #main .work-case-client-board__name .work-case-gradys-logo-mark{
  max-width: min(440px, 100%);
  max-height: min(120px, 20vw);
  margin: 0;
  filter: none;
}
/* Head Strong Flight — case page hero logo only; portfolio thumbnails use .portfolio-mag-card__logo-overlay--hsf */
.page-hsf-case #main .work-case-client-board__logo .work-case-client-board__mark.work-case-client-board__mark--xlarge,
.page-hsf-case #main .work-case-client-board__name .work-case-hsf-logo-mark{
  max-width: min(400px, 92%);
  max-height: min(120px, 24vw);
  width: auto;
  height: auto;
  object-fit: contain;
}

/* DA Targets — full-color / dark mark on the white client-board column (no green panel) */
.page-da-targets-case #main .work-case-client-board__logo{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  max-width: 100%;
  margin: 0 0 clamp(10px, 2vw, 18px);
  padding: 0;
  background: transparent;
  border-radius: 0;
  box-sizing: border-box;
}
.page-da-targets-case #main .work-case-client-board__logo .work-case-client-board__mark--hero,
.page-da-targets-case #main .work-case-client-board__name .work-case-da-targets-logo-mark{
  max-width: min(420px, 100%);
  max-height: min(88px, 16vw);
  width: auto;
  height: auto;
  object-fit: contain;
  margin: 0;
  filter: none;
}

/* Living Room Church — stacked wordmark (JPEG) on the cream client-board column; JS figure uses only --hero */
.page-living-room-church-case #main .work-case-client-board__logo .work-case-living-room-church-logo-mark,
.page-living-room-church-case #main .work-case-client-board__logo .work-case-client-board__mark--hero,
.page-living-room-church-case #main .work-case-client-board__name .work-case-living-room-church-logo-mark{
  max-width: min(380px, 100%);
  max-height: min(160px, 24vw);
  margin: 0;
  filter: none;
}

/* REVD Toys — wide wordmark in client board */
.page-revd-case #main .work-case-client-board__logo .work-case-client-board__mark--hero,
.page-revd-case #main .work-case-client-board__name .work-case-revd-logo-mark{
  max-width: min(440px, 100%);
  max-height: min(100px, 17vw);
  margin: 0;
  filter: none;
}

/* Head Strong Flight — logo lineup (Grady's-style identity panel) */
.hsf-logo-identity-section{
  background: rgb(255, 255, 255);
  border-radius: 12px;
}
.hsf-logo-line{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 24px);
}
.hsf-logo-line__item{
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hsf-logo-line__item img{
  display: block;
  width: 100%;
  max-width: min(280px, 100%);
  height: auto;
}
.branding-case-logo-grid__label{
  order: -1;
  margin: 0 0 2px;
  padding: 0 4px;
  font-family: var(--font-body);
  font-size: clamp(10px, 0.95vw, 11px);
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.35;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.5);
}
.hsf-brand-swatches{
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: clamp(10px, 2vw, 16px);
  margin: clamp(18px, 2.5vw, 26px) 0 0;
  padding: 0;
  list-style: none;
}
.hsf-brand-swatch{
  min-height: 92px;
  border-radius: 10px;
  border: 1px solid rgba(20, 19, 17, 0.12);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 4px;
  padding: 12px 14px;
  font-family: var(--font-body);
  font-size: 13px;
  line-height: 1.35;
  box-sizing: border-box;
}
.hsf-brand-swatch__name{
  display: block;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 10px;
}
.hsf-brand-swatch--dune{
  background: rgb(234, 217, 172);
  color: rgb(26, 24, 22);
}
.hsf-brand-swatch--taupe{
  background: rgb(199, 183, 157);
  color: rgb(26, 24, 22);
}
.hsf-brand-swatch--earth{
  background: rgb(102, 83, 57);
  color: rgb(255, 255, 255);
}
.hsf-brand-swatch--carbon{
  background: rgb(0, 0, 0);
  color: rgb(255, 255, 255);
}
.hsf-brand-swatch--pine{
  background: rgb(43, 54, 29);
  color: rgb(234, 217, 172);
}
@media (max-width: 900px){
  .hsf-brand-swatches{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 520px){
  .hsf-brand-swatches{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 400px){
  .hsf-brand-swatches{
    grid-template-columns: 1fr;
  }
}

/* Flintrock Stables — wordmark (PNG or SVG) in client board / H1 */
.work-case-client-board__mark.work-case-flintrock-logo-mark{
  filter: brightness(0);
}
/* Flintrock — SVG wordmark replacing typed H1 title (static H1 or JS-injected figure) */
.work-case-client-board__name .work-case-flintrock-logo-mark,
.page-flintrock-case #main .work-case-client-board__logo .work-case-client-board__mark--hero{
  display: block;
  max-width: min(480px, 100%);
  max-height: min(100px, 16vw);
  width: auto;
  height: auto;
  object-fit: contain;
}
.page-flintrock-case #main .work-case-client-board__logo .work-case-client-board__mark--hero{
  filter: brightness(0);
}
/* Blaze Yoga Lancaster — full-color wordmark (transparent WebP) on the cream client-board column */
.page-blaze-yoga-fitness-case #main .work-case-client-board__logo .work-case-blaze-yoga-logo-mark,
.page-blaze-yoga-fitness-case #main .work-case-client-board__name .work-case-blaze-yoga-logo-mark{
  max-width: min(380px, 100%);
  max-height: min(120px, 18vw);
  margin: 0;
  filter: none;
}
/* Hey Peaches Boutique — horizontal wordmark (SVG) on the cream client-board column; JS figure uses only --hero */
.page-hey-peaches-case #main .work-case-client-board__logo .work-case-hey-peaches-logo-mark,
.page-hey-peaches-case #main .work-case-client-board__logo .work-case-client-board__mark--hero,
.page-hey-peaches-case #main .work-case-client-board__name .work-case-hey-peaches-logo-mark{
  max-width: min(420px, 100%);
  max-height: min(160px, 22vw);
  margin: 0;
  filter: brightness(0);
}
/* Cosmo Floral Design — portrait logo (SVG) on the cream client-board column
   Cosmo.svg uses width/height 100%; cap dimensions so it cannot spill into sections below */
.page-cosmos-case #main .work-case-client-board__logo .work-case-cosmos-logo-mark,
.page-cosmos-case #main .work-case-client-board__logo .work-case-client-board__mark--hero,
.page-cosmos-case #main .work-case-client-board__name .work-case-cosmos-logo-mark{
  display: block;
  box-sizing: border-box;
  width: auto !important;
  height: auto !important;
  max-width: min(200px, 45%);
  max-height: clamp(110px, min(22vh, 18vw), 168px);
  margin: 0;
  object-fit: contain;
  object-position: left top;
  filter: none;
}
.page-cosmos-case #main .work-case-client-board__name:has(.work-case-cosmos-logo-mark),
.page-cosmos-case #main .work-case-client-board__logo{
  margin: 0 0 clamp(14px, 2.2vw, 22px);
  flex: 0 0 auto;
  min-height: 0;
}
.page-cosmos-case #main .work-case-client-board__left{
  min-height: 0;
}
/* Pennwood Development Group — horizontal wordmark on the cream client-board column; JS figure uses only --hero */
.page-pennwood-case #main .work-case-client-board__logo .work-case-pennwood-logo-mark,
.page-pennwood-case #main .work-case-client-board__logo .work-case-client-board__mark--hero,
.page-pennwood-case #main .work-case-client-board__name .work-case-pennwood-logo-mark{
  max-width: min(400px, 100%);
  max-height: min(120px, 20vw);
  margin: 0;
  filter: none;
}
/* Lakewood Reserve — horizontal wordmark (SVG) on the cream client-board column; JS figure uses only --hero */
.page-lakewood-reserve-case #main .work-case-client-board__logo .work-case-lakewood-reserve-logo-mark,
.page-lakewood-reserve-case #main .work-case-client-board__logo .work-case-client-board__mark--hero,
.page-lakewood-reserve-case #main .work-case-client-board__name .work-case-lakewood-reserve-logo-mark{
  display: block;
  max-width: min(440px, 100%);
  max-height: min(120px, 22vw);
  width: auto;
  height: auto;
  margin: 0;
  object-fit: contain;
  filter: none;
}
.work-case-client-board__client-name{
  margin: 0 0 clamp(14px, 2vw, 20px);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.85rem, 3.2vw, 2.5rem) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: 0.06em;
  line-height: 1.15;
  color: rgba(20, 19, 17, 0.94);
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.work-case-client-board__meta--in-about{
  margin-top: 0;
  margin-bottom: clamp(22px, 3vw, 32px);
}
.work-case-client-board__name{
  margin: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(2.25rem, 5vw, 3.5rem) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.05;
  color: rgba(20, 19, 17, 0.96);
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
/* Image-only H1: avoid extra leading from title typography */
.work-case-client-board__name:has(> img:only-child){
  font-size: 0;
  line-height: 0;
}
/* Blaze Yoga alternate case — header lockup (PNG) replaces typed title; matches Brookstone: logo then meta (JS) */
.page-blaze-yoga-alt-case #main .work-case-client-board__logo .work-case-client-board__mark--hero,
.work-case-client-board__name .work-case-blaze-yoga-logo-mark{
  display: block;
  max-width: min(520px, 100%);
  max-height: min(140px, 24vw);
  width: auto;
  height: auto;
  object-fit: contain;
  margin: 0;
  filter: none;
}
/* Brookstone Industries — horizontal lockup in hero H1 */
.page-brookstone-case #main .work-case-client-board__name .work-case-brookstone-logo-mark{
  display: block;
  max-width: min(520px, 100%);
  max-height: min(96px, 18vw);
  width: auto;
  height: auto;
  object-fit: contain;
  margin: 0;
  filter: none;
}

/* Outback Toys — black horizontal wordmark (OBT black.svg) on cream column; JS figure uses only --hero */
.page-outback-toys-case #main .work-case-client-board__name:has(.work-case-outback-logo-mark){
  margin: 0 0 clamp(10px, 2vw, 18px);
  padding: 0;
  background: transparent;
  border-radius: 0;
  width: auto;
  max-width: 100%;
  box-sizing: border-box;
}
.page-outback-toys-case #main .work-case-client-board__logo .work-case-client-board__mark--hero,
.page-outback-toys-case #main .work-case-client-board__name .work-case-outback-logo-mark{
  display: block;
  max-width: min(420px, 100%);
  max-height: min(88px, 16vw);
  width: auto;
  height: auto;
  object-fit: contain;
  margin: 0;
  filter: none;
}

/* TCC / Cultivate — leaf mark in hero */
.page-tcc-case #main .work-case-client-board__name .work-case-tcc-logo-mark{
  display: block;
  max-width: min(280px, 88%);
  max-height: min(100px, 20vw);
  width: auto;
  height: auto;
  object-fit: contain;
  margin: 0;
  filter: none;
}

/* Wittness Coffeehouse — horizontal wordmark (SVG) on the cream client-board column; JS figure uses only --hero */
.page-witness-coffeehouse-case #main .work-case-client-board__logo .work-case-witness-logo-mark,
.page-witness-coffeehouse-case #main .work-case-client-board__logo .work-case-client-board__mark--hero,
.page-witness-coffeehouse-case #main .work-case-client-board__name .work-case-witness-logo-mark{
  display: block;
  max-width: min(440px, 100%);
  max-height: min(100px, 18vw);
  width: auto;
  height: auto;
  object-fit: contain;
  object-position: left center;
  margin: 0;
  filter: brightness(0);
}
.page-witness-coffeehouse-case .section.work-case-logo-band .work-case-logo-band__img{
  filter: brightness(0);
}

/* No Nonsense Neutering — horizontal wordmark in hero; JS figure uses only --hero */
.page-no-nonsense-neutering-case #main .work-case-client-board__logo .work-case-client-board__mark--hero,
.page-no-nonsense-neutering-case #main .work-case-client-board__name .work-case-nnn-logo-mark{
  display: block;
  max-width: min(400px, 100%);
  max-height: min(100px, 20vw);
  width: auto;
  height: auto;
  object-fit: contain;
  margin: 0;
  filter: none;
}

/* Vizion + Everflame — vector wordmarks in hero */
.page-vizion-case #main .work-case-client-board__name .work-case-vizion-logo-mark,
.page-everflame-financial-case #main .work-case-client-board__name .work-case-everflame-logo-mark{
  display: block;
  max-width: min(440px, 100%);
  max-height: min(100px, 18vw);
  width: auto;
  height: auto;
  object-fit: contain;
  margin: 0;
  filter: none;
}
.work-case-client-board__meta{
  margin: clamp(28px, 4vw, 40px) 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(18px, 3vw, 28px);
}
.work-case-client-board__meta > div{
  margin: 0;
}
.work-case-client-board__meta dt{
  margin: 0 0 6px;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.45);
}
.work-case-client-board__meta dd{
  margin: 0;
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.5;
  color: rgba(20, 19, 17, 0.82);
}
.work-case-client-board__client-links{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  margin-top: clamp(18px, 2.5vw, 26px);
  padding: 0;
}
.work-case-client-board__client-link{
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
  color: rgba(20, 19, 17, 0.72);
  border-bottom: 1px solid rgba(20, 19, 17, 0.22);
  padding-bottom: 2px;
  transition: color 0.2s ease, border-color 0.2s ease;
}
.work-case-client-board__client-link:hover{
  color: rgba(20, 19, 17, 0.95);
  border-bottom-color: rgba(20, 19, 17, 0.5);
}
.work-case-client-board__cta-wrap{
  flex: 0 0 auto;
  margin-top: clamp(22px, 3.2vw, 36px);
  padding-top: 0;
}
.work-case-client-board__cta-primary{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 160px;
  padding: 14px 28px;
  font-family: var(--font-button);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-decoration: none;
  color: #000;
  background: #e7d8bd;
  border: 1px solid #e7d8bd;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.work-case-client-board__cta-primary:hover{
  background: #dcc8a5;
  border-color: #dcc8a5;
  color: #000;
}
.work-case-client-board__right{
  display: flex;
  flex-direction: column;
  padding: clamp(28px, 4vw, 52px) clamp(24px, 4vw, 56px) clamp(28px, 4vw, 40px);
  background: #1a3329;
  box-sizing: border-box;
  border-bottom: 0;
}
.work-case-client-board__about-title{
  margin: 0;
  flex: 0 0 auto;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(22px, 2.2vw, 28px) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: 0.02em;
  color: rgba(247, 241, 230, 0.96);
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.work-case-client-board__right .work-case-client-board__client-name{
  color: rgba(247, 241, 230, 0.96);
}
.work-case-client-board__right .work-case-client-board__meta dt{
  color: rgba(247, 241, 230, 0.5);
}
.work-case-client-board__right .work-case-client-board__meta dd{
  color: rgba(247, 241, 230, 0.88);
}
.work-case-client-board__rule{
  flex: 0 0 auto;
  margin: 14px 0 clamp(20px, 3vw, 28px);
  border: none;
  border-top: 1px solid rgba(247, 241, 230, 0.28);
  height: 0;
}
.work-case-client-board__about{
  flex: 0 0 auto;
  margin-top: clamp(16px, 2.6vw, 28px);
}
.work-case-client-board__about p{
  margin: 0 0 1em;
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.65;
  color: rgba(247, 241, 230, 0.82);
}
.work-case-client-board__about p.lead,
.work-case-client-board__about .portfolio-page-lead{
  margin-top: 0;
  max-width: none;
  font-size: clamp(16px, 1.35vw, 18px);
  line-height: 1.55;
  color: rgba(247, 241, 230, 0.86);
}
.work-case-client-board__about p:last-child{
  margin-bottom: 0;
}
.work-case-client-board__social{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 12px 14px;
  margin-top: clamp(18px, 2.5vw, 28px);
  padding-top: 0;
  flex: 0 0 auto;
}
.work-case-client-board__next{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  position: absolute;
  right: clamp(20px, 4vw, 48px);
  top: auto;
  bottom: clamp(22px, 3.5vw, 42px);
  margin: 0;
  padding: 0;
  color: rgba(247, 241, 230, 0.92);
  text-decoration: none;
  font-size: clamp(26px, 3vw, 34px);
  line-height: 1;
  letter-spacing: 0.04em;
  transition: color 0.2s ease, transform 0.2s ease;
  z-index: 2;
}
.work-case-client-board__next-wrap{
  margin: clamp(18px, 2.8vw, 30px) 0 0;
  text-align: right;
}
.work-case-client-board__right .work-case-client-board__next{
  margin: 0;
  padding: 0;
}
.work-case-client-board__next:hover{
  color: #f7f1e6;
  transform: translateX(5px);
}
.work-case-client-board__next:focus-visible{
  outline: 2px solid rgba(247, 241, 230, 0.65);
  outline-offset: 4px;
}
.work-case-client-board__next-arrow{
  display: block;
}
.work-case-client-board__next-preview{
  display: inline-block;
  font-size: clamp(11px, 0.9vw, 13px);
  line-height: 1.2;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(247, 241, 230, 0.8);
}

/* Portfolio case — full-width identity logo strip (optional per case page) */
/* Avoid stacking default .section padding with this strip + submark (was ~140–190px between bands) */
.section.work-case-logo-band{
  padding-block: 0;
}
.work-case-logo-band{
  margin-top: clamp(24px, 5vw, 56px);
  margin-right: clamp(20px, 4vw, 48px);
  margin-bottom: clamp(24px, 5vw, 56px);
  margin-left: clamp(20px, 4vw, 48px);
  height: 500px;
  padding: 0;
  background: #ffffff;
  border-top: 0;
  border-bottom: 0;
  box-sizing: border-box;
}
.section.work-case-logo-band:has(+ .section.work-case-submark-row),
.section.work-case-logo-band:has(+ .section.work-case-brand-swatches){
  padding-block: 6px;
  margin-bottom: clamp(8px, 1.5vw, 20px);
}
.work-case-logo-band__inner{
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.work-case-logo-band__figure{
  margin: 0;
  width: 100%;
  max-width: min(960px, 100%);
}
.work-case-logo-band__img{
  display: block;
  max-width: 100%;
  max-height: 400px;
  width: auto;
  height: auto;
  object-fit: contain;
  margin-inline: auto;
}
@media (max-width: 760px){
  body.page-work-case .section.work-case-logo-band{
    display: none;
  }
}

/* Portfolio case — secondary logo row (e.g. Wittness alternate marks below logo band) */
.work-case-submark-row{
  padding-inline: clamp(20px, 4vw, 48px);
  padding-block: clamp(18px, 3.5vw, 40px);
  background: #ffffff;
  border-top: 0;
  border-bottom: 0;
  box-sizing: border-box;
}
/* +6px replaces former padding-block:0 on .section (only pages that include this block) */
.section.work-case-submark-row{
  padding-block: calc(6px + clamp(18px, 3.5vw, 40px));
}
.section.work-case-logo-band + .section.work-case-submark-row,
.section.work-case-brand-swatches + .section.work-case-submark-row{
  padding-top: calc(6px + clamp(10px, 2vw, 24px));
}

.section.work-case-brand-swatches{
  padding-block: clamp(28px, 4vw, 52px);
  background: #ffffff;
}
.section.work-case-brand-swatches ul[class*="brand-swatches"]{
  margin-top: 0;
}
.section.work-case-brand-swatches .gradys-brand-swatches{
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.section.work-case-brand-swatches [class*="brand-swatch__name"]{
  display: none;
}
.section.work-case-brand-swatches li[class*="brand-swatch"]{
  justify-content: center;
  gap: 0;
  min-height: clamp(52px, 11vw, 92px);
}
.work-case-submark-row__grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(18px, 3vw, 36px);
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 0;
}
.work-case-submark-row__cell{
  margin: 0;
}
.work-case-submark-row__figure{
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: min(120px, 32vw);
}
.work-case-submark-row__img{
  display: block;
  max-width: 90%;
  max-height: min(280px, 52vw);
  width: auto;
  height: auto;
  object-fit: contain;
}
/* REVD — inverse alt mark (white badge) needs a dark field on the white logo row */
.page-revd-case .work-case-submark-row__figure--revd-inverse{
  background: #14120f;
  border-radius: 10px;
  padding: clamp(14px, 2.4vw, 24px);
  box-sizing: border-box;
  width: 100%;
  max-width: min(420px, 100%);
  margin-inline: auto;
}
@media (max-width: 900px){
  .work-case-submark-row__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* Single full-width horizontal lockup (e.g. Brookstone tagline SVG) */
.work-case-submark-row__grid--tagline-lockup{
  grid-template-columns: 1fr;
  max-width: min(960px, 100%);
  margin-inline: auto;
}
/* Two-up logo row (e.g. Brookstone tagline + icon horizontal) */
.work-case-submark-row__grid--pair{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: min(1100px, 100%);
  margin-inline: auto;
}
/* Three-up logo row (e.g. Cosmo Floral lockup PNGs) */
.work-case-submark-row__grid--triple{
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: min(1200px, 100%);
  margin-inline: auto;
}
@media (max-width: 960px){
  .work-case-submark-row__grid--triple{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Vizion — logo file uses a wide canvas; restore pre–400px-cap sizing in the logo strip only */
.page-vizion-case .work-case-logo-band__img{
  max-height: none;
  max-width: 100%;
  width: 100%;
  height: auto;
  margin-inline: 0;
  object-fit: initial;
}

/* Cosmo — horizontal SVG lockup: tighter cap than default 400px logo strip */
.page-cosmos-case .work-case-logo-band__img{
  max-height: min(300px, 38vw);
  max-width: min(720px, 90%);
}

/* Portfolio case — challenge / solution (below client board) */
.work-case-challenge-solution{
  padding-top: clamp(40px, 6vw, 72px);
  padding-bottom: clamp(40px, 6vw, 72px);
}
.work-case-challenge-solution__grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(28px, 4vw, 48px);
  align-items: start;
}
.work-case-challenge-solution__heading{
  margin: 0 0 clamp(12px, 2vw, 18px);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(18px, 1.6vw, 22px) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--moss);
}
.work-case-challenge-solution__prose p{
  margin: 0;
  font-family: var(--font-body);
  font-size: clamp(15px, 1.12vw, 17px);
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.82);
}
@media (max-width: 760px){
  .work-case-challenge-solution__grid{
    grid-template-columns: 1fr;
  }
}

/* Portfolio case — visual grid (3×2 portrait tiles + captions; below challenge/solution) */
.work-case-visual-gallery{
  background: #ffffff;
  border-top: 1px solid rgba(20, 19, 17, 0.06);
}
.work-case-visual-gallery__header{
  max-width: min(56ch, 100%);
  margin-bottom: clamp(28px, 4vw, 48px);
}
.work-case-visual-gallery__title{
  margin: 0 0 clamp(12px, 2vw, 18px);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.65rem, 3.2vw, 2.35rem) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1.15;
  color: rgba(20, 19, 17, 0.94);
  font-variant-ligatures: common-ligatures contextual;
}
.work-case-visual-gallery__lead{
  margin: 0;
  font-family: var(--font-body);
  font-size: clamp(15px, 1.12vw, 17px);
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.62);
}
.work-case-visual-gallery__grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(18px, 2.8vw, 36px) clamp(16px, 2.4vw, 28px);
  align-items: start;
  list-style: none;
  padding: 0;
  margin: 0;
}
.work-case-visual-gallery__tile{
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0;
}
.work-case-visual-gallery__media{
  width: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  background: rgba(20, 19, 17, 0.04);
}
.work-case-visual-gallery__media img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.work-case-visual-gallery__caption{
  margin: clamp(12px, 2vw, 16px) 0 0;
  padding: 0 4px clamp(8px, 1.2vw, 10px);
  width: 100%;
  box-sizing: border-box;
  text-align: center;
  font-family: var(--font-body);
  font-size: clamp(11px, 0.95vw, 13px);
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.72);
  border-bottom: 1px solid rgba(20, 19, 17, 0.28);
}
@media (max-width: 900px){
  .work-case-visual-gallery__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* Keep 2 columns down to ~400px viewports; single column only on very narrow phones */
@media (max-width: 399px){
  .work-case-visual-gallery__grid{
    grid-template-columns: 1fr;
    gap: clamp(22px, 5vw, 32px);
  }
}

/* Portfolio case — bottom “next client” (mirrors header next link; injected on page-work-case) */
.work-case-next-footer{
  border-top: 1px solid rgba(20, 19, 17, 0.1);
  padding: clamp(28px, 4.5vw, 52px) clamp(20px, 4vw, 40px);
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.55), rgba(247, 241, 230, 0.35));
}
.work-case-next-footer__link{
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(8px, 1.2vw, 12px);
  max-width: min(36rem, 100%);
  text-decoration: none;
  color: #14120f;
  transition: color 0.2s ease, transform 0.2s ease;
}
.work-case-next-footer__link:hover{
  color: var(--moss);
  transform: translateY(3px);
}
.work-case-next-footer__link:focus-visible{
  outline: 2px solid var(--moss);
  outline-offset: 6px;
  border-radius: 4px;
}
.work-case-next-footer__arrow{
  display: block;
  font-size: clamp(32px, 4.5vw, 46px);
  line-height: 1;
  font-weight: 300;
  letter-spacing: 0;
}
.work-case-next-footer__kicker{
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.5);
}
.work-case-next-footer__name{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(1.05rem, 2.2vw, 1.45rem);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #14120f;
}
.work-social-stats{
  padding: clamp(18px, 3vw, 34px) 0 clamp(30px, 5vw, 54px);
  background: #f3f1ec;
  border-top: 1px solid rgba(20, 19, 17, 0.08);
  border-bottom: 1px solid rgba(20, 19, 17, 0.08);
}
.work-social-stats__grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 0;
}
.work-social-stats__item{
  text-align: center;
  padding: clamp(16px, 2.5vw, 24px) clamp(10px, 2vw, 16px);
}
.work-social-stats__item:nth-child(2n){
  border-left: 1px solid rgba(20, 19, 17, 0.2);
}
.work-social-stats__item:nth-child(n+3){
  border-top: 1px solid rgba(20, 19, 17, 0.2);
}
.work-social-stats__value{
  margin: 0 0 6px;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1;
  letter-spacing: 0.01em;
  color: #27315f;
}
.work-social-stats__label{
  margin: 0;
  font-family: var(--font-body);
  font-size: clamp(10px, 0.95vw, 12px);
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.62);
}
.work-why-worked{
  padding: clamp(20px, 3.5vw, 36px) 0 clamp(38px, 5vw, 56px);
  background: #f3f1ec;
}
.work-why-worked__inner{
  max-width: 960px;
  margin: 0 auto;
  border-top: 1px solid rgba(20, 19, 17, 0.14);
  padding-top: clamp(20px, 3vw, 30px);
}
.work-why-worked__title{
  margin: 0 0 12px;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.4rem, 2.4vw, 2rem) + var(--heading-size-add));
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #1d1b19;
}
.work-why-worked__service{
  margin: 0 0 10px;
  font-family: var(--font-body);
  font-size: clamp(11px, 0.95vw, 12px);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.58);
}
.work-why-worked__text{
  margin: 0;
  font-family: var(--font-body);
  font-size: clamp(15px, 1.05vw, 18px);
  line-height: 1.75;
  color: rgba(20, 19, 17, 0.82);
}
.work-case-client-board__social-link{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  color: rgba(247, 241, 230, 0.9);
  border-radius: 4px;
  transition: background 0.2s ease, color 0.2s ease;
}
.work-case-client-board__social-link:hover{
  background: rgba(247, 241, 230, 0.12);
  color: #f7f1e6;
}
.work-case-client-board__social-icon{
  width: 22px;
  height: 22px;
}
@media (max-width: 860px){
  .work-case-client-board__grid{
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .work-case-client-board__cta-wrap{
    margin-top: clamp(22px, 3.5vw, 34px);
    padding-top: 0;
  }
  .work-case-client-board__social{
    justify-content: flex-start;
  }
  /* Next-case link is absolutely positioned to the grid bottom-right on desktop;
     on a single-column stack that sits over the moss "About" copy — use normal flow. */
  .work-case-client-board__left p:has(> .work-case-client-board__next){
    margin-top: clamp(18px, 3vw, 28px);
    text-align: right;
  }
  .work-case-client-board__next{
    position: static;
    right: auto;
    bottom: auto;
    z-index: auto;
  }
  .work-social-stats__grid{
    grid-template-columns: 1fr;
  }
  .work-social-stats__item:nth-child(2n){
    border-left: 0;
  }
  .work-social-stats__item:nth-child(n+3){
    border-top: 0;
  }
  .work-social-stats__item + .work-social-stats__item{
    border-left: 0;
    border-top: 1px solid rgba(20, 19, 17, 0.2);
  }
  .work-why-worked{
    padding-bottom: clamp(30px, 7vw, 44px);
  }
}

.work-case-showcase{
  margin-top: clamp(8px, 2vw, 16px);
}
.work-case-showcase__lede{
  margin: 0 0 clamp(16px, 2vw, 22px);
  max-width: 62ch;
  font-size: 15px;
  line-height: 1.6;
  color: rgba(20, 19, 17, 0.62);
}
.work-case-mood-board{
  margin: 0;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(20, 19, 17, 0.1);
  background: rgba(247, 241, 230, 0.35);
}
.work-case-mood-board img{
  display: block;
  width: 100%;
  height: auto;
}
.brookstone-brand-swatches{
  display: flex;
  flex-wrap: wrap;
  gap: clamp(12px, 2vw, 18px);
  margin: clamp(18px, 2.5vw, 26px) 0 0;
  padding: 0;
  list-style: none;
}
.brookstone-brand-swatch{
  flex: 1 1 160px;
  min-height: 92px;
  border-radius: 10px;
  border: 1px solid rgba(20, 19, 17, 0.12);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 12px 14px;
  font-size: 13px;
  line-height: 1.35;
  box-sizing: border-box;
}
.brookstone-brand-swatch__name{
  display: block;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 11px;
  opacity: 0.92;
}
.brookstone-brand-swatch--navy{
  background: #163158;
  color: #fff;
}
.brookstone-brand-swatch--steel{
  background: #6e7072;
  color: #fff;
}
.brookstone-brand-swatch--slate{
  background: #4a5562;
  color: #fff;
}
.brookstone-brand-swatch--light{
  background: #dde1e6;
  color: rgba(20, 19, 17, 0.82);
}
.brookstone-brand-swatch--white{
  background: #fff;
  color: rgba(20, 19, 17, 0.82);
}

/* Cosmo Floral — brand palette (case study) */
.cosmo-brand-swatches{
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: clamp(10px, 2vw, 16px);
  margin: clamp(18px, 2.5vw, 26px) 0 0;
  padding: 0;
  list-style: none;
}
.cosmo-brand-swatch{
  min-height: 88px;
  border-radius: 10px;
  border: 1px solid rgba(20, 19, 17, 0.12);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 12px 14px;
  font-family: var(--font-body);
  font-size: 13px;
  line-height: 1.35;
  box-sizing: border-box;
}
.cosmo-brand-swatch__name{
  display: block;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 10px;
}
.cosmo-brand-swatch--wine{
  background: #622d1e;
  color: #fff;
}
.cosmo-brand-swatch--rose{
  background: #b8988d;
  color: #1a1816;
}
.cosmo-brand-swatch--blue{
  background: #a7c1df;
  color: #1a1816;
}
.cosmo-brand-swatch--olive{
  background: #828759;
  color: #fff;
}
.cosmo-brand-swatch--cream{
  background: #ebe9e2;
  color: #1a1816;
}
.cosmo-logo-identity-section{
  background: #ffffff;
  border-radius: 12px;
}
.cosmo-logo-line{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 24px);
}
.cosmo-logo-line__item{
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cosmo-logo-line__item img{
  display: block;
  width: 100%;
  max-width: 220px;
  height: auto;
}
.gradys-logo-identity-section{
  background: #ffffff;
  border-radius: 12px;
}
.gradys-logo-line{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 24px);
}
.gradys-logo-line__item{
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.gradys-logo-line__item img{
  display: block;
  width: 100%;
  max-width: 240px;
  height: auto;
}
.gradys-brand-swatches{
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 22px);
  margin: 0;
  padding: 0;
  list-style: none;
}
.gradys-brand-swatch{
  min-height: clamp(110px, 18vw, 170px);
  border-radius: 12px;
  border: 1px solid rgba(20, 19, 17, 0.14);
  display: flex;
  align-items: flex-end;
  padding: clamp(12px, 1.8vw, 16px);
  box-sizing: border-box;
}
.gradys-brand-swatch__name{
  font-family: var(--font-body);
  font-size: clamp(11px, 0.95vw, 13px);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.gradys-brand-swatch--charcoal{ background: #222a36; color: #f4efe5; }
.gradys-brand-swatch--red{ background: #c7152f; color: #fff5ef; }
.gradys-brand-swatch--terracotta{ background: #c44926; color: #fff5ef; }
.gradys-brand-swatch--green{ background: #4f6f66; color: #f3eee2; }
.gradys-brand-swatch--blue{ background: #acc1d0; color: #17303b; }
.gradys-brand-swatch--yellow{ background: #f0cf8f; color: #3a2d18; }
.gradys-brand-swatch--cream{ background: #d8d0bf; color: #2c2620; }

.gradys-texture-grid{
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 22px);
}
.gradys-texture-card{
  margin: 0;
}
.gradys-texture-card img{
  display: block;
  width: 100%;
  height: auto;
  border-radius: 10px;
  border: 1px solid rgba(20, 19, 17, 0.14);
}
.gradys-texture-card figcaption{
  margin-top: 8px;
  font-family: var(--font-body);
  font-size: clamp(11px, 0.95vw, 13px);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.66);
}
.gradys-moodboard{
  margin: clamp(8px, 1.4vw, 14px) 0 0;
}
.gradys-moodboard img{
  display: block;
  width: min(100%, 760px);
  height: auto;
  margin-inline: auto;
  border-radius: 12px;
  border: 1px solid rgba(20, 19, 17, 0.12);
}
.gradys-icon-collage{
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(10px, 1.6vw, 18px);
  margin-top: clamp(10px, 1.8vw, 16px);
}
.gradys-icon-collage__item{
  margin: 0;
  padding: clamp(8px, 1vw, 12px);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.74);
  opacity: 0;
  transform: translateY(16px) scale(0.97) rotate(var(--rot));
  transition:
    transform 0.45s ease,
    opacity 0.45s ease;
  transition-delay: var(--delay);
}
.gradys-icon-collage.is-visible .gradys-icon-collage__item{
  opacity: 1;
  transform: translateY(0) scale(1) rotate(var(--rot));
}
.gradys-icon-collage__item:hover{
  transform: translateY(-5px) scale(1.035) rotate(var(--rot));
}
.gradys-icon-collage__item img{
  display: block;
  width: 82%;
  margin: 0 auto;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.06));
  transition: transform 0.35s ease, filter 0.35s ease;
}
.gradys-icon-collage__item:hover img{
  transform: translateY(-1px);
  filter: drop-shadow(0 10px 14px rgba(0, 0, 0, 0.1));
}
.gradys-icon-collage__item--1{ grid-column: span 3; --rot: -2deg; --delay: 0.02s; }
.gradys-icon-collage__item--2{ grid-column: span 2; --rot: 1deg; --delay: 0.04s; }
.gradys-icon-collage__item--3{ grid-column: span 4; --rot: -1deg; --delay: 0.06s; }
.gradys-icon-collage__item--4{ grid-column: span 3; --rot: 2deg; --delay: 0.08s; }
.gradys-icon-collage__item--5{ grid-column: span 3; --rot: -1deg; --delay: 0.1s; }
.gradys-icon-collage__item--6{ grid-column: span 3; --rot: 1deg; --delay: 0.12s; }
.gradys-icon-collage__item--7{ grid-column: span 2; --rot: -2deg; --delay: 0.14s; }
.gradys-icon-collage__item--8{ grid-column: span 4; --rot: 1deg; --delay: 0.16s; }
.gradys-icon-collage__item--9{ grid-column: span 3; --rot: -1deg; --delay: 0.18s; }
.gradys-icon-collage__item--10{ grid-column: span 3; --rot: 2deg; --delay: 0.2s; }
.gradys-icon-collage__item--11{ grid-column: span 4; --rot: -1deg; --delay: 0.22s; }
.gradys-icon-collage__item--12{ grid-column: span 2; --rot: 1deg; --delay: 0.24s; }
.gradys-icon-collage__item--13{ grid-column: span 4; --rot: -2deg; --delay: 0.26s; }
.gradys-icon-collage__item--14{ grid-column: span 3; --rot: 1deg; --delay: 0.28s; }
.gradys-icon-collage__item--15{ grid-column: span 3; --rot: -1deg; --delay: 0.3s; }
.gradys-icon-collage__item--16{ grid-column: span 2; --rot: 2deg; --delay: 0.32s; }
.gradys-icon-collage__item--17{ grid-column: span 2; --rot: -1deg; --delay: 0.34s; }
.gradys-icon-collage__item--18{ grid-column: span 3; --rot: 1deg; --delay: 0.36s; }
@media (max-width: 720px){
  .cosmo-brand-swatches{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .cosmo-logo-line{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gradys-logo-line{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .hsf-logo-line{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .revd-logo-line{
    grid-template-columns: 1fr;
  }
  .gradys-brand-swatches,
  .gradys-texture-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gradys-icon-collage{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gradys-icon-collage__item{
    grid-column: span 1 !important;
    --rot: 0deg;
  }
}
@media (max-width: 400px){
  .cosmo-brand-swatches{
    grid-template-columns: 1fr;
  }
  .gradys-brand-swatches,
  .gradys-texture-grid{
    grid-template-columns: 1fr;
  }
}
@media (max-width: 700px){
  .pennwood-brand-swatches{
    display: grid;
    grid-template-columns: 1fr;
  }
  .page-pennwood-case .branding-case-logo-grid--board{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px){
  .section.work-case-brand-swatches ul[class*="brand-swatches"]{
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: clamp(6px, 1.5vw, 12px);
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-gutter: stable;
  }
  .section.work-case-brand-swatches ul[class*="brand-swatches"] > li[class*="brand-swatch"]{
    flex: 1 1 0 !important;
    min-width: 0 !important;
  }
}

.brookstone-brand-strategy{
  margin-top: clamp(20px, 3.5vw, 36px);
}
.pennwood-brand-strategy{
  margin-top: clamp(20px, 3.5vw, 36px);
}
.pennwood-standards-copy{
  margin-top: clamp(18px, 3vw, 28px);
  display: grid;
  gap: 10px;
}
.pennwood-brand-swatches{
  display: flex;
  flex-wrap: wrap;
  gap: clamp(12px, 2vw, 18px);
  margin: clamp(18px, 2.5vw, 26px) 0 0;
  padding: 0;
  list-style: none;
}
.pennwood-brand-swatch{
  flex: 1 1 160px;
  min-height: 92px;
  border-radius: 10px;
  border: 1px solid rgba(20, 19, 17, 0.12);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 12px 14px;
  font-size: 13px;
  line-height: 1.35;
  box-sizing: border-box;
}
.pennwood-brand-swatch__name{
  display: block;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 11px;
  opacity: 0.92;
}
.pennwood-brand-swatch--navy{
  background: rgb(13, 22, 61);
  color: #fff;
}
.pennwood-brand-swatch--blue{
  background: rgb(155, 198, 233);
  color: rgba(20, 19, 17, 0.82);
}
.pennwood-brand-swatch--stone{
  background: rgb(51, 50, 48);
  color: #fff;
}
.pennwood-brand-swatch--black{
  background: rgb(0, 0, 0);
  color: #fff;
}
.pennwood-brand-swatch--sand{
  background: rgb(223, 215, 202);
  color: rgba(20, 19, 17, 0.82);
}
.pennwood-brand-swatch--silver{
  background: rgb(200, 199, 197);
  color: rgba(20, 19, 17, 0.82);
}
.pennwood-brand-swatch--white{
  background: #fff;
  color: rgba(20, 19, 17, 0.82);
}

/* Logo-strip palette strips — Everflame, Hey Peaches, Lakewood, Living Room Church, Vizion, Wittness */
.everflame-brand-swatches,
.hey-peaches-brand-swatches,
.lakewood-brand-swatches,
.lrc-brand-swatches,
.vizion-brand-swatches,
.witness-brand-swatches{
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: clamp(10px, 2vw, 16px);
  margin: clamp(18px, 2.5vw, 26px) 0 0;
  padding: 0;
  list-style: none;
}
.vizion-brand-swatches{
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.lrc-brand-swatches{
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.everflame-brand-swatch,
.hey-peaches-brand-swatch,
.lakewood-brand-swatch,
.lrc-brand-swatch,
.vizion-brand-swatch,
.witness-brand-swatch{
  min-height: 92px;
  border-radius: 10px;
  border: 1px solid rgba(20, 19, 17, 0.12);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 4px;
  padding: 12px 14px;
  font-family: var(--font-body);
  font-size: 13px;
  line-height: 1.35;
  box-sizing: border-box;
}
.everflame-brand-swatch__name,
.hey-peaches-brand-swatch__name,
.lakewood-brand-swatch__name,
.lrc-brand-swatch__name,
.vizion-brand-swatch__name,
.witness-brand-swatch__name{
  display: block;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 10px;
}
.everflame-brand-swatch--navy{ background: #0f172a; color: #f4efe5; }
.everflame-brand-swatch--orange{ background: #f97316; color: #fff; }
.everflame-brand-swatch--cream{ background: #f5f0e6; color: #1a1816; }
.everflame-brand-swatch--sky{ background: #cfe9fc; color: #1a1816; }
.everflame-brand-swatch--butter{ background: #fef9c3; color: #1a1816; }
.hey-peaches-brand-swatch--peach{ background: #d87666; color: #1a1816; }
.hey-peaches-brand-swatch--blush{ background: #f6d7c3; color: #1a1816; }
.hey-peaches-brand-swatch--cream{ background: #ebe4d5; color: #1a1816; }
.hey-peaches-brand-swatch--sage{ background: #757d71; color: #1a1816; }
.hey-peaches-brand-swatch--plum{ background: #26251f; color: #f4eee6; }
.lakewood-brand-swatch--seashell{ background: #fff9f1; color: #1a1816; }
.lakewood-brand-swatch--navy{ background: #2f3e46; color: #f4efe5; }
.lakewood-brand-swatch--sage{ background: #97a78c; color: #1a1816; }
.lakewood-brand-swatch--driftwood{ background: #b5b294; color: #1a1816; }
.lakewood-brand-swatch--silver{ background: #c0c0c0; color: #1a1816; }
.lrc-brand-swatch--ink{ background: #161c22; color: #f4efe5; }
.lrc-brand-swatch--indigo{ background: #162641; color: #f4efe5; }
.lrc-brand-swatch--ivory{ background: #f0f0e6; color: #1a1816; }
.lrc-brand-swatch--cream{ background: #fefce8; color: #1a1816; }
.lrc-brand-swatch--igloo{ background: #93c5e6; color: #1a1816; }
.vizion-brand-swatch--navy{ background: #1e3a5f; color: #f4efe5; }
.vizion-brand-swatch--horizon{
  --tw-text-opacity: 1;
  background: rgb(107 155 196 / var(--tw-text-opacity, 1));
  color: #1a1816;
}
.vizion-brand-swatch--cloud{ background: #ffffff; color: #1a1816; }
.vizion-brand-swatch--black{ background: #000000; color: #f4efe5; }
.witness-brand-swatch--espresso{ background: #3a2f2a; color: #f4efe5; }
.witness-brand-swatch--latte{ background: #d7ccc4; color: #1a1816; }
.witness-brand-swatch--sage{ background: #8b9a7e; color: #fff; }
.witness-brand-swatch--rust{ background: #9c6b43; color: #fff; }
.witness-brand-swatch--oat{ background: #efe8df; color: #1a1816; }
@media (max-width: 900px){
  .everflame-brand-swatches,
  .hey-peaches-brand-swatches,
  .lakewood-brand-swatches,
  .lrc-brand-swatches,
  .vizion-brand-swatches,
  .witness-brand-swatches{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 520px){
  .everflame-brand-swatches,
  .hey-peaches-brand-swatches,
  .lakewood-brand-swatches,
  .lrc-brand-swatches,
  .vizion-brand-swatches,
  .witness-brand-swatches{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 400px){
  .everflame-brand-swatches,
  .hey-peaches-brand-swatches,
  .lakewood-brand-swatches,
  .lrc-brand-swatches,
  .vizion-brand-swatches,
  .witness-brand-swatches{
    grid-template-columns: 1fr;
  }
}

.page-pennwood-case .branding-case-logo-grid--board{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(18px, 2.6vw, 28px);
}
.page-pennwood-case .branding-case__logos .branding-case-logo__pad,
.page-pennwood-case .branding-case__logos .branding-case-logo__pad--dark,
.page-pennwood-case .branding-case__logos .branding-case-logo__pad--white{
  background: transparent;
  border: 0;
  border-radius: 0;
  min-height: 0;
  padding: 0;
}
.page-pennwood-case .branding-case__logos .branding-case-logo__pad img{
  max-height: min(220px, 42vw);
}
.page-vizion-case .branding-case__logos .branding-case-logo-grid{
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.page-vizion-case .branding-case__logos .branding-case-logo__pad,
.page-vizion-case .branding-case__logos .branding-case-logo__pad--dark,
.page-vizion-case .branding-case__logos .branding-case-logo__pad--white{
  background: transparent;
  border: 0;
  border-radius: 0;
  min-height: 0;
  padding: 0;
}
.page-vizion-case .branding-case__logos .branding-case-logo__pad img{
  max-height: 140px;
}
.page-vizion-case #main .vizion-brand-in-use-scroll .branding-case-scroll__frame{
  aspect-ratio: 1 / 1;
}
.page-vizion-case #main .vizion-brand-in-use-scroll .branding-case-scroll__frame img{
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  object-position: center;
}
@media (max-width: 900px){
  .page-vizion-case .branding-case__logos .branding-case-logo-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.brookstone-case-logos .branding-case-logo__pad{
  min-height: min(200px, 42vw);
  background: #ffffff;
  border-color: rgba(20, 19, 17, 0.08);
}
.brookstone-case-logos .branding-case-logo__pad img{
  max-height: min(240px, 52vw);
  max-width: 100%;
}
.work-case-showcase-subtitle{
  margin: clamp(28px, 4vw, 40px) 0 clamp(14px, 2vw, 20px);
  font-family: var(--font-heading);
  font-size: clamp(15px, 1.3vw, 18px);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.55);
}
.work-case-showcase-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(20px, 3vw, 32px);
}
.work-case-showcase-grid--one{
  grid-template-columns: 1fr;
  max-width: min(720px, 100%);
  margin-inline: auto;
}
.work-case-showcase-grid--three{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 1000px){
  .work-case-showcase-grid--three{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.work-case-showcase-card--video .work-case-showcase-card__media{
  aspect-ratio: 9 / 16;
  max-height: min(72vh, 820px);
}
.work-case-showcase-card--video .work-case-showcase-card__media video{
  object-fit: contain;
  background: #0a0a0a;
}
.work-case-showcase-card{
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid rgba(20, 19, 17, 0.1);
  border-radius: 12px;
  overflow: hidden;
  background: rgba(247, 241, 230, 0.4);
}
.work-case-showcase-card__media{
  aspect-ratio: 4 / 5;
  background: rgba(20, 19, 17, 0.06);
}
.work-case-showcase-card__media img,
.work-case-showcase-card__media video{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.work-case-showcase-card__body{
  padding: clamp(16px, 2vw, 22px);
}
.work-case-showcase-card__title{
  margin: 0 0 8px;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.5);
}
.work-case-showcase-card__desc{
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
  color: rgba(20, 19, 17, 0.72);
}
.branding-case-logo-grid--board{
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
}
/* Single full lockup on case pages — taller than default 76px cap */
.branding-case-logo-grid--board:has(> .branding-case-logo:only-child) .branding-case-logo__pad{
  min-height: min(300px, 48vh);
}
.branding-case-logo-grid--board:has(> .branding-case-logo:only-child) .branding-case-logo__pad img{
  max-height: min(260px, 44vh);
}
.branding-case-logo__text{
  margin: 8px 0 0;
  padding: 0 6px;
  font-size: 14px;
  line-height: 1.55;
  color: rgba(20, 19, 17, 0.68);
  text-align: center;
  max-width: 42ch;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 900px){
  .work-case-intro-split{
    grid-template-columns: 1fr;
  }
  .work-case-intro-split__hero{
    order: -1;
    max-height: 48vh;
  }
}
@media (max-width: 640px){
  .work-case-showcase-grid{
    grid-template-columns: 1fr;
  }
}
.work-case__live-link{
  margin: 0 0 clamp(18px, 2.5vw, 24px);
  font-size: var(--font-body-size);
  line-height: 1.6;
  color: rgba(20, 19, 17, 0.62);
}
.work-case__live-link a{
  color: rgba(20, 19, 17, 0.72);
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.work-case__live-link a:hover{
  color: rgba(20, 19, 17, 0.95);
}
.work-case-gallery-title{
  margin: 0 0 clamp(20px, 3vw, 28px);
  font-family: var(--font-heading);
  font-size: clamp(20px, 2.2vw, 26px);
  font-weight: 500;
  letter-spacing: -0.02em;
  color: rgba(20, 19, 17, 0.94);
}
.work-case-gallery{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(16px, 2.4vw, 24px);
}
.work-case-gallery--one{
  grid-template-columns: 1fr;
  max-width: min(920px, 100%);
}
.work-case-gallery__item{
  margin: 0;
}
.work-case-gallery__item img{
  display: block;
  width: 100%;
  height: auto;
  border-radius: 6px;
  border: 1px solid rgba(20, 19, 17, 0.08);
}
.work-case-gallery__caption{
  margin: 10px 0 0;
  font-family: var(--font-body);
  font-size: 13px;
  line-height: 1.5;
  color: rgba(20, 19, 17, 0.58);
}
@media (max-width: 640px){
  .work-case-gallery:not(.work-case-gallery--one){
    grid-template-columns: 1fr;
  }
}

/* Case studies — social & motion grid (local client folders e.g. Blaze/) */
.work-case-social-panel{
  width: 100%;
}
.work-case-social-panel__intro{
  text-align: left;
  margin-bottom: clamp(28px, 4vw, 44px);
}
.work-case-social-panel__title{
  margin: 0 0 clamp(14px, 2vw, 20px);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-style: normal;
  font-weight: 400;
  font-size: calc(clamp(2rem, 4.2vw, 3.25rem) + var(--heading-size-add));
  line-height: 1.12;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.94);
  font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
  font-feature-settings: "liga" 1, "clig" 1, "calt" 1, "dlig" 1;
}
.work-case-social-lead{
  margin: 0;
  max-width: 62ch;
  font-family: var(--font-body);
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.62);
}
.work-case-social-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: clamp(18px, 2.5vw, 26px);
  align-items: start;
}
.work-case-social-grid--curriculum{
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(28px, 3.5vw, 44px) clamp(20px, 2.5vw, 32px);
}
.work-case-social-item{
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  align-items: stretch;
}
.work-case-social-item__frame{
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid rgba(20, 19, 17, 0.1);
  background: rgba(20, 19, 17, 0.04);
}
.work-case-social-item--still .work-case-social-item__frame{
  aspect-ratio: 4 / 5;
}
.work-case-social-grid--curriculum .work-case-social-item--still .work-case-social-item__frame{
  aspect-ratio: 9 / 16;
}
.work-case-social-item--still-landscape{
  width: 100%;
  max-width: min(920px, 100%);
  margin-inline: auto;
}
.work-case-social-item--still-landscape .work-case-social-item__frame{
  aspect-ratio: 16 / 9;
}
.work-case-social-grid--curriculum > .work-case-social-item--still-landscape.work-case-social-item--span-row{
  grid-column: 1 / -1;
  max-width: 100%;
}
.work-case-social-grid--curriculum > .work-case-social-item--still-landscape:not(.work-case-social-item--span-row){
  max-width: 100%;
  margin-inline: 0;
}
.work-case-social-item--still img,
.work-case-social-item--still-landscape img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.work-case-social-item--motion .work-case-social-item__frame{
  aspect-ratio: 9 / 16;
  max-height: min(680px, 78vh);
  width: 100%;
  max-width: 420px;
  margin-inline: auto;
  background: #121210;
}
.work-case-social-grid--curriculum .work-case-social-item--motion .work-case-social-item__frame{
  max-width: none;
  max-height: none;
  margin-inline: 0;
}
.work-case-social-item--motion video{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.work-case-social-caption{
  margin: clamp(12px, 1.8vw, 16px) 0 0;
  padding: 0 4px;
  font-family: var(--font-body);
  font-size: clamp(10px, 0.95vw, 11px);
  font-weight: 500;
  letter-spacing: 0.16em;
  line-height: 1.35;
  text-transform: uppercase;
  text-align: center;
  text-decoration: underline;
  text-underline-offset: 5px;
  text-decoration-thickness: 1px;
  color: rgba(20, 19, 17, 0.52);
}
.work-case-social-item .work-case-gallery__caption{
  margin-top: 10px;
}
@media (max-width: 960px){
  .work-case-social-grid--curriculum{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 520px){
  .work-case-social-grid{
    grid-template-columns: 1fr;
  }
  .work-case-social-grid--curriculum{
    grid-template-columns: 1fr;
  }
  .work-case-social-item--motion .work-case-social-item__frame{
    max-width: none;
    max-height: none;
  }
}

/* Branding case studies — logo grid + accordion sections with horizontal image strips */
.work-case--branding .branding-case__logos{
  width: 100%;
}
.page-work-case h1,
.page-work-case h2{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
  font-feature-settings: "liga" 1, "clig" 1, "calt" 1, "dlig" 1;
  font-weight: 400;
}
.page-work-case h3,
.page-work-case h4,
.page-work-case h5,
.page-work-case h6{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-variant-ligatures: none;
  font-feature-settings: normal;
  font-weight: 400;
}
.branding-case__section-title{
  margin: 0 0 clamp(18px, 2.5vw, 26px);
  font-family: var(--font-heading);
  font-size: clamp(20px, 2.2vw, 26px);
  font-weight: 500;
  letter-spacing: -0.02em;
  color: rgba(20, 19, 17, 0.94);
}
.work-case--branding .branding-case__story{
  margin: 0 0 clamp(28px, 4vw, 40px);
  max-width: none;
  font-family: var(--font-body);
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.62);
}
.branding-case-logo-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
  gap: clamp(16px, 2.4vw, 22px);
  align-items: stretch;
}
.branding-case-logo{
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  text-align: center;
}
.branding-case-logo:has(.branding-case-logo-grid__label){
  gap: 8px;
}
.branding-case-logo__pad{
  width: 100%;
  min-height: 112px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(16px, 2.8vw, 26px);
  border-radius: 10px;
  border: 1px solid rgba(20, 19, 17, 0.1);
  background: rgba(247, 241, 230, 0.72);
  box-sizing: border-box;
}
.branding-case-logo__pad--dark{
  background: #1c1b19;
  border-color: rgba(255, 255, 255, 0.08);
}
.branding-case-logo__pad--white{
  background: #ffffff;
  border-color: rgba(20, 19, 17, 0.12);
}
.branding-case-logo__pad--cultivate-mark img{
  max-height: min(132px, 32vw);
}
.branding-case-logo__pad img{
  max-width: 100%;
  max-height: 76px;
  width: auto;
  height: auto;
  object-fit: contain;
}
.branding-case-logo__caption{
  margin: 0;
  padding: 0 4px;
  font-family: var(--font-body);
  font-size: clamp(10px, 0.95vw, 11px);
  font-weight: 500;
  letter-spacing: 0.14em;
  line-height: 1.35;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.52);
}
.branding-case-accordion .accordion summary{
  gap: 12px;
}
.branding-case-accordion--fullbleed .branding-case-accordion__intro .work-case-showcase__lede{
  margin-bottom: 0;
}
.branding-case-accordion__fullbleed-strip{
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding-left: max(20px, env(safe-area-inset-left));
  padding-right: max(20px, env(safe-area-inset-right));
  box-sizing: border-box;
}
.branding-case-accordion__fullbleed-strip .accordions{
  margin-top: clamp(10px, 1.6vw, 16px);
}
/* Brookstone: image strip without accordion chrome — white band, no tan <details> panel */
.branding-case-accordion__fullbleed-strip.brookstone-brand-action-scroll{
  background: #ffffff;
  padding-top: clamp(10px, 1.6vw, 18px);
  padding-bottom: clamp(4px, 1vw, 10px);
}
.branding-case-accordion__fullbleed-strip.brookstone-brand-action-scroll .branding-case-scroll-wrap{
  margin-top: 0;
}
.branding-case-accordion .accordion summary .branding-case-acc-end{
  display: inline-flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}
.branding-case-acc-icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5em;
  font-size: 18px;
  line-height: 1;
  color: rgba(20, 19, 17, 0.45);
}
.branding-case-acc-icon::before{
  content: "+";
}
details.accordion[open] > summary .branding-case-acc-icon::before{
  content: "\2212";
}
.acc-panel--branding-scroll{
  padding: 8px 4px 16px;
}
.branding-case-scroll-hint{
  margin: 0 16px 10px;
  font-family: var(--font-body);
  font-size: 12px;
  line-height: 1.4;
  color: rgba(20, 19, 17, 0.48);
}
.branding-case-scroll{
  display: flex;
  gap: clamp(12px, 2vw, 18px);
  overflow-x: auto;
  padding: 4px 12px 14px;
  margin: 0 -12px;
  scroll-snap-type: x proximity;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.branding-case-scroll::-webkit-scrollbar{
  display: none;
}
.branding-case-scroll-wrap{
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}
/* Logo strip: full-width row, prev/next centered beneath (branding page) */
.branding-case-scroll-wrap--arrows-below{
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: clamp(10px, 1.5vw, 16px);
}
.branding-case-scroll-wrap--arrows-below .branding-case-scroll{
  grid-column: 1;
  grid-row: 1;
  margin: 0;
}
.branding-case-scroll-arrows-row{
  grid-column: 1;
  grid-row: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: clamp(14px, 2.5vw, 22px);
}
.branding-case-scroll--logos{
  scroll-snap-type: x mandatory;
}
.branding-case-scroll--logos .branding-case-scroll__item--logo{
  flex: 0 0 clamp(200px, 38vw, 280px);
  scroll-snap-align: center;
}
.branding-case-scroll--logos .branding-case-scroll__frame--logo-link{
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(100px, 14vw, 132px);
  padding: clamp(14px, 2vw, 22px);
  box-sizing: border-box;
  text-decoration: none;
  color: inherit;
  border-radius: 10px;
  border: 1px solid rgba(20, 19, 17, 0.1);
  background: #fff;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.branding-case-scroll--logos .branding-case-scroll__frame--logo-link:hover{
  border-color: rgba(26, 51, 41, 0.28);
  box-shadow: 0 6px 20px rgba(20, 19, 17, 0.06);
}
.branding-case-scroll--logos .branding-case-scroll__frame--logo-link:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.45);
  outline-offset: 3px;
}
.branding-case-scroll--logos .branding-case-scroll__frame--logo-link img{
  display: block;
  max-height: clamp(52px, 9vw, 76px);
  width: auto;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}
.branding-page-client-logos-section,
.website-page-client-logos-section,
.social-page-client-logos-section{
  padding-block: clamp(40px, 5vw, 64px);
  border-top: 1px solid rgba(20, 19, 17, 0.06);
  background: #fff;
}
.service-page-client-logos{
  padding: clamp(8px, 1.2vw, 14px) 0 clamp(4px, 1vw, 8px);
}
/* Service pages — client logos: full viewport width, white only, floating marks */
.client-logos-strip--fullbleed{
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding-left: max(20px, env(safe-area-inset-left));
  padding-right: max(20px, env(safe-area-inset-right));
  box-sizing: border-box;
  border-top: 0;
  background: #fff;
}
.client-logos-strip--fullbleed .container{
  width: 100%;
  max-width: none;
  margin-inline: 0;
}
.client-logos-strip--fullbleed .service-page-client-logos{
  background: #fff;
}
.client-logos-strip--fullbleed .branding-case-scroll--logos{
  margin: 0;
  padding: clamp(6px, 1vw, 10px) 0 clamp(10px, 1.4vw, 16px);
}
.client-logos-strip--fullbleed .branding-case-scroll--logos .branding-case-scroll__frame--logo-link{
  min-height: 0;
  padding: clamp(10px, 2vw, 20px);
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transition: opacity 0.2s ease;
}
.client-logos-strip--fullbleed .branding-case-scroll--logos .branding-case-scroll__frame--logo-link:hover{
  border-color: transparent;
  box-shadow: none;
  opacity: 0.88;
}
.client-logos-strip--fullbleed .branding-case-scroll-arrow{
  background: #fff;
}
.branding-case-scroll-arrow{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(20, 19, 17, 0.18);
  border-radius: 999px;
  background: rgba(250, 249, 246, 0.95);
  color: rgba(20, 19, 17, 0.82);
  cursor: pointer;
  font-size: 24px;
  line-height: 1;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease, opacity .2s ease;
}
.branding-case-scroll-arrow:hover{
  background: rgba(255, 255, 255, 1);
  border-color: rgba(20, 19, 17, 0.32);
}
.branding-case-scroll-arrow:disabled{
  opacity: .35;
  cursor: default;
}
.branding-case-scroll-arrow:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.5);
  outline-offset: 2px;
}
.branding-case-scroll:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.4);
  outline-offset: 3px;
}
.branding-case-scroll__item{
  flex: 0 0 min(78vw, 420px);
  scroll-snap-align: start;
  margin: 0;
}
.branding-case-scroll__frame{
  border-radius: 10px;
  border: 1px solid rgba(20, 19, 17, 0.1);
  overflow: hidden;
  background: rgba(20, 19, 17, 0.04);
}
.branding-case-scroll__frame img{
  display: block;
  width: 100%;
  height: auto;
  vertical-align: middle;
}
.branding-case-scroll__frame video{
  display: block;
  width: 100%;
  height: auto;
  max-height: min(520px, 72vh);
  background: #121210;
}
.branding-case-scroll__caption{
  margin: 10px 4px 0;
  font-family: var(--font-body);
  font-size: 12px;
  line-height: 1.45;
  color: rgba(20, 19, 17, 0.55);
}
@media (max-width: 520px){
  .branding-case-scroll-wrap{
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .branding-case-scroll-arrow{
    display: none;
  }
  .branding-case-scroll-wrap--arrows-below .branding-case-scroll-arrow{
    display: inline-flex;
  }
  .branding-case-scroll__item{
    flex-basis: 88vw;
  }
}

.brookstone-case-site-walkthrough__cta{
  margin: clamp(18px, 2.5vw, 26px) 0 0;
  text-align: left;
}
.brookstone-case-site-walkthrough__content{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 48%);
  gap: clamp(16px, 2.4vw, 30px);
  align-items: center;
}
.brookstone-case-site-walkthrough__content .brookstone-moodboard{
  margin: 0;
}
.brookstone-case-site-walkthrough__copy{
  display: flex;
  flex-direction: column;
}
.brookstone-case-site-walkthrough .work-case-showcase__lede{
  margin-top: 0;
  font-size: clamp(16px, 1.35vw, 18px);
  line-height: 1.55;
}
.brookstone-case-site-walkthrough .branding-case__section-title{
  margin-top: 0;
  margin-bottom: clamp(16px, 2vw, 22px);
}
@media (max-width: 900px){
  .brookstone-case-site-walkthrough__content{
    grid-template-columns: 1fr;
    align-items: start;
  }
  .brookstone-case-site-walkthrough__content .brookstone-moodboard{
    margin-top: clamp(10px, 2vw, 14px);
  }
  .brookstone-case-site-walkthrough .branding-case__section-title{
    margin-top: 0;
  }
}

/* Brookstone case study — 4:5 crop for photo strips (logos use default contain layout) */
.page-brookstone-case #main .branding-case-scroll__frame{
  aspect-ratio: 4 / 5;
}
.page-brookstone-case #main .branding-case-scroll__frame img{
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  object-position: center;
}
.page-pennwood-case #main .branding-case-scroll__item--pennwood-golf .branding-case-scroll__frame{
  aspect-ratio: 672 / 900;
}
.page-pennwood-case #main .branding-case-scroll__item--pennwood-golf .branding-case-scroll__frame img{
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  object-position: top center;
}

/* flintrock — created graphics carousel (4:5 frames) */
.branding-case-accordion[aria-labelledby="flintrock-created-graphics-heading"] .branding-case-accordion__intro .work-case-showcase__lede{
  margin-bottom: clamp(18px, 2.6vw, 28px);
}
.branding-case-accordion[aria-labelledby="pennwood-brand-action-heading"] .branding-case-accordion__intro .work-case-showcase__lede{
  margin-bottom: clamp(18px, 2.6vw, 28px);
}
.page-flintrock-case #main .flintrock-posts-carousel{
  background: #ffffff;
  padding-top: clamp(10px, 1.6vw, 18px);
  padding-bottom: clamp(4px, 1vw, 10px);
}
.page-flintrock-case #main .flintrock-posts-carousel .branding-case-scroll-wrap{
  margin-top: 0;
}
.page-flintrock-case #main .flintrock-posts-carousel .branding-case-scroll__frame{
  aspect-ratio: 4 / 5;
}
.page-flintrock-case #main .flintrock-posts-carousel .branding-case-scroll__frame img{
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  object-position: center;
}

.branding-case-accordion[aria-labelledby="blaze-yoga-fitness-carousel-heading"] .branding-case-accordion__intro .work-case-showcase__lede{
  margin-bottom: clamp(18px, 2.6vw, 28px);
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-social-carousel{
  background: #ffffff;
  padding-top: clamp(10px, 1.6vw, 18px);
  padding-bottom: clamp(4px, 1vw, 10px);
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-social-carousel .branding-case-scroll-wrap{
  margin-top: 0;
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-social-carousel .branding-case-scroll__frame{
  aspect-ratio: 4 / 5;
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-social-carousel .branding-case-scroll__frame img{
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  object-position: center;
}
.page-blaze-yoga-fitness-case #main .work-case-client-end .work-case__cta + .work-case__cta{
  margin-top: clamp(12px, 2vw, 18px);
}

/* Blaze Yoga — editorial “why it worked” strip (filmstrip + copy) */
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split{
  background: #e8e6dc;
  padding: clamp(48px, 7vw, 88px) 0;
  border-top: 1px solid rgba(20, 19, 17, 0.08);
  box-sizing: border-box;
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__inner{
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: center;
  max-width: min(1120px, 100%);
  margin: 0 auto;
  box-sizing: border-box;
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__visual{
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(12px, 2vw, 22px);
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__rail-text{
  margin: 0;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: lowercase;
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.42);
  max-height: min(340px, 52vh);
  flex-shrink: 0;
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__filmstrip{
  display: flex;
  flex-direction: row;
  align-items: stretch;
  background: #0f0f0f;
  padding: clamp(10px, 1.5vw, 14px) 0;
  border-radius: 3px;
  transform: rotate(-2.25deg);
  box-shadow: 0 22px 48px rgba(15, 14, 12, 0.22);
  flex-shrink: 0;
  max-width: min(100%, 320px);
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__film-stack{
  flex: 1 1 auto;
  min-width: 0;
  padding: 0 clamp(8px, 1.2vw, 12px);
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__film-perf{
  width: 13px;
  flex-shrink: 0;
  background-color: #141210;
  background-image: radial-gradient(circle at 50% 10px, rgba(255, 255, 255, 0.22) 2px, transparent 2.5px);
  background-size: 10px 22px;
  background-repeat: repeat-y;
  background-position: center top;
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__film-frame{
  border-radius: 1px;
  overflow: hidden;
  line-height: 0;
  background: #000;
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__film-frame + .blaze-yoga-editorial-split__film-frame{
  margin-top: 8px;
  padding-top: 8px;
  border-top: 2px solid #1c1c1c;
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__film-frame img{
  display: block;
  width: 100%;
  height: auto;
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__kicker{
  margin: 0 0 clamp(10px, 1.4vw, 14px);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.48);
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__title{
  margin: 0 0 clamp(18px, 2.6vw, 26px);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.75rem, 3.8vw, 2.65rem) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.12;
  color: #14120f;
  max-width: 24ch;
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__body{
  margin: 0 0 clamp(22px, 3vw, 30px);
  font-family: var(--font-body);
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.72;
  color: rgba(20, 19, 17, 0.78);
  max-width: 52ch;
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__cta{
  margin: 0;
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 26px;
  border-radius: 999px;
  border: 1px solid rgba(20, 19, 17, 0.85);
  background: transparent;
  color: #14120f;
  font-family: var(--font-button);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__btn:hover{
  background: rgba(20, 19, 17, 0.92);
  color: #faf9f6;
  border-color: rgba(20, 19, 17, 0.92);
}
.page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__btn:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.55);
  outline-offset: 3px;
}
@media (max-width: 820px){
  .page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__inner{
    grid-template-columns: 1fr;
    gap: clamp(28px, 5vw, 42px);
  }
  .page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__visual{
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__filmstrip{
    transform: rotate(-1.5deg);
    max-width: min(300px, 86vw);
    margin-inline: auto;
  }
  .page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__rail-text{
    writing-mode: horizontal-tb;
    transform: none;
    max-height: none;
    text-align: center;
    font-size: 11px;
    letter-spacing: 0.16em;
    margin-top: clamp(14px, 2.5vw, 20px);
  }
  .page-blaze-yoga-fitness-case #main .blaze-yoga-editorial-split__title{
    max-width: none;
  }
}

/* Outback Toys — editorial “why it worked” strip (filmstrip + copy) */
.page-outback-toys-case #main .outback-editorial-split{
  background: #e8e6dc;
  padding: clamp(48px, 7vw, 88px) 0;
  border-top: 1px solid rgba(20, 19, 17, 0.08);
  box-sizing: border-box;
}
.page-outback-toys-case #main .outback-editorial-split__inner{
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: center;
  max-width: min(1120px, 100%);
  margin: 0 auto;
  box-sizing: border-box;
}
.page-outback-toys-case #main .outback-editorial-split__visual{
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(12px, 2vw, 22px);
}
.page-outback-toys-case #main .outback-editorial-split__rail-text{
  margin: 0;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: lowercase;
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.42);
  max-height: min(340px, 52vh);
  flex-shrink: 0;
}
.page-outback-toys-case #main .outback-editorial-split__filmstrip{
  display: flex;
  flex-direction: row;
  align-items: stretch;
  background: #0f0f0f;
  padding: clamp(10px, 1.5vw, 14px) 0;
  border-radius: 3px;
  transform: rotate(-2.25deg);
  box-shadow: 0 22px 48px rgba(15, 14, 12, 0.22);
  flex-shrink: 0;
  max-width: min(100%, 320px);
}
.page-outback-toys-case #main .outback-editorial-split__film-stack{
  flex: 1 1 auto;
  min-width: 0;
  padding: 0 clamp(8px, 1.2vw, 12px);
}
.page-outback-toys-case #main .outback-editorial-split__film-perf{
  width: 13px;
  flex-shrink: 0;
  background-color: #141210;
  background-image: radial-gradient(circle at 50% 10px, rgba(255, 255, 255, 0.22) 2px, transparent 2.5px);
  background-size: 10px 22px;
  background-repeat: repeat-y;
  background-position: center top;
}
.page-outback-toys-case #main .outback-editorial-split__film-frame{
  border-radius: 1px;
  overflow: hidden;
  line-height: 0;
  background: #000;
}
.page-outback-toys-case #main .outback-editorial-split__film-frame + .outback-editorial-split__film-frame{
  margin-top: 8px;
  padding-top: 8px;
  border-top: 2px solid #1c1c1c;
}
.page-outback-toys-case #main .outback-editorial-split__film-frame img{
  display: block;
  width: 100%;
  height: auto;
}
.page-outback-toys-case #main .outback-editorial-split__kicker{
  margin: 0 0 clamp(10px, 1.4vw, 14px);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.48);
}
.page-outback-toys-case #main .outback-editorial-split__title{
  margin: 0 0 clamp(18px, 2.6vw, 26px);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.75rem, 3.8vw, 2.65rem) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.12;
  color: #14120f;
  max-width: 24ch;
}
.page-outback-toys-case #main .outback-editorial-split__body{
  margin: 0 0 clamp(22px, 3vw, 30px);
  font-family: var(--font-body);
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.72;
  color: rgba(20, 19, 17, 0.78);
  max-width: 52ch;
}
.page-outback-toys-case #main .outback-editorial-split__cta{
  margin: 0;
}
.page-outback-toys-case #main .outback-editorial-split__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 26px;
  border-radius: 999px;
  border: 1px solid rgba(20, 19, 17, 0.85);
  background: transparent;
  color: #14120f;
  font-family: var(--font-button);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.page-outback-toys-case #main .outback-editorial-split__btn:hover{
  background: rgba(20, 19, 17, 0.92);
  color: #faf9f6;
  border-color: rgba(20, 19, 17, 0.92);
}
.page-outback-toys-case #main .outback-editorial-split__btn:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.55);
  outline-offset: 3px;
}
@media (max-width: 820px){
  .page-outback-toys-case #main .outback-editorial-split__inner{
    grid-template-columns: 1fr;
    gap: clamp(28px, 5vw, 42px);
  }
  .page-outback-toys-case #main .outback-editorial-split__visual{
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .page-outback-toys-case #main .outback-editorial-split__filmstrip{
    transform: rotate(-1.5deg);
    max-width: min(300px, 86vw);
    margin-inline: auto;
  }
  .page-outback-toys-case #main .outback-editorial-split__rail-text{
    writing-mode: horizontal-tb;
    transform: none;
    max-height: none;
    text-align: center;
    font-size: 11px;
    letter-spacing: 0.16em;
    margin-top: clamp(14px, 2.5vw, 20px);
  }
  .page-outback-toys-case #main .outback-editorial-split__title{
    max-width: none;
  }
}

/* Lakewood Reserve — editorial "why it worked" strip (filmstrip + copy) */
.page-lakewood-reserve-case #main .lakewood-editorial-split{
  background: #e8e6dc;
  padding: clamp(48px, 7vw, 88px) 0;
  border-top: 1px solid rgba(20, 19, 17, 0.08);
  box-sizing: border-box;
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__inner{
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: center;
  max-width: min(1120px, 100%);
  margin: 0 auto;
  box-sizing: border-box;
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__visual{
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(12px, 2vw, 22px);
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__rail-text{
  margin: 0;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: lowercase;
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.42);
  max-height: min(340px, 52vh);
  flex-shrink: 0;
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__filmstrip{
  display: flex;
  flex-direction: row;
  align-items: stretch;
  background: #0f0f0f;
  padding: clamp(10px, 1.5vw, 14px) 0;
  border-radius: 3px;
  transform: rotate(-2.25deg);
  box-shadow: 0 22px 48px rgba(15, 14, 12, 0.22);
  flex-shrink: 0;
  max-width: min(100%, 320px);
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__film-stack{
  flex: 1 1 auto;
  min-width: 0;
  padding: 0 clamp(8px, 1.2vw, 12px);
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__film-perf{
  width: 13px;
  flex-shrink: 0;
  background-color: #141210;
  background-image: radial-gradient(circle at 50% 10px, rgba(255, 255, 255, 0.22) 2px, transparent 2.5px);
  background-size: 10px 22px;
  background-repeat: repeat-y;
  background-position: center top;
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__film-frame{
  border-radius: 1px;
  overflow: hidden;
  line-height: 0;
  background: #000;
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__film-frame + .lakewood-editorial-split__film-frame{
  margin-top: 8px;
  padding-top: 8px;
  border-top: 2px solid #1c1c1c;
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__film-frame img{
  display: block;
  width: 100%;
  height: auto;
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__kicker{
  margin: 0 0 clamp(10px, 1.4vw, 14px);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.48);
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__title{
  margin: 0 0 clamp(18px, 2.6vw, 26px);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.75rem, 3.8vw, 2.65rem) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.12;
  color: #14120f;
  max-width: 24ch;
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__body{
  margin: 0 0 clamp(22px, 3vw, 30px);
  font-family: var(--font-body);
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.72;
  color: rgba(20, 19, 17, 0.78);
  max-width: 52ch;
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__cta{
  margin: 0;
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 26px;
  border-radius: 999px;
  border: 1px solid rgba(20, 19, 17, 0.85);
  background: transparent;
  color: #14120f;
  font-family: var(--font-button);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__btn:hover{
  background: rgba(20, 19, 17, 0.92);
  color: #faf9f6;
  border-color: rgba(20, 19, 17, 0.92);
}
.page-lakewood-reserve-case #main .lakewood-editorial-split__btn:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.55);
  outline-offset: 3px;
}
@media (max-width: 820px){
  .page-lakewood-reserve-case #main .lakewood-editorial-split__inner{
    grid-template-columns: 1fr;
    gap: clamp(28px, 5vw, 42px);
  }
  .page-lakewood-reserve-case #main .lakewood-editorial-split__visual{
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .page-lakewood-reserve-case #main .lakewood-editorial-split__filmstrip{
    transform: rotate(-1.5deg);
    max-width: min(300px, 86vw);
    margin-inline: auto;
  }
  .page-lakewood-reserve-case #main .lakewood-editorial-split__rail-text{
    writing-mode: horizontal-tb;
    transform: none;
    max-height: none;
    text-align: center;
    font-size: 11px;
    letter-spacing: 0.16em;
    margin-top: clamp(14px, 2.5vw, 20px);
  }
  .page-lakewood-reserve-case #main .lakewood-editorial-split__title{
    max-width: none;
  }
}

/* flintrock Stables — editorial "why it worked" strip (filmstrip + copy) */
.page-flintrock-case #main .flintrock-editorial-split{
  background: #e8e6dc;
  padding: clamp(48px, 7vw, 88px) 0;
  border-top: 1px solid rgba(20, 19, 17, 0.08);
  box-sizing: border-box;
}
.page-flintrock-case #main .flintrock-editorial-split__inner{
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: center;
  max-width: min(1120px, 100%);
  margin: 0 auto;
  box-sizing: border-box;
}
.page-flintrock-case #main .flintrock-editorial-split__visual{
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(12px, 2vw, 22px);
}
.page-flintrock-case #main .flintrock-editorial-split__rail-text{
  margin: 0;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: lowercase;
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.42);
  max-height: min(340px, 52vh);
  flex-shrink: 0;
}
.page-flintrock-case #main .flintrock-editorial-split__filmstrip{
  display: flex;
  flex-direction: row;
  align-items: stretch;
  background: #0f0f0f;
  padding: clamp(10px, 1.5vw, 14px) 0;
  border-radius: 3px;
  transform: rotate(-2.25deg);
  box-shadow: 0 22px 48px rgba(15, 14, 12, 0.22);
  flex-shrink: 0;
  max-width: min(100%, 320px);
}
.page-flintrock-case #main .flintrock-editorial-split__film-stack{
  flex: 1 1 auto;
  min-width: 0;
  padding: 0 clamp(8px, 1.2vw, 12px);
}
.page-flintrock-case #main .flintrock-editorial-split__film-perf{
  width: 13px;
  flex-shrink: 0;
  background-color: #141210;
  background-image: radial-gradient(circle at 50% 10px, rgba(255, 255, 255, 0.22) 2px, transparent 2.5px);
  background-size: 10px 22px;
  background-repeat: repeat-y;
  background-position: center top;
}
.page-flintrock-case #main .flintrock-editorial-split__film-frame{
  border-radius: 1px;
  overflow: hidden;
  line-height: 0;
  background: #000;
}
.page-flintrock-case #main .flintrock-editorial-split__film-frame + .flintrock-editorial-split__film-frame{
  margin-top: 8px;
  padding-top: 8px;
  border-top: 2px solid #1c1c1c;
}
.page-flintrock-case #main .flintrock-editorial-split__film-frame img{
  display: block;
  width: 100%;
  height: auto;
}
.page-flintrock-case #main .flintrock-editorial-split__kicker{
  margin: 0 0 clamp(10px, 1.4vw, 14px);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.48);
}
.page-flintrock-case #main .flintrock-editorial-split__title{
  margin: 0 0 clamp(18px, 2.6vw, 26px);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.75rem, 3.8vw, 2.65rem) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.12;
  color: #14120f;
  max-width: 24ch;
}
.page-flintrock-case #main .flintrock-editorial-split__body{
  margin: 0 0 clamp(22px, 3vw, 30px);
  font-family: var(--font-body);
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.72;
  color: rgba(20, 19, 17, 0.78);
  max-width: 52ch;
}
.page-flintrock-case #main .flintrock-editorial-split__cta{
  margin: 0;
}
.page-flintrock-case #main .flintrock-editorial-split__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 26px;
  border-radius: 999px;
  border: 1px solid rgba(20, 19, 17, 0.85);
  background: transparent;
  color: #14120f;
  font-family: var(--font-button);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.page-flintrock-case #main .flintrock-editorial-split__btn:hover{
  background: rgba(20, 19, 17, 0.92);
  color: #faf9f6;
  border-color: rgba(20, 19, 17, 0.92);
}
.page-flintrock-case #main .flintrock-editorial-split__btn:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.55);
  outline-offset: 3px;
}
@media (max-width: 820px){
  .page-flintrock-case #main .flintrock-editorial-split__inner{
    grid-template-columns: 1fr;
    gap: clamp(28px, 5vw, 42px);
  }
  .page-flintrock-case #main .flintrock-editorial-split__visual{
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .page-flintrock-case #main .flintrock-editorial-split__filmstrip{
    transform: rotate(-1.5deg);
    max-width: min(300px, 86vw);
    margin-inline: auto;
  }
  .page-flintrock-case #main .flintrock-editorial-split__rail-text{
    writing-mode: horizontal-tb;
    transform: none;
    max-height: none;
    text-align: center;
    font-size: 11px;
    letter-spacing: 0.16em;
    margin-top: clamp(14px, 2.5vw, 20px);
  }
  .page-flintrock-case #main .flintrock-editorial-split__title{
    max-width: none;
  }
}

.branding-case-accordion[aria-labelledby="outback-toys-social-heading"] .branding-case-accordion__intro .work-case-showcase__lede{
  margin-bottom: clamp(18px, 2.6vw, 28px);
}
.page-outback-toys-case #main .outback-toys-social-carousel{
  background: #ffffff;
  padding-top: clamp(10px, 1.6vw, 18px);
  padding-bottom: clamp(4px, 1vw, 10px);
}
.page-outback-toys-case #main .outback-toys-social-carousel .branding-case-scroll-wrap{
  margin-top: 0;
}
.page-outback-toys-case #main .outback-toys-social-carousel .branding-case-scroll__frame img{
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  object-position: center;
}

/* Living Room Church — case page gallery carousel (same strip behavior as Outback social) */
.page-living-room-church-case #main .living-room-church-social-carousel{
  background: #ffffff;
  padding-top: clamp(10px, 1.6vw, 18px);
  padding-bottom: clamp(4px, 1vw, 10px);
}
.page-living-room-church-case #main .living-room-church-social-carousel .branding-case-scroll-wrap{
  margin-top: 0;
}
.page-living-room-church-case #main .living-room-church-social-carousel .branding-case-scroll__frame img{
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  object-position: center;
}
.branding-case-accordion[aria-labelledby="living-room-church-gallery-heading"] .branding-case-accordion__intro .work-case-showcase__lede{
  margin-bottom: clamp(18px, 2.6vw, 28px);
}

/* Cosmo Floral Design — Brand in use carousel */
.page-cosmos-case #main .cosmo-brand-in-use-carousel{
  background: #ffffff;
  padding-top: clamp(10px, 1.6vw, 18px);
  padding-bottom: clamp(4px, 1vw, 10px);
}
.page-cosmos-case #main .cosmo-brand-in-use-carousel .branding-case-scroll-wrap{
  margin-top: 0;
}
.page-cosmos-case #main .cosmo-brand-in-use-carousel .branding-case-scroll__frame img{
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  object-position: center;
}
.branding-case-accordion[aria-labelledby="showcase-heading"] .branding-case-accordion__intro .work-case-showcase__lede{
  margin-bottom: clamp(18px, 2.6vw, 28px);
}

/* REVD Toys — Brand in use carousel */
.page-revd-case #main .revd-brand-in-use-scroll{
  background: #ffffff;
  padding-top: clamp(10px, 1.6vw, 18px);
  padding-bottom: clamp(4px, 1vw, 10px);
}
.page-revd-case #main .revd-brand-in-use-scroll .branding-case-scroll-wrap{
  margin-top: 0;
}
.page-revd-case #main .revd-brand-in-use-scroll .branding-case-scroll__frame img{
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  object-position: center;
}
.page-revd-case #main .revd-website-visit{
  margin: clamp(22px, 3vw, 32px) 0 0;
  text-align: center;
}

/* Case study — social analytics strip (Blaze Yoga, flintrock, …; serif figures + rules on cream) */
.work-case-growth-strip{
  padding: clamp(40px, 6vw, 64px) 0;
  background: #f4efe6;
  border-top: 1px solid rgba(20, 19, 17, 0.08);
  border-bottom: 1px solid rgba(20, 19, 17, 0.08);
}
.work-case-growth-strip__inner{
  max-width: 1100px;
  margin: 0 auto;
}
.work-case-growth-grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  align-items: stretch;
}
.work-case-growth-cell{
  position: relative;
  text-align: center;
  padding: clamp(18px, 3vw, 32px) clamp(12px, 2vw, 20px);
  box-sizing: border-box;
}
.work-case-growth-cell:not(:last-child)::after{
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 1px;
  height: min(70%, 128px);
  background: rgba(20, 19, 17, 0.14);
}
.work-case-growth-figure{
  margin: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-style: normal;
  font-weight: 400;
  font-size: clamp(38px, 5.2vw, 62px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: #14120f;
  font-variant-numeric: tabular-nums;
}
.work-case-growth-suffix{
  font-size: 0.58em;
  letter-spacing: -0.02em;
  margin-left: 0.04em;
}
.work-case-growth-label{
  margin: clamp(10px, 1.6vw, 16px) 0 0;
  font-family: var(--font-body);
  font-size: clamp(10px, 0.95vw, 12px);
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.52);
  line-height: 1.45;
  max-width: min(30ch, 100%);
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 900px){
  .work-case-growth-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .work-case-growth-cell::after{
    display: none;
  }
  .work-case-growth-cell:nth-child(1),
  .work-case-growth-cell:nth-child(3){
    border-right: 1px solid rgba(20, 19, 17, 0.12);
  }
  .work-case-growth-cell:nth-child(1),
  .work-case-growth-cell:nth-child(2){
    border-bottom: 1px solid rgba(20, 19, 17, 0.12);
  }
}
@media (max-width: 520px){
  .work-case-growth-grid{
    grid-template-columns: 1fr;
  }
  .work-case-growth-cell{
    border: none !important;
    border-top: 1px solid rgba(20, 19, 17, 0.1);
    padding-top: clamp(22px, 4vw, 30px);
    padding-bottom: clamp(22px, 4vw, 30px);
  }
  .work-case-growth-cell:first-child{
    border-top: none;
    padding-top: clamp(8px, 2vw, 12px);
  }
}

/* Blog post — full-bleed hero (same asset as blog index card thumbnail) */
.page-blog-post article.section.section-alt{
  padding-top: 0;
  background: #ffffff;
}
.page-blog-post .blog-post-hero{
  margin: 0 0 clamp(18px, 2.8vw, 28px);
  padding: 0;
  width: 100%;
  max-width: 100%;
  position: relative;
  left: auto;
  transform: none;
  aspect-ratio: 16 / 10;
  min-height: clamp(220px, 34vw, 320px);
  max-height: min(520px, 56vh);
  overflow: hidden;
  background: rgba(20, 19, 17, 0.06);
  border-bottom: 1px solid rgba(20, 19, 17, 0.08);
}
.page-blog-post .blog-post-hero img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
@media (max-width: 520px){
  .page-blog-post .blog-post-hero{
    aspect-ratio: 4 / 3;
    max-height: none;
    min-height: clamp(220px, 52vw, 280px);
  }
}
.page-blog-post .blog-post-hero--portrait-lockup{
  aspect-ratio: 16 / 10;
  max-height: min(520px, 58vh);
  min-height: clamp(240px, 38vw, 340px);
}

/* Blog post — desktop: single centered column (hero on top, wider reading measure) */
@media (min-width: 960px){
  .page-blog-post .blog-article.section.section-alt{
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    max-width: min(1080px, 100%);
    margin-inline: auto;
    padding-inline: clamp(24px, 5vw, 56px);
    padding-bottom: clamp(48px, 7vw, 88px);
    box-sizing: border-box;
  }

  .page-blog-post .blog-article > .container{
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
  }

  .page-blog-post .blog-article > .blog-post-hero{
    width: 100%;
    max-width: min(720px, 100%);
    margin: 0 auto clamp(28px, 3.5vw, 40px);
    position: relative;
    left: auto;
    transform: none;
    aspect-ratio: 3 / 4;
    min-height: min(520px, 52vh);
    max-height: min(720px, 78vh);
    border-radius: 14px;
    border: 1px solid rgba(20, 19, 17, 0.08);
    box-shadow: 0 20px 56px rgba(20, 19, 17, 0.07);
  }

  .page-blog-post .blog-article > .blog-post-hero img{
    object-fit: cover;
    object-position: center;
  }

  /* Inline figures sit on the right within the reading column (pairs stay full width) */
  .page-blog-post .blog-post-body .blog-post-figure:not(.blog-post-figure--pair){
    float: right;
    clear: right;
    width: min(46%, 320px);
    margin: clamp(4px, 0.8vw, 10px) 0 clamp(12px, 2vw, 20px) clamp(18px, 2.5vw, 28px);
  }

  .page-blog-post .blog-post-body .blog-post-figure-pair{
    float: none;
    clear: both;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  .page-blog-post .blog-post-body::after{
    content: "";
    display: block;
    clear: both;
  }

  .page-blog-post .blog-post-body .section-title{
    clear: both;
  }

  .page-blog-post .blog-post-body .work-case-growth-strip--blog{
    clear: both;
  }

  .page-blog-post .blog-post-body .blog-post-brand-carousel{
    clear: both;
  }
}

/* Blog — formally rejected: full-bleed horizontal brand proofs carousel */
.page-blog-post .blog-post-brand-carousel{
  clear: both;
  width: 100%;
  max-width: 100%;
  position: relative;
  left: auto;
  transform: none;
  margin-top: clamp(8px, 1.5vw, 16px);
  margin-bottom: clamp(28px, 4vw, 44px);
  padding: clamp(18px, 2.5vw, 28px) max(20px, env(safe-area-inset-left)) clamp(22px, 3vw, 36px) max(20px, env(safe-area-inset-right));
  box-sizing: border-box;
  background: rgba(250, 249, 246, 0.98);
  border-top: 1px solid rgba(20, 19, 17, 0.06);
  border-bottom: 1px solid rgba(20, 19, 17, 0.06);
}
.page-blog-post .blog-post-brand-carousel .branding-case-scroll-wrap{
  margin-top: 0;
  max-width: min(1240px, 100%);
  margin-inline: auto;
}
.page-blog-post .blog-post-brand-carousel .branding-case-scroll{
  margin: 0;
  padding: 4px 0 14px;
}
.page-blog-post .blog-post-brand-carousel .branding-case-scroll__frame{
  aspect-ratio: 4 / 5;
}
.page-blog-post .blog-post-brand-carousel .branding-case-scroll__frame img{
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  object-position: center;
}

/* Blog — case-study style metrics inside narrow article column (not viewport-wide breakpoints) */
.page-blog-post .blog-post-body .work-case-growth-strip--blog{
  margin: clamp(16px, 2.5vw, 24px) 0 clamp(4px, 1vw, 8px);
  padding: clamp(22px, 4vw, 36px) clamp(12px, 2.4vw, 20px);
  border-radius: 12px;
}
.page-blog-post .blog-post-body .work-case-growth-strip--blog .work-case-growth-strip__inner{
  max-width: none;
  margin: 0;
  padding: 0;
}
.page-blog-post .blog-post-body .work-case-growth-strip--blog .work-case-growth-grid{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(12px, 2vw, 20px);
}
.page-blog-post .blog-post-body .work-case-growth-strip--blog .work-case-growth-cell{
  border: none !important;
  padding: clamp(12px, 2vw, 18px) clamp(8px, 1.5vw, 14px);
}
.page-blog-post .blog-post-body .work-case-growth-strip--blog .work-case-growth-cell::after{
  display: none !important;
}
.page-blog-post .blog-post-body .work-case-growth-strip--blog .work-case-growth-figure{
  font-size: clamp(28px, 6.5vw, 46px);
}
@media (max-width: 520px){
  .page-blog-post .blog-post-body .work-case-growth-strip--blog .work-case-growth-grid{
    grid-template-columns: 1fr;
  }
  .page-blog-post .blog-post-body .work-case-growth-strip--blog .work-case-growth-cell{
    border-top: 1px solid rgba(20, 19, 17, 0.1) !important;
    padding-top: clamp(18px, 3vw, 24px);
    padding-bottom: clamp(18px, 3vw, 24px);
  }
  .page-blog-post .blog-post-body .work-case-growth-strip--blog .work-case-growth-cell:first-child{
    border-top: none !important;
    padding-top: clamp(6px, 1.2vw, 10px);
  }
}

/* Head Strong Flight — Brand in use carousel (Grady-style full-bleed strip, 4:5 frames) */
.branding-case-accordion[aria-labelledby="hsf-brand-in-use-heading"] .branding-case-accordion__intro .work-case-showcase__lede{
  margin-bottom: clamp(20px, 3vw, 34px);
}
.page-hsf-case #main .hsf-brand-in-use-scroll{
  background: rgb(255, 255, 255);
  padding-top: clamp(10px, 1.6vw, 18px);
  padding-bottom: clamp(4px, 1vw, 10px);
  padding-left: max(36px, env(safe-area-inset-left));
  padding-right: max(36px, env(safe-area-inset-right));
}
.page-hsf-case #main .hsf-brand-in-use-scroll .branding-case-scroll-wrap{
  margin-top: 0;
}
.page-hsf-case #main .hsf-brand-in-use-scroll .branding-case-scroll{
  margin: 0;
  padding: 4px 0 14px;
}
.page-hsf-case #main .hsf-brand-in-use-scroll .branding-case-scroll__frame{
  aspect-ratio: 4 / 5;
}
.page-hsf-case #main .hsf-brand-in-use-scroll .branding-case-scroll__frame img{
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  object-position: center;
}

/* Wittness Coffeehouse — Brand carousel (4:5 frames, center crop) */
.branding-case-accordion[aria-labelledby="witness-brand-carousel-heading"] .branding-case-accordion__intro .work-case-showcase__lede{
  margin-bottom: clamp(20px, 3vw, 34px);
}
.page-witness-coffeehouse-case #main .witness-brand-carousel{
  background: #ffffff;
  padding-top: clamp(10px, 1.6vw, 18px);
  padding-bottom: clamp(4px, 1vw, 10px);
  padding-left: max(36px, env(safe-area-inset-left));
  padding-right: max(36px, env(safe-area-inset-right));
}
.page-witness-coffeehouse-case #main .witness-brand-carousel .branding-case-scroll-wrap{
  margin-top: 0;
}
.page-witness-coffeehouse-case #main .witness-brand-carousel .branding-case-scroll{
  margin: 0;
  padding: 4px 0 14px;
}
.page-witness-coffeehouse-case #main .witness-brand-carousel .branding-case-scroll__frame{
  aspect-ratio: 4 / 5;
}
.page-witness-coffeehouse-case #main .witness-brand-carousel .branding-case-scroll__frame img{
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  object-position: center;
}

/* Blaze Yoga & Fitness — Instagram Reels embed rail */
.blaze-yoga-reels .work-case-showcase__lede{
  margin-bottom: clamp(18px, 2.6vw, 28px);
}
.blaze-yoga-reels__rail{
  width: 100%;
  min-width: 0;
}
.blaze-yoga-reels__embeds{
  display: flex;
  flex-wrap: wrap;
  gap: clamp(14px, 2.2vw, 22px);
  justify-content: center;
  align-items: flex-start;
  padding: clamp(4px, 1vw, 12px) 0 clamp(8px, 1.4vw, 16px);
  box-sizing: border-box;
}
.blaze-yoga-reels__embeds:not([hidden]) .instagram-media{
  margin: 0 !important;
  width: 100% !important;
  max-width: min(340px, 100%);
  min-width: 0 !important;
}
.blaze-yoga-reels__skeleton{
  display: flex;
  flex-wrap: nowrap;
  gap: clamp(12px, 2vw, 18px);
  justify-content: center;
  align-items: stretch;
  padding: clamp(4px, 1vw, 12px) 0 clamp(8px, 1.4vw, 16px);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.blaze-yoga-reels__skeleton[hidden]{
  display: none !important;
}
.blaze-yoga-reels__skeleton-card{
  flex: 0 0 auto;
  width: min(220px, 28vw);
  min-width: min(220px, 42vw);
  aspect-ratio: 9 / 16;
  border-radius: 12px;
  border: 1px dashed rgba(20, 19, 17, 0.18);
  background: linear-gradient(165deg, rgba(247, 241, 230, 0.55), rgba(20, 19, 17, 0.04));
  box-sizing: border-box;
}
@media (max-width: 520px){
  .blaze-yoga-reels__skeleton{
    justify-content: flex-start;
  }
  .blaze-yoga-reels__skeleton-card{
    min-width: 140px;
    width: 140px;
  }
}

/* Blaze Yoga — local Reels video strip (Blaze Videos); tap to hear audio */
.blaze-yoga-reels__rail--videos{
  padding: clamp(4px, 1vw, 12px) 0 clamp(8px, 1.4vw, 16px);
}
.blaze-yoga-reels__video-track{
  display: flex;
  flex-wrap: nowrap;
  gap: clamp(12px, 2vw, 18px);
  align-items: stretch;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
  padding-bottom: 2px;
}
.blaze-yoga-reel-tile{
  flex: 0 0 auto;
  position: relative;
  width: min(260px, 78vw);
  aspect-ratio: 9 / 16;
  max-height: min(72vh, 620px);
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(20, 19, 17, 0.12);
  background: #0a0a0a;
  scroll-snap-align: start;
  cursor: pointer;
  box-sizing: border-box;
  min-height: 200px;
}
.blaze-yoga-reel-tile:focus-visible{
  outline: 2px solid var(--moss);
  outline-offset: 3px;
  z-index: 1;
}
.blaze-yoga-reel-tile.is-audio-active{
  border-color: rgba(26, 51, 41, 0.42);
  box-shadow: 0 0 0 1px rgba(26, 51, 41, 0.2);
}
.blaze-yoga-reel-tile__video{
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  vertical-align: middle;
}
.blaze-yoga-reels__error{
  margin: 0;
  padding: clamp(16px, 2vw, 22px);
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.55;
  color: rgba(20, 19, 17, 0.72);
  background: rgba(247, 241, 230, 0.55);
  border: 1px dashed rgba(20, 19, 17, 0.2);
  border-radius: 10px;
  max-width: 52ch;
}
.blaze-yoga-reels__error code{
  font-size: 0.92em;
}
.blaze-yoga-reel-tile__hint{
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0;
  padding: 10px 12px 12px;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-align: center;
  color: rgba(255, 255, 255, 0.95);
  background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.68));
  pointer-events: none;
  transition: opacity 0.2s ease;
  z-index: 1;
}
.blaze-yoga-reel-tile.is-audio-active .blaze-yoga-reel-tile__hint{
  opacity: 0;
}
@media (max-width: 520px){
  .blaze-yoga-reels__video-track{
    justify-content: flex-start;
  }
  .blaze-yoga-reel-tile{
    width: min(220px, 72vw);
  }
}

/* Grady's legacy carousel — equal heights with smaller portrait shots */
.branding-case-accordion[aria-labelledby="gradys-history-gallery-heading"] .branding-case-accordion__intro .work-case-showcase__lede{
  margin-bottom: clamp(20px, 3vw, 34px);
}
.gradys-history-scroll{
  padding-left: max(36px, env(safe-area-inset-left));
  padding-right: max(36px, env(safe-area-inset-right));
}
.gradys-history-scroll .branding-case-scroll{
  margin: 0;
  padding: 4px 0 14px;
}
.gradys-history-scroll .branding-case-scroll__frame{
  height: clamp(240px, 30vw, 330px);
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(20, 19, 17, 0.06);
}
.gradys-history-scroll .branding-case-scroll__frame img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.gradys-history-scroll .branding-case-scroll__item--tall .branding-case-scroll__frame img{
  width: auto;
  height: 76%;
  max-width: 88%;
  object-fit: contain;
}
@media (max-width: 700px){
  .gradys-history-scroll{
    padding-left: max(20px, env(safe-area-inset-left));
    padding-right: max(20px, env(safe-area-inset-right));
  }
}

.work-case__inner--wide{
  max-width: min(var(--container), calc(100% - 48px));
  margin-inline: auto;
  width: 100%;
  padding-top: clamp(40px, 6vw, 64px);
  margin-top: clamp(28px, 4vw, 48px);
  border-top: 1px solid rgba(20, 19, 17, 0.1);
  box-sizing: border-box;
}
.portfolio-page--hub .portfolio-page-cta--hub{
  margin-top: clamp(18px, 2.5vw, 26px);
  margin-bottom: 0;
  text-align: left;
}
.portfolio-page--hub .work-case__inner .section-title{
  margin-top: 0;
}
.portfolio-page--hub .work-case__inner--wide .section-title{
  margin-top: 0;
}

/* Portfolio — editorial magazine grid (/portfolio) */
.portfolio-page--magazine{
  background-color: #ffffff;
  background-image: none;
}
/* Portfolio — dark moss header (matches interior pages; readable on white page body) */
body.portfolio-page--magazine .site-header{
  background: rgba(26, 51, 41, 0.96);
  border-bottom-color: rgba(255, 255, 255, 0.1);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body.portfolio-page--magazine .site-header.is-elevated{
  background: #162c23;
}
.portfolio-page--magazine .section.section-alt{
  background: #ffffff;
}
.portfolio-mag{
  padding-top: clamp(32px, 5vw, 56px);
  padding-bottom: clamp(56px, 9vw, 96px);
  max-width: min(1280px, calc(100% - 48px));
  margin-inline: auto;
  box-sizing: border-box;
}
.portfolio-mag__header{
  text-align: center;
  margin-bottom: clamp(36px, 5vw, 52px);
}
.portfolio-mag__title{
  margin: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-variant-ligatures: none;
  font-feature-settings: normal;
  font-size: calc(clamp(2.85rem, 8.5vw, 4.5rem) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: -0.03em;
  line-height: 1.05;
  color: rgba(20, 19, 17, 0.96);
  text-transform: lowercase;
}
.portfolio-mag__filters{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px clamp(14px, 3vw, 28px);
  margin: clamp(26px, 4vw, 38px) 0 clamp(32px, 4.5vw, 56px);
  padding: 0;
}
.portfolio-mag-filter{
  margin: 0;
  padding: 6px 2px 10px;
  border: none;
  border-bottom: 2px solid transparent;
  background: transparent;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-variant-ligatures: none;
  font-feature-settings: normal;
  font-size: clamp(17px, 1.65vw, 22px);
  font-weight: 400;
  letter-spacing: 0.02em;
  color: rgba(20, 19, 17, 0.55);
  text-transform: lowercase;
  cursor: pointer;
  transition: color 0.2s ease, border-color 0.2s ease;
}
.portfolio-mag-filter:hover{
  color: rgba(20, 19, 17, 0.85);
}
.portfolio-mag-filter.is-active{
  color: rgba(20, 19, 17, 0.96);
  border-bottom-color: rgba(20, 19, 17, 0.92);
}
.portfolio-mag-filter:focus-visible{
  outline: 2px solid rgba(20, 19, 17, 0.35);
  outline-offset: 4px;
}
.portfolio-mag-grid{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(28px, 4vw, 40px) clamp(20px, 3vw, 28px);
  align-items: start;
}
.portfolio-mag-item[hidden]{
  display: none !important;
}
.portfolio-mag-card{
  display: block;
  height: 100%;
  text-decoration: none;
  color: inherit;
  transition: color 0.2s ease;
}
.portfolio-mag-card:focus-visible{
  outline: 2px solid rgba(20, 19, 17, 0.35);
  outline-offset: 4px;
}
.portfolio-mag-card__media{
  position: relative;
  aspect-ratio: 8 / 5;
  overflow: hidden;
  background: rgba(20, 19, 17, 0.06);
  contain: paint;
}
.portfolio-mag-card__media img:not(.portfolio-mag-card__logo-overlay){
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  transition: transform 0.45s ease, opacity 0.3s ease;
}
.portfolio-mag-card__media--logo{
  background: #fff;
}
.portfolio-mag-card__media--logo img{
  object-fit: contain;
  padding: clamp(12px, 3vw, 24px);
  box-sizing: border-box;
  background: #fff;
}
.portfolio-mag-card__media--cosmo{
  background: #d7cec8;
}
.portfolio-mag-card__media--cosmo > img:first-child{
  object-fit: cover;
}
.portfolio-mag-card__media--lakewood > img:first-child{
  object-fit: cover;
}
.portfolio-mag-card__media--brookstone > img:first-child{
  object-fit: cover;
}
.portfolio-mag-card__media--outback > img:first-child{
  object-fit: cover;
}
.portfolio-mag-card__media--gradys > img:first-child{
  object-fit: cover;
}
.portfolio-mag-card__media--flintrock > img:first-child{
  object-fit: cover;
}
.portfolio-mag-card__media--cultivate > img:first-child{
  object-fit: cover;
}
.portfolio-mag-card__media--hey-peaches > img:first-child{
  object-fit: cover;
}
.portfolio-mag-card__media--everflame > img:first-child{
  object-fit: cover;
}
.portfolio-mag-card__media--vizion > img:first-child{
  object-fit: cover;
  filter: grayscale(1);
}
.portfolio-mag-card__media--hsf > img:first-child{
  object-fit: cover;
  object-position: 42% 38%;
}
.portfolio-mag-card__media--da-targets > img:first-child{
  object-fit: cover;
  object-position: center 42%;
}
.portfolio-mag-card__media--pennwood > img:first-child{
  object-fit: cover;
}
.portfolio-mag-card__media-scrim{
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.34);
  z-index: 1;
  pointer-events: none;
}
.portfolio-mag-card__media-scrim--dark{
  background: rgba(20, 19, 17, 0.38);
}
.portfolio-mag-card__media-scrim--magenta{
  background: rgba(176, 32, 112, 0.18);
}
.portfolio-mag-card__media-scrim--soft-black{
  background: rgba(0, 0, 0, 0.25);
}
.portfolio-mag-card__media-scrim--brookstone{
  background: rgba(0, 0, 0, 0.35);
}
.portfolio-mag-card__media-scrim--soft-white{
  background: rgba(255, 255, 255, 0.25);
}
.portfolio-mag-card__media-scrim--everflame{
  background: rgba(255, 255, 255, 0.35);
}
.portfolio-mag-card__media-scrim--pennwood-thumb{
  background: rgba(0, 0, 0, 0.42);
}
.portfolio-mag-card__media-scrim--gradys-thumb{
  background: rgba(0, 0, 0, 0.55);
}
.portfolio-mag-card__logo-overlay{
  position: absolute;
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  display: block;
  width: auto;
  height: auto;
  max-height: min(150px, 36vw);
  max-width: 80%;
  padding: 0;
  object-fit: contain;
  object-position: center;
  transform: translate(-50%, -50%);
  box-sizing: border-box;
  filter: brightness(0) invert(1);
  z-index: 2;
  pointer-events: none;
  transition: transform 0.45s ease, opacity 0.3s ease;
}
.portfolio-mag-card__logo-overlay--cosmo{
  max-height: min(260px, 52vw);
  max-width: 88%;
}
.portfolio-mag-card__logo-overlay--lakewood{
  max-height: min(600px, 99vw);
  max-width: 100%;
}
.portfolio-mag-card__logo-overlay--gradys{
  max-height: 120px;
  opacity: 1;
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.55))
    drop-shadow(0 3px 10px rgba(0, 0, 0, 0.35));
}
.portfolio-mag-card__logo-overlay--cultivate{
  max-height: min(260px, 48vw);
  max-width: 92%;
  filter: none;
}
.portfolio-mag-card__logo-overlay--hey-peaches{
  max-height: min(360px, 64vw);
  max-width: 100%;
  filter: brightness(0) invert(1);
}
.portfolio-mag-card__logo-overlay--everflame{
  top: 50%;
  left: 50%;
  right: auto;
  margin: 0;
  max-height: min(168px, 40vw);
  max-width: 100%;
  object-fit: contain;
  object-position: center;
  filter: none;
  transform: translate(-50%, -50%);
}
.portfolio-mag-card__logo-overlay--vizion{
  max-height: min(170px, 36vw);
  max-width: 84%;
}
.portfolio-mag-card__logo-overlay--brookstone{
  max-height: min(280px, 60vw);
  max-width: 94%;
  /* Same asset as homepage clients grid; brightness+invert reads as white on photo */
}
.portfolio-mag-card__logo-overlay--outback{
  max-height: min(420px, 87vw);
  max-width: 100%;
  filter: drop-shadow(0 6px 28px rgba(20, 19, 17, 0.22));
  mix-blend-mode: normal;
}
.portfolio-mag-card__logo-overlay--flintrock{
  max-height: min(140px, 34vw);
  max-width: min(88%, calc(100% - 24px));
  filter: none;
}
.portfolio-mag-card__logo-overlay--hsf{
  top: auto;
  bottom: clamp(10px, 2.2vw, 18px);
  left: 50%;
  right: auto;
  transform: translateX(-50%);
  max-height: min(372px, 96vw);
  max-width: 100%;
  filter: drop-shadow(0 2px 10px rgba(0, 0, 0, 0.35));
}
.portfolio-mag-card__logo-overlay--da-targets{
  max-height: min(52px, 11vw);
  max-width: min(92%, calc(100% - 16px));
  filter:
    brightness(0) invert(1)
    drop-shadow(0 2px 14px rgba(0, 0, 0, 0.55));
}
.portfolio-mag-card__logo-overlay--pennwood{
  max-height: min(240px, 52vw);
  max-width: min(85%, calc(100% - 28px));
  filter: drop-shadow(0 2px 20px rgba(0, 0, 0, 0.5));
}
.portfolio-mag-card:hover .portfolio-mag-card__media img:not(.portfolio-mag-card__logo-overlay){
  transform: scale(1.04);
}
.portfolio-mag-card:hover .portfolio-mag-card__media--logo img{
  transform: none;
}
.portfolio-mag-card:hover .portfolio-mag-card__logo-overlay{
  transform: translate(-50%, -50%);
}
.portfolio-mag-card:hover .portfolio-mag-card__logo-overlay--hsf{
  transform: translateX(-50%);
}

/* Branding service — "Branding in practice" tiles use portfolio thumbs + scrim + logo overlays inside home-recent-projects cards */
.page-service-branding .service-branding-practice .home-recent-projects__media.portfolio-mag-card__media{
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  overflow: hidden;
  background: rgba(20, 19, 17, 0.06);
  contain: paint;
}
.page-service-branding .service-branding-practice .home-recent-projects__card:hover .portfolio-mag-card__logo-overlay{
  transform: translate(-50%, -50%);
}

.portfolio-mag-card__cat{
  display: block;
  margin-top: 14px;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
  font-feature-settings: "liga" 1, "clig" 1, "calt" 1, "dlig" 1;
  font-size: clamp(12px, 1.15vw, 15px);
  font-weight: 400;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.42);
}
.portfolio-mag-card__title{
  position: relative;
  display: inline-block;
  max-width: 100%;
  margin-top: 10px;
  padding-bottom: 6px;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
  font-feature-settings: "liga" 1, "clig" 1, "calt" 1, "dlig" 1;
  font-size: clamp(24px, 2.35vw, 32px);
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.2;
  color: rgba(20, 19, 17, 0.94);
  text-transform: uppercase;
  text-decoration: none;
}
.portfolio-mag-card__title::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 8px;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 6' preserveAspectRatio='none'%3E%3Cpath d='M0 4.2 Q120 1.6 240 4.2' fill='none' stroke='%231a3329' stroke-width='1.1' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 0% 100%;
  transition: background-size 0.7s cubic-bezier(0.33, 1, 0.48, 1);
}
.portfolio-mag-card:hover .portfolio-mag-card__title::after,
.portfolio-mag-card:focus-visible .portfolio-mag-card__title::after{
  background-size: 100% 100%;
}
.portfolio-mag-card__title--no-ligatures{
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.portfolio-mag-card__excerpt{
  margin: 10px 0 0;
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.55;
  font-weight: 400;
  color: rgba(20, 19, 17, 0.52);
}
.portfolio-mag-card__arrow{
  display: inline-block;
  margin-top: 10px;
  font-size: 15px;
  color: rgba(20, 19, 17, 0.45);
  transition: transform 0.2s ease, color 0.2s ease;
}
.portfolio-mag-card:hover .portfolio-mag-card__arrow{
  transform: translateX(3px);
  color: rgba(20, 19, 17, 0.75);
}
.portfolio-mag__footer-cta{
  margin: clamp(40px, 6vw, 56px) 0 0;
  text-align: center;
  font-family: var(--font-body);
  font-size: 14px;
  color: rgba(20, 19, 17, 0.48);
}
.portfolio-mag__link{
  color: rgba(20, 19, 17, 0.58);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.portfolio-mag__link:hover{
  color: rgba(20, 19, 17, 0.9);
}
.portfolio-mag__link-sep{
  margin: 0 10px;
  opacity: 0.5;
}
/* Portfolio thumbnails: vw-based logo caps can exceed the frame on narrow / shallow cards */
@media (max-width: 900px){
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay{
    max-height: min(38vw, 132px);
    max-width: min(94%, calc(100% - 24px));
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--hey-peaches{
    max-height: min(60vw, 248px);
    max-width: min(100%, calc(100% - 8px));
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--cosmo{
    max-height: min(56vw, 240px);
    max-width: min(94%, calc(100% - 14px));
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--lakewood{
    max-height: min(93vw, 450px);
    max-width: min(100%, calc(100% - 8px));
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--brookstone{
    max-height: min(50vw, 220px);
    max-width: min(98%, calc(100% - 12px));
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--outback{
    max-height: min(81vw, 360px);
    max-width: 100%;
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--hsf{
    max-height: min(132vw, 504px);
    max-width: 100%;
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--everflame{
    max-height: min(44vw, 176px);
    max-width: 100%;
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--da-targets{
    max-height: min(10vw, 46px);
    max-width: min(94%, calc(100% - 12px));
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--pennwood{
    max-height: min(48vw, 200px);
    max-width: min(90%, calc(100% - 16px));
  }
}
@media (max-width: 560px){
  .portfolio-mag-grid{
    grid-template-columns: 1fr;
  }
  .portfolio-mag-card__media{
    aspect-ratio: 2 / 1;
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay{
    max-height: min(34vw, 118px);
    max-width: min(94%, calc(100% - 20px));
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--hey-peaches{
    max-height: min(56vw, 220px);
    max-width: min(100%, calc(100% - 8px));
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--cosmo{
    max-height: min(52vw, 210px);
    max-width: min(94%, calc(100% - 12px));
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--lakewood{
    max-height: min(87vw, 390px);
    max-width: min(100%, calc(100% - 8px));
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--brookstone{
    max-height: min(46vw, 200px);
    max-width: min(98%, calc(100% - 10px));
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--outback{
    max-height: min(75vw, 318px);
    max-width: 100%;
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--hsf{
    max-height: min(120vw, 456px);
    max-width: 100%;
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--everflame{
    max-height: min(42vw, 156px);
    max-width: 100%;
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--da-targets{
    max-height: min(9vw, 42px);
    max-width: min(94%, calc(100% - 10px));
  }
  .portfolio-mag-card__media .portfolio-mag-card__logo-overlay--pennwood{
    max-height: min(44vw, 180px);
    max-width: min(88%, calc(100% - 14px));
  }
}
@media (prefers-reduced-motion: reduce){
  .portfolio-mag-card__media img:not(.portfolio-mag-card__logo-overlay),
  .portfolio-mag-card__arrow{
    transition-duration: 0.01ms;
  }
  .portfolio-mag-card__title::after{
    transition-duration: 0.01ms;
  }
  .portfolio-mag-card:hover .portfolio-mag-card__media img:not(.portfolio-mag-card__logo-overlay){
    transform: none;
  }
  .portfolio-mag-card:hover .portfolio-mag-card__arrow{
    transform: none;
  }
}

/* Portfolio page — primary nav uses sans-serif body stack (testimonial labels stay Arome below) */
.portfolio-page--magazine .site-header .nav-link,
.portfolio-page--magazine .site-header .nav-dropdown-link{
  font-family: var(--font-body);
}
.portfolio-page--magazine .site-header .nav-link{
  font-weight: 500;
}
.portfolio-page--magazine .site-header .nav-dropdown-link{
  font-weight: 400;
}
.portfolio-page--magazine .site-header .nav-dropdown-link[aria-current="page"]{
  font-weight: 600;
}
.portfolio-page--magazine .review-editorial__series,
.portfolio-page--magazine .review-editorial__index{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-variant-ligatures: none;
  font-feature-settings: normal;
  font-weight: 400;
}

.section-service-detail{
  padding-top: clamp(48px, 8vw, 80px);
  padding-bottom: clamp(64px, 10vw, 100px);
}
.service-detail-back{
  margin: 0 0 12px;
  font-size: var(--font-body-size);
}
.service-detail-back a{
  color: rgba(20, 19, 17, 0.62);
  font-weight: var(--font-body-weight);
  text-decoration: none;
}
.service-detail-back a:hover{
  color: rgba(20, 19, 17, 0.92);
  text-decoration: underline;
}
.service-detail-packages{
  margin-top: 22px;
}
.service-detail-addons{
  margin-top: clamp(28px, 4vw, 40px);
  /* Full-bleed: escape .container max-width (use 100% when parent is viewport-wide to avoid mobile vw overflow) */
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  position: relative;
  box-sizing: border-box;
}

/* Add-ons rail — dark moss column + scroll strip (editorial) */
.addons-carousel{
  display: flex;
  flex-direction: row;
  align-items: stretch;
  min-height: min(260px, 36vh);
  border: 1px solid rgba(15, 22, 18, 0.45);
  box-sizing: border-box;
  background: #1a3329;
}
.addons-carousel-head{
  flex: 0 0 clamp(160px, 19vw, 236px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(16px, 2.4vw, 26px);
  padding: clamp(20px, 3vw, 36px) clamp(14px, 2vw, 22px);
  box-sizing: border-box;
  background: #152019;
}
.addons-carousel-heading{
  margin: 0;
  max-width: 16ch;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(28px, 3.2vw, 40px);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.02em;
  text-transform: none;
  font-variant-ligatures: none;
  font-feature-settings: normal;
  color: rgba(247, 241, 230, 0.96);
  text-align: center;
}
.addons-carousel-controls{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}
.addons-carousel-arrow{
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 2px;
  background: transparent;
  color: rgba(247, 241, 230, 0.95);
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.addons-carousel-arrow:hover{
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.85);
}
.addons-carousel-arrow:focus-visible{
  outline: 2px solid rgba(247, 241, 230, 0.75);
  outline-offset: 3px;
}
.addons-carousel-track{
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  background: #1a3329;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.addons-carousel-track::-webkit-scrollbar{
  display: none;
}
.addons-carousel-item{
  flex: 0 0 clamp(248px, 30vw, 340px);
  scroll-snap-align: start;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: clamp(28px, 4vw, 44px) clamp(18px, 2.4vw, 28px);
  border-left: 1px solid rgba(247, 241, 230, 0.12);
  min-height: 100%;
  background: rgba(0, 0, 0, 0.12);
}
.addons-carousel-title{
  margin: 0;
  font-family: var(--font-body);
  font-size: clamp(15px, 1.55vw, 19px);
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(247, 241, 230, 0.94);
  max-width: 28ch;
}
.addons-carousel-meta{
  margin: 14px 0 0;
  font-family: var(--font-body);
  font-size: clamp(17px, 1.65vw, 21px);
  font-weight: var(--font-body-weight);
  line-height: 1.4;
  color: rgba(247, 241, 230, 0.55);
}
@media (prefers-reduced-motion: reduce){
  .addons-carousel-track{
    scroll-behavior: auto;
  }
}
@media (max-width: 720px){
  .addons-carousel{
    flex-direction: column;
    min-height: 0;
  }
  .addons-carousel-head{
    flex: none;
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 16px;
  }
  .addons-carousel-heading{
    max-width: none;
    flex: 1 1 auto;
    text-align: center;
  }
  .addons-carousel-controls{
    flex: 0 0 auto;
  }
  .addons-carousel-track{
    width: 100%;
  }
}
.service-detail-cta{
  margin-top: 28px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}
.page-services .service-detail-cta,
.page-services .social-showcase-cta-row{
  justify-content: center;
}
.branding-showcase-section .service-detail-cta{
  justify-content: center;
}
.page-services .section-title{
  font-size: calc(clamp(40px, 4.8vw, 58px) + var(--heading-size-add));
  line-height: 1.05;
  letter-spacing: -0.03em;
  margin-bottom: 0;
}
/* Services pages — white surfaces throughout */
body.page-services{
  background-color: #ffffff;
  background-image: none;
}
.page-services .section-alt,
.page-services main > section.section,
.page-services .services-editorial,
.page-services .services-editorial--catalog,
.page-services .services-split-hero-left,
.page-services .services-split-hero-after,
.page-services .services-hub-card,
.page-services .services-hub-section--showcase .services-hub-card,
.page-services .services-hub-card:hover,
.page-services .services-hub-section--showcase .services-hub-card:hover,
.page-services .services-hub-card--featured,
.page-services .services-hub-section--showcase .services-hub-card--featured,
.page-services .services-hub-card--featured:hover,
.page-services .services-hub-section--showcase .services-hub-card--featured:hover{
  background: #ffffff;
}
/* Services hub — Recent projects strip uses homepage moss gradient (override section white wash) */
.page-services main > section.section.home-recent-projects{
  background: linear-gradient(168deg, #1a3329 0%, var(--moss) 46%, #1a3329 100%);
  border-top: 1px solid rgba(247, 241, 230, 0.09);
  border-bottom: 1px solid rgba(247, 241, 230, 0.09);
  color: rgba(247, 241, 230, 0.92);
}
.page-services main > section.section{
  padding-top: clamp(72px, 10vw, 112px);
  padding-bottom: clamp(72px, 10vw, 112px);
}
/* Instagram pre-footer: remove double vertical rhythm above strip (section padding + inner padding) */
.page-services main > section.section.home-instagram-strip{
  padding-top: 0;
}
.page-services main > section.section.section-alt:has(+ section.home-instagram-strip){
  padding-bottom: clamp(40px, 6vw, 72px);
}
.page-services main > section.home-instagram-strip .instagram-feed-section__inner.site-instagram-prefooter__inner{
  padding-top: clamp(12px, 2vw, 24px);
}
.page-services .section .portfolio-page-lead,
.page-services .social-showcase-lead{
  margin-top: clamp(24px, 3.5vw, 38px);
  font-size: var(--font-body-size);
  line-height: 1.68;
  margin-left: auto;
  margin-right: auto;
}
.page-services .branding-showcase-grid,
.page-services .service-detail-packages{
  margin-top: clamp(36px, 5vw, 56px);
}
.page-services .social-showcase-grid{
  margin-top: clamp(36px, 5vw, 56px);
}
.page-services .branding-showcase-card{
  padding: clamp(32px, 4.8vw, 56px) clamp(22px, 3.2vw, 40px);
}
.page-services [data-reveal-on-scroll],
.page-blog [data-reveal-on-scroll],
.page-contact [data-reveal-on-scroll]{
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1), transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}
.page-services [data-reveal-on-scroll].is-revealed,
.page-blog [data-reveal-on-scroll].is-revealed,
.page-contact [data-reveal-on-scroll].is-revealed{
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce){
  .page-services [data-reveal-on-scroll],
  .page-blog [data-reveal-on-scroll],
  .page-contact [data-reveal-on-scroll]{
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* Services hub — three-up chooser + reviews + about strip */
.page-services-hub .services-hub-section--showcase{
  background: #f3efe8;
  padding-block: clamp(48px, 7vw, 88px);
}

/* Services hub — triptych header (three panels, frosted labels, white gutters) */
.services-hub-triptych{
  margin: 0;
  padding: clamp(16px, 3vw, 28px) clamp(12px, 3vw, 24px) clamp(12px, 2vw, 20px);
  box-sizing: border-box;
  background: #fff;
}
.services-hub-triptych__grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(6px, 1vw, 10px);
  max-width: min(1420px, 100%);
  margin: 0 auto;
}
.services-hub-triptych__panel{
  position: relative;
  display: block;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  border-radius: clamp(4px, 0.75vw, 9px);
  text-decoration: none;
  color: inherit;
}
.services-hub-triptych__panel:focus-visible{
  outline: 2px solid var(--moss);
  outline-offset: 3px;
}
.services-hub-triptych__img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.002);
  transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
.services-hub-triptych__panel:hover .services-hub-triptych__img{
  transform: scale(1.045);
}
.services-hub-triptych__img--work{
  object-position: center 42%;
}
.services-hub-triptych__img--shop{
  object-position: center 38%;
}
.services-hub-triptych__overlay{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(14px, 3.5vw, 28px);
  pointer-events: none;
}
.services-hub-triptych__label-box{
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(88%, 300px);
  min-height: clamp(52px, 12vw, 84px);
  padding: clamp(14px, 3vw, 22px) clamp(18px, 3.5vw, 26px);
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(255, 255, 255, 0.98);
  box-shadow: 0 10px 36px rgba(30, 28, 24, 0.12);
  box-sizing: border-box;
}
.services-hub-triptych__label{
  margin: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(1.05rem, 2.6vw, 1.45rem);
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.02em;
  line-height: 1.15;
  color: var(--moss);
  text-align: center;
}
@media (max-width: 820px){
  .services-hub-triptych__grid{
    grid-template-columns: 1fr;
    gap: clamp(8px, 2vw, 12px);
  }
  .services-hub-triptych__panel{
    aspect-ratio: 16 / 10;
    max-height: min(48vh, 420px);
  }
}
@media (prefers-reduced-motion: reduce){
  .services-hub-triptych__img{
    transition: none;
  }
  .services-hub-triptych__panel:hover .services-hub-triptych__img{
    transform: scale(1.002);
  }
}

/* Services hub — editorial hero + three portrait pillars (mockup layout) */
.page-services-hub .services-editorial{
  background: #f5f2ed;
  padding-block: clamp(48px, 8vw, 96px);
}

/* Services hub — catalog layout (centered stack + bordered three-up, reference-inspired) */
.page-services-hub .services-editorial--catalog{
  background: #f2f0e9;
  padding-block: clamp(56px, 9vw, 104px);
}
.services-editorial-head.services-editorial-head--catalog{
  display: block;
  text-align: center;
  margin-bottom: clamp(40px, 5.5vw, 64px);
  max-width: 52rem;
  margin-left: auto;
  margin-right: auto;
}
.page-services-hub .services-editorial--catalog .services-editorial-display{
  text-transform: none;
  letter-spacing: 0.02em;
  font-size: calc(clamp(32px, 5vw, 52px) + var(--heading-size-add));
  line-height: 1.12;
  color: #333;
  margin-bottom: clamp(10px, 1.5vw, 16px);
}
.services-editorial-sub{
  margin: 0 auto clamp(18px, 2.5vw, 24px);
  max-width: 36ch;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(17px, 2vw, 22px);
  font-style: normal;
  font-weight: 400;
  line-height: 1.45;
  color: #8b8675;
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.page-services-hub .services-editorial--catalog .services-editorial-kicker{
  margin: 0 auto;
  max-width: min(44rem, 94vw);
  font-family: var(--font-body);
  font-size: clamp(10px, 0.85vw, 12px);
  font-weight: 400;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1.65;
  color: rgba(51, 51, 51, 0.78);
}
@media (max-width: 520px){
  .page-services-hub .services-editorial--catalog .services-editorial-kicker{
    font-size: clamp(9px, 2.35vw, 11px);
    letter-spacing: 0.1em;
    line-height: 1.55;
  }
}
.services-editorial-grid.services-editorial-grid--catalog{
  gap: clamp(24px, 3.5vw, 36px);
  align-items: stretch;
}
.services-catalog-card{
  display: flex;
  flex-direction: column;
  height: 100%;
  margin: 0;
  border: 1px solid rgba(51, 51, 51, 0.55);
  background: #f2f0e9;
  text-align: center;
}
.services-catalog-card__media-trigger{
  flex-shrink: 0;
  border-bottom: 1px solid rgba(51, 51, 51, 0.35);
}
.page-services-hub .services-editorial--catalog .services-catalog-card .services-editorial-media{
  border: 0;
  aspect-ratio: 4 / 5;
}
.services-catalog-card__title{
  margin: clamp(20px, 2.5vw, 28px) clamp(16px, 2vw, 24px) 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(18px, 1.5vw, 22px);
  font-style: normal;
  font-weight: 400;
  line-height: 1.3;
  color: #333;
}
.services-catalog-card__title-link{
  color: inherit;
  text-decoration: none;
  font: inherit;
  letter-spacing: inherit;
  border-bottom: 1px solid transparent;
  transition: border-color 0.2s ease, opacity 0.2s ease;
}
.services-catalog-card__title-link:hover{
  border-bottom-color: currentColor;
  opacity: 0.88;
}
.services-catalog-card__title-link:focus-visible{
  outline: 2px solid currentColor;
  outline-offset: 4px;
}
.services-catalog-card__text{
  margin: clamp(12px, 1.5vw, 16px) clamp(18px, 2.2vw, 26px) clamp(22px, 2.5vw, 28px);
  font-family: var(--font-body);
  font-size: clamp(13px, 1.1vw, 15px);
  font-weight: var(--font-body-weight);
  line-height: 1.65;
  color: #333;
}
.services-editorial-cta.services-editorial-cta--catalog{
  background: #8b8675;
  color: #fff;
  border: 1px solid rgba(51, 51, 51, 0.2);
}
.services-editorial-cta.services-editorial-cta--catalog:hover{
  background: #7a7568;
  color: #fff;
}

/* Services hub — remove empty-looking cream band between catalog & testimonials on mobile */
@media (max-width: 640px){
  .page-services-hub .services-editorial--catalog{
    padding-top: clamp(40px, 6vw, 56px);
    padding-bottom: clamp(16px, 3.5vw, 24px);
  }
  .page-services-hub .services-editorial--catalog .services-editorial-cta-row{
    margin-top: clamp(18px, 3.5vw, 26px);
  }
  .page-services-hub #client-love{
    padding-top: clamp(28px, 5vw, 40px);
  }
}

.services-editorial-head{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
  gap: clamp(24px, 4vw, 48px);
  align-items: start;
  margin-bottom: clamp(40px, 6vw, 72px);
}
.services-editorial-display{
  margin: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(40px, 7vw, 76px) + var(--heading-size-add));
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3c3633;
  border: 0;
  box-shadow: none;
  text-decoration: none;
  text-decoration-line: none;
  text-underline-offset: 0;
  text-decoration-thickness: 0;
}
.services-editorial-display::before,
.services-editorial-display::after{
  content: none;
}
.services-editorial-lead{
  margin: 0;
  padding-top: 0.35em;
  max-width: 46ch;
  margin-left: auto;
  font-family: var(--font-body);
  font-weight: var(--font-body-weight);
  font-size: clamp(14px, 1.2vw, 17px);
  line-height: 1.65;
  color: #3c3633;
  text-align: right;
}
.services-editorial-grid{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(20px, 3.5vw, 40px);
}
.services-editorial-card{
  display: flex;
  flex-direction: column;
  align-items: stretch;
  color: inherit;
}
.services-editorial-media-trigger{
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  transition: opacity 0.2s ease;
}
.services-editorial-media-trigger:hover{
  opacity: 0.94;
}
.services-editorial-media-trigger:focus-visible{
  outline: 2px solid #3c3633;
  outline-offset: 4px;
}
.services-editorial-media{
  display: block;
  position: relative;
  overflow: hidden;
  aspect-ratio: 4 / 5;
  width: 100%;
  background-color: rgba(60, 54, 51, 0.08);
  background-image: var(--services-editorial-img);
  background-size: cover;
  background-position: center;
  border: 1px solid rgba(60, 54, 51, 0.12);
}
.services-editorial-media img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.services-editorial-media--photo{
  background-image: none;
}
.services-editorial-label{
  display: block;
  margin-top: clamp(16px, 2.2vw, 24px);
  text-align: center;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: clamp(14px, 1.15vw, 17px);
  letter-spacing: 0.04em;
  color: #3c3633;
}
.services-editorial-cta-wrap{
  margin: clamp(44px, 6vw, 64px) 0 0;
  text-align: center;
}
.services-editorial-cta{
  display: inline-block;
  padding: 15px 36px;
  box-sizing: border-box;
  font-family: var(--font-button);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  color: #f5f2ed;
  background: #3c3633;
  border: 1px solid rgba(20, 19, 17, 0.2);
  transition: background 0.2s ease, color 0.2s ease;
}
.services-editorial-cta:hover{
  background: #2e2a28;
  color: #fff;
}
.services-editorial-cta-row{
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
  align-items: center;
  margin: clamp(44px, 6vw, 64px) 0 0;
}
.services-editorial-cta-row--single{
  gap: 0;
}
button.services-editorial-cta{
  font-family: var(--font-button);
  cursor: pointer;
}
.services-editorial-cta--outline{
  background: transparent;
  color: #3c3633;
  border: 1px solid #3c3633;
}
.services-editorial-cta--outline:hover{
  background: rgba(60, 54, 51, 0.07);
  color: #3c3633;
}

/* Services hub — packages & pricing modal */
.services-pricing-dialog{
  border: 0;
  padding: 0;
  max-width: calc(100% - 24px);
  width: min(720px, 100%);
  background: transparent;
}
.services-pricing-dialog::backdrop{
  background: rgba(20, 19, 17, 0.46);
}
.services-pricing-dialog-inner{
  position: relative;
  max-height: min(88vh, 900px);
  overflow: auto;
  padding: clamp(20px, 4vw, 32px) clamp(18px, 3vw, 28px) 28px;
  padding-top: clamp(52px, 8vw, 56px);
  background: #f6f3ec;
  border: 1px solid rgba(60, 54, 51, 0.25);
  color: #2a2623;
  box-shadow: inset 0 5px 0 0 #e1d7c8;
}

/* Services hub — pricing modals: unified white + tan palette */
#pricing-modal-branding .services-pricing-dialog-inner,
#pricing-modal-websites .services-pricing-dialog-inner,
#pricing-modal-social .services-pricing-dialog-inner{
  background: #f6f3ec;
  border-color: rgba(60, 54, 51, 0.25);
  box-shadow: inset 0 5px 0 0 #e1d7c8;
}
#pricing-modal-branding .services-pricing-dialog-close,
#pricing-modal-websites .services-pricing-dialog-close,
#pricing-modal-social .services-pricing-dialog-close{
  border-color: rgba(60, 54, 51, 0.26);
  background: #fffdf9;
  color: #2d2825;
}
#pricing-modal-branding .services-pricing-dialog-close:hover,
#pricing-modal-websites .services-pricing-dialog-close:hover,
#pricing-modal-social .services-pricing-dialog-close:hover{
  background: rgba(122, 90, 58, 0.12);
}
#pricing-modal-branding .services-pricing-dialog-title,
#pricing-modal-websites .services-pricing-dialog-title,
#pricing-modal-social .services-pricing-dialog-title{
  color: #1f1b18;
}
#pricing-modal-branding .services-pricing-dialog-lead,
#pricing-modal-websites .services-pricing-dialog-lead,
#pricing-modal-social .services-pricing-dialog-lead{
  color: rgba(44, 38, 34, 0.86);
}
#pricing-modal-branding .services-pricing-tier,
#pricing-modal-websites .services-pricing-tier,
#pricing-modal-social .services-pricing-tier{
  background: #ede5d9;
  border-color: rgba(60, 54, 51, 0.2);
}
#pricing-modal-branding .services-pricing-tier-rule,
#pricing-modal-websites .services-pricing-tier-rule,
#pricing-modal-social .services-pricing-tier-rule{
  background: rgba(60, 54, 51, 0.34);
}
#pricing-modal-branding .services-pricing-tier-idx,
#pricing-modal-websites .services-pricing-tier-idx,
#pricing-modal-social .services-pricing-tier-idx{
  color: #5e5143;
}
#pricing-modal-branding .services-pricing-tier-name,
#pricing-modal-websites .services-pricing-tier-name,
#pricing-modal-social .services-pricing-tier-name{
  color: #2b2623;
}
#pricing-modal-branding .services-pricing-dialog-more a,
#pricing-modal-websites .services-pricing-dialog-more a,
#pricing-modal-social .services-pricing-dialog-more a{
  color: #6a4d32;
}
#pricing-modal-branding .services-pricing-dialog-more a:hover,
#pricing-modal-websites .services-pricing-dialog-more a:hover,
#pricing-modal-social .services-pricing-dialog-more a:hover{
  color: #4d3824;
}
.services-pricing-dialog-close{
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  width: 44px;
  height: 44px;
  margin: 0;
  border: 1px solid rgba(60, 54, 51, 0.25);
  background: rgba(236, 236, 234, 0.95);
  color: #3c3633;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  border-radius: 0;
}
.services-pricing-dialog-close:hover{
  background: rgba(60, 54, 51, 0.08);
}
.services-pricing-dialog-title{
  margin: 0 52px 10px 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-style: normal;
  font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
  font-feature-settings: "liga" 1, "clig" 1, "calt" 1, "dlig" 1;
  font-size: calc(clamp(1.75rem, 3.6vw, 2.5rem) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: 0.06em;
  line-height: 1.12;
  text-transform: uppercase;
}
.services-pricing-dialog-lead{
  margin: 0 0 20px;
  font-size: 14px;
  line-height: 1.55;
  color: rgba(60, 54, 51, 0.85);
}
.services-pricing-tier-list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(16px, 2.4vw, 22px);
  counter-reset: svc-tier;
}
.services-pricing-tier{
  counter-increment: svc-tier;
  margin: 0;
  padding: clamp(22px, 3.2vw, 32px) clamp(20px, 3vw, 28px);
  text-align: center;
  background: #e3e2df;
  border: 1px solid rgba(20, 19, 17, 0.14);
  box-sizing: border-box;
}
.services-pricing-tier-top{
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin: 0 0 clamp(18px, 2.2vw, 26px);
}
.services-pricing-tier-idx{
  flex: 0 0 auto;
  min-width: 1.5em;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  font-style: normal;
  letter-spacing: 0.08em;
  color: #141210;
  text-align: left;
}
.services-pricing-tier-idx::before{
  content: counter(svc-tier, decimal-leading-zero);
}
.services-pricing-tier-rule{
  flex: 1 1 auto;
  min-width: 0;
  height: 1px;
  background: rgba(20, 19, 17, 0.42);
}
.services-pricing-tier-name{
  margin: 0 0 clamp(10px, 1.4vw, 14px);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: clamp(0.75rem, 1.05vw, 0.9rem);
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0.14em;
  line-height: 1.4;
  text-transform: uppercase;
  color: #141210;
  text-align: center;
}
.services-pricing-tier-price{
  margin: 0 0 6px;
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.services-pricing-tier-meta{
  margin: 0 0 clamp(8px, 1.2vw, 12px);
  font-size: 12px;
  letter-spacing: 0.04em;
  color: rgba(26, 25, 23, 0.68);
  text-align: center;
}
.services-pricing-tier-desc{
  margin: 0;
  max-width: 52ch;
  margin-inline: auto;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: var(--font-body-weight);
  line-height: 1.6;
  color: rgba(26, 25, 23, 0.82);
  text-align: center;
}
.services-pricing-dialog-more{
  margin: 20px 0 0;
  font-size: 14px;
}
.services-pricing-dialog-more a{
  color: #1a3329;
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.services-pricing-dialog-more a:hover{
  color: #1a3329;
}

/* Services hub — pricing modals: landscape row on desktop (no inner scroll); stacked on mobile */
@media (min-width: 821px){
  .services-pricing-dialog{
    width: min(96vw, 1240px);
    max-width: none;
  }
  .services-pricing-dialog-inner{
    max-height: none;
    overflow: visible;
    padding: clamp(18px, 2.2vw, 26px) clamp(22px, 2.8vw, 36px) clamp(20px, 2.5vw, 28px);
    padding-top: clamp(44px, 5vw, 52px);
  }
  .services-pricing-dialog-title{
    margin-bottom: 8px;
  }
  .services-pricing-dialog-lead{
    margin-bottom: clamp(14px, 2vw, 18px);
    max-width: 80ch;
  }
  .services-pricing-tier-list{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(12px, 1.6vw, 18px);
    align-items: stretch;
  }
  .services-pricing-tier-list.services-pricing-tier-list--compact{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .services-pricing-tier{
    display: flex;
    flex-direction: column;
    padding: clamp(14px, 1.8vw, 20px) clamp(10px, 1.4vw, 16px);
    min-height: 0;
  }
  .services-pricing-tier-top{
    margin-bottom: clamp(12px, 1.6vw, 16px);
  }
  .services-pricing-tier-name{
    font-size: clamp(0.68rem, 0.85vw, 0.82rem);
  }
  .services-pricing-tier-meta{
    font-size: 11px;
  }
  .services-pricing-tier-desc{
    max-width: none;
    font-size: 12.5px;
    line-height: 1.5;
    flex: 1 1 auto;
  }
  .services-pricing-dialog-more{
    margin-top: clamp(14px, 2vw, 18px);
    text-align: center;
  }
}

@media (max-width: 820px){
  .services-editorial-head{
    grid-template-columns: 1fr;
  }
  .services-editorial-lead{
    text-align: left;
    margin-left: 0;
    max-width: none;
    padding-top: 0;
  }
  .services-editorial-grid{
    grid-template-columns: 1fr;
    max-width: 420px;
    margin-inline: auto;
  }
  /* Services hub catalog: keep three cards in one row on tablet (stack on very narrow screens below) */
  .services-editorial--catalog .services-editorial-grid--catalog{
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: none;
    width: 100%;
    margin-inline: 0;
    gap: clamp(10px, 2.5vw, 20px);
  }
  .services-editorial--catalog .services-editorial-grid--catalog > li:last-child{
    grid-column: auto;
  }
  .services-editorial--catalog .services-editorial-grid--catalog > li:last-child .services-catalog-card{
    max-width: none;
    margin-inline: 0;
  }
  .page-services-hub .services-editorial--catalog .services-catalog-card .services-editorial-media{
    aspect-ratio: 3 / 4;
  }
}

@media (max-width: 520px){
  .services-editorial--catalog .services-editorial-grid--catalog{
    grid-template-columns: 1fr;
    max-width: min(420px, 100%);
    margin-inline: auto;
    gap: clamp(16px, 4vw, 24px);
  }
  .services-editorial--catalog .services-editorial-grid--catalog > li:last-child{
    grid-column: auto;
  }
}
.services-hub-intro-block{
  text-align: center;
  max-width: 72ch;
  margin-left: auto;
  margin-right: auto;
}
.services-hub-main-title{
  margin: 0 0 clamp(10px, 1.5vw, 16px);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(32px, 4.2vw, 48px);
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0.02em;
  color: var(--ink);
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.services-hub-subtitle{
  margin: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(18px, 2.1vw, 22px);
  font-style: normal;
  font-weight: 400;
  line-height: 1.45;
  color: rgba(20, 19, 17, 0.82);
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.services-hub-rule{
  height: 1px;
  width: min(100%, 520px);
  margin: clamp(20px, 3vw, 28px) auto;
  background: rgba(20, 19, 17, 0.15);
  border: 0;
}
.services-hub-kicker{
  margin: 0 auto;
  max-width: 58ch;
  font-family: var(--font-ui, system-ui, sans-serif);
  font-size: clamp(11px, 0.95vw, 12px);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.62);
}
.services-hub-grid{
  list-style: none;
  margin: clamp(36px, 5vw, 56px) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  border: 1px solid rgba(20, 19, 17, 0.18);
  align-items: stretch;
}
.services-hub-section--showcase .services-hub-grid{
  margin-top: clamp(40px, 5.5vw, 64px);
  gap: clamp(20px, 3vw, 32px);
  border: none;
}
.services-hub-grid > li{
  margin: 0;
  display: flex;
  min-height: 0;
}
.services-hub-card{
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 100%;
  text-decoration: none;
  color: inherit;
  border-left: 1px solid rgba(20, 19, 17, 0.18);
  box-sizing: border-box;
  background: #e8e4de;
  transition: background 0.25s ease, box-shadow 0.25s ease;
}
.services-hub-section--showcase .services-hub-card{
  border: 1px solid rgba(20, 19, 17, 0.14);
  background: #ebe6df;
  padding-bottom: clamp(4px, 0.6vw, 8px);
}
.services-hub-grid > li:first-child .services-hub-card{
  border-left: 0;
}
.services-hub-section--showcase .services-hub-grid > li:first-child .services-hub-card{
  border-left: 1px solid rgba(20, 19, 17, 0.14);
}
.services-hub-card--featured{
  background:
    linear-gradient(180deg, rgba(26, 51, 41, 0.06), transparent 55%),
    #e4dfd7;
}
.services-hub-section--showcase .services-hub-card--featured{
  background:
    linear-gradient(180deg, rgba(26, 51, 41, 0.04), transparent 50%),
    #e8e4de;
}
.services-hub-card:hover{
  background: #ebe6df;
  outline: 1px solid rgba(26, 51, 41, 0.18);
  outline-offset: -1px;
}
.services-hub-section--showcase .services-hub-card:hover{
  background: #f0ebe4;
  outline: none;
  box-shadow: 0 2px 24px rgba(20, 19, 17, 0.06);
}
.services-hub-card--featured:hover{
  background:
    linear-gradient(180deg, rgba(26, 51, 41, 0.08), transparent 55%),
    #e8e2d8;
}
.services-hub-section--showcase .services-hub-card--featured:hover{
  background:
    linear-gradient(180deg, rgba(26, 51, 41, 0.06), transparent 50%),
    #ebe6df;
}
.services-hub-card-media{
  aspect-ratio: 4 / 3;
  background-color: rgba(20, 19, 17, 0.08);
  background-image: var(--services-hub-card-img);
  background-size: cover;
  background-position: center;
  border-bottom: 1px solid rgba(20, 19, 17, 0.12);
}
.services-hub-section--showcase .services-hub-card-media{
  border-bottom: 1px solid rgba(20, 19, 17, 0.1);
}
.services-hub-card-title{
  margin: clamp(22px, 3vw, 32px) clamp(18px, 2.4vw, 28px) 0;
  text-align: center;
}
.services-hub-section--showcase .services-hub-card-title{
  margin-top: clamp(18px, 2.4vw, 26px);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-style: normal;
  font-weight: 400;
  font-size: clamp(20px, 2.2vw, 26px);
  letter-spacing: 0.02em;
  text-transform: none;
  color: var(--ink);
}
.services-hub-card-text{
  margin: clamp(12px, 1.6vw, 18px) clamp(18px, 2.4vw, 28px) 0;
  font-size: var(--font-body-size);
  line-height: 1.65;
  text-align: center;
  color: rgba(20, 19, 17, 0.78);
  flex: 1 1 auto;
}
.services-hub-section--showcase .services-hub-card-text{
  margin-bottom: clamp(22px, 2.8vw, 32px);
}
.services-hub-card-cta{
  display: block;
  margin: clamp(20px, 2.5vw, 28px) clamp(18px, 2.4vw, 28px) clamp(26px, 3.2vw, 36px);
  font-family: var(--font-button);
  font-size: clamp(12px, 1.1vw, 13px);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-align: center;
  color: var(--moss, #1a3329);
}
.services-hub-card:hover .services-hub-card-cta{
  text-decoration: underline;
  text-underline-offset: 3px;
}
.services-hub-bottom-wrap{
  margin: clamp(36px, 5vw, 52px) 0 0;
  text-align: center;
}
.services-hub-bottom-cta{
  display: inline-block;
  width: 100%;
  max-width: 440px;
  padding: 16px 28px;
  box-sizing: border-box;
  font-family: var(--font-button);
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  color: #fff;
  background: #7a6f62;
  border: 1px solid rgba(20, 19, 17, 0.12);
  transition: background 0.2s ease, color 0.2s ease;
}
.services-hub-bottom-cta:hover{
  background: #6b6257;
  color: #fff;
}
@media (max-width: 900px){
  .services-hub-grid{
    grid-template-columns: 1fr;
  }
  .services-hub-card{
    border-left: 0;
    border-top: 1px solid rgba(20, 19, 17, 0.18);
  }
  .services-hub-grid > li:first-child .services-hub-card{
    border-top: 0;
  }
  .services-hub-section--showcase .services-hub-card{
    border: 1px solid rgba(20, 19, 17, 0.14);
  }
  .services-hub-section--showcase .services-hub-grid > li:first-child .services-hub-card{
    border-top: 1px solid rgba(20, 19, 17, 0.14);
  }
}
.services-reviews-section .services-reviews-lead{
  max-width: 62ch;
}
.services-reviews-section .services-reviews-lead a{
  color: var(--moss);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.services-reviews-section .services-reviews-lead a:hover{
  color: #1a3329;
}

/* Universal testimonials (editorial carousel): ~2 cards visible, scroll + arrows */
.services-reviews-section.reviews-section--editorial .container{
  text-align: center;
}
.reviews-section-editorial-title{
  margin: 0 auto 10px;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(34px, 4.2vw, 56px) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.88);
  text-align: center;
  max-width: 36ch;
}
.services-reviews-section.reviews-section--editorial .services-reviews-lead--editorial{
  margin-top: 0;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.reviews-section--editorial .review-editorial{
  text-align: center;
}
.reviews-section--editorial .review-editorial__band{
  justify-content: center;
}
.reviews-section--editorial .review-editorial__attr{
  text-align: center;
}
.reviews-carousel--editorial{
  margin-top: clamp(28px, 3.5vw, 40px);
  gap: clamp(10px, 2vw, 20px);
}
.home-testimonials-cta{
  margin: clamp(32px, 4vw, 52px) 0 0;
  display: flex;
  justify-content: center;
}
.reviews-carousel--editorial .reviews-carousel-track{
  gap: 24px;
  align-items: flex-start;
}
.reviews-carousel--editorial .reviews-carousel-viewport{
  container-type: inline-size;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-inline: clamp(6px, 1.2vw, 14px);
  padding-bottom: 6px;
}
.reviews-carousel--editorial .reviews-carousel-viewport::-webkit-scrollbar{
  display: none;
  width: 0;
  height: 0;
}
/* Two cards per view (one 24px gap between columns) */
.reviews-carousel--editorial .reviews-carousel-slide{
  flex: 0 0 calc((100cqi - 24px) / 2);
  width: auto;
  min-width: min(280px, calc((100cqi - 24px) / 2));
  max-width: none;
  scroll-snap-align: start;
}
@media (max-width: 780px){
  .reviews-carousel--editorial .reviews-carousel-slide{
    flex: 0 0 calc(100cqi - 20px);
    min-width: 0;
  }
}
@media (max-width: 520px){
  .reviews-carousel--editorial .reviews-carousel-slide{
    flex-basis: calc(100cqi - 28px);
    min-width: 0;
    max-width: none;
  }
}

/* Home — Latest from the blog */
#blog.section{
  background: linear-gradient(160deg, #1a3329 0%, var(--moss) 48%, #1a3329 100%);
  border-top-color: rgba(255, 255, 255, 0.1);
  border-bottom-color: rgba(255, 255, 255, 0.1);
}
#blog .section-head{
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: clamp(22px, 3.2vw, 32px);
}
#blog .section-title{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(40px, 5.2vw, 72px) + var(--heading-size-add));
  line-height: 1.04;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 400;
  color: rgba(247, 241, 230, 0.96);
}
#blog .chip{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  border-color: rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.08);
  color: rgba(247, 241, 230, 0.94);
  font-size: clamp(14px, 1.35vw, 19px);
  font-weight: 400;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 14px 24px;
  min-height: 48px;
}
#blog .chip:hover{
  background: rgba(255, 255, 255, 0.16);
}
#blog .chip.is-active{
  background: rgba(247, 241, 230, 0.95);
  color: var(--moss);
  border-color: rgba(247, 241, 230, 0.95);
}
#blog .filters{
  gap: 12px 14px;
  margin: 8px 0 22px;
}
#blog .project-card .pc-title{
  margin-top: 10px;
  margin-bottom: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(14px, 1.25vw, 17px);
  font-weight: 400;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
  font-feature-settings: "liga" 1, "clig" 1, "calt" 1, "dlig" 1;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: rgba(20, 19, 17, 0.92);
}

.review-editorial{
  margin: 0;
  padding: clamp(28px, 4vw, 40px) clamp(22px, 3vw, 36px) clamp(32px, 4vw, 44px);
  background: rgba(252, 250, 246, 0.92);
  border: 1px solid rgba(20, 19, 17, 0.1);
  border-radius: 2px;
  box-shadow: none;
  box-sizing: border-box;
  min-height: 100%;
}
/* Client love carousel: shorter cards, two per row */
.reviews-carousel--editorial .review-editorial{
  min-height: 0;
  padding: clamp(16px, 2.2vw, 22px) clamp(16px, 2.4vw, 26px) clamp(16px, 2.2vw, 22px);
}
.reviews-carousel--editorial .review-editorial__band{
  margin: 0 0 10px;
  padding-bottom: 8px;
  gap: 12px;
}
.reviews-carousel--editorial .review-editorial__pull{
  margin: 0 0 10px;
}
.reviews-carousel--editorial .review-editorial__pull p{
  font-size: clamp(17px, 2vw, 26px);
  line-height: 1.18;
}
.reviews-carousel--editorial .review-editorial__body p{
  font-size: var(--font-body-size);
  line-height: 1.52;
}
.reviews-carousel--editorial .review-editorial__attr{
  margin: 14px 0 0;
  padding-top: 12px;
}
.review-editorial__band{
  display: flex;
  flex-direction: row;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 clamp(20px, 2.5vw, 28px);
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(20, 19, 17, 0.1);
}
.review-editorial__series{
  font-family: var(--font-body);
  font-size: clamp(10px, 0.95vw, 11px);
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.5);
}
.review-editorial__index{
  font-family: var(--font-body);
  font-size: clamp(10px, 0.95vw, 11px);
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.45);
}
.review-editorial__pull{
  margin: 0 0 clamp(18px, 2.2vw, 24px);
  padding: 0;
  border: 0;
  font-family: var(--font-body);
  font-style: normal;
  font-weight: var(--font-body-weight);
}
.review-editorial__pull p{
  margin: 0;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(22px, 2.6vw, 34px);
  line-height: 1.22;
  letter-spacing: -0.02em;
  font-weight: 400;
  color: rgba(20, 19, 17, 0.92);
  font-variant-ligatures: none;
  font-feature-settings: normal;
}
.review-editorial__em{
  font-style: normal;
  font-weight: 400;
}
.review-editorial__body{
  font-family: var(--font-body);
  font-weight: var(--font-body-weight);
}
.review-editorial__body p{
  margin: 0;
  font-size: var(--font-body-size);
  line-height: 1.72;
  color: rgba(20, 19, 17, 0.78);
}
.review-editorial__body p + p{
  margin-top: 0.9em;
}
.review-editorial__attr{
  margin: clamp(24px, 3vw, 32px) 0 0;
  padding-top: clamp(18px, 2vw, 24px);
  border-top: 1px solid rgba(20, 19, 17, 0.08);
  font-family: var(--font-body);
  font-size: clamp(11px, 1.05vw, 13px);
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-align: center;
  color: rgba(20, 19, 17, 0.55);
}

/* Gold "hand-drawn" highlights */
.review-mark{
  position: relative;
}
.review-mark--circle{
  display: inline;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  padding: 0.06em 0.28em 0.12em;
  border: 1.5px solid #b8923f;
  border-radius: 42% 58% 48% 52% / 48% 45% 55% 52%;
  transform: rotate(-1.2deg);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  color: rgba(20, 19, 17, 0.92);
}
.review-editorial__pull .review-mark--circle{
  border-color: #a67c32;
}
.review-mark--underline{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  border-bottom: 1.5px solid #b8923f;
  padding-bottom: 1px;
  text-decoration: none;
  color: inherit;
}

.reviews-carousel{
  position: relative;
  display: flex;
  align-items: stretch;
  gap: clamp(6px, 1.5vw, 12px);
  margin-top: clamp(32px, 4vw, 48px);
}
.reviews-carousel-viewport{
  flex: 1;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 6px;
  outline: none;
}
.reviews-carousel-viewport:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.45);
  outline-offset: 4px;
}
.reviews-carousel-track{
  display: flex;
  flex-wrap: nowrap;
  gap: clamp(16px, 2.5vw, 24px);
  list-style: none;
  margin: 0;
  padding: 0;
  width: max-content;
}
.reviews-carousel-slide{
  flex: 0 0 auto;
  width: min(340px, calc(100vw - 120px));
  scroll-snap-align: start;
}
@media (min-width: 900px){
  .reviews-carousel-slide{
    width: min(320px, calc((100vw - 140px) / 3));
  }
}
@media (max-width: 520px){
  .reviews-carousel-slide{
    width: min(300px, calc(100vw - 100px));
  }
}
.reviews-carousel-nav{
  flex: 0 0 auto;
  align-self: center;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(20, 19, 17, 0.12);
  background: rgba(199, 154, 104, 0.22);
  color: rgba(20, 19, 17, 0.82);
  display: inline-grid;
  place-items: center;
  cursor: pointer;
  transition: background 0.2s ease, opacity 0.2s ease, transform 0.2s ease;
}
.reviews-carousel-nav:hover:not(:disabled){
  background: rgba(199, 154, 104, 0.35);
}
.reviews-carousel-nav:disabled{
  opacity: 0.35;
  cursor: default;
}
@media (max-width: 640px){
  .reviews-carousel{
    gap: 4px;
  }
  .reviews-carousel-nav{
    width: 38px;
    height: 38px;
  }
}
.review-card{
  margin: 0;
  height: 100%;
  padding: clamp(22px, 2.8vw, 30px);
  background: #f9f4f0;
  border: 1px solid rgba(20, 19, 17, 0.08);
  border-radius: 4px;
  box-sizing: border-box;
}
.review-quote{
  margin: 0;
  font-family: var(--font-body);
  font-style: normal;
  font-weight: var(--font-body-weight);
}
.review-quote p{
  margin: 0;
  font-size: var(--font-body-size);
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.88);
}
.review-quote p + p{
  margin-top: 0.85em;
}
.review-attribution{
  margin: clamp(14px, 2vw, 18px) 0 0;
  font-family: var(--font-body);
  font-size: 13px;
  letter-spacing: 0.02em;
  color: rgba(20, 19, 17, 0.62);
}
.review-attribution strong{
  font-weight: 600;
  color: rgba(20, 19, 17, 0.88);
}
/* Services hub — About strip (editorial split layout) */
.page-services-hub section.services-about-strip.section{
  border-top: 0;
  border-bottom: 0;
}
.page-services-hub .services-about-strip + .faq-band{
  border-top: 0;
}
.page-services-hub .services-about-strip{
  position: relative;
  background-color: #f0efed;
  background-image: none;
}
.page-services-hub .services-about-strip .section-title{
  color: rgba(20, 19, 17, 0.94);
}
.page-services-hub .services-about-strip .services-about-text{
  color: rgba(20, 19, 17, 0.7);
}
.page-services-hub .services-about-strip .services-about-cta .button.primary{
  background: transparent;
  color: #1a3329;
  border-color: rgba(26, 51, 41, 0.24);
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 13px;
  padding: 4px 0 8px;
  border-width: 0 0 1px;
  border-radius: 0;
}
.page-services-hub .services-about-strip .services-about-cta .button.primary:hover{
  background: transparent;
  color: #1a3329;
  border-color: rgba(26, 51, 41, 0.45);
}
.page-services-hub .services-about-strip .services-about-cta .button.primary:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.55);
  outline-offset: 3px;
}
.services-about-strip-inner{
  max-width: 1200px;
  margin: 0 auto;
  text-align: left;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  gap: clamp(24px, 4vw, 52px);
  align-items: center;
}
.page-services-hub .services-about-strip-inner{
  max-width: min(1340px, calc(100% - 48px));
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.35fr);
  gap: clamp(28px, 5vw, 64px);
}
.services-about-strip-copy{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}
.services-about-strip .section-title{
  margin-bottom: 0;
  font-style: normal;
  text-align: left;
  width: 100%;
  max-width: 18ch;
}
.services-about-strip .services-about-text{
  margin-top: clamp(20px, 2.8vw, 28px);
  margin-bottom: 0;
  max-width: 44ch;
  margin-left: 0;
  margin-right: 0;
  text-align: left;
}
.services-about-strip .services-about-cta{
  margin-top: clamp(20px, 2.5vw, 28px);
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.services-about-cta{
  justify-content: flex-start;
}
.services-about-strip-media{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(12px, 1.8vw, 20px);
}
.page-services-hub .services-about-strip-media{
  gap: clamp(16px, 2.4vw, 28px);
}
.services-about-strip-media-card{
  margin: 0;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #d8d5cf;
}
.page-services-hub .services-about-strip-media .services-about-strip-media-card{
  aspect-ratio: 512 / 400;
}
.page-services-hub .services-about-strip-media .services-about-strip-media-card--wide{
  aspect-ratio: 1024 / 707;
}
.services-about-strip-media-card--wide{
  aspect-ratio: 1024 / 707;
}
.services-about-strip-media-card img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media (max-width: 900px){
  .services-about-strip-inner{
    grid-template-columns: 1fr;
  }
  .services-about-strip-copy{
    align-items: center;
    text-align: center;
  }
  .services-about-strip .section-title,
  .services-about-strip .services-about-text{
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
  .services-about-strip .services-about-cta,
  .services-about-cta{
    justify-content: center;
  }
}

/* FAQ — full-bleed image, accordion, editorial (universal sitewide) */
.faq-band{
  position: relative;
  overflow: hidden;
  padding: clamp(72px, 10vw, 120px) 0;
  border-top: 1px solid rgba(20, 19, 17, 0.08);
}
/* After remote collaborations: no hairline (must follow `.faq-band` rule for cascade) */
.about-remote-collab + .faq-band{
  border-top: 0;
}
.faq-band-bg{
  position: absolute;
  inset: 0;
  background-image: var(--faq-bg);
  background-size: cover;
  background-position: center;
  filter: grayscale(1) contrast(1.06);
  transform: scale(1.02);
}
.faq-band-scrim{
  position: absolute;
  inset: 0;
  /* Uniform darken — no gradient so the photo reads evenly edge to edge */
  background: rgba(8, 11, 9, 0.76);
}
.faq-band-inner{
  position: relative;
  z-index: 1;
  max-width: 720px;
  margin: 0 auto;
  padding-inline: clamp(12px, 3vw, 24px);
}
.faq-heading{
  margin: 0 0 clamp(28px, 4vw, 40px);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-weight: 400;
  font-size: calc(clamp(22px, 2.4vw, 30px) + var(--heading-size-add));
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-align: center;
  color: rgba(247, 241, 230, 0.98);
}
.faq-list{
  border-top: 1px solid rgba(255, 255, 255, 0.38);
}
.faq-item{
  border-bottom: 1px solid rgba(255, 255, 255, 0.38);
}
.faq-item-heading{
  margin: 0;
  font-size: inherit;
  font-weight: 400;
}
.faq-trigger{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: clamp(18px, 2.5vw, 24px) 0;
  margin: 0;
  background: none;
  border: 0;
  cursor: pointer;
  text-align: left;
  font-family: var(--font-button);
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 400;
  font-style: italic;
  letter-spacing: 0.02em;
  color: rgba(255, 255, 255, 0.96);
  transition: color 0.2s ease;
}
.faq-trigger:hover{
  color: #fff;
}
.faq-trigger:focus-visible{
  outline: 2px solid rgba(247, 241, 230, 0.85);
  outline-offset: 4px;
}
.faq-q{
  flex: 1 1 auto;
  min-width: 0;
  text-transform: lowercase;
  text-align: left;
}
.faq-q::first-letter{
  text-transform: uppercase;
}
.faq-icon{
  flex: 0 0 auto;
  margin-top: 0.1em;
  font-size: 22px;
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  opacity: 0.95;
}
.faq-panel{
  padding: 0 0 clamp(18px, 2.5vw, 24px);
  margin: 0;
  text-align: left;
}
.faq-panel p{
  margin: 0;
  font-size: var(--font-body-size);
  line-height: 1.65;
  color: rgba(247, 241, 230, 0.9);
  max-width: 62ch;
  text-align: left;
}
.faq-inline-link{
  color: rgba(247, 241, 230, 0.98);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.faq-inline-link:hover{
  color: #fff;
}

/* Services hub — FAQ (dark editorial band: image, scrim, white rules & type) */
.page-services-hub .faq-band--services-hub{
  padding: clamp(80px, 11vw, 132px) 0;
}
.page-services-hub .faq-band--services-hub .faq-band-bg{
  filter: grayscale(1) contrast(1.14) brightness(0.78);
  transform: scale(1.04);
}
.page-services-hub .faq-band--services-hub .faq-band-scrim{
  background: rgba(9, 12, 10, 0.8);
}
.page-services-hub .faq-band--services-hub .faq-band-inner{
  max-width: min(640px, 100%);
}
.page-services-hub .faq-band--services-hub .faq-heading{
  margin-bottom: clamp(36px, 5vw, 52px);
  font-size: calc(clamp(22px, 2.8vw, 34px) + var(--heading-size-add));
  letter-spacing: 0.26em;
  line-height: 1.2;
  color: #fff;
  text-shadow: 0 2px 28px rgba(0, 0, 0, 0.45);
}
.page-services-hub .faq-band--services-hub .faq-list{
  border-top: 1px solid rgba(255, 255, 255, 0.55);
}
.page-services-hub .faq-band--services-hub .faq-item{
  border-bottom: 1px solid rgba(255, 255, 255, 0.55);
}
.page-services-hub .faq-band--services-hub .faq-trigger{
  align-items: center;
  padding: clamp(22px, 3vw, 32px) 0;
  font-size: clamp(15px, 1.35vw, 18px);
  font-weight: var(--font-body-weight);
  letter-spacing: 0.02em;
  color: #fff;
}
.page-services-hub .faq-band--services-hub .faq-q{
  text-transform: none;
}
.page-services-hub .faq-band--services-hub .faq-q::first-letter{
  text-transform: none;
}
.page-services-hub .faq-band--services-hub .faq-icon{
  font-size: clamp(20px, 2vw, 24px);
  font-weight: 300;
  opacity: 1;
}
.page-services-hub .faq-band--services-hub .faq-panel p{
  color: rgba(255, 255, 255, 0.92);
}
.page-services-hub .faq-band--services-hub .faq-inline-link{
  color: #fff;
}

/* Services page — editorial branding tiers (three columns, portrait photos, script ampersand) */
.branding-showcase-section .portfolio-page-lead{
  max-width: 62ch;
}
.branding-showcase-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin-top: clamp(28px, 4vw, 40px);
  align-items: stretch;
}
.branding-showcase-card{
  margin: 0;
  padding: clamp(26px, 3.5vw, 42px) clamp(16px, 2.4vw, 28px);
  text-align: center;
  border-left: 1px solid rgba(20, 19, 17, 0.22);
  box-sizing: border-box;
}
.branding-showcase-card:first-child{
  border-left: 0;
}
.branding-showcase-card--featured{
  background: linear-gradient(180deg, rgba(26, 51, 41, 0.05), transparent 58%);
}
.branding-showcase-title{
  margin: 0;
  font-weight: 400;
  line-height: 1.12;
}
.branding-showcase-title-inner{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
  column-gap: 0.32em;
  row-gap: 0.08em;
}
.branding-showcase-title-line{
  font-family: var(--font-subhead-hollow);
  font-size: var(--font-subhead-hollow-size);
  font-weight: 900;
  font-style: normal;
  letter-spacing: 0.03em;
  text-transform: none;
  color: rgba(20, 19, 17, 0.94);
}
.branding-showcase-amp{
  font-family: "Hollow Sky", "Hollowsky", ui-handwriting, cursive;
  font-size: clamp(28px, 3.3vw, 42px);
  font-weight: var(--font-button-weight);
  line-height: 1;
  color: rgba(20, 19, 17, 0.88);
  text-transform: none;
  letter-spacing: 0.02em;
}
/* Social packages on services page — ampersands in tier titles only */
.social-showcase-section .branding-showcase-amp{
  font-family: "Hollow Sky", "Hollowsky", ui-handwriting, cursive;
  font-size: clamp(44px, 5.8vw, 68px);
  font-weight: var(--font-button-weight);
  line-height: 1;
  color: rgba(20, 19, 17, 0.94);
  letter-spacing: 0.02em;
}
/* Social media service page — tier names: Arome, all caps (overrides Hollow Sky lines) */
.page-service-social .social-showcase-section .branding-showcase-title-line{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(1.05rem, 1.9vw, 1.4rem);
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.1em;
  line-height: 1.25;
  text-transform: uppercase;
  font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
  font-feature-settings: "liga" 1, "clig" 1, "calt" 1, "dlig" 1;
  color: rgba(20, 19, 17, 0.94);
}
.page-service-social .social-showcase-section .branding-showcase-amp{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(1rem, 1.65vw, 1.25rem);
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.14em;
  line-height: 1;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.88);
}
.branding-showcase-price{
  margin: 14px 0 0;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: rgba(26, 51, 41, 0.95);
}
.branding-showcase-frame{
  margin: 20px auto 0;
  width: min(100%, 228px);
  aspect-ratio: 3 / 4;
  border: 1px solid #121412;
  box-sizing: border-box;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.35);
}
.branding-showcase-frame img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
button.branding-showcase-frame{
  appearance: none;
  display: block;
  cursor: pointer;
  font: inherit;
  padding: 0;
  color: inherit;
  text-align: left;
}
.branding-showcase-photo-trigger:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.45);
  outline-offset: 3px;
}

/* Services branding: name + price hidden until photo is clicked */
.branding-showcase-section--reveal-tier .branding-showcase-tier-meta{
  overflow: hidden;
  transition:
    max-height 0.38s ease,
    opacity 0.28s ease,
    visibility 0.28s ease;
}
.branding-showcase-section--reveal-tier .branding-showcase-card:not(.is-tier-revealed) .branding-showcase-tier-meta{
  max-height: 0;
  margin: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.branding-showcase-section--reveal-tier .branding-showcase-card.is-tier-revealed .branding-showcase-tier-meta{
  max-height: min(280px, 42vh);
  opacity: 1;
  visibility: visible;
}
@media (prefers-reduced-motion: reduce){
  .branding-showcase-section--reveal-tier .branding-showcase-tier-meta{
    transition: none;
  }
}

.branding-showcase-blurb{
  margin: 20px auto 0;
  max-width: 38ch;
  font-size: var(--font-body-size);
  line-height: 1.55;
  color: rgba(20, 19, 17, 0.72);
}
.branding-showcase-cta{
  display: inline-block;
  margin-top: 22px;
  font-family: var(--font-button);
  font-size: 11px;
  font-weight: var(--font-button-weight);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-decoration: none;
  color: rgba(20, 19, 17, 0.92);
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
  transition: color 0.2s ease, border-color 0.2s ease;
}
.branding-showcase-cta:hover{
  color: var(--moss);
  border-bottom-color: rgba(26, 51, 41, 0.35);
}
.branding-showcase-cta:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.45);
  outline-offset: 3px;
}
@media (max-width: 900px){
  .branding-showcase-grid{
    grid-template-columns: 1fr;
  }
  .branding-showcase-card{
    border-left: 0;
    border-bottom: 1px solid rgba(20, 19, 17, 0.22);
  }
  .branding-showcase-card:last-child{
    border-bottom: 0;
  }
}

/* Services — Social media: editorial grid + photo background (matches branding showcase tone) */
.social-showcase-section{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-block: clamp(56px, 8vw, 96px);
  border-top: 1px solid rgba(20, 19, 17, 0.08);
  background: #e8e4de;
}
.social-showcase-media{
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image: var(--social-showcase-img);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  pointer-events: none;
}
.social-showcase-scrim{
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(165deg, rgba(247, 241, 230, 0.94) 0%, rgba(247, 241, 230, 0.82) 42%, rgba(15, 17, 16, 0.18) 100%);
  pointer-events: none;
}
.social-showcase-content{
  position: relative;
  z-index: 2;
}
.social-showcase-lead{
  color: rgba(20, 19, 17, 0.76);
  max-width: 62ch;
}
.social-showcase-grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin-top: clamp(28px, 4vw, 40px);
  align-items: stretch;
}
.social-showcase-card{
  margin: 0;
  padding: clamp(24px, 3.2vw, 38px) clamp(14px, 2vw, 22px);
  text-align: center;
  border-left: 1px solid rgba(20, 19, 17, 0.2);
  box-sizing: border-box;
  background: rgba(247, 241, 230, 0.78);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.social-showcase-card:first-child{
  border-left: 0;
}
.social-showcase-card--featured{
  background:
    linear-gradient(180deg, rgba(26, 51, 41, 0.08), transparent 65%),
    rgba(247, 241, 230, 0.82);
}
.social-showcase-cta-row{
  margin-top: clamp(28px, 4vw, 36px);
}
@media (max-width: 1080px){
  .social-showcase-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .social-showcase-card{
    border-left: 1px solid rgba(20, 19, 17, 0.2);
  }
  .social-showcase-card:nth-child(2n + 1){
    border-left: 0;
  }
  .social-showcase-card:nth-child(n + 3){
    border-top: 1px solid rgba(20, 19, 17, 0.2);
  }
}
@media (max-width: 560px){
  .social-showcase-grid{
    grid-template-columns: 1fr;
  }
  .social-showcase-card{
    border-left: 0;
    border-top: 1px solid rgba(20, 19, 17, 0.2);
  }
  .social-showcase-card:first-child{
    border-top: 0;
  }
}
@media (prefers-reduced-motion: reduce){
  .social-showcase-card{
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background: rgba(247, 241, 230, 0.94);
  }
}

/* Services page — split hero (beige + inset / full photo + spanning title) */
.services-split-hero{
  padding-top: clamp(20px, 3vw, 36px);
}
.services-split-hero-stage{
  position: relative;
  width: 100%;
}
.services-split-hero-panels{
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: min(68vh, 600px);
  width: 100%;
}
.services-split-hero-left{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(18px, 3vw, 28px);
  padding: clamp(28px, 5vw, 52px) clamp(20px, 4vw, 44px);
  box-sizing: border-box;
  background: #e5e1d8;
}
.services-split-hero-eyebrow{
  margin: 0;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.52);
  text-align: center;
}
.services-split-hero-inset{
  width: min(100%, 272px);
  aspect-ratio: 2 / 3;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.35);
  box-sizing: border-box;
}
.services-split-hero-inset img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.services-split-hero-tagline{
  margin: 0;
  max-width: 34ch;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.15em;
  line-height: 1.45;
  text-transform: uppercase;
  text-align: center;
  color: rgba(20, 19, 17, 0.5);
}
.services-split-hero-right{
  min-height: min(68vh, 600px);
  background-color: rgba(15, 17, 16, 0.12);
  background-image: var(--services-hero-right-img);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.page-service-website .services-split-hero-right{
  --services-hero-right-img: url("./Photos/AudreyHBranding-7323.jpg");
  background-color: #e8e4dc;
}
.page-service-branding .services-split-hero-right{
  --services-hero-right-img: url("./Photos/AudreyHBranding-8165.png");
  background-color: #e8e4dc;
}
.page-service-social .services-split-hero-right{
  --services-hero-right-img: url("./Photos/AudreyHBranding-7999.png");
  background-color: #e8e4dc;
}
.services-split-hero-overlay-title{
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  margin: 0;
  padding: 0 clamp(14px, 3vw, 28px);
  text-align: center;
  pointer-events: none;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(32px, 6.8vw, 88px) + var(--heading-size-add));
  line-height: 0.98;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  font-weight: 400;
  font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
  font-feature-settings: "liga" 1, "clig" 1, "calt" 1, "dlig" 1;
  color: #fff;
}
.services-split-hero-title-inner{
  display: inline-block;
  max-width: 95vw;
}
.services-split-hero-overlay-title .services-split-hero-amp{
  font-family: "Hollow Sky", "Hollowsky", ui-handwriting, cursive;
  font-size: 1.2em;
  font-weight: var(--font-button-weight);
  vertical-align: -0.06em;
}
.services-split-hero-after{
  position: relative;
  padding-top: clamp(32px, 5vw, 56px);
  padding-bottom: clamp(44px, 6vw, 72px);
  padding-left: 48px;
  text-align: center;
}
.services-back-arrow{
  position: absolute;
  left: 0;
  top: clamp(32px, 5vw, 56px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  color: rgba(20, 19, 17, 0.5);
  text-decoration: none;
  transition: color 0.2s ease, background 0.2s ease;
}
.services-back-arrow:hover{
  color: var(--moss);
  background: rgba(26, 51, 41, 0.07);
}
.services-back-arrow:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.45);
  outline-offset: 3px;
}
.services-split-hero-lead{
  max-width: 56ch;
  margin: 0 auto;
  padding: 2px 8px 0;
  text-align: center;
  font-size: clamp(17px, 1.45vw, 19px);
  line-height: 1.68;
  color: rgba(20, 19, 17, 0.72);
}
@media (max-width: 520px){
  .services-split-hero-after{
    padding-left: 0;
    padding-top: clamp(52px, 10vw, 72px);
  }
  .services-back-arrow{
    left: 50%;
    margin-left: -22px;
    top: clamp(6px, 2vw, 12px);
  }
  .services-split-hero-lead{
    padding-top: clamp(8px, 2vw, 14px);
  }
}
@media (max-width: 900px){
  .services-split-hero-panels{
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .services-split-hero-right{
    order: -1;
    min-height: min(44vh, 380px);
  }
  .services-split-hero-left{
    padding-bottom: clamp(36px, 8vw, 56px);
  }
  .services-split-hero-overlay-title{
    font-size: clamp(26px, 9vw, 52px);
  }
}
.services-overview-jump{
  display: flex;
  flex-wrap: wrap;
  gap: 14px 26px;
  justify-content: center;
  align-items: center;
  margin: 26px 0 0;
}
.services-overview-jump a{
  font-family: var(--font-body);
  font-style: italic;
  text-transform: none;
  font-size: clamp(14px, 1.35vw, 17px);
  letter-spacing: .04em;
  color: rgba(20,19,17,.85);
  text-decoration: none;
  border-bottom: 1px solid rgba(26,51,41,.25);
  padding: 8px 4px 10px;
}

/* Services headers: dark green background with white type */
.page-services .services-split-hero-left,
.page-services .services-split-hero-after,
.page-services-hub .services-editorial--catalog{
  background: #1a3329;
}
.page-services .services-split-hero-right{
  background-color: #1a3329;
  background-image:
    linear-gradient(rgba(18, 32, 25, 0.62), rgba(18, 32, 25, 0.62)),
    var(--services-hero-right-img);
}
.page-services-hub .services-editorial--catalog .services-editorial-display,
.page-services-hub .services-editorial--catalog .services-editorial-sub,
.page-services-hub .services-editorial--catalog .services-editorial-kicker{
  color: #1a3329;
}
/* Branding / website / social service pages — hero left column copy on moss */
.page-services:not(.page-services-hub) .services-split-hero-eyebrow,
.page-services:not(.page-services-hub) .services-split-hero-tagline{
  color: rgba(255, 255, 255, 0.92);
}
.page-services:not(.page-services-hub) .services-split-hero-lead,
.page-services:not(.page-services-hub) .services-back-arrow{
  color: rgba(255, 255, 255, 0.88);
}
.page-services-hub .services-editorial--catalog .services-editorial-display,
.page-services-hub .services-editorial--catalog .services-editorial-sub,
.page-services-hub .services-editorial--catalog .services-catalog-card__title{
  font-style: normal;
}
/* Safety guard: keep text dark on light card surfaces */
.page-services-hub .services-editorial--catalog .services-catalog-card,
.page-services-hub .services-editorial--catalog .services-catalog-card__title,
.page-services-hub .services-editorial--catalog .services-catalog-card__text{
  color: #1a3329;
}
.page-services .services-back-arrow:hover{
  color: #fff;
  background: rgba(255, 255, 255, 0.12);
}
.page-services .services-back-arrow:focus-visible{
  outline: 2px solid rgba(255, 255, 255, 0.75);
}

/* Service detail pages — moody editorial hero (dark texture + left copy + inset image) */
.page-services:not(.page-services-hub) .services-split-hero--moody-editorial{
  --moody-hero-image: url("./Photos/AudreyHBranding-7647-hero.png");
  padding-top: clamp(12px, 2vw, 28px);
  padding-bottom: clamp(36px, 6vw, 72px);
  margin-left: 0;
  margin-right: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  background-color: #141210;
  background-image:
    linear-gradient(
      122deg,
      rgba(12, 10, 8, 0.94) 0%,
      rgba(26, 22, 18, 0.58) 38%,
      rgba(14, 12, 10, 0.92) 100%
    ),
    linear-gradient(to bottom, rgba(8, 7, 6, 0.55), rgba(8, 7, 6, 0.72)),
    var(--moody-hero-image);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.page-service-website .services-split-hero--moody-editorial{
  --moody-hero-image: url("./Photos/AudreyHBranding-7323.jpg");
}
.page-service-branding .services-split-hero--moody-editorial{
  --moody-hero-image: url("./Photos/AudreyHBranding-8165.png");
}
/* Website design + Social media — centered client marks in the hero strip */
.page-service-website .services-split-hero-after--with-logos,
.page-service-social .services-split-hero-after--with-logos{
  padding-left: 0;
}
.page-service-website .services-split-hero-after-logos-row,
.page-service-social .services-split-hero-after-logos-row{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(16px, 3vw, 28px);
  width: 100%;
}
.page-service-website .services-hero-client-logos,
.page-service-social .services-hero-client-logos{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(16px, 3vw, 36px);
  flex: 0 1 auto;
  min-width: 0;
}
.page-service-website .services-hero-client-logos__link,
.page-service-social .services-hero-client-logos__link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  max-width: 128px;
  flex: 0 0 auto;
}
.page-service-website .services-hero-client-logos__link img,
.page-service-social .services-hero-client-logos__link img{
  display: block;
  width: 128px;
  height: 36px;
  max-width: 128px;
  max-height: 36px;
  object-fit: contain;
  filter: brightness(0) invert(1);
  opacity: 0.92;
  transition: opacity 0.2s ease;
}
.page-service-website .services-hero-client-logos__link:hover img,
.page-service-social .services-hero-client-logos__link:hover img{
  opacity: 1;
}
@media (max-width: 680px){
  .page-service-website .services-split-hero-after-logos-row,
  .page-service-social .services-split-hero-after-logos-row{
    align-items: center;
    gap: clamp(14px, 3vw, 22px);
  }
  .page-service-website .services-hero-client-logos__link,
  .page-service-social .services-hero-client-logos__link{
    max-width: 128px;
  }
}
/* Branding — centered hero client marks */
.page-service-branding .services-split-hero-after--with-logos{
  padding-left: 0;
}
.page-service-branding .services-split-hero-after-logos-row{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(16px, 3vw, 28px);
  width: 100%;
}
.page-service-branding .services-hero-client-logos--branding-strip{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(14px, 2.5vw, 28px);
  flex: 0 1 auto;
  min-width: 0;
}
.page-service-branding .services-hero-client-logos--branding-strip .services-hero-client-logos__link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: min(128px, 22vw);
  max-width: min(128px, 22vw);
  text-decoration: none;
}
.page-service-branding .services-hero-client-logos--branding-strip .services-hero-client-logos__link img{
  display: block;
  max-height: clamp(26px, 3.8vw, 36px);
  width: auto;
  max-width: 100%;
  object-fit: contain;
  object-position: center;
  filter: brightness(0) invert(1);
  opacity: 0.92;
  transition: opacity 0.2s ease;
}
.page-service-branding .services-hero-client-logos--branding-strip .services-hero-client-logos__link:hover img{
  opacity: 1;
}
/* Head Strong Flight — keep native logo colors (skip white knockout on dark hero) */
.page-service-branding .services-hero-client-logos--branding-strip .services-hero-client-logos__link[href*="work-hsf"] img{
  filter: none;
}
.page-service-branding .services-hero-client-logos--branding-strip .services-hero-client-logos__link[href*="work-hsf"]:hover img{
  filter: none;
}
.page-service-branding .branding-page-client-logos-section .branding-case-scroll--logos a[href*="work-hsf"] img{
  filter: none;
}
@media (max-width: 680px){
  .page-service-branding .services-split-hero-after-logos-row{
    align-items: center;
    gap: clamp(14px, 3vw, 22px);
  }
  .page-service-branding .services-hero-client-logos--branding-strip .services-hero-client-logos__link{
    width: min(112px, 40vw);
    max-width: min(112px, 40vw);
  }
}
.page-service-social .services-split-hero--moody-editorial{
  --moody-hero-image: url("./Photos/Social.jpeg");
  background-position: center 38%;
}
.page-services:not(.page-services-hub) .services-split-hero--moody-editorial .container{
  max-width: min(1180px, 100%);
}
.page-services:not(.page-services-hub) .services-split-hero--moody-editorial .services-split-hero-panels{
  grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr);
  min-height: min(72vh, 640px);
  align-items: stretch;
}
.page-services:not(.page-services-hub) .services-split-hero--moody-editorial .services-split-hero-left{
  align-items: flex-start;
  justify-content: center;
  text-align: left;
  gap: clamp(14px, 2.4vw, 22px);
  padding: clamp(36px, 7vw, 96px) clamp(16px, 4vw, 40px) clamp(28px, 5vw, 56px);
  background: transparent;
}
.page-services:not(.page-services-hub) .services-split-hero--moody-editorial .services-split-hero-eyebrow{
  margin: 0;
  align-self: flex-start;
  text-align: left;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.9);
}
.services-split-hero-moody-title{
  margin: 0;
  max-width: 14ch;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-weight: 400;
  font-style: normal;
  font-size: calc(clamp(34px, 6.4vw, 76px) + var(--heading-size-add));
  line-height: 1.03;
  letter-spacing: -0.03em;
  color: #faf8f4;
  font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
  font-feature-settings: "liga" 1, "clig" 1, "calt" 1, "dlig" 1;
}
.services-split-hero-moody-line{
  display: block;
}
.services-split-hero-moody-cta{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  margin-top: clamp(8px, 2vw, 14px);
  min-height: 52px;
  padding: clamp(16px, 2.4vw, 22px) clamp(30px, 4.5vw, 48px);
  border-radius: 0;
  box-sizing: border-box;
  font-family: var(--font-button);
  font-size: clamp(11px, 1.25vw, 14px);
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-decoration: none;
  color: #fff;
  background: #8e806f;
  border: 1px solid rgba(255, 255, 255, 0.14);
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.services-split-hero-moody-cta:hover{
  background: #9e907f;
  color: #fff;
  border-color: rgba(255, 255, 255, 0.22);
}
.services-split-hero-moody-cta:focus-visible{
  outline: 2px solid rgba(250, 248, 244, 0.85);
  outline-offset: 3px;
}
.page-services:not(.page-services-hub) .services-split-hero--moody-editorial .services-split-hero-right{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(28px, 5vw, 56px) clamp(12px, 3vw, 28px);
  min-height: 0;
  background: none;
  background-image: none;
}
.page-services:not(.page-services-hub) .services-split-hero--moody-editorial .services-split-hero-inset--moody{
  width: min(100%, 300px);
  aspect-ratio: 4 / 5;
  max-height: min(54vh, 520px);
  overflow: hidden;
  background: rgba(0, 0, 0, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow:
    0 28px 56px rgba(0, 0, 0, 0.55),
    0 2px 0 rgba(255, 255, 255, 0.06) inset;
}
.page-services:not(.page-services-hub) .services-split-hero--moody-editorial .services-split-hero-inset--moody img{
  object-position: center;
}
body.page-services.page-service-social:not(.page-services-hub) .services-split-hero--moody-editorial .services-split-hero-inset--moody img{
  object-position: center 56%;
}
.page-services:not(.page-services-hub) .services-split-hero--moody-editorial .services-split-hero-after--moody{
  margin-top: clamp(4px, 2vw, 16px);
  padding-top: clamp(28px, 4vw, 44px);
  padding-bottom: clamp(10px, 2vw, 18px);
  padding-left: 48px;
  background: transparent;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
@media (max-width: 900px){
  .page-services:not(.page-services-hub) .services-split-hero--moody-editorial .services-split-hero-panels{
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .page-services:not(.page-services-hub) .services-split-hero--moody-editorial .services-split-hero-right{
    order: -1;
    padding-top: clamp(36px, 8vw, 56px);
    padding-bottom: clamp(8px, 2vw, 16px);
  }
  .page-services:not(.page-services-hub) .services-split-hero--moody-editorial .services-split-hero-inset--moody{
    width: min(82vw, 300px);
    margin-inline: auto;
    max-height: min(42vh, 380px);
  }
  .page-services:not(.page-services-hub) .services-split-hero--moody-editorial .services-split-hero-left{
    padding-top: clamp(24px, 6vw, 44px);
    align-items: center;
    text-align: center;
  }
  .page-services:not(.page-services-hub) .services-split-hero--moody-editorial .services-split-hero-eyebrow{
    align-self: center;
    text-align: center;
  }
  .services-split-hero-moody-title{
    max-width: 100%;
    text-align: center;
    font-size: calc(clamp(28px, 9vw, 52px) + var(--heading-size-add));
  }
  .services-split-hero-moody-cta{
    align-self: center;
  }
}

/* Branding service page — left-aligned hero copy on wide viewports only (mobile centers with other service heroes) */
@media (min-width: 901px){
  .page-service-branding .services-split-hero--moody-editorial .services-split-hero-left{
    align-items: flex-start;
    text-align: left;
  }
  .page-service-branding .services-split-hero--moody-editorial .services-split-hero-eyebrow{
    align-self: flex-start;
    text-align: left;
  }
  .page-service-branding .services-split-hero-moody-title{
    margin-left: 0;
    margin-right: auto;
    text-align: left;
  }
  .page-service-branding .services-split-hero-moody-cta{
    align-self: flex-start;
  }
}
.page-service-branding #branding .section-branding-approach__copy > .section-title{
  margin: 0 0 clamp(12px, 2vw, 20px);
  text-align: left;
}
.page-service-branding #branding .section-branding-approach{
  padding-top: clamp(72px, 9.5vw, 108px);
}
.page-service-branding .section-branding-approach__split{
  display: grid;
  grid-template-columns: minmax(0, 0.43fr) minmax(0, 0.57fr);
  gap: clamp(28px, 5vw, 56px);
  align-items: stretch;
}
.page-service-branding .section-branding-approach__copy{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-height: 0;
}
.page-service-branding .section-branding-approach__lead{
  margin: 0;
  max-width: 52ch;
  font-size: var(--font-body-size);
  font-weight: var(--font-body-weight);
  line-height: 1.65;
  color: var(--muted);
  text-align: left;
}
.page-service-branding .section-branding-approach__cta{
  margin-top: clamp(22px, 3.5vw, 32px);
  margin-bottom: clamp(7px, 1.08vw, 14px);
  font-family: var(--font-button);
  font-size: clamp(11px, 0.95vw, 13px);
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
  color: rgba(20, 19, 17, 0.88);
}
.page-service-branding .section-branding-approach__cta:hover{
  color: rgba(20, 19, 17, 1);
}
.page-service-branding .section-branding-approach__cta:focus-visible{
  outline: 2px solid var(--moss);
  outline-offset: 3px;
}
.page-service-branding .section-branding-approach__media{
  display: flex;
  gap: clamp(10px, 1.8vw, 18px);
  align-items: stretch;
  min-width: 0;
}
.page-service-branding .section-branding-approach__figure{
  flex: 1;
  margin: 0;
  min-width: 0;
  aspect-ratio: 3 / 4;
  overflow: hidden;
}
.page-service-branding .section-branding-approach__figure img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.page-service-branding .section-branding-approach__figure--solo{
  flex: 1 1 100%;
  width: 100%;
}
.page-service-branding .section-branding-approach__next{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  margin-top: 0;
}
.page-service-branding .section-branding-approach__next .section-title{
  margin-top: clamp(28px, 4vw, 44px);
  margin-bottom: clamp(12px, 2vw, 20px);
  text-align: left;
}
.page-service-branding .section-branding-approach__next .lead.service-next-step-lead{
  margin-left: 0;
  margin-right: 0;
  text-align: left;
  max-width: 52ch;
}
.page-service-branding .section-branding-approach .service-next-step-lead{
  white-space: normal;
}
.page-service-branding .section-branding-approach .service-next-step-cta{
  align-self: flex-start;
}
@media (max-width: 900px){
  .page-service-branding .section-branding-approach__split{
    grid-template-columns: 1fr;
    gap: clamp(28px, 5vw, 44px);
  }
  /* Flatten copy so photo can sit between CTA and Next step (DOM still logical for SR) */
  .page-service-branding .section-branding-approach__copy{
    display: contents;
  }
  .page-service-branding #branding .section-branding-approach__copy > .section-title{
    grid-row: 1;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
  .page-service-branding .section-branding-approach__lead{
    grid-row: 2;
    max-width: none;
    text-align: center;
  }
  .page-service-branding .section-branding-approach__cta{
    grid-row: 3;
    justify-self: center;
  }
  .page-service-branding .section-branding-approach__media{
    grid-row: 4;
    width: 100%;
    min-width: 0;
  }
  .page-service-branding .section-branding-approach__next{
    grid-row: 5;
    align-items: center;
    align-self: stretch;
    width: 100%;
    margin-top: 0;
  }
  .page-service-branding #branding .section-branding-approach__next .section-title{
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
  .page-service-branding #branding .section-branding-approach__next .lead.service-next-step-lead{
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    max-width: 52ch;
  }
  .page-service-branding .section-branding-approach .service-next-step-cta{
    align-self: center;
  }
}
/* Website design service — "How Noble approaches" split (mirrors branding approach) */
.page-service-website #websites .section-website-approach{
  padding-top: clamp(36px, 5vw, 56px);
}
.page-service-website #websites .section-website-approach__copy > .section-title{
  margin: 0 0 clamp(12px, 2vw, 20px);
  text-align: left;
}
.page-service-website .section-website-approach__split{
  display: grid;
  grid-template-columns: minmax(0, 0.43fr) minmax(0, 0.57fr);
  gap: clamp(28px, 5vw, 56px);
  align-items: stretch;
}
.page-service-website .section-website-approach__copy{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-height: 0;
}
.page-service-website .section-website-approach__lead,
.page-service-website .section-website-approach__sublead{
  margin: 0;
  max-width: 52ch;
  font-size: var(--font-body-size);
  font-weight: var(--font-body-weight);
  line-height: 1.65;
  color: var(--muted);
  text-align: left;
}
.page-service-website .section-website-approach__sublead{
  margin-top: clamp(18px, 2.5vw, 26px);
}
.page-service-website .section-website-approach__cta{
  margin-top: clamp(22px, 3.5vw, 32px);
  margin-bottom: clamp(7px, 1.08vw, 14px);
  font-family: var(--font-button);
  font-size: clamp(11px, 0.95vw, 13px);
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
  color: rgba(20, 19, 17, 0.88);
}
.page-service-website .section-website-approach__cta:hover{
  color: rgba(20, 19, 17, 1);
}
.page-service-website .section-website-approach__cta:focus-visible{
  outline: 2px solid var(--moss);
  outline-offset: 3px;
}
.page-service-website .section-website-approach__media{
  display: flex;
  gap: clamp(10px, 1.8vw, 18px);
  align-items: stretch;
  min-width: 0;
}
.page-service-website .section-website-approach__figure{
  flex: 1;
  margin: 0;
  min-width: 0;
  aspect-ratio: 3 / 4;
  overflow: hidden;
}
.page-service-website .section-website-approach__figure img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.page-service-website .section-website-approach__figure--solo{
  flex: 1 1 100%;
  width: 100%;
}
.page-service-website .section-website-approach__next{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
}
.page-service-website .section-website-approach__next .section-title{
  margin-top: clamp(58px, 8.55vw, 101px);
  margin-bottom: clamp(12px, 2vw, 20px);
  text-align: left;
}
.page-service-website .section-website-approach__next .lead.service-next-step-lead{
  margin-left: 0;
  margin-right: 0;
  margin-bottom: clamp(10px, 1.8vw, 16px);
  text-align: left;
  max-width: 52ch;
}
.page-service-website .section-website-approach__next .service-next-step-fineprint{
  margin: 0 0 clamp(18px, 2.5vw, 26px);
  max-width: 52ch;
  text-align: left;
}
.page-service-website .section-website-approach .service-next-step-lead{
  white-space: normal;
}
.page-service-website .section-website-approach .service-next-step-cta{
  align-self: flex-start;
}
@media (min-width: 901px){
  .page-service-website .section-website-approach__next{
    margin-top: auto;
  }
  .page-service-website .section-website-approach__media{
    align-items: flex-end;
  }
}
@media (max-width: 900px){
  .page-service-website .section-website-approach__split{
    grid-template-columns: 1fr;
    gap: clamp(28px, 5vw, 44px);
  }
  .page-service-website .section-website-approach__copy{
    display: contents;
  }
  .page-service-website #websites .section-website-approach__copy > .section-title{
    grid-row: 1;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
  .page-service-website .section-website-approach__lead{
    grid-row: 2;
  }
  .page-service-website .section-website-approach__sublead{
    grid-row: 3;
  }
  .page-service-website .section-website-approach__lead,
  .page-service-website .section-website-approach__sublead{
    max-width: none;
    text-align: center;
  }
  .page-service-website .section-website-approach__cta{
    grid-row: 4;
    justify-self: center;
  }
  .page-service-website .section-website-approach__media{
    grid-row: 5;
    width: 100%;
    min-width: 0;
  }
  .page-service-website .section-website-approach__next{
    grid-row: 6;
    align-items: center;
    align-self: stretch;
    width: 100%;
    margin-top: 0;
  }
  .page-service-website #websites .section-website-approach__next .section-title{
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: clamp(28px, 4vw, 44px);
  }
  .page-service-website #websites .section-website-approach__next .lead.service-next-step-lead{
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    max-width: 52ch;
  }
  .page-service-website #websites .section-website-approach__next .fineprint.service-next-step-fineprint{
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    max-width: 52ch;
  }
  .page-service-website .section-website-approach .service-next-step-cta{
    align-self: center;
  }
}
/* Social media service — "How Noble approaches" split (matches website design) */
.page-service-social #social .section-social-approach__copy > .section-title{
  margin: 0 0 clamp(12px, 2vw, 20px);
  text-align: left;
}
.page-service-social #social .section-social-approach{
  padding-top: clamp(36px, 5vw, 56px);
}
.page-service-social .section-social-approach__split{
  display: grid;
  grid-template-columns: minmax(0, 0.43fr) minmax(0, 0.57fr);
  gap: clamp(28px, 5vw, 56px);
  align-items: stretch;
}
.page-service-social .section-social-approach__copy{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-height: 0;
}
.page-service-social .section-social-approach__lead,
.page-service-social .section-social-approach__sublead{
  margin: 0;
  max-width: 52ch;
  font-size: var(--font-body-size);
  font-weight: var(--font-body-weight);
  line-height: 1.65;
  color: var(--muted);
  text-align: left;
}
.page-service-social .section-social-approach__sublead{
  margin-top: clamp(18px, 2.5vw, 26px);
}
.page-service-social .section-social-approach__cta{
  margin-top: clamp(22px, 3.5vw, 32px);
  margin-bottom: clamp(7px, 1.08vw, 14px);
  font-family: var(--font-button);
  font-size: clamp(11px, 0.95vw, 13px);
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
  color: rgba(20, 19, 17, 0.88);
}
.page-service-social .section-social-approach__cta:hover{
  color: rgba(20, 19, 17, 1);
}
.page-service-social .section-social-approach__cta:focus-visible{
  outline: 2px solid var(--moss);
  outline-offset: 3px;
}
.page-service-social .section-social-approach__media{
  display: flex;
  gap: clamp(10px, 1.8vw, 18px);
  align-items: stretch;
  min-width: 0;
}
.page-service-social .section-social-approach__figure{
  flex: 1;
  margin: 0;
  min-width: 0;
  aspect-ratio: 3 / 4;
  overflow: hidden;
}
.page-service-social .section-social-approach__figure img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.page-service-social .section-social-approach__figure--solo{
  flex: 1 1 100%;
  width: 100%;
}
.page-service-social .section-social-approach__next{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
}
.page-service-social .section-social-approach__next .section-title{
  margin-top: clamp(58px, 8.55vw, 101px);
  margin-bottom: clamp(12px, 2vw, 20px);
  text-align: left;
}
.page-service-social .section-social-approach__next .lead.service-next-step-lead{
  margin-left: 0;
  margin-right: 0;
  margin-bottom: clamp(10px, 1.8vw, 16px);
  text-align: left;
  max-width: 52ch;
}
.page-service-social .section-social-approach .service-next-step-lead{
  white-space: normal;
}
.page-service-social .section-social-approach .service-next-step-cta{
  align-self: flex-start;
}
@media (min-width: 901px){
  .page-service-social .section-social-approach__next{
    margin-top: auto;
  }
  .page-service-social .section-social-approach__media{
    align-items: flex-end;
  }
}
@media (max-width: 900px){
  .page-service-social .section-social-approach__split{
    grid-template-columns: 1fr;
    gap: clamp(28px, 5vw, 44px);
  }
  .page-service-social .section-social-approach__copy{
    display: contents;
  }
  .page-service-social #social .section-social-approach__copy > .section-title{
    grid-row: 1;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
  .page-service-social .section-social-approach__lead{
    grid-row: 2;
  }
  .page-service-social .section-social-approach__sublead{
    grid-row: 3;
  }
  .page-service-social .section-social-approach__lead,
  .page-service-social .section-social-approach__sublead{
    max-width: none;
    text-align: center;
  }
  .page-service-social .section-social-approach__cta{
    grid-row: 4;
    justify-self: center;
  }
  .page-service-social .section-social-approach__media{
    grid-row: 5;
    width: 100%;
    min-width: 0;
  }
  .page-service-social .section-social-approach__next{
    grid-row: 6;
    align-items: center;
    align-self: stretch;
    width: 100%;
    margin-top: 0;
  }
  .page-service-social #social .section-social-approach__next .section-title{
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: clamp(28px, 4vw, 44px);
  }
  .page-service-social #social .section-social-approach__next .lead.service-next-step-lead{
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    max-width: 52ch;
  }
  .page-service-social .section-social-approach .service-next-step-cta{
    align-self: center;
  }
}
.page-service-branding .section-branding-packages .section-title,
.page-service-branding .section-branding-packages > .container > .section-packages-subtitle,
.page-service-branding .section-branding-packages > .container > .lead{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.page-service-branding .section-branding-packages > .container > .section-packages-subtitle{
  margin-top: 0;
  margin-bottom: 0.75rem;
  max-width: none;
}
.page-service-branding .section-branding-packages > .container > .lead{
  max-width: 56ch;
}
.page-service-website .section-website-packages .section-title,
.page-service-website .section-website-packages > .container > .section-packages-subtitle,
.page-service-website .section-website-packages > .container > .lead,
.page-service-website .section-website-packages > .container > .fineprint,
.page-service-social .section-social-packages .section-title,
.page-service-social .section-social-packages > .container > .section-packages-subtitle,
.page-service-social .section-social-packages > .container > .lead,
.page-service-social .section-social-packages > .container > .fineprint{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.page-service-website .section-website-packages > .container > .section-packages-subtitle,
.page-service-social .section-social-packages > .container > .section-packages-subtitle{
  margin-top: 0;
  margin-bottom: 0.75rem;
  max-width: none;
}
.page-service-website .section-website-packages > .container > .lead,
.page-service-social .section-social-packages > .container > .lead{
  max-width: 56ch;
}
.page-service-website .section-website-packages > .container > .fineprint,
.page-service-social .section-social-packages > .container > .fineprint{
  max-width: 56ch;
}
/* Social packages — centered feature lines + rule marker instead of disc */
.page-service-social .section-social-packages .package--editorial .package-list{
  list-style: none;
  padding-left: 0;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.page-service-social .section-social-packages .package--editorial .package-list li{
  list-style: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  text-align: center;
}
.page-service-social .section-social-packages .package--editorial .package-list li::before{
  content: "";
  width: 18px;
  height: 1px;
  flex-shrink: 0;
  background: rgba(20, 19, 17, 0.5);
}
.page-service-branding main > .section.section-alt .container{
  text-align: center;
}
.page-service-branding main > .section.section-alt .lead{
  margin-left: auto;
  margin-right: auto;
  max-width: 56ch;
}
.service-next-step-lead{
  margin-left: auto;
  margin-right: auto;
  max-width: none;
}
.service-next-step-cta{
  margin-top: 18px;
}
@media (min-width: 1024px){
  .service-next-step-lead{
    white-space: nowrap;
  }
}
.page-service-branding .service-branding-practice .home-recent-projects__header{
  text-align: center;
}
.page-service-branding .service-branding-practice .home-recent-projects__header-row{
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.page-service-branding .service-branding-practice .home-recent-projects__titles{
  text-align: center;
}
.page-service-branding .service-branding-practice .home-recent-projects__lead{
  margin-left: auto;
  margin-right: auto;
  max-width: 56ch;
}
.page-service-website .service-website-practice .home-recent-projects__header,
.page-service-social .service-social-practice .home-recent-projects__header{
  text-align: center;
}
.page-service-website .service-website-practice .home-recent-projects__header-row,
.page-service-social .service-social-practice .home-recent-projects__header-row{
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.page-service-website .service-website-practice .home-recent-projects__titles,
.page-service-social .service-social-practice .home-recent-projects__titles{
  text-align: center;
}
.page-service-website .service-website-practice .home-recent-projects__grid,
.page-service-social .service-social-practice .home-recent-projects__grid{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(12px, 1.5vw, 18px);
}
.page-service-website .service-website-practice .home-recent-projects__cell,
.page-service-website .service-website-practice .home-recent-projects__cell--large,
.page-service-website .service-website-practice .home-recent-projects__cell--top,
.page-service-social .service-social-practice .home-recent-projects__cell,
.page-service-social .service-social-practice .home-recent-projects__cell--large,
.page-service-social .service-social-practice .home-recent-projects__cell--top{
  grid-column: span 1;
}
.page-service-website .service-website-practice .home-recent-projects__cell--large .home-recent-projects__card{
  min-height: min(32vw, 280px);
}
@media (max-width: 960px){
  .page-service-website .service-website-practice .home-recent-projects__grid,
  .page-service-social .service-social-practice .home-recent-projects__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .page-service-website .service-website-practice .home-recent-projects__cell,
  .page-service-website .service-website-practice .home-recent-projects__cell--large,
  .page-service-website .service-website-practice .home-recent-projects__cell--top,
  .page-service-social .service-social-practice .home-recent-projects__cell,
  .page-service-social .service-social-practice .home-recent-projects__cell--large,
  .page-service-social .service-social-practice .home-recent-projects__cell--top{
    grid-column: span 1;
  }
}

/* Service hub practice strips — phones: equal card size + centered column (overrides bento / 2-col) */
@media (max-width: 640px){
  .page-service-branding .service-branding-practice .home-recent-projects__grid,
  .page-service-website .service-website-practice .home-recent-projects__grid,
  .page-service-social .service-social-practice .home-recent-projects__grid{
    grid-template-columns: 1fr;
    justify-items: stretch;
    max-width: min(440px, calc(100% - 32px));
    margin-inline: auto;
  }
  .page-service-branding .service-branding-practice .home-recent-projects__cell,
  .page-service-branding .service-branding-practice .home-recent-projects__cell--large,
  .page-service-branding .service-branding-practice .home-recent-projects__cell--top,
  .page-service-website .service-website-practice .home-recent-projects__cell,
  .page-service-website .service-website-practice .home-recent-projects__cell--large,
  .page-service-website .service-website-practice .home-recent-projects__cell--top,
  .page-service-social .service-social-practice .home-recent-projects__cell,
  .page-service-social .service-social-practice .home-recent-projects__cell--large,
  .page-service-social .service-social-practice .home-recent-projects__cell--top{
    grid-column: 1 / -1;
    width: 100%;
    min-width: 0;
  }
  .page-service-branding .service-branding-practice .home-recent-projects__card,
  .page-service-website .service-website-practice .home-recent-projects__card,
  .page-service-social .service-social-practice .home-recent-projects__card{
    height: auto;
    min-height: 0;
    aspect-ratio: 4 / 3;
    width: 100%;
  }
}

/* Branding, website design, social media service pages — top bar matches moody hero, white type */
.page-service-branding .site-header,
.page-service-website .site-header,
.page-service-social .site-header{
  background: rgba(18, 16, 14, 0.9);
  border-bottom-color: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(14px);
}
.page-service-branding .site-header.is-elevated,
.page-service-website .site-header.is-elevated,
.page-service-social .site-header.is-elevated{
  background: rgba(14, 12, 10, 0.96);
}
.page-service-branding .nav-link,
.page-service-website .nav-link,
.page-service-social .nav-link{
  color: rgba(255, 255, 255, 0.88);
}
.page-service-branding .nav-link:hover,
.page-service-website .nav-link:hover,
.page-service-social .nav-link:hover{
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.45);
}
.page-service-branding .nav-link.is-active,
.page-service-branding .nav-link[aria-current="page"],
.page-service-website .nav-link.is-active,
.page-service-website .nav-link[aria-current="page"],
.page-service-social .nav-link.is-active,
.page-service-social .nav-link[aria-current="page"]{
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.75);
}
.page-service-branding .nav-dropdown:has(.nav-dropdown-link[aria-current="page"]) > .nav-link,
.page-service-website .nav-dropdown:has(.nav-dropdown-link[aria-current="page"]) > .nav-link,
.page-service-social .nav-dropdown:has(.nav-dropdown-link[aria-current="page"]) > .nav-link{
  border-bottom-color: rgba(255, 255, 255, 0.75);
  color: #fff;
}
.page-service-branding .nav-dropdown:hover > .nav-link,
.page-service-website .nav-dropdown:hover > .nav-link,
.page-service-social .nav-dropdown:hover > .nav-link{
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.4);
}
.page-service-branding .nav-dropdown:hover:has(.nav-dropdown-link[aria-current="page"]) > .nav-link,
.page-service-website .nav-dropdown:hover:has(.nav-dropdown-link[aria-current="page"]) > .nav-link,
.page-service-social .nav-dropdown:hover:has(.nav-dropdown-link[aria-current="page"]) > .nav-link{
  border-bottom-color: rgba(255, 255, 255, 0.75);
  color: #fff;
}
.page-service-branding .header-discovery,
.page-service-website .header-discovery,
.page-service-social .header-discovery{
  color: rgba(255, 255, 255, 0.9);
}
.page-service-branding .header-discovery:hover,
.page-service-website .header-discovery:hover,
.page-service-social .header-discovery:hover{
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.55);
}
.page-service-branding .brand-mark,
.page-service-website .brand-mark,
.page-service-social .brand-mark{
  filter: brightness(0) invert(1);
  opacity: 0.95;
}
.page-service-branding .nav-toggle,
.page-service-website .nav-toggle,
.page-service-social .nav-toggle{
  border-color: rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.08);
}
.page-service-branding .nav-toggle-lines::before,
.page-service-branding .nav-toggle-lines::after,
.page-service-website .nav-toggle-lines::before,
.page-service-website .nav-toggle-lines::after,
.page-service-social .nav-toggle-lines::before,
.page-service-social .nav-toggle-lines::after{
  background: rgba(255, 255, 255, 0.92);
}

/* Branding + Website design + Social media — header discovery (tan + black type) */
.page-service-branding .header-discovery,
.page-service-website .header-discovery,
.page-service-social .header-discovery{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  padding: 16px 28px;
  border-radius: 0;
  border: 1px solid rgba(20, 19, 17, 0.22);
  background: #e9dfd2;
  color: var(--ink) !important;
  font-size: clamp(13px, 1.3vw, 16px);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-decoration: none;
  line-height: 1.15;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.page-service-branding .header-discovery:hover,
.page-service-website .header-discovery:hover,
.page-service-social .header-discovery:hover{
  background: #dfd2c3;
  color: var(--ink) !important;
  border-color: rgba(20, 19, 17, 0.32);
}
.page-service-branding .header-discovery:focus-visible,
.page-service-website .header-discovery:focus-visible,
.page-service-social .header-discovery:focus-visible{
  outline: 2px solid rgba(20, 19, 17, 0.35);
  outline-offset: 3px;
}
.page-service-website .services-split-hero-moody-cta,
.page-service-social .services-split-hero-moody-cta{
  min-height: 58px;
  padding: clamp(18px, 2.8vw, 26px) clamp(34px, 5vw, 56px);
  font-size: clamp(12px, 1.4vw, 16px);
  font-weight: 600;
  color: var(--ink);
  background: #e9dfd2;
  border: 1px solid rgba(20, 19, 17, 0.22);
}
.page-service-website .services-split-hero-moody-cta:hover,
.page-service-social .services-split-hero-moody-cta:hover{
  background: #dfd2c3;
  color: var(--ink);
  border-color: rgba(20, 19, 17, 0.32);
}
.page-service-branding .package-card-btn--solid,
.page-service-website .package-card-btn--solid,
.page-service-social .package-card-btn--solid{
  min-height: 56px;
  padding: 18px 34px;
  font-size: clamp(12px, 1.15vw, 14px);
  color: var(--ink);
}
.page-service-branding .package-card-btn--solid:hover,
.page-service-website .package-card-btn--solid:hover,
.page-service-social .package-card-btn--solid:hover{
  background: #dfd2c3;
  color: var(--ink);
  border-color: rgba(20, 19, 17, 0.32);
}
.page-service-branding .package-grid-single-cta .package-card-btn,
.page-service-website .package-grid-single-cta .package-card-btn,
.page-service-social .package-grid-single-cta .package-card-btn{
  max-width: 440px;
}
.page-service-website .service-next-step-cta.button.primary,
.page-service-social .service-next-step-cta.button.primary{
  min-height: 52px;
  padding: 17px 36px;
  font-size: clamp(12px, 1.25vw, 15px);
  letter-spacing: 0.08em;
  background: linear-gradient(180deg, #163529 0%, var(--moss) 55%, #142a22 100%);
  border-color: rgba(10, 18, 14, 0.45);
}
.page-service-website .service-next-step-cta.button.primary:hover,
.page-service-social .service-next-step-cta.button.primary:hover{
  background: linear-gradient(180deg, #142a22 0%, #0f211a 100%);
}

.services-overview-jump a:hover{
  color: var(--moss);
  border-bottom-color: rgba(26,51,41,.45);
}
.services-section .services-overview-link{
  display: inline-block;
  margin-top: 10px;
  font-size: 16px;
  font-weight: var(--font-body-weight);
  color: var(--moss);
  text-decoration: underline;
  text-underline-offset: 4px;
}
.services-section .services-overview-link:hover{
  color: #1a3329;
}
/* Quad package grids (e.g. social packages): 2x2 below desktop; single row of four from ~981px up */
.package-grid.package-grid--quad{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 981px){
  .package-grid.package-grid--quad{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 820px){
  .clients-stamp-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 480px){
  .clients-stamp-grid{
    grid-template-columns: 1fr;
  }
  .clients-stamp-cell--cta{
    grid-column: 1 / -1;
    justify-content: center;
    text-align: center;
    width: 100%;
  }
  .clients-see-more-link{
    margin-left: auto;
    margin-right: auto;
  }
  .clients-stamp-cell img{
    max-height: 260px;
  }
}

.section{padding: clamp(68px, 8vw, 96px) 0}
.section{
  border-top: 0;
}
.section:first-of-type{
  border-top: 0;
}
/* Restore horizontal inset — .section padding shorthand above zeroes side padding */
.section.section-founder{
  padding-left: clamp(24px, 4vw, 56px);
  padding-right: clamp(24px, 4vw, 56px);
}
@media (max-width: 600px){
  .section.section-founder{
    padding-left: max(20px, env(safe-area-inset-left, 0px));
    padding-right: max(20px, env(safe-area-inset-right, 0px));
  }
}
.section-alt{
  background:
    radial-gradient(900px 520px at 18% 0%, rgba(199,154,104,.16), transparent 60%),
    radial-gradient(900px 620px at 105% 25%, rgba(26,51,41,.12), transparent 62%),
    rgba(20,19,17,.03);
  border-top:0;
  border-bottom:0;
}

/* Blog index — full-width image hero + header + card grid + topic filters */
/* Hero image starts at viewport top; fixed nav sits above (z-index) with frosted bar */
body.page-blog #main{
  padding-top: 0;
}
body.page-blog,
body.page-blog-post{
  background-color: #ffffff;
  background-image: none;
}
body.page-blog .blog-index-section.section-alt{
  background: #ffffff;
  padding-top: clamp(28px, 4vw, 44px);
}
.page-blog .blog-hero{
  border-top: 0;
  background: #ffffff;
}
.page-blog .blog-hero.blog-hero--masthead{
  padding-top: 0;
  padding-bottom: clamp(10px, 2vw, 20px);
}
.blog-hero__masthead{
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
  position: relative;
}
/* Full-bleed cover image */
.page-blog .blog-hero--masthead .blog-hero__figure--cover{
  width: 100%;
  position: relative;
  left: auto;
  transform: none;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: none;
  border-bottom: 1px solid rgba(20, 19, 17, 0.1);
  border-radius: 0;
  overflow: hidden;
  background: rgba(20, 19, 17, 0.06);
  aspect-ratio: 21 / 9;
  min-height: min(42vh, 380px);
  max-height: min(56vh, 520px);
  box-shadow: none;
}
.page-blog .blog-hero--masthead .blog-hero__figure--cover::after{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.34), rgba(0, 0, 0, 0.44));
  z-index: 1;
}
@media (max-width: 767px){
  .page-blog .blog-hero--masthead .blog-hero__figure--cover{
    aspect-ratio: 4 / 3;
    min-height: 220px;
    max-height: 420px;
  }
}
.blog-hero__figure img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 28%;
  filter: saturate(0.95) brightness(0.88);
  transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}
.page-blog .blog-hero.is-revealed .blog-hero__figure img{
  transform: scale(1.02);
}
@media (prefers-reduced-motion: reduce){
  .page-blog .blog-hero.is-revealed .blog-hero__figure img{
    transform: none;
  }
}
.blog-hero__header{
  position: absolute;
  left: 50%;
  bottom: clamp(22px, 4vw, 44px);
  transform: translateX(-50%);
  width: min(var(--container), calc(100% - clamp(28px, 6vw, 72px)));
  z-index: 2;
  padding-left: clamp(8px, 2vw, 14px);
  border-left: 4px solid rgba(255, 255, 255, 0.92);
  max-width: min(52rem, 100%);
}
.blog-hero__kicker{
  margin: 0 0 10px;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.9);
}
.blog-hero__title{
  margin: 0 0 14px;
  color: rgba(255, 255, 255, 0.98);
  font-size: calc(clamp(42px, 6.5vw, 88px) + var(--heading-size-add));
  line-height: 1.02;
  letter-spacing: -0.03em;
  font-weight: 400;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.26);
}
.blog-hero__lead{
  max-width: 52ch;
  margin: 0;
}
.page-blog .blog-hero__header .blog-hero__lead.lead{
  color: rgba(255, 255, 255, 0.9);
  font-size: clamp(15px, 1.2vw, 17px);
  line-height: 1.62;
}
.page-blog .blog-hero__title{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.blog-hero__hint{
  margin: clamp(18px, 3vw, 24px) 0 0;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.82);
}
@media (max-width: 767px){
  .blog-hero__header{
    bottom: clamp(14px, 4vw, 22px);
    width: calc(100% - 28px);
    max-width: none;
  }
  .blog-hero__hint{
    display: none;
  }
}
.blog-index-section__inner{
  max-width: min(1120px, 100%);
  margin-inline: auto;
}
.blog-index-header{
  margin-bottom: clamp(28px, 5vw, 44px);
  text-align: center;
}
.blog-index-header__title{
  margin: 0 0 16px;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.5rem, 2.8vw, 2rem) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #141210;
}
.blog-index-header__sub{
  margin: 0 auto clamp(30px, 4.2vw, 40px);
  max-width: 48ch;
  font-size: clamp(14px, 1.2vw, 16px);
  line-height: 1.6;
  color: rgba(20, 19, 17, 0.72);
}
/* Blog posts: add clearer rhythm between headings and paragraphs. */
.page-blog-post .blog-post-header{
  text-align: center;
}
.page-blog-post .blog-post-header .section-title{
  margin: 0 0 clamp(14px, 2vw, 20px);
}
.page-blog-post .blog-post-header .lead{
  margin: 16px auto 0;
  max-width: min(68ch, 100%);
}
.page-blog-post .blog-post-back-wrap{
  margin-top: clamp(40px, 6vw, 72px);
  padding-top: clamp(28px, 4vw, 44px);
  border-top: 1px solid rgba(20, 19, 17, 0.1);
  text-align: center;
}
.page-blog-post a.button.primary.blog-post-back{
  text-transform: none;
  letter-spacing: 0.04em;
  min-width: min(100%, 16rem);
  padding: 14px 22px;
}
.page-blog-post .blog-post-body{
  margin-top: 28px;
  max-width: min(88ch, 100%);
  margin-inline: auto;
}
.page-blog-post .blog-post-body .section-title{
  margin: clamp(30px, 4vw, 42px) 0 clamp(12px, 1.8vw, 18px) !important;
}
.page-blog-post .blog-post-body p{
  margin: 0 0 clamp(18px, 2.3vw, 24px);
}
.page-blog-post .blog-post-body p:last-child{
  margin-bottom: 0;
}
.page-blog-post .blog-post-figure{
  margin: clamp(1.75rem, 3.5vw, 2.5rem) 0;
}
.page-blog-post .blog-post-figure img{
  display: block;
  width: 100%;
  height: auto;
  border-radius: 10px;
  border: 1px solid rgba(20, 19, 17, 0.08);
}
.page-blog-post .blog-post-figure figcaption{
  margin-top: 0.65rem;
  font-size: clamp(13px, 1.05vw, 14px);
  line-height: 1.55;
  color: rgba(20, 19, 17, 0.68);
}
.page-blog-post .blog-post-figure-pair{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(12px, 2vw, 18px);
  margin: clamp(1.75rem, 3.5vw, 2.5rem) 0;
  align-items: stretch;
}
.page-blog-post .blog-post-figure-pair .blog-post-figure--pair{
  margin: 0;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.page-blog-post .blog-post-figure-pair .blog-post-figure__crop{
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 5;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid rgba(20, 19, 17, 0.08);
  background: rgba(20, 19, 17, 0.04);
}
.page-blog-post .blog-post-figure-pair .blog-post-figure__crop img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border: none;
  border-radius: 0;
}
.page-blog-post .blog-post-figure-pair .blog-post-figure--pair figcaption{
  flex: 0 0 auto;
}
@media (max-width: 640px){
  .page-blog-post .blog-post-figure-pair{
    grid-template-columns: 1fr;
  }
}
.blog-index-toolbar{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  margin-bottom: clamp(28px, 4vw, 40px);
}
.blog-index-toolbar__label{
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.48);
}
.blog-index-filters{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 12px;
}
.blog-filter-chip{
  appearance: none;
  margin: 0;
  padding: 10px 18px;
  border: 1px solid rgba(20, 19, 17, 0.18);
  border-radius: 999px;
  background: rgba(247, 241, 230, 0.65);
  color: #2a2825;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}
.blog-filter-chip:hover{
  border-color: rgba(26, 51, 41, 0.45);
  transform: translateY(-1px);
}
.blog-filter-chip:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.45);
  outline-offset: 3px;
}
.blog-filter-chip.is-active{
  background: var(--moss);
  border-color: var(--moss);
  color: #f7f5f0;
}
@media (max-width: 767px){
  /* Topic chips on one horizontal row (scroll if needed) */
  .blog-index-toolbar{
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: clamp(10px, 3vw, 14px);
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
    padding-inline: 0;
  }
  .blog-index-toolbar__label{
    flex-shrink: 0;
  }
  .blog-index-filters{
    flex: 1 1 auto;
    min-width: 0;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 4px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
  }
  .blog-index-filters::-webkit-scrollbar{
    display: none;
  }
  .blog-filter-chip{
    flex-shrink: 0;
    padding: 8px 14px;
    font-size: 11px;
    letter-spacing: 0.08em;
  }
}
.blog-index-empty{
  margin: 0 0 clamp(24px, 4vw, 36px);
  padding: clamp(20px, 3vw, 28px);
  text-align: center;
  border: 1px dashed rgba(20, 19, 17, 0.2);
  background: rgba(247, 241, 230, 0.4);
  color: rgba(20, 19, 17, 0.72);
  font-size: 15px;
}
.blog-index{
  list-style: none;
  margin: 0;
  padding: 0;
}
.blog-index--grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(22px, 3.5vw, 32px);
  align-items: stretch;
}
@media (max-width: 700px){
  .blog-index--grid{
    grid-template-columns: 1fr;
  }
}
.blog-index__item{
  margin: 0;
  padding: 0;
  border: 0;
  min-height: 0;
}
.blog-index__item[hidden]{
  display: none !important;
}
.blog-card{
  height: 100%;
  margin: 0;
  border: 1px solid rgba(20, 19, 17, 0.12);
  background: rgba(255, 255, 255, 0.55);
  box-sizing: border-box;
  transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}
.blog-card__link{
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  color: inherit;
  outline: none;
}
.blog-card__link:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.5);
  outline-offset: 4px;
}
.blog-card:hover{
  border-color: rgba(26, 51, 41, 0.35);
  box-shadow: 0 20px 50px rgba(20, 19, 17, 0.1);
  transform: translateY(-5px);
}
@media (prefers-reduced-motion: reduce){
  .blog-card:hover{
    transform: none;
  }
}
.blog-card__media{
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: rgba(20, 19, 17, 0.06);
}
.blog-card__media img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}
.blog-card:hover .blog-card__media img{
  transform: scale(1.05);
}
@media (prefers-reduced-motion: reduce){
  .blog-card:hover .blog-card__media img{
    transform: none;
  }
}
.blog-card__body{
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  padding: clamp(18px, 2.5vw, 24px) clamp(18px, 2.5vw, 22px) clamp(20px, 2.8vw, 26px);
  gap: 0;
}
.blog-card__meta{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  margin-bottom: 12px;
}
.blog-card__date{
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.48);
}
.blog-card__tags{
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
}
.blog-card__tag{
  padding: 4px 10px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border: 1px solid rgba(26, 51, 41, 0.2);
  color: rgba(26, 51, 41, 0.9);
  background: rgba(26, 51, 41, 0.06);
}
.blog-card__title{
  margin: 0 0 12px;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.05rem, 1.35vw, 1.35rem) + var(--heading-size-add));
  line-height: 1.3;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #141210;
  transition: color 0.2s ease;
}
.blog-card:hover .blog-card__title{
  color: var(--moss);
}
.blog-card__excerpt{
  margin: 0 0 clamp(16px, 2.5vw, 22px);
  font-size: var(--font-body-size);
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.78);
  flex: 1 1 auto;
}
.blog-card__cta{
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-button);
  font-size: 11px;
  font-weight: var(--font-button-weight);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--moss);
}
.blog-card__cta-icon{
  display: inline-block;
  transition: transform 0.25s ease;
}
.blog-card:hover .blog-card__cta-icon{
  transform: translateX(6px);
}

.page-blog .blog-index-cta{
  margin-top: clamp(48px, 7vw, 88px);
  padding: clamp(40px, 6vw, 64px) clamp(20px, 4vw, 32px);
  background: var(--moss);
  text-align: center;
}
.page-blog .blog-index-cta__inner{
  max-width: 38rem;
  margin-inline: auto;
}
.page-blog .blog-index-cta__title{
  margin: 0 0 12px;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.2rem, 2.1vw, 1.55rem) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(247, 241, 230, 0.98);
}
.page-blog .blog-index-cta__lead{
  margin: 0 0 clamp(22px, 3vw, 30px);
  font-size: 15px;
  line-height: 1.62;
  color: rgba(247, 241, 230, 0.86);
}
.page-blog .blog-index-cta .button{
  background: rgba(247, 241, 230, 0.96);
  color: var(--moss);
  border-color: rgba(247, 241, 230, 0.55);
}
.page-blog .blog-index-cta .button:hover{
  background: #fff;
  color: #142018;
  border-color: rgba(255, 255, 255, 0.75);
}

/* Blog post — two-up “read next” previews (replaces lone “All posts” link) */
.blog-read-next{
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
  padding-top: clamp(1.5rem, 2.5vw, 2rem);
  border-top: 1px solid rgba(20, 19, 17, 0.1);
}
.blog-read-next__title{
  margin: 0 0 clamp(14px, 2vw, 18px);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.5);
}
.blog-read-next__grid{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(12px, 2vw, 18px);
}
@media (max-width: 520px){
  .blog-read-next__grid{
    grid-template-columns: 1fr;
  }
}
.blog-read-next__card{
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  color: inherit;
  border: 1px solid rgba(20, 19, 17, 0.12);
  border-radius: 12px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.65);
  box-sizing: border-box;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.blog-read-next__card:hover{
  border-color: rgba(26, 51, 41, 0.3);
  box-shadow: 0 10px 28px rgba(20, 19, 17, 0.08);
  transform: translateY(-3px);
}
@media (prefers-reduced-motion: reduce){
  .blog-read-next__card:hover{
    transform: none;
  }
}
.blog-read-next__card:focus-visible{
  outline: 2px solid var(--moss);
  outline-offset: 3px;
}
.blog-read-next__media{
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: rgba(20, 19, 17, 0.06);
}
.blog-read-next__media img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.blog-read-next__card:hover .blog-read-next__media img{
  transform: scale(1.04);
}
@media (prefers-reduced-motion: reduce){
  .blog-read-next__card:hover .blog-read-next__media img{
    transform: none;
  }
}
.blog-read-next__card-title{
  flex: 1 1 auto;
  margin: 0;
  padding: clamp(12px, 1.8vw, 16px) clamp(12px, 1.8vw, 16px) clamp(14px, 2vw, 18px);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(0.92rem, 1.2vw, 1.08rem);
  line-height: 1.32;
  font-weight: 400;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #141210;
}
.blog-read-next__card:hover .blog-read-next__card-title{
  color: var(--moss);
}
.blog-read-next__all{
  margin: clamp(16px, 2.2vw, 22px) 0 0;
  text-align: center;
}
.blog-read-next__all a{
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
  color: rgba(26, 51, 41, 0.88);
  border-bottom: 1px solid rgba(26, 51, 41, 0.25);
  padding-bottom: 2px;
  transition: color 0.2s ease, border-color 0.2s ease;
}
.blog-read-next__all a:hover{
  color: var(--moss);
  border-bottom-color: rgba(26, 51, 41, 0.45);
}
@media (prefers-reduced-motion: reduce){
  .blog-card:hover .blog-card__cta-icon{
    transform: none;
  }
}
/* Contact block (/contact): warm cream, no background photo */
#contact{
  border-top: 0;
  background:
    radial-gradient(900px 520px at 18% 0%, rgba(199, 154, 104, 0.12), transparent 60%),
    radial-gradient(900px 620px at 105% 25%, rgba(26, 51, 41, 0.08), transparent 62%),
    linear-gradient(180deg, #fdf9f3 0%, #f2ede4 100%);
}
/* Contact page — white canvas */
body.page-contact{
  background-color: #ffffff;
  background-image: none;
}
body.page-contact .site-header{
  background: rgba(26, 51, 41, 0.96);
  border-bottom-color: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(14px);
}
body.page-contact .site-header.is-elevated{
  background: rgba(22, 44, 35, 0.98);
}
body.page-contact #contact{
  background: #ffffff;
}
body.page-contact .section.section-alt{
  background: #ffffff;
}
/* Contact: same Instagram pre-footer spacing as service pages (no double top pad) */
body.page-contact main > section.section.home-instagram-strip{
  padding-top: 0;
}
body.page-contact main > section#contact:has(+ section.home-instagram-strip){
  padding-bottom: clamp(40px, 6vw, 72px);
}
body.page-contact main > section.home-instagram-strip .instagram-feed-section__inner.site-instagram-prefooter__inner{
  padding-top: clamp(12px, 2vw, 24px);
}

/* Contact page — editorial hero + two-column grid */
.page-contact main > .contact-page-hero:first-of-type{
  margin-top: 0;
}
.contact-page-hero{
  background: #faf9f7;
  border-bottom: 1px solid rgba(20, 19, 17, 0.07);
  padding: 0;
}
.contact-page-hero__split{
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: clamp(28px, 5vw, 56px);
  align-items: center;
  padding-block: clamp(44px, 7vw, 96px);
  box-sizing: border-box;
}
.contact-page-hero__figure{
  margin: 0;
  padding: 0;
  border: 0;
  position: relative;
  overflow: hidden;
  aspect-ratio: 3 / 4;
  max-height: min(72vh, 720px);
  background: rgba(20, 19, 17, 0.06);
  border: 1px solid rgba(20, 19, 17, 0.08);
}
.contact-page-hero__figure img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 38%;
}
.contact-page-hero__inner{
  max-width: min(56ch, 100%);
  min-width: 0;
}
@media (max-width: 900px){
  .contact-page-hero__split{
    grid-template-columns: 1fr;
    padding-block: clamp(36px, 8vw, 72px);
  }
  .contact-page-hero__figure{
    order: -1;
    max-height: none;
    aspect-ratio: 4 / 3;
    max-width: min(520px, 100%);
    margin-inline: auto;
    width: 100%;
  }
}
.contact-page-hero__eyebrow{
  margin: 0 0 14px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.48);
}
.contact-page-hero__title{
  margin: 0 0 18px;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(34px, 5.2vw, 68px) + var(--heading-size-add));
  line-height: 1.05;
  font-weight: 400;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #14120f;
}
.contact-page-hero__lead{
  margin: 0;
  max-width: 52ch;
}
.contact-main-section.section-alt{
  padding-block: clamp(48px, 7vw, 92px);
}
.contact-page-grid{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr);
  gap: clamp(32px, 5vw, 64px);
  align-items: start;
}
.contact-page-grid__heading{
  margin: 0 0 10px;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.35rem, 2.35vw, 1.85rem) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #141210;
}
.contact-page-grid__sub{
  margin: 0 0 clamp(18px, 2.5vw, 24px);
  font-size: 15px;
  line-height: 1.62;
  color: rgba(20, 19, 17, 0.72);
  max-width: 42ch;
}
.contact-page-grid__copy .contact-cards{
  margin-top: 0;
  gap: 14px;
}
.contact-page-social-wrap{
  margin-top: clamp(28px, 4vw, 44px);
  padding-top: clamp(22px, 3vw, 32px);
  border-top: 1px solid rgba(20, 19, 17, 0.1);
}
.contact-page-social-label{
  margin: 0 0 12px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.5);
}
.contact-page-form-title{
  margin: 0 0 clamp(16px, 2.2vw, 22px);
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(1.35rem, 2.35vw, 1.85rem) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #141210;
}
.page-contact #contact .form{
  padding: clamp(20px, 3vw, 28px);
  border-radius: 0;
}
.page-contact #contact .field-row .field{
  margin-bottom: 0;
}
.page-contact #contact .field-row{
  margin-bottom: 12px;
}
.page-contact #contact .contact-form__submit{
  margin-bottom: 0;
}
.page-contact #contact .field input,
.page-contact #contact .field select,
.page-contact #contact .field textarea{
  width: 100%;
  box-sizing: border-box;
}
.contact-form-success{
  margin: 0 0 18px;
  padding: 14px 18px;
  border: 1px solid rgba(26, 51, 41, 0.22);
  background: rgba(26, 51, 41, 0.06);
  color: rgba(20, 19, 17, 0.88);
  font-size: 15px;
  line-height: 1.55;
}
@media (max-width: 900px){
  .contact-page-grid{
    grid-template-columns: 1fr;
  }
}
@media (max-width: 600px){
  .page-contact .field-row{
    grid-template-columns: 1fr;
  }
}

.section.branding-showcase-section{
  padding-block: clamp(56px, 8vw, 96px);
  background: #e8e4de;
  border-top: 1px solid rgba(20, 19, 17, 0.06);
}
/* Services: intro stays in .container; accordion is full-width with small side gutters */
.services-accordion-bleed{
  width: auto;
  margin-left: clamp(14px, 4vw, 32px);
  margin-right: clamp(14px, 4vw, 32px);
  margin-top: 10px;
  margin-bottom: 4px;
  box-sizing: border-box;
}
.services-section .section-head{
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
.services-section .section-head .section-title{
  font-size: calc(clamp(56px, 7.2vw, 98px) + var(--heading-size-add));
  line-height: 1.02;
}
.services-section .section-head .section-title .section-title-link{
  color: inherit;
  text-decoration: none;
}
.services-section .section-head .section-title .section-title-link:hover{
  text-decoration: none;
}
.services-section .section-head .section-title .section-title-link:focus-visible{
  outline: 2px solid currentColor;
  outline-offset: 4px;
}
.services-section .service-horiz-tab{
  font-size: clamp(13px, 1.4vw, 18px);
}
.services-section .service-horiz-kicker{
  font-size: clamp(26px, 3.1vw, 44px);
}
.section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-bottom: 22px;
}
.section-title{
  margin:0;
  font-size: calc(clamp(30px, 3.35vw, 44px) + var(--heading-size-add));
  line-height:1.07;
  letter-spacing: -0.02em;
  font-weight: 400;
}
.lead{
  margin:0;
  max-width: 70ch;
  color: rgba(20,19,17,.72);
  font-size: var(--font-body-size);
  line-height: 1.65;
}

.two-col{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 28px;
  align-items: start;
}
.pill-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top: 18px;
}
.pill{
  border:1px solid rgba(20,19,17,.12);
  background: rgba(247,241,230,.70);
  padding: 9px 12px;
  border-radius: 999px;
  font-weight: var(--font-body-weight);
  letter-spacing:.02em;
  color: rgba(20,19,17,.82);
}

.about-media{
  position:relative;
  min-height: 380px;
}
.media-frame{
  border-radius: var(--radius2);
  overflow:hidden;
  border:1px solid rgba(20,19,17,.12);
  box-shadow: none;
  background: rgba(247,241,230,.8);
}
.media-frame img{display:block; width:100%; height: 390px; object-fit:cover}
.media-frame.small{
  position:absolute;
  right: -10px;
  bottom: -14px;
  width: min(56%, 300px);
  transform: rotate(1.6deg);
}
.media-frame.small img{height: 220px}

.feature-band{
  padding: 0 0 62px;
}
.feature-frame{
  border-radius: min(30px, 4.2vw);
  overflow:hidden;
  border:1px solid rgba(20,19,17,.12);
  background: rgba(247,241,230,.75);
  box-shadow: none;
  position:relative;
}
.feature-frame img{
  width:100%;
  height: clamp(360px, 42vw, 520px);
  object-fit: cover;
  display:block;
}
.feature-frame::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 460px at 20% 110%, rgba(247,241,230,.18), transparent 60%),
    linear-gradient(90deg, rgba(15,17,16,.58), rgba(15,17,16,.12) 60%, rgba(15,17,16,0));
  pointer-events:none;
}
.feature-overlay{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
}
.feature-copy{
  margin-left: 24px;
  width: min(640px, 92%);
  padding: 18px 18px 18px;
  border-radius: 22px;
  border:1px solid rgba(247,241,230,.24);
  background: rgba(15,17,16,.52);
  backdrop-filter: blur(10px);
  color: rgba(247,241,230,.96);
}
.feature-copy p{margin: 10px 0 0; color: rgba(247,241,230,.84)}

.cta-band{
  padding: clamp(40px, 5vw, 56px) 0;
  background: #ffffff;
}
.cta-panel{
  display:grid;
  grid-template-columns: 1fr 1.18fr;
  gap: 22px;
  align-items: stretch;
  border-radius: 0;
  border: 0;
  background: #ffffff;
  box-shadow: none;
  overflow:hidden;
}
.cta-copy{
  padding: clamp(22px, 3vw, 34px) clamp(22px, 3vw, 36px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-self: stretch;
}
.cta-copy .section-title{
  font-size: clamp(32px, 4.4vw, 52px);
  line-height: 1.05;
  letter-spacing: -0.025em;
  margin-top: 0;
  margin-bottom: clamp(12px, 1.8vw, 18px);
}
.cta-copy .cta-lead{
  margin: 0;
  max-width: min(48ch, 100%);
}
.cta-copy .cta-contact-cta{
  margin: clamp(20px, 2.8vw, 28px) 0 0;
}
.cta-media{
  background-image: var(--cta-img);
  background-size: cover;
  background-position: right bottom;
  min-height: clamp(240px, 34vw, 420px);
  position: relative;
}
.cta-media-email{
  position: absolute;
  /* Match .cta-copy padding so bracket lines align across columns */
  top: clamp(22px, 3vw, 34px);
  right: clamp(22px, 3vw, 36px);
  z-index: 2;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: var(--font-body-weight);
  font-style: italic;
  letter-spacing: 0.02em;
  color: #141311;
  text-decoration: none;
  text-shadow: none;
  max-width: min(calc(100% - clamp(44px, 6vw, 72px)), 42ch);
  text-align: right;
  line-height: 1.35;
}
.cta-media-email:hover{
  color: #000;
  text-decoration: underline;
}
.cta-media::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0));
}

.project-strip{
  display:flex;
  gap: 12px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 8px 2px 6px;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.project-strip::-webkit-scrollbar{
  display: none;
}
.project-card{
  scroll-snap-align: start;
  flex: 0 0 min(280px, 72vw);
  border-radius: 0;
  border:1px solid rgba(20,19,17,.10);
  background: rgba(247,241,230,.72);
  overflow:hidden;
  box-shadow: none;
  cursor:pointer;
  padding:0;
  display: flex;
  flex-direction: column;
}
a.project-card{
  color: inherit;
  text-decoration: none;
}
.project-card img{
  width:100%;
  height: auto;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  display:block;
  flex-shrink: 0;
}
.project-card .pc-body{
  padding: 12px 14px 14px;
}
.pc-kicker{
  display:block;
  font-weight: var(--font-body-weight);
  letter-spacing:.10em;
  text-transform: uppercase;
  font-size: 11px;
  color: rgba(20,19,17,.62);
}
.pc-title{
  margin: 6px 0 0;
  font-weight: 400;
  color: rgba(20,19,17,.92);
}
.project-card .pc-kicker{
  font-family: var(--font-button);
  font-size: clamp(12px, 1.05vw, 14px);
  font-weight: var(--font-button-weight);
  letter-spacing: .04em;
  text-transform: lowercase;
}
.project-card .pc-kicker::first-letter{
  text-transform: uppercase;
}
.project-card .pc-title{
  font-family: var(--font-subhead-hollow);
  font-size: var(--font-subhead-hollow-size);
  font-weight: 900;
  font-variant-ligatures: none;
  font-feature-settings: normal;
  text-transform: lowercase;
}
.project-card .pc-title::first-letter{
  text-transform: uppercase;
}

/* Horizontal services — all tabs on the left, then viewport; slides wipe over (no image zoom) */
.service-horiz-acc{
  display: flex;
  flex-direction: row;
  align-items: stretch;
  width: 100%;
  min-height: auto;
  max-height: none;
  margin: 0;
  border-top: 1px solid rgba(20,19,17,.12);
  border-bottom: 1px solid rgba(20,19,17,.12);
  background: rgba(247,241,230,.85);
  box-shadow: none;
}
.service-horiz-tabs{
  display: flex;
  flex-direction: row;
  flex: 0 0 auto;
  align-items: stretch;
}
.service-horiz-tabs--right.is-empty{
  display: none;
}
.service-horiz-tab{
  flex: 0 0 clamp(80px, 9.5vw, 124px);
  width: clamp(80px, 9.5vw, 124px);
  margin: 0;
  padding: 16px 12px;
  border: 0;
  border-left: 1px solid rgba(255,255,255,.12);
  background: var(--moss);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(12px, 1.25vw, 16px);
  font-weight: 400;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(247,241,230,.96);
  transition: background 0.22s ease, color 0.22s ease;
}
.service-horiz-tab::first-letter{
  text-transform: inherit;
}
.service-horiz-tabs--left .service-horiz-tab:first-child{
  border-left: 0;
}
.service-horiz-tab[aria-expanded="true"]{
  background: #3a4840;
  color: #fff;
}
.service-horiz-tab:hover{
  background: #445346;
  color: #fff;
}
.service-horiz-tab[aria-expanded="true"]:hover{
  background: #4d5e50;
  color: #fff;
}
.service-horiz-tab:focus-visible{
  outline: 2px solid rgba(247,241,230,.65);
  outline-offset: 2px;
}
.service-horiz-tab-text{
  display: block;
  transform: rotate(-90deg);
  white-space: nowrap;
  max-height: 100%;
  text-transform: inherit;
}
.service-horiz-viewport{
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  width: auto;
  max-width: none;
  aspect-ratio: 1024 / 500;
  height: auto;
  min-height: 0;
  overflow: hidden;
  background: rgba(20,19,17,.12);
}
.service-horiz-slide{
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(0);
}
.service-horiz-slide.is-active:not(.is-sliding-in){
  z-index: 2;
  visibility: visible;
  pointer-events: auto;
}
.service-horiz-slide.service-horiz-slide--prev{
  z-index: 1;
  visibility: visible;
  pointer-events: none;
}
.service-horiz-slide.is-active.is-sliding-in{
  z-index: 4;
  visibility: visible;
  pointer-events: none;
  will-change: transform;
  transition: transform 0.52s cubic-bezier(0.32, 0.72, 0, 1);
}
.service-horiz-slide.is-active.is-sliding-in.service-horiz-slide--from-next{
  transform: translate3d(100%, 0, 0);
}
.service-horiz-slide.is-active.is-sliding-in.service-horiz-slide--from-prev{
  transform: translate3d(-100%, 0, 0);
}
.service-horiz-slide.is-active.is-sliding-in.is-slide-run{
  transform: translate3d(0, 0, 0);
}
.service-horiz-media{
  position: absolute;
  inset: 0;
  background-image: var(--img);
  background-size: cover;
  background-position: center;
  transform: none;
}
/* Uniform scale + bottom anchor: panel shows the bottom quarter of the photo */
.service-horiz-media--bottom-quarter{
  overflow: hidden;
  background-position: bottom center;
  background-size: auto 400%;
}
.service-horiz-scrim{
  position: absolute;
  inset: 0;
  background:
    linear-gradient(105deg, rgba(15,17,16,.62) 0%, rgba(15,17,16,.28) 45%, rgba(15,17,16,.06) 100%),
    linear-gradient(180deg, rgba(15,17,16,.35), transparent 42%);
  pointer-events: none;
}
.service-horiz-body{
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-height: 100%;
  width: 100%;
  box-sizing: border-box;
  padding: clamp(22px, 4vw, 40px) clamp(18px, 3.5vw, 36px);
  text-align: left;
}
.service-horiz-body .service-horiz-kicker,
.service-horiz-body .service-horiz-bio{
  width: 100%;
  max-width: min(44ch, 94%);
}
.service-horiz-kicker{
  margin: 0 0 14px;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(22px, 2.6vw, 36px);
  line-height: 1.15;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-style: normal;
  font-weight: 400;
  color: rgba(247,241,230,.98);
}
.service-horiz-bio.service-desc{
  margin: 0 0 16px;
  color: rgba(255,255,255,.88);
  font-size: var(--font-body-size);
  line-height: 1.55;
}
.service-horiz-body .button.primary{
  margin-top: 0;
  box-shadow: none;
  letter-spacing: 0.06em;
}

/* Home — horizontal services accordion (tabs start right; dock left on open) */
.home-services-horiz{
  --home-services-bg: #f2efe9;
  --home-services-forest: #2d3b33;
  background: var(--home-services-bg);
  padding-top: clamp(40px, 6vw, 72px);
  padding-bottom: clamp(48px, 7vw, 88px);
}
.home-services-horiz .container{
  max-width: min(var(--container), calc(100% - 32px));
}
.home-services-horiz__acc-bleed{
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}
.home-services-horiz__acc-bleed .home-services-horiz__acc.service-horiz-acc{
  width: 100%;
  max-width: none;
  border-left: 0;
  border-right: 0;
  border-radius: 0;
}
.home-services-horiz__head{
  margin-bottom: clamp(22px, 3.2vw, 36px);
}
.home-services-horiz__title{
  margin: 0 0 10px;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(52px, 7vw, 96px) + var(--heading-size-add));
  line-height: 0.98;
  letter-spacing: 0.02em;
  font-weight: 400;
  text-transform: uppercase;
  color: var(--ink);
}
.home-services-horiz__lead{
  margin: 0;
  max-width: 52ch;
  font-size: var(--font-body-size);
  line-height: 1.6;
  color: var(--muted);
  font-weight: var(--font-body-weight);
}
.home-services-horiz__acc.service-horiz-acc{
  border: 1px solid rgba(45, 59, 51, 0.14);
  background: var(--home-services-forest);
  border-radius: 0;
}
.home-services-horiz__acc .service-horiz-tab{
  flex: 0 0 clamp(92px, 10.5vw, 136px);
  width: clamp(92px, 10.5vw, 136px);
  font-size: clamp(15px, 1.75vw, 22px);
  background: var(--home-services-forest);
  border-left-color: rgba(255, 255, 255, 0.14);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
.home-services-horiz__acc .service-horiz-tab[aria-expanded="true"]{
  background: #35463d;
}
.home-services-horiz__acc .service-horiz-tab:hover{
  background: #3d5046;
}
.service-horiz-tabs--left:empty{
  flex: 0 0 0;
  width: 0;
  min-width: 0;
  overflow: hidden;
  border: 0;
  padding: 0;
  margin: 0;
}
.home-services-horiz__body.service-horiz-body{
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: clamp(16px, 2.5vw, 24px);
  padding: clamp(24px, 4.5vw, 48px) clamp(20px, 3.5vw, 40px);
}
.home-services-horiz__cta.button.primary{
  flex: 0 0 auto;
  align-self: flex-start;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: clamp(13px, 1.35vw, 17px);
  padding: clamp(16px, 2.2vw, 20px) clamp(22px, 3vw, 32px);
  min-height: 48px;
  background: var(--home-services-forest);
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: rgba(247, 241, 230, 0.98);
}
.home-services-horiz__cta.button.primary:hover{
  background: #1a3329;
  color: #fff;
}
.home-services-horiz__copy{
  flex: 1 1 auto;
  min-width: 0;
}
.home-services-horiz__copy .service-horiz-kicker{
  text-transform: none;
  letter-spacing: 0.02em;
  font-size: clamp(22px, 2.8vw, 38px);
}
.home-services-horiz__copy .service-horiz-bio.service-desc{
  margin-bottom: 0;
}
.service-desc{
  margin:0 0 12px;
  color: rgba(20,19,17,.72);
}
.service-open{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 12px 14px;
  border-radius: 0;
  border:1px solid rgba(20,19,17,.14);
  background: rgba(122,90,58,.10);
  cursor:pointer;
  font-family: var(--font-button);
  font-size: var(--font-button-size);
  font-weight: var(--font-button-weight);
  letter-spacing:.02em;
}
.service-open:hover{background: rgba(122,90,58,.14)}

.accordions{margin-top: 14px}
.accordion{
  border:1px solid rgba(20,19,17,.10);
  border-radius: 0;
  background: rgba(247,241,230,.68);
  overflow:hidden;
  margin-bottom: 12px;
}
.accordion summary{
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 16px;
  padding: 14px 16px;
  font-weight: 400;
}
.accordion summary::-webkit-details-marker{display:none}
.acc-title{letter-spacing:.01em}
.acc-meta{
  font-weight: var(--font-body-weight);
  color: rgba(20,19,17,.66);
}
.accordion[open] summary{
  background: rgba(26,51,41,.08);
  border-bottom:1px solid rgba(20,19,17,.08);
}
.acc-panel{padding: 16px}

.package-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.package-grid.one{grid-template-columns: minmax(0,1fr)}
.package{
  border-radius: 0;
  border:1px solid rgba(20,19,17,.10);
  padding: 14px;
  background: rgba(247,241,230,.70);
}
.package.featured{
  border-color: rgba(26,51,41,.22);
  background:
    radial-gradient(820px 340px at 30% 0%, rgba(26,51,41,.10), transparent 60%),
    rgba(247,241,230,.72);
}
.package-top{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.package-title{
  margin:0;
  font-size: 22px;
  letter-spacing: -0.01em;
  font-weight: 400;
}
.package-price{
  margin:0;
  font-weight: var(--font-body-weight);
  color: rgba(26,51,41,.92);
}
.package-list{
  margin: 0;
  padding-left: 18px;
  color: rgba(20,19,17,.74);
}
.package-list li{margin: 6px 0}

/* Service detail package tiles — dark green + white on hover / tap */
.service-detail-packages > .package:not(.package--editorial){
  cursor: pointer;
  transition: background 0.22s ease, border-color 0.22s ease, color 0.22s ease;
}
@media (prefers-reduced-motion: reduce){
  .service-detail-packages > .package:not(.package--editorial){
    transition: none;
  }
}
.service-detail-packages > .package:not(.package--editorial):hover,
.service-detail-packages > .package:not(.package--editorial):active{
  background: var(--moss);
  border-color: rgba(255, 255, 255, 0.22);
  color: rgba(255, 255, 255, 0.98);
}
.service-detail-packages > .package:not(.package--editorial).featured:hover,
.service-detail-packages > .package:not(.package--editorial).featured:active{
  background: var(--moss);
}
.service-detail-packages > .package:not(.package--editorial):hover .package-title,
.service-detail-packages > .package:not(.package--editorial):active .package-title{
  color: #fff;
}
.service-detail-packages > .package:not(.package--editorial):hover .package-price,
.service-detail-packages > .package:not(.package--editorial):active .package-price{
  color: rgba(255, 255, 255, 0.92);
}
.service-detail-packages > .package:not(.package--editorial):hover .package-list,
.service-detail-packages > .package:not(.package--editorial):active .package-list{
  color: rgba(255, 255, 255, 0.88);
}
.service-detail-packages > .package:not(.package--editorial):hover .package-list li::marker,
.service-detail-packages > .package:not(.package--editorial):active .package-list li::marker{
  color: rgba(255, 255, 255, 0.75);
}
.service-detail-packages > .package:not(.package--editorial):hover .fineprint,
.service-detail-packages > .package:not(.package--editorial):active .fineprint{
  color: rgba(255, 255, 255, 0.82);
}
.service-detail-packages > .package:not(.package--editorial):hover .fineprint strong,
.service-detail-packages > .package:not(.package--editorial):active .fineprint strong{
  color: #fff;
}

/* Services hub — Branding / Websites / Social catalog cards */
.page-services-hub .services-catalog-card{
  cursor: pointer;
  transition: background 0.22s ease, border-color 0.22s ease, color 0.22s ease;
}
@media (prefers-reduced-motion: reduce){
  .page-services-hub .services-catalog-card{
    transition: none;
  }
}
.page-services-hub .services-catalog-card:hover,
.page-services-hub .services-catalog-card:active{
  background: var(--moss);
  border-color: rgba(255, 255, 255, 0.22);
}
.page-services-hub .services-catalog-card:hover .services-catalog-card__title,
.page-services-hub .services-catalog-card:hover .services-catalog-card__text,
.page-services-hub .services-catalog-card:active .services-catalog-card__title,
.page-services-hub .services-catalog-card:active .services-catalog-card__text{
  color: #fff;
}
.page-services-hub .services-catalog-card:hover .services-catalog-card__title-link,
.page-services-hub .services-catalog-card:active .services-catalog-card__title-link{
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.4);
}
.page-services-hub .services-catalog-card:hover .services-catalog-card__media-trigger,
.page-services-hub .services-catalog-card:active .services-catalog-card__media-trigger{
  border-bottom-color: rgba(255, 255, 255, 0.2);
}

/* Website design (services) — centered packages block + Arome tier titles
   (branding + social service pages use the same layout) */
.page-service-website #websites .section-title,
.page-service-branding #branding .section-title,
.page-service-social #social .section-title{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.page-service-website #websites .lead,
.page-service-website #websites .portfolio-page-lead,
.page-service-branding #branding .portfolio-page-lead,
.page-service-social #social .portfolio-page-lead{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.page-service-website #websites .portfolio-page-lead{
  max-width: 65ch;
}
.page-service-website #websites > section.section:first-child .lead{
  max-width: 65ch;
}
.page-service-social #social > section.section:first-child .lead{
  max-width: 65ch;
}
.page-service-website #websites .fineprint{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
/* Next step (approach column): left-align on desktop — beats #websites .lead / .fineprint centering */
@media (min-width: 901px){
  .page-service-website #websites .section-website-approach__next .section-title{
    text-align: left;
    margin-left: 0;
    margin-right: 0;
    margin-top: clamp(58px, 8.55vw, 101px);
  }
  .page-service-website #websites .section-website-approach__next .lead.service-next-step-lead{
    text-align: left;
    margin-left: 0;
    margin-right: 0;
  }
  .page-service-website #websites .section-website-approach__next .fineprint.service-next-step-fineprint{
    text-align: left;
    margin-left: 0;
    margin-right: 0;
  }
  .page-service-branding #branding .section-branding-approach__next .section-title{
    text-align: left;
    margin-left: 0;
    margin-right: 0;
    margin-top: clamp(28px, 4vw, 44px);
  }
  .page-service-branding #branding .section-branding-approach__next .lead.service-next-step-lead{
    text-align: left;
    margin-left: 0;
    margin-right: 0;
  }
  .page-service-social #social .section-social-approach__next .section-title{
    text-align: left;
    margin-left: 0;
    margin-right: 0;
    margin-top: clamp(58px, 8.55vw, 101px);
  }
  .page-service-social #social .section-social-approach__next .lead.service-next-step-lead{
    text-align: left;
    margin-left: 0;
    margin-right: 0;
  }
}
.page-service-website #websites .service-detail-packages.package-grid,
.page-service-branding #branding .service-detail-packages.package-grid{
  margin-left: auto;
  margin-right: auto;
  max-width: min(1080px, 100%);
}
.page-service-website #websites .service-detail-packages.package-grid.one{
  max-width: min(720px, 100%);
}
.page-service-social #social .service-detail-packages.package-grid--quad{
  margin-left: auto;
  margin-right: auto;
  max-width: min(1240px, 100%);
}
.page-service-website #websites .package-top,
.page-service-branding #branding .package-top,
.page-service-social #social .package-top{
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  text-align: center;
  gap: 6px;
}
.page-service-website #websites h3.package-title,
.page-service-branding #branding h3.package-title,
.page-service-social #social h3.package-title{
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-style: normal;
  font-weight: 400;
  font-size: clamp(1.2rem, 2.4vw, 1.95rem);
  letter-spacing: 0.05em;
  line-height: 1.2;
  text-transform: uppercase;
  font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
  font-feature-settings: "liga" 1, "clig" 1, "calt" 1, "dlig" 1;
  max-width: 22ch;
}
.page-service-social #social h3.package-title{
  max-width: min(28ch, 100%);
}
.page-service-website #websites .package-price,
.page-service-branding #branding .package-price,
.page-service-social #social .package-price{
  text-align: center;
}
.page-service-website #websites .fineprint,
.page-service-branding #branding .fineprint,
.page-service-social #social .fineprint{
  text-align: center;
}
.page-service-website #websites .package-list,
.page-service-branding #branding .package-list{
  text-align: left;
}

/* Service detail pages — editorial package cards (3-col + stacked CTAs) */
.section--packages-editorial{
  background: #f5f3ee;
}
.section--packages-editorial .service-detail-packages.package-grid--editorial-cards{
  margin-top: clamp(28px, 4vw, 44px);
}
.package-grid--editorial-cards{
  align-items: stretch;
  gap: clamp(22px, 3vw, 36px);
}
.package-grid--editorial-cards .package--editorial{
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  padding: clamp(26px, 3.5vw, 40px) clamp(20px, 2.8vw, 30px);
  border: 1px solid rgba(20, 19, 17, 0.55);
  background: #faf8f4;
  box-sizing: border-box;
}
.package-grid--editorial-cards .package--editorial.featured{
  border-color: rgba(20, 19, 17, 0.55);
  background: #faf8f4;
  box-shadow: none;
}
.package--editorial .package-title{
  margin: 0 0 clamp(12px, 1.8vw, 18px);
  max-width: 22ch;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(1.35rem, 2.1vw, 1.65rem);
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
  font-feature-settings: "liga" 1, "clig" 1, "calt" 1, "dlig" 1;
  color: #141210;
}
.package--editorial .package-card-lead{
  margin: 0 0 clamp(14px, 2vw, 20px);
  max-width: 42ch;
  font-family: ui-serif, Georgia, "Times New Roman", serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.65;
  text-align: center;
  color: rgba(20, 19, 17, 0.84);
}
.package--editorial .package-price-row{
  margin: 0 0 4px;
  text-align: center;
}
.package--editorial .package-price{
  font-family: ui-serif, Georgia, "Times New Roman", serif;
  font-size: clamp(1.15rem, 2vw, 1.38rem);
  font-weight: 500;
  font-style: normal;
  color: #141210;
}
.package--editorial .package-meta-line{
  margin: 0 0 clamp(14px, 2vw, 20px);
  max-width: 40ch;
  font-family: ui-serif, Georgia, "Times New Roman", serif;
  font-size: 14px;
  line-height: 1.5;
  text-align: center;
  color: rgba(20, 19, 17, 0.72);
}
.package--editorial .package-list-heading{
  margin: 0 0 10px;
  width: 100%;
  font-family: var(--font-button);
  font-size: clamp(12px, 1.1vw, 14px);
  font-weight: var(--font-button-weight);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-align: center;
  color: rgba(20, 19, 17, 0.5);
}
.package--editorial .package-list{
  width: 100%;
  max-width: 48ch;
  margin: 0 0 clamp(16px, 2.2vw, 22px);
  padding-left: 1.15em;
  box-sizing: border-box;
  text-align: left;
  font-family: ui-serif, Georgia, "Times New Roman", serif;
  font-size: 14px;
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.82);
}
.package--editorial .package-includes{
  width: 100%;
  max-width: 48ch;
  margin: 0 0 clamp(14px, 2vw, 20px);
  border: 1px solid rgba(20, 19, 17, 0.22);
  background: rgba(255, 255, 255, 0.55);
  box-sizing: border-box;
}
.package--editorial .package-includes__summary{
  position: relative;
  list-style: none;
  cursor: pointer;
  padding: 12px 36px 12px 14px;
  margin: 0;
  font-family: var(--font-button);
  font-size: clamp(12px, 1.1vw, 14px);
  font-weight: var(--font-button-weight);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-align: center;
  color: rgba(20, 19, 17, 0.72);
  user-select: none;
}
.package--editorial .package-includes__summary::-webkit-details-marker{
  display: none;
}
.package--editorial .package-includes__summary::after{
  content: "";
  position: absolute;
  right: 14px;
  top: 50%;
  width: 7px;
  height: 7px;
  margin-top: -5px;
  border-right: 2px solid rgba(20, 19, 17, 0.45);
  border-bottom: 2px solid rgba(20, 19, 17, 0.45);
  transform: rotate(45deg);
  transition: transform 0.2s ease;
}
.package--editorial .package-includes[open] .package-includes__summary::after{
  margin-top: -2px;
  transform: rotate(-135deg);
}
.package--editorial .package-includes__summary:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.45);
  outline-offset: 2px;
}
.package--editorial .package-includes .package-list--includes{
  margin: 0;
  padding: 0 14px 14px calc(14px + 1.15em);
}
.package-grid-single-cta{
  display: flex;
  justify-content: center;
  margin-top: clamp(28px, 4vw, 44px);
}
.package-grid-single-cta .package-card-btn{
  width: auto;
  min-width: min(280px, 100%);
  max-width: 360px;
}
.package--editorial .package-card-footnote{
  margin: 0 0 clamp(8px, 1.5vw, 14px);
  max-width: 48ch;
  font-family: ui-serif, Georgia, "Times New Roman", serif;
  font-size: 13px;
  text-align: center;
  color: rgba(20, 19, 17, 0.68);
}
.package-grid--editorial-cards .package--editorial .package-card-footnote{
  margin-top: auto;
}
.package-card-actions{
  width: 100%;
  max-width: 300px;
  margin-top: auto;
  padding-top: clamp(8px, 1.5vw, 14px);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
}
.package-card-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 13px 16px;
  border-radius: 0;
  box-sizing: border-box;
  text-decoration: none;
  font-family: var(--font-button);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}
.package-card-btn--outline{
  border: 1px solid rgba(20, 19, 17, 0.65);
  background: transparent;
  color: #141210;
}
.package-card-btn--outline:hover{
  background: rgba(20, 19, 17, 0.06);
  color: #141210;
}
.package-card-btn--outline:focus-visible{
  outline: 2px solid rgba(20, 19, 17, 0.45);
  outline-offset: 3px;
}
.package-card-btn--solid{
  min-height: 52px;
  padding: 17px 28px;
  border: 1px solid rgba(20, 19, 17, 0.22);
  background: #e9dfd2;
  color: var(--ink);
  font-size: clamp(11px, 1.05vw, 13px);
}
.package-card-btn--solid:hover{
  background: #dfd2c3;
  border-color: rgba(20, 19, 17, 0.32);
  color: var(--ink);
}
.package-card-btn--solid:focus-visible{
  outline: 2px solid rgba(20, 19, 17, 0.35);
  outline-offset: 3px;
}
.package-grid--editorial-cards.package-grid--quad{
  grid-template-columns: 1fr;
  max-width: 920px;
  margin-inline: auto;
}
@media (min-width: 560px){
  .package-grid--editorial-cards.package-grid--quad{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Branding page — centered copy + click-to-reveal pricing (native <details>) */
.section-branding-packages .service-detail-back,
.section-branding-packages .section-title,
.section-branding-packages .section-packages-subtitle,
.section-branding-packages .lead{
  text-align: center;
}
.section-packages-subtitle{
  font-family: var(--font-button);
  font-size: clamp(0.85rem, 1.5vw, 0.95rem);
  font-weight: var(--font-button-weight);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.55);
}

.website-addons-list{
  list-style: none;
  margin: clamp(8px, 2vw, 16px) auto 0;
  padding: 0;
  max-width: min(560px, 100%);
}
.website-addons-list li{
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid rgba(20, 19, 17, 0.1);
  font-family: ui-serif, Georgia, "Times New Roman", serif;
  font-size: 15px;
  line-height: 1.45;
  color: rgba(20, 19, 17, 0.88);
}
.website-addons-list li:last-child{
  border-bottom: none;
}
.website-addons-list__investment{
  flex-shrink: 0;
  font-size: 14px;
  color: rgba(20, 19, 17, 0.62);
  white-space: nowrap;
}
.page-service-website #websites .section-website-addons .lead{
  max-width: 52ch;
}

.service-next-step-fineprint{
  margin: 0 auto 18px;
  max-width: min(48ch, 100%);
  text-align: center;
  font-size: 14px;
  line-height: 1.55;
  color: rgba(20, 19, 17, 0.62);
}
.page-service-website main > .section.section-alt .service-next-step-lead{
  margin-bottom: 8px;
}
.section-branding-packages .lead{
  margin-left: auto;
  margin-right: auto;
}
.section-branding-packages .service-detail-cta{
  justify-content: center;
}
.section-branding-packages .package-price{
  font-size: clamp(1.2rem, 2.6vw, 1.45rem);
  letter-spacing: 0.02em;
}

/* Branding service — Packages: layered backdrop, stagger reveal, tier accents, hover lift */
.page-service-branding .section-branding-packages.section--packages-editorial{
  position: relative;
  padding-top: clamp(20px, 3vw, 36px);
  background:
    radial-gradient(ellipse 85% 55% at 50% -8%, rgba(26, 51, 41, 0.09), transparent 58%),
    radial-gradient(ellipse 50% 42% at 100% 100%, rgba(122, 90, 58, 0.07), transparent 52%),
    radial-gradient(ellipse 45% 38% at 0% 85%, rgba(26, 51, 41, 0.05), transparent 48%),
    linear-gradient(180deg, #f8f6f1 0%, #f0ebe2 100%);
}
.page-service-branding .section-branding-packages > .container{
  position: relative;
  z-index: 1;
}
@keyframes branding-package-rise{
  from{
    opacity: 0;
    transform: translateY(28px);
  }
  to{
    opacity: 1;
    transform: translateY(0);
  }
}
.page-service-branding .section-branding-packages .package-grid--editorial-cards .package--editorial{
  position: relative;
  overflow: visible;
  border-color: rgba(20, 19, 17, 0.42);
  box-shadow: 0 12px 36px rgba(30, 28, 24, 0.06);
  transition:
    transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    border-color 0.3s ease,
    background-color 0.3s ease;
}
.page-service-branding .section-branding-packages:not(.is-revealed) .package-grid--editorial-cards .package--editorial{
  opacity: 0;
}
.page-service-branding .section-branding-packages.is-revealed .package-grid--editorial-cards .package--editorial{
  animation: branding-package-rise 0.72s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
.page-service-branding .section-branding-packages.is-revealed .package-grid--editorial-cards .package--editorial:nth-child(1){
  animation-delay: 0.06s;
}
.page-service-branding .section-branding-packages.is-revealed .package-grid--editorial-cards .package--editorial:nth-child(2){
  animation-delay: 0.18s;
}
.page-service-branding .section-branding-packages.is-revealed .package-grid--editorial-cards .package--editorial:nth-child(3){
  animation-delay: 0.3s;
}
.page-service-branding .section-branding-packages .package-grid--editorial-cards .package--editorial::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 4px;
  border-radius: 0;
  background: linear-gradient(90deg, rgba(26, 51, 41, 0.55), rgba(122, 90, 58, 0.45));
  opacity: 0.95;
  pointer-events: none;
}
.page-service-branding .section-branding-packages .package-grid--editorial-cards .package--editorial:nth-child(1)::after{
  background: linear-gradient(90deg, rgba(26, 51, 41, 0.5), rgba(26, 51, 41, 0.25));
}
.page-service-branding .section-branding-packages .package-grid--editorial-cards .package--editorial:nth-child(3)::after{
  background: linear-gradient(90deg, rgba(122, 90, 58, 0.55), rgba(26, 51, 41, 0.45));
}
.page-service-branding .section-branding-packages .package-grid--editorial-cards .package--editorial.featured{
  z-index: 2;
  border-color: rgba(26, 51, 41, 0.55);
  box-shadow:
    0 18px 48px rgba(30, 28, 24, 0.12),
    0 0 0 1px rgba(26, 51, 41, 0.12);
}
@media (hover: hover){
  .page-service-branding .section-branding-packages .package-grid--editorial-cards .package--editorial:hover{
    transform: translateY(-8px);
    box-shadow: 0 22px 52px rgba(30, 28, 24, 0.14);
    border-color: rgba(26, 51, 41, 0.38);
    background: #fffcf7;
  }
  .page-service-branding .section-branding-packages .package-grid--editorial-cards .package--editorial.featured:hover{
    transform: translateY(-8px);
  }
}
@media (prefers-reduced-motion: reduce){
  .page-service-branding .section-branding-packages .package-grid--editorial-cards .package--editorial,
  .page-service-branding .section-branding-packages:not(.is-revealed) .package-grid--editorial-cards .package--editorial{
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  .page-service-branding .section-branding-packages .package-grid--editorial-cards .package--editorial:hover{
    transform: none;
  }
}
details.package.package--expandable{
  padding: 0;
}
.package--expandable .package-summary{
  list-style: none;
  cursor: pointer;
  padding: 16px 14px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  user-select: none;
}
.package--expandable .package-summary::-webkit-details-marker{
  display: none;
}
.package--expandable .package-summary::marker{
  content: "";
}
.package--expandable .package-summary .package-title{
  margin: 0;
}
.package--expandable .package-summary-hint{
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(20, 19, 17, 0.52);
  font-weight: var(--font-body-weight);
}
.package--expandable .package-summary::after{
  content: "";
  width: 9px;
  height: 9px;
  margin-top: 2px;
  border-right: 2px solid rgba(20, 19, 17, 0.42);
  border-bottom: 2px solid rgba(20, 19, 17, 0.42);
  transform: rotate(45deg);
  transition: transform 0.2s ease;
}
details.package--expandable[open] > .package-summary::after{
  transform: rotate(225deg);
  margin-top: 6px;
}
.package--expandable .package-summary:focus{
  outline: none;
}
.package--expandable .package-summary:focus-visible{
  outline: 2px solid rgba(26, 51, 41, 0.45);
  outline-offset: 3px;
}
.package--expandable .package-panel-inner{
  padding: 4px 16px 18px;
  border-top: 1px solid rgba(20, 19, 17, 0.08);
  text-align: center;
}
.section-branding-packages .package-panel-inner .package-price{
  margin: 10px 0 12px;
}
.section-branding-packages .package-panel-inner .package-list{
  padding-left: 0;
  list-style-position: inside;
  max-width: 40ch;
  margin: 0 auto;
  text-align: center;
}
.section-branding-packages .package-panel-inner .package-list li{
  text-align: center;
}

.fineprint{
  margin: 14px 0 0;
  color: rgba(20,19,17,.66);
  font-size: 14px;
}

.filters{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin: 12px 0 18px;
}
.chip{
  appearance:none;
  border:1px solid rgba(20,19,17,.12);
  background: rgba(247,241,230,.70);
  padding: 11px 14px;
  border-radius: 999px;
  cursor:pointer;
  font-family: var(--font-button);
  font-size: var(--font-button-size);
  font-weight: var(--font-button-weight);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(20,19,17,.78);
}
.chip:hover{background: rgba(122,90,58,.10)}
.chip.is-active{
  background: rgba(26,51,41,.12);
  border-color: rgba(26,51,41,.20);
  color: rgba(20,19,17,.92);
}

.masonry{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.tile{
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  border-radius: 18px;
  overflow:hidden;
  position:relative;
  box-shadow: none;
  border:1px solid rgba(20,19,17,.10);
  transition: transform .18s ease, border-color .18s ease;
}
.tile:hover{
  transform: translateY(-2px);
  border-color: rgba(122,90,58,.22);
  box-shadow: none;
}
.tile img{
  display:block;
  width:100%;
  height: 190px;
  object-fit: cover;
}
.tile:nth-child(2n) img{height: 240px}
.tile:nth-child(3n) img{height: 210px}

/* Legal — privacy & terms */
.page-legal .legal-body{
  max-width: 44rem;
  margin-top: clamp(12px, 2vw, 20px);
}
.page-legal .legal-body > *:first-child{
  margin-top: 0;
}
.page-legal .legal-body h2{
  margin: clamp(2rem, 4vw, 2.75rem) 0 0.65rem;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(15px, 1.35vw, 18px) + var(--heading-size-add));
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #14120f;
}
.page-legal .legal-body h2:first-of-type{
  margin-top: clamp(1.25rem, 2.5vw, 1.75rem);
}
.page-legal .legal-body p,
.page-legal .legal-body li{
  margin: 0 0 1rem;
  font-size: var(--font-body-size);
  font-weight: var(--font-body-weight);
  line-height: 1.65;
  color: rgba(20, 19, 17, 0.82);
}
.page-legal .legal-body ul{
  margin: 0 0 1rem;
  padding-left: 1.25rem;
}
.page-legal .legal-body li::marker{
  color: rgba(20, 19, 17, 0.45);
}
.page-legal .legal-body a{
  color: var(--moss);
  text-underline-offset: 3px;
}
.page-legal .legal-body a:hover{
  color: var(--earth);
}
.page-legal .legal-meta{
  margin: 0 0 0.5rem;
  font-size: 14px;
  letter-spacing: 0.04em;
  color: rgba(20, 19, 17, 0.55);
}
.page-legal .legal-cross{
  margin-top: clamp(2rem, 4vw, 2.5rem);
  padding-top: 1.25rem;
  border-top: 1px solid rgba(20, 19, 17, 0.08);
  font-size: 15px;
}

.contact-grid{align-items: stretch}
.contact-cards{
  display:grid;
  grid-template-columns: minmax(0,1fr);
  gap: 12px;
  margin-top: 18px;
}
.contact-card{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding: 14px;
  border-radius: 18px;
  border:1px solid rgba(20,19,17,.10);
  background: rgba(247,241,230,.70);
  text-decoration:none;
  color: inherit;
  transition: transform .18s ease, border-color .18s ease;
}
.contact-card:hover{
  transform: translateY(-1px);
  border-color: rgba(26,51,41,.22);
}
.contact-label{
  font-weight: var(--font-body-weight);
  letter-spacing:.10em;
  text-transform: uppercase;
  font-size: 12px;
  color: rgba(20,19,17,.66);
}
.contact-value{
  font-weight: var(--font-body-weight);
  color: rgba(20,19,17,.92);
}

.form{
  border-radius: 22px;
  border:1px solid rgba(20,19,17,.10);
  background: rgba(247,241,230,.68);
  padding: 16px;
  box-shadow: none;
}
.field-row{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 12px;
}
.field{
  display:flex;
  flex-direction:column;
  gap: 6px;
  margin-bottom: 12px;
}
.field-label{
  font-weight: var(--font-body-weight);
  letter-spacing:.06em;
  text-transform: uppercase;
  font-size: 12px;
  color: rgba(20,19,17,.66);
}
input, select, textarea{
  font: inherit;
  padding: 12px 12px;
  border-radius: 0;
  border:1px solid rgba(20,19,17,.14);
  background: rgba(255,255,255,.55);
  outline: none;
}
input:focus, select:focus, textarea:focus{
  border-color: rgba(26,51,41,.34);
  box-shadow: none;
  outline: 2px solid rgba(26,51,41,.22);
  outline-offset: 1px;
}
.form-hint{
  margin: 10px 0 0;
  color: rgba(20,19,17,.66);
  font-size: var(--font-body-size);
}

/* Home — social + Instagram strip above footer */
.home-instagram-strip{
  border-top: 1px solid rgba(20, 19, 17, 0.08);
  background: #ffffff;
}
/* Home page only: editorial reviews strip stacks flush with next section */
body.home-nav-fixed-bottom .services-reviews-section.reviews-section--editorial.section-alt{
  border-bottom: none;
}
body.home-nav-fixed-bottom .home-instagram-strip.site-instagram-prefooter{
  border-top: none;
}
/* Instagram pre-footer — profile + horizontal thumbnail rail (data from instagram-feed.json) */
.instagram-feed-section__inner.site-instagram-prefooter__inner{
  display: flex;
  flex-direction: column;
  gap: clamp(20px, 3vw, 28px);
  padding-top: clamp(36px, 5.5vw, 64px);
  padding-bottom: clamp(32px, 5vw, 56px);
}
.instagram-feed-section__row{
  display: grid;
  grid-template-columns: minmax(0, min(100%, 320px)) minmax(0, 1fr);
  gap: clamp(20px, 3.5vw, 40px);
  align-items: start;
  width: 100%;
  padding-inline-start: clamp(16px, 4.5vw, 48px);
  box-sizing: border-box;
}
.instagram-feed-section__profile{
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: clamp(16px, 3vw, 24px);
  max-width: none;
  margin-inline: 0;
  justify-content: flex-start;
  text-align: left;
}
.instagram-feed-section__avatar-link{
  flex-shrink: 0;
  line-height: 0;
  border-radius: 50%;
  overflow: hidden;
  border: 1px solid rgba(20, 19, 17, 0.1);
}
.instagram-feed-section__avatar{
  display: block;
  width: clamp(72px, 12vw, 88px);
  height: auto;
  aspect-ratio: 1;
  object-fit: cover;
}
.instagram-feed-section__meta{
  flex: 1;
  min-width: min(100%, 240px);
  max-width: 42ch;
}
.instagram-feed-section__handle{
  font-weight: 600;
  color: #14120f;
  text-decoration: none;
}
.instagram-feed-section__handle:hover{
  color: var(--moss);
}
.instagram-feed-section__bio{
  margin: 10px 0 0;
  font-size: clamp(14px, 1.15vw, 16px);
  line-height: 1.5;
  color: rgba(20, 19, 17, 0.75);
}
.instagram-feed-section__website{
  display: inline-block;
  margin-top: 8px;
  font-size: clamp(13px, 1.05vw, 15px);
  color: var(--moss);
  text-decoration: none;
}
.instagram-feed-section__website:hover{
  text-decoration: underline;
}
.instagram-feed-section__rail{
  display: flex;
  gap: clamp(8px, 1.5vw, 12px);
  overflow-x: auto;
  overflow-y: hidden;
  padding: 4px 0 12px;
  margin-inline: 0;
  padding-inline: 0;
  min-width: 0;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.instagram-feed-section__rail::-webkit-scrollbar{
  display: none;
}
.instagram-feed-section__post{
  flex: 0 0 clamp(148px, 26vw, 210px);
  scroll-snap-align: start;
  position: relative;
  /* IG portrait feed ratio — avoids awkward square crops on tall reels/static posts */
  aspect-ratio: 4 / 5;
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(20, 19, 17, 0.08);
  background: rgba(20, 19, 17, 0.06);
  line-height: 0;
}
.instagram-feed-section__post:hover .instagram-feed-section__thumb img,
.instagram-feed-section__post:focus-visible .instagram-feed-section__thumb img{
  transform: scale(1.04);
}
.instagram-feed-section__post:focus-visible{
  outline: 2px solid var(--moss);
  outline-offset: 2px;
  z-index: 1;
}
.instagram-feed-section__thumb{
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  position: relative;
}
.instagram-feed-section__thumb img{
  display: block;
  width: 100%;
  height: 100%;
  min-height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.35s ease;
}
.instagram-feed-section__badge{
  position: absolute;
  bottom: 8px;
  left: 8px;
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fff;
  background: rgba(20, 19, 17, 0.72);
  border-radius: 4px;
}
@media (max-width: 880px){
  .instagram-feed-section__row{
    grid-template-columns: 1fr;
    gap: clamp(18px, 4vw, 28px);
    padding-inline-start: clamp(12px, 3vw, 28px);
  }
  .instagram-feed-section__rail{
    margin-inline: calc(-1 * clamp(12px, 2vw, 20px));
    padding-inline: clamp(12px, 2vw, 20px);
  }
}
.instagram-feed-section__fallback{
  text-align: center;
  margin: 0;
  padding: clamp(24px, 4vw, 40px) 0;
  color: rgba(20, 19, 17, 0.7);
}
.home-instagram-strip .container{
  width: calc(100% - clamp(20px, 3vw, 40px));
  max-width: none;
}
.home-social-showcase__inner{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding-top: clamp(48px, 7vw, 88px);
  padding-bottom: clamp(40px, 6vw, 72px);
  gap: clamp(28px, 5vw, 44px);
}
/* Pre-footer strip (tiles + handle only — no hero title/icons) */
.site-instagram-prefooter .site-instagram-prefooter__inner{
  padding-top: clamp(36px, 5.5vw, 64px);
  padding-bottom: clamp(32px, 5vw, 56px);
  gap: clamp(20px, 3.5vw, 32px);
}
.home-social-showcase__title{
  margin: 0;
  max-width: 28ch;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: calc(clamp(26px, 3.6vw, 40px) + var(--heading-size-add));
  font-weight: 400;
  line-height: 1.12;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #14120f;
}
.home-social-showcase__icons{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(22px, 5vw, 40px);
}
.home-social-showcase__icon-link{
  display: flex;
  align-items: center;
  justify-content: center;
  color: #14120f;
  line-height: 0;
  transition: color 0.2s ease, transform 0.2s ease, opacity 0.2s ease;
}
.home-social-showcase__icon-link:hover{
  color: var(--moss);
  transform: translateY(-2px);
}
.home-social-showcase__icon-link:focus-visible{
  outline: 2px solid var(--moss);
  outline-offset: 6px;
}
.home-instagram-strip__feed{
  width: 100%;
  margin-top: clamp(4px, 1vw, 12px);
}
.home-instagram-strip__embeds{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: clamp(12px, 2vw, 18px);
  padding: clamp(8px, 1.5vw, 16px) 0;
  justify-items: center;
  align-items: start;
  box-sizing: border-box;
  width: 100%;
}
.home-instagram-strip__embeds:not([hidden]){
  border-bottom: 1px solid rgba(20, 19, 17, 0.08);
  background: #ffffff;
}
.home-instagram-strip__embeds .instagram-media{
  margin: 0 !important;
  width: 100% !important;
  max-width: 540px;
  min-width: 0 !important;
}
.home-instagram-strip__iframe{
  display: block;
  width: 100%;
  min-height: min(560px, 90vh);
  border: 0;
  background: #ffffff;
}
.home-instagram-strip__grid{
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(6px, 1.2vw, 10px);
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}
.home-instagram-strip__grid > li{
  min-width: 0;
  display: block;
}
.home-instagram-strip__tile{
  display: block;
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  line-height: 0;
  height: 100%;
  border: 1px solid rgba(20, 19, 17, 0.08);
}
.home-instagram-strip__tile img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  vertical-align: middle;
  transition: transform 0.35s ease, opacity 0.35s ease;
}
.home-instagram-strip__tile:hover img,
.home-instagram-strip__tile:focus-visible img{
  transform: scale(1.04);
  opacity: 0.95;
}
.home-instagram-strip__tile:focus-visible{
  outline: 2px solid var(--moss);
  outline-offset: 2px;
  z-index: 1;
}
@media (max-width: 900px){
  .home-instagram-strip__grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 520px){
  .home-instagram-strip__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.home-social-showcase__foot{
  margin: 0;
  font-family: var(--font-body);
  font-size: clamp(13px, 1.2vw, 15px);
  font-weight: var(--font-body-weight);
  letter-spacing: 0.04em;
  color: rgba(20, 19, 17, 0.62);
}
.home-social-showcase__handle{
  color: #14120f;
  font-weight: 400;
  text-decoration: none;
}
.home-social-showcase__handle:hover{
  text-decoration: underline;
  text-underline-offset: 3px;
}
.home-social-showcase__handle:focus-visible{
  outline: 2px solid var(--moss);
  outline-offset: 3px;
}
.home-social-showcase__hint{
  color: rgba(20, 19, 17, 0.5);
}

.site-footer{
  background: var(--moss);
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding: 56px 0 22px;
  color: rgba(255, 255, 255, 0.95);
}
.footer-grid{
  display: grid;
  gap: 28px 32px;
  align-items: start;
}
.footer-grid--tri{
  /* Equal outer tracks so the center column (icon + CTA + copyright) sits on the visual midpoint */
  grid-template-columns: minmax(0, 1fr) minmax(260px, 300px) minmax(0, 1fr);
  column-gap: clamp(20px, 3vw, 40px);
  align-items: stretch;
}
.footer-bio{
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
  justify-self: start;
  position: relative;
  left: clamp(-36px, -5.5vw, -80px);
}
.footer-bio-text{
  margin: 0;
  max-width: 46ch;
  color: rgba(255, 255, 255, 0.9);
  font-size: 15px;
  line-height: 1.62;
  font-weight: 400;
}
.footer-social{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.footer-social--bio{
  margin-top: 2px;
}
.footer-social-link{
  min-width: 44px;
  min-height: 44px;
  width: auto;
  height: auto;
  padding: 10px;
  box-sizing: border-box;
  border-radius: 0;
  border: none;
  background: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  /* Light gray glyphs on moss (matches reference social row) */
  color: rgba(232, 230, 226, 0.92);
  transition: transform .2s ease, color .2s ease, opacity .2s ease;
}
.footer-social-link .footer-social-icon{
  width: 28px;
  height: 28px;
  display: block;
  flex-shrink: 0;
  fill: currentColor;
}
.footer-social-link .footer-social-icon--stroke{
  fill: none;
}
.footer-social-link .footer-social-icon--stroke [fill="currentColor"]{
  fill: currentColor;
}
.footer-social-link:hover{
  transform: translateY(-2px);
  background: transparent;
  color: #fff;
  opacity: 0.92;
}
.footer-social-link:focus-visible{
  outline: 2px solid rgba(255, 255, 255, 0.85);
  outline-offset: 3px;
}
/* Contact page — social icons in main column (light background; not footer) */
#contact .footer-social-link{
  color: var(--moss);
}
#contact .footer-social-link:hover{
  color: #1a3329;
  opacity: 1;
}
#contact .footer-social-link:focus-visible{
  outline-color: var(--moss);
}
.footer-center{
  display: flex;
  justify-content: center;
  align-items: stretch;
  min-width: 0;
  justify-self: center;
  width: 100%;
}
.footer-brand-panel{
  width: 100%;
  max-width: 300px;
  margin: 0 auto;
  align-self: center;
  background: transparent;
  color: #fff;
  border: none;
  border-radius: 0;
  padding: clamp(12px, 2vw, 20px) 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 12px;
  box-shadow: none;
}
.footer-center-icon-link{
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  line-height: 0;
}
.footer-center-icon{
  width: 72px;
  height: 72px;
  object-fit: contain;
  display: block;
  filter: brightness(0) invert(1);
}
.footer-center-cta{
  position: relative;
  z-index: 2;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-size: clamp(18px, 2.2vw, 24px);
  font-weight: 400;
  color: #fff !important;
  text-decoration: none;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1.25;
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  padding-bottom: 6px;
  transition: opacity 0.2s ease, border-color 0.2s ease;
  text-shadow: none;
}
.footer-center-cta:hover{
  opacity: 0.92;
  border-bottom-color: rgba(255, 255, 255, 0.75);
}
.footer-center-copyright{
  margin: 0;
  font-size: 13px;
  letter-spacing: 0.04em;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.92);
  font-weight: var(--font-body-weight);
}
.footer-nav-groups{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px 24px;
  align-content: start;
  min-width: 0;
  justify-self: end;
  position: relative;
  left: clamp(12px, 2vw, 32px);
}
.footer-col:last-child{
  align-self: start;
  margin-top: 0;
}
.footer-col{
  display: grid;
  gap: 2px;
  align-content: start;
}
.footer-col h3{
  margin: 0 0 10px;
  font-size: clamp(15px, 1.2vw, 18px);
  letter-spacing: 0.1em;
  font-family: "Arome", ui-serif, Georgia, "Times New Roman", Times, serif;
  font-style: normal;
  text-transform: uppercase;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.98);
}
.footer-col a{
  display: inline-block;
  padding: 6px 0;
  color: rgba(255, 255, 255, 0.88);
  font-weight: var(--font-body-weight);
  text-decoration: none;
  font-size: 15px;
}
.footer-col a:hover{
  color: #fff;
  text-decoration: underline;
}
.footer-bottom{
  margin-top: 34px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  color: rgba(255, 255, 255, 0.88);
  font-weight: var(--font-body-weight);
  font-size: 14px;
}
.footer-bottom a{
  color: rgba(255, 255, 255, 0.9);
  text-decoration: none;
}
.footer-bottom a:hover{
  color: #fff;
  text-decoration: underline;
}
@media (max-width: 1020px){
  .footer-grid--tri{
    grid-template-columns: 1fr;
  }
  .footer-bio{
    left: 0;
    justify-self: stretch;
    align-items: center;
    text-align: center;
  }
  .footer-bio-text{
    margin-inline: auto;
    text-align: center;
    max-width: min(46ch, 100%);
  }
  .footer-center{
    order: -1;
  }
  .footer-nav-groups{
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: 720px;
    justify-self: stretch;
    left: 0;
  }
  .footer-nav-groups .footer-col:last-child{
    text-align: center;
    justify-items: center;
  }
  .footer-nav-groups .footer-col:last-child h3{
    text-align: center;
  }
  .footer-nav-groups .footer-col:last-child > a{
    text-align: center;
    justify-self: center;
  }
  .footer-nav-groups .footer-col:last-child .footer-social{
    justify-content: center;
  }
  .footer-col:last-child{
    align-self: start;
    margin-top: 0;
  }
  .footer-brand-panel{
    max-width: 400px;
  }
}
@media (max-width: 640px){
  .footer-nav-groups{
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px clamp(6px, 1.8vw, 12px);
  }
  .footer-col h3{
    font-size: clamp(10px, 2.9vw, 14px);
    letter-spacing: 0.07em;
    margin-bottom: 6px;
  }
  .footer-col a{
    font-size: clamp(10px, 2.6vw, 13px);
    padding: 3px 0;
    line-height: 1.35;
    word-break: break-word;
  }
  /* Long email + social row: keep on one line (scroll if needed on very narrow screens) */
  .footer-col a[href^="mailto:"]{
    display: block;
    width: 100%;
    max-width: 100%;
    white-space: nowrap;
    word-break: normal;
    overflow-wrap: normal;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    font-size: clamp(9px, 2.35vw, 12px);
    letter-spacing: 0.01em;
    text-align: center;
    /* Hide scrollbar gutter/track — was read as a “line” under the address; link still scrolls */
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  .footer-col a[href^="mailto:"]::-webkit-scrollbar{
    display: none;
    height: 0;
  }
  .footer-nav-groups .footer-col .footer-social{
    flex-wrap: nowrap;
    justify-content: center;
    gap: clamp(4px, 1.2vw, 10px);
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
    scrollbar-width: thin;
  }
  .site-footer .footer-social-link{
    flex-shrink: 0;
    padding: 8px 5px;
    font-size: clamp(10px, 2.45vw, 12px);
  }
}
@media (max-width: 760px){
  /* Connect column: left-align heading + email + social (was centered from 1020px tri-grid rules) */
  .footer-nav-groups .footer-col:last-child{
    text-align: left;
    justify-items: start;
  }
  .footer-nav-groups .footer-col:last-child h3{
    text-align: left;
  }
  .footer-nav-groups .footer-col:last-child > a{
    text-align: left;
    justify-self: start;
  }
  .footer-nav-groups .footer-col:last-child .footer-social{
    justify-content: flex-start;
  }
  .footer-nav-groups .footer-col:last-child a[href^="mailto:"]{
    text-align: left;
  }
}

.lightbox{
  border:0;
  padding:0;
  background: rgba(15,17,16,.56);
  width: min(1040px, calc(100% - 28px));
  border-radius: 22px;
}
.lightbox::backdrop{background: rgba(15,17,16,.56)}
.lightbox-inner{
  position:relative;
  padding: 14px;
  display:grid;
  gap: 10px;
}
.lightbox-close{
  position:absolute;
  top: 10px;
  right: 10px;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  border:1px solid rgba(247,241,230,.24);
  background: rgba(20,19,17,.65);
  color: rgba(247,241,230,.96);
  font-family: var(--font-button);
  font-weight: var(--font-button-weight);
  font-size: 24px;
  cursor:pointer;
}
.lightbox img{
  width: 100%;
  max-height: min(72vh, 720px);
  object-fit: contain;
  background: rgba(15,17,16,.22);
  border-radius: 18px;
}
.lightbox-caption{
  margin: 0;
  color: rgba(247,241,230,.92);
  font-weight: var(--font-body-weight);
  letter-spacing:.01em;
}

@media (max-width: 980px){
  .two-col{grid-template-columns: 1fr; gap: 18px}
  .about-media{min-height: 340px}
  .media-frame img{height: 340px}
  .media-frame.small{right: 0}
  .service-horiz-acc{
    flex-direction: column;
    min-height: auto;
    max-height: none;
  }
  .service-horiz-tabs--left{order: 1}
  .service-horiz-tabs--right{order: 2}
  .service-horiz-viewport{order: 3}
  .service-horiz-tabs--left,
  .service-horiz-tabs--right{
    flex-direction: column;
    width: 100%;
  }
  .service-horiz-tab{
    flex: none;
    width: 100%;
    min-height: 58px;
    border-left: 0;
    border-bottom: 1px solid rgba(255,255,255,.12);
    justify-content: flex-start;
    padding: 16px 18px;
    font-size: clamp(18px, 4.2vw, 24px);
    letter-spacing: .06em;
  }
  .home-services-horiz__acc .service-horiz-tab{
    flex: none;
    width: 100%;
    font-size: clamp(19px, 4.4vw, 26px);
  }
  .service-horiz-tabs--left .service-horiz-tab:first-child,
  .service-horiz-tabs--right .service-horiz-tab:first-child{
    border-top: 0;
  }
  .service-horiz-tab-text{
    transform: none;
    white-space: normal;
    text-align: left;
  }
  .service-horiz-viewport{
    max-width: none;
    width: 100%;
    flex: none;
    aspect-ratio: 1024 / 500;
    min-height: 0;
    max-height: none;
  }
  /* Home — between desktop and phone: slightly taller image band */
  .home-services-horiz .service-horiz-viewport{
    aspect-ratio: 16 / 13;
    max-height: min(72vh, 720px);
  }
  /* Home Services — stacked layout: larger overlay headlines */
  .home-services-horiz__copy .service-horiz-kicker{
    font-size: clamp(28px, 5.5vw, 38px);
    line-height: 1.12;
  }
  .package-grid{grid-template-columns: 1fr}
  .package-grid.package-grid--quad{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .masonry{grid-template-columns: repeat(2, minmax(0,1fr))}
  .tile img{height: 210px}
  .cta-panel{grid-template-columns: 1fr}
}

@media (max-width: 760px){
  /* Solid nav bar on small screens (no frosted / translucent strip) */
  .site-header{
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background: #f7f1e6;
  }
  .site-header.is-elevated{
    background: #f7f1e6;
  }
  body:not(.home-nav-fixed-bottom) .site-header,
  body:not(.home-nav-fixed-bottom) .site-header.is-elevated{
    background: #1a3329;
  }
  body.page-service-branding .site-header,
  body.page-service-website .site-header,
  body.page-service-social .site-header{
    background: #12100e;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  body.page-service-branding .site-header.is-elevated,
  body.page-service-website .site-header.is-elevated,
  body.page-service-social .site-header.is-elevated{
    background: #0e0c0a;
  }
  body.page-contact .site-header{
    background: #1a3329;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  body.page-contact .site-header.is-elevated{
    background: #162c23;
  }
  /* Home — services strip: desktop ratio is very wide; on phones the panel was ~190px tall and felt clipped */
  .home-services-horiz .service-horiz-viewport{
    aspect-ratio: 3 / 4;
    min-height: max(52vh, 400px);
    max-height: none;
  }
  .home-services-horiz .service-horiz-media--bottom-quarter{
    background-size: auto 185%;
    background-position: center 82%;
  }
  .header-inner{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
  }
  .brand{
    grid-column: unset;
    justify-self: unset;
    order: 1;
    flex: 0 0 auto;
  }
  .header-end{
    grid-column: unset;
    justify-self: unset;
    order: 2;
    flex: 1 1 auto;
    justify-content: center;
    gap: 10px;
    min-width: 0;
  }
  .header-discovery{
    font-size: clamp(11px, 3.1vw, 14px);
    font-weight: 400;
    white-space: normal;
    text-align: center;
    max-width: min(52vw, 220px);
    line-height: 1.2;
    min-height: auto;
    padding: 4px 4px 6px;
    margin-inline: auto;
    border-bottom-width: 1px;
  }
  .page-service-branding .header-discovery,
  .page-service-website .header-discovery,
  .page-service-social .header-discovery{
    max-width: min(94vw, 360px);
    padding: 12px 14px;
    min-height: 46px;
    font-size: clamp(10px, 2.9vw, 12px);
    font-weight: 600;
    border: 1px solid rgba(20, 19, 17, 0.22);
    border-bottom: 1px solid rgba(20, 19, 17, 0.22);
    background: #e9dfd2;
    color: var(--ink) !important;
  }
  .header-discovery__label--desktop{
    display: none;
  }
  .header-discovery__label--mobile{
    display: inline;
  }
  .nav-toggle{
    display:inline-flex;
    order: 3;
    flex: 0 0 auto;
  }
  .site-nav{
    grid-column: unset;
    justify-self: unset;
    position:absolute;
    right: 24px;
    top: 68px;
    padding: 10px;
    border-radius: 0;
    border:1px solid rgba(20,19,17,.10);
    background: #f7f1e6;
    flex-direction: column;
    align-items: stretch;
    width: min(320px, calc(100% - 48px));
    box-shadow: none;
    transform-origin: top right;
    transform: scale(.98);
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease, transform .18s ease;
  }
  body:not(.home-nav-fixed-bottom) .site-nav{
    border-color: rgba(255, 255, 255, 0.22);
    background: #1a3329;
  }
  .site-nav.is-open{
    opacity:1;
    transform: scale(1);
    pointer-events:auto;
  }
  body.home-nav-fixed-bottom .site-nav{
    top: auto;
    bottom: calc(100% + 8px);
    transform-origin: bottom right;
  }
  body.home-nav-fixed-bottom .site-header.home-header--pinned-top .site-nav{
    top: 68px;
    bottom: auto;
    transform-origin: top right;
  }
  .site-nav .nav-dropdown{
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }
  .nav-dropdown-flyout{
    position: static;
    transform: none;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    min-width: 0;
    width: 100%;
    margin: 4px 0 0 8px;
    padding: 4px 0 8px 12px;
    border-left: 1px solid rgba(20, 19, 17, 0.12);
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
  }
  body:not(.home-nav-fixed-bottom) .nav-dropdown-flyout{
    border-left-color: rgba(255, 255, 255, 0.28);
  }
  /* Homepage hides the Services flyout on desktop only; mobile sheet must list all three service pages */
  body.home-nav-fixed-bottom .nav-dropdown-flyout{
    display: flex !important;
    flex-direction: column;
    gap: 0;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  .nav-dropdown-link{
    white-space: normal;
    text-align: left;
    padding: 10px 12px;
  }
  .nav-link{padding: 14px 14px}
  /* Service detail pages — mobile nav panel on moss (dropdown links stay legible) */
  .page-service-branding .site-nav,
  .page-service-website .site-nav,
  .page-service-social .site-nav{
    background: #1a3329;
    border-color: rgba(255, 255, 255, 0.16);
  }
  .page-service-branding .nav-dropdown-flyout,
  .page-service-website .nav-dropdown-flyout,
  .page-service-social .nav-dropdown-flyout{
    border-left-color: rgba(255, 255, 255, 0.22);
  }
  .page-service-branding .nav-dropdown-link,
  .page-service-website .nav-dropdown-link,
  .page-service-social .nav-dropdown-link{
    color: rgba(255, 255, 255, 0.88);
  }
  .page-service-branding .nav-dropdown-link:hover,
  .page-service-website .nav-dropdown-link:hover,
  .page-service-social .nav-dropdown-link:hover{
    color: #fff;
    border-bottom-color: rgba(255, 255, 255, 0.45);
  }
  .page-service-branding .nav-dropdown-link[aria-current="page"],
  .page-service-website .nav-dropdown-link[aria-current="page"],
  .page-service-social .nav-dropdown-link[aria-current="page"]{
    color: #fff;
    border-bottom-color: rgba(255, 255, 255, 0.65);
  }
  /* Home hero: full viewport to bottom bar (phones use top-pinned header — no bottom dock strip) */
  body.home-nav-fixed-bottom .hero-band{
    height: calc(100vh - env(safe-area-inset-bottom, 0px));
    min-height: calc(100vh - env(safe-area-inset-bottom, 0px));
  }
  body.home-nav-fixed-bottom .hero-inner{
    justify-content: center;
    z-index: 5;
    padding-block: clamp(16px, 4dvh, 40px);
  }
  body.home-nav-fixed-bottom .hero-inner .container{
    display: flex;
    justify-content: center;
    width: min(var(--container), calc(100% - 28px));
  }
  body.home-nav-fixed-bottom .hero-card{
    margin-inline: auto;
    text-align: center;
    width: min(34rem, 100%);
  }
  body.home-nav-fixed-bottom .hero-card .hero-home-wordmark{
    margin-inline: auto;
    display: block;
    width: fit-content;
    max-width: 100%;
  }
  body.home-nav-fixed-bottom .hero-card .hero-home-wordmark img{
    object-position: center;
    margin-inline: auto;
  }
  body.home-nav-fixed-bottom .hero-card .hero-subtitle{
    white-space: normal;
  }
  /* Bracketed vertical hero copy — too busy on narrow viewports (already aria-hidden) */
  .hero-side-stats{
    display: none;
  }
  .hero-card{margin: 0}
  .hero-title{
    font-size: calc(clamp(26px, 5.2vw, 40px) + var(--heading-size-add));
    letter-spacing: -0.02em;
    line-height: 1.12;
  }
  /* Home Services — phones: bump overlay headline + section title */
  .home-services-horiz__copy .service-horiz-kicker{
    font-size: clamp(30px, 6.5vw, 38px);
    line-height: 1.1;
  }
  .home-services-horiz__title{
    font-size: calc(clamp(56px, 13vw, 92px) + var(--heading-size-add));
    line-height: 0.97;
  }
  .field-row{grid-template-columns: 1fr}
  .masonry{grid-template-columns: 1fr}
  .feature-copy{margin-left: 14px}
}

@supports (height: 100dvh){
  @media (max-width: 760px){
    body.home-nav-fixed-bottom .hero-band{
      height: calc(100dvh - env(safe-area-inset-bottom, 0px));
      min-height: calc(100dvh - env(safe-area-inset-bottom, 0px));
    }
  }
}

/* Home — full-screen intro (index only): thin green lines + centered Noble mark */
body.home-splash-active{
  overflow: hidden;
}
.home-splash{
  position: fixed;
  inset: 0;
  z-index: 10001;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--paper);
  transition: opacity 0.45s ease;
  /* Lines stop short of center so they don’t meet on the logo (half icon + gap) */
  --splash-center-clearance: clamp(44px, 11vw, 58px);
}
.home-splash.home-splash--done{
  opacity: 0;
  pointer-events: none;
}
.home-splash__skip{
  position: absolute;
  top: clamp(16px, 3vw, 28px);
  right: clamp(16px, 3vw, 28px);
  z-index: 3;
  margin: 0;
  padding: 10px 14px;
  font: inherit;
  font-size: 13px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--moss);
  background: rgba(247, 241, 230, 0.92);
  border: 1px solid rgba(26, 51, 41, 0.25);
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
}
.home-splash__skip:hover{
  background: rgba(26, 51, 41, 0.08);
  color: #1a3329;
}
.home-splash__skip:focus-visible{
  outline: 2px solid var(--moss);
  outline-offset: 3px;
}
.home-splash__lines{
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
}
.home-splash__line{
  position: absolute;
  left: 50%;
  width: 1px;
  margin-left: -0.5px;
  background: var(--moss);
  will-change: height;
}
.home-splash__line--top{
  top: 0;
  height: 0;
  transform-origin: top center;
  animation: home-splash-line-down 1.25s cubic-bezier(0.45, 0, 0.2, 1) forwards;
}
.home-splash__line--bottom{
  bottom: 0;
  height: 0;
  transform-origin: bottom center;
  animation: home-splash-line-up 1.25s cubic-bezier(0.45, 0, 0.2, 1) forwards;
}
@keyframes home-splash-line-down{
  from{
    height: 0;
  }
  to{
    height: calc(50vh - var(--splash-center-clearance));
  }
}
@keyframes home-splash-line-up{
  from{
    height: 0;
  }
  to{
    height: calc(50vh - var(--splash-center-clearance));
  }
}
.home-splash__mark{
  position: relative;
  z-index: 2;
  opacity: 0;
  animation: home-splash-icon-in 0.85s ease 0.75s forwards;
}
.home-splash__mark img{
  display: block;
  width: clamp(44px, 7.5vw, 64px);
  height: auto;
  margin: 0 auto;
}
@keyframes home-splash-icon-in{
  from{
    opacity: 0;
    transform: scale(0.88);
  }
  to{
    opacity: 1;
    transform: scale(1);
  }
}

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