/* Editable settings layer. It changes tokens only and does not alter layout. */
body.vd-skin-editable {
  background: var(--cream);
  color: var(--espresso);
}

body.vd-skin-editable .brand,
body.vd-skin-editable .hero h1,
body.vd-skin-editable .inner-hero h1,
body.vd-skin-editable .trust-band strong,
body.vd-skin-editable .trust-band .trust-note,
body.vd-skin-editable .section-intro h2,
body.vd-skin-editable .category-content h3,
body.vd-skin-editable .quiz-intro h2,
body.vd-skin-editable .quiz-panel h3,
body.vd-skin-editable .faq-item > button,
body.vd-skin-editable .standard-row > span,
body.vd-skin-editable .standard-row h3,
body.vd-skin-editable .journey-track h3,
body.vd-skin-editable .service-empty h2,
body.vd-skin-editable .service-index,
body.vd-skin-editable .service-main h2,
body.vd-skin-editable .service-detail-copy h1,
body.vd-skin-editable .detail-columns h3,
body.vd-skin-editable .care-grid h3,
body.vd-skin-editable .process > h2,
body.vd-skin-editable .process span,
body.vd-skin-editable .process h3,
body.vd-skin-editable .booking-card h2,
body.vd-skin-editable .modal-heading h2,
body.vd-skin-editable .booking-direct h3,
body.vd-skin-editable .booking-selection strong,
body.vd-skin-editable .footer-brand strong {
  font-family: var(--vd-heading-font);
}

body.vd-skin-editable .not-found h1 {
  font-family: var(--vd-heading-font);
}

/* Editable footer social links. Hidden unless an administrator adds a URL. */
body.vd-skin-editable .footer-socials {
  display: flex;
  align-items: center;
  gap: 14px;
  max-width: 600px;
  margin: -46px 0 56px auto;
  color: rgba(255,255,255,.6);
  font-size: 11px;
}

body.vd-skin-editable .footer-socials strong {
  color: white;
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

body.vd-skin-editable .footer-socials div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

body.vd-skin-editable .footer-socials a {
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  padding: 7px 11px;
  color: rgba(255,255,255,.78);
  text-decoration: none;
  transition: border-color .2s ease, color .2s ease;
}

body.vd-skin-editable .footer-socials a:hover,
body.vd-skin-editable .footer-socials a:focus-visible {
  border-color: var(--gold);
  color: white;
}

@media (max-width: 680px) {
  body.vd-skin-editable .footer-socials {
    align-items: flex-start;
    flex-direction: column;
    margin: -46px 0 46px;
  }
}

body.vd-skin-editable .whatsapp {
  background: var(--vd-whatsapp);
}

/* Gutenberg blocks in each Treatment keep the established service-page rhythm. */
body.vd-skin-editable .vd-service-blocks > .vd-service-lead {
  max-width: 780px;
  margin: 30px 0 65px;
  color: var(--brown);
  font-size: var(--text-description);
  line-height: 1.9;
}

body.vd-skin-editable .vd-service-blocks .vd-service-facts {
  display: none;
}

body.vd-skin-editable .vd-service-blocks .vd-detail-columns,
body.vd-skin-editable .vd-service-blocks .detail-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 50px;
  margin: 0;
  padding: 42px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

body.vd-skin-editable .vd-service-blocks .vd-detail-columns h3,
body.vd-skin-editable .vd-service-blocks .detail-columns h3,
body.vd-skin-editable .vd-service-blocks .vd-care-grid h3,
body.vd-skin-editable .vd-service-blocks .care-grid h3 {
  margin: 0 0 18px;
  font-family: var(--vd-heading-font);
  font-size: var(--text-card-title);
  font-weight: 500;
}

body.vd-skin-editable .vd-service-blocks .vd-detail-columns ul,
body.vd-skin-editable .vd-service-blocks .detail-columns ul {
  margin: 0;
  padding-left: 18px;
  color: #746963;
  font-size: var(--text-description);
  line-height: 1.85;
}

body.vd-skin-editable .vd-service-blocks .vd-process-title,
body.vd-skin-editable .vd-service-blocks .process > h2 {
  margin: 85px 0 35px;
  font-family: var(--vd-heading-font);
  font-size: var(--text-section-title);
  font-weight: 500;
}

body.vd-skin-editable .vd-service-blocks .vd-process-list {
  margin: 0 0 85px;
}

body.vd-skin-editable .vd-service-blocks .vd-process-list > p {
  margin: 0;
  padding: 20px 0;
  border-top: 1px solid var(--line);
  color: #746963;
  font-size: var(--text-description);
  line-height: 1.7;
}

body.vd-skin-editable .vd-service-blocks .vd-process-list > p:last-child {
  border-bottom: 1px solid var(--line);
}

body.vd-skin-editable .vd-service-blocks .vd-process-list strong {
  color: var(--espresso);
  font-family: var(--vd-heading-font);
  font-size: var(--text-card-title);
  font-weight: 500;
}

body.vd-skin-editable .vd-service-blocks .vd-care-grid,
body.vd-skin-editable .vd-service-blocks .care-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

body.vd-skin-editable .vd-service-blocks .vd-care-grid > .wp-block-column,
body.vd-skin-editable .vd-service-blocks .care-grid > .wp-block-column {
  margin: 0;
  padding: 28px;
  border-radius: var(--soft-radius);
  background: #f0e7df;
}

body.vd-skin-editable .vd-service-blocks .vd-care-grid p,
body.vd-skin-editable .vd-service-blocks .care-grid p {
  color: var(--brown);
  font-size: var(--text-description);
  line-height: 1.8;
}

body.vd-skin-editable .vd-service-blocks .wp-block-image {
  margin: 52px 0;
}

body.vd-skin-editable .vd-service-blocks .wp-block-image img {
  width: 100%;
  height: auto;
  border-radius: var(--soft-radius);
}

@media (max-width: 650px) {
  body.vd-skin-editable .vd-service-blocks .vd-detail-columns,
  body.vd-skin-editable .vd-service-blocks .detail-columns,
  body.vd-skin-editable .vd-service-blocks .vd-care-grid,
  body.vd-skin-editable .vd-service-blocks .care-grid {
    grid-template-columns: 1fr;
  }
}

/* Native blocks added to the Services page remain visually aligned with the menu. */
body.vd-skin-editable .vd-services-blocks {
  max-width: 1360px;
  margin: 0 auto;
  padding-top: 30px;
  padding-bottom: 60px;
}

body.vd-skin-editable .vd-services-blocks .wp-block-heading {
  max-width: 760px;
  margin: 0 0 20px;
  color: var(--espresso);
  font-family: var(--vd-heading-font);
  font-size: var(--text-section-title);
  font-weight: 500;
  letter-spacing: -.04em;
  line-height: 1.05;
}

body.vd-skin-editable .vd-services-blocks p {
  max-width: 760px;
  color: var(--brown);
  font-size: var(--text-description);
  line-height: 1.9;
}

body.vd-skin-editable .vd-services-blocks .wp-block-image {
  max-width: 980px;
  margin: 45px 0;
}

body.vd-skin-editable .vd-services-blocks .wp-block-image img {
  width: 100%;
  height: auto;
  border-radius: var(--soft-radius);
}

/* Render off-screen sections lazily without changing their composed layout.
   The footer is excluded: it holds the floating WhatsApp button and the booking popup,
   and content-visibility would pin them to the footer instead of the screen. */
@supports (content-visibility: auto) {
  body.vd-skin-editable .story,
  body.vd-skin-editable .categories,
  body.vd-skin-editable .faq,
  body.vd-skin-editable .contact {
    content-visibility: auto;
    contain-intrinsic-size: auto 760px;
  }
}

/* Dedicated link-in-bio page. This layer preserves the original site CSS. */
body.vd-skin-editable .links-page {
  min-height: 100dvh;
  display: grid;
  align-content: center;
  padding: clamp(30px, 6vw, 90px) 24px 34px;
  background:
    radial-gradient(circle at 93% 8%, rgba(227,208,198,.72), transparent 25rem),
    linear-gradient(135deg, #fbf8f3 0%, #fffdf9 58%, #f3e8de 100%);
}

body.vd-skin-editable .links-shell {
  width: min(100%, 1360px);
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(390px, 1.08fr);
  gap: clamp(38px, 6vw, 100px);
  align-items: center;
  margin: auto;
}

body.vd-skin-editable .links-intro { max-width: 600px; padding-left: clamp(0px, 2vw, 28px); }

body.vd-skin-editable .links-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 34px;
  color: var(--espresso);
  font-family: var(--vd-heading-font);
  font-size: 18px;
}

body.vd-skin-editable .links-brand img {
  width: 56px;
  height: 56px;
  object-fit: cover;
  border: 1px solid rgba(177,135,63,.36);
  border-radius: 50%;
}

body.vd-skin-editable .links-eyebrow {
  margin: 0 0 16px;
  color: var(--gold-dark);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
}

body.vd-skin-editable .links-page h1 {
  max-width: 600px;
  margin: 0;
  color: var(--espresso);
  font-family: var(--vd-heading-font);
  font-size: clamp(44px, 6vw, 76px);
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: .98;
}
body.vd-skin-editable .links-page h1 span,
body.vd-skin-editable .links-page h1 em { display: block; }
body.vd-skin-editable .links-page h1 em { color: var(--gold-dark); font-style: italic; font-weight: 500; }

body.vd-skin-editable .links-description {
  max-width: 430px;
  margin: 22px 0 35px;
  color: var(--brown);
  font-size: 16px;
  line-height: 1.75;
}

body.vd-skin-editable .links-actions {
  display: grid;
  gap: 11px;
  border: 0;
}

body.vd-skin-editable .links-actions a {
  position: relative;
  min-height: 62px;
  display: grid;
  grid-template-columns: 34px 1fr 24px;
  align-items: center;
  gap: 12px;
  border: 1px solid var(--gold-dark);
  border-radius: 999px;
  padding: 0 20px;
  background: var(--gold-dark);
  color: white;
  box-shadow: 0 10px 22px rgba(39,30,27,.12);
  transition: transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

body.vd-skin-editable .links-actions a:hover,
body.vd-skin-editable .links-actions a:focus-visible { transform: translateY(-3px); border-color: var(--espresso); background: var(--espresso); box-shadow: 0 15px 28px rgba(39,30,27,.2); }
body.vd-skin-editable .links-actions a:active { transform: scale(.99); }
body.vd-skin-editable .links-actions span { color: rgba(255,255,255,.72); font-size: 10px; letter-spacing: .1em; }
body.vd-skin-editable .links-actions strong { font-size: 15px; font-weight: 500; }
body.vd-skin-editable .links-actions svg { width: 18px; height: 18px; color: var(--blush); transition: transform .22s ease; }
body.vd-skin-editable .links-actions a:hover svg { transform: translate(3px,-3px); }
body.vd-skin-editable .links-visual { min-height: 530px; margin: 0; overflow: hidden; border-radius: var(--soft-radius); background: var(--blush); box-shadow: 0 20px 52px rgba(74,62,57,.12); }
body.vd-skin-editable .links-visual img { display: block; width: 100%; height: 100%; min-height: 530px; object-fit: cover; }
body.vd-skin-editable .links-signoff { width: min(100%, 940px); margin: 42px auto 0; color: #746963; font-size: 10px; letter-spacing: .15em; text-align: center; text-transform: uppercase; }

@media (max-width: 700px) {
  body.vd-skin-editable .links-page { align-content: start; padding-top: 34px; }
  body.vd-skin-editable .links-shell { grid-template-columns: 1fr; gap: 36px; }
  body.vd-skin-editable .links-brand { margin-bottom: 42px; }
  body.vd-skin-editable .links-visual,
  body.vd-skin-editable .links-visual img { min-height: 320px; }
}

/* The editable Services menu filters rows by the native hidden attribute.
 * The original .service-row display:grid rule has higher specificity than
 * the browser default, so this preserves the approved layout while making
 * a selected category actually hide the other rows. */
body.vd-skin-editable [data-vd-treatment-menu] .service-row[hidden] {
  display: none !important;
}