/* Shared stylesheet for ALL internal (non-homepage) Elementor pages.
   Design tokens (--ink, --ochre, --bone, --cream, --trust-blue, --serif, --sans),
   the site header/nav, and the footer are already skinned site-wide by
   assets/global.css -- this file holds page-content styling only.

   This is a single, cumulative file: every new internal page's styles get
   appended here (in its own clearly-commented section below), rather than
   each page getting its own separate CSS file. It's enqueued automatically
   on every page except the coded Home template -- nothing to configure
   per page, and no separate files to track.

   Reusable, page-agnostic pieces (.ao-wrap, .ao-reveal, .ao-btn, .ao-eyebrow,
   .ao-scribble, .ao-grained) live at the top and are meant to be reused by
   any future page's markup. Page-specific sections follow, each under its
   own "PAGE: ..." banner comment so it's easy to find and to know what's
   safe to remove if a page is ever retired.

   GOTCHA (this Elementor version): every Elementor Container defaults to
   flex-direction: column, even when nothing sets it explicitly -- there is
   no visible "column" setting in the editor to tip you off. Any rule here
   that does `display: flex` on a Container and wants items SIDE BY SIDE
   must also set `flex-direction: row !important` explicitly, or the items
   will silently stack vertically instead. (Rules that genuinely want a
   vertical stack, like .ao-proof-list, are fine relying on the default.) */

.ao-wrap { max-width: 1140px !important; margin: 0 auto !important; padding: 0 48px !important; }

@media (max-width: 900px) {
  .ao-wrap { padding: 0 26px !important; }
}

/* grain overlay for dark sections */
.ao-grained { position: relative !important; }
.ao-grained::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  opacity: 0.5 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0.6 0 0 0 0 0.45 0 0 0 0 0.35 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E") !important;
}

/* scroll reveal (JS toggles .ao-visible on intersect; no-JS / reduced-motion always visible) */
.ao-reveal { opacity: 0 !important; transform: translateY(28px) !important; transition: opacity 0.9s ease, transform 0.9s ease !important; }
.ao-reveal.ao-visible { opacity: 1 !important; transform: none !important; }
.ao-reveal.ao-d1 { transition-delay: 0.12s !important; }
.ao-reveal.ao-d2 { transition-delay: 0.24s !important; }
.ao-reveal.ao-d3 { transition-delay: 0.36s !important; }
html:not(.ao-js) .ao-reveal { opacity: 1 !important; transform: none !important; }
@media (prefers-reduced-motion: reduce) {
  .ao-reveal { transition: none !important; opacity: 1 !important; transform: none !important; }
}

.ao-btn {
  display: inline-block !important;
  font-family: var(--sans) !important;
  font-size: 13px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  color: var(--white) !important;
  background: var(--ochre) !important;
  padding: 16px 30px !important;
  border-radius: 3px !important;
  text-decoration: none !important;
  border: none !important;
  cursor: pointer !important;
  transition: transform 0.25s, background 0.25s, color 0.25s, border-color 0.25s !important;
}
.ao-btn:hover { transform: translateY(-2px) !important; background: var(--ochre-bright) !important; color: var(--white) !important; }

.ao-eyebrow {
  font-family: var(--sans) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: var(--ochre) !important;
  margin: 0 0 20px !important;
}

.ao-scribble {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='8' viewBox='0 0 80 8'%3E%3Cpath d='M 1 5 C 20 2 30 7.5 50 4 C 62 2 72 6 79 4' fill='none' stroke='%23C25F30' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  background-repeat: repeat-x !important;
  background-position: 0 100% !important;
  background-size: 80px 8px !important;
  padding-bottom: 7px !important;
}

/* ================================================================
   PAGE: About (mm2.goodsidebusiness.com/about)
   ================================================================ */

/* ---- Section 1: Intro / Identity ---- */
.ao-intro { background: var(--bone) !important; padding: 190px 0 130px !important; overflow: hidden !important; }
.ao-intro-grid {
  display: grid !important;
  grid-template-columns: 0.85fr 1.15fr !important;
  gap: 90px !important;
  align-items: start !important;
  position: relative !important;
}
/* The decorative ghost-hand SVG is an Elementor HTML widget living inside
   the grid alongside the portrait and copy columns. Without this rule its
   wrapper still counts as a grid item and steals a track, shoving the real
   columns out of place. Taking it out of grid flow entirely (position:
   absolute) fixes that -- it overlays the grid instead of occupying a cell. */
.ao-intro-grid > .elementor-widget-html { position: absolute !important; inset: 0 !important; pointer-events: none !important; z-index: 0 !important; }
.ao-ghost { position: absolute !important; top: -70px !important; right: -60px !important; width: 320px !important; user-select: none !important; pointer-events: none !important; }
.ao-ghost svg { width: 100% !important; height: auto !important; }
.ao-ghost path, .ao-ghost ellipse { fill: none !important; stroke: rgba(29,21,18,0.05) !important; stroke-width: 7 !important; stroke-linecap: round !important; }

.ao-portrait { position: relative !important; width: 100% !important; max-width: 400px !important; }
.ao-portrait::before {
  content: "" !important; position: absolute !important; inset: 18px -18px -18px 18px !important;
  background: var(--cream) !important; border-radius: 4px !important; z-index: 0 !important;
}
.ao-portrait::after {
  content: "" !important; position: absolute !important; top: -14px !important; left: -14px !important; width: 74px !important; height: 74px !important;
  border-top: 3px solid var(--ochre) !important; border-left: 3px solid var(--ochre) !important; border-radius: 2px 0 0 0 !important; z-index: 2 !important;
}
.ao-portrait img {
  position: relative !important; z-index: 1 !important; display: block !important; width: 100% !important;
  aspect-ratio: 5 / 6 !important; object-fit: cover !important; object-position: center top !important;
  border-radius: 4px !important; background: var(--bone) !important; filter: saturate(0.92) sepia(0.06) !important;
}
.ao-portrait-cap { position: relative !important; z-index: 1 !important; margin-top: 28px !important; display: flex !important; flex-direction: row !important; align-items: center !important; gap: 14px !important; }
.ao-portrait-cap .ao-name { font-family: var(--serif) !important; font-size: 19px !important; color: var(--ink) !important; margin: 0 !important; }
.ao-portrait-cap .ao-icf-badge img { width: 42px !important; height: 42px !important; border-radius: 50% !important; flex-shrink: 0 !important; display: block !important; }
.ao-portrait-cap .ao-cred-line { font-family: var(--sans) !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; color: #8a7a6a !important; margin: 0 !important; }

.ao-lead {
  font-family: var(--serif) !important;
  font-weight: 300 !important;
  font-size: 24px !important;
  line-height: 1.4 !important;
  color: var(--ink) !important;
  max-width: 540px !important;
  margin: 0 0 44px !important;
}

.ao-tags { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; gap: 14px !important; }
.ao-tag {
  /* Elementor containers default to width:100% unless told otherwise --
     without this override, each tag chip fills the entire column instead
     of sizing to its own content, which is what made them look like giant
     stacked form fields instead of compact tags. */
  width: auto !important;
  flex: 0 0 auto !important;
  border: 1.5px solid rgba(29,21,18,0.16) !important;
  background: var(--white) !important;
  border-radius: 4px !important;
  padding: 8px 14px !important;
  box-shadow: 0 1px 0 rgba(29,21,18,0.05) !important;
}
.ao-tag .ao-k { display: block !important; font-family: var(--sans) !important; font-size: 10px !important; font-weight: 700 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; color: #8a7a6a !important; margin: 0 0 6px !important; }
.ao-tag .ao-v { font-family: var(--sans) !important; font-weight: 400 !important; font-size: 15px !important; letter-spacing: 0.01em !important; color: var(--ink) !important; margin: 0 !important; }
.ao-tag .ao-v em { color: var(--ochre) !important; font-style: normal !important; font-weight: 400 !important; padding: 0 2px !important; }

@media (max-width: 900px) {
  .ao-intro { padding: 150px 0 90px !important; }
  .ao-intro-grid { grid-template-columns: 1fr !important; gap: 50px !important; }
  .ao-ghost { display: none !important; }
}

/* ---- Section 2: The Story ---- */
.ao-story { background: var(--white) !important; padding: 150px 0 140px !important; }
.ao-story-grid {
  display: grid !important;
  grid-template-columns: 1.5fr 0.85fr !important;
  gap: 80px !important;
  align-items: start !important;
}
.ao-story-head { max-width: 700px !important; margin-bottom: 54px !important; }
.ao-story-head h1 {
  font-family: var(--serif) !important; font-weight: 300 !important;
  font-size: clamp(2.4rem, 4vw, 3.6rem) !important;
  line-height: 1.12 !important; letter-spacing: -0.015em !important; color: var(--ink) !important;
  margin: 0 !important;
}
.ao-story-head h1 em { font-style: italic !important; font-weight: 400 !important; color: var(--ochre) !important; }
.ao-story-body { max-width: 620px !important; font-family: var(--sans) !important; font-size: 16px !important; color: #382c24 !important; }
.ao-story-body p { margin: 0 0 20px !important; }
.ao-story-body .ao-lede { font-family: var(--serif) !important; font-weight: 300 !important; font-size: 21px !important; line-height: 1.5 !important; color: var(--ink) !important; margin: 0 0 26px !important; }
.ao-story-pull { position: sticky !important; top: 150px !important; align-self: start !important; padding-top: 10px !important; }
.ao-pull-quote { border-left: 3px solid var(--ochre) !important; padding: 4px 0 4px 32px !important; }
.ao-pull-quote p {
  font-family: var(--serif) !important;
  font-weight: 300 !important;
  font-style: italic !important;
  font-size: 27px !important;
  line-height: 1.4 !important;
  color: var(--ink) !important;
  margin: 0 !important;
}
@media (max-width: 1000px) {
  .ao-story-grid { grid-template-columns: 1fr !important; gap: 0 !important; }
  .ao-story-pull { position: static !important; margin: 40px 0 10px !important; }
  .ao-pull-quote p { font-size: 22px !important; }
}
.ao-story-aside {
  max-width: 620px !important;
  margin-top: 46px !important;
  padding-top: 30px !important;
  border-top: 1px solid rgba(29,21,18,0.1) !important;
  font-family: var(--serif) !important;
  font-style: italic !important;
  font-weight: 300 !important;
  font-size: 19px !important;
  line-height: 1.55 !important;
  color: #5a4c40 !important;
}
.ao-story-aside p { margin: 0 !important; }
.ao-story-aside b { font-style: normal !important; font-weight: 500 !important; color: var(--ink) !important; }

/* ---- Section 3: Charting Your Course ---- */
.ao-arc {
  background: radial-gradient(ellipse 700px 460px at 78% 12%, rgba(85,110,139,0.22), transparent 62%),
    linear-gradient(180deg, #263241 0%, #1c2530 55%, #12161b 100%) !important;
  padding: 140px 0 130px !important;
  color: var(--bone) !important;
  position: relative !important;
  overflow: hidden !important;
}
.ao-arc .ao-wrap { position: relative !important; z-index: 2 !important; }
.ao-arc-head { max-width: 640px !important; margin: 0 auto 20px !important; text-align: center !important; }
.ao-arc-head p.ao-tag-label {
  font-family: var(--sans) !important;
  font-size: 11px !important; font-weight: 700 !important; letter-spacing: 0.22em !important; text-transform: uppercase !important; color: var(--ochre-bright) !important;
  margin: 0 0 20px !important;
}
.ao-arc-head h2 {
  font-family: var(--serif) !important; font-weight: 300 !important; font-size: clamp(2.1rem, 3.4vw, 2.9rem) !important;
  line-height: 1.15 !important; letter-spacing: -0.01em !important; color: var(--bone) !important; margin: 0 0 18px !important;
}
.ao-arc-head h2 em { font-style: italic !important; font-weight: 400 !important; color: var(--ochre-bright) !important; }
.ao-arc-head p.ao-deck { font-family: var(--sans) !important; font-size: 16px !important; color: rgba(246,241,230,0.72) !important; margin: 0 !important; }

.ao-steps {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 8px !important;
  max-width: 1040px !important;
  margin: 64px auto 0 !important;
}
.ao-step { flex: 1 !important; text-align: left !important; padding: 6px 4px !important; }
.ao-step-mid {
  flex: 1.25 !important;
  background: rgba(246,241,230,0.05) !important;
  border: 1px solid rgba(246,241,230,0.12) !important;
  border-radius: 6px !important;
  padding: 30px 28px !important;
}
.ao-step-act {
  display: block !important;
  font-family: var(--sans) !important;
  font-size: 11px !important; font-weight: 700 !important; letter-spacing: 0.2em !important; text-transform: uppercase !important;
  color: var(--ochre-bright) !important; margin-bottom: 16px !important;
}
.ao-step-icon { color: var(--ochre-bright) !important; width: 30px !important; height: 30px !important; margin-bottom: 18px !important; }
.ao-step-icon svg { width: 100% !important; height: 100% !important; }
.ao-step h3 {
  font-family: var(--serif) !important; font-weight: 400 !important; font-size: 21px !important; line-height: 1.3 !important;
  color: var(--bone) !important; margin: 0 0 12px !important;
}
.ao-step h3 em { font-style: italic !important; font-weight: 400 !important; color: var(--ochre-bright) !important; }
.ao-step p { font-family: var(--sans) !important; font-size: 14.5px !important; line-height: 1.6 !important; color: rgba(246,241,230,0.68) !important; margin: 0 !important; }
.ao-step-arrow { flex: 0 0 auto !important; width: 40px !important; padding-top: 46px !important; }
.ao-step-arrow svg { width: 100% !important; height: auto !important; display: block !important; }

@media (max-width: 900px) {
  .ao-steps { flex-direction: column !important; gap: 30px !important; }
  .ao-step-arrow { display: none !important; }
  .ao-step-mid { padding: 26px 24px !important; }
}

/* ---- Section 4: Proof / Credentials ---- */
.ao-proof { background: var(--bone) !important; padding: 130px 0 !important; }
.ao-proof-grid {
  display: grid !important;
  grid-template-columns: 0.9fr 1.1fr !important;
  gap: 70px !important;
  align-items: center !important;
}
.ao-stat { line-height: 1 !important; }
.ao-stat .ao-num {
  font-family: var(--serif) !important; font-weight: 300 !important; font-style: italic !important;
  font-size: clamp(5rem, 9vw, 7.5rem) !important; color: var(--ochre) !important; letter-spacing: -0.02em !important; display: block !important;
}
.ao-stat .ao-label { font-family: var(--sans) !important; font-size: 15.5px !important; color: #4a3d33 !important; max-width: 320px !important; margin-top: 14px !important; }
.ao-proof-list { display: flex !important; flex-direction: column !important; gap: 0 !important; }
.ao-proof-item {
  display: flex !important; flex-direction: row !important; align-items: center !important; gap: 20px !important;
  padding: 24px 0 !important;
  border-bottom: 1px solid rgba(29,21,18,0.1) !important;
}
.ao-proof-item:first-child { padding-top: 0 !important; }
.ao-proof-item .ao-mark {
  width: 48px !important; height: 48px !important; flex-shrink: 0 !important; border-radius: 50% !important;
  background: var(--white) !important; border: 1px solid rgba(29,21,18,0.12) !important;
  display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important;
}
.ao-proof-item .ao-mark img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
.ao-proof-item .ao-mark svg { width: 22px !important; height: 22px !important; }
.ao-proof-item h4 { font-family: var(--serif) !important; font-weight: 500 !important; font-size: 17px !important; color: var(--ink) !important; margin: 0 0 4px !important; }
.ao-proof-item p { font-family: var(--sans) !important; font-size: 14px !important; color: #5a4c40 !important; margin: 0 !important; }
@media (max-width: 900px) {
  .ao-proof-grid { grid-template-columns: 1fr !important; gap: 40px !important; }
}

/* ---- Section 5: Join The List ---- */
.ao-signup {
  background: radial-gradient(ellipse 800px 500px at 50% 20%, rgba(120,70,40,0.25), transparent 65%),
    linear-gradient(180deg, #251b16 0%, #1d1512 65%, #191009 100%) !important;
  padding: 130px 0 140px !important;
  color: var(--bone) !important;
  position: relative !important;
  overflow: hidden !important;
}
.ao-signup-inner { position: relative !important; z-index: 2 !important; max-width: 640px !important; margin: 0 auto !important; text-align: center !important; }
.ao-signup-inner h2 {
  font-family: var(--serif) !important; font-weight: 300 !important; font-size: clamp(2rem, 3.2vw, 2.8rem) !important;
  line-height: 1.2 !important; letter-spacing: -0.01em !important; color: var(--bone) !important; margin: 0 0 18px !important;
}
.ao-signup-inner h2 em { font-style: italic !important; font-weight: 400 !important; color: var(--ochre-bright) !important; }
.ao-signup-sub { font-family: var(--sans) !important; font-size: 16px !important; color: rgba(246,241,230,0.75) !important; max-width: 460px !important; margin: 0 auto 36px !important; }
.ao-signup-form { display: flex !important; gap: 12px !important; max-width: 460px !important; margin: 0 auto 16px !important; }
.ao-signup-form input {
  flex: 1 !important; font-family: var(--sans) !important; font-size: 15px !important; color: var(--ink) !important;
  background: var(--bone) !important; border: none !important; border-radius: 3px !important; padding: 16px 20px !important; outline: none !important;
}
.ao-signup-form input::placeholder { color: #8a7a6a !important; }
.ao-signup-form input:focus { box-shadow: 0 0 0 2px var(--ochre) !important; }
.ao-signup-small { font-family: var(--sans) !important; font-size: 12.5px !important; color: rgba(246,241,230,0.45) !important; margin: 0 !important; }
@media (max-width: 620px) {
  .ao-signup-form { flex-direction: column !important; }
}

/* ================================================================
   PAGE: Personal Coaching (mm2.goodsidebusiness.com/personal-coaching)
   ================================================================ */

/* ---- Section 1: Hero (copy-led, no portrait) ---- */
.pc-hero { background: var(--bone) !important; padding: 210px 0 130px !important; overflow: hidden !important; position: relative !important; }
.pc-hero-inner { max-width: 720px !important; position: relative !important; z-index: 2 !important; }
.pc-hero-glyph {
  position: absolute !important; top: -60px !important; right: -110px !important; width: 460px !important;
  pointer-events: none !important; user-select: none !important; z-index: 1 !important;
}
.pc-hero-glyph svg { width: 100% !important; height: auto !important; }
.pc-hero-glyph circle, .pc-hero-glyph path { fill: none !important; stroke: rgba(29,21,18,0.055) !important; stroke-width: 2 !important; stroke-linecap: round !important; }

.pc-hero-copy h1 {
  font-family: var(--serif) !important; font-weight: 300 !important;
  font-size: clamp(2.6rem, 4.4vw, 4rem) !important; line-height: 1.08 !important; letter-spacing: -0.015em !important;
  color: var(--ink) !important; margin: 0 0 26px !important;
}
.pc-hero-copy h1 em { font-style: italic !important; font-weight: 400 !important; color: var(--ochre) !important; }
.pc-hero-lead {
  font-family: var(--serif) !important; font-weight: 300 !important; font-size: 22px !important; line-height: 1.5 !important;
  color: var(--ink) !important; max-width: 560px !important; margin: 0 0 40px !important;
}
.pc-hero-actions { display: flex !important; flex-direction: row !important; align-items: center !important; gap: 24px !important; flex-wrap: wrap !important; }
.pc-hero-cred {
  display: inline-flex !important; align-items: center !important; gap: 10px !important;
  padding: 8px 16px 8px 8px !important; background: var(--white) !important; border: 1.5px solid #556B8B !important; border-radius: 30px !important;
}
.pc-hero-cred img { width: 28px !important; height: 28px !important; border-radius: 50% !important; display: block !important; }
.pc-hero-cred span { font-family: var(--sans) !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: 0.04em !important; color: #5a4c40 !important; }
@media (max-width: 900px) {
  .pc-hero { padding: 160px 0 90px !important; }
  .pc-hero-glyph { width: 320px !important; top: -30px !important; right: -140px !important; opacity: 0.7 !important; }
}
@media (max-width: 560px) {
  .pc-hero-glyph { display: none !important; }
  .pc-hero-actions { flex-direction: column !important; align-items: flex-start !important; }
}

/* ---- Section 2: Is This For You ---- */
.pc-fit { background: var(--white) !important; padding: 130px 0 !important; }
.pc-fit-inner { max-width: 760px !important; margin: 0 auto !important; text-align: center !important; }
.pc-fit-inner .ao-eyebrow { display: block !important; }
.pc-fit-inner h2 {
  font-family: var(--serif) !important; font-weight: 300 !important; font-size: clamp(2rem, 3.2vw, 2.7rem) !important;
  line-height: 1.18 !important; letter-spacing: -0.01em !important; color: var(--ink) !important; margin: 0 0 16px !important;
}
.pc-fit-inner h2 em { font-style: italic !important; font-weight: 400 !important; color: var(--ochre) !important; }
.pc-fit-deck { font-family: var(--sans) !important; font-size: 16px !important; color: #5a4c40 !important; margin: 0 !important; }
.pc-fit-list { display: flex !important; flex-direction: column !important; gap: 14px !important; max-width: 600px !important; margin: 44px auto 36px !important; text-align: left !important; }
.pc-check-item {
  position: relative !important; padding: 14px 20px 14px 52px !important;
  background: var(--bone) !important; border-radius: 4px !important;
  font-family: var(--sans) !important; font-size: 16px !important; line-height: 1.5 !important; color: #382c24 !important;
}
.pc-check-item::before {
  content: "" !important; position: absolute !important; left: 18px !important; top: 16px !important; width: 20px !important; height: 20px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C25F30' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5 L9.5 18 L20 6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-size: contain !important;
}
.pc-fit-close { font-family: var(--serif) !important; font-style: italic !important; font-weight: 300 !important; font-size: 19px !important; color: var(--ink) !important; margin: 0 !important; }

/* ---- Section 3: 3 Easy Steps (light numbered cards, no dark cave) ---- */
.pc-steps-sec { background: var(--bone) !important; padding: 140px 0 !important; }
.pc-steps-head { max-width: 640px !important; margin: 0 auto 20px !important; text-align: center !important; }
.pc-steps-head h2 {
  font-family: var(--serif) !important; font-weight: 300 !important; font-size: clamp(2.1rem, 3.4vw, 2.9rem) !important;
  line-height: 1.15 !important; letter-spacing: -0.01em !important; color: var(--ink) !important; margin: 0 0 18px !important;
}
.pc-steps-head h2 em { font-style: italic !important; font-weight: 400 !important; color: var(--ochre) !important; }
.pc-steps-deck { font-family: var(--sans) !important; font-size: 16px !important; color: #5a4c40 !important; margin: 0 !important; }
.pc-steps { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 26px !important; max-width: 1040px !important; margin: 60px auto 50px !important; }
.pc-step {
  background: var(--white) !important; border: 1px solid rgba(29,21,18,0.1) !important; border-radius: 6px !important;
  padding: 40px 30px !important; text-align: left !important;
}
.pc-step-num {
  display: block !important; font-family: var(--serif) !important; font-weight: 300 !important; font-style: italic !important;
  font-size: 2.6rem !important; line-height: 1 !important; color: var(--ochre) !important; margin-bottom: 18px !important;
}
.pc-step h3 { font-family: var(--serif) !important; font-weight: 400 !important; font-size: 20px !important; line-height: 1.3 !important; color: var(--ink) !important; margin: 0 0 10px !important; }
.pc-step p { font-family: var(--sans) !important; font-size: 14.5px !important; line-height: 1.6 !important; color: #5a4c40 !important; margin: 0 !important; }
.pc-steps-cta { text-align: center !important; }
@media (max-width: 900px) {
  .pc-steps { grid-template-columns: 1fr !important; gap: 20px !important; }
}

/* ---- Section 4: How Coaching Works (single column, pull-quote as a horizontal break) ---- */
.pc-how { background: var(--white) !important; padding: 150px 0 140px !important; }
.pc-how-inner { max-width: 700px !important; margin: 0 auto !important; }
.pc-how-head { margin-bottom: 40px !important; }
.pc-how-head h2 {
  font-family: var(--serif) !important; font-weight: 300 !important; font-size: clamp(2.2rem, 3.6vw, 3.1rem) !important;
  line-height: 1.14 !important; letter-spacing: -0.015em !important; color: var(--ink) !important; margin: 0 !important;
}
.pc-how-head h2 em { font-style: italic !important; font-weight: 400 !important; color: var(--ochre) !important; }
.pc-how-body { font-family: var(--sans) !important; font-size: 16px !important; color: #382c24 !important; }
.pc-how-body p { margin: 0 0 20px !important; }
.pc-how-lede { font-family: var(--serif) !important; font-weight: 300 !important; font-size: 21px !important; line-height: 1.5 !important; color: var(--ink) !important; margin: 0 0 26px !important; }
.pc-pull-quote {
  margin: 50px 0 !important; padding: 42px 0 !important;
  border-top: 1px solid rgba(29,21,18,0.12) !important; border-bottom: 1px solid rgba(29,21,18,0.12) !important;
  text-align: center !important;
}
.pc-pull-quote p {
  font-family: var(--serif) !important; font-weight: 300 !important; font-style: italic !important;
  font-size: clamp(1.5rem, 2.6vw, 2.1rem) !important; line-height: 1.4 !important; color: var(--ink) !important;
  max-width: 560px !important; margin: 0 auto !important;
}

/* ---- Section 5: What I'll Do For You ---- */
.pc-expect { background: var(--bone) !important; padding: 130px 0 !important; }
.pc-expect-head { max-width: 640px !important; margin: 0 auto !important; text-align: center !important; }
.pc-expect-head h2 {
  font-family: var(--serif) !important; font-weight: 300 !important; font-size: clamp(2.1rem, 3.4vw, 2.9rem) !important;
  line-height: 1.15 !important; letter-spacing: -0.01em !important; color: var(--ink) !important; margin: 0 0 16px !important;
}
.pc-expect-head h2 em { font-style: italic !important; font-weight: 400 !important; color: var(--ochre) !important; }
.pc-expect-deck { font-family: var(--sans) !important; font-size: 16px !important; color: #5a4c40 !important; margin: 0 !important; }
.pc-expect-grid { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 26px !important; margin-top: 60px !important; }
.pc-card { background: var(--white) !important; border: 1px solid rgba(29,21,18,0.12) !important; border-radius: 5px !important; padding: 32px 26px !important; transition: transform 0.25s, box-shadow 0.25s !important; }
.pc-card:hover { transform: translateY(-3px) !important; box-shadow: 0 10px 24px rgba(29,21,18,0.08) !important; }
.pc-card-icon { width: 32px !important; height: 32px !important; color: var(--ochre) !important; margin-bottom: 18px !important; }
.pc-card-icon svg { width: 100% !important; height: 100% !important; }
.pc-card h4 { font-family: var(--serif) !important; font-weight: 500 !important; font-size: 17px !important; color: var(--ink) !important; margin: 0 0 8px !important; }
.pc-card p { font-family: var(--sans) !important; font-size: 14px !important; line-height: 1.55 !important; color: #5a4c40 !important; margin: 0 !important; }
@media (max-width: 1100px) { .pc-expect-grid { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 600px) { .pc-expect-grid { grid-template-columns: 1fr !important; } }

/* ---- Section 6: Final CTA ---- */
.pc-cta {
  background: radial-gradient(ellipse 800px 500px at 50% 20%, rgba(120,70,40,0.25), transparent 65%),
    linear-gradient(180deg, #251b16 0%, #1d1512 65%, #191009 100%) !important;
  padding: 130px 0 140px !important; color: var(--bone) !important; position: relative !important; overflow: hidden !important;
}
.pc-cta-inner { position: relative !important; z-index: 2 !important; max-width: 640px !important; margin: 0 auto !important; text-align: center !important; }
.pc-cta-inner .ao-eyebrow { color: var(--ochre-bright) !important; }
.pc-cta-inner h2 {
  font-family: var(--serif) !important; font-weight: 300 !important; font-size: clamp(2.1rem, 3.4vw, 3rem) !important;
  line-height: 1.18 !important; letter-spacing: -0.01em !important; color: var(--bone) !important; margin: 0 0 18px !important;
}
.pc-cta-inner h2 em { font-style: italic !important; font-weight: 400 !important; color: var(--ochre-bright) !important; }
.pc-cta-sub { font-family: var(--sans) !important; font-size: 16px !important; color: rgba(246,241,230,0.75) !important; max-width: 460px !important; margin: 0 auto 36px !important; }

/* ================================================================
   Future pages get their own "PAGE: ..." section appended below this
   line -- same file, same enqueue rule, nothing new to remember.
   ================================================================ */
