/* ==========================================================================
   2026 brand — existing pages
   Loads last, on every page, when BRAND_2026 is on (lib/config.php).

   Carries the three type roles and the one button style onto the pages that
   still use the theme's original markup (pricing, about, FAQ, schedule, team,
   workshops, blog). Colour is handled separately by the generated
   brand-legacy-2026.css. Layout is left alone on purpose — this is a reskin,
   not a rebuild, so each page can be reworked properly in its own pass.
   ========================================================================== */


/* --------------------------------------------------------------------------
   Type — role 2 (Lora titles) and role 3 (DM Sans body)
   -------------------------------------------------------------------------- */

body.brand-2026 .heading__primary--x-large,
body.brand-2026 .heading__primary--large,
body.brand-2026 .heading__primary--medium,
body.brand-2026 .heading__primary--m-small,
body.brand-2026 .heading__primary--small,
body.brand-2026 .heading__primary--x-small,
body.brand-2026 .section__callout,
body.brand-2026 .instagram-section__title,
body.brand-2026 .post__content h1,
body.brand-2026 .post__content h2,
body.brand-2026 .post__content h4 {
  font-family: var(--font-heading);
  font-weight: 400;
  letter-spacing: 0;
}

/* The old display sizes are set for a heavier face; Lora needs a little less. */
body.brand-2026 .heading__primary--x-large { line-height: 1.04; }
body.brand-2026 .heading__primary--large { line-height: 1.06; }
body.brand-2026 .heading__primary--medium { line-height: 1.15; }

body.brand-2026 .heading__secondary--x-large,
body.brand-2026 .heading__secondary--large,
body.brand-2026 .heading__secondary--medium,
body.brand-2026 .heading__secondary--small,
body.brand-2026 .heading__secondary--x-small,
body.brand-2026 .post__content ol li,
body.brand-2026 .post__content ul li {
  font-family: var(--font-body);
  letter-spacing: var(--track-body);
}

/* Role 1 — small caps labels already in the markup as section titles. */
body.brand-2026 .section__title {
  font-family: var(--font-accent);
  letter-spacing: .16em;
}


/* --------------------------------------------------------------------------
   Buttons — one filled style, matching the new pages
   -------------------------------------------------------------------------- */

body.brand-2026 .btn__primary,
body.brand-2026 .btn__secondary,
body.brand-2026 .btn__tertiary,
body.brand-2026 .pricing__section .btn,
body.brand-2026 .schedules__section .btn,
body.brand-2026 .location__tabs .tab,
body.brand-2026 .sorting-box .category__list a {
  font-family: var(--font-nav);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--soft-white);
  background: var(--seafoam);
  border: 1.5px solid var(--seafoam);
  border-radius: 0;
  min-width: 0;
  padding: 19px 32px;
  transition: background-color .25s ease, border-color .25s ease;
}

body.brand-2026 .btn__primary:hover,
body.brand-2026 .btn__secondary:hover,
body.brand-2026 .btn__tertiary:hover,
body.brand-2026 .pricing__section .btn:hover,
body.brand-2026 .schedules__section .btn:hover {
  color: var(--soft-white);
  background: var(--teal);
  border: 1.5px solid var(--teal);
}

/* The old arrow sat outside the button; the new buttons don't use one. */
body.brand-2026 .btn__primary:after,
body.brand-2026 .btn__secondary:after,
body.brand-2026 .btn__tertiary:after,
body.brand-2026 .pricing__section .btn:after,
body.brand-2026 .schedules__section .btn:after {
  content: none;
}

/* Team cards: "Learn more" reads as a text link, not a filled button — deep
   teal with an arrow, matching the links on the new homepage. The compound
   selector keeps it ahead of the plain .btn__primary styling. */
body.brand-2026 .btn__primary.btn__primary--read-more {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  background: transparent;
  border: 0;
  padding: 0;
  min-width: 0;
  color: var(--teal);
}

body.brand-2026 .btn__primary.btn__primary--read-more:after {
  content: "\2192"; /* → */
  display: inline-block;
  /* the theme's arrow is a background image on this same pseudo-element */
  position: static;
  background: none;
  width: auto;
  height: auto;
  top: auto;
  right: auto;
  font-size: 15px;
  line-height: 1;
  transform: none;
  transition: transform .25s ease;
}

body.brand-2026 .btn__primary.btn__primary--read-more:hover {
  background: transparent;
  border: 0;
  color: var(--charcoal);
}

body.brand-2026 .btn__primary.btn__primary--read-more:hover:after {
  transform: translateX(4px);
}


/* On the seafoam panels a seafoam button disappears — use the dark fill there. */
body.brand-2026 .pricing__alternative .btn__primary,
body.brand-2026 .pricing__alternative .btn__secondary,
body.brand-2026 .section--blue .btn__primary,
body.brand-2026 .section--blue .btn__secondary,
body.brand-2026 .bg--color-primary .btn__primary,
body.brand-2026 .discounts-container .btn__primary,
body.brand-2026 .lifestyle__subscribe .btn__primary {
  background: var(--charcoal);
  border-color: var(--charcoal);
  color: var(--soft-white);
}

body.brand-2026 .pricing__alternative .btn__primary:hover,
body.brand-2026 .pricing__alternative .btn__secondary:hover,
body.brand-2026 .section--blue .btn__primary:hover,
body.brand-2026 .section--blue .btn__secondary:hover,
body.brand-2026 .bg--color-primary .btn__primary:hover,
body.brand-2026 .discounts-container .btn__primary:hover,
body.brand-2026 .lifestyle__subscribe .btn__primary:hover {
  background: var(--teal);
  border-color: var(--teal);
  color: var(--soft-white);
}

/* Footer nav is styled as a button by the theme; keep it as plain links. */
body.brand-2026 .footer__nav > li a {
  background: transparent;
  border: 0;
  padding: 0;
  color: var(--soft-white);
}

body.brand-2026 .footer__nav > li a:hover {
  background: transparent;
  border: 0;
  color: var(--seafoam);
}


/* --------------------------------------------------------------------------
   Name bands on team / workshop / event cards
   These were the old brand blue written as rgba(), which the generated colour
   swap doesn't catch (it matches hex only). Warm stone keeps the dark names
   legible over the white-background portraits.
   -------------------------------------------------------------------------- */

body.brand-2026 .team-member__list .workshop__title,
body.brand-2026 .workshops ul > li .workshop__title,
body.brand-2026 .events-workshops__list .workshop__title {
  background: rgba(216, 206, 194, .92);
}


/* --------------------------------------------------------------------------
   Old pastel watercolour decoration — removed
   These are the rainbow washes behind the page sections, set as background
   images on the sections themselves and as absolutely positioned strips. They
   belong to the previous brand; the new one sits on plain soft white. Real
   photography (.header-img and anything from the Media Library) is untouched.
   -------------------------------------------------------------------------- */

body.brand-2026 .pricing__section,
body.brand-2026 .section__about-studio,
body.brand-2026 .schedules__section,
body.brand-2026 .workshops__section,
body.brand-2026 .blog-page__section {
  background-image: none;
}

body.brand-2026 .hp-bottom__bg,
body.brand-2026 .pricing-bottom__bg,
body.brand-2026 .blog-bottom__bg,
body.brand-2026 .archives-bottom__bg,
body.brand-2026 .archives-page__bg,
body.brand-2026 .class-location-bottom__bg,
body.brand-2026 .events-workshops-bottom__bg,
body.brand-2026 .team__bottom__bg,
body.brand-2026 .team-individual__bottom__bg,
body.brand-2026 .schedule-fp__bg,
body.brand-2026 .pricing-header__section:after {
  display: none;
}


/* --------------------------------------------------------------------------
   Decoration — the old mandala washes, softened rather than removed
   -------------------------------------------------------------------------- */

body.brand-2026 .mandala,
body.brand-2026 .mandala__dog,
body.brand-2026 .mandala__meditation,
body.brand-2026 .mandala-meditation {
  opacity: .35;
}

/* Diamond badges keep their shape but take brand colour from the generated
   layer; just calm the type inside them. */
body.brand-2026 .diamond span,
body.brand-2026 .landing--diamond span {
  font-family: var(--font-accent);
  letter-spacing: .1em;
}


/* --------------------------------------------------------------------------
   Links in body copy
   -------------------------------------------------------------------------- */

body.brand-2026 .post__content a,
body.brand-2026 .faq__items .faq__answer a {
  color: var(--teal);
}