/* Layout follows the two wireframes in the brief: text/photo; central result with devices around it. */
.is-front .editorial-section { padding-block: clamp(3rem,6vw,6rem); }
.is-front #clinic-story > .editorial-split { grid-template-columns: 1fr 1fr; gap: clamp(2rem,6vw,5rem); min-height: min(740px,85svh); }
.is-front .editorial-founder img { max-height: 650px; aspect-ratio: 4/5; }
.is-front .editorial-founder { position: relative; }
.is-front .editorial-founder figcaption { border-top: 1px solid var(--border); margin-top: 1rem; }
.is-front .editorial-story h2 { max-width: 17ch; font-size: clamp(2.1rem,3.6vw,3.65rem); }
.is-front #results { background: #e8e5df; overflow: hidden; }
.is-front #results .editorial-heading { display: block; text-align: center; margin-bottom: 2.5rem; }
.is-front #results .editorial-heading h2 { max-width: none; font-size: clamp(2rem,4.7vw,4.5rem); }
.tz-results-stage { position: relative; display: grid; grid-template-columns: 22% minmax(0,1fr) 22%; grid-template-rows: minmax(0,1fr) auto auto; gap: 1rem 1.5rem; align-items: center; height: min(680px,74vh); min-height: 580px; }
.tz-results-stage > .editorial-results-grid { grid-column: 2; grid-row: 1; display: grid; grid-template-columns: 1fr; width: 100%; position: relative; z-index: 2; align-self: center; }
.tz-results-stage .editorial-result { grid-column: 1; grid-row: 1; width: 100%; background: #e8e5df; transition: opacity .8s ease, transform 1s cubic-bezier(.2,.7,.2,1); }
.tz-results-stage .editorial-result[aria-hidden=true] { opacity: 0; transform: translateX(22px); pointer-events: none; visibility: hidden; }
.tz-results-stage .editorial-results-grid:not(.tz-gallery-ready) .editorial-result { grid-row: auto; }
.tz-results-stage .editorial-result img { border-radius: 4px; }
.tz-results-stage .editorial-result-collage img { max-height: min(420px,46vh); object-fit: contain; }
.tz-results-stage > .small { grid-column: 2; text-align: center; font-size: .72rem; margin-top: -.5rem; }
.tz-results-stage .editorial-devices-heading { grid-column: 2; margin: 0; display: block; text-align: center; }
.tz-results-stage .editorial-devices-heading h3 { font-size: 1.25rem; margin-bottom: .4rem; }
.is-front .tz-results-stage .device-mosaic { position: absolute; inset: 0; display: grid; grid-template-columns: 22% 1fr 22%; grid-template-rows: repeat(3,1fr); gap: 1.5rem; pointer-events: none; }
.is-front .tz-results-stage .device-mosaic .device-tile:nth-child(n) { pointer-events: auto; grid-column: 1; grid-row: auto; width: 100%; height: 100%; aspect-ratio: auto; min-height: 0; border-radius: 5px; }
.is-front .tz-results-stage .device-mosaic .device-tile:nth-child(2n) { grid-column: 3; }
.is-front .tz-results-stage .device-mosaic .device-tile:nth-child(1),
.is-front .tz-results-stage .device-mosaic .device-tile:nth-child(2) { grid-row: 1; }
.is-front .tz-results-stage .device-mosaic .device-tile:nth-child(3),
.is-front .tz-results-stage .device-mosaic .device-tile:nth-child(4) { grid-row: 2; }
.is-front .tz-results-stage .device-mosaic .device-tile:nth-child(5),
.is-front .tz-results-stage .device-mosaic .device-tile:nth-child(6) { grid-row: 3; }
.tz-result-controls { display: flex; gap: .5rem; justify-content: center; padding-top: 1.2rem; grid-column: 1; grid-row: 2; }
.tz-result-controls button { min-width: 42px; min-height: 42px; border: 1px solid #a39c8e; border-radius: 50%; background: transparent; color: #29251f; cursor: pointer; }
.tz-result-controls button[aria-pressed=true] { background: #29251f; color: white; }
.tz-rail-controls { display: flex; justify-content: flex-end; gap: .5rem; margin: -1rem 0 1.5rem; }
.tz-rail-controls button { min-width: 44px; height: 44px; border: 1px solid currentColor; border-radius: 30px; padding-inline: 1rem; background: transparent; color: inherit; cursor: pointer; font: inherit; font-size: .8rem; }
.tz-rail-controls button:hover { background: #8882; }
.is-front .editorial-review-list { grid-auto-columns: minmax(210px, 22%); gap: 1.15rem; scroll-snap-type: none; scroll-behavior: auto; }
.is-front .editorial-review-open { border-radius: 28px; aspect-ratio: 9 / 16; }
.is-front .editorial-doctor-grid { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 3rem)/3); grid-template-columns: none; overflow-x: auto; gap: 1.5rem; padding-bottom: 1.5rem; scroll-behavior: auto; }
.is-front .editorial-doctor-photo { border-radius: 5px; }
.editorial-doctor-photo img, .doctor-profile-photo img, .device-thumb img { transition: transform 750ms cubic-bezier(.2,.7,.2,1); }
.editorial-doctor-photo:hover img, .doctor-profile-photo:hover img, .device-row:hover .device-thumb img { transform: scale(1.035); }
.tz-reveal { opacity: 1; transform: none; }
.tz-motion .tz-reveal { animation: tz-arrive 850ms cubic-bezier(.2,.7,.2,1) both; }
@keyframes tz-arrive { from { opacity: 0; transform: translateY(32px); } to { opacity: 1; transform: none; } }
.editorial-dialog[open] { animation: tz-dialog 350ms cubic-bezier(.2,.7,.2,1) both; }
@keyframes tz-dialog { from { opacity: 0; transform: translateY(24px) scale(.98); } to { opacity: 1; transform: none; } }
@media(max-width: 820px) {
  .is-front #clinic-story > .editorial-split { grid-template-columns: 1fr; min-height: 0; }
  .is-front .editorial-founder { width: min(100%,480px); margin-inline: auto; }
  .tz-results-stage { grid-template-columns: 16% minmax(0,1fr) 16%; gap: .7rem; min-height: 470px; }
  .is-front .tz-results-stage .device-mosaic { grid-template-columns: 16% 1fr 16%; gap: .7rem; }
  .is-front .tz-results-stage .device-mosaic .device-tile { font-size: .7rem; }
  .is-front .editorial-doctor-grid { grid-auto-columns: 70%; }
}
@media(max-width: 540px) {
  .tz-results-stage { display: flex; flex-direction: column; height: auto; min-height: 0; gap: 1.2rem; }
  .tz-results-stage > .editorial-results-grid { width: 100%; }
  .is-front .tz-results-stage .device-mosaic { position: static; width: 100%; grid-template-columns: repeat(3,minmax(0,1fr)); grid-template-rows: none; gap: .6rem; }
  .is-front .tz-results-stage .device-mosaic .device-tile:nth-child(n) { grid-column: auto; grid-row: auto; aspect-ratio: 3/4; height: auto; }
  .is-front .tz-results-stage .device-mosaic .device-tile span { font-size: .7rem; }
  .is-front .editorial-doctor-grid { grid-auto-columns: 86%; }
  .is-front .editorial-review-list { grid-auto-columns: 76%; }
}
@media(prefers-reduced-motion: reduce) {
  .tz-motion .tz-reveal, .editorial-dialog[open] { animation: none; }
  .tz-results-stage .editorial-result, .editorial-doctor-photo img, .doctor-profile-photo img, .device-thumb img { transition: none; }
}

/* A quiet, draggable line beneath the cards; the hit area remains comfortable. */
.is-front .tz-custom-scroll { scrollbar-width: none; }
.is-front .tz-custom-scroll::-webkit-scrollbar { display: none; }
.tz-scroll-line {
  --scroll-thumb: 80px;
  display: block;
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  height: 32px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  color: inherit;
  cursor: grab;
  accent-color: currentColor;
}
.tz-scroll-line[hidden] { display: none; }
.tz-scroll-line:active { cursor: grabbing; }
.tz-scroll-line::-webkit-slider-runnable-track {
  height: 2px;
  border-radius: 2px;
  background: color-mix(in srgb, currentColor 16%, transparent);
}
.tz-scroll-line::-webkit-slider-thumb {
  appearance: none;
  -webkit-appearance: none;
  width: var(--scroll-thumb);
  height: 4px;
  margin-top: -1px;
  border: 0;
  border-radius: 4px;
  background: currentColor;
  transition: height .2s, margin-top .2s;
}
.tz-scroll-line::-moz-range-track { height: 2px; background: color-mix(in srgb, currentColor 16%, transparent); }
.tz-scroll-line::-moz-range-thumb { width: var(--scroll-thumb); height: 4px; border: 0; border-radius: 4px; background: currentColor; }
.tz-scroll-line:hover::-webkit-slider-thumb { height: 6px; margin-top: -2px; }
.tz-scroll-line:focus-visible { outline: 1px solid currentColor; outline-offset: 3px; border-radius: 3px; }

.tz-rail-footer { display: flex; align-items: center; gap: 24px; }
.tz-rail-footer .tz-scroll-line { flex: 1; min-width: 0; }
.tz-rail-footer .tz-rail-controls { flex: 0 0 auto; margin: 0; }
.tz-rail-footer [data-rail-prev], .tz-rail-footer [data-rail-next] { display: none; }
.tz-rail-footer .tz-rail-controls [data-rail-toggle] { height: 36px; min-width: 0; padding: 0 2px; border: 0; border-radius: 0; font-size: 12px; opacity: .65; }
.tz-rail-footer .tz-rail-controls [data-rail-toggle]:hover { opacity: 1; background: transparent; }

/* Results and equipment are independent sections. */
.is-front .tz-results-stage { display: block; height: auto; min-height: 0; max-width: 580px; margin-inline: auto; }
.is-front .tz-results-stage > .editorial-results-grid { display: grid; width: 100%; }
.is-front .tz-results-stage > .small { margin: 1.5rem 0 0; }
.is-front .editorial-compare { width: min(100%, 420px); margin-inline: auto; border-radius: 5px; }
.is-front .editorial-compare-album { aspect-ratio: 720/1336; max-height: 65svh; width: auto; }
.compare-photo { position: absolute; inset: 0; background-image: var(--pair-image); background-size: 200% 100%; background-repeat: no-repeat; }
.compare-photo-after { background-position: right center; }
.compare-photo-before { background-position: left center; clip-path: inset(0 calc(100% - var(--comparison)) 0 0); }
.editorial-compare [data-compare-range] { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; z-index: 4; cursor: ew-resize; touch-action: pan-y; }
.compare-handle { position: absolute; left: var(--comparison); top: 50%; transform: translate(-50%, -50%); width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid #fff; border-radius: 50%; background: #fff; color: #29251f; font-size: 23px; box-shadow: 0 2px 16px #0002; z-index: 3; pointer-events: none; }
.editorial-compare:focus-within { outline: 2px solid #76664a; outline-offset: 4px; }
.is-front .editorial-result figcaption { text-align: center; margin-top: 1rem; }
.is-front .editorial-result .editorial-range-label { display: none; }
.is-front #apparatus .device-mosaic { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.is-front #apparatus .device-tile:nth-child(n) { grid-column: auto; grid-row: auto; width: 100%; height: auto; min-height: 0; aspect-ratio: 4/3; border-radius: 5px; }
.is-front #apparatus .editorial-devices-heading { align-items: end; }
@media(max-width: 540px) {
  .is-front #apparatus .device-mosaic { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .is-front #apparatus .device-tile:nth-child(n) { aspect-ratio: 3/4; }
}
.compare-photo { overflow: hidden; }
.is-front .editorial-compare .compare-photo img { width: 200%; max-width: none; height: 100%; object-fit: fill; border-radius: 0; }
.is-front .editorial-compare .compare-photo-after img { left: -100%; }

 .tz-result-navigation { grid-column: 1; grid-row: 2; display: flex; align-items: center; justify-content: center; gap: 24px; padding-top: 20px; }
.tz-result-navigation span { font-size: 12px; letter-spacing: .12em; font-variant-numeric: tabular-nums; }
.tz-result-navigation button { width: 44px; height: 44px; padding: 0; border: 0; border-radius: 0; background: transparent; color: inherit; font-size: 22px; cursor: pointer; transition: opacity .2s; }
.tz-result-navigation button:hover { opacity: .5; }
.is-front .editorial-compare .compare-handle { left: clamp(24px, var(--comparison), calc(100% - 24px)); }

/* Quiet title integrated into the lower edge of the opening film. */
.is-front .editorial-hero {
  min-height: calc(100svh - var(--site-chrome-h, var(--chrome)));
  padding: 0 0 clamp(28px, 5vh, 64px);
  align-items: flex-end;
  background: linear-gradient(180deg, transparent 40%, rgba(12,12,10,.12) 65%, rgba(12,12,10,.65) 100%);
}
.is-front .editorial-hero-inner { width: 100%; }
.is-front .editorial-hero h1 {
  max-width: none;
  margin: 0;
  color: rgba(255,253,247,.82);
  font-size: clamp(30px, 4.7vw, 76px);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -.025em;
  text-align: center;
  text-shadow: 0 2px 24px rgba(0,0,0,.2);
  animation: hero-copy-in 1.2s ease both;
}
@media(max-width:540px) {
  .is-front .editorial-hero { padding-bottom: max(36px, env(safe-area-inset-bottom)); }
  .is-front .editorial-hero h1 { font-size: clamp(28px, 7.5vw, 40px); line-height: 1.14; }
}
@media(max-width:820px) {
  /* Below this width .sticky-cta is a fixed bar pinned to the viewport
     bottom; the hero text is bottom-anchored too, so it needs enough
     clearance not to sit behind the button. */
  .is-front .editorial-hero { padding-bottom: calc(96px + env(safe-area-inset-bottom)); }
}
@media(prefers-reduced-motion:reduce) { .is-front .editorial-hero h1 { animation: none; } }

.is-front .editorial-hero h1 {
  font-family: var(--font-body, Arial, sans-serif);
  font-size: clamp(25px, 3.6vw, 58px);
  font-weight: 300;
  line-height: 1.2;
  letter-spacing: .045em;
  text-transform: uppercase;
  color: rgba(255,253,247,.8);
}
@media(max-width:540px) {
  .is-front .editorial-hero h1 { font-size: clamp(21px, 5.7vw, 30px); letter-spacing: .025em; line-height: 1.3; }
}