/* Bath & Barks: a shared grid and a consistent visual rhythm. */
:root {
  --ink:#2d2230; --plum:#6f5078; --plum-deep:#5c4165;
  --lavender:#e8ddea; --lavender-pale:#f5f0f6; --paper:#fbfafb; --paper-2:#f3eff4;
  --white:#fff; --muted:#6f6771; --line:rgba(45,34,48,.13); --line-light:rgba(255,255,255,.22);
  --font:"Manrope","Helvetica Neue",Arial,sans-serif;
  --content:1200px; --gutter:40px; --gap:24px; --section-space:88px;
  --radius:20px; --radius-small:12px; --photo-ratio:5/4; --heading:clamp(2rem,3.6vw,2.875rem);
  --ease:cubic-bezier(.16,1,.3,1);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:112px; }
body { margin:0; color:var(--ink); background:var(--paper); font:16px/1.65 var(--font); -webkit-font-smoothing:antialiased; }
body.menu-open { overflow:hidden; }
img { display:block; max-width:100%; height:auto; }
a { color:inherit; text-decoration:none; }
button,input,select { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; color:inherit; }
button,input,select,a { touch-action:manipulation; }
[hidden] { display:none!important; }
:focus-visible { outline:3px solid var(--plum); outline-offset:5px; }
.booking :focus-visible,.footer :focus-visible { outline-color:var(--lavender); }
.booking-form :focus-visible { outline-color:var(--plum); }
[id] { scroll-margin-top:112px; }
h1,h2,h3,p,figure { margin:0; }
h1,h2,h3 { font-weight:600; text-wrap:balance; }
h1 { max-width:14ch; font-size:clamp(2.75rem,4.9vw,4rem); line-height:1.1; letter-spacing:-.045em; }
h2 { max-width:23ch; font-size:var(--heading); line-height:1.16; letter-spacing:-.035em; }
h3 { font-size:1.5rem; line-height:1.3; letter-spacing:-.025em; }
h1 em,h2 em { color:var(--plum); font:inherit; }
h1 em { display:block; }
p { overflow-wrap:break-word; }
.section-shell,.nav-shell { width:min(var(--content),calc(100% - var(--gutter)*2)); margin-inline:auto; }
.section-pad { padding-block:var(--section-space); }
.section-heading { margin-bottom:36px; }
.eyebrow,.coverage-label,.service-kicker { margin-bottom:12px; color:var(--plum); font-size:.8125rem; line-height:1.5; letter-spacing:.08em; font-weight:700; text-transform:uppercase; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; z-index:1000; top:-80px; left:16px; padding:12px 20px; border-radius:12px; background:white; }
.skip-link:focus { top:12px; }
.scroll-progress { position:fixed; z-index:500; inset:0 0 auto; height:2px; pointer-events:none; }
.scroll-progress span { display:block; height:100%; background:var(--plum); transform:scaleX(0); transform-origin:left; }

/* Stable navigation, aligned with the page content. */
.site-header { position:sticky; z-index:200; top:0; background:var(--paper); border-bottom:1px solid var(--line); }
.nav-shell { min-height:96px; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:32px; }
.brand { display:inline-flex; align-items:center; }
.brand img { width:154px; height:81px; object-fit:contain; }
.nav-links { display:flex; justify-content:center; flex-wrap:wrap; gap:28px; }
.nav-links a { padding:12px 0; font-size:.875rem; font-weight:600; border-bottom:1px solid transparent; }
.nav-links a:hover,.nav-links a[aria-current] { color:var(--plum); border-color:var(--plum); }
.nav-cta,.button { min-height:48px; padding:12px 20px; display:inline-flex; justify-content:center; align-items:center; gap:20px; border:1px solid transparent; border-radius:var(--radius-small); font-size:.875rem; line-height:1.5; font-weight:700; text-align:center; transition:background .2s,color .2s; }
.nav-cta,.button--aqua { background:var(--plum); color:white; }
.nav-cta:hover,.button--aqua:hover { background:var(--plum-deep); }
.button--ghost { border-color:var(--line); background:transparent; color:var(--ink); }
.button--ghost:hover { background:var(--lavender-pale); }
.button--ink { background:var(--ink); color:white; }
.button--ink:hover { background:var(--plum); }
.menu-button,.mobile-menu { display:none; }

/* Hero: one focal image and one quiet supporting detail. */
.hero-stage { padding-block:56px 0; background:var(--paper); }
.hero-grid { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); align-items:center; gap:56px; }
.hero-copy { min-width:0; }
.hero-lede { max-width:48ch; margin-top:24px; color:var(--muted); font-size:1.0625rem; }
.hero-actions { margin-top:28px; display:flex; flex-wrap:wrap; gap:12px; }
.van-proof { margin-top:32px; max-width:440px; padding-top:24px; display:grid; grid-template-columns:128px minmax(0,1fr); gap:20px; align-items:center; border-top:1px solid var(--line); }
.van-proof img { width:128px; height:88px; object-fit:cover; border-radius:var(--radius-small); }
.van-proof figcaption { display:grid; gap:4px; }
.van-proof span { color:var(--muted); font-size:.875rem; }
.van-proof strong { font-size:1rem; font-weight:600; line-height:1.5; }
.hero-portrait { min-width:0; width:100%; }
.hero-portrait__frame { overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:white; }
.hero-portrait__frame img { width:100%; height:560px; object-fit:contain; }
.hero-portrait figcaption { padding-top:14px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 16px; font-size:.875rem; }
.hero-portrait figcaption span { color:var(--muted); }
.hero-portrait figcaption strong { font-weight:600; }
.hero-proof { margin-top:48px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); background:white; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.hero-proof>div,.hero-proof>a { min-height:108px; padding:24px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:6px; border-right:1px solid var(--line); }
.hero-proof strong { font-size:1.5rem; line-height:1.25; font-weight:600; }
.hero-proof span { font-size:.875rem; line-height:1.5; color:var(--muted); }
.hero-proof>a { flex-direction:row; align-items:center; justify-content:space-between; background:var(--lavender-pale); border:0; }
.hero-proof>a span { color:var(--plum); font-weight:600; max-width:12ch; }
.hero-proof b { font-size:1.25rem; font-weight:400; }

/* Repeated headings and photo frames use the same grid. */
.experience-lab,.signature,.coverage { background:white; }
.experience-heading { display:grid; grid-template-columns:1.35fr 1fr; align-items:end; gap:48px; }
.experience-heading>p,.results-heading>p { max-width:36ch; color:var(--muted); }
.mode-explorer { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.mode-stage { padding:24px; background:var(--paper-2); }
.mode-panel { height:100%; display:flex; flex-direction:column; gap:20px; }
.mode-image { display:grid; place-items:center; overflow:hidden; border-radius:var(--radius-small); }
.mode-image img { width:100%; height:360px; object-fit:contain; }
.mode-panel__caption { display:grid; grid-template-columns:32px minmax(0,1fr); gap:12px; align-items:baseline; }
.mode-panel__caption span { font-size:.875rem; color:var(--plum); }
.mode-panel__caption p { font-size:.875rem; color:var(--muted); }
.mode-tabs { display:flex; flex-direction:column; }
.mode-tab { flex:1; min-height:126px; width:100%; padding:24px; display:grid; grid-template-columns:28px minmax(0,1fr) 24px; gap:4px 12px; align-content:center; text-align:left; border:0; border-bottom:1px solid var(--line); background:white; }
.mode-tab>span { grid-row:1/3; padding-top:4px; font-size:.875rem; color:var(--plum); }
.mode-tab strong { font-size:1.375rem; font-weight:600; line-height:1.35; }
.mode-tab small { grid-column:2; color:var(--muted); font-size:.875rem; }
.mode-tab b { grid-column:3; grid-row:1/3; align-self:center; font-size:1.25rem; font-weight:400; }
.mode-tab:hover { background:var(--lavender-pale); }
.mode-tab.is-active { background:var(--plum); color:white; }
.mode-tab.is-active>span,.mode-tab.is-active small { color:#eee4f0; }
.mode-continue { min-height:72px; padding:20px 24px; display:flex; align-items:center; justify-content:space-between; gap:16px; font-size:.875rem; font-weight:600; background:var(--lavender-pale); }

.results { background:var(--lavender-pale); }
.results-heading { display:grid; grid-template-columns:1.2fr 1fr auto; align-items:end; gap:32px; }
.gallery-controls { display:flex; gap:8px; }
.gallery-controls button { width:44px; height:44px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; background:white; font-size:1rem; }
.gallery-controls button:hover { background:var(--plum); color:white; }
.gallery-viewport { overflow-x:auto; overscroll-behavior-inline:contain; scroll-snap-type:x mandatory; scrollbar-width:thin; scrollbar-color:#c8b7cd transparent; }
.gallery-track { display:flex; align-items:stretch; gap:var(--gap); width:100%; padding-bottom:12px; }
.gallery-card { flex:0 0 calc((100% - var(--gap)*2)/3); min-width:0; scroll-snap-align:start; }
.gallery-card>div { overflow:hidden; border-radius:var(--radius); background:var(--lavender); }
.gallery-card img { width:100%; height:100%; object-fit:cover; object-position:center; }
.gallery-card figcaption { min-height:64px; padding-top:16px; display:flex; align-items:baseline; gap:12px; color:var(--muted); font-size:.8125rem; line-height:1.5; }
.gallery-card figcaption span { color:var(--plum); font-weight:700; }

/* Balanced service panels, with photography large enough to read. */
.signature-lead h2 { max-width:29ch; }
.service-map { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gap); align-items:stretch; }
.service-main { padding:24px; display:flex; flex-direction:column; border:1px solid var(--plum); border-radius:var(--radius); background:var(--plum); color:white; }
.service-main-photo { width:100%; height:200px; margin-bottom:24px; object-fit:cover; object-position:65% 45%; border-radius:var(--radius-small); }
.service-kicker { margin-bottom:16px; color:#eee4f0; }
.service-main h3 { margin-bottom:16px; font-size:1.5rem; }
.service-main>p:not(.service-kicker) { color:#eee4f0; }
.service-main ul { margin:20px 0 24px; padding:0; display:grid; grid-template-columns:1fr; list-style:none; }
.service-main li { padding:12px 0; border-bottom:1px solid var(--line-light); font-size:.875rem; }
.service-select { min-height:48px; margin-top:auto; padding:12px 16px; display:flex; justify-content:space-between; align-items:center; gap:16px; border:1px solid var(--line-light); border-radius:var(--radius-small); background:transparent; color:white; font-size:.875rem; font-weight:600; text-align:left; }
.service-select:hover { background:rgba(255,255,255,.1); }
.service-alternatives { display:contents; }
.service-option { padding:24px; display:flex; flex-direction:column; gap:24px; border:1px solid var(--line); border-radius:var(--radius); background:var(--paper); }
.service-option--accent { background:var(--lavender-pale); }
.service-portrait { grid-row:1/3; width:144px; height:200px; object-fit:cover; object-position:65% center; border-radius:var(--radius-small); }
.service-option h3 { margin-bottom:12px; font-size:1.5rem; }
.service-option p { color:var(--muted); font-size:1rem; line-height:1.6; }
.service-option .service-link { min-height:44px; margin-top:auto; padding:10px 0; display:flex; align-items:center; justify-content:space-between; gap:12px; border:0; border-top:1px solid var(--line); background:transparent; text-align:left; font-size:.875rem; font-weight:600; }
.service-option .service-link:hover { color:var(--plum); }
.service-note { grid-column:1/-1; max-width:80ch; color:var(--muted); font-size:.875rem; }
.journey { margin-top:48px; margin-bottom:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gap); list-style:none; }
.journey li { padding-top:24px; display:grid; grid-template-columns:36px minmax(0,1fr); gap:4px 16px; align-content:start; border-top:1px solid var(--line); }
.journey span { grid-row:1/3; width:36px; height:36px; display:grid; place-items:center; background:var(--lavender-pale); border-radius:50%; font-size:.875rem; font-weight:600; color:var(--plum); }
.journey strong { font-size:1.125rem; font-weight:600; }
.journey p { color:var(--muted); font-size:.9375rem; }

.trust-world { background:var(--lavender-pale); }
.trust-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:64px; align-items:center; }
.trust-number { margin-bottom:16px; color:var(--plum); font-size:3.5rem; font-weight:600; line-height:1.1; letter-spacing:-.045em; }
.trust-statement h2 { max-width:19ch; }
.trust-list { border-top:1px solid var(--line); }
.trust-list article { display:grid; grid-template-columns:32px minmax(0,1fr); gap:16px; padding:24px 0; border-bottom:1px solid var(--line); }
.trust-list article>span { padding-top:3px; font-size:.875rem; color:var(--plum); }
.trust-list h3 { font-size:1.25rem; margin-bottom:8px; }
.trust-list p { color:var(--muted); }
.trust-photo-strip { margin-top:40px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gap); }
.trust-photo-strip img { width:100%; height:300px; object-fit:cover; object-position:center 12%; border:1px solid var(--line); border-radius:var(--radius); }
.trust-photo-strip figcaption { padding-top:12px; color:var(--muted); font-size:.875rem; }
.care-rhythm { margin-top:40px; padding:32px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.65fr); gap:32px; align-items:center; border:1px solid var(--line); border-radius:var(--radius); background:white; }
.care-rhythm__copy h3 { margin-bottom:12px; }
.care-rhythm__copy>p:not(.eyebrow) { color:var(--muted); font-size:.875rem; }
.care-choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.care-choice { min-width:0; min-height:192px; padding:20px 16px; display:flex; flex-direction:column; align-items:flex-start; gap:10px; border:1px solid var(--line); border-radius:var(--radius-small); background:var(--paper); text-align:left; }
.care-choice:hover { border-color:var(--plum); }
.care-choice>span { font-size:2rem; line-height:1.1; }
.care-choice strong { margin-top:auto; font-size:.9375rem; font-weight:600; line-height:1.5; }
.care-choice small { color:var(--muted); font-size:.8125rem; line-height:1.5; }
.care-choice.is-active { background:var(--plum); border-color:var(--plum); color:white; }
.care-choice.is-active small { color:#eee4f0; }

.coverage-heading h2 { margin-bottom:16px; }
.coverage-heading div>p:last-child { color:var(--muted); max-width:70ch; }
.coverage-map { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gap); }
.coverage-card { min-height:328px; padding:32px; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:var(--radius); background:var(--paper); }
.coverage-card h3 { margin-bottom:16px; }
.coverage-card>p:not(.coverage-label) { margin-bottom:24px; color:var(--muted); }
.coverage-card .coverage-action { min-height:48px; margin-top:auto; padding:16px 0; display:flex; justify-content:space-between; gap:12px; border:0; border-top:1px solid var(--line); background:transparent; text-align:left; font-size:.875rem; font-weight:600; }
.coverage-card>a { color:var(--plum); font-size:.9375rem; font-weight:600; }

.booking { background:var(--plum-deep); color:white; }
.booking .eyebrow { color:#eee4f0; }
.booking h2 em { color:var(--lavender); }
.booking-shell { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:64px; align-items:start; }
.booking-aside h2 { margin-bottom:24px; }
.booking-aside>p:not(.eyebrow) { color:#eee4f0; }
.booking-summary { margin:32px 0 0; border-top:1px solid var(--line-light); }
.booking-summary div { padding:14px 0; display:grid; grid-template-columns:80px minmax(0,1fr); gap:16px; border-bottom:1px solid var(--line-light); }
.booking-summary dt { color:#eee4f0; font-size:.875rem; }
.booking-summary dd { margin:0; font-size:.875rem; font-weight:600; overflow-wrap:anywhere; }
.booking-promise { margin-top:24px; display:flex; gap:12px; align-items:flex-start; }
.booking-promise span { width:24px; height:24px; flex:0 0 24px; display:grid; place-items:center; background:var(--lavender); color:var(--plum-deep); border-radius:50%; font-size:.8125rem; }
.booking-promise p { font-size:.875rem; }
.booking-form { min-width:0; padding:32px; background:white; color:var(--ink); border-radius:var(--radius); }
.form-progress { margin-bottom:32px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.form-progress span { padding:0 0 16px; display:flex; align-items:center; gap:8px; border-bottom:2px solid var(--line); color:var(--muted); font-size:.875rem; font-weight:600; }
.form-progress b { width:24px; height:24px; flex:0 0 24px; display:grid; place-items:center; border-radius:50%; background:var(--paper-2); font-size:.8125rem; }
.form-progress .is-active,.form-progress .is-complete { color:var(--plum); border-color:var(--plum); }
.form-progress .is-active b { background:var(--plum); color:white; }
.form-step { min-width:0; padding:0; margin:0; border:0; }
.form-step legend { width:100%; padding:0; margin-bottom:24px; font-size:1.75rem; font-weight:600; line-height:1.3; letter-spacing:-.025em; }
.form-step legend small { display:block; margin-bottom:8px; font-size:.8125rem; font-weight:600; color:var(--plum); letter-spacing:0; }
.zone-choices,.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.choice-card { min-width:0; min-height:120px; padding:16px; display:flex; align-items:flex-start; gap:12px; border:1px solid var(--line); border-radius:var(--radius-small); cursor:pointer; }
.choice-card:hover { border-color:var(--plum); }
.choice-card:has(input:checked) { background:var(--lavender-pale); border-color:var(--plum); box-shadow:inset 0 0 0 1px var(--plum); }
.choice-card input { flex:0 0 18px; width:18px; height:18px; margin:4px 0 0; accent-color:var(--plum); }
.choice-card span { min-width:0; display:flex; flex-direction:column; gap:6px; }
.choice-card strong { font-size:1rem; font-weight:600; }
.choice-card small { color:var(--muted); font-size:.875rem; line-height:1.5; }
.coverage-note { margin-top:16px; color:var(--plum); font-size:.875rem; }
.field { min-width:0; display:flex; flex-direction:column; gap:8px; }
.field--full { grid-column:1/-1; }
.field label { font-size:.875rem; font-weight:600; }
.field input,.field select { width:100%; min-width:0; min-height:52px; padding:12px; border:1px solid var(--line); border-radius:var(--radius-small); background:var(--paper); color:var(--ink); font-size:1rem; }
.field input::placeholder { color:var(--muted); }
.form-actions { margin-top:24px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.form-actions--end { justify-content:flex-end; }
.form-back { min-height:48px; padding:12px 0; border:0; background:transparent; color:var(--muted); font-size:.875rem; font-weight:600; }
.form-note { margin-top:16px; color:var(--muted); font-size:.8125rem; }

.faq { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:64px; }
.faq-intro h2 { margin-bottom:24px; }
.faq-intro>p:last-child { max-width:36ch; color:var(--muted); }
.faq-list { border-top:1px solid var(--line); }
.faq-list details { border-bottom:1px solid var(--line); }
.faq-list summary { padding:24px 0; display:flex; justify-content:space-between; gap:24px; font-size:1.0625rem; font-weight:600; line-height:1.5; list-style:none; cursor:pointer; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary span { flex:0 0 16px; color:var(--plum); transition:transform .2s; }
.faq-list details[open] summary span { transform:rotate(45deg); }
.faq-list details p { padding-bottom:24px; padding-right:32px; color:var(--muted); }
.closing { padding-bottom:var(--section-space); }
.closing-card { padding:24px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:48px; border:1px solid var(--line); border-radius:var(--radius); background:var(--lavender-pale); }
.closing-card img { width:100%; height:auto; aspect-ratio:auto; border-radius:var(--radius-small); }
.closing-card figcaption { padding-top:12px; font-size:.8125rem; color:var(--muted); }
.closing-card>div { padding:16px 24px 16px 0; }
.closing-card h2 { margin-bottom:20px; font-size:clamp(1.875rem,3vw,2.5rem); }
.closing-card>div>p:not(.eyebrow) { margin-bottom:24px; color:var(--muted); }
.footer { padding:48px 0 24px; background:var(--ink); color:white; }
.footer-top { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:48px; align-items:start; }
.footer-brand img { width:168px; height:88px; object-fit:contain; filter:brightness(0) invert(1); }
.footer-brand p { max-width:35ch; margin-top:20px; color:#cdc5cf; font-size:.875rem; }
.footer-links,.footer-contact { padding-top:20px; display:flex; flex-direction:column; align-items:flex-start; gap:16px; }
.footer-links a,.footer-contact a { color:#e5dee7; font-size:.875rem; }
.footer-links a:hover,.footer-contact a:hover { color:white; text-decoration:underline; }
.footer-bottom { margin-top:40px; padding-top:24px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; border-top:1px solid var(--line-light); color:#cdc5cf; font-size:.8125rem; }
.reveal { opacity:1; transform:none; }
.reveal.will-reveal { opacity:0; transform:translateY(16px); transition:opacity .5s var(--ease),transform .6s var(--ease); }
.reveal.will-reveal.is-visible { opacity:1; transform:none; }

/* Independent pages keep each choice focused and share the same navigation. */
.page--inside main { min-height:60vh; }
.page--inside h1 { max-width:26ch; font-size:var(--heading); line-height:1.16; letter-spacing:-.035em; }
.page--inside h1 em { display:inline; }
.page--inside .booking h1 em { color:var(--lavender); }
.page--inside .booking-aside h1 { margin-bottom:24px; }
.page--inside .coverage-heading h1 { margin-bottom:16px; }
.page--inside .section-pad { padding-top:40px; }
.breadcrumb { padding-block:24px; display:flex; flex-wrap:wrap; gap:12px; font-size:.875rem; color:var(--muted); }
.breadcrumb a { color:var(--plum); font-weight:600; }
.breadcrumb a:hover { text-decoration:underline; }
.directory-grid,.mode-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gap); }
.directory-card { display:flex; flex-direction:column; min-width:0; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:white; transition:border-color .2s,box-shadow .2s; }
.directory-card:hover { border-color:var(--plum); box-shadow:0 12px 28px rgba(45,34,48,.08); }
.directory-card>div { padding:24px; display:grid; grid-template-columns:minmax(0,1fr) 20px; gap:10px 16px; }
.directory-card h3 { font-size:1.375rem; }
.directory-card p { grid-column:1; color:var(--muted); font-size:.9375rem; }
.directory-card span { grid-column:2; grid-row:1/3; align-self:center; color:var(--plum); font-size:1.25rem; }
.mode-card { min-width:0; padding:24px; display:flex; flex-direction:column; gap:20px; border:1px solid var(--line); border-radius:var(--radius); background:var(--paper); }
.mode-card-photo { overflow:hidden; border-radius:var(--radius-small); }
.mode-card h2 { font-size:1.5rem; }
.mode-card p { color:var(--muted); }
.mode-card .button { width:100%; margin-top:auto; }
.gallery-page-grid .gallery-track { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.gallery-page-grid .gallery-card { width:100%; min-width:0; }
.gallery-page-grid .gallery-card figcaption { min-height:0; }
.gallery-page-grid .gallery-card>div { width:100%; }
.page--galeria .results-heading { grid-template-columns:1.2fr 1fr; }
.care-rhythm--standalone { margin-top:0; margin-bottom:var(--section-space); }
.booking-mode-field { margin-bottom:24px; }

@media (max-width:900px) {
  .directory-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mode-cards { grid-template-columns:1fr; }
  .mode-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; }
  .mode-card-photo { grid-column:1; grid-row:1/4; }
  .mode-card h2,.mode-card p,.mode-card .button { grid-column:2; }
}
@media (max-width:560px) {
  .directory-grid,.gallery-page-grid .gallery-track { grid-template-columns:1fr; gap:20px; }
  .directory-card>div { padding:20px; }
  .mode-card { display:flex; padding:20px; }
  .breadcrumb { padding-block:20px; }
  .page--inside .section-pad { padding-top:24px; }
  .page--galeria .results-heading { grid-template-columns:1fr; }
}

@media (max-width:1100px) {
  :root { --gutter:32px; --section-space:72px; }
  .nav-links { gap:20px; }
  .nav-shell { gap:24px; }
  .hero-grid { gap:32px; }
  .hero-portrait__frame img { height:520px; }
  .hero-proof>div,.hero-proof>a { padding:20px; }
  .service-main,.service-option { padding:20px; }
  .service-portrait { width:112px; height:176px; }
  .care-rhythm { grid-template-columns:1fr; }
  .care-rhythm__copy { max-width:56ch; }
  .care-choice { min-height:168px; }
  .trust-grid,.booking-shell,.faq { gap:40px; }
  .coverage-card { padding:24px; }
  .booking-shell { grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr); gap:32px; }
  .booking-form { padding:24px; }
  .closing-card { gap:32px; }
}
@media (max-width:820px) {
  :root { --gutter:24px; --section-space:64px; --heading:clamp(2rem,5.6vw,2.75rem); }
  html { scroll-padding-top:84px; }
  [id] { scroll-margin-top:84px; }
  .nav-shell { min-height:72px; grid-template-columns:minmax(0,1fr) auto auto; gap:12px; }
  .brand img { width:108px; height:auto; }
  .nav-links { display:none; }
  .nav-cta { min-height:44px; padding:10px 14px; gap:8px; font-size:.8125rem; }
  .nav-cta span { display:none; }
  .menu-button { width:44px; height:44px; display:grid; place-content:center; gap:6px; border:1px solid var(--line); border-radius:50%; background:transparent; }
  .menu-button span:not(.sr-only) { display:block; width:18px; height:1px; background:var(--ink); transition:transform .2s; }
  .menu-button[aria-expanded="true"] span:first-child { transform:translateY(3.5px) rotate(45deg); }
  .menu-button[aria-expanded="true"] span:nth-child(2) { transform:translateY(-3.5px) rotate(-45deg); }
  .mobile-menu { position:fixed; z-index:190; inset:73px 0 0; padding:16px var(--gutter) max(24px,env(safe-area-inset-bottom)); display:flex; flex-direction:column; overflow-y:auto; background:var(--paper); visibility:hidden; opacity:0; transition:opacity .2s,visibility .2s; }
  .mobile-menu.is-open { visibility:visible; opacity:1; }
  .mobile-menu a { padding:20px 0; border-bottom:1px solid var(--line); font-size:1.25rem; font-weight:600; }
  .hero-stage { padding-top:40px; }
  .hero-grid { grid-template-columns:1fr; gap:32px; }
  h1 { max-width:16ch; font-size:clamp(2.75rem,7.2vw,3.5rem); }
  .hero-lede { max-width:54ch; }
  .hero-portrait { max-width:540px; justify-self:center; }
  .hero-portrait__frame img { height:auto; max-height:560px; aspect-ratio:4/5; }
  .hero-proof { margin-top:32px; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hero-proof>div,.hero-proof>a { min-height:108px; }
  .hero-proof>div:nth-child(2) { border-right:0; }
  .hero-proof>div:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .experience-heading { grid-template-columns:1fr; gap:20px; }
  .experience-heading>p,.results-heading>p { max-width:56ch; }
  .mode-explorer { grid-template-columns:1fr; }
  .mode-stage { padding:20px; }
  .mode-image { min-height:0; }
  .mode-image { flex:0 0 auto; background:transparent; }
  .mode-image img { height:auto; max-height:420px; width:auto; max-width:100%; }
  .mode-tab { min-height:104px; padding:20px; }
  .mode-continue { min-height:64px; padding:20px; }
  .results-heading { grid-template-columns:minmax(0,1fr) auto; gap:20px; }
  .results-heading>p { grid-column:1/-1; grid-row:2; }
  .gallery-controls { grid-column:2; grid-row:1; }
  .service-map { grid-template-columns:1fr; }
  .service-main { padding:20px; }
  .service-main-photo { height:260px; }
  .gallery-card { flex-basis:calc((100% - var(--gap))/2); }
  .service-portrait { grid-row:auto; width:100%; height:208px; object-position:center; }
  .journey { margin-top:36px; gap:20px; }
  .journey li { grid-template-columns:1fr; gap:12px; }
  .journey span { grid-row:auto; }
  .trust-grid,.booking-shell,.faq { grid-template-columns:1fr; gap:32px; }
  .trust-statement h2 { max-width:24ch; }
  .trust-number { font-size:3rem; }
  .trust-photo-strip { gap:16px; }
  .trust-photo-strip img { height:240px; }
  .care-rhythm { padding:24px; margin-top:32px; }
  .care-choice { min-height:192px; }
  .coverage-map { grid-template-columns:1fr; gap:16px; }
  .coverage-card { min-height:0; }
  .coverage-card>p:not(.coverage-label) { max-width:50ch; }
  .booking-summary { margin-top:24px; }
  .closing-card { gap:24px; padding:20px; }
  .closing-card>div { padding:0; }
  .closing-card h2 { font-size:2rem; }
  .footer-top { grid-template-columns:1.3fr 1fr; gap:32px; }
  .footer-contact { grid-column:2; padding:0; }
}
@media (max-width:560px) {
  :root { --gutter:16px; --gap:16px; --section-space:56px; --radius:16px; --heading:2rem; }
  .section-heading { margin-bottom:28px; }
  h1 { max-width:100%; font-size:clamp(2.375rem,9.5vw,3.125rem); }
  .eyebrow { font-size:.75rem; letter-spacing:.06em; }
  .hero-stage { padding-top:32px; }
  .hero-lede { margin-top:20px; font-size:1rem; }
  .hero-actions { margin-top:24px; display:grid; grid-template-columns:1fr; }
  .hero-actions .button { width:100%; justify-content:space-between; }
  .van-proof { grid-template-columns:100px minmax(0,1fr); gap:16px; margin-top:24px; padding-top:20px; }
  .van-proof img { width:100px; height:76px; }
  .hero-portrait figcaption { font-size:.8125rem; }
  .hero-proof>div,.hero-proof>a { min-height:112px; padding:16px; }
  .hero-proof strong { font-size:1.375rem; }
  .hero-proof span { font-size:.8125rem; }
  .mode-stage { padding:16px; }
  .mode-panel { gap:16px; }
  .mode-image img { height:auto; max-height:360px; }
  .mode-tab { grid-template-columns:24px minmax(0,1fr) 20px; padding:20px 16px; gap:6px 10px; }
  .mode-tab strong { font-size:1.125rem; }
  .mode-tab small { font-size:.8125rem; }
  .mode-continue { padding:16px; }
  .results-heading { grid-template-columns:1fr; }
  .gallery-controls { grid-column:1; grid-row:3; }
  .gallery-card { flex-basis:min(320px,100%); }
  .gallery-card figcaption { min-height:0; padding-top:12px; gap:8px; }
  .service-main { padding:20px; }
  .service-main-photo { height:auto; margin-bottom:20px; }
  .service-main h3 { font-size:1.375rem; }
  .service-main ul { grid-template-columns:1fr; margin-block:20px 24px; }
  .service-option { padding:20px; gap:16px; }
  .service-portrait { height:auto; }
  .service-option h3 { font-size:1.375rem; }
  .journey { grid-template-columns:1fr; }
  .journey li { grid-template-columns:36px minmax(0,1fr); gap:4px 16px; padding-top:20px; }
  .journey span { grid-row:1/3; }
  .trust-list article { gap:12px; grid-template-columns:24px minmax(0,1fr); }
  .trust-list h3 { font-size:1.125rem; }
  .trust-photo-strip { grid-template-columns:1fr; gap:24px; }
  .trust-photo-strip img { height:auto; aspect-ratio:4/3; }
  .care-rhythm { padding:20px; gap:24px; }
  .care-choices { grid-template-columns:1fr; }
  .care-choice { min-height:88px; padding:16px; display:grid; grid-template-columns:44px minmax(0,1fr); gap:4px 16px; }
  .care-choice>span { grid-row:1/3; align-self:center; font-size:1.75rem; }
  .care-choice strong { margin:0; }
  .care-choice small { font-size:.875rem; }
  .coverage-card { padding:20px; }
  .booking-form { padding:20px; }
  .form-progress { gap:8px; margin-bottom:24px; }
  .form-progress span { flex-direction:column; align-items:flex-start; gap:8px; font-size:.8125rem; padding-bottom:12px; }
  .form-step legend { font-size:1.5rem; }
  .zone-choices,.form-grid { grid-template-columns:1fr; }
  .choice-card { min-height:80px; }
  .form-actions { flex-wrap:wrap; }
  .form-actions .button { width:100%; justify-content:space-between; }
  .form-actions .form-back { order:2; }
  .faq-list summary { gap:16px; font-size:1rem; }
  .faq-list details p { padding-right:0; }
  .closing-card { grid-template-columns:1fr; gap:24px; padding:16px; }
  .closing-card>div { padding:8px; }
  .closing-card h2 { font-size:1.875rem; }
  .footer-top { grid-template-columns:1fr 1fr; gap:24px; }
  .footer-brand { grid-column:1/-1; }
  .footer-links,.footer-contact { grid-column:auto; padding:0; }
  .footer-bottom { flex-direction:column; margin-top:32px; }
}
/* One photo format throughout the site; focal points preserve each pet's face. */
main img.photo {
  width:100%; height:auto; max-height:none; aspect-ratio:var(--photo-ratio);
  object-fit:cover; object-position:var(--photo-position,center);
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important; }
  .reveal,.reveal.will-reveal { opacity:1; transform:none; }
}