/*
 * Purtle.com Barrio — Minimal Page Shell V1
 *
 * Purpose:
 * - provide a clean structural layer around Barrio
 * - preserve Purtle.com system/content regions
 * - avoid former paid-theme page-layout machinery
 */

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: #ffffff;
  color: var(--purtle-near-black);
}

.purtle-site {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.purtle-container {
  width: min(100% - 3rem, 1320px);
  margin-inline: auto;
}

.purtle-before-content {
  position: relative;
  z-index: 20;
}

.purtle-main {
  flex: 1 0 auto;
  min-width: 0;
}

.purtle-main__content {
  min-width: 0;
}

.purtle-system-region,
.purtle-breadcrumbs {
  width: 100%;
}

.purtle-system-region {
  padding-block: 1rem;
}

.purtle-breadcrumbs {
  padding-block: 0.75rem;
}

.purtle-content-bottom,
.purtle-similar-posts,
.purtle-content-menu-toggle {
  position: relative;
}

/* ==========================================================================
   Purtle.com clean footer
   ========================================================================== */

.purtle-footer {
  flex: 0 0 auto;
  margin-top: auto;
  background: var(--purtle-near-black);
  color: var(--purtle-warm-ivory);
}

.purtle-footer a {
  color: inherit;
}

.purtle-footer a:hover,
.purtle-footer a:focus-visible {
  color: var(--purtle-primary-gold);
}

.purtle-footer a:focus-visible {
  outline: 2px solid var(--purtle-primary-gold);
  outline-offset: 3px;
}

.purtle-footer__main {
  display: grid;
  grid-template-columns:
    minmax(0, 1.55fr)
    minmax(150px, 0.7fr)
    minmax(170px, 0.7fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: start;
  padding-block: clamp(2.75rem, 5vw, 4.5rem);
}

.purtle-footer__brand {
  max-width: 460px;
}

.purtle-footer__brand-link {
  display: inline-block;
  text-decoration: none;
}

.purtle-footer__logo {
  display: block;
  width: min(240px, 100%);
  height: auto;
}

.purtle-footer__tagline {
  max-width: 34rem;
  margin: 1rem 0 0;
  color: rgba(250, 248, 242, 0.72);
  font-family:
    "Purtle Inter",
    Arial,
    Helvetica,
    sans-serif;
  font-size: 0.95rem;
  line-height: 1.55;
}

.purtle-footer__heading {
  margin: 0 0 1rem;
  color: var(--purtle-warm-ivory);
  font-family:
    "Purtle Inter",
    Arial,
    Helvetica,
    sans-serif;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  line-height: 1.2;
  text-transform: uppercase;
}

.purtle-footer__nav-list {
  display: grid;
  gap: 0.55rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.purtle-footer__nav-list a,
.purtle-footer__legal a,
.purtle-footer__legal .purtle-privacy-choice-link {
  color: rgba(250, 248, 242, 0.76);
  font-family:
    "Purtle Inter",
    Arial,
    Helvetica,
    sans-serif;
  text-decoration: none;
}

.purtle-footer__nav-list a {
  font-size: 0.92rem;
  line-height: 1.4;
}

.purtle-footer__contact {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0.65rem 1.15rem;
  border-radius: 999px;
  background: var(--purtle-primary-gold);
  color: var(--purtle-near-black) !important;
  font-family:
    "Purtle Inter",
    Arial,
    Helvetica,
    sans-serif;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}

.purtle-footer__contact:hover {
  background: var(--purtle-warm-ivory);
  color: var(--purtle-near-black) !important;
}

.purtle-footer__contact:focus-visible {
  color: var(--purtle-near-black) !important;
}

.purtle-footer__social {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-top: 1.1rem;
}

.purtle-footer__social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  color: rgba(250, 248, 242, 0.82);
  text-decoration: none;
}

.purtle-footer__social a:hover,
.purtle-footer__social a:focus-visible {
  color: var(--purtle-primary-gold);
}

.purtle-footer__social-icon {
  display: block;
  width: 18px;
  height: 18px;
  background-color: currentColor;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.purtle-footer__social-icon--youtube {
  -webkit-mask-image:
    url("/libraries/bootstrap-icons/icons/youtube.svg");
  mask-image:
    url("/libraries/bootstrap-icons/icons/youtube.svg");
}

.purtle-footer__social-icon--instagram {
  -webkit-mask-image:
    url("/libraries/bootstrap-icons/icons/instagram.svg");
  mask-image:
    url("/libraries/bootstrap-icons/icons/instagram.svg");
}

.purtle-footer__social-icon--linkedin {
  -webkit-mask-image:
    url("/libraries/bootstrap-icons/icons/linkedin.svg");
  mask-image:
    url("/libraries/bootstrap-icons/icons/linkedin.svg");
}

.purtle-footer__social-icon--facebook {
  -webkit-mask-image:
    url("/libraries/bootstrap-icons/icons/facebook.svg");
  mask-image:
    url("/libraries/bootstrap-icons/icons/facebook.svg");
}

.purtle-footer__bottom {
  display: flex;
  gap: 1.5rem;
  align-items: center;
  justify-content: space-between;
  padding-block: 1.15rem 1.4rem;
  border-top: 1px solid rgba(250, 248, 242, 0.14);
}

.purtle-footer__copyright-text {
  margin: 0;
  color: rgba(250, 248, 242, 0.58);
  font-family:
    "Purtle Inter",
    Arial,
    Helvetica,
    sans-serif;
  font-size: 0.78rem;
  line-height: 1.4;
}

.purtle-footer__legal {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 1rem;
  justify-content: flex-end;
}

.purtle-footer__legal a,
.purtle-footer__legal .purtle-privacy-choice-link {
  font-size: 0.78rem;
  line-height: 1.4;
}

.purtle-footer__dynamic-regions {
  padding-bottom: 1rem;
}

@media (max-width: 991.98px) {
  .purtle-footer__main {
    grid-template-columns:
      minmax(0, 1fr)
      minmax(0, 1fr);
    gap: 2rem 3rem;
  }

  .purtle-footer__brand {
    grid-column: 1 / -1;
  }
}

@media (max-width: 767.98px) {
  .purtle-footer__main {
    grid-template-columns: 1fr;
    gap: 2rem;
    padding-block: 2.5rem;
  }

  .purtle-footer__brand {
    grid-column: auto;
  }

  .purtle-footer__bottom {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.8rem;
  }

  .purtle-footer__legal {
    justify-content: flex-start;
  }
}

/*
 * Dark hero routes use an overlaid header.
 * Their first content component begins behind the header.
 */

body.purtle-header-dark .purtle-main {
  position: relative;
}

/*
 * Light/non-hero routes keep the header in normal document flow.
 */

body:not(.purtle-header-dark) .purtle-main {
  position: relative;
}

@media (max-width: 767.98px) {
  .purtle-container {
    width: min(100% - 2rem, 1320px);
  }

  .purtle-footer__main {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
}

/*
 * System stack
 *
 * Initial clean-theme placement is intentionally limited to:
 * - Page title
 * - Status messages
 *
 * Legacy search and RSS blocks are not part of Preview V1.
 */

.purtle-system-stack {
  position: relative;
  z-index: 10;
  width: 100%;
}

.purtle-system-stack:empty {
  display: none;
}

.purtle-system-stack .block {
  margin-block: 0;
}

/* ==========================================================================
   Student profile completion reminder
   --------------------------------------------------------------------------
   Ported from the frozen Purtle.com V1 presentation contract.
   Markup and reminder logic remain owned by student_profile_reminder.
   ========================================================================== */

.student-profile-reminder {
  max-width: 980px;
  margin: 24px auto 0;
  padding: 14px 18px;
  border-left: 4px solid var(--purtle-primary-gold);
  border-radius: 8px;
  background: var(--purtle-warm-ivory);
  color: var(--purtle-near-black);
  font-family: "Purtle Inter", Arial, Helvetica, sans-serif;
  font-size: 0.98rem;
  line-height: 1.5;
  box-shadow: 0 8px 24px rgba(17, 17, 19, 0.06);
}

.student-profile-reminder a {
  color: var(--purtle-deeper-brass);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.student-profile-reminder a:hover,
.student-profile-reminder a:focus-visible {
  color: var(--purtle-interaction-gold);
}

.student-profile-reminder a:focus-visible {
  outline: 2px solid var(--purtle-interaction-gold);
  outline-offset: 2px;
}

.student-profile-reminder--important {
  border-left-width: 6px;
  border-left-color: var(--purtle-primary-gold);
  background: rgba(185, 138, 61, 0.10);
  font-weight: 500;
}

.student-profile-reminder--important strong {
  display: block;
  margin-bottom: 4px;
  color: var(--purtle-near-black);
  font-size: 1.05rem;
}


/* ==========================================================================
   GATE 35K372 — CONTACT LOCATION + MAP
   Genuine Greenville studio location restored without Nuur dependencies.
   ========================================================================== */

body.path-contact .purtle-main__content {
  width: min(100%, 900px);
  margin-inline: auto;
  padding:
    clamp(3rem, 5vw, 4.5rem)
    clamp(1rem, 3vw, 2rem)
    clamp(1.5rem, 3vw, 2.5rem);
  box-sizing: border-box;
}

body.path-contact .purtle-content-bottom {
  width: 100%;
  margin-top:
    clamp(1.5rem, 3vw, 2.75rem);
  padding:
    clamp(2.5rem, 5vw, 4.5rem)
    clamp(1rem, 3vw, 2rem);
  background:
    linear-gradient(
      180deg,
      rgba(185, 138, 61, 0.055),
      rgba(250, 248, 242, 0.72)
    );
  border-top:
    1px solid rgba(17, 17, 19, 0.08);
  box-sizing: border-box;
}

body.path-contact
  .purtle-content-bottom
  .region-content-bottom {
  display: grid;
  grid-template-columns:
    minmax(260px, 0.8fr)
    minmax(0, 1.45fr);
  gap:
    clamp(1.25rem, 3vw, 2.25rem);
  width: min(100%, 1180px);
  margin-inline: auto;
  align-items: stretch;
}

body.path-contact
  .purtle-content-bottom
  .block-block-content {
  min-width: 0;
  margin: 0;
}

/*
 * Address/contact card.
 */
body.path-contact
  #block-purtle-barrio-contact-location {
  display: flex;
  align-items: center;
  padding:
    clamp(1.35rem, 3vw, 2rem);
  border:
    1px solid rgba(17, 17, 19, 0.09);
  border-top:
    4px solid var(--purtle-primary-gold);
  border-radius: 16px;
  background: #fff;
  box-shadow:
    0 12px 32px rgba(17, 17, 19, 0.055);
}

body.path-contact
  #block-purtle-barrio-contact-location
  .field--name-body {
  height: 100%;
}

body.path-contact
  #block-purtle-barrio-contact-location
  h5 {
  margin:
    0
    0
    0.35rem;
  color: var(--purtle-near-black);
  font-family:
    "Purtle Inter",
    Arial,
    Helvetica,
    sans-serif;
  font-size: 0.82rem;
  font-weight: 750;
  letter-spacing: 0.035em;
  line-height: 1.3;
  text-transform: uppercase;
}

body.path-contact
  #block-purtle-barrio-contact-location
  p,
body.path-contact
  #block-purtle-barrio-contact-location
  span {
  color: rgba(17, 17, 19, 0.79);
  font-family:
    "Purtle Inter",
    Arial,
    Helvetica,
    sans-serif;
  font-size: 1rem;
  line-height: 1.6;
}

body.path-contact
  #block-purtle-barrio-contact-location
  p {
  margin:
    0
    0
    1.1rem;
}

body.path-contact
  #block-purtle-barrio-contact-location
  .mt-3,
body.path-contact
  #block-purtle-barrio-contact-location
  .mt-lg-4 {
  margin-top: 1.25rem !important;
}

/*
 * Google Business Profile location map.
 * Neutralize old Nuur utility wrappers while keeping the surviving iframe.
 */
body.path-contact
  #block-purtle-barrio-contact-map,
body.path-contact
  #block-purtle-barrio-contact-map
  .field--name-body,
body.path-contact
  #block-purtle-barrio-contact-map
  .section-spacing,
body.path-contact
  #block-purtle-barrio-contact-map
  .container,
body.path-contact
  #block-purtle-barrio-contact-map
  .gmap {
  width: 100%;
  max-width: none;
  height: 100%;
  margin: 0;
  padding: 0;
}

body.path-contact
  #block-purtle-barrio-contact-map
  .gmap {
  min-height: 420px;
  overflow: hidden;
  border:
    1px solid rgba(17, 17, 19, 0.09);
  border-radius: 16px;
  background: #fff;
  box-shadow:
    0 12px 32px rgba(17, 17, 19, 0.055);
}

body.path-contact
  #block-purtle-barrio-contact-map
  iframe {
  display: block;
  width: 100% !important;
  height: 100% !important;
  min-height: 420px;
  border: 0 !important;
}

/*
 * Keep the location presentation stacked and comfortable on narrower screens.
 */
@media (max-width: 767.98px) {
  body.path-contact
    .purtle-content-bottom
    .region-content-bottom {
    grid-template-columns: 1fr;
  }

  body.path-contact
    #block-purtle-barrio-contact-map
    .gmap,
  body.path-contact
    #block-purtle-barrio-contact-map
    iframe {
    min-height: 340px;
  }
}

/* --------------------------------------------------------------------------
   Reusable video hero primitive
   -------------------------------------------------------------------------- */

.purtle-main .section-spacing-xl:has(> .bg-video) {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  min-height: clamp(520px, 68vh, 760px);
  padding-block: 96px;
  overflow: hidden;
  color: var(--purtle-warm-ivory);
  background: var(--purtle-near-black);
}

.purtle-main .section-spacing-xl:has(> .bg-video)::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(
      180deg,
      rgba(17, 17, 19, 0.47),
      rgba(17, 17, 19, 0.60)
    );
}

.purtle-main .section-spacing-xl > .bg-video {
  position: absolute;
  z-index: -2;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.purtle-main .section-spacing-xl > .bg-video video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.purtle-main .section-spacing-xl:has(> .bg-video) > .container {
  position: relative;
  z-index: 1;
}

.purtle-main .section-spacing-xl:has(> .bg-video) h1 {
  max-width: 1000px;
  margin-inline: auto;
  color: var(--purtle-warm-ivory);
  font-size: clamp(2.45rem, 1.95rem + 1.7vw, 3.6rem);
  line-height: 1.08;
  font-weight: 600;
  letter-spacing: -0.018em;
}

.purtle-main .section-spacing-xl:has(> .bg-video) .lead {
  max-width: 760px;
  margin-inline: auto;
  color: rgba(250, 248, 242, 0.88);
  font-size: clamp(1.05rem, 0.95rem + 0.35vw, 1.3rem);
}

@media (max-width: 767.98px) {
  .purtle-main .section-spacing-xl:has(> .bg-video) {
    min-height: clamp(440px, 62vh, 620px);
    padding-block: 76px;
  }
}

/* --------------------------------------------------------------------------
   Method page composition
   -------------------------------------------------------------------------- */

/*
 * /method is a top-level photographic hero route. The hero already contains
 * its semantic H1, so the generic system page title and breadcrumb are
 * redundant and would otherwise sit between the overlay header and hero.
 */
body.page-node-107 .purtle-system-stack .block-page-title-block,
body.page-node-107 .purtle-breadcrumbs {
  display: none;
}

/*
 * The hidden page-title block still leaves its structural wrapper between
 * the overlay header and hero. Collapse that strip unless Drupal is showing
 * a real status/error message.
 */
body.page-node-107
  .purtle-system-stack:not(:has(.messages)) {
  display: none;
}

/* Match the homepage top-of-content contract; Barrio adds 10px by default. */
body.page-node-107 .node__content {
  margin: 0;
}

/* Intro / explanation composition. */
body.page-node-107
  .paragraph--type--paragraph-layout.container.pt-5.pb-0 {
  padding-top: clamp(3rem, 5vw, 4.75rem) !important;
  padding-bottom: clamp(1rem, 2vw, 1.5rem) !important;
}


/* Give the second editorial thought in the intro clear separation. */
body.page-node-107
  .paragraph--type--paragraph-layout.container.pt-5.pb-0
  .paragraph--type--paragraph-content
  + .paragraph--type--paragraph-content:has(h2) {
  margin-top: clamp(1.5rem, 2.5vw, 2rem);
}

body.page-node-107 .field--name-field-components > .field__label {
  display: none;
}

body.page-node-107 .field--name-field-components img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid rgba(17, 17, 19, 0.10);
  border-radius: 0.75rem;
  box-shadow: 0 12px 32px rgba(17, 17, 19, 0.08);
}

/* Avoid duplicate Bootstrap pb-5 beneath the closing Method layout. */
body.page-node-107
  .paragraph--type--paragraph-section.pb-5:has(
    .paragraph--type--paragraph-layout.container.pt-4.pb-0
  ) {
  padding-bottom: 0 !important;
}

/* Closing editorial section. */
body.page-node-107
  .paragraph--type--paragraph-layout.container.pt-4.pb-0 {
  padding-top: clamp(1rem, 2vw, 1.6rem) !important;
  padding-bottom: clamp(2rem, 3vw, 2.75rem) !important;
}

body.page-node-107
  .paragraph--type--paragraph-layout.container.pt-4.pb-0
  > .row
  > .col-12 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(2.5rem, 5vw, 5rem);
}

body.page-node-107
  .paragraph--type--paragraph-layout.container.pt-4.pb-0
  > .row
  > .col-12
  > .paragraph {
  min-width: 0;
}

body.page-node-107
  .paragraph--type--paragraph-layout.container.pt-4.pb-0
  > .row
  > .col-12
  > .paragraph
  + .paragraph {
  padding-left: clamp(2.5rem, 5vw, 5rem);
  border-left: 1px solid rgba(17, 17, 19, 0.12);
}

body.page-node-107
  .paragraph--type--paragraph-layout.container.pt-4.pb-0
  h2 {
  margin-bottom: 1rem;
}

body.page-node-107
  .paragraph--type--paragraph-layout.container.pt-4.pb-0
  p {
  max-width: 62ch;
}

@media (max-width: 767.98px) {
  body.page-node-107
    .paragraph--type--paragraph-layout.container.pt-4.pb-0
    > .row
    > .col-12 {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  body.page-node-107
    .paragraph--type--paragraph-layout.container.pt-4.pb-0
    > .row
    > .col-12
    > .paragraph
    + .paragraph {
    padding-top: 2rem;
    padding-left: 0;
    border-top: 1px solid rgba(17, 17, 19, 0.12);
    border-left: 0;
  }
}

/* --------------------------------------------------------------------------
   Method final visual polish
   -------------------------------------------------------------------------- */

/* Interior editorial links use the Purtle interaction language, not browser blue. */
body.page-node-107
  .purtle-main__content
  .field--name-field-paragraph-content
  a {
  color: var(--purtle-near-black);
  text-decoration-line: underline;
  text-decoration-color: var(--purtle-interaction-gold);
  text-decoration-thickness: 2px;
  text-underline-offset: 0.16em;
  transition:
    color 160ms ease,
    text-decoration-color 160ms ease;
}

body.page-node-107
  .purtle-main__content
  .field--name-field-paragraph-content
  a:hover,
body.page-node-107
  .purtle-main__content
  .field--name-field-paragraph-content
  a:focus-visible {
  color: var(--purtle-deeper-brass);
  text-decoration-color: var(--purtle-deeper-brass);
}

/* --------------------------------------------------------------------------
   Shared responsive photographic heroes
   -------------------------------------------------------------------------- */

.purtle-photo-hero {
  position: relative;
  width: 100%;
  overflow: hidden;
  color: var(--purtle-warm-ivory);
  background: var(--purtle-near-black);
  isolation: isolate;
}


/*
 * Study and Legacy heroes occupy their historical paragraph position inside
 * node content, so explicitly preserve the approved full-viewport bleed.
 */
body.page-node-108 .purtle-photo-hero--study,
body.page-node-104 .purtle-photo-hero--legacy {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.purtle-photo-hero__picture {
  position: absolute;
  z-index: 0;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

.purtle-photo-hero__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.purtle-photo-hero__overlay {
  position: relative;
  z-index: 1;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
}

.purtle-photo-hero h1 {
  max-width: 1000px;
  margin: 0 auto;
  color: var(--purtle-warm-ivory);
  font-size: clamp(3rem, 2.2rem + 2.4vw, 4.75rem);
  line-height: 1.08;
  font-weight: 600;
  letter-spacing: -0.018em;
  text-transform: uppercase;
}

.purtle-photo-hero__lead {
  max-width: 760px;
  margin: 1rem auto 0;
  color: rgba(250, 248, 242, 0.88);
  font-size: clamp(1.05rem, 0.95rem + 0.35vw, 1.3rem);
}

/*
 * Study and Legacy share the approved editorial hero proportions.
 */
.purtle-photo-hero--study .purtle-photo-hero__overlay,
.purtle-photo-hero--legacy .purtle-photo-hero__overlay {
  min-height: clamp(430px, 50vh, 540px);
  padding-block: 96px;
}

.purtle-photo-hero--study .purtle-photo-hero__image {
  object-position: 50% 58%;
}

.purtle-photo-hero--legacy .purtle-photo-hero__image {
  object-position: 50% 35%;
}

.purtle-photo-hero--study .purtle-photo-hero__overlay {
  background: rgba(17, 17, 19, 0.40);
}

.purtle-photo-hero--legacy .purtle-photo-hero__overlay {
  background: rgba(17, 17, 19, 0.58);
}

/*
 * Contact retains its approved shallower hero proportions.
 */
.purtle-photo-hero--contact {
  height: clamp(330px, 40vw, 500px);
}

.purtle-photo-hero--contact .purtle-photo-hero__image {
  object-position: center center;
}

.purtle-photo-hero--contact .purtle-photo-hero__overlay {
  height: 100%;
  padding-top: 88px;
  background: rgba(17, 17, 19, 0.34);
}

@media (max-width: 767.98px) {
  .purtle-photo-hero--study .purtle-photo-hero__overlay,
  .purtle-photo-hero--legacy .purtle-photo-hero__overlay {
    min-height: clamp(360px, 48vh, 460px);
    padding-block: 76px;
  }

  .purtle-photo-hero--contact {
    height: clamp(300px, 70vw, 410px);
  }

  .purtle-photo-hero--contact .purtle-photo-hero__overlay {
    padding-top: 72px;
  }
}

/* --------------------------------------------------------------------------
   Study page system chrome
   -------------------------------------------------------------------------- */

/*
 * The photographic hero already contains the semantic H1. Hide the generic
 * Drupal title/breadcrumb strip so the hero sits directly below the header.
 */
body.page-node-108 .purtle-system-stack .block-page-title-block,
body.page-node-108 .purtle-breadcrumbs {
  display: none;
}

body.page-node-108
  .purtle-system-stack:not(:has(.messages)) {
  display: none;
}

body.page-node-108 .node__content {
  margin: 0;
}

/* --------------------------------------------------------------------------
   Study page transparent-header contrast
   -------------------------------------------------------------------------- */

/*
 * Keep the transparent photographic header while protecting logo/navigation
 * legibility against lighter areas of the hero image.
 */
body.page-node-108 .purtle-header--dark {
  background:
    linear-gradient(
      180deg,
      rgba(17, 17, 19, 0.46) 0%,
      rgba(17, 17, 19, 0.24) 72%,
      rgba(17, 17, 19, 0.10) 100%
    );
}

/* --------------------------------------------------------------------------
   Study page composition
   -------------------------------------------------------------------------- */

/*
 * Preserve the existing 7/5 editorial structure while giving the Study page
 * the same measured spacing and divider language used on /method.
 */
body.page-node-108
  .paragraph--type--paragraph-layout.container.pt-5.pb-5 {
  padding-top: clamp(3rem, 5vw, 4.75rem) !important;
  padding-bottom: clamp(3rem, 5vw, 4.75rem) !important;
}

/* The layout paragraph emits an unused second row; remove only empty rows. */
body.page-node-108
  .paragraph--type--paragraph-layout.container.pt-5.pb-5
  > .row:not(:has(.paragraph)) {
  display: none;
}

/* Establish deliberate spacing between editorial blocks in each column. */
body.page-node-108
  .paragraph--type--paragraph-layout.container.pt-5.pb-5
  .paragraph--type--paragraph-content
  + .paragraph--type--paragraph-content {
  margin-top: clamp(2rem, 3vw, 2.75rem);
}

/* Separate the commitment / inquiry column without turning it into a card. */
body.page-node-108
  .paragraph--type--paragraph-layout.container.pt-5.pb-5
  > .row
  > .col-lg-5 {
  padding-left: clamp(2rem, 4vw, 4rem);
  border-left: 1px solid rgba(17, 17, 19, 0.12);
}

body.page-node-108
  .paragraph--type--paragraph-layout.container.pt-5.pb-5
  h2 {
  margin-bottom: 1rem;
}

body.page-node-108
  .paragraph--type--paragraph-layout.container.pt-5.pb-5
  ul {
  margin-bottom: 0;
}

body.page-node-108
  .paragraph--type--paragraph-layout.container.pt-5.pb-5
  li + li {
  margin-top: 0.2rem;
}

body.page-node-108
  .paragraph--type--paragraph-layout.container.pt-5.pb-5
  ul + p {
  margin-top: 0.85rem;
}

body.page-node-108
  .paragraph--type--paragraph-layout.container.pt-5.pb-5
  p {
  max-width: 62ch;
}

/* Match the approved /method interaction treatment for editorial links. */
body.page-node-108
  .purtle-main__content
  .field--name-field-paragraph-content
  a {
  color: var(--purtle-near-black);
  text-decoration-line: underline;
  text-decoration-color: var(--purtle-interaction-gold);
  text-decoration-thickness: 2px;
  text-underline-offset: 0.16em;
  transition:
    color 160ms ease,
    text-decoration-color 160ms ease;
}

body.page-node-108
  .purtle-main__content
  .field--name-field-paragraph-content
  a:hover,
body.page-node-108
  .purtle-main__content
  .field--name-field-paragraph-content
  a:focus-visible {
  color: var(--purtle-deeper-brass);
  text-decoration-color: var(--purtle-deeper-brass);
}

@media (max-width: 991.98px) {
  body.page-node-108
    .paragraph--type--paragraph-layout.container.pt-5.pb-5
    > .row
    > .col-lg-5 {
    margin-top: clamp(2.5rem, 6vw, 3.5rem);
    padding-top: clamp(2.5rem, 6vw, 3.5rem);
    padding-left: calc(var(--bs-gutter-x) * 0.5);
    border-top: 1px solid rgba(17, 17, 19, 0.12);
    border-left: 0;
  }
}

/* --------------------------------------------------------------------------
   Legacy page system chrome / header contrast
   -------------------------------------------------------------------------- */

body.page-node-104
  .purtle-system-stack:not(:has(.messages)) {
  display: none;
}

body.page-node-104 .node__content {
  margin: 0;
}

body.page-node-104 .purtle-header--dark {
  background:
    linear-gradient(
      180deg,
      rgba(17, 17, 19, 0.48) 0%,
      rgba(17, 17, 19, 0.26) 72%,
      rgba(17, 17, 19, 0.11) 100%
    );
}

/* --------------------------------------------------------------------------
   Legacy page editorial composition
   -------------------------------------------------------------------------- */

/*
 * Legacy section paragraphs already carry Bootstrap pb-5. The nested
 * layout paragraphs provide the actual editorial rhythm, so remove the
 * duplicate outer padding rather than stacking both spacing systems.
 */
body.page-node-104
  .paragraph--type--paragraph-section.purtle-section
  > .container.pb-5 {
  padding-bottom: 0 !important;
}

/*
 * Full-width opening and closing sections.
 */
body.page-node-104
  .paragraph--type--paragraph-layout.container.pt-5.pb-5 {
  padding-top: clamp(2.5rem, 4vw, 3.5rem) !important;
  padding-bottom: clamp(2.5rem, 4vw, 3.5rem) !important;
}

/*
 * Paired editorial sections.
 */
body.page-node-104
  .paragraph--type--paragraph-layout.container.pt-3.pb-3 {
  padding-top: clamp(2rem, 3vw, 2.75rem) !important;
  padding-bottom: clamp(2rem, 3vw, 2.75rem) !important;
}

/*
 * Paragraph layouts emit unused secondary rows. Suppress only rows that
 * contain no paragraph entities.
 */
body.page-node-104
  .paragraph--type--paragraph-layout.container
  > .row:not(:has(.paragraph)) {
  display: none;
}

body.page-node-104
  .paragraph--type--paragraph-layout.container
  h2 {
  margin-bottom: 1rem;
}

body.page-node-104
  .paragraph--type--paragraph-layout.container
  p {
  max-width: 62ch;
}

body.page-node-104
  .paragraph--type--paragraph-layout.container.pt-5.pb-5
  p {
  max-width: 72ch;
}

body.page-node-104
  .paragraph--type--paragraph-layout.container
  ul {
  margin-bottom: 0;
}

body.page-node-104
  .paragraph--type--paragraph-layout.container
  li + li {
  margin-top: 0.2rem;
}

body.page-node-104
  .paragraph--type--paragraph-layout.container
  ul + p {
  margin-top: 0.85rem;
}

/*
 * Give paired desktop columns a restrained editorial divider.
 */
@media (min-width: 992px) {
  body.page-node-104
    .paragraph--type--paragraph-layout.container.pt-3.pb-3
    > .row
    > .region--top
    + .col-sm-6 {
    padding-right: clamp(2rem, 4vw, 4rem);
  }

  body.page-node-104
    .paragraph--type--paragraph-layout.container.pt-3.pb-3
    > .row
    > .region--top
    + .col-sm-6
    + .col-sm-6 {
    padding-left: clamp(2rem, 4vw, 4rem);
    border-left: 1px solid rgba(17, 17, 19, 0.12);
  }
}

/*
 * The paragraph template switches to two columns too early at Bootstrap's
 * sm breakpoint. Keep Legacy editorial pairs stacked through tablet widths.
 */
@media (max-width: 991.98px) {
  body.page-node-104
    .paragraph--type--paragraph-layout.container.pt-3.pb-3
    > .row
    > .col-sm-6 {
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
  }

  body.page-node-104
    .paragraph--type--paragraph-layout.container.pt-3.pb-3
    > .row
    > .region--top
    + .col-sm-6
    + .col-sm-6:has(.paragraph) {
    margin-top: clamp(2rem, 5vw, 3rem);
    padding-top: clamp(2rem, 5vw, 3rem);
    border-top: 1px solid rgba(17, 17, 19, 0.12);
  }
}

/*
 * Match the established Method / Study editorial link treatment.
 */
body.page-node-104
  .purtle-main__content
  .field--name-field-paragraph-content
  a {
  color: var(--purtle-near-black);
  text-decoration-line: underline;
  text-decoration-color: var(--purtle-interaction-gold);
  text-decoration-thickness: 2px;
  text-underline-offset: 0.16em;
  transition:
    color 160ms ease,
    text-decoration-color 160ms ease;
}

body.page-node-104
  .purtle-main__content
  .field--name-field-paragraph-content
  a:hover,
body.page-node-104
  .purtle-main__content
  .field--name-field-paragraph-content
  a:focus-visible {
  color: var(--purtle-deeper-brass);
  text-decoration-color: var(--purtle-deeper-brass);
}

/* --------------------------------------------------------------------------
   Contact form presentation
   -------------------------------------------------------------------------- */

body.path-contact .contact-message-feedback-form {
  padding: clamp(1.5rem, 3vw, 2.25rem);
  border: 1px solid rgba(17, 17, 19, 0.09);
  border-top: 4px solid var(--purtle-primary-gold);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 14px 38px rgba(17, 17, 19, 0.055);
}

body.path-contact
  .contact-message-feedback-form
  label {
  display: block;
  margin-bottom: 0.45rem;
  color: var(--purtle-near-black);
  font-family:
    "Purtle Inter",
    Arial,
    Helvetica,
    sans-serif;
  font-size: 0.9rem;
  font-weight: 700;
}

body.path-contact
  .contact-message-feedback-form
  input.form-control:not([type="hidden"]):not([type="submit"]),
body.path-contact
  .contact-message-feedback-form
  textarea.form-control {
  border: 1px solid rgba(17, 17, 19, 0.18);
  border-radius: 10px;
  background: #fff;
  color: var(--purtle-near-black);
  font-family:
    "Purtle Inter",
    Arial,
    Helvetica,
    sans-serif;
  box-shadow: none;
}

body.path-contact
  .contact-message-feedback-form
  input.form-control:not([type="hidden"]):not([type="submit"]) {
  min-height: 50px;
  padding: 0.72rem 0.9rem;
}

body.path-contact
  .contact-message-feedback-form
  textarea.form-control {
  min-height: 230px;
  padding: 0.8rem 0.9rem;
  line-height: 1.55;
}

body.path-contact
  .contact-message-feedback-form
  input.form-control:not([type="hidden"]):not([type="submit"]):focus,
body.path-contact
  .contact-message-feedback-form
  textarea.form-control:focus {
  border-color: var(--purtle-primary-gold);
  box-shadow:
    0 0 0 0.2rem
    rgba(185, 138, 61, 0.16);
}

body.path-contact
  .contact-message-feedback-form
  .captcha {
  margin: 1.5rem 0 0;
  padding: 1.15rem;
  border: 1px solid rgba(17, 17, 19, 0.10);
  border-radius: 12px;
  background: rgba(250, 248, 242, 0.72);
}

body.path-contact
  .contact-message-feedback-form
  .captcha__title {
  float: none;
  width: auto;
  margin: 0;
  padding: 0 0.35rem;
  color: var(--purtle-near-black);
  font-family:
    "Purtle Inter",
    Arial,
    Helvetica,
    sans-serif;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

body.path-contact
  .contact-message-feedback-form
  .captcha__description {
  margin-top: 0.75rem;
  color: rgba(17, 17, 19, 0.66);
  font-size: 0.88rem;
  line-height: 1.5;
}

body.path-contact
  .contact-message-feedback-form
  .form-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-top: 1.5rem;
}

body.path-contact
  .contact-message-feedback-form
  .form-actions
  input[type="submit"] {
  width: auto !important;
  min-height: 48px;
  margin: 0;
  padding: 0.78rem 1.45rem;
  border-radius: 999px;
  font-family:
    "Purtle Inter",
    Arial,
    Helvetica,
    sans-serif;
  font-weight: 800;
  line-height: 1;
  box-shadow: none;
}

body.path-contact
  .contact-message-feedback-form
  #edit-submit {
  border: 1px solid var(--purtle-primary-gold);
  background: var(--purtle-primary-gold);
  color: #fff;
}

body.path-contact
  .contact-message-feedback-form
  #edit-submit:hover,
body.path-contact
  .contact-message-feedback-form
  #edit-submit:focus-visible {
  border-color: var(--purtle-deeper-brass);
  background: var(--purtle-deeper-brass);
  color: #fff;
}

body.path-contact
  .contact-message-feedback-form
  #edit-preview {
  border: 1px solid var(--purtle-near-black);
  background: transparent;
  color: var(--purtle-near-black);
}

body.path-contact
  .contact-message-feedback-form
  #edit-preview:hover,
body.path-contact
  .contact-message-feedback-form
  #edit-preview:focus-visible {
  border-color: var(--purtle-near-black);
  background: var(--purtle-near-black);
  color: var(--purtle-warm-ivory);
}

body.path-contact
  .contact-message-feedback-form
  .form-actions
  input[type="submit"]:focus-visible {
  outline: 2px solid var(--purtle-primary-gold);
  outline-offset: 3px;
}

@media (max-width: 575.98px) {
  body.path-contact
    .contact-message-feedback-form
    .form-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  body.path-contact
    .contact-message-feedback-form
    .form-actions
    input[type="submit"] {
    width: 100% !important;
  }
}