/* Trial refinement, 2026-09-07. Keep original assets, copy, pricing and interactions. */
:root {
  --visual-surface: #f2f5f8;
  --visual-border: #d7e0e8;
  --visual-muted: #52677a;
  --visual-art-tone: grayscale(1) sepia(.65) hue-rotate(165deg) saturate(1.4);
  --visual-photo-wash: linear-gradient(90deg, rgba(244,247,250,.97), rgba(244,247,250,.9) 42%, rgba(244,247,250,.4) 72%, rgba(244,247,250,.13));
}

/* Lead with concrete work. The years of experience support, rather than dominate, it. */
.about-profile-layout {
  grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr);
  align-items: stretch;
  gap: 28px 0;
}
.about-practice-summary {
  min-width: 0;
  padding: 26px clamp(22px, 2.2vw, 30px);
  border: 1px solid var(--visual-border);
  border-right: 0;
  background: #fff;
}
.about-practice-summary h2 {
  margin: 0;
  color: var(--navy);
  font-size: clamp(24px, 2.05vw, 28px);
  line-height: 1.55;
  letter-spacing: -.025em;
  word-break: normal;
  overflow-wrap: anywhere;
}
.about-practice-summary > p:not(.section-kicker) {
  margin: 14px 0 18px;
  color: var(--visual-muted);
  font-size: 16px;
  line-height: 1.85;
}
.about-practice-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 24px;
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--visual-border);
}
.about-practice-list li {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 11px 0;
  border-bottom: 1px solid var(--visual-border);
  color: var(--navy);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.7;
}
.about-practice-list li::before {
  content: "";
  width: 5px;
  height: 5px;
  flex: 0 0 5px;
  align-self: center;
  border-radius: 50%;
  background: #6c8398;
}
.about-profile-layout > .about-credentials-panel {
  min-width: 0;
  min-height: 0 !important;
  height: auto;
  align-self: stretch;
  justify-content: flex-start;
  padding: 26px clamp(22px, 2.2vw, 30px);
  border: 1px solid var(--visual-border);
  background: #f6f8fa;
  box-shadow: none;
}
.about-practice-summary > .section-kicker,
.about-credentials-panel > .section-kicker {
  margin: 0 0 12px;
  color: var(--visual-muted);
  font-size: 12px;
  line-height: 1.6;
  letter-spacing: .08em;
}
.about-credentials-panel > strong {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 12px;
  font-size: 18px;
  line-height: 1.55;
}
.about-credentials-panel > strong b {
  margin: 0;
  font-size: 28px;
  line-height: 1.55;
  font-weight: 600;
}
.about-credentials-panel ul {
  gap: 0;
  margin-top: auto;
  padding-top: 0;
}
.about-credentials-panel li {
  padding: 11px 0;
  border-bottom: 1px solid var(--visual-border);
  font-size: 16px;
  line-height: 1.7;
}
.about-profile-layout > .about-profile-copy {
  grid-column: 1 / -1;
  min-width: 0;
  padding-top: 24px;
  border-top: 1px solid var(--visual-border);
}
.about-profile-copy > .section-kicker { margin-bottom: 10px; }
.about-profile-copy > p:not(.section-kicker) {
  font-size: 16px;
  line-height: 1.85;
}

/* A shared cool-neutral photographic wash; text and the logo are not filtered. */
.services-photo-hero, .about-photo-hero {
  background-image: var(--visual-photo-wash), url("./assets/hero-services-distinct-20261002.png");
}
.guide-hero {
  background-image: var(--visual-photo-wash), url("./assets/hero-guide-distinct-20261002.png");
}
.information-hero {
  background-image: var(--visual-photo-wash), url("./assets/hero-information-distinct-20261002.png");
}
.salon-support-hero, .contact-form-hero {
  background-image: var(--visual-photo-wash), url("./assets/hero-salon-distinct-20261002.png");
}
.hero.hero-slider .hero-slide {
  filter: saturate(.88) contrast(1.08);
}
.difference-photo img {
  filter: saturate(.72) contrast(1.04);
}

/* Retain real transparency. Do not recolour canvases using blend modes. */
main img.transparent-art,
.service-detail-heading img.service-detail-art-clean,
.about-value-art img,
.service-flow-art img,
.guide-route-grid figure img {
  filter: var(--visual-art-tone) !important;
  mix-blend-mode: normal !important;
  background-color: transparent !important;
}

/* Centre the experience heading in the space above its supporting list. */
@media (min-width: 1025px) {
  .about-profile-layout > .about-credentials-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(18px, 1fr) auto auto minmax(18px, 1fr) auto;
    justify-content: stretch;
  }
  .about-credentials-panel > .section-kicker { grid-row: 2; }
  .about-credentials-panel > strong { grid-row: 3; }
  .about-credentials-panel > ul { grid-row: 5; margin-top: 0; }
}

@media (max-width: 1024px) {
  .about-profile-layout { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .about-practice-summary {
    padding: 22px;
    border-right: 1px solid var(--visual-border);
    border-bottom: 0;
  }
  .about-profile-layout > .about-credentials-panel { padding: 22px; }
  .about-credentials-panel > strong b { font-size: 25px; }
  .about-credentials-panel ul { margin-top: 16px; padding-top: 0; }
  .about-profile-layout > .about-profile-copy { margin-top: 24px; padding-top: 22px; }
}
@media (max-width: 520px) {
  .about-practice-summary,
  .about-profile-layout > .about-credentials-panel { padding: 20px 18px; }
  .about-practice-list { grid-template-columns: minmax(0, 1fr); }
  .about-practice-list li,
  .about-credentials-panel li { padding: 8px 0; }
  .about-credentials-panel > strong { font-size: 16px; }
  .about-credentials-panel > strong b { font-size: 24px; }
}

/* Match photo-hero height to each page's opening copy on desktop. */
@media (min-width: 821px) {
  .about-photo-hero,
  .information-hero { min-height: 380px; }

  .services-overview-hero,
  .salon-support-hero { min-height: 410px; }
}
