/* Richer Support — site v5 · v8 SEO build
   Inherits the v4 system untouched; adds components for the new
   service + location pages and the FAQ accordion. */
@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&display=swap");
@import url("site-v4.css");
@import url("site-chrome-v5.css");

/* ——— Playfair Display for all display/serif roles ——— */
:root {
  --display: 'Playfair Display', serif;
  --serif:   'Playfair Display', serif;
}

/* ————— FAQ accordion (answers open by default) ————— */
.faq-acc { border-bottom: 1px solid var(--hair); }
.faq-acc:first-of-type { border-top: 1px solid var(--hair); }
.faq-acc summary {
  font-family: var(--serif); font-size: 27px; font-weight: 500; color: var(--ink);
  padding: 26px 0; cursor: pointer; list-style: none;
  display: flex; justify-content: space-between; align-items: baseline; gap: 24px;
  text-wrap: pretty;
}
.faq-acc summary::-webkit-details-marker { display: none; }
.faq-acc summary::after {
  content: "+"; font-family: var(--display); font-size: 25px; color: var(--sage-deep);
  flex-shrink: 0; line-height: 1;
}
.faq-acc[open] summary::after { content: "−"; }
.faq-acc summary:hover { color: var(--sage-deep); }
.faq-acc .faq-a {
  margin: 0; padding: 0 0 30px; max-width: 64ch;
  color: var(--ink-soft); font-size: 18.5px; line-height: 1.8; font-family: var(--body);
}

.mini-faq .faq-acc summary { font-size: 23px; padding: 21px 0; }
.mini-faq .faq-acc .faq-a { font-size: 18px; padding-bottom: 26px; }

/* blue CTA button — logo sage deep */
.btn-blue { background: #5F7370; color: #F7F4EB; border-color: transparent; }
.btn-blue:hover { background: #4A5C59; }

/* compact nav links to prevent wrapping */
.nav-links a, .nav-dd-btn { font-size: 14px !important; letter-spacing: 0.2px !important; white-space: nowrap !important; font-weight: 400 !important; }
.nav-dd-btn { white-space: nowrap !important; }
.nav-inner { gap: 22px !important; align-items: center !important; }
.nav-cta { padding: 9px 16px !important; font-size: 11px !important; letter-spacing: 1px !important; }
.nav-lang { padding: 6px 10px !important; }
.nav-links { align-items: center !important; gap: 20px !important; }
.nav-links > a, .nav-links > .nav-dd { display: flex; align-items: center; line-height: 1; }

/* footer "About us" dropdown button should match footer link styling */
.footer-top .nav-dd-btn {
  font-size: 15px !important; font-weight: 400 !important; letter-spacing: 0 !important;
  text-transform: none !important; color: var(--cream) !important;
  font-family: var(--sans);
}
.footer-top .nav-dd-btn:hover { color: var(--gold-pale) !important; }

/* footer dropdown menu styled to match the dark footer, not the light nav */
.footer-top .nav-dd-menu { position: static !important; transform: none !important; padding-top: 6px !important; }
.footer-top .nav-dd-card {
  background: transparent !important; border: none !important; border-radius: 0 !important;
  box-shadow: none !important; padding: 6px 0 !important; min-width: 0 !important; gap: 10px !important;
}
.footer-top .nav-dd-card a {
  color: var(--cream) !important; font-weight: 400 !important;
  font-size: 15px !important; padding: 0 !important;
}
.footer-top .nav-dd-card a:hover { background: transparent !important; color: var(--gold-pale) !important; }

/* story / team page hero: tightened band */
.hero-grid.story-hero { padding-bottom: 64px; }
.story-hero .page-title { margin-bottom: 0; }

/* extra breathing room below the trust ticker bar */
.hero-foot { margin-bottom: 48px; }

/* stacked contact block in nav */
.nav-contact-stack {
  display: flex; flex-direction: column; gap: 2px;
  padding-left: 24px; border-left: 1px solid var(--band-hair, var(--hair));
  font-family: var(--sans); font-size: 12px; color: var(--band-fg, var(--ink));
  white-space: nowrap; align-self: center; justify-content: center;
}
.nav-contact-stack .nc-label {
  font-size: 10px; font-weight: 700; letter-spacing: 1.6px; text-transform: uppercase; opacity: 0.6;
}
.nav-contact-stack a {
  font-weight: 600; font-size: 13px; color: inherit; text-decoration: none;
  border-bottom: none !important;
}
.nav-contact-stack a:hover { text-decoration: underline; }
.nc-email { opacity: 0.7; font-size: 11px; }
@media (max-width: 1020px) { .nav-contact-stack { display: none; } }

/* tighter hero actions */
.hero-actions { display: flex; flex-wrap: wrap; gap: 20px; align-items: center; margin-top: 4px; justify-content: flex-start; }
/* reduce hero top padding */
.hero-grid { padding-top: 56px !important; }
.hero-grid.compact { padding-top: 48px !important; }
/* hero sub sits below actions with breathing room */
.hero-sub { margin-top: 28px !important; padding-bottom: 72px; }

/* ————— interior page rows (h2 left, copy right) ————— */
.page-rows { margin-top: 8px; }
.page-row {
  display: grid; grid-template-columns: 5fr 7fr; gap: 48px;
  padding: 56px 0; border-bottom: 1px solid var(--hair);
}
.page-row:first-child { border-top: 1px solid var(--hair); }
.page-row > h2 { font-size: 33px; line-height: 1.3; max-width: 16ch; letter-spacing: -0.3px; }
.page-row-body > p {
  margin: 0 0 22px; color: var(--ink-soft); font-size: 19px; line-height: 1.85;
  font-family: var(--body); max-width: 58ch;
}
.page-row-body > p:last-child { margin-bottom: 0; }
.quiet-line {
  font-family: var(--serif); font-style: italic; font-size: 21px; color: var(--sage-deep);
}
.sec-head .quiet-line { margin: 14px 0 0; max-width: 58ch; }

/* practitioner block on location pages */
.pract-grid { display: grid; grid-template-columns: 138px 1fr; gap: 38px; align-items: start; }
.pract-grid image-slot { width: 138px; height: 138px; display: block; }

/* suburb clusters */
.suburb-group { margin: 0 0 28px; }
.suburb-group h3 { font-size: 20px; line-height: 1.4; margin: 0 0 6px; }
.suburb-group p { margin: 0; color: var(--ink-soft); font-size: 18.5px; line-height: 1.75; font-family: var(--body); max-width: 58ch; }

/* compact service index on location pages */
.svc-links { display: flex; flex-direction: column; margin-top: 26px; }
.svc-link {
  display: flex; justify-content: space-between; align-items: baseline; gap: 24px;
  padding: 15px 0; border-bottom: 1px solid var(--hair); text-decoration: none;
  font-family: var(--display); font-size: 21px; font-weight: 500;
}
.svc-link:first-child { border-top: 1px solid var(--hair); }
.svc-link .s-arrow { color: var(--sage-deep); font-size: 20px; transition: transform .18s ease; }
.svc-link:hover .s-arrow { transform: translateX(8px); }

/* closing "where we work" line on service pages */
.where-line {
  font-family: var(--serif); font-style: italic; font-size: 22px; line-height: 1.75;
  color: var(--sage-deep); max-width: 58ch; margin: 56px 0 0;
}
.where-line a {
  color: inherit; text-decoration: underline; text-decoration-color: var(--gold);
  text-underline-offset: 4px; text-decoration-thickness: 1px;
}
.where-line a:hover { text-decoration-color: var(--sage-deep); }

/* items awaiting Bo's confirmation — visible flag, removed at publish */
.confirm {
  background: rgba(236, 194, 87, .26);
  border-bottom: 1px dashed var(--cta-deep);
  padding: 0 4px; border-radius: 4px;
}

/* homepage map + city-list links */
.where-cities a { color: inherit; text-decoration: none; border-bottom: 1.5px solid var(--gold); }
.where-cities a:hover { color: var(--gold-text); border-bottom-color: var(--gold-text); }
.where-map svg { width: 100%; height: auto; display: block; overflow: visible; }
.where-map .map-label {
  font-family: var(--sans); font-weight: 600; font-size: 4px;
  letter-spacing: .1px; dominant-baseline: middle;
}
.where-map a { text-decoration: none; }
.where-map a .map-label { transition: fill .15s ease; }
.where-map a:hover .map-label { fill: var(--gold-text); text-decoration: underline; }

@media (max-width: 1020px) {
  .page-row { grid-template-columns: 1fr; gap: 20px; padding: 40px 0; }
  .faq-acc summary { font-size: 22px; }
  .pract-grid { grid-template-columns: 108px 1fr; gap: 24px; }
  .pract-grid image-slot { width: 108px; height: 108px; }
}

/* ————— location hero map (Australia + ping) ————— */
.hero-grid.loc-hero { grid-template-columns: 1fr 330px; gap: 80px; align-items: center; }
.loc-map { padding-bottom: 56px; }
.loc-map svg { width: auto; height: auto; max-width: 100%; max-height: 400px; display: block; margin: 0 auto; overflow: visible; }
.loc-map .sub-dot { fill: rgba(247, 244, 235, .8); }
.loc-map .map-sub {
  font-family: var(--sans); font-weight: 600; font-size: 3.4px;
  letter-spacing: .14px; fill: rgba(247, 244, 235, .78);
}
.loc-map .map-land {
  fill: rgba(247, 244, 235, .09);
  stroke: rgba(247, 244, 235, .55);
  stroke-width: 0.9; stroke-linejoin: round;
}
.loc-map .map-fill { fill: rgba(247, 244, 235, .09); stroke: none; }
.loc-map .map-coast {
  fill: none; stroke: rgba(247, 244, 235, .55);
  stroke-width: 0.9; stroke-linejoin: round; stroke-linecap: round;
}
.loc-map .ping-dot { fill: #ECC257; stroke: rgba(247, 244, 235, .9); stroke-width: 0.6; }
.loc-map .ping-ring {
  fill: none; stroke: #ECC257; stroke-width: 0.7; opacity: .3;
  transform-box: fill-box; transform-origin: center;
}
.loc-map .map-city {
  font-family: var(--serif); font-style: italic; font-size: 5.4px;
  fill: rgba(247, 244, 235, .92);
}
@media (prefers-reduced-motion: no-preference) {
  .loc-map .ping-ring { animation: rsLocPing 3.2s cubic-bezier(.2, .55, .4, 1) infinite; }
  .loc-map .ping-ring.r2 { animation-delay: 1.6s; }
}
@keyframes rsLocPing {
  0%   { transform: scale(.32); opacity: .85; }
  75%  { opacity: 0; }
  100% { transform: scale(2.1); opacity: 0; }
}
@media (max-width: 1020px) {
  .hero-grid.loc-hero { grid-template-columns: 1fr; gap: 0; }
  .loc-map { max-width: 300px; padding-bottom: 56px; }
}
