/* navbar-02 — Navbar 2 */

/* navbar-02 — logo left, centred links, button right. */
.r2c-logo-text { font-family: var(--pm-font-display); font-size: 1.05rem; line-height: 1.15; color: var(--pm-navy); letter-spacing: .01em; }
.r2c-logo { text-decoration: none; display: inline-block; }
.footer-01 .r2c-logo img { height: 3.5rem; width: auto; display: block; margin-bottom: var(--pm-space-5); }

/* "Website by Pure Marketing" credit — standard on every Pure Marketing
   build (see pm-website-builder-plugins skill). Sits as the third item in
   the footer's bottom bar alongside copyright and the legal links, which is
   already a space-between flex row (see .pm-footer-bottom). Filter, not a
   fill edit, because the logo's wordmark is drawn with SVG masks and a
   find-and-replace on its fills silently breaks it. */
.r2c-pm-credit {
  display: inline-flex;
  align-items: center;
  gap: var(--pm-space-2);
  color: var(--pm-fg-muted);
  text-decoration: none !important;
  border: 0 !important;
}
.r2c-pm-credit:hover { color: var(--pm-fg); }
.r2c-pm-credit__logo {
  height: 1.1rem;
  width: auto;
  display: block;
  filter: brightness(0) invert(1);
}
.navbar-02__bar-actions { display: flex; align-items: center; gap: var(--pm-space-4); }
.navbar-02__menu { text-align: center; }

/* Sticky header: stays pinned while the page scrolls. */
.navbar-02 {
  position: sticky;
  top: 0;
}

@media (min-width: 992px) {
  .navbar-02 .pm-nav__inner {
    display: grid;
    /* Reference is the live site's header: logo pinned to the left edge
       of the site's own content column, the menu clustered immediately
       next to it (not centred, not spread out), then one big flexible
       gap, then the actions pinned to the right edge of that same
       column. Three columns do the left-cluster/right-pin layout on
       their own: the logo and menu columns are auto-sized to their own
       content so the menu sits right up against the logo, and the third
       column is the only one that stretches — it soaks up all the
       leftover width and the actions cell justifies to its far end.
       That column layout then needs to sit inside the site's normal
       1280px content width (same var(--pm-container) every .pm-container
       on the page uses), not stretch to the .pm-nav bar's full padded
       width — otherwise the header reads wider than every section below
       it instead of sharing the same left/right edges. */
    max-width: var(--pm-container);
    margin-inline: auto;
    width: 100%;
    grid-template-columns: auto auto 1fr;
    align-items: center;
    gap: var(--pm-space-6);
  }
  .navbar-02__menu { justify-content: flex-start; text-align: left; }
  .navbar-02__actions { justify-self: end; }
  /* Tighten the link spacing so the menu itself reads as one cluster
     rather than spread across the whole middle column. */
  .navbar-02 .pm-nav__link,
  .navbar-02 .pm-nav__link:first-child {
    padding-inline: var(--pm-space-3);
  }
}

/* Classic nav restyle — matches the site's original live header exactly:
   the wide colour-icon logo (with the "Regulate to Communicate" wordmark
   baked into the SVG in white, so it only reads on this dark bar), flat
   Lilita One uppercase links with no dropdown, and account/basket icons
   in place of a CTA button. Lilita One is already enqueued site-wide in
   functions.php (r2c_assets) for headings, so no extra font load here. */
.navbar-02 .pm-nav__logo img { height: 2.75rem; width: auto; }
@media (min-width: 992px) {
  .navbar-02 .pm-nav__logo img { height: 3.75rem; }
}

.navbar-02 .pm-nav__link {
  font-family: 'Lilita One', var(--pm-font-display), sans-serif;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: 0.95rem;
}

.navbar-02__bar-actions,
.navbar-02__actions {
  display: flex;
  align-items: center;
  gap: var(--pm-space-4);
}
@media (min-width: 992px) {
  .navbar-02__actions {
    padding-left: var(--pm-space-5);
    border-left: 1px solid color-mix(in srgb, #fff 25%, transparent);
  }
}

/* Account + basket icons — see r2c_classic_nav_actions() in functions.php. */
.r2c-nav-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-decoration: none !important;
  border: 0 !important;
}
.r2c-nav-icon--account svg,
.r2c-nav-icon--basket svg {
  width: 1.75rem;
  height: 1.75rem;
  /* Some mobile browsers (notably iOS Safari) clip an <svg> to its own
     box using the UA default "overflow: hidden", even when every path
     inside the viewBox already fits — the basket icon's handle straps
     were getting sliced flat across the top on phones. Forcing
     overflow:visible removes that clipping outright; pairing it with
     explicit width/height attributes on the <svg> (see
     r2c_classic_nav_actions() in functions.php) stops the same browsers
     from falling back to a quirky intrinsic size before CSS applies. */
  overflow: visible;
  flex-shrink: 0;
  display: block;
}
.r2c-nav-icon--basket {
  position: relative;
}
.r2c-nav-icon__count {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0.3rem;
  text-align: center;
  font-size: 0.65rem;
  font-weight: var(--pm-weight-bold, 700);
  line-height: 1;
  pointer-events: none;
}

/* Basket hover flyout — a mini-cart preview matching the original live
   site's cart icon behaviour. Pure CSS hover (no JS): the panel and its
   trigger share one hoverable wrapper, and WooCommerce's own
   wc-cart-fragments script keeps .widget_shopping_cart_content live —
   add/remove a product anywhere on the site and this refreshes itself. */
.r2c-basket-flyout {
  position: relative;
  display: inline-flex;
}
.r2c-basket-flyout__panel {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  z-index: var(--pm-z-dropdown, 40);
  width: 20rem;
  max-width: 88vw;
  margin-top: var(--pm-space-3);
  padding: var(--pm-space-6);
  background-color: var(--pm-color-page, #fff);
  color: var(--pm-color-text, #1a203d);
  border-radius: var(--pm-radius-dropdown);
  box-shadow: var(--pm-shadow-lg);
  text-align: center;
}
.r2c-basket-flyout__panel::before {
  content: "";
  position: absolute;
  top: calc(var(--pm-space-3) * -1);
  right: 0;
  left: 0;
  height: var(--pm-space-3);
}
@media (min-width: 992px) {
  .r2c-basket-flyout:hover .r2c-basket-flyout__panel,
  .r2c-basket-flyout:focus-within .r2c-basket-flyout__panel {
    display: block;
  }
}
.r2c-mini-cart__empty-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto var(--pm-space-4);
  color: color-mix(in srgb, var(--pm-color-text, #1a203d) 25%, transparent);
}
.r2c-mini-cart__empty-icon svg { width: 3rem; height: 3rem; }
.woocommerce-mini-cart__empty-message {
  margin: 0;
  font-size: var(--pm-text-sm);
  color: var(--pm-color-text-muted, #6b7280);
}
.r2c-mini-cart__return {
  margin-top: var(--pm-space-5);
}
.r2c-basket-flyout__panel .woocommerce-mini-cart {
  list-style: none;
  margin: 0 0 var(--pm-space-4);
  padding: 0;
  text-align: left;
  max-height: 18rem;
  overflow-y: auto;
}
.r2c-basket-flyout__panel .woocommerce-mini-cart-item {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--pm-space-3);
  padding: var(--pm-space-3) 0;
  border-bottom: 1px solid var(--pm-color-border-subtle, #eee);
}
.r2c-basket-flyout__panel .woocommerce-mini-cart-item:first-child { padding-top: 0; }
.r2c-basket-flyout__panel .woocommerce-mini-cart-item img {
  width: 3.25rem;
  height: 3.25rem;
  object-fit: cover;
  border-radius: var(--pm-radius-form);
  flex: none;
}
.r2c-basket-flyout__panel .woocommerce-mini-cart-item a {
  font-size: var(--pm-text-sm);
  font-weight: var(--pm-weight-medium);
  color: inherit;
  text-decoration: none;
}
.r2c-basket-flyout__panel .woocommerce-mini-cart-item .quantity {
  display: block;
  font-size: var(--pm-text-xs);
  color: var(--pm-color-text-muted, #6b7280);
}
.r2c-basket-flyout__panel .woocommerce-mini-cart-item .remove_from_cart_button {
  position: absolute;
  top: var(--pm-space-3);
  right: 0;
  color: var(--pm-color-text-muted, #6b7280);
  text-decoration: none;
  font-size: 1.1rem;
  line-height: 1;
}
.r2c-basket-flyout__panel .woocommerce-mini-cart__total {
  display: flex;
  justify-content: space-between;
  font-weight: var(--pm-weight-semibold);
  margin: 0 0 var(--pm-space-4);
}
.r2c-basket-flyout__panel .woocommerce-mini-cart__buttons {
  display: flex;
  flex-direction: column;
  gap: var(--pm-space-3);
  margin: 0;
}
.r2c-basket-flyout__panel .woocommerce-mini-cart__buttons .button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 2.75rem;
  padding: var(--pm-space-2) var(--pm-space-6);
  border-radius: var(--pm-radius-button);
  background-color: var(--pm-navy, #072957);
  color: #fff;
  font-size: var(--pm-text-base);
  font-weight: var(--pm-weight-medium);
  text-decoration: none;
  text-align: center;
}
.r2c-basket-flyout__panel .woocommerce-mini-cart__buttons .button:hover { opacity: 0.88; }
.r2c-basket-flyout__panel .woocommerce-mini-cart__buttons .button.checkout {
  background-color: var(--pm-pink, #fc2468);
}

/* Generic legacy/plain-page content — Privacy Policy, Terms & Conditions,
   Refund and Returns and any other Default-template page render raw
   the_content() block-editor output (plain <p>/<ul>/<ol>), not
   pm-design-system components. The system's own reset (base.css's
   * { margin: 0 } and its ul/ol { list-style: none } for nav/card use)
   leaves consecutive paragraphs and list items with zero gap and no
   visible bullets, which reads as one dense, cramped block on longer
   legal pages. Restore normal prose rhythm here without touching the
   shared reset. */
.r2c-legacy-content {
  line-height: var(--pm-leading-loose);
}
.r2c-legacy-content > * + * {
  margin-top: var(--pm-space-5);
}
.r2c-legacy-content > :is(h2, h3, h4) + * {
  margin-top: var(--pm-space-4);
}
.r2c-legacy-content > * + :is(h2, h3, h4) {
  margin-top: var(--pm-space-10);
}
@media (min-width: 768px) {
  .r2c-legacy-content > * + :is(h2, h3, h4) {
    margin-top: var(--pm-space-12);
  }
}
.r2c-legacy-content ul,
.r2c-legacy-content ol {
  padding-left: var(--pm-space-6);
}
.r2c-legacy-content ul { list-style: disc; }
.r2c-legacy-content ol { list-style: decimal; }
.r2c-legacy-content li {
  line-height: var(--pm-leading-loose);
}
.r2c-legacy-content li + li {
  margin-top: var(--pm-space-2);
}

/* header-62 — Header 62 */

/* header-62 — centred heading with two buttons. */
.header-62 { position: relative; overflow: hidden; }
.header-62 h1 { margin-bottom: var(--pm-space-5); }

/* r2c-photo-hero — shared helper for any hero section given a real photo
   background (via inline style) instead of a flat colour. Used on the
   Home, Approach and What We Offer hero sections. */
.r2c-photo-hero { position: relative; overflow: hidden; background-size: cover; background-position: center; background-repeat: no-repeat; }

/* r2c-wave-divider — the old site's signature move: a wavy SVG seam at the
   bottom of one solid-colour section, filled with the colour of whatever
   section comes next, so alternating navy/pink/paper bands read as one
   continuous shape rather than a hard line. Rendered via r2c_wave_divider()
   in functions.php — one call, last thing inside a .pm-section, filled with
   the next section's actual background colour. Parent section just needs
   position:relative, which .pm-section already provides. */
.r2c-wave-divider {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  width: 100%;
  line-height: 0;
  z-index: 3;
  pointer-events: none;
}
.r2c-wave-divider svg {
  display: block;
  width: 100%;
  height: 48px;
}
@media (min-width: 768px) {
  .r2c-wave-divider svg { height: 72px; }
}
@media (min-width: 992px) {
  .r2c-wave-divider svg { height: 96px; }
}

/* Breathing room around a wave, in both directions: the section the wave
   dips OUT of (bottom padding, so its own content doesn't crowd the curve)
   and the section it dips INTO (top padding, since the wave visually
   overlaps the first chunk of whatever comes next). Matches the padding
   values .pm-section already sets at each breakpoint (see base.css) plus a
   fixed clearance on top. */
.pm-section:has(> .r2c-wave-divider) {
  padding-bottom: calc(var(--pm-section-py) + 1.5rem);
}
.pm-section + .pm-section {
  padding-top: calc(var(--pm-section-py) + 1.5rem);
}
@media (min-width: 768px) {
  .pm-section:has(> .r2c-wave-divider) { padding-bottom: calc(var(--pm-space-16) + 2rem); }
  .pm-section + .pm-section { padding-top: calc(var(--pm-space-16) + 2rem); }
}
@media (min-width: 992px) {
  .pm-section:has(> .r2c-wave-divider) { padding-bottom: calc(var(--pm-section-py-lg) + 2.5rem); }
  .pm-section + .pm-section { padding-top: calc(var(--pm-section-py-lg) + 2.5rem); }
}
@media (min-width: 768px) {
  .header-62 h1 { margin-bottom: var(--pm-space-6); }
}
.r2c-deco {
  position: absolute;
  pointer-events: none;
  opacity: .55;
  z-index: 0;
}
.r2c-deco--sparkles { top: var(--pm-space-8); left: var(--pm-space-6); width: 56px; height: auto; }
.r2c-deco--curl { bottom: var(--pm-space-6); right: var(--pm-space-6); width: 72px; height: auto; }
@media (min-width: 768px) {
  .r2c-deco--sparkles { top: var(--pm-space-10); left: var(--pm-space-12); width: 76px; }
  .r2c-deco--curl { bottom: var(--pm-space-10); right: var(--pm-space-12); width: 100px; }
}
.header-62 .pm-container { position: relative; z-index: 1; }

/* ==========================================================================
   Decorative brand shapes — recoloured with CSS mask-image, not the raw
   SVG's own fill. The Sparkles/Star Flower/Lines/Two Curl files each carry
   their own baked-in opacity mask (roughly 13-30% for the first three, solid
   for Two Curl) — masking them in CSS reads that same alpha, so the shape is
   always softly blended into whatever colour sits behind it. That blend is
   by design, not a colour bug; background-color (via currentColor) is what
   actually changes per instance, letting one asset serve navy, pink, sun and
   sky sections without separate colour-variant files.
   ========================================================================== */
.r2c-shape {
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.r2c-shape--sparkles {
  -webkit-mask-image: url("../assets/brand/Sparkles.svg");
  mask-image: url("../assets/brand/Sparkles.svg");
  aspect-ratio: 222.75 / 268.5;
}
.r2c-shape--star-flower {
  -webkit-mask-image: url("../assets/brand/Star Flower.svg");
  mask-image: url("../assets/brand/Star Flower.svg");
  aspect-ratio: 451.5 / 513.75;
}
.r2c-shape--curl {
  -webkit-mask-image: url("../assets/brand/Two Curl.svg");
  mask-image: url("../assets/brand/Two Curl.svg");
  aspect-ratio: 359.25 / 135;
}
.r2c-shape--lines {
  -webkit-mask-image: url("../assets/brand/Lines.svg");
  mask-image: url("../assets/brand/Lines.svg");
  aspect-ratio: 401.25 / 423.75;
}
.r2c-shape--navy { color: var(--pm-navy); }
.r2c-shape--pink { color: var(--pm-pink); }
.r2c-shape--sun { color: var(--pm-sun); }
.r2c-shape--sky { color: var(--pm-sky); }
.r2c-shape--white { color: #ffffff; }

/* header-62 hero decorations (Join Our Community) — previously had no
   position/size rules at all, so the three images rendered at native SVG
   size, unclipped. */
.header-62__decor {
  position: absolute;
  pointer-events: none;
  opacity: .55;
  z-index: 0;
}
.header-62__decor--sparkles { top: var(--pm-space-8); left: var(--pm-space-6); width: 56px; height: auto; }
.header-62__decor--curl { bottom: var(--pm-space-6); right: var(--pm-space-8); width: 72px; height: auto; }
.header-62__decor--star { top: var(--pm-space-8); right: var(--pm-space-6); width: 44px; height: auto; }
@media (min-width: 768px) {
  .header-62__decor--sparkles { top: var(--pm-space-10); left: var(--pm-space-14); width: 76px; }
  .header-62__decor--curl { bottom: var(--pm-space-10); right: var(--pm-space-14); width: 100px; }
  .header-62__decor--star { top: var(--pm-space-10); right: var(--pm-space-14); width: 60px; }
}

/* cta-20 decoration (Join Our Community signup) — same missing-CSS bug. */
.cta-20 { position: relative; overflow: hidden; }
.cta-20__decor {
  position: absolute;
  pointer-events: none;
  opacity: .55;
  z-index: 0;
  bottom: var(--pm-space-6);
  left: var(--pm-space-6);
  width: 68px;
  height: auto;
}
@media (min-width: 768px) {
  .cta-20__decor { bottom: var(--pm-space-10); left: var(--pm-space-12); width: 96px; }
}
.cta-20 .pm-container { position: relative; z-index: 1; }

/* r2c-shape-section — generic helper for adding a couple of brand shapes to
   a section that otherwise carries none, without a bespoke class per page.
   --a sits top-left, --b sits bottom-right, mirroring the r2c-deco pattern
   used on hero sections. */
.r2c-shape-section { position: relative; overflow: hidden; }
.r2c-shape-section > .pm-container,
.r2c-shape-section > .pm-container--narrow { position: relative; z-index: 1; }
.r2c-shape-section__deco {
  position: absolute;
  pointer-events: none;
  opacity: .55;
  z-index: 0;
}
.r2c-shape-section__deco--a { top: var(--pm-space-6); left: var(--pm-space-4); width: 48px; height: auto; }
.r2c-shape-section__deco--b { bottom: var(--pm-space-6); right: var(--pm-space-4); width: 64px; height: auto; }
@media (min-width: 768px) {
  .r2c-shape-section__deco--a { top: var(--pm-space-10); left: var(--pm-space-10); width: 68px; }
  .r2c-shape-section__deco--b { bottom: var(--pm-space-10); right: var(--pm-space-10); width: 92px; }
}

/* layout-238 tiles — equal-height cards, button pinned to the foot */
.layout-238__item.pm-card { height: 100%; }
.layout-238__item .pm-btn-group { margin-top: auto; padding-top: var(--pm-space-5); }
.pm-grid--3 { align-items: stretch; }

/* layout-238 — Layout 238 */

/* layout-238 — centred header above a three-column feature grid. */
.layout-238__item {
  display: flex;
  flex-direction: column;
  text-align: center;
  align-items: center;
}
.layout-238__media { margin-bottom: var(--pm-space-6); }
.layout-238__icon { margin-bottom: var(--pm-space-5); }
.layout-238__title { margin-bottom: var(--pm-space-5); }
.layout-238__buttons { margin-top: var(--pm-space-10); }

@media (min-width: 768px) {
  .layout-238__media { margin-bottom: var(--pm-space-8); }
  .layout-238__icon { margin-bottom: var(--pm-space-6); }
  .layout-238__title { margin-bottom: var(--pm-space-6); }
  .layout-238__buttons { margin-top: var(--pm-space-16); }
}

@media (min-width: 992px) {
  .layout-238__buttons { margin-top: var(--pm-space-20); }
}

/* layout-298 — Layout 298 */

/* layout-298 — centred four-column feature grid. */
.layout-298__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--pm-space-12);
}

.layout-298__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.layout-298__card-title { margin: var(--pm-space-5) 0 var(--pm-space-3); }
@media (min-width: 768px) { .layout-298__card-title { margin-top: var(--pm-space-6); margin-bottom: var(--pm-space-4); } }

@media (min-width: 768px) {
  .layout-298__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--pm-space-8);
    row-gap: var(--pm-space-16);
  }
}

@media (min-width: 1280px) {
  .layout-298__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* testimonial-06 — Testimonial 6 */

/* testimonial-06 — left-aligned heading over a three-column grid, stacked foot per card. */
.testimonial-06__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--pm-space-12);
}
.testimonial-06__stars { display: flex; gap: var(--pm-space-1); margin-bottom: var(--pm-space-6); }
.testimonial-06__foot { margin-top: var(--pm-space-6); }
.testimonial-06__avatar { margin-bottom: var(--pm-space-4); }
.testimonial-06__name { margin-bottom: var(--pm-space-3); }
.testimonial-06__divider { display: none; }
.testimonial-06__logo { display: inline-block; }

@media (min-width: 768px) {
  .testimonial-06__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--pm-space-8); }
  .testimonial-06__stars { margin-bottom: var(--pm-space-8); }
  .testimonial-06__foot { margin-top: var(--pm-space-8); }
  .testimonial-06__name { margin-bottom: var(--pm-space-4); }
  .testimonial-06__divider { display: block; border: none; border-top: 1px solid var(--pm-border-color); margin: 0 0 var(--pm-space-4); }
}
@media (min-width: 992px) {
  .testimonial-06__grid { column-gap: var(--pm-space-12); row-gap: var(--pm-space-16); }
}

/* cta-20 — CTA 20 */

/* cta-20 — centred column, text and email form. */
.cta-20__content { max-width: 32rem; margin-inline: auto; text-align: center; }
.cta-20__form-wrap { max-width: 24rem; margin-inline: auto; }
.cta-20__form-wrap .pm-inline-form { justify-content: center; }
.cta-20__form-wrap .pm-inline-form .pm-field { flex: 1; }

/* faq-04 — FAQ 4 */

/* faq-04 — boxed accordion cards, plus icon rotates to a cross when open.
   Each item is already its own bordered/rounded pm-card, so the accordion
   list must not also draw the default .pm-accordion top rule — that left a
   stray straight line floating above the first rounded card. */
.faq-04__list {
  display: grid;
  gap: var(--pm-space-4);
  border-top: 0;
}
.faq-04__trigger,
.faq-04__content { padding-left: var(--pm-space-5); padding-right: var(--pm-space-5); }
.faq-04__icon {
  transition: transform var(--pm-duration) var(--pm-ease);
}
.faq-04__trigger[aria-expanded="true"] .faq-04__icon { transform: rotate(45deg); }
.faq-04__footer { margin-top: var(--pm-space-12); text-align: center; }
@media (min-width: 768px) {
  .faq-04__trigger,
  .faq-04__content { padding-left: var(--pm-space-6); padding-right: var(--pm-space-6); }
  .faq-04__footer { margin-top: var(--pm-space-16); }
}
@media (min-width: 992px) { .faq-04__footer { margin-top: var(--pm-space-20); } }

/* footer-01 — Footer 1 */

/* footer-01 — logo + newsletter form beside three link columns, legal bottom bar. */
.footer-01 ul { list-style: none; margin: 0; padding: 0; }
.footer-01__top {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--pm-space-12);
  padding-bottom: var(--pm-space-12);
}
.footer-01__intro { max-width: 26rem; }
.footer-01__intro p { margin-bottom: var(--pm-space-5); }
.footer-01__note { font-size: var(--pm-text-xs); color: var(--pm-fg-muted); margin-top: var(--pm-space-3); }
.footer-01__cols {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--pm-space-10);
}
.footer-01__col-title { font-size: var(--pm-text-sm); font-weight: var(--pm-weight-semibold); margin-bottom: var(--pm-space-3); }
.footer-01__col ul { display: grid; gap: var(--pm-space-1); font-size: var(--pm-text-sm); }
.footer-01__col a { display: flex; align-items: center; gap: var(--pm-space-3); padding: var(--pm-space-2) 0; }
@media (min-width: 480px) {
  .footer-01__cols { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 768px) {
  .footer-01__top { padding-bottom: var(--pm-space-18); }
}
@media (min-width: 992px) {
  .footer-01__top { grid-template-columns: 0.75fr 1fr; padding-bottom: var(--pm-space-20); }
}

/* header-64 — Header 64 */

/* header-64 — centred heading and description only. */
.header-64 { position: relative; overflow: hidden; }
.header-64 .pm-container { position: relative; z-index: 1; }
.header-64.r2c-photo-hero .r2c-deco { z-index: 1; }
.header-64__deco {
  position: absolute;
  pointer-events: none;
  opacity: .55;
  z-index: 0;
  top: var(--pm-space-6);
  right: var(--pm-space-6);
  width: 64px;
  height: auto;
}
@media (min-width: 768px) {
  .header-64__deco { top: var(--pm-space-10); right: var(--pm-space-12); width: 96px; }
}
.r2c-deco {
  position: absolute;
  pointer-events: none;
  opacity: .55;
  z-index: 0;
}
.r2c-deco--star { top: var(--pm-space-3); left: var(--pm-space-3); width: 34px; height: auto; }
.r2c-deco--curl { bottom: var(--pm-space-3); right: var(--pm-space-3); width: 46px; height: auto; }
@media (min-width: 480px) {
  .r2c-deco--star { top: var(--pm-space-6); left: var(--pm-space-6); width: 48px; }
  .r2c-deco--curl { bottom: var(--pm-space-6); right: var(--pm-space-6); width: 64px; }
}
@media (min-width: 768px) {
  .r2c-deco--star { top: var(--pm-space-10); left: var(--pm-space-14); width: 68px; }
  .r2c-deco--curl { bottom: var(--pm-space-10); right: var(--pm-space-14); width: 92px; }
}

/* layout-396 — Layout 396 */

/* layout-396 — three foundation cards, each with a heading and two sub-items. */
.layout-396 .pm-grid--3 { align-items: stretch; }
.layout-396__card { height: 100%; }
.layout-396__subitem { margin-top: var(--pm-space-5); }
.layout-396__subitem h4 { margin-bottom: var(--pm-space-1); }
.layout-396__card .pm-btn-group { margin-top: auto; padding-top: var(--pm-space-6); }
@media (min-width: 768px) {
  .layout-396__subitem { margin-top: var(--pm-space-6); }
}

/* cta-27 — CTA 27 */

/* cta-27 — single centred column over a background image. */
.cta-27__content { max-width: 32rem; }

/* testimonial-09 — Testimonial 9 */

/* testimonial-09 — heading above a three-up testimonial carousel. */
.testimonial-09__person {
  margin-top: var(--pm-space-6);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--pm-space-3);
}

@media (min-width: 768px) {
  .testimonial-09__logo { margin-bottom: var(--pm-space-8); }
  .testimonial-09__person { margin-top: var(--pm-space-8); }
}

/* cta-08 — CTA 8 */

/* cta-08 — text row left, sign-up form right. */
.cta-08__row {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--pm-space-6);
}
.cta-08__copy {
  max-width: 32rem;
}
.cta-08__heading {
  font-size: var(--pm-text-h3);
}
@media (min-width: 768px) {
  .cta-08__row { grid-template-columns: 1fr; gap: var(--pm-space-8); }
}
@media (min-width: 992px) {
  .cta-08__row { grid-template-columns: 1fr max-content; align-items: center; gap: var(--pm-space-20); }
}

/* header-49 — Header 49 */

/* header-49 — two-column header, heading left, description right. */
.header-49 { position: relative; overflow: hidden; }
.header-49__grid {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: var(--pm-space-5);
  align-items: start;
  position: relative;
  z-index: 1;
}
.header-49__desc .pm-btn { margin-top: var(--pm-space-6); }

@media (min-width: 768px) {
  .header-49__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--pm-space-12);
  }
}

@media (min-width: 992px) {
  .header-49__grid {
    column-gap: var(--pm-space-20);
    row-gap: var(--pm-space-16);
  }
}

/* Decorative brand squiggles — shared pattern across pages, sparing use only. */
.r2c-deco {
  position: absolute;
  pointer-events: none;
  opacity: .55;
  z-index: 0;
}
.r2c-deco--curl-header { top: var(--pm-space-6); right: var(--pm-space-6); width: 64px; height: auto; }
.r2c-deco--flower-cta { bottom: var(--pm-space-6); left: var(--pm-space-6); width: 60px; height: auto; }
@media (min-width: 768px) {
  .r2c-deco--curl-header { top: var(--pm-space-10); right: var(--pm-space-10); width: 92px; }
  .r2c-deco--flower-cta { bottom: var(--pm-space-8); left: var(--pm-space-10); width: 84px; }
}

/* layout-396 — 3-card grid, extended with two sub-items per card (own small
   heading + copy) and a Book Now button, reusing the approach page's grid. */
.layout-396__card { position: relative; }
.layout-396__card-heading { margin-top: var(--pm-space-5); }
.layout-396__sub { margin-top: var(--pm-space-5); }
.layout-396__sub-title { margin-bottom: var(--pm-space-1); }
.layout-396__card .pm-btn-group { margin-top: var(--pm-space-6); }

/* pricing-13 — Pricing 13 */

/* pricing-13 — icon/name/description left, price right, two-column ticks. */
.pricing-13__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--pm-space-6);
}
.pricing-13__plan-name { margin-top: var(--pm-space-4); margin-bottom: var(--pm-space-2); }
.pricing-13__price {
  font-size: var(--pm-text-h1);
  font-weight: var(--pm-weight-bold);
  line-height: var(--pm-leading-tight);
  text-align: right;
  white-space: nowrap;
}
.pricing-13__price span {
  font-size: var(--pm-text-h4);
  font-weight: var(--pm-weight-bold);
}
/* No fixed price for these two — a short badge replaces the price slot. */
.pricing-13__badge { white-space: nowrap; }
.pricing-13__icon--pink { background: var(--pm-pink-soft); color: var(--pm-pink); }
.pricing-13__icon--sun { background: var(--pm-sun-soft); color: var(--pm-navy); }
.pricing-13__plan { height: 100%; }
.pricing-13__plan > .pm-btn { margin-top: auto; }
.pricing-13__ticks {
  grid-template-columns: 1fr;
  margin: var(--pm-space-4) 0 var(--pm-space-8);
}

@media (min-width: 768px) {
  .pricing-13__ticks {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--pm-space-6);
  }
}

/* cta-08 — text row left, sign-up form right. */
.cta-08 { overflow: hidden; }
.cta-08__row {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--pm-space-6);
  position: relative;
  z-index: 1;
}
.cta-08__copy {
  max-width: 32rem;
}
.cta-08__heading {
  font-size: var(--pm-text-h3);
}
.cta-08__form-wrap {
  max-width: 26rem;
}
@media (min-width: 768px) {
  .cta-08__row { grid-template-columns: 1fr; gap: var(--pm-space-8); }
}
@media (min-width: 992px) {
  .cta-08__row { grid-template-columns: 1fr max-content; align-items: start; gap: var(--pm-space-20); }
}

/* team-15 — Team 15 */

/* team-15 — team list of member rows, avatar/photo beside copy. */
.team-15__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--pm-space-8);
  align-items: stretch;
}
.team-15__footer {
  margin-top: var(--pm-space-14);
  margin-inline: auto;
  max-width: 34rem;
  background: var(--pm-sun-soft);
  border-radius: var(--pm-radius-card);
  padding: var(--pm-space-8);
}
.team-15__member {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--pm-space-5);
  height: 100%;
  background: var(--pm-color-surface);
  border-radius: var(--pm-radius-card);
  padding: var(--pm-space-8);
  box-shadow: var(--pm-shadow-md);
}
.team-15__avatar {
  border-radius: var(--pm-radius-avatar);
  box-shadow: 0 0 0 4px var(--pm-sky-soft);
}
.team-15__member:nth-child(2) .team-15__avatar {
  box-shadow: 0 0 0 4px var(--pm-pink-soft);
}
.team-15__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media (min-width: 480px) {
  .team-15__member {
    grid-template-columns: 8rem 1fr;
    align-items: start;
    gap: var(--pm-space-6) var(--pm-space-8);
  }
}
@media (min-width: 768px) {
  .team-15__member { padding: var(--pm-space-10); }
}
@media (min-width: 992px) {
  .team-15__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--pm-space-8);
  }
}

/* ==========================================================================
   Contact page — layout-13 (info column + CF7 form column)
   ========================================================================== */

.layout-13__grid {
  display: grid;
  gap: var(--pm-space-10);
}
@media (min-width: 992px) {
  .layout-13__grid {
    grid-template-columns: 5fr 7fr;
    gap: var(--pm-space-12);
  }
}
.layout-13__info-item {
  display: flex;
  align-items: center;
  gap: var(--pm-space-3);
}
.layout-13__info-item svg { flex: none; width: 1.5rem; height: 1.5rem; }
.layout-13__info-item a { text-decoration: none; }
.layout-13__info-item a:hover { text-decoration: underline; }

/* CF7 restyling bridge — targets Contact Form 7's own default markup/classes
   so the form's config, fields and mail wiring stay entirely untouched;
   only visual presentation is scoped under .r2c-cf7. */
.r2c-cf7 form.wpcf7-form {
  display: flex;
  flex-direction: column;
  gap: var(--pm-space-4);
}
.r2c-cf7 .wpcf7-form-control-wrap { display: block; }
.r2c-cf7 p { margin: 0; }
.r2c-cf7 label {
  display: flex;
  flex-direction: column;
  gap: var(--pm-space-2);
  font-size: var(--pm-text-sm);
  font-weight: var(--pm-weight-medium);
}
.r2c-cf7 .wpcf7-form-control {
  width: 100%;
  min-height: 3rem;
  padding: var(--pm-space-2) var(--pm-space-3);
  background-color: transparent;
  color: var(--pm-fg);
  border: var(--pm-border-width) solid var(--pm-border-color);
  border-radius: var(--pm-radius-form);
  font-size: var(--pm-text-base);
  font-family: inherit;
  line-height: var(--pm-leading-relaxed);
  transition: border-color var(--pm-duration-fast) var(--pm-ease);
}
.r2c-cf7 textarea.wpcf7-form-control {
  min-height: 9rem;
  padding: var(--pm-space-3);
  resize: vertical;
}
.r2c-cf7 .wpcf7-form-control::placeholder { color: var(--pm-fg-muted); }
.r2c-cf7 .wpcf7-form-control:focus {
  outline: none;
  border-color: var(--pm-fg);
  box-shadow: var(--pm-shadow-focus);
}
.r2c-cf7 input.wpcf7-submit {
  --_btn-bg: var(--pm-btn-bg);
  --_btn-fg: var(--pm-btn-fg);
  --_btn-border: var(--pm-btn-border);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--pm-space-2);
  width: auto;
  min-height: 2.75rem;
  padding: var(--pm-space-2) var(--pm-space-6);
  border: var(--pm-border-width) solid var(--_btn-border);
  border-radius: var(--pm-radius-button);
  background-color: var(--_btn-bg);
  color: var(--_btn-fg);
  font-size: var(--pm-text-base);
  font-weight: var(--pm-weight-medium);
  line-height: var(--pm-leading-relaxed);
  cursor: pointer;
  transition: background-color var(--pm-duration-fast) var(--pm-ease);
}
.r2c-cf7 input.wpcf7-submit:hover { opacity: 0.88; }
.r2c-cf7 .wpcf7-not-valid-tip { color: var(--pm-danger, #c0392b); font-size: var(--pm-text-sm); margin-top: var(--pm-space-1); }
.r2c-cf7 .wpcf7-response-output { border-radius: var(--pm-radius-form); margin-top: var(--pm-space-4); }

/* ==========================================================================
   Testimonials page — featured quote + secondary grid
   ========================================================================== */

.testi-featured__grid {
  display: grid;
  gap: var(--pm-space-8);
  align-items: center;
}
@media (min-width: 768px) {
  .testi-featured__grid {
    grid-template-columns: 3fr 2fr;
    gap: var(--pm-space-10);
  }
}
.testi-featured__photo {
  border-radius: var(--pm-radius-card);
  overflow: hidden;
}
.testi-featured__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.testi-featured__quote {
  margin: 0 0 var(--pm-space-4);
}
.testi-grid__item { display: flex; flex-direction: column; gap: var(--pm-space-3); }
.testi-grid__quote { margin: 0; flex: 1; }