/* Styles limited to the English "Mother Wound Reset" landing page. */

.mw-skip { position: fixed; top: -100px; left: 16px; z-index: 2000; background: var(--bg-primary); color: var(--text-primary); padding: 12px; }
.mw-skip:focus { top: 16px; }
.mw-body :focus-visible { outline: 2px solid var(--text-primary); outline-offset: 5px; }
.mw-body .mobile-menu-toggle { background: transparent; border: 0; padding: 0; }
.mw-body .hero :focus-visible { outline-color: #ffffff; }

/* Hero additions — the shared hero owns the gradient, photo mask and CTA */
/* The shared 65% focal point is set for a full-body shot; this hero photo is a
   head-and-shoulders profile, so it needs a higher one or the face is cropped. */
.mw-body .hero-image img { object-position: center 40%; }
.mw-eyebrow { font-family: var(--font-heading); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(255, 255, 255, 0.72); margin-bottom: var(--spacing-sm); }
.mw-hero-lede { font-size: 1.0625rem; line-height: 1.8; color: #f0d4d8; max-width: 620px; margin-top: var(--spacing-sm); }
.mw-hero-note { font-size: 0.85rem; color: rgba(255, 255, 255, 0.62); margin-top: var(--spacing-sm); }

/* Shared type scale runs wide; these sections read better in a column */
.mw-intro, .mw-more { max-width: 760px; font-size: 1.125rem; line-height: 1.8; color: var(--text-secondary); }
.mw-more { margin-top: var(--spacing-md); font-style: italic; }

.mw-days { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(360px, 1fr)); gap: var(--spacing-md); margin-top: var(--spacing-lg); padding: 0; }
.mw-day { padding-left: var(--spacing-sm); border-left: 2px solid var(--primary-purple); }
.mw-day-label { font-family: var(--font-heading); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--primary-purple-dark); margin: 0; }
[data-theme="dark"] .mw-day-label { color: var(--primary-purple-light); }
.mw-day-title { font-size: 1.25rem; margin: 0.375rem 0 0.625rem; }
.mw-day-text { font-size: 0.95rem; line-height: 1.7; color: var(--text-secondary); margin: 0; }

.mw-author { background-color: var(--bg-secondary); }
.mw-author-grid { display: grid; grid-template-columns: minmax(0, 320px) minmax(0, 1fr); gap: var(--spacing-lg); align-items: start; }
.mw-author-photo img { width: 100%; height: 420px; object-fit: cover; object-position: 58% 10%; border-radius: 10px; display: block; }
.mw-author-body p { max-width: 640px; margin-bottom: var(--spacing-sm); }
.mw-creds { list-style: none; padding: 0; margin: var(--spacing-md) 0; display: flex; flex-direction: column; gap: 0.5rem; }
.mw-creds li { position: relative; padding-left: 1.25rem; font-size: 0.95rem; color: var(--text-secondary); }
.mw-creds li::before { content: ''; position: absolute; left: 0; top: 0.8em; width: 8px; height: 1px; background-color: var(--primary-purple); }
.mw-byline-note { font-size: 0.875rem; color: var(--text-secondary); font-style: italic; }

.mw-get-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: var(--spacing-md); align-items: stretch; }
.mw-signup { margin-top: var(--spacing-sm); }
.mw-call { margin-top: var(--spacing-lg); }
/* .booking-cta is inline by default and only self-aligns inside .booking-card's
   flex column; outside one it has to be a block or its padding overlaps the copy */
.mw-call .booking-cta { display: inline-block; margin-top: var(--spacing-sm); }
/* The shared footer paints the unoptimised 7.9 MB portrait behind its scrim.
   This page is a social-ad destination, so it uses the small derivative — the
   portrait one, so the footer still carries Despoina as the shared design does. */
.mw-body .footer { background-image: url('../images/mother-wound-portrait.jpg'); }

.mw-disclaimer { max-width: 760px; margin-top: var(--spacing-lg); padding-top: var(--spacing-md); border-top: 1px solid var(--border-color); font-size: 0.85rem; line-height: 1.7; color: var(--text-secondary); }

@media screen and (max-width: 768px) {
  .mw-author-grid { grid-template-columns: 1fr; gap: var(--spacing-md); }
  .mw-author-photo img { height: 340px; object-position: 58% 0%; }
  .mw-days { margin-top: var(--spacing-md); }
}
