/* V1 "Muse" — closest to the Wix site. White, gold, deep green, turquoise paint,
   gold hexagons, Cinzel + Raleway. Centered, generous, serene. */
:root {
  --bg: #ffffff; --bg-alt: #fbf8f1; --ink: #534745; --ink-soft: #6f615d; --line: rgba(83,71,69,.14);
  --primary: #1c8d86; --primary-ink: #fff; --accent: #c9a85c; --accent-soft: #ecd89d; --accent-ink: #a98c3f;
  --dark: #063b35; --dark-ink: #f1e9d6; --dark-heading: #ecd89d; --gold-bg: #fbf5e4;
  --heading: #063b35; --card-bg: #fff; --radius: 6px; --img-radius: 6px;
  --header-bg: rgba(255,255,255,.96); --nav-ink: #534745; --dropdown-bg: #fff;
  --cta-bg: #063b35; --cta-ink: #fff; --cta-btn-bg: #ecd89d; --cta-btn-ink: #063b35;
  --btn-radius: 2px; --btn-font: 'Cinzel', serif;
}
body { font-weight: 400; }
h1, h2, h3 { font-weight: 500; letter-spacing: .04em; text-transform: uppercase; }
h1 { font-size: clamp(2rem, 4.6vw, 3.4rem); }
h2 { font-size: clamp(1.35rem, 2.6vw, 1.9rem); }
.prose h2, .prose h3 { text-transform: none; letter-spacing: .01em; }
.eyebrow { color: var(--accent-ink); font-weight: 500; }
.brand-logo { width: 58px; }
.site-header { border-bottom: 2px solid var(--accent-soft); }
/* Header runs wider than the page content so the logo sits further left, clear of the menu. */
.site-header .header-inner { width: min(100% - 2rem, 1360px); }
.site-header .nav-cta { max-width: 14em; }
@media (min-width: 1100px) and (max-width: 1360px) {
  .site-header .menu > li > a, .site-header .menu summary { padding-inline: .5rem; letter-spacing: .12em; }
}
.menu > li > a, .menu summary { font-weight: 500; letter-spacing: .16em; font-size: .74rem; }
.nav-cta { background: url('/img/texture-turquoise-paint.jpg') center/cover; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.3); }

/* Turquoise painted buttons, white+gold ghost buttons */
.btn-primary { background: url('/img/texture-turquoise-paint.jpg') center/cover, var(--primary); color: #fff; font-weight: 700; letter-spacing: .12em; text-shadow: 0 1px 3px rgba(0,0,0,.45); border: 1px solid #d9c27a; box-shadow: 0 0 0 3px rgba(236,216,157,.55), 0 14px 30px -6px rgba(6,59,53,.4); }
.btn-primary:hover { filter: brightness(1.08); transform: translateY(-4px); box-shadow: 0 0 0 4px rgba(236,216,157,.85), 0 20px 36px -6px rgba(6,59,53,.45); }
.btn-secondary { background: url('/img/texture-gold-marble-2.jpg') center/cover, #fff; color: var(--dark); border: 1px solid var(--accent); }
.btn-secondary:hover { background: var(--dark); color: var(--accent-soft); }
.tone-dark .btn-secondary, .site-footer .btn-primary { }
.cta .btn-primary { background: url('/img/texture-gold-marble-2.jpg') center/cover, var(--accent-soft); color: var(--dark); text-shadow: none; }

/* Hero: white with gold marble wash and hexagon frame */
.hero-centered { background: #fff url('/img/texture-gold-marble-1.jpg') center/cover; }
.hero-centered::before { content: ''; position: absolute; inset: 0; background: rgba(255,255,255,.72); }
.hero-centered .hero-inner { position: relative; }
.hero-logo { position: relative; }
.hero-logo::after { display: none; }
.hero-centered .hero-inner::before { content: ''; position: absolute; left: 50%; top: -70px; width: 300px; height: 300px; transform: translateX(-50%); background: url('/img/hexagon-gold.png') center/contain no-repeat; opacity: .7; pointer-events: none; }
.hero-centered .hero-title { color: var(--dark); letter-spacing: .18em; }
.hero-centered .eyebrow { color: var(--accent-ink); letter-spacing: .3em; }
.hero-centered .lead { color: var(--ink); font-size: 1.25rem; }
.hero-logo { width: 160px; filter: drop-shadow(0 6px 14px rgba(201,168,92,.35)); }

/* Hexagon portrait frame */
.hex-frame { position: relative; margin: 0; }
.hex-frame img { clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); border-radius: 0; box-shadow: none; aspect-ratio: .9; }

/* Pillars on hexagon-strewn section */
.tone-hex { background: #fff url('/img/hexagon-gold.png') right -120px top -80px/520px no-repeat; }
.tone-hex::after { content: ''; position: absolute; left: -140px; bottom: -120px; width: 480px; height: 480px; background: url('/img/hexagon-gold.png') center/contain no-repeat; opacity: .7; pointer-events: none; }
.pillar { background: rgba(255,255,255,.92); border: 1px solid var(--accent-soft); text-align: center; }
.pillar-num { color: var(--accent); }
.pillar h3 { color: var(--dark); font-size: 1.15rem; }

/* Button band on turquoise paint */
.band-paint { background: url('/img/texture-turquoise-paint.jpg') center/cover; }
.band-paint .btn-primary { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.7); text-shadow: 0 1px 2px rgba(0,0,0,.4); }
.band-paint .btn-primary:hover { background: #fff; color: var(--dark); text-shadow: none; }

/* Dark statement */
.change { text-align: center; }
.change h2 { color: var(--accent-soft); font-size: clamp(1.5rem, 3vw, 2.2rem); }
.change .sub { font-family: var(--font-display); color: #fff; font-size: 1.1rem; letter-spacing: .1em; text-transform: uppercase; }

/* Gold + white marble testimonials (the Wix look) */
.tone-gold { background: url('/img/texture-gold-marble-1.jpg') center/cover; }
.tone-gold::before { content: ''; position: absolute; inset: 0; background: rgba(255,255,255,.45); }
.tone-gold .wrap { position: relative; }
.testimonial { background: rgba(255,255,255,.88); border: 1px solid var(--accent-soft); }
.testimonial blockquote { font-family: 'Quicksand', sans-serif; font-style: normal; }
.testimonial figcaption strong { color: var(--dark); }

.area { border-top: 3px solid var(--accent-soft); }
.area h3 { color: var(--primary); }
.card h3 { font-size: 1.02rem; }
.card-link { color: var(--accent-ink); }
details.faq summary { color: var(--dark); }
.cta { background: var(--dark) url('/img/hexagon-gold.png') right -200px center/700px no-repeat; }
.site-footer { background: var(--dark); }
.page-header { background: #fff url('/img/texture-gold-marble-2.jpg') center/cover; }
.page-header::before { content: ''; position: absolute; inset: 0; background: rgba(255,255,255,.78); }
.page-header { position: relative; } .page-header-inner { position: relative; }
.price .amount { color: var(--dark); }

/* Bio tagline under "My name is Corinne Donnelly": elegant italic */
.intro-text .sub { font-family: 'Playfair Display', Georgia, serif; font-style: italic; font-weight: 400; font-size: 1.6rem; line-height: 1.3; }

/* ---- Be the Muse page ---- */
.muse-script { font-family: 'Playfair Display', Georgia, serif; font-style: italic; font-weight: 400; line-height: 1.25; color: var(--primary); }
.prose .offer-sub { font-family: 'Playfair Display', Georgia, serif; font-style: italic; color: var(--primary); font-size: 1.35rem; line-height: 1.3; margin-top: -.6rem; }
.muse-rule { display: flex; align-items: center; justify-content: center; gap: .8rem; }
.muse-rule::before, .muse-rule::after { content: ''; height: 1px; width: 70px; background: var(--accent); }
.muse-hexdot { width: 12px; height: 12px; flex: none; background: var(--accent); clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0 50%); }

/* Motto band on turquoise paint */
.muse-band { background: url('/img/texture-turquoise-paint.jpg') center/cover; color: #fff; text-align: center; padding: clamp(2.5rem, 6vw, 4rem) 0; }
.muse-band-motto { font-family: 'Playfair Display', Georgia, serif; font-style: italic; font-size: clamp(1.8rem, 4.2vw, 2.9rem); line-height: 1.2; margin: 0 0 1rem; text-shadow: 0 2px 10px rgba(6,59,53,.45); }
.muse-band-line { margin: 1.1rem auto 0; font-family: 'Cinzel', serif; text-transform: uppercase; letter-spacing: .14em; font-size: .88rem; line-height: 1.8; text-shadow: 0 1px 4px rgba(6,59,53,.5); }

/* Deep green statement with hexagon portrait */
.muse-statement { background: var(--dark) url('/img/hexagon-gold.png') right -160px center/560px no-repeat; color: #f1e9d6; padding: clamp(3rem, 7vw, 5rem) 0; overflow: hidden; }
.muse-statement-inner { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.muse-statement-text p { margin: 0 0 1.1rem; font-size: 1.05rem; }
/* Big gold first letter hangs to the left so every line of the paragraph lines up */
.muse-dropcap { position: relative; padding-left: 3.6rem; }
.muse-dropcap-letter { position: absolute; left: 0; top: .1rem; font-family: 'Cinzel', serif; font-size: 4.4rem; line-height: .8; color: var(--accent-soft); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.muse-statement-text .muse-script-gold { color: var(--accent-soft); font-size: 2.2rem; margin-top: 1.6rem; }
.muse-hex-portrait { margin: 0; }
.muse-hex-portrait img { width: 100%; aspect-ratio: .95; object-fit: cover; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); }

/* Offering beside the red-scarf photo: photo in a hexagon, gold hexagon offset behind it */
.muse-offering-inner { display: grid; grid-template-columns: .75fr 1.25fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.muse-hex-frame { position: relative; margin: 0; }
.muse-hex-frame::before { content: ''; position: absolute; top: 9%; left: 1%; width: 88%; aspect-ratio: .87; background: linear-gradient(135deg, rgba(201,168,92,.9), rgba(236,216,157,.75) 55%, rgba(169,140,63,.9)), url('/img/texture-gold-leaf.jpg') center/cover; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); pointer-events: none; }
.muse-hex-frame img { position: relative; width: 88%; margin-left: auto; aspect-ratio: .87; object-fit: cover; object-position: 40% center; transform: scaleX(-1); clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); filter: drop-shadow(0 12px 24px rgba(6,59,53,.3)); }

/* Three-month journey */
.muse-journey { text-align: center; }
.muse-journey .section-title { margin-bottom: .3rem; }
.muse-journey-sub { font-size: 1.3rem; margin: 0 0 2.4rem; }
.muse-steps { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; max-width: 920px; margin: 0 auto; }
.muse-steps::before { content: ''; position: absolute; top: 62px; left: 17%; right: 17%; height: 1px; background: var(--accent); }
.muse-step { position: relative; }
.muse-step-hex { width: 124px; height: 124px; margin: 0 auto 1rem; display: grid; place-items: center; background: url('/img/texture-turquoise-paint.jpg') center/cover; clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0 50%); color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.4); }
.muse-step-hex span { display: block; font-family: 'Cinzel', serif; font-size: 2.2rem; line-height: 1; }
.muse-step-hex small { display: block; font-size: .62rem; letter-spacing: .2em; text-transform: uppercase; }
.muse-step h3 { font-size: 1rem; letter-spacing: .14em; margin: 0 0 .4rem; }
.muse-step p { margin: 0 auto; max-width: 26ch; font-size: .95rem; color: var(--ink-soft); }
.muse-extras { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; margin-top: 2.4rem; }
.muse-extras span { border: 1px solid var(--accent); padding: .45rem 1rem; font-size: .88rem; color: var(--dark); background: #fff; }

/* Luxe offering card on gold marble */
.muse-card { max-width: 720px; margin: 0 auto; background: #fff; border: 1px solid var(--accent); outline: 6px solid rgba(236,216,157,.35); padding: clamp(2rem, 5vw, 2.8rem) clamp(1.3rem, 4vw, 2.6rem); text-align: center; box-shadow: 0 20px 50px -20px rgba(6,59,53,.35); }
.muse-card .eyebrow { margin: 0; font-size: .75rem; letter-spacing: .3em; }
.muse-card h2 { font-size: clamp(1.8rem, 4vw, 2.3rem); letter-spacing: .14em; margin: .5rem 0 .2rem; }
.muse-card .muse-script { font-size: 1.35rem; margin: 0 0 1.2rem; }
.muse-card-list { list-style: none; padding: 0; margin: 1.6rem auto; max-width: 520px; text-align: left; }
.muse-card-list li { display: flex; gap: .8rem; align-items: baseline; padding: .6rem 0; border-bottom: 1px solid var(--line); }
.muse-card-list b { color: var(--dark); }
.muse-price { font-family: 'Cinzel', serif; font-size: 2.5rem; color: var(--dark); margin: 1rem 0 1.4rem; line-height: 1.1; }
.muse-price small { display: block; margin-top: .4rem; font-family: 'Raleway', sans-serif; font-size: .8rem; letter-spacing: .2em; text-transform: uppercase; color: var(--ink-soft); }

@media (min-width: 760px) { .muse-band-line { white-space: nowrap; } }
@media (max-width: 860px) {
  .muse-statement-inner, .muse-offering-inner, .muse-steps { grid-template-columns: 1fr; }
  .muse-hex-portrait, .muse-hex-frame { max-width: 380px; margin-inline: auto; }
  .muse-hex-portrait { order: -1; }
  .muse-statement { background-image: none; }
  .muse-steps::before { display: none; }
}

/* Results lists: small gold hexagons instead of stars */
.check-list li::before { content: ''; top: .95em; left: .2rem; width: 14px; height: 14px; background: var(--accent); clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0 50%); }

/* Book page: smaller title so it fits on one line */
.book-header h1 { font-size: clamp(1.5rem, 2.7vw, 2.1rem); }
/* Book page: gold hexagon outlines floating behind the consultation cards */
.book-page-choose { overflow: hidden; }
.book-page-choose::before, .book-page-choose::after { content: ''; position: absolute; pointer-events: none; background: url('/img/hexagon-gold.png') center/100% auto no-repeat; }
.book-page-choose::before { left: -110px; top: -150px; width: 360px; height: 640px; }
.book-page-choose::after { right: -90px; bottom: -200px; width: 420px; height: 750px; opacity: .8; }
.book-page-choose .wrap { position: relative; z-index: 1; }

/* Meet Me: larger portrait shown at its natural shape instead of cropped wide */
@media (min-width: 861px) { .about-header.has-image .page-header-inner { grid-template-columns: 1fr 1fr; } }
/* Portrait cut into a hexagon, with small gold hexagon outlines floating around it */
.about-header .page-header-figure { position: relative; margin: 0; }
.about-header .page-header-figure img { position: relative; width: 78%; margin: 0 auto; display: block; aspect-ratio: .87; object-fit: cover; object-position: center 20%; border-radius: 0; box-shadow: none; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); }
.about-header .page-header-figure::before, .about-header .page-header-figure::after { content: ''; position: absolute; background: url('/img/hexagon-gold.png') center/100% auto no-repeat; pointer-events: none; }
.about-header .page-header-figure::before { left: -4%; bottom: 2%; width: 150px; height: 266px; }
.about-header .page-header-figure::after { right: -6%; top: -6%; width: 110px; height: 196px; opacity: .8; }
@media (max-width: 860px) {
  .about-header .page-header-figure img { width: min(78%, 320px); }
  .about-header .page-header-figure::before { left: 2%; width: 100px; height: 178px; }
  .about-header .page-header-figure::after { right: 2%; top: -4%; width: 80px; height: 142px; }
}

/* Services: wider closing paragraph under the four pillars */
.section-lead-wide { max-width: 92ch; }

/* Services: First Step section (consultation + Zoom tele-session guide) */
.first-step .prose { max-width: 1040px; margin: 0 auto; }
.fs-intro { max-width: 720px; margin: 0 auto 2.5rem; padding: clamp(2rem, 5vw, 2.8rem) clamp(1.3rem, 4vw, 2.6rem); text-align: center; background: #fff; border: 1px solid var(--accent); outline: 6px solid rgba(236,216,157,.35); box-shadow: 0 20px 50px -20px rgba(6,59,53,.35); }
.fs-intro .fs-eyebrow { margin: 0; font-size: .75rem; letter-spacing: .3em; text-transform: uppercase; color: var(--accent-ink); font-weight: 600; }
.prose .fs-intro h2 { margin: .4rem 0 1rem; font-size: clamp(1.6rem, 3.5vw, 2.1rem); letter-spacing: .12em; text-transform: uppercase; }
.fs-intro .btn { margin: .4rem 0 .6rem; }
.fs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.4rem; }
.fs-card { background: #fff; border-top: 3px solid var(--accent); padding: 1.6rem 1.7rem 1.2rem; box-shadow: 0 10px 30px rgba(0,0,0,.05); }
.prose .fs-card h3 { display: flex; align-items: center; gap: .6rem; margin: 0 0 .8rem; font-size: 1.05rem; letter-spacing: .08em; text-transform: uppercase; }
.prose .fs-card h3::before { content: ''; flex: none; width: 14px; height: 14px; background: var(--accent); clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0 50%); }
.fs-card ul { list-style: none; padding-left: 0; }
.fs-card ul li { position: relative; padding-left: 1.5rem; margin-bottom: .5rem; }
.fs-card ul li::before { content: ''; position: absolute; left: .1rem; top: .55em; width: 10px; height: 10px; background: var(--accent); clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0 50%); }
.fs-card ol { padding-left: 1.3rem; }
.fs-card ol li { margin-bottom: .4rem; }
.fs-card ol li::marker { color: var(--accent-ink); font-family: 'Cinzel', serif; font-weight: 600; }
.prose .fs-name { margin: 1.2rem 0 0; font-family: 'Cinzel', serif; font-size: 1.15rem; letter-spacing: .08em; color: var(--dark); }
.prose .fs-name-sub { margin: .2rem 0 0; font-family: 'Playfair Display', Georgia, serif; font-style: italic; color: var(--primary); font-size: 1.05rem; }
.fs-remember { max-width: 820px; margin: 2rem auto 0; padding: 1.2rem 1.6rem; background: url('/img/texture-turquoise-paint.jpg') center/cover; color: #fff; text-align: center; text-shadow: 0 1px 3px rgba(6,59,53,.5); font-size: 1.05rem; }
.fs-remember p { margin: 0; }
.fs-remember strong { color: #fff; font-family: 'Cinzel', serif; letter-spacing: .08em; }
@media (max-width: 760px) { .fs-grid { grid-template-columns: 1fr; } }

/* Services: one-line medical heading, and the past life regression feature */
.section-title-wide { max-width: none; }
.past-life-inner { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(2rem, 5vw, 3.5rem); align-items: center; max-width: 980px; margin: 0 auto; }
.past-life-media { margin: 0; }
/* Square photo cut to a hexagon; its words sit in the middle band, which the hexagon keeps at full width */
.past-life-media img { width: min(100%, 420px); margin: 0 auto; display: block; aspect-ratio: 1; object-fit: cover; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); filter: drop-shadow(0 14px 28px rgba(6,59,53,.3)); }
.past-life-inner h2 { margin: .3rem 0 .8rem; }
.past-life-inner p { color: var(--ink); font-size: 1.05rem; }
@media (max-width: 760px) { .past-life-inner { grid-template-columns: 1fr; } }

/* White cards on dark sections: use the normal dark text so it reads clearly */
.tone-dark a.card { color: var(--ink); }
.tone-dark .card h3 { color: var(--dark); }
.tone-dark .card p { color: var(--ink); }
.tone-dark .card .card-link { color: var(--accent-ink); }

/* Services: Zoom + Steps to Success, same box size as the 4-across cards */
.sessions-online .cards { max-width: calc(50% + .75rem); margin-inline: auto; }
@media (max-width: 900px) { .sessions-online .cards { max-width: none; } }
/* Working together: gold hexagon outlines in the open space either side of the two cards */
.sessions-online { overflow: hidden; }
.sessions-online .wrap { position: relative; z-index: 1; }
.sessions-online::before, .sessions-online::after { content: ''; position: absolute; pointer-events: none; background: url('/img/hexagon-gold.png') center/100% auto no-repeat; }
.sessions-online::before { left: 7%; top: 50%; width: 230px; height: 410px; transform: translateY(-38%); }
.sessions-online::after { right: 6%; top: 50%; width: 190px; height: 340px; transform: translateY(-62%); }
.sessions-online .wrap::before, .sessions-online .wrap::after { content: ''; position: absolute; pointer-events: none; z-index: -1; background: url('/img/hexagon-gold.png') center/100% auto no-repeat; opacity: .75; }
.sessions-online .wrap::before { left: 13%; top: -30px; width: 110px; height: 196px; }
.sessions-online .wrap::after { right: 14%; bottom: -50px; width: 130px; height: 232px; }
@media (max-width: 900px) {
  .sessions-online::before { left: -90px; width: 200px; height: 356px; }
  .sessions-online::after { right: -80px; width: 170px; height: 302px; }
  .sessions-online .wrap::before, .sessions-online .wrap::after { display: none; }
}

/* Card-layout service pages (Zoom, Steps to Success) */
.fs-intro-step { margin-top: 0; }
.fs-wide { grid-column: 1 / -1; }
.fs-tags { display: flex; flex-wrap: wrap; gap: .6rem; margin: 0; }
.prose .fs-tags a { border: 1px solid var(--accent); padding: .45rem 1rem; font-size: .9rem; color: var(--dark); background: #fbf8f1; text-decoration: none; }
.prose .fs-tags a:hover { background: var(--dark); color: var(--accent-soft); border-color: var(--dark); }
.fs-faq { margin-top: 2rem; }
.fs-footnote, .fs-signoff { text-align: center; margin-top: 2rem; }
.fs-signoff p:first-child { font-family: 'Playfair Display', Georgia, serif; font-style: italic; font-size: 1.3rem; color: var(--primary); margin: 0; }

/* Services: a little more space above the "Hypnotherapy is a practice" note */
.practice-note { margin-top: 3rem; }

/* Footer disclaimer: wider and easier to read */
.site-footer .disclaimer { max-width: 1100px; font-size: .86rem; opacity: .88; line-height: 1.65; margin: 2rem auto; }

/* Footer: "Everything is working out" on the waterfall banner from musehypnotherapy.ca, above the contact details */
.site-footer { padding-top: 0; }
.footer-banner { position: relative; display: grid; place-items: center; min-height: clamp(180px, 22vw, 320px); margin-bottom: 3.5rem; background: url('/img/waterfall-banner.jpg') center/cover no-repeat; }
.footer-banner::after { content: ''; position: absolute; inset: 0; background: linear-gradient(rgba(6,59,53,.05), rgba(6,59,53,.25)); }
.footer-banner-text { position: relative; z-index: 1; margin: 0; padding: 0 1rem; text-align: center; font-family: 'Cinzel', serif; font-size: clamp(1.05rem, 2.6vw, 1.9rem); letter-spacing: .3em; text-transform: uppercase; color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.45); }

/* Zoom page: smaller page title so it fits on one line; a card heading without the gold hexagon */
.zoom-header h1 { font-size: clamp(1.6rem, 3vw, 2.3rem); }
.prose .fs-card h3.fs-plain::before { display: none; }

/* Service pages: small related-services boxes, same size as the services page boxes */
.related-services .cards { max-width: 880px; margin-inline: auto; }

/* Zoom + Steps to Success: top photo cut into a hexagon with small gold hexagon outlines floating around it */
.hex-photo-header .page-header-figure { position: relative; margin: 0; }
.hex-photo-header .page-header-figure img { position: relative; width: 70%; margin: 0 auto; display: block; aspect-ratio: .87; object-fit: cover; object-position: var(--hex-photo-pos, center); border-radius: 0; box-shadow: none; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); }
.hex-photo-header .page-header-figure::before, .hex-photo-header .page-header-figure::after { content: ''; position: absolute; background: url('/img/hexagon-gold.png') center/100% auto no-repeat; pointer-events: none; }
.hex-photo-header .page-header-figure::before { left: 0; bottom: 0; width: 130px; height: 232px; }
.hex-photo-header .page-header-figure::after { right: 0; top: -8%; width: 100px; height: 178px; opacity: .8; }
@media (max-width: 860px) {
  .hex-photo-header .page-header-figure img { width: min(70%, 300px); }
  .hex-photo-header .page-header-figure::before { left: 4%; width: 100px; height: 178px; }
  .hex-photo-header .page-header-figure::after { right: 4%; width: 80px; height: 142px; }
}
.zoom-header { --hex-photo-pos: 62% center; }

/* Services: shorter past life section (smaller hexagon photo, less space above and below) */
.past-life-feature { padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.past-life-media img { width: min(100%, 340px); }

/* Steps to Success: free recording offer, a gold-edged note between the consultation card and the boxes */
.fs-gift { max-width: 720px; margin: -1rem auto 2.5rem; padding: 1.1rem 1.6rem; text-align: center; background: #fbf8f1; border: 1px solid var(--accent); font-family: 'Playfair Display', Georgia, serif; font-style: italic; font-size: 1.2rem; color: var(--primary); box-shadow: 0 10px 24px -14px rgba(6,59,53,.35); }
.fs-gift p { margin: 0; }
.fs-gift { box-shadow: 0 18px 34px -12px rgba(6,59,53,.5), 0 6px 14px -6px rgba(6,59,53,.25); }
/* Footer banner: a little shorter */
.footer-banner { min-height: clamp(140px, 16vw, 230px); }
/* Services pillars: same hexagons as the home page, nudged out so they clear the wide sentences */
#sessions.tone-hex { background-position: right -230px top 120px; background-size: 480px; overflow: hidden; }
#sessions.tone-hex::after { left: -260px; bottom: -160px; }

/* Page headers: optional smaller line under the main title */
.page-subtitle { margin: .2rem 0 .8rem; font-family: 'Cinzel', serif; font-size: clamp(1.1rem, 2.2vw, 1.55rem); letter-spacing: .1em; text-transform: uppercase; color: var(--dark); }

/* Empowered Mind: poster shown full size under the header, then the text */
.em-poster-section { padding-bottom: 1rem; }
.em-poster { margin: 0 auto; max-width: 848px; }
.em-poster img { width: 100%; height: auto; box-shadow: 0 20px 50px -20px rgba(6,59,53,.35); }
.em-text { padding-top: 2rem; }

/* Sacred Bad Girl: water banner (no writing over it) and a dark intro with the rock photo, like musehypnotherapy.ca */
.sbg-banner { height: clamp(200px, 26vw, 360px); background: url('/img/sbg-water-banner.jpg') center 45%/cover no-repeat; }
.sbg-intro { background: #0a0a0a; color: #f4efe6; text-align: center; padding: clamp(2.5rem, 6vw, 4.5rem) 0; }
.sbg-kicker { margin: 0 0 2rem; font-family: 'Cinzel', serif; font-size: clamp(1.1rem, 2.4vw, 1.7rem); letter-spacing: .08em; text-transform: uppercase; color: #fff; }
.sbg-photo { margin: 0 auto; width: min(100%, 420px); }
.sbg-photo img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.sbg-next { margin: 2rem 0 1.2rem; font-family: 'Cinzel', serif; font-size: clamp(1.1rem, 2.4vw, 1.7rem); letter-spacing: .06em; text-transform: uppercase; color: #fff; }
.sbg-next strong { font-weight: 700; font-size: 1.15em; }
.sbg-tagline { margin: 0; font-style: italic; font-size: clamp(1.05rem, 2vw, 1.35rem); color: #e9e2d4; }

/* Sacred Bad Girl, round 2: thin water strip (cropped below the hip), black-and-grey water drop background,
   translucent grey boxes behind the white text, smaller hexagon face photo */
.sbg-banner { height: clamp(100px, 11vw, 160px); background-position: center; }
.sbg-intro { background: #0a0a0a url('/img/droplet.jpg') center/cover no-repeat; }
.sbg-box { display: block; width: fit-content; max-width: 100%; margin-inline: auto; padding: .9rem 1.8rem; background: rgba(70,70,70,.55); backdrop-filter: blur(2px); }
.sbg-kicker.sbg-box { margin-bottom: 2rem; }
.sbg-box .sbg-next { margin: 0 0 .5rem; }
.sbg-photo { width: min(100%, 280px); margin-bottom: 2rem; }
.sbg-photo img { aspect-ratio: .87; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); object-position: 45% 40%; }

/* ---- Sacred Bad Girl: whole page on the black-and-grey water drop, white writing on translucent grey ---- */
body.sbg-page { background: #0a0a0a; }
body.sbg-page main { position: relative; color: #f4efe6; --heading: #fff; --ink: #f4efe6; --ink-soft: #e2dccf; }
body.sbg-page main::before { content: ''; position: fixed; inset: 0; z-index: -1; background: #0a0a0a url('/img/droplet.jpg') center/cover no-repeat; }
body.sbg-page main > .section:not(.sbg-testimonials),
body.sbg-page main > .sbg-intro,
body.sbg-page main > .cta { background: transparent; }
body.sbg-page main > .section:not(.sbg-testimonials)::before,
body.sbg-page main > .cta::before,
body.sbg-page main > .cta::after { display: none; }
body.sbg-page main > :not(.page-header):not(.sbg-testimonials) :is(h1, h2, h3) { color: #fff; }
body.sbg-page main .eyebrow { color: var(--accent-soft); }
body.sbg-page .sbg-banner { border-block: 1px solid rgba(255,255,255,.15); }
/* the grey see-through boxes behind writing */
body.sbg-page main .prose,
body.sbg-page main .price-card,
body.sbg-page main .cta-inner { background: rgba(70,70,70,.55); backdrop-filter: blur(2px); border: 1px solid rgba(255,255,255,.12); }
body.sbg-page main .prose { padding: clamp(1.4rem, 4vw, 2.6rem); }
body.sbg-page main .cta-inner { padding: 1.8rem; }
body.sbg-page main .prose, body.sbg-page main .prose p, body.sbg-page main .prose li, body.sbg-page main .prose strong { color: #f4efe6; }
body.sbg-page main .prose a { color: var(--accent-soft); }
body.sbg-page main .price-card, body.sbg-page main .price-card p, body.sbg-page main .price-card .unit, body.sbg-page main .price-card .validity { color: #f4efe6; }
/* Sacred Bad Girl: header and testimonials keep the usual gold marble with dark writing */
body.sbg-page main > .page-header, body.sbg-page main > .sbg-testimonials { color: var(--ink); --ink: #534745; --ink-soft: #6f615d; --heading: #063b35; }
body.sbg-page main > .page-header .eyebrow { color: var(--accent-ink); }

/* Sacred Bad Girl: no grey box behind the two intro lines, no light outline on the remaining grey boxes */
.sbg-intro .sbg-kicker, .sbg-intro .sbg-next { text-shadow: 0 2px 10px rgba(0,0,0,.65); }
.sbg-intro .sbg-next { margin-bottom: 0; }
body.sbg-page main .prose, body.sbg-page main .price-card, body.sbg-page main .cta-inner { border: 0; }

/* Sacred Bad Girl intro: italic line and regular line above the photo; workshop line and "next series" below it */
.sbg-lead-script { margin: 0 0 .5rem; font-family: 'Playfair Display', Georgia, serif; font-style: italic; font-size: clamp(1.5rem, 3.4vw, 2.3rem); line-height: 1.25; color: #fff; text-shadow: 0 2px 10px rgba(0,0,0,.65); }
.sbg-lead { max-width: 46ch; margin: 0 auto 2rem; font-size: clamp(1rem, 1.8vw, 1.15rem); color: #f4efe6; text-shadow: 0 2px 8px rgba(0,0,0,.6); }
.sbg-intro .sbg-kicker { margin: 0 0 .6rem; }
.sbg-intro .sbg-next { margin-top: 0; }
/* Immersion line: a bit bigger, one line on laptops and desktops */
.sbg-lead { max-width: none; font-size: clamp(1.05rem, 1.7vw, 1.3rem); }
@media (min-width: 1000px) { .sbg-lead { white-space: nowrap; } }

/* Sacred Bad Girl: opening line in Petit Formal Script; darker water-drop background so the writing reads calmly */
.sbg-lead-script { font-family: 'Petit Formal Script', 'Playfair Display', Georgia, serif; font-style: normal; font-size: clamp(1.35rem, 3vw, 2.05rem); line-height: 1.45; }
body.sbg-page main::before { background: linear-gradient(rgba(0,0,0,.5), rgba(0,0,0,.5)), #0a0a0a url('/img/droplet.jpg') center/cover no-repeat; }
/* Sacred Bad Girl: smaller one-line "Over four sessions…" heading */
#over-four-sessions-we-draw-inspiration-from { font-size: clamp(1rem, 1.9vw, 1.3rem); letter-spacing: .03em; }
@media (min-width: 700px) { #over-four-sessions-we-draw-inspiration-from { white-space: nowrap; } }

/* Sacred Bad Girl header: water photo (cropped hip-and-below) with the title and opening lines over it */
body.sbg-page main > .page-header.sbg-header { background: #0a0a0a url('/img/sbg-water-header.jpg') center/cover no-repeat; padding-block: clamp(3rem, 7vw, 5.5rem); color: #fff; }
body.sbg-page main > .page-header.sbg-header::before { display: block; background: linear-gradient(rgba(10,10,10,.55), rgba(10,10,10,.45)); }
.sbg-header .page-header-inner { text-align: center; }
.sbg-header .page-header-text { margin-inline: auto; }
body.sbg-page main > .sbg-header h1 { color: #fff; text-shadow: 0 2px 14px rgba(0,0,0,.6); }
body.sbg-page main > .sbg-header .eyebrow { color: var(--accent-soft); }
.sbg-header .sbg-lead-script { margin: .6rem 0 .5rem; }
.sbg-header .sbg-lead { margin: 0 auto; font-size: clamp(1.1rem, 2vw, 1.45rem); }
/* body text a little higher */
body.sbg-page .sbg-intro { padding-bottom: clamp(1.5rem, 3vw, 2.5rem); }
body.sbg-page .sbg-intro + .section { padding-top: clamp(1rem, 2vw, 1.5rem); }
.sbg-intro .sbg-lead-script { margin: 0 0 1.6rem; }
.sbg-header .sbg-lead { margin-top: .6rem; }
.sbg-intro .sbg-photo + .sbg-lead-script { margin: 0 0 1.2rem; }
/* Under the photo: workshop line + next series, a gap, then the script line just above the body text */
.sbg-intro .sbg-photo { margin-bottom: 2.2rem; }
.sbg-intro .sbg-lead-script.sbg-before-text { margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; }

/* Sacred Bad Girl: waiting list box in place of the price card */
.sbg-waitlist-box { max-width: 760px; margin: 0 auto; text-align: center; padding: clamp(1.8rem, 4vw, 2.8rem); background: rgba(70,70,70,.55); backdrop-filter: blur(2px); }
.sbg-waitlist-box h2 { margin: 0 0 .6rem; font-size: clamp(1.6rem, 3.4vw, 2.4rem); }
.sbg-waitlist-box p { margin: 0 0 1.6rem; font-size: 1.15rem; color: #f4efe6; }
/* Waiting list: no grey box; heading in the script font, red, on one line */
.sbg-waitlist-box { background: transparent; backdrop-filter: none; padding-inline: 0; }
body.sbg-page main .sbg-waitlist-box h2 { font-family: 'Petit Formal Script', 'Playfair Display', Georgia, serif; text-transform: none; letter-spacing: 0; font-weight: 400; color: #e0475e; white-space: nowrap; font-size: clamp(1.05rem, 4.6vw, 2.5rem); line-height: 1.4; text-shadow: 0 2px 12px rgba(0,0,0,.7); }
.sbg-waitlist-box p { text-shadow: 0 2px 8px rgba(0,0,0,.6); }
body.sbg-page main > .sbg-waitlist .sbg-waitlist-box h2 { color: #e0475e; }
/* Waiting list heading sits a little higher */
.sbg-waitlist .sbg-waitlist-box { padding-top: 0; }
.section.sbg-waitlist { padding-top: 2.75rem; }
/* Shop: "Hypnotherapy & Private Mentorship" on one line */
#packages .section-title { max-width: none; white-space: nowrap; }
@media (max-width: 640px) { #packages .section-title { font-size: 4.1vw; letter-spacing: .02em; } }
/* Services menu: four columns (Medical, Clinical, Past Life, Creative) */
@media (min-width: 1100px) { .mega { grid-template-columns: repeat(4, 1fr); } .is-mega .dropdown { width: min(1040px, calc(100vw - 2rem)); } }
/* Service pages: small hexagon portrait with title, floated right */
.prose .bio-hex { float: right; width: 215px; margin: .25rem 0 1rem 2rem; text-align: center; }
.prose .bio-hex img { width: 100%; aspect-ratio: .87; object-fit: cover; object-position: center 20%; border-radius: 0; box-shadow: none; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); filter: drop-shadow(0 10px 20px rgba(6,59,53,.25)); margin: 0 0 .6rem; }
.prose .bio-hex figcaption { font-size: .82rem; line-height: 1.45; color: var(--ink); }
.prose .bio-hex figcaption strong { display: block; color: var(--heading, var(--dark)); }
@media (min-width: 700px) { .prose h2.one-line { white-space: nowrap; font-size: min(1.9rem, calc(min(800px, 100vw - 2rem) / var(--chars, 37.5))); } }
@media (max-width: 640px) {
  .prose .bio-hex { float: none; margin: 0 auto 1.25rem; width: 230px; }
  .prose .bio-hex img { width: 170px; margin-inline: auto; display: block; }
}
/* Service pages: hexagon photo on the left with the disclaimer under it */
.prose h2.one-line { clear: both; }
.prose .photo-hex-left { float: left; width: 300px; margin: .25rem 2rem 1rem 0; }
.prose .photo-hex-left img { width: 100%; aspect-ratio: .87; object-fit: cover; border-radius: 0; box-shadow: none; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); filter: drop-shadow(0 10px 20px rgba(6,59,53,.25)); margin: 0 0 .75rem; }
.prose .photo-hex-left figcaption { font-size: .8rem; line-height: 1.5; font-style: italic; color: var(--ink); text-align: center; }
.prose .photo-hex-left ~ ul { display: flow-root; }
@media (max-width: 640px) { .prose .photo-hex-left { float: none; width: 250px; margin: 0 auto 1.25rem; } }
/* Headings too long for one line at a readable size wrap, at the same size as the others */
@media (min-width: 700px) { .prose h2.one-line.long { white-space: normal; } }
/* Hexagon photo with nothing beside it (a heading follows): centred */
.prose .photo-hex-center { width: 300px; margin: 1rem auto 1.5rem; clear: both; }
.prose .photo-hex-center img { width: 100%; aspect-ratio: .87; object-fit: cover; border-radius: 0; box-shadow: none; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); filter: drop-shadow(0 10px 20px rgba(6,59,53,.25)); margin: 0; }
.prose .photo-hex-left ~ ol { display: flow-root; }
@media (max-width: 640px) { .prose .photo-hex-center { width: 250px; } }
/* Bottom disclaimer sits a little lower, away from the FAQs */
.prose .page-disclaimer { margin-top: 3rem; }
.prose h2.space-above { margin-top: 3.5rem; }
/* Gold hexagon set behind a hexagon photo, slightly offset */
.prose .hex-gold { position: relative; isolation: isolate; }
.prose .hex-gold::before { content: ''; position: absolute; z-index: -1; left: -14px; top: 14px; width: 100%; aspect-ratio: .87; background: linear-gradient(135deg, rgba(201,168,92,.9), rgba(236,216,157,.75) 55%, rgba(169,140,63,.9)), url('/img/texture-gold-leaf.jpg') center/cover; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); }
/* Photo with its text centred beside it */
.prose .hex-row { display: flex; align-items: center; gap: 2.5rem; margin: 1.5rem 0 2rem; clear: both; }
.prose .hex-row .hex-gold { flex: 0 0 300px; margin: 0; }
.prose .hex-row .hex-gold img { width: 100%; aspect-ratio: .87; object-fit: cover; border-radius: 0; box-shadow: none; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); filter: drop-shadow(0 10px 20px rgba(6,59,53,.25)); margin: 0; display: block; }
.prose .hex-row-text { flex: 1; text-align: center; }
@media (min-width: 1100px) {
  .prose .hex-row { margin-left: -90px; }
  .prose .photo-hex-left.shift-left { margin-left: -90px; }
}
@media (max-width: 640px) {
  .prose .hex-row { flex-direction: column; gap: 1.25rem; }
  .prose .hex-row .hex-gold { flex-basis: auto; width: 250px; }
}
/* Gold hexagon behind photos: outline only (like the brand hexagon), not solid */
.prose .hex-gold::before { left: -18px; top: 16px; background: linear-gradient(135deg, #b8913e, #ecd89d 45%, #c9a85c 70%, #a98c3f), url('/img/texture-gold-leaf.jpg') center/cover; clip-path: polygon(evenodd, 50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%, 50% 0, 50% 1.4%, 98.8% 25.7%, 98.8% 74.3%, 50% 98.6%, 1.2% 74.3%, 1.2% 25.7%, 50% 1.4%); }
/* Styled FAQ block: gold marble panel, centred heading, white cards with turquoise hexagon toggles */
.prose .faq-block { clear: both; margin: 5rem 0 0; padding: 2.75rem 2.25rem 2.25rem; background: url('/img/texture-gold-marble-1.jpg') center/cover; border-radius: 6px; box-shadow: 0 18px 40px rgba(6,59,53,.12); }
.prose .faq-block .faq-eyebrow { text-align: center; margin: 0 0 .35rem; font-size: .78rem; letter-spacing: .22em; text-transform: uppercase; color: #8a6d2c; font-weight: 600; }
.prose .faq-block .faq-title { text-align: center; margin: 0 0 1.75rem; font-size: clamp(1.15rem, 2.6vw, 1.55rem); }
.prose .faq-block .faq-title::after { content: ''; display: block; width: 18px; height: 18px; margin: .8rem auto 0; background: var(--accent); clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0 50%); }
.prose .faq-block details.faq { background: rgba(255,255,255,.92); border: 1px solid rgba(201,168,92,.55); border-left: 4px solid #c9a85c; border-radius: 4px; margin: .75rem 0; box-shadow: 0 4px 14px rgba(6,59,53,.06); transition: box-shadow .2s; }
.prose .faq-block details.faq:hover, .prose .faq-block details.faq[open] { box-shadow: 0 8px 22px rgba(6,59,53,.12); }
.prose .faq-block details.faq summary { padding-right: 3rem; }
.prose .faq-block details.faq summary::after { content: '+'; right: 0; width: 30px; height: 30px; display: grid; place-items: center; line-height: 1; font-size: 1.25rem; color: #fff; background: url('/img/texture-turquoise-paint.jpg') center/cover, #1c8d86; clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0 50%); }
@media (max-width: 640px) { .prose .faq-block { padding: 2rem 1rem 1.25rem; margin-top: 3.5rem; } }
@media (max-width: 640px) { .prose .faq-block details.faq summary { font-size: .9rem; } }
.prose .faq-block + * { margin-top: 2.5rem; }
/* Disclaimer under a gold-outlined photo sits clear of the outline */
.prose .hex-gold figcaption { margin-top: 1.9rem; }
/* Heading in the home page's elegant italic (Playfair Display) */
.prose h2.h-italic, .prose h2.one-line.h-italic { font-family: 'Playfair Display', Georgia, serif; font-style: italic; font-weight: 400; text-transform: none; letter-spacing: 0; font-size: 1.6rem; line-height: 1.3; }
.prose h2.h-italic, .prose h2.one-line.h-italic { font-size: 1.9rem; }
/* Gold outline set farther from the photo, plus a small outline hexagon below and to the left */
.prose .hex-gold-far::before { left: -30px; top: 28px; }
.prose .hex-gold-far::after { content: ''; position: absolute; z-index: -1; left: -62px; top: 74%; width: 30%; aspect-ratio: .87; background: linear-gradient(135deg, #b8913e, #ecd89d 45%, #c9a85c 70%, #a98c3f), url('/img/texture-gold-leaf.jpg') center/cover; clip-path: polygon(evenodd, 50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%, 50% 0, 50% 3%, 97.4% 26.5%, 97.4% 73.5%, 50% 97%, 2.6% 73.5%, 2.6% 26.5%, 50% 3%); }
.prose .hex-gold-far { margin-bottom: 2.75rem; }
@media (max-width: 640px) { .prose .hex-gold-far::after { left: -30px; } }
/* Small hexagon placed from the photo's own size, so a caption underneath doesn't move it */
.prose .hex-gold-far::after { top: 0; transform: translateY(246%); }
/* More breathing room: both gold outlines sit further down and to the left of the photo */
.prose .hex-gold-far::before { left: -42px; top: 40px; }
.prose .hex-gold-far::after { left: -80px; transform: translateY(268%); }
.prose .hex-gold-far figcaption { margin-top: 2.9rem; }
.prose .hex-gold-far { margin-bottom: 3.5rem; }
@media (max-width: 640px) { .prose .hex-gold-far::before { left: -28px; top: 30px; } .prose .hex-gold-far::after { left: -40px; } }
/* One-line titles: leave room for the scrollbar on tablet-width screens */
@media (min-width: 700px) { .prose h2.one-line:not(.h-italic) { font-size: min(1.9rem, calc(min(800px, 100vw - 3.5rem) / var(--chars, 37.5))); } }
@media (max-width: 899px) { .prose h2.h-italic { white-space: normal; } }
/* Photo with a full block of text beside it, text left-aligned */
.prose .hex-row-left .hex-row-text { text-align: left; }
.prose .hex-row .hex-gold-far { margin-bottom: 0; }
@media (max-width: 640px) { .prose .hex-row { gap: 2.75rem; } }
.prose .hex-row { margin-bottom: 3rem; }
/* A heading that follows a photo row gets a clear gap, clear of the small gold hexagon */
.prose .hex-row + h2 { margin-top: 5.5rem; }
/* Call-to-action button inside page text, centred */
.prose .cta-inline { text-align: center; margin: 1.75rem 0 1rem; }
/* Heading right after a centred gold-hexagon photo: clear gap below the small hexagon */
.prose .photo-hex-center.hex-gold-far + h2 { margin-top: 5.5rem; }
.prose .cta-inline { margin-top: 2.75rem; }
/* Paragraphs beside a left photo stay in their column (no last line tucking under the photo) */
.prose .photo-hex-left ~ p { display: flow-root; }
.prose .cta-inline { clear: both; }
/* Larger photo beside its text (Past Life Memories) */
.prose .hex-row-lg .hex-gold { flex-basis: 360px; }
@media (max-width: 640px) { .prose .hex-row-lg .hex-gold { width: 290px; flex-basis: auto; } }
/* Square photo (words to the edges): hexagon in square proportions so nothing is cut off */
.prose .hex-square img { aspect-ratio: 1 !important; }
.prose .hex-square::before { aspect-ratio: 1; }
.prose .hex-square::after { transform: translateY(232%); }
/* A long italic title that should still sit on one line on computers: scale it to the column */
@media (min-width: 900px) { .prose h2.h-italic.h-italic-fit { white-space: nowrap; font-size: min(1.9rem, calc(min(800px, 100vw - 3.5rem) / 33)); } }
/* Recordings not on sale yet: same button look, not clickable */
.btn-soon { cursor: default; pointer-events: none; opacity: .85; }
/* Gallery: a line of its own in the elegant italic */
.gallery-tagline { font-family: 'Playfair Display', Georgia, serif; font-style: italic; font-size: 1.35rem; line-height: 1.4; color: var(--primary); margin: .25rem 0 1.25rem; }
/* Hero logo: the gold hexagon is centred on the turquoise circle itself (the circle sits at
   49.5% across / 47% down inside logo.png, because its rays reach further below than above). */
.hero-centered .hero-inner::before { display: none; }
.hero-mark { position: relative; display: block; width: 160px; margin: 0 auto 1.5rem; }
.hero-mark .hero-logo { display: block; width: 100%; height: auto; margin: 0; }
.hero-mark::before { content: ''; position: absolute; left: 49.5%; top: 47.04%; width: 84.4%; aspect-ratio: 485 / 421; transform: translate(-50%, -50%); background: url('/img/hexagon-gold-trim.png') center/contain no-repeat; opacity: .7; pointer-events: none; }