/* Mobile prose baseline. Keep compact navigation, labels and controls unchanged. */
@media (max-width: 767px) {
  :root {
    --kt-mobile-body-copy-size: 20px;
    --kt-mobile-body-copy-leading: 1.55;
  }

  .kt-bathhouse-editorial__case-copy,
  .kt-bathhouse-editorial__rail-copy,
  .bathhouse-strip-caption,
  .xl-format-commit-line,
  .ktgemx-mpx-body,
  .services-primary .service-card--primary .service-micro,
  .services-primary .service-card--primary .service-micro--secondary,
  .services-primary .service-system-card__description,
  #matty-rod-homepage .kt-gw-body,
  .kt-gallery-wall-gateway .kt-map-copy,
  .kt-gallery-wall-gateway .kt-field-notes-copy,
  .kt-final-stage__content .kt-gateway-closing .kvx-closing__lead {
    font-size: var(--kt-mobile-body-copy-size);
    line-height: var(--kt-mobile-body-copy-leading);
  }

  .kt-final-stage__content .kt-gateway-closing .kvx-closing__lead {
    /* Mobile only — sentence case on the first lead line. */
    text-transform: none;
  }

  .kt-final-stage__content .kt-gateway-closing .kvx-closing__lead--precision {
    text-transform: uppercase;
  }

  /* Title gateway card — Explore KiwiTile label slightly larger. */
  .kt-final-stage__title {
    font-size: clamp(42px, 6.4vw, 80px);
  }

  /* Project Environments + European Field Notes CTAs — larger hit target & label. */
  .kt-gallery-wall-gateway .kt-map-card .kt-gw-cta,
  .kt-gallery-wall-gateway .kt-field-notes-card .kt-gw-cta {
    width: min(100%, 300px);
    min-height: 54px;
    margin-top: 22px;
    padding: 15px 18px;
    font-size: 16px;
    line-height: 1.25;
    letter-spacing: 0.14em;
  }

  /* Gateway card titles — shared size/style (Environments, European, Gallery Wall). */
  .kt-gallery-wall-gateway .kt-map-title,
  .kt-gallery-wall-gateway .kt-field-notes-title,
  #matty-rod-homepage .kt-gw-title {
    font-family: var(--font-serif);
    font-size: clamp(34px, 10vw, 44px);
    font-weight: 500;
    line-height: 0.92;
    letter-spacing: -0.025em;
    text-transform: uppercase;
    color: rgba(240, 190, 111, 0.98);
  }

  /* Gallery Wall title: same size as other gateway titles; one phrase (not stacked). */
  #matty-rod-homepage .kt-gw-title {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    column-gap: 0.28em;
    font-size: clamp(34px, 10vw, 44px);
    line-height: 0.92;
  }

  #matty-rod-homepage .kt-gw-title span {
    display: inline;
    width: auto;
  }

  .ktgemx-ktx-preview-shell
    .ktgemx-gmx-panel-zero
    .ktgemx-gmx-body
    p {
    font-size: 22px;
    line-height: 1.55;
  }

  /* Exhibit A / B / C labels only — slightly larger on phone. */
  .kt-bathhouse-editorial__kicker,
  .xl-editorial-eyebrow {
    font-size: 14px;
  }

  /* Exhibit C only — keep "THE LAYERS" on one line. */
  .ktgemx-gmx-panel-entry .kt-bathhouse-editorial__title > .kt-bathhouse-editorial__title-gold {
    display: inline;
  }

  .ktgemx-gmx-panel-entry .kt-bathhouse-editorial__title > .kt-bathhouse-editorial__title-gold + .kt-bathhouse-editorial__title-gold::before {
    content: "\00a0";
  }

  .services-primary .services-heading-eyebrow {
    font-size: 16px;
    line-height: 1.3;
    letter-spacing: 0.2em;
  }

  /* THE STANDARD / IN PRACTICE — larger on phone. */
  .services-primary .services-heading-title-ivory {
    font-size: clamp(46px, 10vw, 68px);
  }

  .services-primary .services-heading-title-gold {
    font-size: clamp(50px, 11vw, 78px);
  }

  /* Heading card — slightly taller so title block can breathe. */
  .services-primary .services-heading-text {
    padding: 32px 22px 30px;
  }

  .services-primary .services-heading-rule {
    margin: 14px auto 20px;
  }

  .services-primary .services-heading-sub {
    font-size: var(--kt-mobile-body-copy-size);
    line-height: var(--kt-mobile-body-copy-leading);
    margin-top: 24px;
  }

  /* One sentence on phone: "…alignment - applied to…" */
  .services-primary .services-heading-sub-break {
    display: none;
  }

  .services-primary .services-heading-sub-join::before {
    content: " - ";
  }

  .services-primary .service-system-card__title {
    font-size: 26px;
    line-height: 1.2;
  }

  .services-primary .service-system-card__description {
    font-size: 22px;
    line-height: 1.5;
  }

  /* Primary + integrated service CTAs — lighter, slightly warmer gold. */
  .services-primary .service-card--primary .kt-svc-cta,
  .services-primary .service-system-card .kt-svc-cta {
    --svc-cta-gold: 238 186 118;
    color: rgb(250 214 158 / 0.98);
    border-color: rgb(var(--svc-cta-gold) / 0.8);
    background:
      linear-gradient(
        90deg,
        rgb(var(--svc-cta-gold) / 0.8),
        rgb(var(--svc-cta-gold) / 0.2)
      )
        left center / clamp(24px, 8%, 36px) 1px no-repeat,
      linear-gradient(
        270deg,
        rgb(var(--svc-cta-gold) / 0.8),
        rgb(var(--svc-cta-gold) / 0.2)
      )
        right center / clamp(24px, 8%, 36px) 1px no-repeat,
      linear-gradient(
        180deg,
        rgb(255 220 168 / 0.16),
        rgb(52 36 20 / 0.4) 58%,
        rgb(28 18 10 / 0.5)
      );
    box-shadow:
      inset 0 1px 0 rgb(255 236 200 / 0.18),
      inset 0 -1px 0 rgb(0 0 0 / 0.18),
      0 8px 22px rgb(0 0 0 / 0.2);
    text-shadow:
      0 1px 0 rgb(255 236 200 / 0.24),
      0 2px 10px rgb(0 0 0 / 0.32);
    font-size: 20px;
    letter-spacing: 0.12em;
  }

  .services-primary .service-system-card .kt-svc-cta {
    width: 100%;
    min-height: 56px;
    padding: 15px 18px;
    font-size: 20px;
    line-height: 1.25;
    letter-spacing: 0.12em;
    white-space: normal;
  }

  .services-primary .service-card--primary .kt-svc-cta {
    font-size: 20px;
  }

  /* Slight extra air between Stone card and integrated services row. */
  .services-primary .service-stone + .service-system-row {
    margin-top: 14px;
  }

  /* Same extra air between Installation Failure row and the closing card. */
  .services-primary .service-system-row + .kt-services-closing,
  .services-primary .service-system-row + .service-card.kt-services-closing {
    margin-top: 14px;
  }

  .services-primary .kt-services-closing__line {
    font-size: 28px;
    line-height: 1.35;
  }

  .services-primary .kt-services-closing .kt-svc-cta {
    width: 100%;
    min-height: 60px;
    padding: 16px 20px;
    font-size: 20px;
    line-height: 1.25;
    letter-spacing: 0.1em;
  }
}

/* Standalone mobile decision fields and consultation screens. */
@media (max-width: 860px) {
  .copy-text,
  .consultancy-text,
  .subline,
  .intro,
  .card p,
  .overview p,
  .spec-value,
  .panel-body {
    font-size: 18px;
    line-height: 1.55;
  }

  .copy-method,
  .copy-method b,
  .copy-method .copy-method-emphasis,
  .copy-shown p {
    font-size: 18px;
    line-height: 1.55;
  }
}

/*
  Exhibit B + C — accordion chevrons (mobile only).
  Chevron glyph only (no disc). Collapsed strips only.
*/
@keyframes kt-acc-chevron-breathe {
  0%,
  100% {
    opacity: 0.88;
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.55))
      drop-shadow(0 0 10px rgba(241, 199, 125, 0.12));
  }
  50% {
    opacity: 1;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.6))
      drop-shadow(0 0 16px rgba(241, 199, 125, 0.28));
  }
}

@media (max-width: 767px) {
  .is-mobile-accordion .kt-acc-chevron {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 4;
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    pointer-events: none;
    transform: translate3d(-50%, -50%, 0);
    opacity: 0;
    visibility: hidden;
    transition: opacity 280ms ease, visibility 280ms ease;
  }

  .is-mobile-accordion .kt-acc-chevron::before {
    content: none;
    display: none;
  }

  .is-mobile-accordion .kt-acc-chevron svg {
    display: block;
    width: 64px;
    height: 64px;
    fill: none;
    stroke: rgba(255, 246, 228, 0.96);
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
    /* Default face ‹ until JS sets side relative to open panel. */
    transform: rotate(180deg);
    transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1);
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.55))
      drop-shadow(0 0 10px rgba(241, 199, 125, 0.12));
  }

  /* Collapsed only */
  .is-mobile-accordion > figure:not(.is-accordion-open) .kt-acc-chevron,
  .is-mobile-accordion
    > .ktgemx-gmx-media-detail:not(.is-accordion-open)
    .kt-acc-chevron,
  .is-mobile-accordion
    > .ktgemx-gmx-media-wide:not(.is-accordion-open)
    .kt-acc-chevron {
    opacity: 1;
    visibility: visible;
  }

  .is-mobile-accordion > figure:not(.is-accordion-open) .kt-acc-chevron svg,
  .is-mobile-accordion
    > .ktgemx-gmx-media-detail:not(.is-accordion-open)
    .kt-acc-chevron
    svg,
  .is-mobile-accordion
    > .ktgemx-gmx-media-wide:not(.is-accordion-open)
    .kt-acc-chevron
    svg {
    animation: kt-acc-chevron-breathe 2.8s ease-in-out infinite;
  }

  /*
    Exhibit B + C — direction from open panel position (JS sets face classes).
    Left of open → › ; right of open → ‹
  */
  .is-mobile-accordion .is-acc-face-right .kt-acc-chevron svg {
    transform: rotate(0deg);
  }

  .is-mobile-accordion .is-acc-face-left .kt-acc-chevron svg {
    transform: rotate(180deg);
  }

  /* Fully open — never show chevron */
  .is-mobile-accordion > figure.is-accordion-open .kt-acc-chevron,
  .is-mobile-accordion
    > .ktgemx-gmx-media-detail.is-accordion-open
    .kt-acc-chevron,
  .is-mobile-accordion
    > .ktgemx-gmx-media-wide.is-accordion-open
    .kt-acc-chevron {
    opacity: 0;
    visibility: hidden;
  }

  .is-mobile-accordion > figure.is-accordion-open .kt-acc-chevron svg,
  .is-mobile-accordion
    > .ktgemx-gmx-media-detail.is-accordion-open
    .kt-acc-chevron
    svg,
  .is-mobile-accordion
    > .ktgemx-gmx-media-wide.is-accordion-open
    .kt-acc-chevron
    svg {
    animation: none;
  }

  @media (prefers-reduced-motion: reduce) {
    .is-mobile-accordion .kt-acc-chevron svg {
      animation: none !important;
      transition: none;
    }
  }
}