/* lielorel.com treatment pages. GENERATED by _seo-src/build_pages.py from the <style> in index.html
   plus _seo-src/pages-extra.css. Edit those, then re-run the script. */
/* ============ FONTS (self-hosted; same files and unicode ranges Google Fonts serves) ============ */
/* latin-ext */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/cormorant-italic-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/cormorant-italic-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/cormorant-italic-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/cormorant-italic-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/cormorant-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/cormorant-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/cormorant-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/cormorant-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* hebrew */
@font-face {
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/heebo-hebrew.woff2) format('woff2');
  unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* latin-ext */
@font-face {
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/heebo-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/heebo-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* hebrew */
@font-face {
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/heebo-hebrew.woff2) format('woff2');
  unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* latin-ext */
@font-face {
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/heebo-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/heebo-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* hebrew */
@font-face {
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/heebo-hebrew.woff2) format('woff2');
  unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* latin-ext */
@font-face {
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/heebo-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/heebo-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* hebrew */
@font-face {
  font-family: 'Noto Serif Hebrew';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/noto-serif-hebrew-hebrew.woff2) format('woff2');
  unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* latin-ext */
@font-face {
  font-family: 'Noto Serif Hebrew';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/noto-serif-hebrew-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Noto Serif Hebrew';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/noto-serif-hebrew-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* hebrew */
@font-face {
  font-family: 'Noto Serif Hebrew';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/noto-serif-hebrew-hebrew.woff2) format('woff2');
  unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* latin-ext */
@font-face {
  font-family: 'Noto Serif Hebrew';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/noto-serif-hebrew-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Noto Serif Hebrew';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/noto-serif-hebrew-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============ TOKENS ============ */
:root{
  --bg:#FFFFFF;
  --tint:#F7F4F1;          /* Porcelain */
  --tint-2:#F1EAE5;
  --ink:#111111;           /* Obsidian */
  --ink-2:#4A423D;
  --muted:#6F625B;
  --rose:#B8735A;          /* LO Rose Gold — icons, lines, large accents */
  --rose-text:#9A5A42;     /* rose for small text (AA) */
  --rose-deep:#9F5F47;     /* primary button (5.0:1 with white) */
  --rose-tint:#F3E6DF;
  --taupe:#A89B93;
  --line:rgba(17,17,17,.12);
  --line-ui:rgba(17,17,17,.38);   /* control borders — 3:1 for WCAG 1.4.11 */
  --line-soft:rgba(17,17,17,.08);

  --serif-he:"Noto Serif Hebrew", "Noto Serif Hebrew Fallback", "Frank Ruhl Libre", Georgia, "Times New Roman", serif;
  --serif-la:"Cormorant Garamond", "Cormorant Fallback", Georgia, serif;
  --sans:"Heebo", "Heebo Fallback", "Assistant", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;

  --w:1280px;
  --gut:clamp(16px, 2.2vw, 32px);
  /* spacing scale — every vertical gap on the page comes from here */
  --s1:6px; --s2:10px; --s3:16px; --s4:24px; --s5:34px; --s6:48px; --s7:68px;
  --sec:clamp(44px, 5vw, 70px);      /* major section padding  -> 140px boundary */
  --sec-t:clamp(30px, 3.4vw, 48px);  /* tight section padding  -> 96/118px boundary */
  --r-s:10px;
  --r:18px;
  --r-l:24px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
@font-face{font-family:"Cormorant Fallback";src:local("Georgia");size-adjust:88%;ascent-override:90%;descent-override:22%}
/* metric-matched fallbacks (measured 2026-10-02 on this site, Hebrew and Latin text separately): while the web fonts load,
   Arial / Times New Roman take the same width as Heebo / Noto Serif Hebrew, so the hero does not jump when they swap in */
@font-face{font-family:"Heebo Fallback";src:local("Arial"),local("ArialMT");unicode-range:U+0590-05FF,U+FB1D-FB4F,U+20AA;size-adjust:105%;ascent-override:100%;descent-override:40%;line-gap-override:0%}
@font-face{font-family:"Heebo Fallback";src:local("Arial"),local("ArialMT");unicode-range:U+0000-00FF,U+0100-024F,U+2000-206F,U+20AC,U+2122;size-adjust:100%;ascent-override:105%;descent-override:42%;line-gap-override:0%}
@font-face{font-family:"Noto Serif Hebrew Fallback";src:local("Times New Roman"),local("TimesNewRomanPSMT");unicode-range:U+0590-05FF,U+FB1D-FB4F,U+20AA;size-adjust:113.8%;ascent-override:79%;descent-override:25.5%;line-gap-override:0%}
@font-face{font-family:"Noto Serif Hebrew Fallback";src:local("Times New Roman"),local("TimesNewRomanPSMT");unicode-range:U+0000-00FF,U+0100-024F,U+2000-206F,U+20AC,U+2122;size-adjust:107.3%;ascent-override:83.9%;descent-override:27%;line-gap-override:0%}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:1.0625rem;line-height:1.65;font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
p{margin:0 0 1em}
h1,h2,h3,h4{margin:0;font-weight:400;line-height:1.2;letter-spacing:0;text-wrap:balance}
h1,h2{font-family:var(--serif-he)}
h3{font-family:var(--serif-he);font-weight:400}
ul,ol{margin:0;padding:0;list-style:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.a11y-btn:focus-visible{outline-color:var(--rose-deep);box-shadow:0 0 0 7px #fff}
::selection{background:var(--rose-tint);color:var(--ink)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ============ TYPE ============ */
.h1{font-size:clamp(2.1rem, 1.55rem + 2.1vw, 3.4rem);line-height:1.16;font-weight:300}
.h2{font-size:clamp(1.75rem, 1.4rem + 1.4vw, 2.6rem);line-height:1.2;font-weight:300}
.h2.center{text-align:center;margin-inline:auto;max-width:22ch}
.lead{font-size:clamp(1.02rem, 1rem + .25vw, 1.18rem);color:var(--ink-2);line-height:1.7;max-width:29.208em} /* = 52ch in Heebo, but in em so the width does not change while the Latin font file is still loading (that re-wrapped the hero text and made it jump) */
.muted{color:var(--muted)}
.num{font-variant-numeric:lining-nums tabular-nums;direction:ltr;unicode-bidi:isolate}
.ltr{direction:ltr;unicode-bidi:isolate;display:inline-block}
.serif-la{font-family:var(--serif-la);font-style:italic}

/* ============ LAYOUT ============ */
.wrap{max-width:var(--w);margin:0 auto;padding-inline:var(--gut)}
.section{padding-block:var(--sec)}
.section-tight{padding-block:var(--sec-t)}
.section-tint{background:var(--tint)}
.head{max-width:640px;margin-bottom:var(--s6)}
.head .lead{margin-top:var(--s3)}
.h2 + .lead,.h1 + .lead{margin-top:var(--s3)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px);align-items:center}
.split-top{align-items:start}
@media (max-width:860px){.split{grid-template-columns:1fr;gap:28px}}
.photo{border-radius:var(--r);overflow:hidden;background:var(--tint)}
.photo img{width:100%;height:100%;object-fit:cover}
.rows{display:flex;flex-direction:column;margin-top:var(--s5)}
.rows > li{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s1);padding:var(--s3) 0;border-top:1px solid var(--line)}
.rows > li:last-child{border-bottom:1px solid var(--line)}
.rows b{font-family:var(--serif-he);font-weight:400;font-size:1.2rem;line-height:1.3}
.rows p{margin:0;color:var(--ink-2);font-size:.97rem}

/* ============ BUTTONS ============ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:50px;padding:.8em 1.5em;border-radius:999px;font-family:var(--sans);font-weight:500;font-size:.98rem;line-height:1.2;border:1px solid transparent;text-align:center;max-width:100%;transition:background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease)}
@media (min-width:601px){.btn{white-space:nowrap}}
.btn svg{width:1.1em;height:1.1em;flex:none}
.btn-primary{background:var(--rose-deep);color:#fff}
.btn-primary:hover{background:#8F5540}
.btn-outline{border-color:var(--ink);color:var(--ink);background:transparent}
.btn-outline:hover{background:var(--tint);border-color:var(--ink)}
.btn-white{background:#fff;color:var(--ink)}
.btn-white:hover{background:var(--tint-2)}
.link{display:inline-flex;align-items:center;gap:.4em;font-weight:500;color:var(--ink);min-height:44px;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;transition:color .2s}
.link:hover{color:var(--rose-text)}
.link svg{width:1em;height:1em}

/* ============ TOP BAR ============ */
.topbar{background:var(--tint);font-size:.8rem;text-align:center;padding:0 var(--gut);color:var(--ink)}
.topbar a{display:inline-flex;align-items:center;min-height:40px;padding-inline:.4em;text-decoration:underline;text-underline-offset:3px;font-weight:500}
.topbar .sep{color:var(--taupe);margin:0 .6em}
@media (max-width:600px){.topbar .hide-m{display:none}}

/* ============ NAV ============ */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color .3s}
.nav.is-scrolled{border-bottom-color:var(--line-soft)}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:72px}
.logo{display:inline-flex;align-items:center;min-height:44px;order:1}
.logo-img{height:52px;width:auto;display:block}
@media (max-width:960px){.logo-img{height:44px}}
.nav-links{order:2;display:flex;align-items:center;gap:clamp(14px,2vw,32px)}
.nav-links a{font-size:.92rem;font-weight:400;color:var(--ink);padding:.5em .1em;min-height:44px;display:inline-flex;align-items:center;position:relative}
.nav-links a::after{content:"";position:absolute;inset-inline:0;bottom:.4em;height:1px;background:var(--ink);transform:scaleX(0);transform-origin:right;transition:transform .3s var(--ease)}
.nav-links a:hover::after,.nav-links a[aria-current]::after{transform:scaleX(1)}
.nav-links .m-cta,.nav-links .m-only{display:none}
.nav-cta{order:3;display:flex;align-items:center;gap:10px}
.nav-phone{display:inline-flex;align-items:center;gap:.5em;font-weight:500;font-size:.92rem;color:var(--ink);min-height:44px;padding:0 .4em}
.nav-phone svg{width:17px;height:17px;color:var(--rose)}
.nav-cta .btn{min-height:42px;padding:.6em 1.2em;font-size:.9rem}
.nav-toggle{display:none;width:44px;height:44px;border-radius:50%;align-items:center;justify-content:center;border:1px solid var(--line-ui)}
.nav-toggle span{display:block;width:18px;height:1.5px;background:var(--ink);position:relative;transition:transform .3s,background .3s}
.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:0;width:18px;height:1.5px;background:var(--ink);transition:transform .3s,top .3s}
.nav-toggle span::before{top:-6px}.nav-toggle span::after{top:6px}
.nav-toggle[aria-expanded="true"] span{background:transparent}
.nav-toggle[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.nav-toggle[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}
@media (max-width:960px){
  .nav-links{display:none}
  .nav-toggle{display:inline-flex}
  .nav-cta .btn{display:none}
  .nav-phone .t{display:none}
  .nav-phone{width:44px;justify-content:center;border:1px solid var(--line-ui);border-radius:50%}
  .nav.is-open .nav-links{display:flex;flex-direction:column;align-items:stretch;gap:0;position:absolute;inset-inline:0;top:100%;background:#fff;border-bottom:1px solid var(--line);padding:8px var(--gut) 24px;max-height:calc(100dvh - 72px);overflow-y:auto}
  .nav.is-open .nav-links a{font-size:1.2rem;padding:.65em 0;border-bottom:1px solid var(--line-soft);font-family:var(--serif-he)}
  .nav.is-open .nav-links a::after{display:none}
  .nav.is-open .nav-links .m-only{display:inline-flex}
  .nav.is-open .nav-links .m-cta{display:inline-flex;margin-top:16px;border:0;font-family:var(--sans);font-size:1rem}
}

/* ============ HERO ============ */
.hero{padding:calc(var(--gut) * .5) 0 0}
.hero-grid{display:grid;grid-template-columns:1.08fr 1fr;gap:clamp(24px,4vw,64px);align-items:center}
.hero-copy{padding:clamp(24px,4vw,56px) 0}
@media (min-width:861px){.hero-copy{order:-1}}
.hero-ctas{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s3);align-items:center;margin-top:var(--s5)}
.hero-meta{margin-top:var(--s5);font-size:.9rem;color:var(--muted);line-height:1.6}
.hero-meta svg{width:15px;height:15px;color:var(--rose);display:inline-block;vertical-align:-2px;margin-inline-end:.45em}
.hero-photo{position:relative;aspect-ratio:697/791;max-height:calc(100vh - 110px);min-height:420px;background:#DAD8D6}
.hero-photo img{object-position:center top;filter:none}
@media (max-width:860px){
  .hero{padding-top:0}
  .hero-grid{grid-template-columns:1fr;gap:16px}
  .hero-photo{aspect-ratio:697/791;max-height:78vh;min-height:0;border-radius:0;margin-inline:calc(var(--gut) * -1)}
  .offer{inset-inline-end:var(--gut)}
  .hero-copy{padding:8px 0 24px}
}
.offer{position:absolute;inset-inline-end:16px;bottom:16px;background:rgba(255,255,255,.94);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-radius:var(--r-s);padding:12px 16px;display:flex;flex-direction:column;gap:2px;min-width:190px;color:var(--ink);transition:background .25s}
.offer:hover{background:#fff}
.offer:focus-visible{outline:3px solid var(--ink);outline-offset:0;box-shadow:0 0 0 6px #fff}
.offer b{font-family:var(--serif-he);font-weight:400;font-size:1.1rem;line-height:1.3}
.offer span{font-size:.82rem;color:var(--rose-text);display:inline-flex;align-items:center;gap:.3em}
.offer span svg{width:.9em;height:.9em}

/* ============ MARQUEE ============ */
.marquee{border-block:1px solid var(--line-soft);overflow:hidden;padding:var(--s2) 0;margin-top:var(--s6)}
.marquee-track{display:flex;gap:0;width:max-content;animation:marquee 60s linear infinite}
.marquee:hover .marquee-track,.marquee:focus-within .marquee-track,.marquee.paused .marquee-track{animation-play-state:paused}
.marquee ul{display:flex;gap:0;flex:none}
.marquee li{font-family:var(--serif-he);font-weight:300;font-size:1.02rem;letter-spacing:0;color:var(--ink);padding:0 22px;white-space:nowrap;display:flex;align-items:center;gap:22px}
.marquee li[lang=en]{font-family:var(--serif-la);font-style:italic;font-size:1.12rem}
.marquee li::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--rose)}
@keyframes marquee{to{transform:translateX(50%)}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none}}

/* ============ TREATMENTS ============ */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,24px);align-items:stretch}
@media (max-width:1100px){.tiles{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.tiles{grid-template-columns:1fr;max-width:560px;margin-inline:auto}}
.tile{display:flex;flex-direction:column;background:var(--tint);border-radius:var(--r-l);overflow:hidden;transition:background .3s var(--ease)}
.tile:hover{background:var(--tint-2)}
.tile figure{margin:0;aspect-ratio:16/11;overflow:hidden;background:var(--tint-2);position:relative}
.tile figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.tile:hover figure img{transform:scale(1.04)}
.tile-body{flex:1;display:flex;flex-direction:column;padding:clamp(20px,1.8vw,30px)}
.tile .tag{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--rose-text);direction:ltr;unicode-bidi:isolate;display:block;text-align:right}
.tile h3{font-size:1.45rem;line-height:1.3;margin:var(--s2) 0 var(--s4)}
.tile:hover h3{color:var(--rose-text)}
.tile p{margin:0;color:var(--ink-2);font-size:.98rem;line-height:1.75}
.tile p + p{margin-top:var(--s3)}
.tile-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .9s var(--ease)}
.tile-vid.ready{opacity:1}
@media (prefers-reduced-motion:reduce){.tile-vid{display:none}}
.tiles-more{margin-top:var(--s6);display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2);color:var(--muted);font-size:.94rem}
/* ============ PRICES ============ */
/* The shared shell. Four cards: the laser list spans the full row, the other
   three sit under it. Everything specific to the laser list lives in its own
   block further down, so these rules are scoped away from it and the two
   never fight in the cascade. */
.prices{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,24px);align-items:start}
@media (max-width:900px){.prices{grid-template-columns:1fr;max-width:560px;margin-inline:auto}}
.price-card{background:#fff;border-radius:var(--r-l);padding:clamp(24px,2.6vw,34px)}
/* The laser card holds 22 areas in its own multi-column list, so it needs the
   whole row rather than one third of it. Sharing a 3-column grid with the three
   small cards left two thirds of a desktop screen empty while the list it
   contains squeezed into a column. The other three cards keep the grid. */
.price-laser{grid-column:1 / -1}
/* A sticky filter bar parks under the nav, so an anchored group heading would
   otherwise land underneath it. This reserves that height when scrolling to one. */
.pl-group-title,.pl-groups h3{scroll-margin-top:calc(var(--navh) + 86px)}
.price-card .cat{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--rose-text);direction:ltr;unicode-bidi:isolate;display:block;text-align:right}
.price-card h3{font-size:1.45rem;line-height:1.3;margin:var(--s2) 0 var(--s4)}
.price-card:not(.price-laser) li{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s3);padding:var(--s2) 0;border-top:1px solid var(--line-soft);font-size:.97rem;color:var(--ink-2)}
.price-card:not(.price-laser) li:last-child{border-bottom:1px solid var(--line-soft)}
.price-card:not(.price-laser) li b{font-weight:500;color:var(--ink);white-space:nowrap;display:inline-flex;align-items:baseline;gap:.15em}
.price-card:not(.price-laser) li b .num{font-family:var(--serif-la);font-size:1.25rem;font-weight:500}
.price-card:not(.price-laser) li b .cur{font-size:.78rem;color:var(--muted)}
.price-card:not(.price-laser) li b .from{font-size:.8rem;color:var(--muted);margin-inline-end:.1em}
.price-foot{margin:var(--s3) 0 0;font-size:.86rem;color:var(--muted)}

/* ============ ABOUT ============ */
.about-photo{aspect-ratio:4/5}
.sig{font-family:var(--serif-la);font-style:italic;font-size:1.4rem;color:var(--ink);margin:var(--s4) 0 var(--s5)}

/* ============ BEFORE / AFTER ============ */
.ba-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.5vw,32px) clamp(16px,2vw,28px)}
@media (max-width:1180px){.ba-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:900px){
  .ba-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:min(78vw,340px);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-inline:var(--gut);margin-inline:calc(var(--gut) * -1);scrollbar-width:none;overscroll-behavior-x:contain}
  .ba-grid::-webkit-scrollbar{display:none}
  .ba-item{scroll-snap-align:start}
}
.ba-item{display:flex;flex-direction:column;gap:10px}
.ba{position:relative;aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;background:var(--tint);--pos:50%;user-select:none;-webkit-user-select:none;touch-action:pan-y;cursor:ew-resize}
.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ba .after{clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.ba .line{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.12);pointer-events:none}
.ba .knob{position:absolute;top:50%;left:var(--pos);transform:translate(-50%,-50%);width:42px;height:42px;border-radius:50%;background:#fff;display:grid;place-items:center;pointer-events:none;box-shadow:0 8px 20px -6px rgba(0,0,0,.35);color:var(--ink)}
.ba .knob svg{width:18px;height:18px}
.ba input[type=range]{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;direction:ltr;-webkit-appearance:none;appearance:none;z-index:2;pointer-events:none}
.ba.is-dragging{cursor:grabbing}
.ba input[type=range]:focus-visible ~ .knob{outline:none;box-shadow:0 0 0 3px #fff,0 0 0 6px var(--ink)}
.ba .tagb{position:absolute;top:12px;font-size:.78rem;font-weight:500;letter-spacing:0;background:rgba(255,255,255,.92);padding:.3em .75em;border-radius:999px;pointer-events:none;z-index:1;color:var(--ink)}
.ba .tagb.b{right:12px}.ba .tagb.a{left:12px}
@media (max-width:900px){
  /* give the swipe-carousel the card surface back; the comparison slider lives on a bottom strip */
  .ba::after{content:"";position:absolute;inset-inline:0;bottom:0;height:64px;background:linear-gradient(to top,rgba(255,255,255,.28),transparent);pointer-events:none}
}
.ba-item h3{font-size:1.25rem}
.ba-item p{margin:0;color:var(--muted);font-size:.9rem}

/* ============ REVIEWS ============ */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,56px)}
@media (max-width:860px){.quotes{grid-template-columns:1fr;max-width:540px}}
.q{position:relative;padding-top:18px;border-top:1px solid rgba(17,17,17,.16)}
.stars{display:flex;gap:2px;color:var(--rose);margin-bottom:var(--s3)}
.stars svg{width:14px;height:14px}
.q p{font-family:var(--serif-he);font-size:1.15rem;line-height:1.55;margin:0 0 var(--s3)}
.q footer{font-size:.88rem;color:var(--muted)}
.q footer b{color:var(--ink);font-weight:500}
.rev-cta{margin-top:var(--s6);display:flex;align-items:center;gap:16px;flex-wrap:wrap;color:var(--muted);font-size:.94rem}

/* ============ FAQ ============ */
.faq-wrap{max-width:820px}
.faq-item{border-top:1px solid var(--line)}
.faq-item:last-of-type{border-bottom:1px solid var(--line)}
.faq-q{all:unset;box-sizing:border-box;display:flex;width:100%;justify-content:space-between;align-items:center;gap:var(--s4);padding:var(--s4) 2px;min-height:44px;cursor:pointer;font-family:var(--serif-he);font-size:1.2rem;font-weight:400;line-height:1.35}
.faq-q:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.faq-q:hover{color:var(--rose-text)}
.faq-q .pm{flex:none;width:30px;height:30px;border-radius:50%;border:1px solid var(--ink);display:grid;place-items:center;color:var(--ink);position:relative;transition:background .25s,color .25s}
.faq-q .pm::before,.faq-q .pm::after{content:"";position:absolute;background:currentColor;transition:transform .3s var(--ease)}
.faq-q .pm::before{width:11px;height:1.5px}.faq-q .pm::after{width:1.5px;height:11px}
.faq-q[aria-expanded="true"] .pm{background:var(--ink);color:#fff}
.faq-q[aria-expanded="true"] .pm::after{transform:rotate(90deg)}
.faq .a{padding:0 2px var(--s4);color:var(--ink-2);max-width:62ch}
.faq .a p{margin:0 0 1.35em}.faq .a p:last-child{margin:0}
.faq-tabs{display:flex;gap:var(--s2);overflow-x:auto;padding:var(--s1);margin:calc(var(--s1) * -1) calc(var(--s1) * -1) calc(var(--s3) - var(--s1));scroll-padding-inline:var(--s2);scrollbar-width:none;-webkit-overflow-scrolling:touch}
.faq-tab:focus-visible{outline:3px solid var(--ink);outline-offset:-3px}
.faq-tab[aria-selected="true"]:focus-visible{outline-color:#fff}
.faq-tabs::-webkit-scrollbar{display:none}
@media (max-width:760px){.faq-tabs{margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut);-webkit-mask-image:linear-gradient(to left,#000 84%,transparent);mask-image:linear-gradient(to left,#000 84%,transparent)}}
.faq-tab{flex:none;border:1px solid var(--line-ui);border-radius:999px;padding:.55em 1.1em;min-height:44px;display:inline-flex;align-items:center;font-size:.92rem;font-weight:500;color:var(--ink);background:#fff;white-space:nowrap;transition:background .2s,border-color .2s,color .2s}
.faq-tab:hover{border-color:var(--ink)}
.faq-tab[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.faq-panel[hidden]{display:none}

/* ============ CONTACT (form) ============ */
.contact-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(28px,5vw,80px);align-items:start}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr;gap:var(--s6)}}
.form-card{background:#fff;border-radius:var(--r-l);padding:clamp(22px,3vw,36px);margin-top:var(--s5);display:flex;flex-direction:column;gap:var(--s4)}
.form-card[hidden]{display:none}
.f-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4)}
@media (max-width:560px){.f-grid{grid-template-columns:1fr}}
.field{display:flex;flex-direction:column;gap:var(--s1)}
.field label{font-size:.9rem;font-weight:500;color:var(--ink)}
.field .opt{font-weight:400;color:var(--muted);font-size:.84rem;margin-inline-start:.4em}
.field :is(input,select,textarea){width:100%;min-height:50px;padding:.7em .95em;border:1px solid var(--line-ui);border-radius:12px;background:#fff;font:inherit;font-size:1rem;color:var(--ink);transition:border-color .2s,box-shadow .2s}
.field :is(input,select,textarea):focus-visible{outline:0;border-color:var(--ink);box-shadow:0 0 0 3px var(--rose-tint)}
.field ::placeholder{color:var(--taupe);opacity:1}
.field input[dir="ltr"]{text-align:start}
.field select{appearance:none;-webkit-appearance:none;padding-inline-end:.95em;padding-inline-start:2.4em;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>");background-repeat:no-repeat;background-size:16px;background-position:left .9em center;cursor:pointer}
.field select:invalid,.field select option[value=""]{color:var(--muted)}
.field textarea{min-height:110px;resize:vertical;line-height:1.55}
.field.is-err :is(input,select,textarea){border-color:#9F2E2E}
.err{margin:0;font-size:.86rem;color:#9F2E2E}
.err[hidden]{display:none}
.f-foot{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3) var(--s4);padding-top:var(--s2);border-top:1px solid var(--line-soft)}
.f-foot .btn{flex:none}
.f-note{margin:0;font-size:.86rem;color:var(--muted);max-width:34ch;line-height:1.5}
@media (max-width:560px){.f-foot .btn{width:100%} .f-note{max-width:none}}
.f-done{gap:var(--s2)}
.f-done h3{font-size:1.5rem}
.f-done p{margin:0;color:var(--ink-2);max-width:48ch}
.f-done .link{text-decoration:underline;text-underline-offset:3px;color:var(--ink)}
.c-info{padding-top:var(--s2)}
@media (min-width:901px){.c-info{padding-top:calc(var(--s7) + var(--s2))}}
.c-tel{font-family:var(--serif-la);font-size:clamp(2rem, 1.5rem + 2vw, 3rem);font-weight:500;color:var(--ink);letter-spacing:.02em;direction:ltr;unicode-bidi:isolate;line-height:1.1;font-variant-numeric:lining-nums;display:inline-block}
.c-tel:hover{color:var(--rose-text)}
.contact-rows{margin-top:var(--s5)}
.contact-rows b{font-size:.78rem;letter-spacing:0;color:var(--muted);font-weight:500;font-family:var(--sans)}
.contact-rows .v{font-family:var(--serif-he);font-size:1.3rem;line-height:1.35;color:var(--ink)}
.contact-rows .v a{display:inline-flex;align-items:center;min-height:44px}
.contact-rows .v a:hover{color:var(--rose-text)}
.contact-rows small{display:block;color:var(--muted);font-size:.88rem}
.contact-rows small a{text-decoration:underline;text-underline-offset:3px}
.c-btns{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s3)}

/* ============ LEGAL ============ */
.legal{border-top:1px solid var(--line)}
.legal-wrap{padding-block:var(--s4) var(--s6)}
.legal details{max-width:900px;border-bottom:1px solid var(--line-soft)}
.legal details:last-of-type{border-bottom:0}
.legal summary{cursor:pointer;padding:12px 0;list-style:none;min-height:44px;display:flex;align-items:center}
.legal summary h2{font-family:var(--serif-he);font-size:1.1rem;font-weight:400;margin:0;display:inline-flex;align-items:center;gap:.6em}
.legal summary::-webkit-details-marker{display:none}
.legal summary svg{width:20px;height:20px;color:var(--rose);flex:none}
.legal .a{color:var(--ink-2);font-size:.94rem;padding-bottom:var(--s4);max-width:80ch}
.legal .a ul{list-style:disc;padding-inline-start:1.3em;margin:.5em 0}
.legal .a li{margin-bottom:.35em}
.legal .a h3{font-family:var(--sans);font-size:.95rem;font-weight:600;margin:1.1em 0 .3em;color:var(--ink)}
.legal .a a{text-decoration:underline;text-underline-offset:3px}

/* ============ FOOTER ============ */
.footer{border-top:1px solid var(--line);padding-block:var(--sec-t) calc(var(--s6) + env(safe-area-inset-bottom));color:var(--muted);font-size:.9rem}
.footer-top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:var(--s6);align-items:start}
@media (max-width:760px){.footer-top{grid-template-columns:1fr}}
.footer h3{font-family:var(--sans);font-size:.78rem;font-weight:600;letter-spacing:0;color:var(--muted);margin:0 0 var(--s2)}
.footer .col{display:flex;flex-direction:column;gap:2px;color:var(--ink);font-size:.95rem}
.footer .col > *{align-self:flex-start}
.footer .col a{display:inline-flex;align-items:center;min-height:36px}
.footer .col a:hover{color:var(--rose-text)}
.footer .col small{color:var(--muted);font-size:.85rem}
.footer-logo{height:120px;width:auto}
.footer-sub{font-size:.9rem;color:var(--muted);margin-top:var(--s3)}
.footer .disc{margin-top:var(--s5);font-size:.82rem;line-height:1.6;max-width:90ch}
@media (max-width:960px){.footer{padding-bottom:calc(150px + env(safe-area-inset-bottom))}} /* clears the sticky bar AND the floating a11y button above it */

/* ============ MOBILE STICKY CTA ============ */
.m-bar{display:none}
@media (max-width:960px){
  .m-bar{display:grid;grid-template-columns:1.6fr 1fr;gap:10px;position:fixed;inset-inline:0;bottom:0;z-index:60;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.94);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);transform:translateY(110%);visibility:hidden;transition:transform .4s var(--ease), visibility 0s .4s}
  .m-bar.show{transform:none;visibility:visible;transition-delay:0s,0s}
  .m-bar .btn{min-height:48px;padding-inline:1em;font-size:.95rem}
  /* outside opening hours WhatsApp leads: equal columns so "התקשרי אליי" stays on one line */
  .m-bar.wa-first{grid-template-columns:1fr 1fr}
}

/* ============ A11Y WIDGET ============ */
.a11y-btn{position:fixed;inset-inline-end:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:70;width:48px;height:48px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;box-shadow:0 10px 24px -10px rgba(0,0,0,.45)}
.a11y-btn svg{width:24px;height:24px}
@media (max-width:960px){.a11y-btn{bottom:calc(82px + env(safe-area-inset-bottom))}}
.a11y-panel{position:fixed;inset-inline-end:16px;bottom:calc(76px + env(safe-area-inset-bottom));z-index:71;width:min(320px, calc(100vw - 32px));background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:0 30px 60px -30px rgba(0,0,0,.35);padding:16px;display:none;max-height:calc(100dvh - 120px);overflow-y:auto}
.a11y-panel[data-open="true"]{display:block}
@media (max-width:960px){.a11y-panel{bottom:calc(142px + env(safe-area-inset-bottom));max-height:calc(100dvh - 180px)}}
.a11y-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.a11y-head h2{font-family:var(--sans);font-size:1rem;font-weight:600;margin:0}
.a11y-head .x{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line-ui)}
.a11y-head .x svg{width:16px;height:16px}
.a11y-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.a11y-grid button{border:1px solid var(--line-ui);border-radius:var(--r-s);padding:10px 8px;font-size:.86rem;font-weight:500;min-height:48px;display:flex;flex-direction:column;align-items:center;gap:4px;background:var(--tint);transition:border-color .2s}
.a11y-grid button:hover{border-color:var(--ink)}
.a11y-grid button[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.a11y-grid button svg{width:20px;height:20px}
.a11y-panel .reset{width:100%;margin-top:8px;border:1px solid var(--line-ui);border-radius:var(--r-s);padding:10px;font-size:.86rem;min-height:44px;background:#fff}
.a11y-panel .lnk{display:block;text-align:center;margin-top:8px;font-size:.85rem;color:var(--rose-text);text-decoration:underline;min-height:44px;line-height:44px}
/* high-contrast mode: token override + targeted fixes */
html.a11y-contrast{--line:#000;--line-soft:#000;--muted:#000;--ink-2:#000;--rose:#7A3B22;--rose-text:#7A3B22;--rose-deep:#7A3B22;--tint:#fff;--tint-2:#fff;--taupe:#000}
html.a11y-contrast body{background:#fff;color:#000}
html.a11y-contrast 
html.a11y-contrast :is(.form-card,.price-card,.a11y-panel,.q,.tile figure,.topbar,.offer,.ba .tagb,.a11y-grid button,.m-bar,.faq-tab){background:#fff!important;border:1px solid #000!important}
html.a11y-contrast .faq-tab[aria-selected="true"]{background:#000!important;color:#fff!important}
html.a11y-contrast .tiles-more span{border:2px solid #000!important;color:#000!important}
html.a11y-contrast .btn-primary{background:#000;color:#fff}
html.a11y-contrast .a11y-grid button[aria-pressed="true"]{background:#000!important;color:#fff!important;border-color:#000!important}
html.a11y-contrast :is(.nav,.nav.is-open .nav-links){background:#fff!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;border-bottom:1px solid #000!important}
html.a11y-contrast{--line-ui:#000}
html.a11y-contrast :is(.stars,.price-card .cat,.tile .tag,.contact-rows b,.a11y-panel .lnk,.nav-phone svg,.offer span){color:#7A3B22!important}
html.a11y-links a{text-decoration:underline!important}
html.a11y-font *{font-family:Arial,Helvetica,sans-serif!important;font-style:normal!important}
html.a11y-motion *, html.a11y-motion *::before, html.a11y-motion *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
html.a11y-motion .reveal{opacity:1!important;transform:none!important}
html.a11y-fs1{font-size:112.5%}html.a11y-fs2{font-size:125%}html.a11y-fs3{font-size:137.5%}

/* ============ REVEAL / MISC ============ */
.js .reveal{opacity:0;transform:translateY(14px);transition:opacity .9s var(--ease), transform .9s var(--ease);transition-delay:calc(var(--i,0) * 80ms)}
.js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none;transition:none} *{transition-duration:.01ms!important;animation-duration:.01ms!important}}
main section[id],#accessibility,#privacy,#terms{scroll-margin-top:84px}
@media print{
  .topbar,.nav,.m-bar,.a11y-btn,.a11y-panel,.marquee,.skip,.c-btns,.hero-ctas,.rev-cta,.offer,.form-card{display:none!important}
  .reveal{opacity:1!important;transform:none!important}
  body{background:#fff;color:#000}
  .faq .a,.faq-panel{display:block!important}
  .faq-tabs{display:none!important}
  .faq-panel > .sr-only{position:static!important;width:auto;height:auto;clip:auto;margin:0;overflow:visible;white-space:normal;font-family:var(--serif-he);font-size:1.25rem;font-weight:300;padding:16px 0 4px;border-top:1px solid #ccc}
  .faq-panel{break-inside:avoid-page}
  .faq-q .pm{display:none}
  .footer .col a[href^="http"]::after{content:" (" attr(href) ")";font-size:.8em;color:#555}
}
.skip{position:absolute;top:-100px;inset-inline-start:16px;z-index:100;background:var(--ink);color:#fff;padding:12px 18px;border-radius:0 0 var(--r-s) var(--r-s);font-weight:600}
.skip:focus{top:0;outline:3px solid #fff;outline-offset:-6px}
main:focus{outline:none}

/* ─────────────────────────────────────────────────────────────────────────
   THE LASER PRICE LIST

   Rebuilt a second time, and this time the structure moved, not the paint.

   The problem was never the colours. It was that thirty-three areas in one
   undifferentiated list cannot be scanned. Someone looking for בית שחי had
   to read the whole thing. So:

   1. The areas are grouped by region of the body — five blocks, three to
      seven rows each. You find your region by its shape, then read three
      rows. Nothing here is longer than a glance.

   2. The legend is on the columns it names. The two small words נשים and
      גברים sit on every group header, directly above the rail underneath
      them. You learn the colours once in the first group and after that
      they are simply part of the rhythm — you never look back up.

   3. One filter, not two lists. The page still opens on one list carrying
      both prices, exactly as Liel asked. The chips only quiet the rows and
      the numbers that are not yours. One markup, one source of truth, and
      a printed page always carries everything (see the beforeprint hook).
      The chips stay with you as you scroll, parked under the top bar.

   4. A price that is the same for both is one number, centred across both
      rails with a soft wash behind it. Position and the column words carry
      that meaning, so it survives the site's own high-contrast mode where
      every colour collapses to black.

   5. The packages sit above the areas, because the real decision a person
      makes here is one area against a whole-body session, not which of
      twenty-two rows to read.

   Note on --pw / --pm: these used to be called --w and --m. :root already
   defines --w:1280px for .wrap, and the old names only avoided a site-wide
   layout break because they were scoped inside this card. Renamed so that
   trap is gone for good.
   ───────────────────────────────────────────────────────────────────────── */

.price-laser{
  --pw:#8E4258;                    /* plum  — the price for women */
  --pm:#4A6B73;                    /* slate — the price for men   */
  --wash:rgba(184,115,90,.10);     /* the soft ground under a shared price */
  --dot:rgba(17,17,17,.20);
  --col:58px;                      /* one price rail */
  --pad:clamp(24px,2.6vw,34px);    /* must equal .price-card padding */
  --navh:72px;                     /* .nav-in min-height */
  grid-column:1/-1;
}
@media (min-width:901px){.price-laser{--col:64px}}
.price-laser h3{margin-bottom:var(--s2)}

/* ---------- the one sentence the colours need, read once ---------- */
.pl-key{margin:0;font-size:.92rem;line-height:1.7;color:var(--muted);max-width:66ch}
.pk-w,.pk-m{display:none}
.price-laser[data-view="w"] .pk-all,
.price-laser[data-view="m"] .pk-all{display:none}
.price-laser[data-view="w"] .pk-w,
.price-laser[data-view="m"] .pk-m{display:inline}

/* ---------- the filter, which stays with you as you scroll ----------
   .nav is sticky at top:0 with a 72px bar, so this parks directly under it.
   It is a direct child of the card so it stays available for the whole list,
   and it bleeds to the card's padding edges so rows pass cleanly beneath. */
.pl-filter{display:none}
html.js .pl-filter{
  display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2);
  position:sticky;top:calc(var(--navh) - 1px);z-index:40;
  background:#fff;
  margin:var(--s4) calc(var(--pad) * -1) 0;
  padding:var(--s3) var(--pad);
  border-bottom:1px solid var(--line-soft);
}
@media (max-width:620px){
  html.js .pl-filter{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s1)}
  .pf-label{display:none}
  .pf{padding-inline:.5em;gap:.4em}
}
.pf-label{font-size:.9rem;color:var(--muted);margin-inline-end:var(--s1)}
.pf{
  border:1px solid var(--line-ui);border-radius:999px;
  padding:.5em 1.05em;min-height:44px;
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  font-size:.93rem;font-weight:500;color:var(--ink);background:#fff;white-space:nowrap;
  transition:background .22s var(--ease),border-color .22s var(--ease),color .22s var(--ease);
}
.pf:hover{border-color:var(--ink)}
.pf i{width:8px;height:8px;border-radius:50%;background:currentColor;flex:none}
.pf-all i{color:var(--taupe)}
.pf-w i{color:var(--pw)}
.pf-m i{color:var(--pm)}
.pf[aria-checked="true"]{color:#fff;border-color:transparent}
.pf[aria-checked="true"] i{color:#fff;opacity:.85}
.pf-all[aria-checked="true"]{background:var(--ink)}
.pf-w[aria-checked="true"]{background:var(--pw)}
.pf-m[aria-checked="true"]{background:var(--pm)}

/* ---------- the packages, above the areas ---------- */
.pl-bundles{
  margin-top:var(--s5);
  background:var(--tint);border-radius:var(--r);
  padding:clamp(20px,2.2vw,28px) clamp(20px,2.4vw,30px);
  display:grid;gap:var(--s4) clamp(28px,4vw,60px);
  grid-template-columns:minmax(0,1fr) minmax(300px,46%);
  align-items:center;
}
@media (max-width:820px){.pl-bundles{grid-template-columns:1fr;gap:var(--s3)}}
.pl-bundles h4{font-family:var(--serif-he);font-weight:400;font-size:1.28rem;line-height:1.3;color:var(--ink)}
.pl-bundles p{margin:var(--s2) 0 0;font-size:.93rem;line-height:1.7;color:var(--ink-2);max-width:46ch}
.pl-tiles{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2)}
.pl-tile{background:#fff;border-radius:var(--r-s);padding:var(--s3) var(--s4)}
.pl-tname{display:block;font-family:var(--serif-he);font-size:1.1rem;line-height:1.3;color:var(--ink);margin-bottom:var(--s2)}
.pl-tps{display:flex;column-gap:var(--s5)}
.pl-tp{display:flex;flex-direction:column;align-items:flex-start;line-height:1.1}
.pl-tp em{font-style:normal;font-size:.66rem;font-weight:600;letter-spacing:.04em;margin-bottom:.45em}
.pl-tp b{font-weight:500;display:inline-flex;align-items:baseline;gap:.12em;white-space:nowrap}
.pl-tp .num{font-family:var(--serif-la);font-size:1.5rem;font-weight:500;line-height:1}
.pl-tp .cur{font-size:.74rem;opacity:.62}
.pl-tp.w{color:var(--pw)}
.pl-tp.m{color:var(--pm)}
/* the pair still has to read as a pair, so on a phone they stack rather than
   squeeze: a name like גוף קומפלט has no room beside two captioned prices */
@media (max-width:560px){.pl-tiles{grid-template-columns:1fr}}

/* ---------- the areas, five regions ---------- */
.pl-groups{margin-top:var(--s5);column-gap:clamp(30px,4vw,64px)}
@media (min-width:901px){.pl-groups{column-count:2}}
@media (min-width:1120px){.pl-groups{column-count:3}}
.pl-grp{break-inside:avoid;-webkit-column-break-inside:avoid;margin-bottom:var(--s5)}
.pl-grp:last-child{margin-bottom:0}
.pl-head{display:flex;align-items:baseline;gap:var(--s3);padding-bottom:var(--s2);border-bottom:1px solid var(--line)}
.pl-head h4{flex:1;min-width:0;font-family:var(--serif-he);font-weight:400;font-size:1.1rem;line-height:1.3;color:var(--ink)}
/* the legend, sitting on the very rails it names */
.pl-cols{display:grid;grid-template-columns:var(--col) var(--col);flex:none}
.pl-cols span{text-align:end;font-size:.7rem;font-weight:600;letter-spacing:.02em;line-height:1}
.c-w{color:var(--pw)}
.c-m{color:var(--pm)}

.pl-row{display:flex;align-items:baseline;padding:9px 0;font-size:.96rem;color:var(--ink-2)}
.pl-row + .pl-row{border-top:1px solid var(--line-soft)}
.pl-area{flex:none;max-width:64%}
.pl-dots{flex:1;min-width:12px;align-self:center;border-bottom:1px dotted var(--dot);margin-inline:var(--s2);transform:translateY(-2px)}
.pl-rail{display:grid;grid-template-columns:var(--col) var(--col);align-items:baseline;flex:none}
.pl-p{display:inline-flex;align-items:baseline;justify-content:flex-end;gap:.12em;font-weight:500;white-space:nowrap}
.pl-p .num{font-family:var(--serif-la);font-size:1.26rem;font-weight:500;line-height:1}
.pl-p .cur{font-size:.78rem;opacity:.62}
.p-w{grid-column:1;color:var(--pw)}
.p-m{grid-column:2;color:var(--pm)}
/* one price for both: it spans both rails and sits between them, so the
   meaning is carried by where it is. The wash is drawn by a pseudo-element
   so it costs the row no height, and it is only decoration on top. */
.p-both{grid-column:1 / span 2;justify-self:center;color:var(--ink);position:relative}
.p-both::before{content:"";position:absolute;inset:-3px -8px;border-radius:8px;background:var(--wash)}
.p-both > span{position:relative}

/* ---------- what the filter does ---------- */
.price-laser[data-view="w"] .pl-row[data-s="m"],
.price-laser[data-view="m"] .pl-row[data-s="w"]{display:none}
.price-laser[data-view="w"] .pl-grp:not([data-in~="w"]),
.price-laser[data-view="m"] .pl-grp:not([data-in~="m"]){display:none}
.price-laser[data-view="w"] .p-m,
.price-laser[data-view="m"] .p-w{display:none}
.price-laser[data-view="w"] .pl-tp.m,
.price-laser[data-view="m"] .pl-tp.w{display:none}
/* one column, one colour, nothing left to decode */
.price-laser[data-view="w"] .pl-cols,
.price-laser[data-view="m"] .pl-cols,
.price-laser[data-view="w"] .pl-tp em,
.price-laser[data-view="m"] .pl-tp em{display:none}
.price-laser[data-view="w"] .pl-rail,
.price-laser[data-view="m"] .pl-rail{grid-template-columns:var(--col)}
/* filtered down to one rail there is no "both" any more, so the shared price
   drops out of the middle and lines up with every other number in the column */
.price-laser[data-view="w"] .p-both,
.price-laser[data-view="m"] .p-both{grid-column:1;justify-self:end}
.price-laser[data-view="w"] .p-both::before,
.price-laser[data-view="m"] .p-both::before{display:none}
.price-laser[data-view="m"] .p-m{grid-column:1}
.price-laser[data-view="w"] .pl-p,
.price-laser[data-view="w"] .pl-tp{color:var(--pw)}
.price-laser[data-view="m"] .pl-p,
.price-laser[data-view="m"] .pl-tp{color:var(--pm)}

@media (max-width:420px){
  .pl-row{font-size:.92rem;padding:8px 0}
  .pl-p .num{font-size:1.16rem}
}

/* the page's own high-contrast mode: colour stops carrying meaning, so the
   column words and the centred position carry it instead */
html.a11y-contrast .price-laser{--pw:#000;--pm:#000;--dot:rgba(0,0,0,.5);--wash:transparent}
html.a11y-contrast .pl-filter{border-bottom:1px solid #000}
html.a11y-contrast .pf{background:#fff!important;border:1px solid #000!important;color:#000!important}
html.a11y-contrast .pf[aria-checked="true"]{background:#000!important;color:#fff!important;border-color:#000!important}
html.a11y-contrast .pf[aria-checked="true"] i{color:#fff!important}
html.a11y-contrast :is(.pl-bundles,.pl-tile){background:#fff!important;border:1px solid #000!important}
/* the wash cannot survive here, so the shared price gets the outline instead.
   Sitting between the two rails is a real signal but a quiet one; in a mode
   built out of black rules and boxes an outline is the plainest thing there is. */
html.a11y-contrast .p-both::before{background:transparent;border:1px solid #000}

/* a printed page always carries every price, whatever is on screen */
@media print{
  .pl-filter{display:none!important}
  .pl-groups{column-count:2}
}

/* ============ LINKS TO THE TREATMENT PAGES ============ */
/* each treatment tile is one link to its own page; the heading carries the link text */
.tiles-link .tile{position:relative}
.tiles-link .tile h3 a::after{content:"";position:absolute;inset:0;z-index:1}
.tiles-link .tile h3 a:focus-visible{outline:none}
.tiles-link .tile:focus-within{outline:3px solid var(--ink);outline-offset:3px}
.faq-more{margin:var(--s4) 0 0}
.footer-top.has-4{grid-template-columns:1.3fr 1fr 1fr 1fr}
@media (max-width:1000px){.footer-top.has-4{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.footer-top.has-4{grid-template-columns:1fr}}


/* ─────────────────────────────────────────────────────────────────────────
   TREATMENT PAGES (lielorel.com/<treatment>/)
   Everything above this block is the homepage stylesheet, copied verbatim by
   _seo-src/build_pages.py, so a treatment page looks exactly like the page it
   came from. Only the rules below are new.
   ───────────────────────────────────────────────────────────────────────── */

/* breadcrumbs: a plain slash, because arrow glyphs mirror in RTL */
.crumbs{padding-top:var(--s3)}
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;column-gap:.55em;font-size:.86rem;color:var(--muted)}
.crumbs li{display:inline-flex;align-items:center;gap:.55em}
.crumbs li + li::before{content:"/";color:var(--taupe)}
.crumbs a{display:inline-flex;align-items:center;min-height:36px;color:var(--ink-2);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.crumbs a:hover{color:var(--rose-text)}
.crumbs [aria-current]{color:var(--ink)}

/* page hero: the words lead on every screen size, the picture follows */
.p-hero{padding-block:var(--s2) var(--sec-t)}
.p-hero .hero-grid{grid-template-columns:1.05fr 1fr;align-items:center}
.p-hero .hero-copy{padding:clamp(8px,2vw,32px) 0}
.p-hero .hero-copy .lead{max-width:31.455em} /* = 56ch in Heebo; em keeps the hero from re-wrapping while the Latin font loads */
.p-hero .photo{aspect-ratio:4/3;border-radius:var(--r-l)}
.p-hero .hero-meta{margin-top:var(--s4)}
@media (max-width:860px){
  .p-hero .hero-grid{grid-template-columns:1fr;gap:var(--s4)}
  .p-hero .hero-copy{padding:var(--s2) 0 0}
  .p-hero .photo{aspect-ratio:16/10}
}

/* what to know, next to the person who treats you */
.facts-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr);gap:clamp(28px,5vw,80px);align-items:start}
@media (max-width:900px){.facts-grid{grid-template-columns:1fr;gap:var(--s6)}}
.facts-grid .rows{margin-top:0}
.rows p a,.who p a,.lead a,.faq .a a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.rows p a:hover,.who p a:hover,.lead a:hover,.faq .a a:hover{color:var(--rose-text)}
.who{background:var(--tint);border-radius:var(--r-l);padding:clamp(20px,2.4vw,30px);display:flex;flex-direction:column;gap:var(--s3)}
.who .photo{aspect-ratio:4/5;width:min(100%,240px);border-radius:var(--r)}
.who h3{font-size:1.35rem}
.who p{margin:0;color:var(--ink-2);font-size:.98rem;line-height:1.75}
@media (min-width:901px){.who{position:sticky;top:96px}}

/* a single price card sits at the start of the row instead of stretching */
.prices-one{grid-template-columns:minmax(0,600px)}
.price-card li a{text-decoration:underline;text-underline-offset:3px}
.price-card li a:hover{color:var(--rose-text)}

/* before and after: three pairs on a desktop, the same swipe row on a phone */
.ba-grid.ba-3{grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){.ba-grid.ba-3{grid-template-columns:none}}

/* FAQ on a treatment page: one list of native disclosures, so every answer
   opens with or without JavaScript and stays in the document for search */
details.faq-item > summary{list-style:none}
details.faq-item > summary::-webkit-details-marker{display:none}
.faq-q .faq-h{font:inherit;margin:0;text-wrap:pretty}
details.faq-item[open] > .faq-q .pm{background:var(--ink);color:#fff}
details.faq-item[open] > .faq-q .pm::after{transform:rotate(90deg)}
details.faq-item > .a{padding:0 2px var(--s4)}
.faq-list details.faq-item:last-of-type{border-bottom:1px solid var(--line)}

/* the other treatments: the homepage tiles (.tiles-link makes each one a single link) */
.tiles-3{grid-template-columns:repeat(4,1fr)}
@media (max-width:1100px){.tiles-3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.tiles-3{grid-template-columns:1fr}}
.more-all{margin-top:var(--s5)}


@media print{
  details.faq-item > .a{display:block!important}
  .crumbs,.who .photo{display:none!important}
}
html.a11y-contrast .who{background:#fff!important;border:1px solid #000!important}