/* =====================================================================
   FIFTH DIMENSION — FRONT-END STYLES FOR ELEMENTOR
   Adapted from the approved Phase 1 stylesheet (assets/css/styles.css).

   How this file works with Elementor
   - Colours, fonts, heading sizes, button styles, section padding and
     backgrounds are set in Elementor (Site Settings + widget controls),
     so they stay editable. This file only adds what Elementor's controls
     cannot express: decorative lines, the gable clip-path, card layouts,
     the transparent home header, reveal motion, and the markup of the
     Fifth Dimension widgets.
   - Selectors use the fd-* classes set in each element's
     Advanced → CSS Classes field, and are kept at low specificity so a
     value changed in Elementor wins.
   - Works with and without Elementor's "Optimized markup" feature
     (with or without .elementor-widget-container).

   Sections
   1. Tokens            7. Treatment widgets     13. Booking widget
   2. Base & helpers    8. Pricing widgets       14. Contact & forms
   3. Header            9. Gallery & images      15. Footer
   4. Hero             10. FAQ (toggle)          16. Legal pages
   5. Type components  11. Session hour          17. Motion
   6. Section layouts  12. Notices & markers
   ===================================================================== */

/* 1. TOKENS ----------------------------------------------------------- */
:root {
  --fd-ivory: #f8f6f0;
  --fd-cream: #eeeadf;
  --fd-paper: #fbfaf6;
  --fd-sage: #a4b49e;
  --fd-sage-soft: #dfe5da;
  --fd-forest: #354b3d;
  --fd-forest-deep: #26372c;
  --fd-taupe: #b7a899;
  --fd-charcoal: #2f3530;
  --fd-muted: #5b635c;
  --fd-rose: #c79a8e;
  --fd-rose-soft: #f1e3dd;
  --fd-line: #d9d3c6;
  --fd-white: #ffffff;
  --fd-focus: #1f5e9c;

  --fd-display: "Cormorant Garamond", "Cormorant", Garamond, "Times New Roman", serif;
  --fd-body: "DM Sans", "Helvetica Neue", Arial, system-ui, sans-serif;

  --fd-header-h: 76px;
  --fd-radius: 4px;
  --fd-radius-lg: 10px;
  --fd-ease: cubic-bezier(.22,.61,.36,1);
  --fd-gable: polygon(50% 0%, 100% 22%, 100% 100%, 0% 100%, 0% 22%);
  --fd-admin-bar: 0px;
}
body.admin-bar { --fd-admin-bar: 32px; }
@media (max-width: 782px) { body.admin-bar { --fd-admin-bar: 46px; } }

/* 2. BASE & HELPERS --------------------------------------------------- */
body.fd-site { -webkit-font-smoothing: antialiased; overflow-x: hidden; }
body.fd-site :focus-visible { outline: 2px solid var(--fd-focus); outline-offset: 3px; border-radius: 2px; }
body.fd-site ::selection { background: var(--fd-sage-soft); color: var(--fd-forest-deep); }
.fd-site .elementor-heading-title { text-wrap: balance; }
.fd-site .elementor-heading-title em { font-style: italic; }
.fd-site .elementor-widget-text-editor p:last-child { margin-bottom: 0; }
.fd-site .elementor-button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; transition: background-color .3s var(--fd-ease), color .3s var(--fd-ease), border-color .3s var(--fd-ease), transform .3s var(--fd-ease); }
.fd-site .elementor-button:active { transform: translateY(1px); }
/* Reading measures. Elementor caps widgets with a 4-class max-width:100% rule, so these match its specificity. */
.elementor.elementor .e-con > .fd-measure, .e-con.e-con > .e-con-inner > .fd-measure { max-width: 38rem; }
.elementor.elementor .e-con > .fd-measure-wide, .e-con.e-con > .e-con-inner > .fd-measure-wide { max-width: 46rem; }
.elementor.elementor .e-con > .fd-measure-cta, .e-con.e-con > .e-con-inner > .fd-measure-cta { max-width: 34rem; }
.fd-section-head--center { text-align: center; }
.fd-muted, .fd-muted p { color: var(--fd-muted); }
.fd-small, .fd-small p { font-size: .9375rem; }
.fd-text-link a, a.fd-text-link {
  display: inline-flex; gap: .45rem; font-size: .9375rem; font-weight: 500; text-decoration: none;
  color: var(--fd-forest); border-bottom: 1px solid var(--fd-taupe); padding-bottom: 2px;
}
.fd-text-link a:hover, a.fd-text-link:hover { border-bottom-color: var(--fd-forest); }
.fd-skip-link {
  position: absolute; left: 16px; top: -100px; z-index: 1000; background: var(--fd-forest); color: #fff;
  padding: .75rem 1rem; border-radius: var(--fd-radius);
}
.fd-skip-link:focus { top: calc(var(--fd-admin-bar) + 12px); color: #fff; }

/* 3. HEADER (Theme Builder header) ------------------------------------ */
.fd-site .elementor-location-header {
  position: sticky; top: var(--fd-admin-bar); z-index: 50;
}
.fd-header {
  background: rgba(248, 246, 240, 0.96);
  border-bottom: 1px solid transparent;
  transition: border-color .3s var(--fd-ease), background-color .3s var(--fd-ease);
}
.fd-header.is-scrolled { border-bottom-color: var(--fd-line); }

.fd-brand .brand,
a.brand {
  display: inline-flex; align-items: center; gap: .7rem; text-decoration: none; color: var(--fd-forest);
  font-family: var(--fd-display); font-size: 1.55rem; font-weight: 500; letter-spacing: .01em; white-space: nowrap; line-height: 1.2;
}
.brand__mark { width: 26px; height: 30px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.4; }
.brand__mark .brand__dot { fill: var(--fd-rose); stroke: none; }
.brand__logo { max-height: 44px; width: auto; display: block; }
@media (max-width: 400px) { .fd-brand .brand { font-size: 1.3rem; } }

/* Elementor Pro Nav Menu inside the header */
.fd-nav .elementor-nav-menu--main .elementor-item { padding-left: 0; padding-right: 0; }
.fd-nav .elementor-nav-menu--main .elementor-item.elementor-item-active { font-weight: inherit; }
.fd-nav .elementor-menu-toggle { border: 1px solid var(--fd-line); border-radius: 999px; min-width: 44px; min-height: 44px; }
.fd-nav .elementor-nav-menu--dropdown { border-top: 1px solid var(--fd-line); box-shadow: 0 24px 40px -30px rgba(38,55,44,.35); }
.fd-nav .elementor-nav-menu--dropdown .elementor-item { border-bottom: 1px solid var(--fd-line); }
/* "Book a treatment" lives in the header button on desktop and in the dropdown on tablet/phone. */
.fd-nav .elementor-nav-menu--main .fd-menu-book { display: none; }
.fd-nav .elementor-nav-menu--dropdown .fd-menu-book .elementor-item { font-style: italic; }
@media (max-width: 1024px) {
  .fd-header-cta { display: none; }
}
/* Hello Elementor's own header (shown only while Elementor Pro is inactive) */
.site-navigation .fd-menu-book { display: none; }

/* Home: header floats over the hero photograph until the page scrolls */
.fd-home .elementor-location-header { position: fixed; top: var(--fd-admin-bar); left: 0; right: 0; }
.fd-home .fd-header:not(.is-scrolled):not(.is-open) { background: transparent; }
.fd-home .fd-header.is-scrolled { background: rgba(248, 246, 240, 0.97); }
.fd-home .fd-header:not(.is-scrolled):not(.is-open) .brand { color: #fff; }
.fd-home .fd-header:not(.is-scrolled):not(.is-open) .fd-nav .elementor-nav-menu--main .elementor-item { color: #fff !important; }
.fd-home .fd-header:not(.is-scrolled):not(.is-open) .fd-nav .elementor-nav-menu--main .elementor-item:after { background-color: #fff !important; }
.fd-home .fd-header:not(.is-scrolled):not(.is-open) .fd-nav .elementor-menu-toggle { color: #fff !important; border-color: rgba(255,255,255,.55); background: transparent !important; }
.fd-home .fd-header:not(.is-scrolled):not(.is-open) .fd-nav .elementor-menu-toggle svg { fill: #fff !important; }
.fd-home .fd-header:not(.is-scrolled):not(.is-open) .fd-header-cta .elementor-button { background: #fff !important; color: var(--fd-forest) !important; border-color: #fff !important; }
.fd-home .fd-header.is-open { background: var(--fd-ivory); }

/* 4. HERO ------------------------------------------------------------- */
.fd-hero { box-shadow: inset 0 200px 140px -100px rgba(20,30,23,.45); overflow: hidden; }
.elementor-element.fd-hero-content { max-width: 40rem; }
.elementor.elementor .e-con > .fd-hero-lead, .e-con.e-con > .e-con-inner > .fd-hero-lead { max-width: 32rem; }
.fd-hero-meta { font-size: .9375rem; }
.fd-hero-meta p { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin: 0; }
.fd-hero-meta span.fd-dot { display: inline-flex; align-items: center; gap: .5rem; }
.fd-hero-meta span.fd-dot::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--fd-rose); }

/* 5. TYPE COMPONENTS -------------------------------------------------- */
.fd-eyebrow .elementor-heading-title { display: inline-flex; align-items: center; gap: .7rem; }
.fd-eyebrow .elementor-heading-title::before { content: ""; width: 28px; height: 1px; background: var(--fd-taupe); flex: none; }
.fd-eyebrow--light .elementor-heading-title::before { background: var(--fd-sage); }
.fd-eyebrow--rose .elementor-heading-title::before { background: var(--fd-rose); }
.fd-eyebrow--center .elementor-heading-title { justify-content: center; }

/* 6. SECTION LAYOUTS -------------------------------------------------- */
.fd-gable { position: relative; z-index: 0; }
.fd-gable img { clip-path: var(--fd-gable); aspect-ratio: 4 / 5; width: 100%; max-width: 100%; height: auto; object-fit: cover; display: block; }
.fd-gable::before {
  content: ""; position: absolute; top: -14px; right: -14px; bottom: 14px; left: 14px; z-index: -1;
  clip-path: var(--fd-gable); background: var(--fd-sage-soft); pointer-events: none;
}
.fd-gable figcaption, .fd-gable .widget-image-caption { margin-top: .75rem; font-size: .8125rem; color: var(--fd-muted); letter-spacing: .04em; text-align: left; }
.fd-banner img { width: 100%; aspect-ratio: 21 / 9; object-fit: cover; border-radius: var(--fd-radius-lg); display: block; }
@media (max-width: 767px) { .fd-banner img { aspect-ratio: 4 / 3; } }
.fd-space-img img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--fd-radius); display: block; }
.fd-cta-band .elementor-heading-title { max-width: 18ch; margin-inline: auto; }

/* Package flow & step cards */
.fd-flow-card { background: #fff; border: 1px solid var(--fd-line); border-radius: var(--fd-radius-lg); }

/* Fact list (also used by the Price Facts widget) */
.fact-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1.5rem; border-top: 1px solid var(--fd-line); padding-top: 1.5rem; margin: 0; }
.fact { display: grid; gap: .2rem; }
.fact dt { font-size: .8125rem; letter-spacing: .14em; text-transform: uppercase; color: var(--fd-muted); }
.fact dd { margin: 0; font-family: var(--fd-display); font-size: 1.7rem; color: var(--fd-forest); line-height: 1.2; font-variant-numeric: lining-nums; }

/* 7. TREATMENT WIDGETS ------------------------------------------------ */
.price { font-family: var(--fd-display); font-weight: 500; color: var(--fd-forest); font-variant-numeric: lining-nums tabular-nums; line-height: 1; }
.fd-site .fd-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem; min-height: 48px; padding: .8rem 1.6rem;
  font-family: var(--fd-body); font-size: .9375rem; font-weight: 500; letter-spacing: .02em; line-height: 1.2;
  text-decoration: none; border-radius: 999px; border: 1px solid var(--fd-forest); background: var(--fd-forest); color: #fff; cursor: pointer;
  transition: background-color .3s var(--fd-ease), color .3s var(--fd-ease), border-color .3s var(--fd-ease);
}
.fd-site .fd-btn:hover, .fd-site .fd-btn:focus { background: var(--fd-forest-deep); border-color: var(--fd-forest-deep); color: #fff; }
.fd-site .fd-btn .arrow { transition: transform .3s var(--fd-ease); }
.fd-site .fd-btn:hover .arrow { transform: translateX(3px); }
.fd-site .fd-btn--ghost { background: transparent; color: var(--fd-forest); }
.fd-site .fd-btn--ghost:hover, .fd-site .fd-btn--ghost:focus { background: var(--fd-forest); color: #fff; }
.fd-site .fd-btn--light { background: #fff; color: var(--fd-forest); border-color: #fff; }
.fd-site .fd-btn--light:hover, .fd-site .fd-btn--light:focus { background: var(--fd-cream); color: var(--fd-forest-deep); border-color: var(--fd-cream); }
.fd-site .fd-btn[disabled] { opacity: .45; cursor: not-allowed; }
.fd-site .fd-btn-row { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }

.service-grid { display: grid; gap: 2rem; }
@media (min-width: 800px) { .service-grid { grid-template-columns: 1fr 1fr; } }
.service-card {
  display: grid; grid-template-rows: auto 1fr; background: var(--fd-paper); border-radius: var(--fd-radius-lg); overflow: hidden;
  border: 1px solid var(--fd-line); transition: transform .5s var(--fd-ease), box-shadow .5s var(--fd-ease);
}
.service-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px -28px rgba(38,55,44,.45); }
.service-card__media { overflow: hidden; aspect-ratio: 3 / 2; margin: 0; }
.service-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--fd-ease); display: block; }
.service-card:hover .service-card__media img { transform: scale(1.04); }
.service-card__body { display: grid; gap: 1rem; padding: 2rem; align-content: start; }
.service-card__top { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; flex-wrap: wrap; }
.service-card .service-card__top h3 { margin: 0; font-family: var(--fd-display); font-weight: 500; color: var(--fd-forest); font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.1rem); line-height: 1.12; }
.service-card__from { font-size: .9375rem; color: var(--fd-muted); }
.service-card__from .price { font-size: 2rem; }
.service-card__body p { margin: 0; color: var(--fd-muted); }
.service-card__foot { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; margin-top: .5rem; }

/* 8. PRICING WIDGETS -------------------------------------------------- */
.pricing-grid { display: grid; gap: 1.5rem; }
@media (min-width: 700px) { .pricing-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .pricing-grid--four { grid-template-columns: repeat(4, 1fr); } }
.price-card { display: flex; flex-direction: column; gap: 1rem; background: var(--fd-paper); border: 1px solid var(--fd-line); border-radius: var(--fd-radius-lg); padding: 2rem 1.5rem; }
.price-card--package { background: #fff; border-color: var(--fd-sage); }
.price-card__family { font-size: .8125rem; letter-spacing: .14em; text-transform: uppercase; color: var(--fd-muted); }
.price-card h3.price-card__name { margin: 0; font-family: var(--fd-display); font-weight: 500; color: var(--fd-forest); font-size: 1.6rem; line-height: 1.12; }
.price-card__price { display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; }
.price-card__price .price { font-size: 3rem; }
.price-card__per { font-size: .9375rem; color: var(--fd-muted); }
.price-card__list { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; font-size: .9375rem; color: var(--fd-charcoal); }
.price-card__list li { display: flex; gap: .6rem; }
.price-card__list li::before { content: ""; flex: none; width: 6px; height: 6px; margin-top: .62em; border: 1px solid var(--fd-forest); transform: rotate(45deg); }
.fd-site .price-card .fd-btn { margin-top: auto; }
.saving-chip { align-self: flex-start; display: inline-flex; gap: .4rem; align-items: center; font-size: .8125rem; font-weight: 500; letter-spacing: .04em; color: var(--fd-forest-deep); background: var(--fd-sage-soft); padding: .3rem .75rem; border-radius: 999px; }

.package-strip { display: grid; gap: 1.5rem; }
@media (min-width: 800px) { .package-strip { grid-template-columns: 1fr 1fr; } }
.package-strip > * { min-width: 0; }
.package-row {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .75rem 1.5rem; align-items: end; min-width: 0;
  padding: clamp(1.25rem, 4vw, 2rem); border-radius: var(--fd-radius-lg); background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.18);
}
.package-strip .package-row h3 { margin: 0; font-family: var(--fd-display); font-weight: 500; font-size: 1.7rem; color: #fff; min-width: 0; line-height: 1.12; }
.package-row p { margin: 0; color: #cfd8cc; font-size: .9375rem; grid-column: 1 / -1; }
.package-row .price { color: #fff; font-size: 2.6rem; }
.package-row .saving-chip { background: rgba(255,255,255,.12); color: #f1f4ef; grid-column: 1 / -1; }
.fd-site .package-row .fd-btn { grid-column: 1 / -1; justify-self: start; }

.compare-wrap { overflow-x: auto; border: 1px solid var(--fd-line); border-radius: var(--fd-radius-lg); background: var(--fd-paper); }
.compare { width: 100%; border-collapse: collapse; font-size: .9375rem; min-width: 560px; font-variant-numeric: tabular-nums; margin: 0; }
.compare-wrap .compare th, .compare-wrap .compare td { padding: 1rem 1.25rem; text-align: left; border: 0; border-bottom: 1px solid var(--fd-line); background: transparent; }
/* Hello Elementor's table reset adds zebra stripes and hover shading; the approved table has neither. */
.compare-wrap .compare tbody > tr:nth-child(odd) > td, .compare-wrap .compare tbody > tr:nth-child(odd) > th,
.compare-wrap .compare tbody > tr:hover > td, .compare-wrap .compare tbody > tr:hover > th { background: transparent; }
.compare thead th { font-size: .8125rem; letter-spacing: .12em; text-transform: uppercase; color: var(--fd-muted); font-weight: 500; }
.compare tbody th { font-weight: 500; color: var(--fd-forest); }
.compare tbody tr:last-child > * { border-bottom: 0; }
.compare .num { text-align: right; }
.fd-visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* 9. GALLERY & IMAGES ------------------------------------------------- */
.e-con.fd-gallery { --grid-auto-flow: row dense; grid-auto-flow: row dense; }
.fd-gallery-img, .fd-gallery-img .elementor-widget-container, .fd-gallery-img a { height: 100%; display: block; }
.fd-gallery-img img { width: 100%; height: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: var(--fd-radius); display: block; transition: transform 1s var(--fd-ease); }
.fd-gallery-img--wide img { aspect-ratio: 2 / 1; }
.fd-gallery-img--tall img { aspect-ratio: 1 / 2; }
.fd-gallery-img a { overflow: hidden; border-radius: var(--fd-radius); cursor: zoom-in; }
.fd-gallery-img a:hover img { transform: scale(1.035); }

/* 10. FAQ (classic Toggle widget) ------------------------------------- */
.fd-faq .elementor-toggle { border-top: 1px solid var(--fd-line); }
.fd-faq .elementor-toggle .elementor-toggle-item { border-bottom: 1px solid var(--fd-line); margin: 0; }
.fd-faq .elementor-toggle .elementor-tab-title { display: flex; justify-content: space-between; align-items: center; gap: 1rem; border: 0; padding: 1.35rem 0; line-height: 1.3; }
.fd-faq .elementor-toggle .elementor-tab-title .elementor-toggle-icon { order: 2; width: auto; }
.fd-faq .elementor-toggle .elementor-tab-content { border: 0; padding: 0 0 1.5rem; max-width: 44rem; }
.fd-faq .elementor-toggle .elementor-tab-content p + p { margin-top: .7em; }

/* 11. SESSION HOUR ---------------------------------------------------- */
.fd-session-bar { overflow: hidden; }
.fd-step .elementor-heading-title { display: flex; align-items: center; gap: .6rem; }
.fd-step .elementor-heading-title::before { content: ""; width: 10px; height: 10px; border-radius: 50%; flex: none; background: var(--fd-taupe); }
.fd-step--2 .elementor-heading-title::before { background: var(--fd-forest); }
.fd-step--3 .elementor-heading-title::before { background: var(--fd-rose); }
.fd-session-note { border-left: 2px solid var(--fd-sage); padding-left: 1rem; }

/* 12. NOTICES & "TO CONFIRM" MARKERS ---------------------------------- */
.notice { display: grid; gap: .5rem; background: var(--fd-rose-soft); border-radius: var(--fd-radius-lg); padding: 1.5rem 2rem; color: var(--fd-charcoal); font-size: .9375rem; }
.notice strong { color: var(--fd-forest-deep); font-weight: 600; }
.notice--sage { background: var(--fd-sage-soft); }
.notice--plain { background: var(--fd-paper); border: 1px solid var(--fd-line); }
.fd-notice .elementor-widget-container, .fd-notice.elementor-widget-text-editor { border-radius: var(--fd-radius-lg); }
.placeholder {
  display: inline-flex; align-items: center; gap: .4rem; font-family: var(--fd-body); font-size: .8125rem; font-weight: 500; letter-spacing: .04em; font-style: normal;
  color: #7a4a3e; background: var(--fd-rose-soft); border: 1px dashed #c79a8e; padding: .2rem .6rem; border-radius: var(--fd-radius); line-height: 1.5; vertical-align: middle;
}
.placeholder::before { content: "To confirm"; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; font-size: .68rem; }
.placeholder--block { display: grid; gap: .3rem; padding: 1rem 1.5rem; font-size: .9375rem; line-height: 1.6; }
.hide-placeholders .placeholder { display: none !important; }
.fd-dark .placeholder { color: #f3e2dc; border-color: rgba(241,227,221,.5); background: transparent; }

/* 13. BOOKING WIDGET -------------------------------------------------- */
.booking-shell { display: grid; gap: 3rem; align-items: start; }
@media (min-width: 1025px) { .booking-shell { grid-template-columns: minmax(0, 1fr) 340px; } }
.booking-main { display: grid; gap: 3rem; min-width: 0; }
.booking-step { display: grid; gap: 1.5rem; }
.booking-step__head { display: flex; align-items: baseline; gap: 1rem; }
.booking-step__num { flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--fd-forest); color: var(--fd-forest); font-size: .9375rem; font-variant-numeric: tabular-nums; transform: translateY(-4px); }
.fd-booking .booking-step__head h2 { margin: 0; font-family: var(--fd-display); font-weight: 500; color: var(--fd-forest); font-size: 2rem; line-height: 1.12; }
.booking-step[data-locked="true"] { opacity: .45; pointer-events: none; }
.option-grid { display: grid; gap: 1rem; }
@media (min-width: 640px) { .option-grid { grid-template-columns: 1fr 1fr; } }
.fd-booking .option {
  position: relative; display: grid; gap: .5rem; text-align: left; width: 100%;
  padding: 1.5rem 3.2rem 1.5rem 1.5rem; border-radius: var(--fd-radius-lg); border: 1px solid var(--fd-line); background: var(--fd-paper);
  cursor: pointer; font: inherit; color: inherit; line-height: 1.5; white-space: normal;
  transition: border-color .25s var(--fd-ease), background-color .25s var(--fd-ease), box-shadow .25s var(--fd-ease);
}
.fd-booking .option:hover, .fd-booking .option:focus { border-color: var(--fd-sage); background: var(--fd-paper); color: inherit; }
.fd-booking .option[aria-checked="true"] { border-color: var(--fd-forest); background: #fff; box-shadow: inset 0 0 0 1px var(--fd-forest); }
.fd-booking .option::after { content: ""; position: absolute; top: 1.5rem; right: 1.5rem; width: 20px; height: 20px; border-radius: 50%; border: 1px solid var(--fd-taupe); background: #fff; transition: border-width .2s var(--fd-ease), border-color .2s var(--fd-ease); }
.fd-booking .option[aria-checked="true"]::after { border: 6px solid var(--fd-forest); }
.option__family { font-size: .8125rem; letter-spacing: .14em; text-transform: uppercase; color: var(--fd-muted); }
.option__name { font-family: var(--fd-display); font-size: 1.5rem; color: var(--fd-forest); line-height: 1.2; }
.option__meta { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: baseline; font-size: .9375rem; color: var(--fd-muted); }
.option__meta .price { font-size: 1.6rem; }
.mode-badge { display: inline-flex; align-items: center; gap: .5rem; font-size: .8125rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; padding: .35rem .8rem; border-radius: 999px; background: var(--fd-rose-soft); color: #6e463c; }
.mode-badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #b16f5f; }
.scheduler { border: 1px solid var(--fd-line); border-radius: var(--fd-radius-lg); background: var(--fd-paper); overflow: hidden; }
.scheduler__bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .75rem; padding: 1rem 1.5rem; border-bottom: 1px solid var(--fd-line); background: #fff; font-size: .9375rem; color: var(--fd-muted); }
.scheduler__body { padding: 2rem 1.5rem; display: grid; gap: 2rem; }
.demo-grid { display: grid; gap: 2rem; }
@media (min-width: 760px) { .demo-grid { grid-template-columns: 1.15fr 1fr; } }
.demo-grid > * { min-width: 0; }
.calendar { display: grid; gap: .75rem; }
.calendar__head { display: flex; justify-content: space-between; align-items: center; }
.calendar__title { font-family: var(--fd-display); font-size: 1.5rem; color: var(--fd-forest); }
.calendar__nav { display: flex; gap: .5rem; }
.fd-booking .icon-btn { width: 40px; height: 40px; min-height: 0; padding: 0; border-radius: 50%; border: 1px solid var(--fd-line); background: #fff; color: var(--fd-forest); cursor: pointer; display: grid; place-items: center; font-size: 1rem; }
.fd-booking .icon-btn:hover:not(:disabled) { border-color: var(--fd-forest); background: #fff; color: var(--fd-forest); }
.fd-booking .icon-btn:disabled { opacity: .35; cursor: not-allowed; }
.calendar__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.calendar__dow { font-size: .8125rem; text-align: center; color: var(--fd-muted); padding-block: .3rem; letter-spacing: .06em; }
.fd-booking .day { aspect-ratio: 1 / 1; min-height: 38px; border-radius: 50%; border: 1px solid transparent; background: transparent; font: inherit; font-size: .9375rem; color: var(--fd-muted); font-variant-numeric: tabular-nums; cursor: default; display: grid; place-items: center; padding: 0; }
.fd-booking .day--available { background: var(--fd-sage-soft); color: var(--fd-forest-deep); cursor: pointer; font-weight: 500; }
.fd-booking .day--available:hover { border-color: var(--fd-forest); background: var(--fd-sage-soft); color: var(--fd-forest-deep); }
.fd-booking .day[aria-pressed="true"] { background: var(--fd-forest); color: #fff; }
.fd-booking .day--today { text-decoration: underline; text-underline-offset: 3px; }
.fd-booking .day:disabled { color: #a9aea8; background: transparent; }
/* Small phones: the approved 38px day cells (7 across) need ~290px, more than a 320px
   screen leaves inside the scheduler, so the last column was clipped. Tighten instead. */
@media (max-width: 420px) {
  .fd-booking .scheduler__body { padding: 1.5rem 1rem; }
  .fd-booking .calendar__grid { gap: 2px; }
  .fd-booking .day { min-height: 0; width: 100%; }
  .fd-booking .scheduler__bar { padding: 1rem; }
}
.slots { display: grid; gap: .75rem; align-content: start; }
.slots__title { font-size: .9375rem; color: var(--fd-muted); }
.slots__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: .5rem; }
.fd-booking .slot { min-height: 46px; padding: 0 .5rem; border-radius: var(--fd-radius); border: 1px solid var(--fd-line); background: #fff; font: inherit; font-size: .9375rem; color: var(--fd-forest); cursor: pointer; font-variant-numeric: tabular-nums; transition: border-color .2s var(--fd-ease), background-color .2s var(--fd-ease); }
.fd-booking .slot:hover, .fd-booking .slot:focus { border-color: var(--fd-forest); background: #fff; color: var(--fd-forest); }
.fd-booking .slot[aria-pressed="true"] { background: var(--fd-forest); color: #fff; border-color: var(--fd-forest); }
.slots__empty { font-size: .9375rem; color: var(--fd-muted); padding: 1.5rem; border: 1px dashed var(--fd-line); border-radius: var(--fd-radius); text-align: center; margin: 0; }
.summary { position: sticky; top: calc(var(--fd-header-h) + 24px + var(--fd-admin-bar)); display: grid; gap: 1rem; background: #fff; border: 1px solid var(--fd-line); border-radius: var(--fd-radius-lg); padding: 2rem 1.5rem; }
@media (max-width: 1024px) { .summary { position: static; } }
.fd-booking .summary h2 { margin: 0; font-family: var(--fd-display); font-weight: 500; color: var(--fd-forest); font-size: 1.7rem; line-height: 1.12; }
.summary dl { margin: 0; display: grid; }
.summary__row { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid var(--fd-line); font-size: .9375rem; }
.summary__row dt { color: var(--fd-muted); }
.summary__row dd { margin: 0; text-align: right; color: var(--fd-charcoal); font-weight: 500; font-variant-numeric: tabular-nums; min-width: 0; overflow-wrap: anywhere; }
.summary__total { display: flex; justify-content: space-between; align-items: baseline; padding-top: .5rem; }
.summary__total .price { font-size: 2.2rem; }
.summary__small { font-size: .8125rem; color: var(--fd-muted); line-height: 1.6; margin: 0; }
.package-flow { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; counter-reset: pf; }
@media (min-width: 760px) { .package-flow { grid-template-columns: repeat(3, 1fr); } }
.package-flow li { counter-increment: pf; display: grid; gap: .5rem; padding: 1.5rem; background: #fff; border: 1px solid var(--fd-line); border-radius: var(--fd-radius-lg); }
.package-flow li::before { content: "Step " counter(pf); font-size: .8125rem; letter-spacing: .14em; text-transform: uppercase; color: var(--fd-muted); }
.fd-booking .package-flow h3 { margin: 0; font-family: var(--fd-display); font-weight: 500; color: var(--fd-forest); font-size: 1.35rem; }
.package-flow p { margin: 0; font-size: .9375rem; color: var(--fd-muted); }
.completion { display: grid; gap: 1rem; justify-items: start; padding: 2rem; border-radius: var(--fd-radius-lg); background: var(--fd-sage-soft); }
.fd-booking .completion h3 { margin: 0; font-family: var(--fd-display); font-weight: 500; color: var(--fd-forest); font-size: 1.9rem; line-height: 1.15; }
.completion p { margin: 0; }
.fade-swap { animation: fd-rise .5s var(--fd-ease) both; }
.fd-stack { display: grid; gap: 1rem; }
.fd-booking .form { display: grid; gap: 1.5rem; }
.fd-booking .form__row { display: grid; gap: 1.5rem; }
@media (min-width: 640px) { .fd-booking .form__row--2 { grid-template-columns: 1fr 1fr; } }
.fd-booking .field { display: grid; gap: .5rem; min-width: 0; }
.fd-booking .field label { font-size: .9375rem; font-weight: 500; color: var(--fd-charcoal); }
.fd-booking .field .hint { font-size: .8125rem; color: var(--fd-muted); }
.fd-booking .field input, .fd-booking .field textarea { width: 100%; font: inherit; font-size: 1rem; color: var(--fd-charcoal); background: #fff; border: 1px solid #c9c2b4; border-radius: var(--fd-radius); padding: .8rem .95rem; min-height: 48px; }
.fd-booking .field textarea { min-height: 120px; resize: vertical; }
.fd-booking .field input:focus, .fd-booking .field textarea:focus { outline: none; border-color: var(--fd-forest); box-shadow: 0 0 0 3px rgba(53,75,61,.18); }
.fd-booking .field[data-invalid="true"] input, .fd-booking .field[data-invalid="true"] textarea { border-color: #a5432f; }
.fd-booking .field__error { font-size: .8125rem; color: #9a3b28; }
.fd-booking .field__error:empty { display: none; }

/* 14. CONTACT & FORMS (Elementor Pro Form) ---------------------------- */
.fd-contact-row { border-bottom: 1px solid var(--fd-line); padding-block: 1rem; }
.fd-contact-row .fd-label { display: block; font-size: .8125rem; letter-spacing: .14em; text-transform: uppercase; color: var(--fd-muted); }
.fd-contact-row .fd-value { display: block; font-family: var(--fd-display); font-size: 1.5rem; color: var(--fd-forest); overflow-wrap: anywhere; line-height: 1.4; }
.fd-contact-row .fd-value .placeholder { font-size: .8125rem; }
.fd-contact-list { border-top: 1px solid var(--fd-line); }
.fd-form .elementor-field-group > label, .fd-form .elementor-field-label { font-size: .9375rem; font-weight: 500; color: var(--fd-charcoal); }
.fd-form .elementor-field-textual { min-height: 48px; border-radius: var(--fd-radius); }
.fd-form .elementor-field-type-acceptance label { font-size: .9375rem; }
.fd-form .elementor-message { font-size: .9375rem; border-radius: var(--fd-radius-lg); padding: 1rem 1.25rem; background: var(--fd-sage-soft); }
.fd-form .elementor-message.elementor-message-danger { background: var(--fd-rose-soft); }

/* 15. FOOTER ---------------------------------------------------------- */
.fd-footer .brand { color: #fff; }
.fd-footer a { color: #e8ede5; }
.fd-footer a:hover { color: #fff; text-decoration: underline; }
.fd-footer .fd-footer-links .elementor-icon-list-text { transition: color .2s var(--fd-ease); }
.fd-footer .placeholder { color: #f3e2dc; border-color: rgba(241,227,221,.5); background: transparent; }
.fd-footer-bottom { border-top: 1px solid rgba(255,255,255,.12); }

/* 16. LEGAL PAGES ----------------------------------------------------- */
.fd-legal ul { display: grid; gap: .5rem; margin-top: .75rem; padding-left: 1.2em; }

/* 17. MOTION ---------------------------------------------------------- */
@keyframes fd-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.fd-hero-content > .e-con-inner > .elementor-element,
.fd-hero-content > .elementor-element { animation: fd-rise 1s var(--fd-ease) both; }
.fd-hero-content > .e-con-inner > .elementor-element:nth-child(2), .fd-hero-content > .elementor-element:nth-child(2) { animation-delay: .12s; }
.fd-hero-content > .e-con-inner > .elementor-element:nth-child(3), .fd-hero-content > .elementor-element:nth-child(3) { animation-delay: .24s; }
.fd-hero-content > .e-con-inner > .elementor-element:nth-child(4), .fd-hero-content > .elementor-element:nth-child(4) { animation-delay: .36s; }
.fd-hero-content > .e-con-inner > .elementor-element:nth-child(5), .fd-hero-content > .elementor-element:nth-child(5) { animation-delay: .48s; }

/* Scroll reveal: only after fd-site.js confirms it can reveal again */
.fd-js-reveal .fd-reveal:not(.is-in) { opacity: 0; transform: translateY(18px); }
.fd-js-reveal .fd-reveal { transition: opacity .9s var(--fd-ease), transform .9s var(--fd-ease); }
.fd-js-reveal .fd-reveal.is-in { opacity: 1; transform: none; }
/* Never hide content inside the Elementor editor */
.elementor-editor-active .fd-reveal { opacity: 1 !important; transform: none !important; }

@media (prefers-reduced-motion: reduce) {
  .fd-site *, .fd-site *::before, .fd-site *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .fd-js-reveal .fd-reveal:not(.is-in) { opacity: 1; transform: none; }
}
