/* Sister-site layout: the parent site's editorial type, large photography,
   rounded cards, split biography and expanding method rails. Brand tokens
   continue to come from healing-forward.css. Motion lives in ../css/. */
:root { --header-height: 84px; }
.wrap { width: min(1240px,calc(100% - 64px)); }
.section { padding-block: clamp(64px,7vw,100px); }
.brand { display: flex; flex-direction: column; gap: 5px; }
.brand .brand-name { color: var(--plum-dark); font: 400 26px/1.1 var(--serif); }
.brand-name em { color: var(--plum); font-weight: 300; }
.brand .brand-parent { font: 500 8px/1.5 var(--sans); letter-spacing: .15em; text-transform: uppercase; color: var(--muted); }
.header-inner { width: min(1440px,calc(100% - 56px)); gap: 20px; }
.navigation > a { font-size: 11px; }
.navigation { gap: clamp(12px,1.5vw,23px); }
.navigation > a::after { width: 100%; transform: scaleX(0); transform-origin: left; transition: transform .3s var(--motion-ease); }
.navigation > a:hover::after { transform: scaleX(1); }
.hero { position: relative; isolation: isolate; min-height: min(780px,calc(100svh - var(--header-height))); overflow: hidden; display: flex; align-items: center; padding-block: 70px; }
.hero-banner { position: absolute; inset: 0 0 0 42%; max-width: none; overflow: hidden; border-radius: 120px 0 0 0; z-index: -1; }
.hero-banner img { width: 100%; height: 100%; max-width: none; aspect-ratio: auto; object-fit: cover; object-position: 100% 50%; }
.hero-banner::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,var(--ivory) 0%,rgba(247,241,231,.75) 12%,rgba(247,241,231,0) 42%); }
.hero-intro { display: block; border: 0; padding-block: 0; }
.hero-intro > div:first-child, .hero-copy { max-width: 585px; }
.hero-intro .eyebrow { font-size: 9px; letter-spacing: .15em; max-width: 52ch; }
.eyebrow { display: flex; align-items: center; gap: 13px; font-size: 10px; letter-spacing: .21em; }
.eyebrow::before { content: ''; flex: 0 0 27px; height: 1px; background: currentColor; }
h1 { font-size: clamp(40px,4.6vw,67px); line-height: 1.04; letter-spacing: .005em; text-transform: uppercase; }
h1 em { display: block; font-size: .76em; text-transform: none; font-weight: 300; line-height: 1.16; margin-top: 9px; }
.hero h1 br { display: none; }
.hero-copy { margin-top: 28px; }
.hero-copy .lead { font: 400 23px/1.35 var(--serif); max-width: 29ch; }
.hero-copy > p:not(.lead) { max-width: 42ch; font-size: 15px; line-height: 1.75; }
.hero-copy .actions { max-width: 510px; gap: 12px; }
.hero-copy .text-link { background: var(--ivory); padding-inline: 6px; }
.button { text-transform: uppercase; letter-spacing: .065em; font-size: 11px; min-height: 46px; padding-inline: 22px; }
h2 { font-size: clamp(30px,3.4vw,48px); line-height: 1.08; letter-spacing: .005em; text-transform: uppercase; }
h2 em { display: block; font-size: .82em; line-height: 1.18; text-transform: none; margin-top: 6px; }
.services { background: var(--paper); }
.services-layout { display: block; }
.services .section-intro { position: static; display: grid; grid-template-columns: 1.1fr 1fr; column-gap: 90px; margin-bottom: 42px; }
.services .section-intro .eyebrow { grid-column: 1/-1; }
.services .section-intro > p:not(.eyebrow) { margin-top: 0; max-width: 45ch; align-self: center; }
.services .section-intro .text-link { grid-column: 2; }
.service-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.service, .service:first-child, .service:last-child { padding: 0; border: 1px solid var(--line); display: flex; flex-direction: column; gap: 0; border-radius: 24px; overflow: hidden; background: var(--ivory); box-shadow: 0 15px 36px rgba(53,36,63,.06); min-width: 0; }
.service img { width: 100%; height: 260px; object-fit: cover; object-position: center 25%; border-radius: 0; }
.service > div { padding: 28px; background: var(--ivory); border-radius: 22px 22px 0 0; margin-top: -24px; position: relative; z-index: 1; flex: 1; }
.service h3 { font-size: 27px; line-height: 1.15; margin-bottom: 16px; }
.service-number { font-size: 9px; letter-spacing: .15em; margin-bottom: 17px; }
.service p { font-size: 14px; }
.service .service-topics { font-size: 11px; line-height: 1.8; padding-top: 16px; border-top: 1px solid var(--line); margin-top: 20px; }
#organizational-consulting { grid-column: span 2; display: grid; grid-template-columns: 1fr 1fr; }
#organizational-consulting img { width: 100%; height: 100%; min-height: 340px; object-position: center; }
#organizational-consulting > div { margin: 0; padding: 35px 28px; border-radius: 0; }
.approach .section-intro { max-width: 100% !important; display: grid; grid-template-columns: 1.1fr 1fr; column-gap: 90px; }
.approach .section-intro > .eyebrow { grid-column: 1/-1; }
.approach .section-intro h2 { grid-row: 2/5; }
.approach .section-intro p:not(.eyebrow) { font-size: 14px; margin: 0 0 15px; }
.approach .section-intro .text-link { grid-column: 2; }
#approach .fwd-acc { --pacc-tab: clamp(58px,5.6vw,76px); --pacc-head: 82px; height: 530px; gap: 10px; margin-top: 40px; }
#approach .pacc-panel { box-shadow: 0 8px 22px rgba(53,36,63,.09); border-color: var(--lavender-line); background: var(--lavender); border-radius: 21px; }
#approach .pacc-panel.active { background: var(--paper); box-shadow: 0 16px 40px rgba(53,36,63,.12); border-color: var(--plum); }
#approach .pacc-badge { width: 43px; height: 43px; flex-basis: 43px; background: var(--plum); font-size: 23px; box-shadow: none; }
#approach .pacc-vword { font-size: clamp(22px,2.3vw,31px); color: var(--plum-dark); }
#approach .pacc-expanded { width: calc(100cqw - 6 * (var(--pacc-tab) + 10px) - var(--pacc-tab)); padding: 16px 16px 22px 0; }
#approach .pacc-img { background: var(--paper); min-height: 210px; }
#approach .pacc-img .pacc-img-fill { display: none; }
#approach .pacc-img img:not(.pacc-img-fill) { object-fit: cover; object-position: center 30%; filter: none; }
#approach .pacc-body { padding-top: 24px; }
#approach .pacc-body h3 { color: var(--plum-dark); font-size: clamp(27px,2.6vw,36px); }
#approach .pacc-body p { color: var(--muted); font-size: 14px; line-height: 1.65; }
#approach .pacc-step { color: var(--plum); font-size: 9px; }
#approach .pacc-hint { font-size: 9px; color: var(--plum); letter-spacing: .17em; }
.consultations .section-heading { max-width: 790px; }
.consultation-steps { gap: 24px; }
.consultation-steps li { background: var(--ivory); border: 1px solid var(--line); padding: 30px; border-radius: 22px; }
.consultation-steps h3 { font-size: 25px; }
.consultation-steps p { font-size: 14px; }
.about { background: var(--ivory); }
.about-layout { gap: 90px; grid-template-columns: .9fr 1.1fr; }
.founder-photo > img { max-height: none; aspect-ratio: 1; height: auto; object-fit: contain; object-position: center; border-radius: 26px; box-shadow: 0 24px 64px rgba(53,36,63,.13); }
.about-copy .lead { font: 400 23px/1.45 var(--serif); }
.about-copy > p:not(.eyebrow):not(.lead) { font-size: 15px; }
.expertise span { background: var(--paper); }
.faq-layout { gap: 90px; }
.closing .wrap { padding-block: 10px; }
.closing h2 { font-size: clamp(38px,4.6vw,64px); }
.closing-actions { width: 280px; flex-basis: 280px; }
.site-footer { padding-top: 65px; }
.footer-grid { grid-template-columns: 1.5fr 1fr 1fr; }
.footer-brand { display: flex; align-items: center; gap: 25px; }
.footer-brand img { width: 90px; margin: 0; }
.footer-brand p { max-width: 20ch; }
@media (max-width: 1100px) {
  .hero-intro > div:first-child, .hero-copy { max-width: 52%; }
  .hero-copy .actions { max-width: 390px; }
  .hero-copy .actions > .text-link { flex-basis: 100%; }
  .header-inner { width: calc(100% - 40px); }
  .services .section-intro, .approach .section-intro { column-gap: 40px; }
}
@media (max-width: 1060px) {
  :root { --header-height: 78px; }
  .navigation > a { padding: 12px 8px; font-size: 12px; }
  .navigation > .parent-link { padding-left: 8px; }
  .js .navigation.is-open { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 18px; }
  .navigation > .button { grid-column: 1/-1; }
  .service-list { gap: 18px; }
  .service > div { padding: 23px; }
  .service h3 { font-size: 23px; }
  .about-layout { gap: 40px; }
}
@media (max-width: 1023px) {
  #approach .fwd-acc { height: auto; gap: 12px; --pacc-head: 76px; }
  #approach .pacc-expanded { width: auto; padding: 0; }
  #approach .pacc-body { padding: 24px; }
  #approach .pacc-img { min-height: 0; aspect-ratio: 16/9; margin-inline: 22px; }
  #approach .pacc-vword { font-size: 22px; }
  .service-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #organizational-consulting { grid-column: auto; display: flex; }
  #organizational-consulting img { height: 260px; min-height: 0; }
  #organizational-consulting > div { padding: 23px; margin-top: -24px; border-radius: 22px 22px 0 0; }
  .consultation-steps { gap: 16px; }
  .consultation-steps li { padding: 22px; }
}
@media (max-width: 740px) {
  .wrap { width: calc(100% - 40px); }
  .hero { display: flex; flex-direction: column; padding: 0 0 42px; min-height: 0; }
  .hero-banner { position: relative; inset: auto; width: 100%; height: auto; border-radius: 0; z-index: auto; order: -1; }
  .hero-banner img { width: 100%; height: auto; aspect-ratio: 3/1; object-fit: contain; }
  .hero-banner::after { display: none; }
  .hero-intro { padding-top: 32px; }
  .hero-intro > div:first-child, .hero-copy { max-width: none; }
  .hero-intro .eyebrow { font-size: 8px; letter-spacing: .11em; }
  h1 { font-size: clamp(36px,8.5vw,56px); }
  h1 em { font-size: .8em; }
  .hero-copy { margin-top: 24px; }
  .hero-copy .lead { font-size: 22px; }
  .hero-copy > p:not(.lead) { max-width: none; font-size: 14px; }
  .hero-copy .actions { max-width: none; }
  .hero-copy .actions .button { font-size: 10px; min-height: 46px; flex: 1 1 140px; }
  .hero-copy .actions > .text-link { font-size: 12px; padding-left: 0; }
  .brand .brand-name { font-size: 24px; }
  .brand .brand-parent { font-size: 7px; letter-spacing: .1em; }
  .header-inner { padding-block: 12px; }
  .services .section-intro, .approach .section-intro { display: block; }
  .services .section-intro > p:not(.eyebrow) { margin-top: 22px; }
  .approach .section-intro p:not(.eyebrow) { margin-top: 20px; }
  .service-list { grid-template-columns: 1fr; gap: 24px; }
  .service img, #organizational-consulting img { height: 285px; }
  .service h3 { font-size: 28px; }
  .service > div { padding: 28px; }
  .service p { font-size: 14px; }
  .consultation-steps { display: grid; grid-template-columns: 1fr; gap: 18px; }
  .consultation-steps li, .consultation-steps li:last-child { padding: 28px; }
  .section-heading > p:last-child { font-size: 15px; }
  .founder-photo { max-width: 480px; }
  .about-copy > .lead { font-size: 23px; }
  .closing-actions { width: 100%; }
  .closing .eyebrow { font-size: 8px; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1/-1; }
  #approach .pacc-collapsed { padding-left: 78px; }
  #approach .pacc-head { width: 78px; }
  #approach .pacc-vword { font-size: 21px; }
}
@media (max-width: 360px) {
  .wrap { width: calc(100% - 32px); }
  .header-inner { width: calc(100% - 32px); }
  .brand .brand-name { font-size: 21px; }
  .brand .brand-parent { font-size: 6px; }
  .hero-intro .eyebrow::before { flex-basis: 16px; }
}

/* ===== CLEANUP (Kai, 2026-10-20, at Jacques's direction) =====
   1) Hero: the whole banner shown, framed — the split/cropped hero is undone.
   2) Header: Black Gurl Moves' hamburger + right slide-in drawer system.
   3) Type sizes: Black Gurl Moves' scale (body 17px, UI 14px, brand 24px,
      hero clamp(32px,3.4vw+20px,68px), section clamp(28px,1.6vw+22px,44px)).
   4) Forward panel photos: shown whole over a blurred fill (parent treatment),
      no zoom crop. */

/* 1) Hero — whole banner, headline below it */
.hero { display: block; min-height: 0; overflow: visible; padding-block: 0; }
.hero-banner { position: relative; inset: auto; z-index: auto; max-width: 1600px; margin: 22px auto 0; border-radius: 12px; overflow: hidden; }
.hero-banner img { height: auto; object-fit: contain; object-position: center; }
.hero-banner::after { display: none; }
.hero-intro { display: grid; grid-template-columns: 1.1fr 1fr; gap: 64px; padding-block: 52px 66px; border-bottom: 1px solid var(--line); border-top: 0; }
.hero-intro > div:first-child, .hero-copy { max-width: none; }
.hero-copy { margin-top: 0; }
@media (max-width: 1023px) { .hero-intro { gap: 35px; } }
@media (max-width: 740px) {
  .hero-banner { width: calc(100% - 40px); margin-top: 16px; }
  .hero-intro { display: block; padding-block: 32px 45px; }
  .hero-copy { margin-top: 28px; }
}

/* 2) Header — BGM bar + hamburger drawer */
.nav-quick { display: flex; gap: clamp(18px,1.6vw,28px); align-items: center; margin-left: auto; }
.nav-quick a.nl { font-size: 14px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; color: var(--plum-dark); padding: 6px 0; white-space: nowrap; }
.burger { display: block; background: none; border: none; cursor: pointer; width: 44px; height: 44px; padding: 9px; margin-right: -9px; position: relative; z-index: 2; }
.burger span { display: block; width: 26px; height: 2px; background: var(--plum-dark); margin: 5px 0; transition: transform .3s var(--fx-ease, ease), opacity .3s; }
.burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.burger:focus-visible { outline: 2px solid var(--plum); outline-offset: 4px; border-radius: 4px; }
.nav-links { position: fixed; top: 0; right: 0; z-index: 90; width: min(84vw,340px); height: 100vh; height: 100dvh; overflow-y: auto; background: var(--ivory); display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 4px; padding: 100px 36px 44px; box-shadow: -20px 0 60px rgba(53,36,63,.16); transform: translateX(100%); visibility: hidden; transition: transform .4s var(--fx-ease, ease), visibility 0s linear .4s; }
.nav-links.open { transform: none; visibility: visible; transition: transform .4s var(--fx-ease, ease), visibility 0s; }
.nav-links a.nl { font-size: 16px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; color: var(--plum-dark); padding: 9px 0; width: 100%; }
.nav-links a.nl:hover { color: var(--plum); }
.nav-links .button { margin-top: 18px; }
.drawer-banner { width: 100%; max-width: 240px; height: auto; margin: 0 0 16px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
@media (max-width: 680px) { .nav-quick a.nl { display: none; } }

/* 3) Type — Black Gurl Moves' scale */
.brand .brand-name { font-size: 24px; }
h1 { font-size: clamp(32px,3.4vw + 20px,68px); }
h2 { font-size: clamp(28px,1.6vw + 22px,44px); }
.button { font-size: 14px; }
.eyebrow, .hero-intro .eyebrow { font-size: 12px; }
.hero-copy > p:not(.lead) { font-size: 17px; line-height: 1.7; }
.services .section-intro > p:not(.eyebrow) { font-size: 17px; line-height: 1.7; }
.approach .section-intro p:not(.eyebrow) { font-size: 17px; line-height: 1.7; }
.about-copy > p:not(.eyebrow):not(.lead) { font-size: 17px; }
.service p { font-size: 16px; }
#approach .pacc-body p { font-size: 16px; }
.consultation-steps p { font-size: 16px; }
@media (max-width: 680px) { .brand .brand-name { font-size: 20px; } }

/* 4) Panel photos — whole photo over blurred fill, like the parent's panels */
#approach .pacc-img .pacc-img-fill { display: block; }
#approach .pacc-img img:not(.pacc-img-fill) { object-fit: contain; object-position: 50% 50%; filter: drop-shadow(0 12px 22px rgba(10,8,6,.45)); }

/* ===== FIX ROUND 2 (Kai, 2026-10-20, at Jacques's direction) =====
   Panel photos: the blur fill is GONE. Each photo sits in a tall
   portrait-shaped frame that matches the pictures' own shape, fills
   it completely, and stays clear — cropped by almost nothing.
   Service photos are now wide compositions made for their frames. */
#approach .pacc-img .pacc-img-fill { display: none !important; }
#approach .pacc-img img:not(.pacc-img-fill) { object-fit: cover; object-position: 50% 30%; filter: none; }
@media (min-width: 1024px) {
  #approach .pacc-expanded { flex-direction: row; gap: 28px; align-items: flex-start; }
  #approach .pacc-img { flex: 0 0 min(290px,42%); aspect-ratio: 2/3; height: auto; min-height: 0; }
  #approach .pacc-body { flex: 1 1 0; min-width: 0; padding-top: 6px; }
}
@media (max-width: 1023px) {
  #approach .pacc-img { aspect-ratio: 3/4; width: min(400px,calc(100% - 44px)); margin-inline: auto; }
}

/* ===== TYPOGRAPHY — Manrope + DM Sans (Jacques's approved preview, 2026-10-20) =====
   Headings: Manrope SemiBold 600, sentence case, upright — no decorative
   italics; emphasized words stay upright in deep plum. Body, navigation,
   buttons and labels: DM Sans (400 text, 500-600 emphasis). Slightly
   tight letter spacing on large headings; small section labels stay
   uppercase. Colors unchanged from the approved palette. */
h1, h2, h3 { font-family: "Manrope", sans-serif; font-weight: 600; letter-spacing: -0.01em; color: #3f1d4b; text-wrap: balance; }
h1 { font-size: clamp(44px, 3.4vw + 14px, 54px); line-height: 1.1; text-transform: none; }
h2 { font-size: clamp(30px, 2.4vw, 34px); line-height: 1.16; text-transform: none; }
.closing h2 { font-size: clamp(30px, 2.4vw, 34px); }
h3 { font-size: clamp(22px, 1.8vw, 25px); line-height: 1.22; }
h1 em, h2 em, h3 em { font-style: normal; font-weight: 600; color: #3f1d4b; }
.hero-copy .lead, .about-copy .lead { font-family: "DM Sans", sans-serif; font-style: normal; font-weight: 400; font-size: clamp(18px, 1.6vw, 21px); }
.hero-copy > p:not(.lead), .services .section-intro > p:not(.eyebrow),
.approach .section-intro p:not(.eyebrow), .about-copy > p:not(.eyebrow):not(.lead) { font-size: 17px; line-height: 1.6; }
.service p, #approach .pacc-body p, .consultation-steps p { font-size: 17px; line-height: 1.6; }
#approach .pacc-body h3 { font-size: clamp(22px, 1.8vw, 25px); }
.button { font-size: 14px; font-weight: 600; letter-spacing: .05em; }
.nav-quick a.nl { font-size: 14px; font-weight: 600; }
.nav-links a.nl { font-size: 14px; font-weight: 600; }
.brand .brand-name { font-family: "Manrope", sans-serif; font-weight: 600; }
.eyebrow { letter-spacing: .12em; }
.eyebrow::before { background: #b77ac6; }
.services { background: #eadcf0; }
.about { background: #eadcf0; }
.nav-links a.nl:hover { color: #b77ac6; }
.expertise span { border-color: #8f9b82; }
@media (max-width: 740px) {
  h1 { font-size: clamp(36px, 9vw, 40px); }
  h2 { font-size: clamp(26px, 6.5vw, 30px); }
  .closing h2 { font-size: clamp(26px, 6.5vw, 30px); }
  h3 { font-size: clamp(20px, 5.5vw, 24px); }
  #approach .pacc-body h3 { font-size: clamp(20px, 5.5vw, 24px); }
}

/* ===== FIX ROUND 3 (Kai, 2026-10-20, at Jacques's direction) =====
   Panel photos are LANDSCAPE: the open panel shows a wide photo
   across the top with the step text below it, full width. The new
   photos are composed wide for this frame — no blur, no crop. */
#approach .pacc-expanded { flex-direction: column; gap: 0; align-items: stretch; }
#approach .pacc-img { flex: 0 0 auto; width: auto; aspect-ratio: 16/9; height: auto; min-height: 0; }
#approach .pacc-body { flex: 0 1 auto; min-width: 0; padding-top: 22px; }
@media (max-width: 1023px) {
  #approach .pacc-img { aspect-ratio: 16/9; width: auto; margin-inline: clamp(14px,3vw,22px); }
}

/* ===== FIX ROUND 4 (Kai, 2026-10-20, at Jacques's direction) =====
   The Consulting card matches the other four: photo ABOVE the text,
   same size, same shape — no more wide sideways card. */
#organizational-consulting { grid-column: auto; display: flex; flex-direction: column; }
#organizational-consulting img { width: 100%; height: 260px; min-height: 0; object-fit: cover; object-position: center 25%; }
#organizational-consulting > div { padding: 28px; margin-top: -24px; border-radius: 22px 22px 0 0; position: relative; z-index: 1; flex: 1; background: var(--ivory); }
@media (max-width: 740px) { #organizational-consulting img { height: 285px; } }

/* ===== FIX ROUND 6 (Kai, 2026-10-20, at Jacques's direction) =====
   The Forward Method panels swap to DARK PURPLE; the section's light
   background stays exactly as it is. Panel text turns warm ivory,
   the step kickers and the open tab's word go lavender, and the
   letter badges flip to lavender with a plum letter so they stay
   visible on the dark panels. */
#approach .pacc-panel { background: #3f1d4b; border-color: rgba(183, 122, 198, .5); }
#approach .pacc-vword { color: #fff9f2; }
#approach .pacc-panel[aria-selected="true"] .pacc-vword { color: #b77ac6; }
#approach .pacc-badge { background: #b77ac6; color: #3f1d4b; }
#approach .pacc-body, #approach .pacc-body p { color: #fff9f2; }
#approach .pacc-body h3 { color: #fff9f2; }
#approach .pacc-body .pacc-step { color: #b77ac6; }

/* ===== FIX ROUND 7 (Kai, 2026-10-20, at Jacques's direction) =====
   The F-O-R-W-A-R-D letters on the panel badges are white. */
#approach .pacc-badge { color: #ffffff; }