/* Mobile refinements. The desktop composition keeps its existing rules. */
@media (max-width: 991px) {
  :root {
    --type-section-title: clamp(2.125rem, 9.2vw, 2.75rem);
    --type-section-label: 0.8125rem;
    --type-body-copy: 1rem;
    --type-secondary-copy: 0.875rem;
    --space-label-title: 12px;
    --space-title-copy: 16px;
    --space-content-group: 24px;
    --space-heading-content: 32px;
  }

  .mobile-navigation__panel {
    max-height: calc(100svh - var(--admin-bar-offset, 0px) - 120px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
    overflow-y: auto;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
  }

  .objectives__heading h2,
  .consultation__intro h2,
  .results__intro h2,
  .reviews__heading h2,
  .instagram-showcase__heading h2,
  .about__heading h2,
  .office__copy h2,
  .faq__intro h2 {
    max-width: 100%;
    margin-block: 0;
    font-size: var(--type-section-title);
    font-weight: var(--heading-weight);
    letter-spacing: -0.035em;
    line-height: 1.08;
  }

  .instagram-showcase__heading h2 strong {
    font-weight: inherit;
  }

  .hero h1,
  .site-footer__cta h2 {
    font-weight: var(--heading-weight);
  }

  .objectives__content h3,
  .site-footer h2 {
    letter-spacing: -0.035em;
    line-height: 1.08;
  }

  .objectives__eyebrow,
  .consultation__intro .eyebrow,
  .results__intro .results__eyebrow,
  .reviews__eyebrow,
  .instagram-showcase__eyebrow,
  .about__heading .eyebrow,
  .office__copy .eyebrow,
  .faq__intro .eyebrow,
  .site-footer__eyebrow {
    margin-bottom: var(--space-label-title);
    font-size: var(--type-section-label);
    font-weight: var(--weight-label);
    letter-spacing: 0.13em;
    line-height: 1.2;
  }

  .objectives__heading p:last-child,
  .consultation__intro > p:last-child,
  .results__subtitle,
  .reviews__support-text,
  .about__bio,
  .about-credential ul,
  .office__lead,
  .office__support,
  .office__differentials li,
  .faq__description,
  .consultation__panel p,
  .faq-item__panel p,
  .site-footer__brand p,
  .site-footer__cta-description,
  .site-footer__availability {
    font-size: var(--type-body-copy);
    line-height: 1.55;
  }

  .objectives__heading p:last-child,
  .consultation__intro > p:last-child,
  .office__lead,
  .faq__description,
  .results__subtitle-before {
    margin-top: var(--space-title-copy);
    margin-bottom: 0;
  }

  .objectives__heading,
  .reviews__heading,
  .instagram-showcase__heading {
    margin-bottom: var(--space-heading-content);
  }

  .reviews__heading {
    gap: var(--space-title-copy);
  }

  .consultation__layout {
    gap: var(--space-heading-content);
  }

  .objectives__tabs-scroll,
  .objectives__content .objectives__benefits {
    margin-bottom: var(--space-content-group);
  }

  .objectives__panel-kicker {
    font-size: var(--type-section-label);
    font-weight: var(--weight-label);
    line-height: 1.2;
  }

  .objectives__cta:focus-visible {
    outline: 2px solid var(--color-brand-olive);
    outline-offset: 4px;
  }

  .consultation__cta {
    margin-top: var(--space-content-group);
  }

  .consultation__trigger,
  .faq-item button {
    font-size: var(--type-body-copy);
    line-height: 1.4;
  }

  .consultation__panel p {
    padding-bottom: var(--space-content-group);
  }

  .faq__layout,
  .office__layout {
    gap: var(--space-heading-content);
  }

  .about__primary-grid {
    gap: var(--space-content-group);
  }

  .office__details {
    gap: var(--space-content-group);
  }

  .site-footer {
    padding-top: var(--section-edge-space, 48px);
    padding-bottom: max(var(--section-edge-space, 48px), calc(env(safe-area-inset-bottom, 0px) + 12px));
  }

  .site-footer__main {
    gap: var(--space-heading-content);
  }

  .site-footer__contact-list a,
  .site-footer__navigation a {
    font-size: var(--type-body-copy);
  }

  .site-footer__closing p {
    font-size: 0.8125rem;
  }

  .reviews__heading,
  .reviews__layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .reviews-summary {
    min-height: 286px;
    padding: 24px;
  }

  .reviews-summary__score-layout {
    grid-template-columns: max-content minmax(0, 1fr);
    align-items: center;
    gap: 12px;
  }

  .reviews-summary__rating {
    gap: 10px;
    white-space: nowrap;
  }

  .reviews-summary__rating strong {
    font-size: clamp(2.1rem, 10.5vw, 2.8rem);
  }

  .reviews-summary__rating span {
    font-size: clamp(0.95rem, 4.1vw, 1.1rem);
  }

  .reviews-summary .reviews-stars {
    font-size: clamp(1.65rem, 8.2vw, 2.5rem);
    letter-spacing: 0.01em;
  }

  .reviews-summary__label {
    font-size: 0.8125rem;
    letter-spacing: 0.08em;
  }

  .reviews-summary__count {
    font-size: clamp(0.84rem, 3.7vw, 0.95rem);
    letter-spacing: normal;
  }

  .reviews__content {
    min-height: 0;
    padding: 20px 16px;
  }

  .reviews-slider__header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
  }

  .reviews-slider__header h3 {
    max-width: none;
    font-size: 1.1875rem;
    line-height: 1.2;
  }

  .reviews-slider__viewport {
    margin-right: 0;
  }

  .reviews-slider__viewport::after {
    content: none;
  }

  .reviews-slider__track {
    grid-auto-columns: 100%;
    align-items: start;
    gap: 12px;
    padding: 4px 0 0;
  }

  .review-card {
    height: auto;
    min-height: 20rem;
  }

  .review-card.is-active,
  .review-card:hover {
    transform: none;
  }

  .review-card.is-expanded {
    height: auto;
    min-height: 20rem;
  }

  .review-card blockquote {
    flex: 0 0 auto;
    font-size: 1rem;
    line-height: 1.45;
  }

  .review-card__read-more {
    min-height: 44px;
    padding: 8px 0;
    font-size: 0.875rem;
  }

  .results__control {
    width: 48px;
    height: 48px;
  }

  .office-gallery__arrow {
    /* The 4:3 photo ends before the caption; half its height is 37.5% of its width. */
    top: 0;
    margin-top: 37.5%;
  }

  .office-gallery__track {
    -webkit-overflow-scrolling: touch;
  }

  .location-card {
    gap: 20px;
    padding: 20px;
  }

  .location-card__map {
    width: 100%;
    min-height: 180px;
  }

  .site-footer__back-to-top {
    min-height: 48px;
  }

  main > section:not(.hero):not(.consultation):not(.about) :focus-visible {
    outline-color: var(--color-brand-olive);
  }
}

@media (max-width: 767px) {
  .hero__content {
    container-type: inline-size;
  }

  .hero h1 {
    font-size: clamp(1.2rem, calc((100vw - var(--gutter) * 2) * 0.078), 2.25rem);
  }

  @supports (font-size: 1cqi) {
    .hero h1 {
      font-size: clamp(1.2rem, 8.2cqi, 2.25rem);
    }
  }

  .hero__eyebrow {
    font-size: clamp(0.6875rem, 3vw, 0.8125rem);
    letter-spacing: 0.12em;
  }

  .hero__subtitle {
    font-size: 1rem;
    line-height: 1.55;
  }

  .hero__actions--mobile .button {
    min-height: 50px;
    font-size: 0.875rem;
    padding-inline: 8px;
  }

  .objectives__tabs {
    gap: 4px;
    padding: 0;
  }

  .objectives__tabs .objectives__tab {
    flex-direction: column;
    gap: 8px;
    padding: 8px 0;
  }

  .objectives__tabs .objectives__tab-label {
    font-size: 0.78rem;
    line-height: 1.25;
  }

  .objectives__content {
    padding: 24px 20px;
  }

  .objectives__description,
  .objectives__benefits li,
  .consultation__intro > p:last-child,
  .results__intro > p:last-child,
  .reviews__support-text,
  .office__lead,
  .faq__intro > p:last-child,
  .faq-item__panel p {
    font-size: 1rem;
    line-height: 1.55;
  }

  .objectives__cta {
    gap: 8px;
    padding-inline: 12px;
  }

  .objectives__cta > span:first-child {
    font-size: clamp(0.78rem, 3.4vw, 1rem);
  }

  .objectives__cta-arrow {
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
  }

  .consultation__trigger {
    grid-template-columns: 40px minmax(0, 1fr) 32px;
    gap: 12px;
    font-size: var(--type-body-copy);
  }

  .consultation__item-icon {
    width: 40px;
    height: 40px;
  }

  .consultation__trigger-action {
    width: 32px;
    height: 40px;
  }

  .consultation__panel p {
    padding-left: 0;
  }

  .consultation__cta {
    min-height: 50px;
    padding-inline: 12px;
    font-size: 0.9375rem;
  }

  .reviews-slider__controls {
    align-self: start;
    justify-self: end;
  }

  .instagram-profile__identity {
    gap: 12px;
  }

  .instagram-profile__photo {
    width: 60px;
    height: 60px;
  }

  .instagram-profile__copy strong {
    font-size: clamp(1rem, 4.2vw, 1.125rem);
  }

  .button.instagram-profile__cta {
    gap: 8px;
    padding-inline: 12px;
    font-size: 0.9375rem;
  }

  .about-sport figcaption {
    font-size: 0.9375rem;
  }

  .faq-item__panel p {
    padding-right: 20px;
  }

  .office__privacy {
    font-size: var(--type-secondary-copy);
  }
}

@media (max-width: 359px) {
  .hero__actions--mobile {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .objectives__tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .objectives__tabs .objectives__tab-label {
    font-size: 0.875rem;
  }

  .objectives__content {
    padding-inline: 16px;
  }

  .objectives__cta {
    gap: 6px;
  }

  .objectives__cta-arrow {
    flex-basis: 18px;
    width: 18px;
    height: 18px;
  }

  .reviews-summary {
    padding-inline: 20px;
  }

  .reviews-summary__score-layout {
    gap: 10px;
  }

  .consultation__panel p {
    padding-left: 0;
  }
}

@media (max-width: 991px) and (orientation: landscape) and (max-height: 500px) {
  .site-header__inner,
  .site-header.is-scrolled .site-header__inner {
    min-height: 64px;
    padding-block: 8px;
  }

  .site-brand__image,
  .site-header.is-scrolled .site-brand__image {
    width: 128px;
  }

  .mobile-navigation__panel {
    max-height: calc(100svh - var(--admin-bar-offset, 0px) - 88px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
  }

  .objectives__panel {
    height: auto;
    grid-template-columns: minmax(0, 1fr);
  }

  .objectives__media {
    aspect-ratio: 16 / 10;
  }

  .instagram-profile {
    grid-template-columns: minmax(0, 1fr);
    padding-right: 0;
    padding-block: 0;
    border: 0;
  }

  .instagram-showcase__heading {
    grid-template-columns: minmax(0, 1fr);
  }

  .button.instagram-profile__cta {
    grid-column: 1;
    grid-row: 4;
    width: 100%;
    min-width: 0;
    justify-self: stretch;
    justify-content: center;
    margin-top: calc(3 * var(--instagram-gap));
  }

  .instagram-profile__arrow {
    display: none;
  }

  .instagram-gallery {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: calc(3 * var(--instagram-gap));
  }

  .instagram-gallery__item:nth-child(n+7) {
    display: block;
  }

  .instagram-gallery__item figure,
  .instagram-gallery__item:nth-child(n+10) figure {
    -webkit-mask-image: none;
    mask-image: none;
  }

  .location-card {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "heading" "address" "map" "actions";
    grid-template-rows: auto;
  }

  .location-card__map {
    min-height: 180px;
    aspect-ratio: 16 / 10;
  }

  .faq__media {
    width: min(100%, 480px);
    justify-self: center;
    aspect-ratio: 4 / 3;
  }
}

@media (max-width: 991px) and (hover: none) {
  a,
  button {
    -webkit-tap-highlight-color: transparent;
  }

  .button:hover,
  .review-card:hover,
  .about__gallery-track .about-media:hover {
    transform: none;
  }

  .hero .hero__actions--mobile .button--brand:not(.is-touch-feedback):hover {
    background: var(--color-brand-lime);
  }

  .hero .hero__actions--mobile .button--outline:not(.is-touch-feedback):hover {
    border-color: var(--color-brand-lime);
    background: transparent;
    color: var(--color-white-warm);
  }

  .button.instagram-profile__cta:hover {
    background: var(--color-brand-lime);
    color: var(--color-brand-olive-dark);
  }
}

/* A wide or short window needs a top-anchored photo, not the tall-phone zoom.
   Preserve the approved tall-phone composition below 480px and desktop >=992px. */
@media (min-width: 480px) and (max-width: 991px),
       (max-width: 479px) and (max-height: 650px) {
  .hero { min-height: 0; display: block; padding-bottom: 40px; }
  .hero__visual { height: clamp(360px, 50vw, 500px); }
  .hero__photo-frame {
    top: calc(104px + var(--admin-bar-offset, 0px));
    right: calc(-1 * var(--gutter));
    left: calc(-1 * var(--gutter));
    height: clamp(420px, 68vw, 640px);
    overflow: hidden;
  }
  .hero__photo-frame::after { display: none; }
  .hero__photo-picture {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    transform: none;
  }
  .hero__photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 15%;
    transform: scaleX(-1);
    transform-origin: center;
  }
  .hero__scrim { display: none; }
  .hero__fallback img,
  .hero__video {
    height: 100%;
    object-position: 30% top;
    transform: translateX(clamp(48px, 8vw, 80px)) scale(.96);
    transform-origin: center top;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 25%);
    mask-image: linear-gradient(90deg, transparent, #000 25%);
  }
  .hero__content { padding-top: 40px; container-type: inline-size; }
  .hero__content::before {
    position: absolute;
    z-index: -1;
    inset: -120px calc(-1 * var(--gutter)) -80px;
    background: linear-gradient(180deg, rgba(7, 19, 12, 0) 0%, rgba(7, 19, 12, .18) 12%, rgba(7, 19, 12, .76) 30%, rgba(7, 19, 12, .94) 48%, var(--color-deep-green) 70%);
    content: "";
    pointer-events: none;
  }
  .hero h1 { max-width: 100%; font-size: clamp(2.25rem, 4.9vw, 3rem); font-size: min(clamp(2.25rem, 4.9vw, 3rem), 8.2cqi); }
  .hero__eyebrow { font-size: .8125rem; }
  .hero__subtitle { max-width: 55ch; font-size: 1rem; line-height: 1.55; }
}
