/*
Theme Name:     Dr Raghda (OceanWP Child)
Theme URI:      https://new.drraghda.com
Description:    Child theme of OceanWP — Dr Raghda aesthetic & regenerative medicine design system. Fraunces + DM Sans typography, warm ink/bronze/cream palette. Do not edit in FTP; use Appearance → Theme File Editor or sync via deployment.
Author:         Sándor Kiss / profi-trade.ro
Author URI:     https://profi-trade.ro
Template:       oceanwp
Version:        0.19.4
License:        GPL-2.0-or-later
License URI:    https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:    oceanwp-child
*/
/* v0.18.0 (2026-07-19): mobile header — logo +40% (210/185px), centred, burger pinned right */

/* ==========================================================================
   DESIGN TOKENS — Dr Raghda
   Single source of truth for colour, typography, spacing, rules.
   Match Elementor Global Colors and Global Fonts to these values.
   ========================================================================== */

:root {
  /* Ink — primary text and dark surfaces */
  --dr-ink: #1A1814;
  --dr-ink-soft: #2C2822;

  /* Bronze — accent, CTAs, section dividers */
  --dr-bronze: #A77B4A;
  --dr-bronze-deep: #8A6238;
  --dr-bronze-soft: #D4B895;

  /* Sage — secondary accent, reserved for future use (not on homepage v1) */
  --dr-sage: #5C7A5E;

  /* Cream — primary background tones */
  --dr-cream: #FAF6EF;
  --dr-cream-deep: #F2EBDC;
  --dr-soft: #EFE6D6;

  /* Rule, grey — hairlines and tertiary text */
  --dr-rule: #D9CFB8;
  --dr-grey: #6B6157;
  --dr-grey-soft: #9A9089;

  /* Neutrals */
  --dr-white: #FFFFFF;

  /* Typography families */
  --dr-font-heading: 'Fraunces', Georgia, 'Times New Roman', serif;
  --dr-font-body: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Base type scale — homepage body is 17px 1.65 line-height per mockup */
  --dr-text-base: 17px;
  --dr-line-base: 1.65;

  /* Letter-spacing helpers */
  --dr-tracking-heading: -0.01em;
  --dr-tracking-eyebrow: 0.22em;

  /* Container max-width (matches mockup .container = 1240px) */
  --dr-container-max: 1240px;
  --dr-container-pad: 32px;
}

/* ==========================================================================
   BASE — applied globally via child theme
   Note: OceanWP parent styles still load first; these OVERRIDE where needed.
   ========================================================================== */

body {
  font-family: var(--dr-font-body);
  font-size: var(--dr-text-base);
  line-height: var(--dr-line-base);
  color: var(--dr-ink);
  background: var(--dr-cream);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.elementor-heading-title,
.entry-title {
  font-family: var(--dr-font-heading);
  font-weight: 400;
  letter-spacing: var(--dr-tracking-heading);
  line-height: 1.15;
  color: var(--dr-ink);
}

a { color: inherit; text-decoration: none; }
a:hover { color: var(--dr-bronze); }

/* Reusable eyebrow label (small all-caps tracked text above section titles) */
.dr-eyebrow {
  font-family: var(--dr-font-body);
  font-size: 12px;
  letter-spacing: var(--dr-tracking-eyebrow);
  text-transform: uppercase;
  color: var(--dr-bronze);
  font-weight: 500;
}

/* ==========================================================================
   HERO RESPONSIVE — homepage (post 113)
   Added 2026-04-21. Mobile + tablet overrides for the Elementor V4 Atomic
   hero section. Selectors target data-id classes verified against the
   rendered HTML of post 113. Elementor V4 uses CSS custom properties
   (--flex-direction, --width, --gap) to drive its layout, so most overrides
   set those vars rather than raw properties — no !important needed.
   ========================================================================== */

/* ---- Tablet + Mobile (≤1024px): collapse 2-col hero to single column ---- */
@media (max-width: 1024px) {

  /* Outer section (e94af36): tighter vertical rhythm */
  .elementor-113 .elementor-element.elementor-element-e94af36 {
    --margin-top: 48px;
    --margin-bottom: 64px;
  }

  /* Inner boxed container (e1fd343): stack to column, drop side margin */
  .elementor-113 .elementor-element.elementor-element-e1fd343 {
    --flex-direction: column;
    --margin-left: 0px;
    --margin-right: 0px;
    --gap: 60px 0px;
    --row-gap: 60px;
    --column-gap: 0px;
    --align-items: stretch;
  }

  /* Inner wrapper: 24px side padding (desktop uses 32 via container pad) */
  .elementor-113 .elementor-element.elementor-element-e1fd343 > .e-con-inner {
    padding-left: 24px;
    padding-right: 24px;
  }

  /* Both columns (a00913c text, c431981 image): full width */
  .elementor-113 .elementor-element.elementor-element-a00913c,
  .elementor-113 .elementor-element.elementor-element-c431981 {
    --width: 100%;
  }

  /* Portrait column (c431981): composite mobile image as background.
     Desktop renders portrait + bronze shape + hero-tag via three separate
     Elementor widgets (86d4747, b158eac, 32b187f) — all hidden ≤1024px.
     Here we show a single pre-composed PNG (portrait + shape + tag baked
     in, with cream bg) directly on the container. aspect-ratio pins the
     container to the image's native 750:1100 ratio at any viewport width
     so background-size: contain fills edge to edge without empty bands.
     min-height is a safety floor for the tiny fraction of browsers that
     do not yet support aspect-ratio. */
  .elementor-113 .elementor-element.elementor-element-c431981 {
    background-image: url('https://new.drraghda.com/wp-content/uploads/2026/04/DrRagda.png');
    background-size: contain;
    background-position: center top;
    background-repeat: no-repeat;
    aspect-ratio: 750 / 1100;
    min-height: 400px;
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
  }

  /* Desktop portrait widget (86d4747): replaced by the background image
     on the parent column — hide the original <img> widget entirely. */
  .elementor-113 .elementor-element.elementor-element-86d4747 {
    display: none !important;
  }

  /* Soft bronze shape (b158eac): desktop-only editorial decoration.
     Hidden on tablet/mobile — at these widths it overlaps the text column
     and reads as a layout bug rather than a decorative frame. */
  .elementor-113 .elementor-element.elementor-element-b158eac {
    display: none !important;
  }

  /* Hero-tag (32b187f, "Listened to. Reassured. Never rushed."):
     desktop-only garnish. Hidden on tablet/mobile — its absolute positioning
     at right:621px calibrated to the desktop portrait bounds overlays the
     CTA when the hero stacks. Option A: hide. Simpler than reflow. */
  .elementor-113 .elementor-element.elementor-element-32b187f {
    display: none !important;
  }
}

/* ---- Mobile (≤640px): stack CTAs, soften strip gaps ---- */
@media (max-width: 640px) {

  /* Force full-width on hero-grid-text and all its direct children.
     body-prefixed selectors raise specificity above Elementor's
     post-113.css base rules; !important is belt-and-braces because
     5ec2047 body text has max-width:90% + width:var(--container-widget-
     width, 90%) hard-coded in the base rule — no specificity alone
     defeats the 90% anchor without also forcing raw width/max-width. */
  body .elementor-113 .elementor-element.elementor-element-a00913c,
  body .elementor-113 .elementor-element.elementor-element-379dabb,
  body .elementor-113 .elementor-element.elementor-element-d7d4090,
  body .elementor-113 .elementor-element.elementor-element-62b5d0d,
  body .elementor-113 .elementor-element.elementor-element-603bf1f,
  body .elementor-113 .elementor-element.elementor-element-5ec2047,
  body .elementor-113 .elementor-element.elementor-element-f4da47b,
  body .elementor-113 .elementor-element.elementor-element-4232113,
  body .elementor-113 .elementor-element.elementor-element-5b9a9e6 {
    --width: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Zero a00913c internal padding at mobile. post-113.css base rule
     applies --padding-left:32px / --padding-right:32px for a visual
     indent on desktop, but inside a 24px-padded inner wrapper at 375px
     that extra 64px is the primary reason v0.4.0 content sat at ~60%
     of viewport width. */
  body .elementor-113 .elementor-element.elementor-element-a00913c {
    --padding-left: 0px !important;
    --padding-right: 0px !important;
  }

  /* CTA wrapper (379dabb): column direction + reset desktop negative
     margins (--margin-top:-40px, --margin-left:-22px from post-113.css). */
  body .elementor-113 .elementor-element.elementor-element-379dabb {
    --flex-direction: column !important;
    --justify-content: stretch !important;
    --align-items: stretch !important;
    --margin-top: 0px !important;
    --margin-left: 0px !important;
    --gap: 12px 0px !important;
    --row-gap: 12px !important;
    --column-gap: 0px !important;
  }

  /* Second button wrapper (62b5d0d): reset desktop --margin-left:-35px
     that would otherwise pull the button off the left edge on mobile. */
  body .elementor-113 .elementor-element.elementor-element-62b5d0d {
    --margin-left: 0px !important;
  }

  /* Button <a> elements: edge-to-edge inside their wrappers, label
     centred. display:flex beats Elementor's inline-flex default. */
  body .elementor-113 .elementor-element-d7d4090 .elementor-button,
  body .elementor-113 .elementor-element-62b5d0d .elementor-button {
    width: 100% !important;
    max-width: 100% !important;
    justify-content: center !important;
    display: flex !important;
  }

  /* Trust strip (603bf1f): VERTICAL STACK on mobile.
     v0.4.0 tried 3-column-at-all-costs (flex:1 1 0 + min-width:0) which
     compressed items to ~100px and broke typography: stars wrapped to
     "★★★" / "★★", "EXPERIENCE" split to "EXPERIE" / "NCE". Pivot: each
     item is its own full-width row, num over label per item — readable
     with native design-system typography. User-approved deviation from
     the original 3-col mockup at this breakpoint. */
  body .elementor-113 .elementor-element.elementor-element-603bf1f {
    --flex-direction: column !important;
    --flex-wrap: nowrap !important;
    --gap: 24px 0 !important;
    --row-gap: 24px !important;
    --column-gap: 0 !important;
    flex-direction: column !important;
  }

  body .elementor-113 .elementor-element-603bf1f > .elementor-element {
    --width: 100% !important;
    --flex-direction: column !important;
    --align-items: flex-start !important;
    width: 100% !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
  }

  /* Num typography restored to design-system scale (room now that items
     are rows, not 100px columns). Stars 34→32, numbers 27→32. */
  body .elementor-113 .elementor-element.elementor-element-14d12fa .elementor-heading-title {
    font-size: 32px !important;
    letter-spacing: 2px !important;
  }
  body .elementor-113 .elementor-element.elementor-element-c8de81b .elementor-heading-title,
  body .elementor-113 .elementor-element.elementor-element-81d78bc .elementor-heading-title {
    font-size: 32px !important;
  }

  /* Label typography: normal uppercase 12px (was compressed to 11px
     with 0.04em tracking in v0.4.0 to fit 3-col; room now for 1px). */
  body .elementor-113 .elementor-element.elementor-element-b182e52 .elementor-heading-title,
  body .elementor-113 .elementor-element.elementor-element-21ac593 .elementor-heading-title,
  body .elementor-113 .elementor-element.elementor-element-7338300 .elementor-heading-title {
    font-size: 12px !important;
    letter-spacing: 1px !important;
    line-height: 1.4 !important;
  }

  /* Trust items 2 and 3 (e503e71, 0bce38c): render num+label inline
     instead of v0.5.0's num-over-label vertical stack. Row 1 (adc4656,
     stars) is explicitly excluded via :not(:first-child) — its
     "★★★★★" + "5.0 · 13 Google reviews" pairing reads better stacked.
     baseline alignment keeps the Fraunces num and DM Sans label sitting
     on the same typographic line; flex-wrap allows graceful degradation
     if the combined row exceeds container width on very narrow viewports. */
  body .elementor-113 .elementor-element-603bf1f > .elementor-element:not(:first-child) {
    display: flex !important;
    align-items: baseline !important;
    flex-wrap: wrap !important;
    column-gap: 10px !important;
    row-gap: 4px !important;
  }
}

/* ---- Small mobile (≤480px): tighter vertical padding ---- */
@media (max-width: 480px) {

  .elementor-113 .elementor-element.elementor-element-e94af36 {
    --margin-top: 32px;
    --margin-bottom: 48px;
  }
}

/* ==========================================================================
   Section 4 — Founder ("Hi, I'm Dr Raghda")
   Version: 0.7.0
   Date: 2026-04-23
   Mockup reference: drraghda_homepage_mockup.html lines 365–450, 905–942
   Scope: .dr-founder and descendants
   ========================================================================== */

/* -- Section container -- */
body .elementor .dr-founder {
  background-color: #FAF6EF;
}

/* -- 2-column grid (1fr / 1.3fr via Elementor width percentages) -- */
body .elementor .founder-grid {
  display: flex !important;
  flex-direction: row;
  align-items: center;
  gap: 90px;
  width: 100%;
}

body .elementor .founder-grid > .founder-image-wrap,
body .elementor .founder-grid > .founder-content {
  max-width: none !important;
}

/* -- Left column: image with offset soft shape behind -- */
body .elementor .founder-image-wrap {
  position: relative;
  padding-bottom: 32px;
  padding-right: 32px;
}

body .elementor .founder-image-wrap::before {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 70%;
  height: 70%;
  background-color: #EFE6D6;
  z-index: 0;
  pointer-events: none;
}

body .elementor .founder-image-wrap .founder-image,
body .elementor .founder-image-wrap .founder-image > .elementor-widget-container {
  position: relative;
  z-index: 1;
}

body .elementor .founder-image-wrap .founder-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  display: block;
}

/* -- Right column: content flow -- */
body .elementor .founder-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

/* Eyebrow */
body .elementor .founder-content .dr-eyebrow .elementor-heading-title {
  margin: 0 0 18px 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #A77B4A;
  line-height: 1.4;
}

/* H2 */
body .elementor .founder-content .founder-h2 .elementor-heading-title {
  font-family: 'Fraunces', serif;
  font-size: clamp(38px, 4vw, 56px);
  font-style: italic;
  font-weight: 300;
  line-height: 1.1;
  color: #1A1814;
  margin: 0 0 32px 0;
}

/* Paragraphs */
body .elementor .founder-content .founder-p,
body .elementor .founder-content .founder-p p {
  font-family: 'DM Sans', sans-serif;
  font-size: 17px;
  line-height: 1.75;
  color: #2C2822;
  margin: 0 0 22px 0;
}

/* Credentials strip */
body .elementor .founder-content .founder-credentials {
  display: flex;
  gap: 32px;
  padding: 24px 0;
  border-top: 1px solid #D9CFB8;
  border-bottom: 1px solid #D9CFB8;
  margin: 14px 0 32px 0;
  flex-wrap: wrap;
  width: 100%;
}

body .elementor .founder-content .cred-item {
  display: flex;
  flex-direction: column;
  min-width: 80px;
}

body .elementor .founder-content .cred-num {
  font-family: 'Fraunces', serif;
  font-size: 32px;
  font-weight: 500;
  color: #A77B4A;
  line-height: 1;
  margin: 0;
}

body .elementor .founder-content .cred-label {
  font-family: 'DM Sans', sans-serif;
  font-size: 12px;
  color: #6B6157;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin-top: 6px;
  line-height: 1.3;
}

/* Pull quote */
body .elementor .founder-content .founder-quote {
  font-family: 'Fraunces', serif;
  font-size: 22px;
  font-style: italic;
  line-height: 1.5;
  color: #1A1814;
  padding: 28px 0 28px 32px;
  border-left: 2px solid #A77B4A;
  margin: 36px 0 12px 0;
  quotes: none;
  background: none;
}

body .elementor .founder-content .founder-quote::before,
body .elementor .founder-content .founder-quote::after {
  content: none;
}

/* Signature */
body .elementor .founder-content .founder-signature {
  margin: 0 0 36px 32px;
  max-width: 220px;
}

body .elementor .founder-content .founder-signature img {
  max-width: 220px;
  height: auto;
  display: block;
  opacity: 0.85;
  mix-blend-mode: multiply;
}

/* CTA button (outline variant) */
body .elementor .founder-content .founder-cta .elementor-button,
body .elementor .founder-content a.elementor-button.founder-cta {
  background-color: transparent;
  color: #1A1814;
  border: 1px solid #1A1814;
  padding: 14px 28px;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border-radius: 0;
  transition: all 0.25s ease;
}

body .elementor .founder-content .founder-cta .elementor-button:hover,
body .elementor .founder-content a.elementor-button.founder-cta:hover {
  background-color: #1A1814;
  color: #FAF6EF;
  border-color: #1A1814;
}

/* ==========================================================================
   Founder — Responsive
   ========================================================================== */

/* Tablet ≤1024px: grid collapses to single column */
@media (max-width: 1024px) {
  body .elementor .founder-grid {
    flex-direction: column !important;
    gap: 60px !important;
  }
  body .elementor .founder-image-wrap {
    padding-bottom: 24px;
    padding-right: 24px;
    max-width: 560px;
    margin: 0 auto;
    width: 100% !important;
  }
  body .elementor .founder-content {
    width: 100% !important;
  }
  body .elementor .dr-founder {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }
}

/* Mobile ≤640px: tightening */
@media (max-width: 640px) {
  body .elementor .founder-grid {
    gap: 48px !important;
  }
  body .elementor .founder-content .founder-h2 .elementor-heading-title {
    font-size: 38px;
    margin-bottom: 24px;
  }
  body .elementor .founder-content .founder-p,
  body .elementor .founder-content .founder-p p {
    font-size: 16px;
    line-height: 1.7;
  }
  body .elementor .founder-content .founder-credentials {
    gap: 24px;
  }
  body .elementor .founder-content .cred-num {
    font-size: 28px;
  }
  body .elementor .founder-content .founder-quote {
    font-size: 19px;
    padding: 22px 0 22px 24px;
    margin: 28px 0 8px 0;
  }
  body .elementor .founder-content .founder-signature {
    margin-left: 24px;
    max-width: 180px;
  }
  body .elementor .founder-content .founder-signature img {
    max-width: 180px;
  }
  body .elementor .dr-founder {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }
}

/* end Section 4 — Founder */

/* ==========================================================================
   v0.7.1 — Founder hotfix
   Fixes:
   1. ::before offset soft-shape visibility (padding !important override)
   2. H2 font-size clamp enforcement
   ========================================================================== */

/* Force Elementor container padding override (inline custom props lose) */
body .elementor .founder-image-wrap.e-con,
body .elementor .e-con.founder-image-wrap {
  position: relative !important;
  padding-right: 32px !important;
  padding-bottom: 32px !important;
  overflow: visible !important;
}

/* Re-assert the ::before shape with !important across the stack */
body .elementor .founder-image-wrap::before {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  right: 0 !important;
  width: 70% !important;
  height: 70% !important;
  background-color: #EFE6D6 !important;
  z-index: 0 !important;
  pointer-events: none;
  display: block;
}

/* Ensure image wrapper sits above the ::before */
body .elementor .founder-image-wrap .founder-image,
body .elementor .founder-image-wrap .founder-image > .elementor-widget-container {
  position: relative;
  z-index: 1;
}

/* Tablet: smaller offset */
@media (max-width: 1024px) {
  body .elementor .founder-image-wrap.e-con,
  body .elementor .e-con.founder-image-wrap {
    padding-right: 24px !important;
    padding-bottom: 24px !important;
  }
}

/* H2: enforce clamp with !important to override Elementor defaults */
body .elementor .founder-content .founder-h2 .elementor-heading-title {
  font-size: clamp(38px, 4vw, 56px) !important;
  line-height: 1.1 !important;
}

/* end v0.7.1 */

/* ==========================================================================
   v0.7.2 — Founder ::before position fix
   Root cause: theme/Elementor global *::before rule added top:0 left:0 that
   outranked our bottom:0 right:0 when both pairs + width/height set.
   Result: ::before rendered in top-left (covered by image) instead of bottom-right.
   Fix: explicit top:auto left:auto with !important to release those edges.
   ========================================================================== */

body .elementor .founder-image-wrap::before,
body .elementor .e-con.founder-image-wrap::before {
  top: auto !important;
  left: auto !important;
  right: 0 !important;
  bottom: 0 !important;
}

/* end v0.7.2 */

/* ==========================================================================
   Section 5 — Pillars ("Four pathways, one medical philosophy")
   Version: 0.8.0
   Date: 2026-04-23
   Mockup reference: drraghda_homepage_mockup.html lines 452–513, 944–979
   Scope: .dr-pillars and descendants
   ========================================================================== */

/* -- Section container: dark ink -- */
body .elementor .dr-pillars {
  background-color: #1A1814;
  color: #FAF6EF;
}

/* -- Section head (eyebrow + h2 + intro) -- */
body .elementor .pillars-head {
  max-width: 720px;
  margin: 0 auto 80px;
  text-align: center;
  width: 100%;
}

body .elementor .pillars-head .dr-eyebrow .elementor-heading-title {
  display: block;
  margin: 0 0 20px 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #D4B895;
  line-height: 1.4;
}

body .elementor .pillars-head .pillars-h2 .elementor-heading-title {
  font-family: 'Fraunces', serif;
  font-size: clamp(36px, 4vw, 52px) !important;
  font-style: italic;
  font-weight: 300;
  line-height: 1.1;
  color: #FAF6EF;
  margin: 0;
}

body .elementor .pillars-head .pillars-intro,
body .elementor .pillars-head .pillars-intro p {
  font-family: 'DM Sans', sans-serif;
  font-size: 17px;
  line-height: 1.65;
  color: #9A9089;
  margin: 24px 0 0 0;
}

/* -- Pillar grid: 4-column with 1px hairline dividers via gap+bg trick -- */
body .elementor .pillar-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 1px !important;
  background-color: rgba(217, 207, 184, 0.15);
  border: 1px solid rgba(217, 207, 184, 0.15);
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
}

/* -- Pillar card -- */
body .elementor .pillar-card {
  padding: 50px 36px 44px !important;
  background-color: #1A1814 !important;
  transition: background-color 0.3s ease;
  cursor: pointer;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  position: relative;
  text-decoration: none !important;
  color: inherit !important;
  width: auto !important;
  max-width: none !important;
}

body .elementor .pillar-card:hover {
  background-color: #2C2822 !important;
}

/* If fallback overlay-link pattern was used, style the absolute link */
body .elementor .pillar-card .pillar-overlay-link {
  position: absolute;
  inset: 0;
  z-index: 10;
  text-decoration: none;
  display: block;
}

/* -- Pillar number (i. ii. iii. iv.) -- */
body .elementor .pillar-card .pillar-num .elementor-heading-title {
  font-family: 'Fraunces', serif;
  font-size: 18px;
  font-style: italic;
  font-weight: 400;
  color: #A77B4A;
  margin: 0 0 32px 0;
  line-height: 1;
}

/* -- Pillar h3 -- */
body .elementor .pillar-card .pillar-h3 .elementor-heading-title {
  font-family: 'Fraunces', serif;
  font-size: 24px;
  font-weight: 400;
  font-style: normal;
  color: #FAF6EF;
  margin: 0 0 18px 0;
  line-height: 1.25;
}

/* -- Pillar description -- */
body .elementor .pillar-card .pillar-p,
body .elementor .pillar-card .pillar-p p {
  font-family: 'DM Sans', sans-serif;
  font-size: 14.5px;
  line-height: 1.65;
  color: #9A9089;
  margin: 0 0 28px 0;
}

/* -- Explore → microlink -- */
body .elementor .pillar-card .pillar-more {
  font-family: 'DM Sans', sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #D4B895;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

body .elementor .pillar-card .pillar-arrow {
  display: inline-block;
  transition: transform 0.25s ease;
}

body .elementor .pillar-card:hover .pillar-arrow {
  transform: translateX(4px);
}

/* ==========================================================================
   Pillars — Responsive
   ========================================================================== */

/* Tablet ≤1024px: 4-col → 1-col stack with hairline between cards */
@media (max-width: 1024px) {
  body .elementor .pillar-grid {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    background: transparent !important;
    border: none !important;
  }
  body .elementor .pillar-card {
    border-bottom: 1px solid rgba(217, 207, 184, 0.15);
    padding: 40px 24px !important;
  }
  body .elementor .pillar-card:last-child {
    border-bottom: none;
  }
  body .elementor .pillars-head {
    margin-bottom: 60px;
  }
  body .elementor .dr-pillars {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }
}

/* Mobile ≤640px: tightening */
@media (max-width: 640px) {
  body .elementor .dr-pillars {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }
  body .elementor .pillars-head {
    margin-bottom: 50px;
  }
  body .elementor .pillars-head .pillars-h2 .elementor-heading-title {
    font-size: 32px !important;
  }
  body .elementor .pillars-head .pillars-intro,
  body .elementor .pillars-head .pillars-intro p {
    font-size: 16px;
  }
  body .elementor .pillar-card {
    padding: 36px 20px !important;
  }
  body .elementor .pillar-card .pillar-num .elementor-heading-title {
    margin-bottom: 24px;
  }
  body .elementor .pillar-card .pillar-h3 .elementor-heading-title {
    font-size: 22px;
  }
}

/* end Section 5 — Pillars */

/* ==========================================================================
   Section 6 — Process ("An unhurried path from question to plan")
   Version: 0.9.0
   Date: 2026-04-23
   Mockup reference: drraghda_homepage_mockup.html lines 515–579, 982–1009
   Scope: .dr-process and descendants
   ========================================================================== */

/* -- Section container: cream-deep -- */
body .elementor .dr-process {
  background-color: #F2EBDC;
}

/* -- Section head (eyebrow + h2) -- */
body .elementor .process-head {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
  width: 100%;
  align-items: center !important;
}

body .elementor .process-head .dr-eyebrow .elementor-heading-title {
  display: block;
  margin: 0 0 20px 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #A77B4A;
  line-height: 1.4;
}

body .elementor .process-head .process-h2 .elementor-heading-title {
  font-family: 'Fraunces', serif;
  font-size: clamp(36px, 4vw, 52px) !important;
  font-style: italic;
  font-weight: 300;
  line-height: 1.15;
  color: #1A1814;
  margin: 0;
  text-align: center;
}

/* -- Step grid: 3 columns with horizontal connector line -- */
body .elementor .step-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 60px;
  margin-top: 40px !important;
  position: relative;
  width: 100%;
  max-width: none !important;
}

/* Horizontal hairline through the number circles (top 32px = circle vertical-center) */
body .elementor .step-grid::before {
  content: '';
  position: absolute;
  top: 32px;
  left: 16.66%;
  right: 16.66%;
  bottom: auto !important;
  width: auto !important;
  height: 1px;
  background-color: #D9CFB8;
  z-index: 0;
  pointer-events: none;
  display: block;
}

/* -- Step -- */
body .elementor .step {
  text-align: center;
  position: relative;
  z-index: 1;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: auto !important;
}

/* -- Step number circle (01 / 02 / 03) -- */
body .elementor .step .step-num {
  width: 64px;
  height: 64px;
  background-color: #FAF6EF;   /* cream — sits on top of connector line */
  border: 1px solid #A77B4A;   /* bronze */
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 32px auto;
  font-family: 'Fraunces', serif;
  font-size: 24px;
  font-style: italic;
  font-weight: 400;
  color: #A77B4A;
  line-height: 1;
  box-sizing: border-box;
  position: relative;
  z-index: 2;  /* sit above the connector line */
}

/* -- Step h3 -- */
body .elementor .step .step-h3 .elementor-heading-title {
  font-family: 'Fraunces', serif;
  font-size: 22px;
  font-weight: 400;
  font-style: normal;
  color: #1A1814;
  margin: 0 0 14px 0;
  line-height: 1.25;
  text-align: center;
}

/* -- Step description -- */
body .elementor .step .step-p,
body .elementor .step .step-p p {
  font-family: 'DM Sans', sans-serif;
  font-size: 15px;
  line-height: 1.65;
  color: #6B6157;
  max-width: 280px;
  margin: 0 auto;
  text-align: center;
}

/* -- Process promise block (pull-quote style) -- */
body .elementor .process-promise-wrap {
  max-width: 720px;
  margin: 80px auto 0 auto;
  width: 100%;
  align-items: center !important;
}

body .elementor .process-promise {
  text-align: center;
  padding: 40px 32px;
  font-family: 'Fraunces', serif;
  font-style: italic;
  font-weight: 300;
  font-size: 24px;
  line-height: 1.5;
  color: #1A1814;
  border-top: 1px solid #D9CFB8;
  border-bottom: 1px solid #D9CFB8;
  margin: 0;
  background: none;
  quotes: none;
}

body .elementor .process-promise::before,
body .elementor .process-promise::after {
  content: none;
}

/* ==========================================================================
   Process — Responsive
   ========================================================================== */

/* Tablet ≤1024px: 3-col → 1-col stack, connector line hidden */
@media (max-width: 1024px) {
  body .elementor .step-grid {
    grid-template-columns: 1fr !important;
    gap: 48px !important;
  }
  body .elementor .step-grid::before {
    display: none !important;
  }
  body .elementor .process-promise-wrap {
    margin-top: 60px;
  }
  body .elementor .dr-process {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }
}

/* Mobile ≤640px: tightening */
@media (max-width: 640px) {
  body .elementor .dr-process {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }
  body .elementor .step-grid {
    gap: 40px !important;
    margin-top: 32px !important;
  }
  body .elementor .process-head .process-h2 .elementor-heading-title {
    font-size: 32px !important;
  }
  body .elementor .step .step-num {
    width: 56px;
    height: 56px;
    font-size: 20px;
    margin-bottom: 24px;
  }
  body .elementor .step .step-h3 .elementor-heading-title {
    font-size: 20px;
  }
  body .elementor .step .step-p,
  body .elementor .step .step-p p {
    font-size: 14.5px;
    max-width: 100%;
  }
  body .elementor .process-promise {
    font-size: 20px;
    padding: 32px 20px;
  }
  body .elementor .process-promise-wrap {
    margin-top: 48px;
  }
}

/* end Section 6 — Process */

/* ==========================================================================
   v0.9.1 — Process blockquote left-border reset
   Root cause: theme/core default `blockquote { border-left: 3px solid #13aff0 }`
   overrides our Section 6 .process-promise rule, producing a blue left bar.
   The design uses top+bottom hairlines only, no side borders.
   Fix: explicitly zero out left and right borders on .process-promise.
   ========================================================================== */

body .elementor .process-promise,
body .elementor blockquote.process-promise {
  border-left: none !important;
  border-right: none !important;
  padding-left: 32px !important;
  padding-right: 32px !important;
}

/* Also neutralize any inherited italic/margin from theme defaults that don't match our spec */
body .elementor blockquote.process-promise {
  margin: 0 !important;
  font-style: italic;  /* our design intent is italic — reassert in case theme disables */
}

/* end v0.9.1 */

/* ==========================================================================
   Section 7 — Locations ("Two clinic locations across Greater Manchester")
   Version: 0.10.0
   Date: 2026-04-23
   Mockup reference: drraghda_homepage_mockup.html lines 582–623, 1011–1049
   Scope: .dr-locations and descendants
   ========================================================================== */

/* -- Section container: cream -- */
body .elementor .dr-locations {
  background-color: #FAF6EF;
}

/* -- Section head -- */
body .elementor .locations-head {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
  width: 100%;
  align-items: center !important;
}

body .elementor .locations-head .dr-eyebrow .elementor-heading-title {
  display: block;
  margin: 0 0 20px 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #A77B4A;
  line-height: 1.4;
}

body .elementor .locations-head .locations-h2 .elementor-heading-title {
  font-family: 'Fraunces', serif;
  font-size: clamp(36px, 4vw, 52px) !important;
  font-style: italic;
  font-weight: 300;
  line-height: 1.15;
  color: #1A1814;
  margin: 0;
  text-align: center;
}

/* -- Location grid: 2 columns -- */
body .elementor .location-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 32px !important;
  margin-top: 40px !important;
  width: 100%;
  max-width: none !important;
}

/* -- Location card -- */
body .elementor .location {
  background-color: #F2EBDC !important;
  border-top: 3px solid #A77B4A !important;
  padding: 48px 44px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  width: auto !important;
  max-width: none !important;
  position: relative;
}

/* -- Location marker (URMSTON / ALTRINCHAM) -- */
body .elementor .location .location-marker .elementor-heading-title {
  font-family: 'DM Sans', sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #A77B4A;
  margin: 0 0 14px 0;
  line-height: 1.4;
}

/* -- Location h3 (italic clinic name) -- */
body .elementor .location .location-h3 .elementor-heading-title {
  font-family: 'Fraunces', serif;
  font-size: 28px;
  font-style: italic;
  font-weight: 400;
  color: #1A1814;
  margin: 0 0 20px 0;
  line-height: 1.25;
}

/* -- Address block -- */
body .elementor .location .location-address {
  font-family: 'DM Sans', sans-serif;
  font-style: normal;
  font-size: 15px;
  line-height: 1.7;
  color: #6B6157;
  margin: 0 0 24px 0;
  display: block;
}

/* -- Location meta (metadata row with middle-dot separator) -- */
body .elementor .location .location-meta {
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  color: #6B6157;
  padding-top: 20px;
  border-top: 1px solid #D9CFB8;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  width: 100%;
  margin: 0;
}

body .elementor .location .location-meta-sep {
  color: #A77B4A;
  margin: 0 4px;
}

/* ==========================================================================
   Locations — Responsive
   ========================================================================== */

/* Tablet ≤1024px: 2-col → 1-col stack */
@media (max-width: 1024px) {
  body .elementor .location-grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
  body .elementor .location {
    padding: 40px 32px !important;
  }
  body .elementor .dr-locations {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }
}

/* Mobile ≤640px: tightening */
@media (max-width: 640px) {
  body .elementor .dr-locations {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }
  body .elementor .location-grid {
    gap: 20px !important;
    margin-top: 32px !important;
  }
  body .elementor .location {
    padding: 36px 24px !important;
  }
  body .elementor .locations-head .locations-h2 .elementor-heading-title {
    font-size: 32px !important;
  }
  body .elementor .location .location-h3 .elementor-heading-title {
    font-size: 24px;
  }
  body .elementor .location .location-address {
    font-size: 14.5px;
  }
}

/* end Section 7 — Locations */

/* ==========================================================================
   Section 8 — Reviews ("5.0 from 33 Google reviews" + video + text reviews)
   Version: 0.11.0
   Date: 2026-04-23
   Mockup reference: drraghda_homepage_mockup.html lines 626–696, 1051–1095
                     Variation A: rating header + featured video + 3 text cards + CTA
   Scope: .dr-reviews and descendants
   ========================================================================== */

/* -- Section container: cream-deep -- */
body .elementor .dr-reviews {
  background-color: #F2EBDC;
}

/* -- Rating block -- */
body .elementor .reviews-rating {
  width: 100%;
  align-items: center !important;
  text-align: center;
}

body .elementor .reviews-rating .stars-big .elementor-heading-title {
  font-family: 'Fraunces', serif;
  font-size: 28px;
  color: #A77B4A;
  letter-spacing: 0.12em;
  margin: 0 0 12px 0;
  line-height: 1;
  font-weight: 400;
}

body .elementor .reviews-rating .rating-text .elementor-heading-title {
  font-family: 'Fraunces', serif;
  font-size: 22px;
  font-style: italic;
  font-weight: 300;
  color: #1A1814;
  margin: 0;
  line-height: 1.3;
}

body .elementor .reviews-rating .rating-sub .elementor-heading-title {
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: #6B6157;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  margin: 4px 0 0 0;
  line-height: 1.4;
}

/* -- Featured video block (side-by-side desktop, stacked tablet/mobile) -- */
body .elementor .featured-video-block {
  width: 100%;
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
}

body .elementor .featured-video-wrap {
  position: relative;
}

body .elementor .featured-video-wrap .featured-video {
  display: block;
  width: 100%;
  max-width: 340px;
  height: auto;
  aspect-ratio: 9 / 16;
  background-color: #1A1814;
  object-fit: cover;
  border: 1px solid #D9CFB8;
  box-shadow: 0 8px 32px -8px rgba(26, 24, 20, 0.18);
}

/* Featured video caption */
body .elementor .featured-video-caption {
  display: flex;
  flex-direction: column;
}

body .elementor .featured-video-caption .featured-video-heading .elementor-heading-title {
  font-family: 'Fraunces', serif;
  font-size: 28px;
  font-style: italic;
  font-weight: 300;
  color: #1A1814;
  margin: 0 0 16px 0;
  line-height: 1.25;
}

body .elementor .featured-video-caption .featured-video-sub,
body .elementor .featured-video-caption .featured-video-sub p {
  font-family: 'DM Sans', sans-serif;
  font-size: 16px;
  line-height: 1.65;
  color: #6B6157;
  margin: 0;
}

/* -- Review grid: 3 columns -- */
body .elementor .review-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 32px !important;
  width: 100%;
  max-width: none !important;
}

/* -- Review card -- */
body .elementor .review {
  background-color: #FAF6EF !important;
  border-top: 2px solid #D4B895 !important;
  padding: 36px 32px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  width: auto !important;
  max-width: none !important;
  position: relative;
}

/* -- Decorative quote mark -- */
body .elementor .review .quote-mark {
  font-family: 'Fraunces', serif;
  font-size: 64px;
  line-height: 0.6;
  color: #D4B895;
  display: block;
  margin: 0 0 12px 0;
}

/* -- Review text -- */
body .elementor .review .review-text,
body .elementor .review .review-text p {
  font-family: 'Fraunces', serif;
  font-size: 16.5px;
  font-style: italic;
  font-weight: 300;
  line-height: 1.55;
  color: #2C2822;
  margin: 0 0 24px 0;
  flex-grow: 1;   /* pushes author block to the bottom of the card */
}

/* -- Review author block (hairline top border) -- */
body .elementor .review .review-author {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-top: 20px;
  border-top: 1px solid #D9CFB8;
  width: 100%;
  margin-top: auto;
}

body .elementor .review .review-author-name {
  font-family: 'DM Sans', sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: #1A1814;
  line-height: 1.3;
}

body .elementor .review .review-author-source {
  font-family: 'DM Sans', sans-serif;
  font-size: 11px;
  font-weight: 400;
  color: #6B6157;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  line-height: 1.4;
}

/* -- CTA wrapper + button -- */
body .elementor .reviews-cta-wrap {
  width: 100%;
  align-items: center !important;
}

body .elementor .reviews-cta-wrap .reviews-cta .elementor-button,
body .elementor .reviews-cta-wrap a.elementor-button.reviews-cta {
  background-color: transparent;
  color: #1A1814;
  border: 1px solid #1A1814;
  padding: 14px 28px;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border-radius: 0;
  transition: all 0.25s ease;
}

body .elementor .reviews-cta-wrap .reviews-cta .elementor-button:hover,
body .elementor .reviews-cta-wrap a.elementor-button.reviews-cta:hover {
  background-color: #1A1814;
  color: #FAF6EF;
  border-color: #1A1814;
}

/* ==========================================================================
   Reviews — Responsive
   ========================================================================== */

/* Tablet ≤1024px: review grid 3-col → 1-col, video block stacks */
@media (max-width: 1024px) {
  body .elementor .review-grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
  body .elementor .review {
    padding: 32px 28px !important;
  }
  body .elementor .featured-video-wrap .featured-video {
    max-width: 280px;
  }
  body .elementor .featured-video-caption {
    text-align: center;
    align-items: center !important;
  }
  body .elementor .featured-video-caption .featured-video-heading .elementor-heading-title {
    text-align: center;
  }
  body .elementor .dr-reviews {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }
}

/* Mobile ≤640px: tighter spacing, smaller typography */
@media (max-width: 640px) {
  body .elementor .dr-reviews {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }
  body .elementor .reviews-rating .rating-text .elementor-heading-title {
    font-size: 19px;
  }
  body .elementor .reviews-rating .rating-sub .elementor-heading-title {
    font-size: 12px;
  }
  body .elementor .featured-video-wrap .featured-video {
    max-width: 240px;
  }
  body .elementor .featured-video-caption .featured-video-heading .elementor-heading-title {
    font-size: 24px;
  }
  body .elementor .featured-video-caption .featured-video-sub,
  body .elementor .featured-video-caption .featured-video-sub p {
    font-size: 15px;
  }
  body .elementor .review-grid {
    gap: 20px !important;
  }
  body .elementor .review {
    padding: 28px 24px !important;
  }
  body .elementor .review .quote-mark {
    font-size: 56px;
    margin-bottom: 8px;
  }
  body .elementor .review .review-text,
  body .elementor .review .review-text p {
    font-size: 15.5px;
  }
}

/* end Section 8 — Reviews */

/* ==========================================================================
   Section 9 — Final CTA ("The first step is a conversation, not a treatment.")
   Version: 0.12.0
   Date: 2026-04-23
   Mockup reference: drraghda_homepage_mockup.html lines 699–722, 1097–1110
   Scope: .dr-cta-final and descendants
   The dramatic final content section before the footer.
   Largest h2 on the homepage (clamp 40–64px italic Fraunces on dark ink).
   ========================================================================== */

/* -- Section container: dark ink -- */
body .elementor .dr-cta-final {
  background-color: #1A1814;
  color: #FAF6EF;
  text-align: center;
}

/* -- Inner wrapper (center everything) -- */
body .elementor .cta-final-inner {
  width: 100%;
  align-items: center !important;
  text-align: center;
}

/* -- Eyebrow -- */
body .elementor .cta-final-inner .dr-eyebrow .elementor-heading-title {
  display: block;
  margin: 0 0 24px 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #D4B895;
  line-height: 1.4;
  text-align: center;
}

/* -- H2 — largest heading on the homepage -- */
body .elementor .cta-final-inner .cta-final-h2 .elementor-heading-title {
  font-family: 'Fraunces', serif;
  font-size: clamp(40px, 5vw, 64px) !important;
  font-style: italic;
  font-weight: 300;
  line-height: 1.1;
  color: #FAF6EF;
  max-width: 820px;
  margin: 0 auto 32px auto;
  text-align: center;
}

/* -- Supporting paragraph -- */
body .elementor .cta-final-inner .cta-final-p,
body .elementor .cta-final-inner .cta-final-p p {
  font-family: 'DM Sans', sans-serif;
  font-size: 18px;
  line-height: 1.65;
  color: #9A9089;
  max-width: 580px;
  margin: 0 auto;
  text-align: center;
}

/* -- CTA buttons wrap -- */
body .elementor .cta-buttons {
  display: flex !important;
  flex-direction: row;
  gap: 16px;
  justify-content: center !important;
  align-items: center !important;
  width: 100%;
  max-width: none !important;
}

/* -- Primary CTA: bronze fill -- */
body .elementor .cta-final-btn-primary .elementor-button,
body .elementor a.elementor-button.cta-final-btn-primary {
  background-color: #A77B4A;
  color: #FAF6EF;
  border: 1px solid #A77B4A;
  padding: 16px 32px;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border-radius: 0;
  transition: all 0.25s ease;
}

body .elementor .cta-final-btn-primary .elementor-button:hover,
body .elementor a.elementor-button.cta-final-btn-primary:hover {
  background-color: #8A6238;
  border-color: #8A6238;
  color: #FAF6EF;
}

/* -- Secondary CTA: outline cream on dark -- */
body .elementor .cta-final-btn-secondary .elementor-button,
body .elementor a.elementor-button.cta-final-btn-secondary {
  background-color: transparent;
  color: #FAF6EF;
  border: 1px solid #FAF6EF;
  padding: 16px 32px;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border-radius: 0;
  transition: all 0.25s ease;
}

body .elementor .cta-final-btn-secondary .elementor-button:hover,
body .elementor a.elementor-button.cta-final-btn-secondary:hover {
  background-color: #FAF6EF;
  color: #1A1814;
  border-color: #FAF6EF;
}

/* ==========================================================================
   Final CTA — Responsive
   ========================================================================== */

/* Tablet ≤1024px: tighten padding + margins */
@media (max-width: 1024px) {
  body .elementor .dr-cta-final {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
  body .elementor .cta-final-inner .cta-final-h2 .elementor-heading-title {
    font-size: clamp(36px, 5vw, 52px) !important;
  }
}

/* Mobile ≤640px: stack buttons vertically */
@media (max-width: 640px) {
  body .elementor .dr-cta-final {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
  body .elementor .cta-final-inner .cta-final-h2 .elementor-heading-title {
    font-size: 34px !important;
    margin-bottom: 24px !important;
  }
  body .elementor .cta-final-inner .cta-final-p,
  body .elementor .cta-final-inner .cta-final-p p {
    font-size: 16px;
  }
  body .elementor .cta-buttons {
    flex-direction: column !important;
    gap: 12px !important;
  }
  body .elementor .cta-final-btn-primary .elementor-button,
  body .elementor a.elementor-button.cta-final-btn-primary,
  body .elementor .cta-final-btn-secondary .elementor-button,
  body .elementor a.elementor-button.cta-final-btn-secondary {
    width: 100%;
    max-width: 320px;
    padding: 14px 24px;
  }
}

/* end Section 9 — Final CTA */

/* ==========================================================================
   v0.12.1 — Section 9 CTA background color enforcement
   Root cause: Elementor template import did not set the container
   background_background setting reliably, causing the outer <body> or parent
   container dark color to show through instead of the intended #1A1814.
   Fix: reinforce background with high-specificity selector + !important.
   ========================================================================== */

body .elementor-113 .dr-cta-final,
body .elementor section.dr-cta-final,
body .elementor .dr-cta-final.e-con,
body .elementor .dr-cta-final {
  background-color: #1A1814 !important;
}

/* end v0.12.1 */

/* ==========================================================================
   v0.13.0 — Pillar pattern additions (Facial Rejuvenation et al.)
   Added 2026-05-06.
   v0.13.1 hotfix (2026-05-06): explicit grid-column placement on
   .dr-menu-item::before (col 1, span all rows) and on .dr-menu-item > *
   (col 2). Cat. ii / iii items had Heading + Text-Editor as bare grid
   siblings; auto-flow collapsed each heading into the 24px col 1, wrapping
   every character to its own line.
   Used by: Facial Rejuvenation, Skin Quality, Hair Rejuvenation, Long-term Care.
   New namespaces: .dr-menu-* / .dr-timeline / .dr-tl-* / .dr-faq-*
   See _briefs/2026-05-06-facial-rejuvenation/analysis/SECTION_MAP.md §10.
   ========================================================================== */

/* ---------- Section 5: Treatment menu ---------- */
.dr-menu-category:last-child { margin-bottom: 0 !important; }

.dr-menu-header {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 36px;
  align-items: start;
}
@media (max-width: 1024px) {
  .dr-menu-header { grid-template-columns: 70px 1fr; gap: 24px; }
}
@media (max-width: 720px) {
  .dr-menu-header { grid-template-columns: 1fr; gap: 12px; }
}

.dr-menu-items {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px 56px;
}
@media (max-width: 1024px) {
  .dr-menu-items { grid-template-columns: 1fr; gap: 28px; }
}

.dr-menu-item {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 18px;
  align-items: start;
}
.dr-menu-item::before {
  content: "·";
  font-family: 'Fraunces', serif;
  font-style: italic;
  font-size: 18px;
  color: var(--dr-bronze, #A77B4A);
  padding-top: 2px;
  line-height: 1;
  display: block;
  /* v0.13.1: pin the bullet to col 1 spanning all rows; widget children below
     pin themselves to col 2. Without these, Elementor renders Heading + Text-Editor
     as 2 sibling grid items (no wrapper), and grid auto-flow places them in
     col 1 / col 2 of separate rows — collapsing the heading into a 24px-wide
     column where each character wraps onto its own line. See JSON_PATTERNS.md
     "Container CSS grid + ::before + multiple widget children quirk". */
  grid-column: 1;
  grid-row: 1 / span 99;
}
.dr-menu-item > * {
  grid-column: 2;
}

.dr-menu-subgroup {
  margin-top: 36px;
  padding-top: 28px;
  border-top: 1px dashed var(--dr-rule, #D9CFB8);
}

/* ---------- Section 6: Timeline ---------- */
.dr-timeline { width: 100%; }

.dr-tl-track {
  position: relative;
  margin-top: 30px;
}
.dr-tl-track::before {
  content: '';
  position: absolute;
  top: 36px;
  left: 10%;
  right: 10%;
  height: 1px;
  background: var(--dr-rule, #D9CFB8);
  z-index: 0;
}
@media (max-width: 1024px) {
  .dr-tl-track::before { left: 4%; right: 4%; }
}
@media (max-width: 720px) {
  .dr-tl-track::before { display: none; }
}

.dr-tl-step {
  position: relative;
  z-index: 1;
  text-align: center;
  padding: 0 8px;
}
@media (max-width: 720px) {
  .dr-tl-step {
    text-align: left;
    padding: 24px 0;
    border-bottom: 1px solid var(--dr-rule, #D9CFB8);
    display: grid;
    grid-template-columns: 60px 1fr;
    gap: 20px;
    align-items: start;
  }
  .dr-tl-step:last-child { border-bottom: none; }
}

.dr-tl-dot {
  width: 18px;
  height: 18px;
  background: var(--dr-bronze, #A77B4A);
  border: 4px solid var(--dr-cream-deep, #F2EBDC);
  box-shadow: 0 0 0 1px var(--dr-bronze, #A77B4A);
  border-radius: 50%;
  margin: 28px auto 28px;
}
@media (max-width: 720px) {
  .dr-tl-dot {
    margin: 6px 0 0 20px;
    width: 14px;
    height: 14px;
  }
}

/* ---------- Section 8: FAQ ---------- */
.dr-faq-list { border-top: 1px solid var(--dr-rule, #D9CFB8); }

.dr-faq-item {
  border-bottom: 1px solid var(--dr-rule, #D9CFB8);
  padding: 0;
}

.dr-faq-item summary {
  list-style: none;
  cursor: pointer;
  padding: 28px 50px 28px 0;
  font-family: 'Fraunces', serif;
  font-size: 21px;
  font-weight: 400;
  color: var(--dr-ink, #1A1814);
  position: relative;
  transition: color 0.2s;
  line-height: 1.4;
}
.dr-faq-item summary:hover { color: var(--dr-bronze, #A77B4A); }
.dr-faq-item summary::-webkit-details-marker { display: none; }
.dr-faq-item summary::after {
  content: '+';
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  font-family: 'DM Sans', sans-serif;
  font-size: 28px;
  font-weight: 300;
  color: var(--dr-bronze, #A77B4A);
  transition: transform 0.3s;
  line-height: 1;
}
.dr-faq-item[open] summary::after {
  transform: translateY(-50%) rotate(45deg);
}
@media (max-width: 720px) {
  .dr-faq-item summary { font-size: 18px; padding: 22px 40px 22px 0; }
}

.dr-faq-answer {
  padding: 0 50px 32px 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 16px;
  line-height: 1.75;
  color: var(--dr-ink-soft, #2C2822);
}
.dr-faq-answer p { margin: 0 0 14px; }
.dr-faq-answer p:last-child { margin-bottom: 0; }

/* end v0.13.0 / v0.13.1 hotfix */

/* ==========================================================================
   v0.14.0 — Concerns INDEX hub (Phase 5a.2)
   Added 2026-05-10. Hub page card grid + 3-step process explainer.
   New namespaces: .dr-concerns-grid / .dr-concern-* / .dr-process-*
   See _briefs/2026-05-10-concerns-phase-5a/build/build_index.py for the
   matching JSON structure.
   ========================================================================== */

/* ---------- 8-concern card grid ---------- */
.dr-concerns-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--dr-rule, #D9CFB8);
  border: 1px solid var(--dr-rule, #D9CFB8);
}
@media (max-width: 1024px) {
  .dr-concerns-grid { grid-template-columns: 1fr; }
}

.dr-concern-card {
  background: var(--dr-cream, #FAF6EF);
  padding: 44px 40px 40px;
  transition: background 0.25s ease;
}
.dr-concern-card:hover { background: var(--dr-cream-deep, #F2EBDC); }
@media (max-width: 640px) {
  .dr-concern-card { padding: 32px 24px; }
}

/* Card head row: roman numeral + title, baseline-aligned.
   Container is set flex_direction:column in JSON so CSS overrides to row. */
.dr-concern-card-head {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  gap: 18px;
  margin-bottom: 20px;
}

/* Roman numeral eyebrow (Heading widget rendered as <p>) */
.dr-concern-num { flex-shrink: 0; }
.dr-concern-num .elementor-heading-title {
  line-height: 1;
  white-space: nowrap;
}

/* Card title (h3) takes the remaining width */
.dr-concern-title { flex: 1; }

/* Description fills vertical space so the locations row sits at card bottom */
.dr-concern-desc { flex: 1 1 auto; margin-bottom: 24px; }

/* HTML widget wrapping the chip group: pin to card bottom */
.dr-concern-locations-wrap { margin-top: auto; }

.dr-concern-locations {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  padding-top: 20px;
  border-top: 1px solid var(--dr-rule, #D9CFB8);
}

.dr-concern-loc-link {
  font-family: var(--dr-font-body);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--dr-ink, #1A1814);
  text-decoration: none;
  padding: 8px 14px;
  background: var(--dr-soft, #EFE6D6);
  border: 1px solid var(--dr-rule, #D9CFB8);
  display: inline-block;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.dr-concern-loc-link:hover {
  background: var(--dr-bronze, #A77B4A);
  border-color: var(--dr-bronze, #A77B4A);
  color: var(--dr-cream, #FAF6EF);
}

/* Single-location variant: bronze outline only */
.dr-concern-loc-link.dr-concern-loc-single {
  background: transparent;
  border-color: var(--dr-bronze, #A77B4A);
  color: var(--dr-bronze, #A77B4A);
}
.dr-concern-loc-link.dr-concern-loc-single:hover {
  background: var(--dr-bronze, #A77B4A);
  color: var(--dr-cream, #FAF6EF);
}

/* "Altrincham only" / "Urmston only" trailing label */
.dr-concern-loc-only {
  font-family: var(--dr-font-body);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--dr-grey-soft, #9A9089);
  align-self: center;
  margin-left: 4px;
}

/* ---------- 3-step process explainer ---------- */
.dr-process-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 60px;
  position: relative;
}
.dr-process-steps::before {
  content: '';
  position: absolute;
  top: 32px;
  left: 16.66%;
  right: 16.66%;
  height: 1px;
  background: var(--dr-rule, #D9CFB8);
  z-index: 0;
}
@media (max-width: 1024px) {
  .dr-process-steps {
    grid-template-columns: 1fr;
    gap: 50px;
  }
  .dr-process-steps::before { display: none; }
}

.dr-process-step {
  position: relative;
  z-index: 1;
}

/* Wrap the step number Heading widget into a circular bronze-bordered badge.
   The widget wrapper carries the dr-process-step-num class via _css_classes;
   target the widget element to size and shape the circle. */
.elementor-widget.dr-process-step-num {
  width: 64px;
  height: 64px;
  background: var(--dr-cream-deep, #F2EBDC);
  border: 1px solid var(--dr-bronze, #A77B4A);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 28px;
  flex-shrink: 0;
}

/* Closing process-promise paragraph: top + bottom hairlines, max-width centered */
.dr-process-promise {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  padding: 36px 40px;
  border-top: 1px solid var(--dr-rule, #D9CFB8);
  border-bottom: 1px solid var(--dr-rule, #D9CFB8);
}

/* end v0.14.0 */

/* ==========================================================================
   v0.15.0 — Concern × Location landing page (Phase 5a.3.3)
   Added 2026-05-10. Canonical paired-set foundation: Tired Eyes & Dark
   Circles × Altrincham (post-id assigned at build time, parent=889).
   This template will be cloned for Tired Eyes × Urmston in 5a.3.4 and
   structurally inherited by 12 more concern pages in Phases 5b-5d.
   Mockup reference: drraghda_concern_tired_eyes_altrincham_mockup.html
   (lines 367-738 + 1107-1131 + 1169-1211 of inline <style>)
   New namespace: .dr-concern-* — does NOT reuse pillar (.dr-menu-*),
   homepage (.dr-cta-final, .dr-process-*), or INDEX (.dr-concerns-grid)
   classes. Each concern landing page has its own visual contract.
   8 outer Containers per page; class pattern mirrored to css_classes per
   JSON_PATTERNS quirk #1.
   ========================================================================== */

/* ---------- Section 1 — PAGE LEAD ---------- */
.dr-concern-page-lead {
  padding: 90px 0 70px;
  position: relative;
  background: var(--dr-cream, #FAF6EF);
}
.dr-concern-breadcrumb {
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--dr-grey, #6B6157);
  margin-bottom: 32px;
}
.dr-concern-breadcrumb a {
  color: var(--dr-grey, #6B6157);
  transition: color 0.2s;
}
.dr-concern-breadcrumb a:hover { color: var(--dr-bronze, #A77B4A); }
.dr-concern-breadcrumb .sep {
  display: inline-block;
  margin: 0 12px;
  color: var(--dr-grey-soft, #9A9089);
}
.dr-concern-breadcrumb .here {
  color: var(--dr-ink, #1A1814);
  font-weight: 500;
}
.dr-concern-page-lead-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 80px;
  align-items: end;
}
.dr-concern-page-lead .dr-eyebrow {
  display: block;
  margin-bottom: 24px;
}
.dr-concern-page-lead h1,
.dr-concern-page-lead .dr-concern-h1 .elementor-heading-title {
  font-family: var(--dr-font-heading);
  font-size: clamp(48px, 5.6vw, 80px);
  font-weight: 300;
  font-style: italic;
  line-height: 1.05;
  color: var(--dr-ink, #1A1814);
  margin-bottom: 0;
}
.dr-concern-page-lead .accent {
  font-style: normal;
  color: var(--dr-bronze, #A77B4A);
  display: block;
}
.dr-concern-page-lead-side { padding-bottom: 12px; }
.dr-concern-page-lead-side p {
  font-size: 18px;
  line-height: 1.7;
  color: var(--dr-grey, #6B6157);
}
.dr-concern-page-lead-rule {
  margin-top: 80px;
  height: 1px;
  background: var(--dr-rule, #D9CFB8);
  position: relative;
}
.dr-concern-page-lead-rule::before {
  content: '';
  position: absolute;
  top: -1px;
  left: 0;
  width: 80px;
  height: 3px;
  background: var(--dr-bronze, #A77B4A);
}

/* ---------- Section 2 — EMOTIONAL HOOK (pull-quote) ---------- */
.dr-concern-emotional-hook {
  padding: 110px 0 100px;
  background: var(--dr-cream-deep, #F2EBDC);
  text-align: center;
}
.dr-concern-emotional-hook-inner {
  max-width: 880px;
  margin: 0 auto;
  padding: 0 32px;
}
.dr-concern-emotional-hook .dr-eyebrow {
  display: block;
  margin-bottom: 32px;
  text-align: center;
}
.dr-concern-emotional-hook blockquote,
.dr-concern-emotional-hook .dr-concern-pull-quote .elementor-heading-title {
  font-family: var(--dr-font-heading);
  font-size: clamp(32px, 4vw, 48px);
  font-style: italic;
  font-weight: 300;
  line-height: 1.3;
  color: var(--dr-ink, #1A1814);
  margin: 0 0 40px;
  letter-spacing: -0.01em;
}
.dr-concern-pull-quote-supporting {
  max-width: 620px;
  margin: 0 auto;
  font-size: 17px;
  line-height: 1.7;
  color: var(--dr-grey, #6B6157);
}

/* ---------- Section 3 — CONCERN DESCRIPTION ---------- */
.dr-concern-description {
  padding: 130px 0;
  background: var(--dr-cream, #FAF6EF);
}
.dr-concern-description .dr-eyebrow {
  display: block;
  margin-bottom: 18px;
}
.dr-concern-description h2,
.dr-concern-description .dr-concern-description-h2 .elementor-heading-title {
  font-family: var(--dr-font-heading);
  font-size: clamp(38px, 4vw, 56px);
  font-style: italic;
  font-weight: 300;
  line-height: 1.15;
  margin-bottom: 32px;
  color: var(--dr-ink, #1A1814);
}
.dr-concern-description p {
  font-size: 17px;
  line-height: 1.75;
  color: var(--dr-ink-soft, #2C2822);
  margin-bottom: 22px;
}
.dr-concern-description .dr-concern-description-pull {
  font-family: var(--dr-font-heading);
  font-size: 22px;
  font-style: italic;
  line-height: 1.5;
  color: var(--dr-ink, #1A1814);
  padding: 28px 0 28px 32px;
  border-left: 2px solid var(--dr-bronze, #A77B4A);
  margin: 36px 0 12px;
}

/* ---------- Section 4 — TREATMENTS AVAILABLE (story-acts grid) ---------- */
.dr-concern-treatments-grid {
  padding: 130px 0 110px;
  background: var(--dr-cream, #FAF6EF);
}
.dr-concern-treatments-grid-inner {
  display: grid;
  grid-template-columns: 1fr 1.6fr;
  gap: 100px;
  align-items: start;
}
.dr-concern-treatments-head { position: sticky; top: 120px; }
.dr-concern-treatments-head .dr-eyebrow {
  display: block;
  margin-bottom: 24px;
}
.dr-concern-treatments-head h2,
.dr-concern-treatments-head .dr-concern-treatments-h2 .elementor-heading-title {
  font-family: var(--dr-font-heading);
  font-size: clamp(32px, 3.4vw, 44px);
  font-weight: 300;
  font-style: italic;
  line-height: 1.15;
  color: var(--dr-ink, #1A1814);
}
.dr-concern-treatments-list {
  display: flex;
  flex-direction: column;
  gap: 60px;
}
.dr-concern-treatments-opening {
  font-size: 22px;
  line-height: 1.55;
  color: var(--dr-ink, #1A1814);
  font-weight: 400;
  padding-bottom: 50px;
  border-bottom: 1px solid var(--dr-rule, #D9CFB8);
}
.dr-concern-treatment-card {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 40px;
  align-items: start;
}
.dr-concern-treatment-num,
.dr-concern-treatment-num .elementor-heading-title {
  font-family: var(--dr-font-heading);
  font-size: 56px;
  font-weight: 300;
  font-style: italic;
  line-height: 1;
  color: var(--dr-bronze, #A77B4A);
  letter-spacing: -0.02em;
}
.dr-concern-treatment-content h3,
.dr-concern-treatment-content .dr-concern-treatment-h3 .elementor-heading-title {
  font-family: var(--dr-font-heading);
  font-size: 24px;
  font-weight: 400;
  font-style: italic;
  color: var(--dr-ink, #1A1814);
  margin: 0 0 16px;
  line-height: 1.3;
}
.dr-concern-treatment-content p {
  font-size: 17px;
  line-height: 1.75;
  color: var(--dr-grey, #6B6157);
  margin: 0;
}
.dr-concern-inline-link {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--dr-bronze, #A77B4A);
  text-decoration: none;
  border-bottom: 1px solid var(--dr-bronze, #A77B4A);
  padding-bottom: 2px;
  transition: color 0.2s, border-color 0.2s;
}
.dr-concern-inline-link:hover {
  color: var(--dr-bronze-deep, #8A6238);
  border-color: var(--dr-bronze-deep, #8A6238);
}

/* ---------- Section 5 — CONSULTATION PROCESS (4-step) ---------- */
.dr-concern-consultation-timeline {
  padding: 110px 0 100px;
  background: var(--dr-cream-deep, #F2EBDC);
}
.dr-concern-consultation-inner {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 32px;
  text-align: center;
}
.dr-concern-consultation-timeline .dr-eyebrow {
  display: block;
  margin-bottom: 32px;
  text-align: center;
}
.dr-concern-consultation-h2,
.dr-concern-consultation-h2 .elementor-heading-title {
  font-family: var(--dr-font-heading);
  font-size: clamp(28px, 3.4vw, 42px);
  font-style: italic;
  font-weight: 300;
  line-height: 1.25;
  color: var(--dr-ink, #1A1814);
  margin: 0 0 60px;
  text-align: center;
}
.dr-concern-step-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
  text-align: left;
}
.dr-concern-step {
  background: var(--dr-cream, #FAF6EF);
  padding: 32px 28px;
  border-top: 2px solid var(--dr-bronze, #A77B4A);
}
.dr-concern-step-num,
.dr-concern-step-num .elementor-heading-title {
  font-family: var(--dr-font-heading);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.16em;
  color: var(--dr-bronze, #A77B4A);
  margin-bottom: 14px;
  display: block;
}
.dr-concern-step-title,
.dr-concern-step-title .elementor-heading-title {
  font-family: var(--dr-font-heading);
  font-size: 19px;
  font-weight: 400;
  font-style: italic;
  color: var(--dr-ink, #1A1814);
  margin: 0 0 12px;
  line-height: 1.3;
}
.dr-concern-step-desc {
  font-size: 14px;
  line-height: 1.65;
  color: var(--dr-grey, #6B6157);
  margin: 0;
}

/* ---------- Section 6 — PATIENT STORIES (review cards) ---------- */
.dr-concern-stories-grid {
  padding: 130px 0 110px;
  background: var(--dr-cream, #FAF6EF);
}
.dr-concern-stories-head {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 70px;
}
.dr-concern-stories-head .dr-eyebrow {
  display: block;
  margin-bottom: 20px;
}
.dr-concern-stories-head h2,
.dr-concern-stories-head .dr-concern-stories-h2 .elementor-heading-title {
  font-family: var(--dr-font-heading);
  font-size: clamp(32px, 3.6vw, 48px);
  font-weight: 300;
  font-style: italic;
  line-height: 1.15;
  color: var(--dr-ink, #1A1814);
  margin: 0 0 20px;
}
.dr-concern-stories-head p {
  font-size: 17px;
  line-height: 1.7;
  color: var(--dr-grey, #6B6157);
}
.dr-concern-stories-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  margin-bottom: 50px;
}
.dr-concern-story-card {
  background: var(--dr-cream-deep, #F2EBDC);
  padding: 36px 32px;
  display: flex;
  flex-direction: column;
}
.dr-concern-story-stars {
  color: var(--dr-bronze, #A77B4A);
  font-size: 16px;
  letter-spacing: 0.15em;
  margin-bottom: 20px;
}
.dr-concern-story-card blockquote,
.dr-concern-story-card .dr-concern-story-quote {
  font-family: var(--dr-font-heading);
  font-size: 17px;
  font-weight: 300;
  font-style: italic;
  line-height: 1.55;
  color: var(--dr-ink, #1A1814);
  margin: 0 0 24px;
  flex: 1;
}
.dr-concern-story-card cite,
.dr-concern-story-card .dr-concern-story-cite {
  font-style: normal;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--dr-grey, #6B6157);
}
.dr-concern-stories-footer { text-align: center; }

/* ---------- Section 7 — LOCATION CLINIC INFO + CROSS-LINK BRIDGE ---------- */
.dr-concern-clinic-info {
  padding: 130px 0 110px;
  background: var(--dr-cream, #FAF6EF);
}
.dr-concern-clinic-info .dr-concern-clinic-head {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 70px;
}
.dr-concern-clinic-info .dr-concern-clinic-head .dr-eyebrow {
  display: block;
  margin-bottom: 20px;
}
.dr-concern-clinic-info .dr-concern-clinic-head h2,
.dr-concern-clinic-info .dr-concern-clinic-head .dr-concern-clinic-h2 .elementor-heading-title {
  font-family: var(--dr-font-heading);
  font-size: clamp(32px, 3.6vw, 48px);
  font-weight: 300;
  font-style: italic;
  line-height: 1.15;
  color: var(--dr-ink, #1A1814);
  margin-bottom: 20px;
}
.dr-concern-clinic-info .dr-concern-clinic-head p {
  font-size: 17px;
  line-height: 1.7;
  color: var(--dr-grey, #6B6157);
}
.dr-concern-clinic-quick-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--dr-rule, #D9CFB8);
  border: 1px solid var(--dr-rule, #D9CFB8);
  margin-bottom: 60px;
}
.dr-concern-clinic-quick-card {
  background: var(--dr-cream, #FAF6EF);
  padding: 32px 28px;
}
.dr-concern-clinic-quick-card h4,
.dr-concern-clinic-quick-card .dr-concern-clinic-quick-title .elementor-heading-title {
  font-family: var(--dr-font-body);
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--dr-bronze, #A77B4A);
  font-weight: 600;
  margin: 0 0 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--dr-rule, #D9CFB8);
}
.dr-concern-clinic-quick-card address,
.dr-concern-clinic-quick-card p {
  font-style: normal;
  font-size: 15px;
  line-height: 1.65;
  color: var(--dr-grey, #6B6157);
  margin: 0;
}
.dr-concern-clinic-quick-card strong {
  color: var(--dr-ink, #1A1814);
  font-weight: 600;
}

/* Cross-link bridge cards (this-location → paired-location and to all-concerns) */
.dr-concern-bridge-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  margin-bottom: 0;
}
.dr-concern-bridge-card {
  background: var(--dr-cream-deep, #F2EBDC);
  padding: 50px 44px;
  border-top: 3px solid var(--dr-bronze, #A77B4A);
}
.dr-concern-bridge-card .dr-eyebrow {
  display: block;
  margin-bottom: 16px;
  color: var(--dr-bronze, #A77B4A);
}
.dr-concern-bridge-card h3,
.dr-concern-bridge-card .dr-concern-bridge-h3 .elementor-heading-title {
  font-family: var(--dr-font-heading);
  font-size: 26px;
  font-weight: 400;
  font-style: italic;
  color: var(--dr-ink, #1A1814);
  margin: 0 0 14px;
}
.dr-concern-bridge-card p {
  font-size: 16px;
  line-height: 1.7;
  color: var(--dr-grey, #6B6157);
  margin: 0 0 24px;
}
.dr-concern-bridge-card a,
.dr-concern-bridge-card .dr-concern-bridge-link a {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--dr-bronze, #A77B4A);
  text-decoration: none;
  border-bottom: 1px solid var(--dr-bronze, #A77B4A);
  padding-bottom: 4px;
  transition: color 0.2s, border-color 0.2s;
}
.dr-concern-bridge-card a:hover,
.dr-concern-bridge-card .dr-concern-bridge-link a:hover {
  color: var(--dr-bronze-deep, #8A6238);
  border-color: var(--dr-bronze-deep, #8A6238);
}

/* ---------- Section 8 — FINAL CTA (concern-namespaced, dark ink) ---------- */
.dr-concern-cta-final {
  padding: 140px 0;
  background: var(--dr-ink, #1A1814);
  color: var(--dr-cream, #FAF6EF);
  text-align: center;
}
body .elementor section.dr-concern-cta-final,
body .elementor .dr-concern-cta-final.e-con,
body .elementor .dr-concern-cta-final {
  background-color: #21201D !important; /* v0.15.1 hotfix — design-system canonical (kit token 78890ca) */
}
.dr-concern-cta-final .dr-eyebrow {
  color: var(--dr-bronze-soft, #D4B895);
  display: block;
  margin-bottom: 24px;
}
.dr-concern-cta-final h2,
.dr-concern-cta-final .dr-concern-cta-h2 .elementor-heading-title {
  font-family: var(--dr-font-heading);
  font-size: clamp(40px, 5vw, 64px);
  color: var(--dr-cream, #FAF6EF);
  font-style: italic;
  font-weight: 300;
  max-width: 820px;
  margin: 0 auto 32px;
}
.dr-concern-cta-final p {
  font-size: 18px;
  color: var(--dr-grey-soft, #9A9089);
  max-width: 580px;
  margin: 0 auto 48px;
}
.dr-concern-cta-buttons {
  display: flex;
  gap: 16px;
  justify-content: center;
}

/* ---------- Responsive — collapse grids ≤1024px and ≤640px ---------- */
@media (max-width: 1024px) {
  .dr-concern-page-lead-grid,
  .dr-concern-treatments-grid-inner,
  .dr-concern-bridge-grid {
    grid-template-columns: 1fr;
    gap: 50px;
  }
  .dr-concern-step-grid,
  .dr-concern-stories-cards,
  .dr-concern-clinic-quick-grid {
    grid-template-columns: 1fr 1fr;
  }
  .dr-concern-treatments-head { position: static; }
  .dr-concern-page-lead { padding: 60px 0 50px; }
  .dr-concern-emotional-hook,
  .dr-concern-consultation-timeline { padding: 80px 0; }
  .dr-concern-treatments-grid,
  .dr-concern-clinic-info,
  .dr-concern-stories-grid { padding: 80px 0; }
  .dr-concern-treatment-card {
    grid-template-columns: 60px 1fr;
    gap: 24px;
  }
  .dr-concern-treatment-num,
  .dr-concern-treatment-num .elementor-heading-title {
    font-size: 40px;
  }
}

@media (max-width: 640px) {
  .dr-concern-page-lead h1 { font-size: clamp(36px, 8vw, 56px); }
  .dr-concern-emotional-hook blockquote,
  .dr-concern-emotional-hook .dr-concern-pull-quote .elementor-heading-title {
    font-size: clamp(26px, 6vw, 36px);
  }
  .dr-concern-breadcrumb .sep { margin: 0 8px; }
  .dr-concern-bridge-card { padding: 36px 28px; }
  .dr-concern-step-grid,
  .dr-concern-stories-cards,
  .dr-concern-clinic-quick-grid {
    grid-template-columns: 1fr;
  }
  .dr-concern-cta-buttons { flex-direction: column; }
}

/* end v0.15.0 */

/* ==========================================================================
   v0.15.1 hotfix — Final CTA background-color value correction
   Added 2026-05-10 (Phase 5a.3.3 retrospective).
   The defensive !important rule on .dr-concern-cta-final originally
   specified #1A1814 (Ink, kit token primary), inadvertently diverging from
   the design-system canonical #21201D (CTA Background, kit token 78890ca).
   Sándor confirmed the canonical via cross-reference: homepage Final CTA,
   4 pillar Final CTAs, and Concerns INDEX (post 888) Final CTA all render
   #21201D. Only post 890 was the outlier due to this bug.
   Fix: change literal from #1A1814 to #21201D inside the v0.15.0
   .dr-concern-cta-final selector block (no separate ruleset added — the
   value is corrected in place). !important retained for defence-in-depth
   per the v0.12.1 pattern.
   Sources: Sándor visual confirmation, v1 hotfix retrospective notes.
   Lineage: two prior style.css.bak-20260510-pre-v0.15.1{,-cta-bg-fix}
   labels (from v1 / v2 hotfix attempts) become legitimate hotfix
   predecessors with this v0.15.1 release.
   ========================================================================== */

/* end v0.15.1 */


/* === LOCATIONS PAGE (2026-06-18) === */
/* =========================================================================
   LOCATIONS PAGE (2026-06-18) — CSS DELTA
   Appended to wp-content/themes/oceanwp-child/style.css inside a fenced block.

   AUTHORING APPROACH (recommended, see Phase A report):
   - Variables translated from the mockup's bare namespace (--ink, --bronze …)
     to the child theme's live namespace (--dr-ink, --dr-bronze …). The mockup's
     bare --ink/--bronze/etc. are NOT defined in this theme; using them verbatim
     would render the page unstyled. Do NOT restate :root here — the --dr-* tokens
     already exist in style.css (lines ~40-75).
   - Section shells namespaced dr-loc-* to match the house convention
     (dr-concern-*, dr-prices-*). Reuses the shared atoms .dr-eyebrow and the
     CTA button classes .cta-final-btn-primary / .cta-final-btn-secondary.
   - Boxed width comes from the inner wrapper container's boxed_width=1240 +
     32px side padding (same idiom as every built page); no .container rule here.
   - .clinic-map adapted to hold a real Google Maps <iframe> (placeholder
     gradient / pin / label / note rules dropped).
   ========================================================================= */

/* ---------- SECTION 1 · PAGE LEAD ---------- */
.dr-loc-page-lead { background: var(--dr-cream); }
.dr-loc-breadcrumb {
  font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--dr-grey);
}
.dr-loc-breadcrumb a { color: var(--dr-grey); transition: color 0.2s; }
.dr-loc-breadcrumb a:hover { color: var(--dr-bronze); }
.dr-loc-breadcrumb .sep { display: inline-block; margin: 0 12px; color: var(--dr-grey-soft); }
.dr-loc-breadcrumb .here { color: var(--dr-ink); font-weight: 500; }

.dr-loc-page-lead-grid {
  display: grid; grid-template-columns: 1.4fr 1fr; gap: 80px; align-items: end;
}
.dr-loc-page-lead-h1 .elementor-heading-title,
.dr-loc-page-lead-h1 {
  font-family: var(--dr-font-heading); font-size: clamp(48px, 5.6vw, 80px);
  font-weight: 300; font-style: italic; line-height: 1.05; color: var(--dr-ink);
}
.dr-loc-page-lead-h1 .accent { font-style: normal; color: var(--dr-bronze); display: block; }
.dr-loc-page-lead-side p { font-size: 18px; line-height: 1.7; color: var(--dr-grey); }
.dr-loc-page-lead-rule {
  margin-top: 80px; height: 1px; background: var(--dr-rule); position: relative;
}
.dr-loc-page-lead-rule::before {
  content: ''; position: absolute; top: -1px; left: 0; width: 80px; height: 3px;
  background: var(--dr-bronze);
}

/* ---------- SECTION 2 · LOCATIONS OVERVIEW ---------- */
.dr-loc-overview { background: var(--dr-cream-deep); }
.dr-loc-overview-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.dr-loc-overview-card {
  background: var(--dr-cream); padding: 50px 44px 44px;
  border-top: 3px solid var(--dr-bronze); display: flex; flex-direction: column;
}
.dr-loc-overview-marker { display: flex; align-items: baseline; gap: 14px; margin-bottom: 24px; }
.dr-loc-overview-num,
.dr-loc-overview-num .elementor-heading-title {
  font-family: var(--dr-font-heading); font-size: 36px; font-style: italic;
  font-weight: 300; color: var(--dr-bronze); line-height: 1;
}
.dr-loc-overview-label,
.dr-loc-overview-label .elementor-heading-title {
  font-family: var(--dr-font-body);
  font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--dr-grey); font-weight: 600;
}
.dr-loc-overview-card .dr-loc-overview-h2 .elementor-heading-title,
.dr-loc-overview-h2 {
  font-family: var(--dr-font-heading); font-size: 28px; font-weight: 400;
  font-style: italic; color: var(--dr-ink); line-height: 1.2;
}
.dr-loc-overview-address {
  font-style: normal; font-size: 16px; line-height: 1.6; color: var(--dr-ink-soft);
}
.dr-loc-overview-address strong { color: var(--dr-ink); font-weight: 600; }
.dr-loc-overview-meta { list-style: none; padding: 0; margin: 0; }
.dr-loc-overview-meta li {
  font-size: 15px; line-height: 1.6; color: var(--dr-grey); padding: 6px 0;
  border-bottom: 1px solid var(--dr-rule);
}
.dr-loc-overview-meta li:last-child { border-bottom: none; }
.dr-loc-overview-meta strong { color: var(--dr-ink); font-weight: 600; }
.dr-loc-overview-link {
  font-size: 13px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--dr-bronze); text-decoration: none;
  border-bottom: 1px solid var(--dr-bronze); padding-bottom: 4px; align-self: flex-start;
  transition: color 0.2s, border-color 0.2s;
}
.dr-loc-overview-link:hover { color: var(--dr-bronze-deep); border-color: var(--dr-bronze-deep); }

/* ---------- SECTION 3/4 · CLINIC DETAIL ---------- */
.dr-loc-clinic-detail { background: var(--dr-cream); }
.dr-loc-clinic-detail-alt { background: var(--dr-cream-deep); }
.dr-loc-clinic-detail-head {
  display: grid; grid-template-columns: 100px 1fr; gap: 40px; align-items: start;
  max-width: 920px;
}
.dr-loc-clinic-num,
.dr-loc-clinic-num .elementor-heading-title {
  font-family: var(--dr-font-heading); font-size: 64px; font-weight: 300;
  font-style: italic; line-height: 1; color: var(--dr-bronze); letter-spacing: -0.02em;
}
.dr-loc-clinic-detail-head .dr-loc-clinic-h2 .elementor-heading-title,
.dr-loc-clinic-h2 {
  font-family: var(--dr-font-heading); font-size: clamp(36px, 4vw, 52px);
  font-weight: 300; font-style: italic; line-height: 1.1; color: var(--dr-ink);
}
.dr-loc-clinic-lede,
.dr-loc-clinic-lede p { font-size: 18px; line-height: 1.7; color: var(--dr-grey); max-width: 620px; }

.dr-loc-clinic-detail-grid {
  display: grid; grid-template-columns: 1fr 1.1fr; gap: 60px;
}
.dr-loc-clinic-map-wrap { display: flex; flex-direction: column; gap: 20px; }
/* map holds a real Google Maps <iframe> (address-based, no API key) */
.dr-loc-clinic-map {
  border: 1px solid var(--dr-rule); aspect-ratio: 1 / 1.1; overflow: hidden;
  background: var(--dr-soft);
}
.dr-loc-clinic-map iframe { width: 100%; height: 100%; border: 0; display: block; }

.dr-loc-clinic-info { display: grid; grid-template-columns: 1fr 1fr; gap: 36px 40px; }
.dr-loc-info-block h4 {
  font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--dr-bronze); font-weight: 600; margin: 0 0 16px; padding-bottom: 12px;
  border-bottom: 1px solid var(--dr-rule);
}
.dr-loc-info-block address {
  font-style: normal; font-size: 16px; line-height: 1.7; color: var(--dr-ink-soft);
}
.dr-loc-info-block address strong { color: var(--dr-ink); font-weight: 600; }
.dr-loc-info-block ul { list-style: none; padding: 0; margin: 0; }
.dr-loc-info-block ul li { font-size: 15px; line-height: 1.65; color: var(--dr-grey); padding: 6px 0; }
.dr-loc-info-block strong { color: var(--dr-ink); font-weight: 600; }

.dr-loc-clinic-areas {
  display: grid; grid-template-columns: 200px 1fr; gap: 40px; align-items: start;
  padding-top: 36px; border-top: 1px solid var(--dr-rule);
}
.dr-loc-clinic-areas-label,
.dr-loc-clinic-areas-label .elementor-heading-title {
  font-family: var(--dr-font-body);
  font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--dr-bronze); font-weight: 600;
}
.dr-loc-clinic-areas-list { font-size: 16px; line-height: 1.7; color: var(--dr-grey); }

/* ---------- SECTION 5 · COMMON INFO ---------- */
.dr-loc-common-info { background: var(--dr-cream); }
.dr-loc-common-info-head { text-align: center; max-width: 760px; margin: 0 auto 80px; }
.dr-loc-common-info-head .dr-loc-common-h2 .elementor-heading-title,
.dr-loc-common-h2 {
  font-family: var(--dr-font-heading); font-size: clamp(32px, 3.6vw, 48px);
  font-weight: 300; font-style: italic; line-height: 1.15; color: var(--dr-ink);
}
.dr-loc-common-info-head p { font-size: 17px; line-height: 1.7; color: var(--dr-grey); }
.dr-loc-common-info-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px;
  background: var(--dr-rule); border: 1px solid var(--dr-rule);
}
.dr-loc-common-info-item { background: var(--dr-cream); padding: 40px 36px; }
.dr-loc-common-info-num,
.dr-loc-common-info-num .elementor-heading-title {
  font-family: var(--dr-font-heading); font-size: 14px; font-weight: 600;
  letter-spacing: 0.16em; color: var(--dr-bronze); margin-bottom: 16px;
}
.dr-loc-common-info-item .dr-loc-common-item-h3 .elementor-heading-title,
.dr-loc-common-item-h3 {
  font-family: var(--dr-font-heading); font-size: 22px; font-weight: 400;
  font-style: italic; color: var(--dr-ink); line-height: 1.3;
}
.dr-loc-common-info-item p { font-size: 15px; line-height: 1.7; color: var(--dr-grey); margin: 0; }
.dr-loc-common-info-item strong { color: var(--dr-ink); font-weight: 600; }

/* ---------- SECTION 6 · BRIDGE ---------- */
.dr-loc-bridge { background: var(--dr-cream); }
.dr-loc-bridge-head { text-align: center; max-width: 720px; margin: 0 auto 70px; }
.dr-loc-bridge-head .dr-loc-bridge-h2 .elementor-heading-title,
.dr-loc-bridge-h2 {
  font-family: var(--dr-font-heading); font-size: clamp(32px, 3.6vw, 48px);
  font-weight: 300; font-style: italic; line-height: 1.15; color: var(--dr-ink);
}
.dr-loc-bridge-head p { font-size: 17px; line-height: 1.7; color: var(--dr-grey); }
.dr-loc-bridge-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.dr-loc-bridge-card {
  background: var(--dr-cream-deep); padding: 50px 44px; border-top: 3px solid var(--dr-bronze);
}
.dr-loc-bridge-card .dr-loc-bridge-h3 .elementor-heading-title,
.dr-loc-bridge-h3 {
  font-family: var(--dr-font-heading); font-size: 26px; font-weight: 400;
  font-style: italic; color: var(--dr-ink);
}
.dr-loc-bridge-card p { font-size: 16px; line-height: 1.7; color: var(--dr-grey); }
.dr-loc-bridge-link {
  font-size: 13px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--dr-bronze); text-decoration: none;
  border-bottom: 1px solid var(--dr-bronze); padding-bottom: 4px;
  transition: color 0.2s, border-color 0.2s;
}
.dr-loc-bridge-link:hover { color: var(--dr-bronze-deep); border-color: var(--dr-bronze-deep); }

/* ---------- light-background outline button (map "Open in Google Maps") ---------- */
body .elementor .dr-loc-btn-map .elementor-button,
body .elementor a.elementor-button.dr-loc-btn-map {
  background: transparent; color: var(--dr-ink); border: 1px solid var(--dr-ink);
  border-radius: 0; letter-spacing: 0.08em; text-transform: uppercase;
  font-weight: 500; font-size: 13px;
}
body .elementor .dr-loc-btn-map .elementor-button:hover,
body .elementor a.elementor-button.dr-loc-btn-map:hover {
  background: var(--dr-ink); color: var(--dr-cream);
}

/* ---------- RESPONSIVE (mockup breakpoints 1024 / 640) ---------- */
@media (max-width: 1024px) {
  .dr-loc-page-lead-grid { grid-template-columns: 1fr; gap: 50px; }
  .dr-loc-overview-grid,
  .dr-loc-clinic-detail-grid,
  .dr-loc-clinic-info,
  .dr-loc-bridge-grid { grid-template-columns: 1fr; gap: 36px; }
  .dr-loc-clinic-detail-head { grid-template-columns: 70px 1fr; gap: 24px; }
  .dr-loc-clinic-num { font-size: 48px; }
  .dr-loc-clinic-areas { grid-template-columns: 1fr; gap: 16px; }
  .dr-loc-common-info-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .dr-loc-bridge-card { padding: 36px 28px; }
  .dr-loc-overview-card { padding: 36px 28px; }
  .dr-loc-common-info-grid { grid-template-columns: 1fr; }
  .dr-loc-common-info-item { padding: 32px 28px; }
  .dr-loc-clinic-map { aspect-ratio: 1 / 1; }
}

/* ---------- RULE-FIX (2026-07-06): defeat Elementor .e-con container defaults ----------
   Both stripes are hosted on real Elementor containers, so Elementor's frontend base CSS
   applies default gap (var(--widgets-spacing,20px)) and default padding (10px) at render
   time, overriding the bare gap:1px / height:1px above. Out-specify + !important the same
   way the crisp pillar-grid does. */
body .elementor .dr-loc-common-info-grid { gap: 1px !important; padding: 0 !important; }
body .elementor .dr-loc-page-lead-rule   { padding: 0 !important; height: 1px; line-height: 0; font-size: 0; }
/* === END LOCATIONS PAGE (2026-06-18) === */

/* ============================================================
   v0.16.1 — MOBILE SLIDE-IN MENU HOTFIX (2026-07-15)
   The dropdown nav is reparented to <body> by mobile-menu.js
   (class .drr-mm-panel) to escape the header stacking context.
   Open state driven by body.drr-mm-open. Widget-scoped Elementor
   typography no longer reaches the moved nav, so type is declared
   here explicitly (values from EXTRACT_REPORT A2). Supersedes the
   v0.16.0 block entirely.
   ============================================================ */
@media (max-width: 1024px) {

  /* --- panel base (closed) --- */
  nav.elementor-nav-menu--dropdown.drr-mm-panel {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    width: min(84vw, 340px) !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 999999 !important;
    background: #1A1814 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    box-shadow: -18px 0 48px rgba(0, 0, 0, 0.35);
    animation: none !important;
    transform: translateX(100%) !important;
    visibility: hidden;
    transition:
      transform 0.42s cubic-bezier(0.32, 0.72, 0.24, 1),
      visibility 0s linear 0.42s !important;
  }

  /* --- panel open --- */
  body.drr-mm-open nav.drr-mm-panel {
    transform: translateX(0) !important;
    visibility: visible;
    animation: none !important;
    transition:
      transform 0.42s cubic-bezier(0.32, 0.72, 0.24, 1),
      visibility 0s !important;
  }

  /* --- injected head: pure black, centered logo, close button --- */
  .drr-mm-panel .drr-mm-head {
    position: relative;
    padding: 24px 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #000000;
    border-bottom: 1px solid rgba(250, 246, 239, 0.10);
    flex: 0 0 auto;
  }
  .drr-mm-panel .drr-mm-head img {
    width: 228px;
    height: auto;
    display: block;
  }
  .drr-mm-panel .drr-mm-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 40px;
    height: 40px;
    background: transparent;
    border: none;
    color: #FAF6EF;
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
    opacity: 0.75;
    transition: opacity 0.25s ease, transform 0.25s ease;
  }
  .drr-mm-panel .drr-mm-close:hover {
    opacity: 1;
    transform: rotate(90deg);
  }

  /* --- nav list fills the middle, scrolls if needed --- */
  .drr-mm-panel > ul.elementor-nav-menu {
    flex: 1 1 auto;
    overflow-y: auto;
    margin: 14px 0 0 !important;
    padding: 0 !important;
    list-style: none;
    background: transparent !important;
  }

  /* --- items: type declared explicitly (widget CSS no longer reaches
         the reparented nav); cream on ink, defeats stock dropdown
         white bg / dark text defaults --- */
  .drr-mm-panel li.menu-item {
    background: transparent !important;
    border-bottom: 1px solid rgba(250, 246, 239, 0.10);
    opacity: 0;
    transform: translateX(24px);
    transition: opacity 0.3s ease, transform 0.3s ease;
  }
  body.drr-mm-open .drr-mm-panel li.menu-item {
    opacity: 1;
    transform: none;
  }
  body.drr-mm-open .drr-mm-panel li.menu-item:nth-child(1) { transition-delay: 0.08s; }
  body.drr-mm-open .drr-mm-panel li.menu-item:nth-child(2) { transition-delay: 0.12s; }
  body.drr-mm-open .drr-mm-panel li.menu-item:nth-child(3) { transition-delay: 0.16s; }
  body.drr-mm-open .drr-mm-panel li.menu-item:nth-child(4) { transition-delay: 0.20s; }
  body.drr-mm-open .drr-mm-panel li.menu-item:nth-child(5) { transition-delay: 0.24s; }
  body.drr-mm-open .drr-mm-panel li.menu-item:nth-child(6) { transition-delay: 0.28s; }
  body.drr-mm-open .drr-mm-panel li.menu-item:nth-child(7) { transition-delay: 0.32s; }

  .drr-mm-panel a.elementor-item {
    display: block !important;
    padding: 16px 26px !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.2px !important;
    color: #FAF6EF !important;
    background: transparent !important;
    text-decoration: none;
    transition: color 0.25s ease, padding-left 0.25s ease;
  }
  .drr-mm-panel a.elementor-item:hover,
  .drr-mm-panel a.elementor-item:focus,
  .drr-mm-panel a.elementor-item.drr-current {
    color: #D4B895 !important; /* Bronze Soft */
    background: transparent !important;
    padding-left: 34px !important;
  }

  /* --- injected foot: phone + Book Consultation, pinned to bottom --- */
  .drr-mm-panel .drr-mm-foot {
    flex: 0 0 auto;
    padding: 22px 26px 30px;
    border-top: 1px solid rgba(250, 246, 239, 0.10);
  }
  .drr-mm-panel .drr-mm-tel {
    display: block;
    color: rgba(250, 246, 239, 0.72);
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    letter-spacing: 0.06em;
    text-decoration: none;
    margin-bottom: 16px;
  }
  .drr-mm-panel .drr-mm-cta {
    display: block;
    text-align: center;
    background: #A77B4A;
    color: #FAF6EF !important;
    font-family: 'DM Sans', sans-serif;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 15px 18px;
    transition: background 0.25s ease;
  }
  .drr-mm-panel .drr-mm-cta:hover {
    background: #8A6238;
  }

  /* --- overlay: root level, one step below the panel --- */
  .drr-mm-overlay {
    position: fixed;
    inset: 0;
    background: rgba(12, 10, 8, 0.55);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.35s ease;
    z-index: 999998;
  }
  body.drr-mm-open .drr-mm-overlay {
    opacity: 1;
    pointer-events: auto;
  }
  body.drr-mm-open {
    overflow: hidden !important;
  }

  /* --- reduced motion --- */
  @media (prefers-reduced-motion: reduce) {
    nav.elementor-nav-menu--dropdown.drr-mm-panel,
    .drr-mm-panel li.menu-item,
    .drr-mm-panel a.elementor-item,
    .drr-mm-close,
    .drr-mm-overlay {
      transition: none !important;
    }
  }
}
/* === END v0.16.1 MOBILE SLIDE-IN MENU HOTFIX (2026-07-15) === */

/* ============================================================
   v0.17.0 — MENU ACTIVE-STATE FIX + COMPACT MOBILE HEADER
   (2026-07-15)
   Part 1: neutralises Elementor stock active-item painting
   (.elementor-item-active { background:#3f444b; color:#fff })
   inside the reparented slide-in panel — C1 H3 CONFIRMED: plain
   URLs mark the current item server-side. Intended current
   style = Bronze Soft text, transparent bg (same as .drr-current).
   Part 2: one-row compact header at ≤1024px. Container IDs from
   C1.4: inner 1393e25, LEFT 725c319 (logo), CENTER 1ec13da (nav),
   RIGHT 2323617 (tel+CTA — hidden; both duplicated in the panel
   foot). Post 34 untouched — CSS only.
   ============================================================ */
@media (max-width: 1024px) {

  /* --- Part 1: panel active item = bronze soft, no stock slab --- */
  .drr-mm-panel a.elementor-item.elementor-item-active,
  .drr-mm-panel a.elementor-item[aria-current="page"],
  .drr-mm-panel li.current-menu-item > a.elementor-item,
  .drr-mm-panel li.current_page_item > a.elementor-item {
    background: transparent !important;
    background-color: transparent !important;
    color: #D4B895 !important; /* Bronze Soft — matches .drr-current */
    padding-left: 34px !important;
  }

  /* --- Part 2: compact one-row header --- */

  /* hide phone + Book a Consultation (both live in the panel foot) */
  .elementor-element-2323617 {
    display: none !important;
  }

  /* logo centred, burger pinned right (v0.18.0; was: logo left, burger right) */
  .elementor-element-1393e25 > .e-con-inner {
    position: relative !important;      /* v0.18.0 */
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important; /* v0.18.0: was space-between */
  }

  /* v0.18.0: burger box out of flow, pinned right, so the logo centres across the full bar */
  .elementor-element-1ec13da {
    position: absolute !important;
    right: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    display: flex !important;
    align-items: center !important;
    z-index: 2 !important;
  }
  .elementor-element-725c319,
  .elementor-element-1ec13da {
    width: auto !important;
    max-width: none !important;
    flex: 0 0 auto !important;
  }

  /* logo down from full 832px render to a header-scale mark */
  .elementor-element-725c319 img {
    width: 210px !important; /* v0.18.0: was 150px (+40%) */
    height: auto !important;
  }

  /* keep the nav widget's burger flush right in its auto-width box */
  .elementor-element-1ec13da .elementor-element-d0b2166 .elementor-menu-toggle {
    margin-left: auto;
  }

  /* tighten the header slab */
  .elementor-element-48e0700 {
    padding-top: 14px !important;
    padding-bottom: 14px !important;
  }
}

/* phone-size refinement */
@media (max-width: 767px) {
  .elementor-element-725c319 img {
    width: 185px !important; /* v0.18.0: was 132px (+40%) */
  }
}
/* === END v0.17.0 MENU ACTIVE-STATE FIX + COMPACT MOBILE HEADER (2026-07-15) === */

/* ============================================================
   v0.17.1 — DESKTOP GHOST-MENU HOTFIX (2026-07-15)
   The reparented .drr-mm-panel lives at the end of <body>; above
   the 1024px gate no panel rule applies and the stock adjacency
   rules that once hid the dropdown no longer match the moved
   element, so it painted below the footer on desktop. The panel
   is a ≤1024px-only construct — hide it outright above that.
   ============================================================ */
@media (min-width: 1025px) {
  nav.elementor-nav-menu--dropdown.drr-mm-panel,
  .drr-mm-overlay {
    display: none !important;
  }
}
/* === END v0.17.1 DESKTOP GHOST-MENU HOTFIX (2026-07-15) === */
/* =====================================================================
   CASE STUDY PAGE  ·  dr-cs-*  ·  v0.19.0 (2026-07-19)
   Scoped, self-contained (literal hex, no __globals__). Layout for the
   /case-studies/ leaf page; Elementor widgets carry content only.
   Append verbatim to oceanwp-child/style.css and bump Version to 0.19.0.
   ===================================================================== */

.dr-cs-container{max-width:1080px;margin:0 auto;padding:0 32px;width:100%;}

/* section rhythm */
.dr-cs-sec{padding:70px 0;}
.dr-cs-sec-alt{background:#F2EBDC;}

/* breadcrumb (global header has none — mirror the concern pattern) */
.dr-cs-breadcrumb{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#6B6157;padding:26px 0 0;}
.dr-cs-breadcrumb a{color:#6B6157;text-decoration:none;transition:color .2s;}
.dr-cs-breadcrumb a:hover{color:#A77B4A;}
.dr-cs-breadcrumb .sep{margin:0 10px;color:#9A9089;}
.dr-cs-breadcrumb .here{color:#1A1814;font-weight:500;}

/* hero band — set as an Elementor CONTAINER background image (background_image + size:cover + position) */
.dr-cs-hero-band{min-height:400px;background-color:#1A1814;background-size:cover;background-position:center 32%;background-repeat:no-repeat;}

/* lead */
.dr-cs-eyebrow{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:#A77B4A;font-weight:500;font-family:'DM Sans',sans-serif;display:block;}
.dr-cs-lead-grid h1{font-family:'Fraunces',serif;font-size:clamp(38px,5vw,60px);font-weight:300;font-style:italic;line-height:1.05;color:#1A1814;letter-spacing:-.01em;margin:0;}
.dr-cs-lead-grid h1 .accent{color:#A77B4A;}
.dr-cs-lead-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:56px;margin-top:30px;align-items:end;}
.dr-cs-lead-body p{font-size:17.5px;line-height:1.78;color:#2C2822;margin:0 0 18px;}
.dr-cs-attrib{border-left:2px solid #A77B4A;padding:6px 0 6px 20px;font-size:14px;color:#6B6157;line-height:1.6;display:flex;gap:16px;align-items:center;}
.dr-cs-attrib img{width:56px;height:56px;border-radius:50%;object-fit:cover;flex:0 0 auto;}
.dr-cs-attrib strong{color:#1A1814;font-weight:500;}
.dr-cs-links{margin-top:20px;display:flex;gap:22px;flex-wrap:wrap;}
.dr-cs-xlink{font-size:12.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#A77B4A;border-bottom:1px solid #A77B4A;padding-bottom:2px;text-decoration:none;}
.dr-cs-xlink:hover{color:#8A6238;border-color:#8A6238;}

.dr-cs-rule{height:1px;background:#D9CFB8;margin:52px 0;position:relative;}
.dr-cs-rule::before{content:'';position:absolute;top:-1px;left:0;width:72px;height:3px;background:#A77B4A;}

.dr-cs-prose{max-width:760px;margin:0 auto;}
.dr-cs-prose p{font-size:17.5px;line-height:1.8;color:#2C2822;margin:0 0 22px;}

/* image slots — inline <img> inside the section HTML fills the aspect-ratio box */
.dr-cs-slot{border:1px solid #D9CFB8;border-radius:2px;overflow:hidden;background:#F2EBDC;position:relative;}
.dr-cs-slot img{width:100%;height:100%;object-fit:cover;display:block;}

/* patient profile */
.dr-cs-profile{display:grid;grid-template-columns:1fr 1.5fr;gap:48px;align-items:center;}
.dr-cs-profile .dr-cs-slot{aspect-ratio:4/5;background:#fff;display:flex;align-items:center;justify-content:center;}
.dr-cs-profile .dr-cs-slot img{object-fit:contain;padding:14px;}
.dr-cs-profile h2{font-family:'Fraunces',serif;font-size:clamp(28px,3.4vw,40px);font-style:italic;font-weight:300;margin:0 0 22px;color:#1A1814;}
.dr-cs-pf-list{list-style:none;margin:0;padding:0;}
.dr-cs-pf-list li{padding:12px 0;border-bottom:1px solid #D9CFB8;display:grid;grid-template-columns:150px 1fr;gap:16px;font-size:15.5px;color:#2C2822;}
.dr-cs-pf-list li span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#A77B4A;padding-top:3px;}

/* section head */
.dr-cs-shead{max-width:760px;margin:0 auto 44px;text-align:center;}
.dr-cs-shead .dr-cs-eyebrow{margin-bottom:18px;}
.dr-cs-shead h2{font-family:'Fraunces',serif;font-size:clamp(30px,3.6vw,46px);font-style:italic;font-weight:300;color:#1A1814;}
.dr-cs-shead p{margin-top:18px;color:#6B6157;font-size:16px;line-height:1.65;}

/* GP-led approach cards */
.dr-cs-approach{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.dr-cs-acard{background:#F2EBDC;border-top:2px solid #A77B4A;padding:34px 30px;}
.dr-cs-sec-alt .dr-cs-acard{background:#fff;}
.dr-cs-acard .num{font-family:'Fraunces',serif;font-style:italic;font-size:42px;color:#A77B4A;line-height:1;margin-bottom:16px;}
.dr-cs-acard h3{font-family:'Fraunces',serif;font-size:20px;font-style:italic;font-weight:400;margin:0 0 14px;color:#1A1814;}
.dr-cs-acard p{font-size:14.5px;color:#6B6157;line-height:1.65;margin:0 0 8px;}
.dr-cs-acard ul{margin:12px 0 0;padding-left:18px;}
.dr-cs-acard li{font-size:14px;color:#6B6157;line-height:1.6;margin-bottom:5px;}

/* dark science box */
.dr-cs-science{background:#1A1814;color:#FAF6EF;padding:52px;border-radius:2px;display:grid;grid-template-columns:1fr 260px;gap:48px;align-items:center;}
.dr-cs-science .dr-cs-eyebrow{color:#D4B895;margin-bottom:16px;}
.dr-cs-science h2{font-family:'Fraunces',serif;color:#FAF6EF;font-size:30px;font-style:italic;font-weight:300;margin:0 0 20px;}
.dr-cs-science p{font-size:15px;color:#d8d0c4;line-height:1.7;margin:0 0 16px;}
.dr-cs-science .vwrap{display:flex;align-items:center;justify-content:center;}
.dr-cs-science .vwrap img{max-height:340px;width:auto;display:block;}
.dr-cs-stats{display:flex;gap:26px;flex-wrap:wrap;margin:20px 0;}
.dr-cs-stat b{display:block;font-family:'Fraunces',serif;font-size:30px;color:#D4B895;font-weight:400;}
.dr-cs-stat span{font-size:11.5px;color:#9A9089;letter-spacing:.04em;}
.dr-cs-science .fine{font-size:11.5px;color:#9A9089;line-height:1.55;}

/* before / after */
.dr-cs-ba-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;}
.dr-cs-ba-pair{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.dr-cs-ba-pair .dr-cs-slot{aspect-ratio:3/4;}
.dr-cs-ba-tag{position:absolute;bottom:10px;left:10px;background:#1A1814;color:#FAF6EF;font-size:10px;letter-spacing:.14em;padding:4px 9px;z-index:2;}

/* quote */
.dr-cs-quote{max-width:820px;margin:0 auto;text-align:center;}
.dr-cs-quote .mark{font-family:'Fraunces',serif;font-size:60px;color:#A77B4A;line-height:.5;margin-bottom:18px;}
.dr-cs-quote blockquote{font-family:'Fraunces',serif;font-size:clamp(24px,3vw,34px);font-style:italic;font-weight:300;line-height:1.4;color:#1A1814;margin:0;}
.dr-cs-quote cite{display:block;margin-top:24px;font-style:normal;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#6B6157;}

/* clinical assessment (image + prose) */
.dr-cs-assess{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;}
.dr-cs-assess .dr-cs-slot{aspect-ratio:4/3;}
.dr-cs-assess p{font-size:16.5px;line-height:1.75;color:#2C2822;margin:0 0 18px;}

/* CTA */
.dr-cs-cta{background:#F2EBDC;text-align:center;padding:76px 0;}
.dr-cs-cta h2{font-family:'Fraunces',serif;font-size:clamp(28px,3.4vw,42px);font-style:italic;font-weight:300;margin:0 0 24px;color:#1A1814;}
.dr-cs-btn{display:inline-block;background:#1A1814;color:#FAF6EF;padding:15px 34px;font-size:13px;letter-spacing:.1em;text-transform:uppercase;font-weight:500;text-decoration:none;transition:background .25s;}
.dr-cs-btn:hover{background:#A77B4A;}
.dr-cs-disc{max-width:760px;margin:26px auto 0;font-size:12.5px;color:#6B6157;line-height:1.6;font-style:italic;}
.dr-cs-disc a{color:#A77B4A;border-bottom:1px solid #A77B4A;text-decoration:none;}

/* ---- /case-studies/ index card (parent page) — reuses the dr-cs look ---- */
.dr-cs-index-grid{display:grid;grid-template-columns:1fr;gap:26px;max-width:900px;margin:0 auto;}
.dr-cs-index-card{background:#fff;border:1px solid #D9CFB8;border-left:3px solid #A77B4A;padding:0;display:grid;grid-template-columns:230px 1fr;overflow:hidden;text-decoration:none;transition:box-shadow .25s;}
.dr-cs-index-card:hover{box-shadow:0 14px 34px rgba(26,24,20,.1);}
.dr-cs-index-card .thumb{overflow:hidden;}
.dr-cs-index-card .thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.dr-cs-index-card .body{padding:30px 34px;}
.dr-cs-index-card .body .dr-cs-eyebrow{margin-bottom:10px;}
.dr-cs-index-card .body h3{font-family:'Fraunces',serif;font-size:24px;font-style:italic;font-weight:400;margin:0 0 10px;color:#1A1814;}
.dr-cs-index-card .body p{font-size:14.5px;color:#6B6157;line-height:1.6;margin:0 0 14px;}
.dr-cs-index-card .body .go{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#A77B4A;}

/* ---- responsive ---- */
@media (max-width:1024px){
  .dr-cs-science{grid-template-columns:1fr;gap:30px;padding:40px;}
}
@media (max-width:820px){
  .dr-cs-lead-grid,.dr-cs-profile,.dr-cs-ba-grid,.dr-cs-approach,.dr-cs-assess{grid-template-columns:1fr;gap:30px;}
  .dr-cs-hero-band{height:260px;}
  .dr-cs-index-card{grid-template-columns:1fr;}
  .dr-cs-index-card .thumb{aspect-ratio:16/9;}
  .dr-cs-sec{padding:52px 0;}
}
@media (max-width:560px){
  .dr-cs-pf-list li{grid-template-columns:1fr;gap:2px;}
  .dr-cs-ba-pair{gap:8px;}
  .dr-cs-stats{gap:18px;}
}
/* =========== CASE STUDIES INDEX — editorial featured layout · v0.19.1 (2026-07-19) =========== */
.dr-cs-index-lead{text-align:center;}
.dr-cs-index-lead .dr-cs-eyebrow{margin-bottom:20px;}
.dr-cs-index-lead h1{font-family:'Fraunces',serif;font-size:clamp(40px,5vw,60px);font-weight:300;font-style:italic;color:#1A1814;margin:0;}
.dr-cs-index-lead p{max-width:640px;margin:22px auto 0;color:#6B6157;font-size:17px;line-height:1.7;}
.dr-cs-index-lead .divider{width:64px;height:3px;background:#A77B4A;margin:34px auto 0;}
.dr-cs-feature{display:grid;grid-template-columns:1.12fr 1fr;background:#fff;border:1px solid #D9CFB8;overflow:hidden;max-width:1080px;margin:0 auto;text-decoration:none;transition:box-shadow .3s;}
.dr-cs-feature:hover{box-shadow:0 24px 60px rgba(26,24,20,.13);}
.dr-cs-feature .fimg{min-height:480px;background-size:cover;background-position:center 28%;position:relative;}
.dr-cs-feature .ftag{position:absolute;top:22px;left:22px;background:rgba(26,24,20,.86);color:#FAF6EF;font-size:10px;letter-spacing:.16em;text-transform:uppercase;padding:7px 13px;}
.dr-cs-feature .fbody{padding:60px 56px;display:flex;flex-direction:column;justify-content:center;}
.dr-cs-feature .fnum{font-family:'Fraunces',serif;font-style:italic;font-size:44px;color:#A77B4A;line-height:1;margin-bottom:16px;}
.dr-cs-feature .fbody .dr-cs-eyebrow{margin-bottom:14px;}
.dr-cs-feature h2{font-family:'Fraunces',serif;font-size:clamp(28px,3vw,36px);font-weight:300;font-style:italic;color:#1A1814;margin:0 0 18px;}
.dr-cs-feature .fmeta{margin:0 0 20px;}
.dr-cs-chip{display:inline-block;border:1px solid #D9CFB8;border-radius:999px;padding:5px 13px;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:#6B6157;margin:0 6px 8px 0;}
.dr-cs-feature .fdesc{font-size:15.5px;color:#6B6157;line-height:1.7;margin:0 0 26px;}
.dr-cs-feature .fgo{font-size:12.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#A77B4A;border-bottom:1px solid #A77B4A;padding-bottom:3px;align-self:flex-start;}
.dr-cs-feature:hover .fgo{color:#8A6238;border-color:#8A6238;}
.dr-cs-more{text-align:center;padding:38px 0 0;}
.dr-cs-more span{font-size:13px;letter-spacing:.04em;color:#9A9089;font-style:italic;position:relative;}
.dr-cs-more span::before,.dr-cs-more span::after{content:'';position:absolute;top:50%;width:40px;height:1px;background:#D9CFB8;}
.dr-cs-more span::before{right:calc(100% + 18px);}
.dr-cs-more span::after{left:calc(100% + 18px);}
@media(max-width:820px){.dr-cs-feature{grid-template-columns:1fr;}.dr-cs-feature .fimg{min-height:280px;}.dr-cs-feature .fbody{padding:40px 32px;}}

/* =========== DESKTOP NAV — keep 8 items on one line · v0.19.2 (2026-07-19) ===========
   font size unchanged; give the nav column room + tighten item padding; ≥1025px only. */
@media (min-width:1025px){
  .elementor-element-d0b2166 .elementor-nav-menu--main{flex-wrap:nowrap !important;justify-content:center !important;}
  .elementor-element-d0b2166 .elementor-nav-menu--main .elementor-item{padding-left:9px !important;padding-right:9px !important;}
  .elementor-element-1ec13da{flex-grow:1 !important;flex-shrink:1 !important;min-width:0 !important;}
  .elementor-element-2323617{flex-grow:0 !important;flex-shrink:0 !important;width:auto !important;}
  .elementor-element-1393e25{--content-width:1340px !important;}
}

/* =========== NAV POLISH — active-dot (V3) + centre menu · v0.19.3 (2026-07-19) · ≥1025px =========== */
@media (min-width:1025px){
  /* centre the nav menu in the gap between the logo and the right block */
  .elementor-element-1ec13da .elementor-element-d0b2166{margin-left:auto !important;margin-right:auto !important;}
  /* V3: bronze dot above the current page + bronze text */
  .elementor-element-d0b2166 .elementor-nav-menu--main .elementor-item{position:relative;}
  .elementor-element-d0b2166 .elementor-nav-menu--main .elementor-item-active,
  .elementor-element-d0b2166 .elementor-nav-menu--main .current-menu-item > .elementor-item{color:#D4B895 !important;}
  .elementor-element-d0b2166 .elementor-nav-menu--main .elementor-item-active::before,
  .elementor-element-d0b2166 .elementor-nav-menu--main .current-menu-item > .elementor-item::before{
    content:'';position:absolute;left:50%;top:-6px;transform:translateX(-50%);width:5px;height:5px;border-radius:50%;background:#A77B4A;
  }
}

/* =========== CASE STUDY EVIDENCE ANCHOR (pillar) · dr-cs-anchor · v0.19.4 (2026-07-19) =========== */
.dr-cs-anchor{display:block;max-width:760px;margin:0 auto;background:#fff;border:1px solid #D9CFB8;border-left:3px solid #A77B4A;padding:34px 40px;text-decoration:none;transition:box-shadow .25s;}
.dr-cs-anchor:hover{box-shadow:0 14px 34px rgba(26,24,20,.1);}
.dr-cs-anchor .dr-cs-eyebrow{display:block;margin-bottom:10px;}
.dr-cs-anchor h3{font-family:'Fraunces',serif;font-size:26px;font-style:italic;font-weight:300;color:#1A1814;margin:0 0 12px;}
.dr-cs-anchor p{font-size:15px;color:#6B6157;line-height:1.65;margin:0 0 16px;}
.dr-cs-anchor .ancgo{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#A77B4A;border-bottom:1px solid #A77B4A;padding-bottom:2px;}
@media(max-width:820px){.dr-cs-anchor{padding:28px 26px;}.dr-cs-anchor h3{font-size:22px;}}