/* Look BM "Mirror": the salon mirror. Every photo is a mirror: a rounded card set a hand's width inside the screen, with
   a fine bevel line just inside its edge. Marcellus headlines (Marcellus SC in the letter pairing), Red Hat Text for text, one soft signature colour. */
@font-face{font-family:"Marcellus BM";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/marcellus-latin-ext-400-normal.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}
@font-face{font-family:"Marcellus BM";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/marcellus-latin-400-normal.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}
@font-face{font-family:"Marcellus SC BM";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/marcellus-sc-latin-ext-400-normal.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}
@font-face{font-family:"Marcellus SC BM";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/marcellus-sc-latin-400-normal.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}
@font-face{font-family:"RedHat BM";font-style:normal;font-weight:300 700;font-display:swap;src:url(fonts/red-hat-text-latin-ext-wght-normal.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}
@font-face{font-family:"RedHat BM";font-style:normal;font-weight:300 700;font-display:swap;src:url(fonts/red-hat-text-latin-wght-normal.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 (light palette silver; design.ts lists every palette and checks each text pair) and type:
   --fd = Marcellus (headlines, prices, names; Marcellus SC in the letter pairing), --ft = Red Hat Text (text),
   --inset = how far the mirrors sit inside the screen edge, --r = the mirror's corner, --bev = the bevel's inset */
:root{--bg:#e6e5e0;--bg2:#dcdad3;--ink:#1b1a18;--mute:#4f4d47;--line:#bcb9b0;--btn:#1b1a18;--onbtn:#f6f4ee;
  --sig:#f3e3a3;--onsig:#29230f;--wall:var(--sig);--onwall:var(--onsig);--wallh:var(--onsig);--glass:#fbfaf7;--onglass:#191714;--mute2:#5a564f;
  --w:1280px;--pad:clamp(20px,4vw,56px);--gap:clamp(88px,10vw,150px);
  --inset:clamp(10px,1.7vw,24px);--r:calc(clamp(20px,2.4vw,34px)*var(--tune-radius,1));--bev:clamp(8px,.9vw,12px);
  --fd:"Marcellus BM",Georgia,serif;--fq:"Marcellus BM",Georgia,serif;--ft:"RedHat BM",system-ui,sans-serif;--fts:calc(17px*var(--tune-size,1));
  --shade:28,25,22;
  --m-accent:var(--btn);--m-header-bg:var(--bg);
  --g-max:calc(var(--w) + 2 * var(--pad));--g-pad:var(--pad);--g-bg:var(--bg);--g-paper:var(--bg);--g-surface:var(--bg2);--g-ink:var(--ink);--g-muted:var(--mute);
  --g-line:var(--line);--g-accent:var(--btn);--g-on-accent:var(--onbtn);--g-radius:var(--r);--g-fd:var(--fd);--g-ft:var(--ft);--g-top:24px}
.f-letter{--fd:"Marcellus SC BM",Georgia,serif}

*,*::before,*::after{box-sizing:border-box}
html{background:var(--bg)}
body{overflow-wrap:anywhere;margin:0;background:var(--bg);color:var(--ink);font:400 var(--fts)/1.6 var(--ft);-webkit-font-smoothing:antialiased;overflow-x:clip;text-rendering:optimizeLegibility}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1px}
h1,h2,h3{overflow-wrap:break-word;margin:0;font-family:var(--fd);font-weight:400;letter-spacing:-.006em;line-height:1;text-wrap:balance}
h2{font-size:calc(clamp(40px,5.2vw,76px)*var(--tune-size,1))}
h3{font-size:calc(clamp(23px,2vw,27px)*var(--tune-size,1));font-weight:400;letter-spacing:-.005em;line-height:1.12}
p,figure,blockquote,dl,dd{margin:0}
p{text-wrap:pretty}
ul,ol{list-style:none;margin:0;padding:0}
.bm-w{max-width:var(--w);margin-inline:auto;padding-inline:var(--pad);box-sizing:content-box}
.bm-sr{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.bm-nw{white-space:nowrap}
.bm-k{font:500 calc(15px*var(--tune-size,1))/1.4 var(--ft);color:var(--mute);margin-bottom:10px}
.bm-skip{position:absolute;left:12px;top:-60px;background:var(--btn);color:var(--onbtn);padding:10px 16px;z-index:40;border-radius:999px}
.bm-skip:focus{top:12px}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}

/* ---------- the mirror ---------- */
.bm-mirror,.bm-mir{position:relative;overflow:hidden;border-radius:var(--r);isolation:isolate;background:var(--bg2)}
.bm-mirror-ph,.bm-mir-ph{position:absolute;inset:0;display:block}
.bm-mirror-ph img,.bm-mir-ph img{width:100%;height:100%;object-fit:cover}
.bm-mir{aspect-ratio:4/5}
/* the bevel: a fine line just inside the glass, with a faint sheen from the top left */
.bm-bevel{position:absolute;inset:var(--bev);border-radius:calc(var(--r) - var(--bev));border:1px solid rgba(255,255,255,.42);pointer-events:none;z-index:2;
  background:linear-gradient(128deg,rgba(255,255,255,.12),rgba(255,255,255,0) 30%)}
.bm-shade{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(var(--shade),.42) 0,rgba(var(--shade),0) 18%,rgba(var(--shade),0) 34%,rgba(var(--shade),.62) 64%,rgba(var(--shade),.86) 100%)}
@media (min-width:900px){
  .bm-shade{background:linear-gradient(180deg,rgba(var(--shade),.4) 0,rgba(var(--shade),0) 16%,rgba(var(--shade),0) 44%,rgba(var(--shade),.5) 70%,rgba(var(--shade),.82) 100%),
    linear-gradient(90deg,rgba(var(--shade),.42) 0,rgba(var(--shade),0) 62%)}
}
@media (min-width:900px){
  .bm-h-pair .bm-mirror-a .bm-shade{background:linear-gradient(180deg,rgba(var(--shade),.4) 0,rgba(var(--shade),0) 16%,rgba(var(--shade),0) 36%,rgba(var(--shade),.6) 64%,rgba(var(--shade),.86) 100%),
    linear-gradient(90deg,rgba(var(--shade),.52) 0,rgba(var(--shade),0) 66%)}
}
/* a label hung on the glass */
.bm-tag{position:absolute;left:calc(var(--bev) + 10px);bottom:calc(var(--bev) + 10px);z-index:3;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;max-width:calc(100% - 2 * var(--bev) - 20px);
  background:var(--glass);color:var(--onglass);border-radius:calc(22px*var(--tune-radius,1));padding:9px 16px 10px;font:500 calc(15px*var(--tune-size,1))/1.3 var(--ft);box-shadow:0 1px 2px rgba(var(--shade),.12),0 6px 18px rgba(var(--shade),.12)}
.bm-tag-n{color:var(--mute2);font-weight:400}

/* ---------- header: on the first mirror ---------- */
.bm-top{position:absolute;z-index:20;top:calc(var(--inset) + var(--bev) + 8px);left:calc(var(--inset) + var(--bev) + 10px);right:calc(var(--inset) + var(--bev) + 8px)}
.bm-top-in{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:46px}
.bm-name{font:400 calc(clamp(24px,2vw,30px)*var(--tune-size,1))/1 var(--fd);letter-spacing:-.01em;color:#fff;text-decoration:none;text-shadow:0 1px 14px rgba(var(--shade),.35)}
.bm-name svg,.bm-name img{max-height:40px;width:auto}
.bm-pill{display:none}
.bm-pill a,.bm-sheet a{text-decoration:none}
.bm-pill .langs,.bm-sheet .langs{display:flex;gap:2px}
.bm-pill .langs a,.bm-sheet .langs a{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;border-radius:999px;font:600 calc(13px*var(--tune-size,1))/1 var(--ft);letter-spacing:.04em;color:var(--mute2)}
.bm-pill .langs a[aria-current],.bm-sheet .langs a[aria-current]{color:var(--onglass);background:color-mix(in oklab,var(--onglass) 8%,transparent)}
.bm-menu summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:10px;height:46px;padding:0 20px;border-radius:999px;background:var(--glass);color:var(--onglass);font:600 calc(15px*var(--tune-size,1))/1 var(--ft);box-shadow:0 6px 18px rgba(var(--shade),.18)}
.bm-menu summary::-webkit-details-marker{display:none}
.bm-menu summary::before{content:"";width:16px;height:7px;border-block:1.5px solid currentColor}
.bm-menu[open] summary::before{height:0;border-bottom:0;transform:rotate(0)}
.bm-sheet{position:absolute;right:0;top:56px;width:min(320px,calc(100vw - 2 * var(--inset) - 30px));background:var(--glass);color:var(--onglass);border-radius:calc(24px*var(--tune-radius,1));padding:14px;box-shadow:0 2px 4px rgba(var(--shade),.1),0 18px 40px rgba(var(--shade),.24)}
.bm-sheet ul{display:grid}
.bm-sheet li a{display:flex;align-items:center;min-height:48px;padding:0 12px;border-radius:calc(14px*var(--tune-radius,1));font:400 calc(24px*var(--tune-size,1))/1.1 var(--fd)}
.bm-sheet li a[aria-current]{background:color-mix(in oklab,var(--onglass) 7%,transparent)}
.bm-sheet .bm-sheet-a a{margin-top:8px;justify-content:center;background:var(--btn);color:var(--onbtn);font:600 calc(16px*var(--tune-size,1))/1 var(--ft);border-radius:999px;min-height:50px}
.bm-sheet .langs{margin-top:10px;padding:8px 6px 0;border-top:1px solid color-mix(in oklab,var(--onglass) 12%,transparent)}
@media (min-width:900px){
  .bm-top{left:calc(var(--inset) + clamp(26px,2.6vw,40px));right:calc(var(--inset) + var(--bev) + 12px);top:calc(var(--inset) + var(--bev) + 12px)}
  .bm-menu{display:none}
  .bm-pill{display:flex;align-items:center;gap:6px;background:var(--glass);color:var(--onglass);border-radius:999px;padding:5px 5px 5px 26px;box-shadow:0 1px 2px rgba(var(--shade),.12),0 8px 24px rgba(var(--shade),.16)}
  .bm-pill ul{display:flex;align-items:center;gap:clamp(18px,2vw,28px)}
  .bm-pill li a{display:inline-flex;align-items:center;height:42px;font:500 calc(15px*var(--tune-size,1))/1 var(--ft)}
  .bm-pill li a:hover,.bm-pill li a[aria-current]{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.4em}
  .bm-pill .bm-pill-a a{padding:0 20px;border-radius:999px;background:var(--btn);color:var(--onbtn);font-weight:600}
  .bm-pill .bm-pill-a a:hover{text-decoration:none}
  .bm-pill .langs{margin-left:4px}
}
/* pages without a mirror (legal, 404): the header sits on the page */
.bm-plain .bm-top{position:relative;top:auto;left:auto;right:auto;padding:var(--inset) calc(var(--inset) + 14px) 0}
.bm-plain .bm-name{color:var(--ink);text-shadow:none}
.bm-plain .bm-pill,.bm-plain .bm-menu summary{box-shadow:none;border:1px solid var(--line)}

/* ---------- hero: mirror ---------- */
.bm-hero{padding:var(--inset)}
.bm-mirror-a{height:calc(100svh - 2 * var(--inset));min-height:560px;max-height:1120px}
.bm-hero-t{position:absolute;z-index:3;left:clamp(22px,3.4vw,58px);right:clamp(22px,3.4vw,58px);bottom:clamp(30px,4.6vw,66px);color:#fff}
.bm-kicker{font:500 calc(15px*var(--tune-size,1))/1.4 var(--ft);color:rgba(255,255,255,.94);margin-bottom:clamp(14px,1.6vw,22px);text-shadow:0 1px 10px rgba(var(--shade),.4)}
.bm-h1{font-size:calc(clamp(46px,7.8vw,118px)*var(--tune-size,1));line-height:.98;letter-spacing:-.02em;color:var(--sig);text-shadow:0 1px 24px rgba(var(--shade),.28)}
.bm-l{display:block}
.bm-lede{font-size:calc(clamp(17px,1.4vw,19px)*var(--tune-size,1));line-height:1.5;max-width:36ch;margin-top:clamp(18px,1.8vw,26px);color:rgba(255,255,255,.94);text-shadow:0 1px 10px rgba(var(--shade),.4)}
.bm-acts{margin-top:clamp(22px,2.2vw,32px)}
.bm-sig,.bm-btn{display:inline-flex;align-items:center;justify-content:center;height:54px;padding:0 30px;border-radius:999px;font:600 16px/1 var(--ft);text-decoration:none;white-space:nowrap}
.bm-sig{background:var(--sig);color:var(--onsig)}
.bm-btn{background:var(--btn);color:var(--onbtn);border:0;cursor:pointer}
@media (hover:hover){.bm-sig:hover,.bm-btn:hover{filter:brightness(1.06)}}

/* ---------- hero: mirror on the wall ----------
   The salon wall is painted in the signature colour; the mirror hangs on it and the words are written on the wall
   beside it (under it on phones and tablets), never on the photo. The pill nav stays inside the mirror. */
.bm-h-mirror{background:var(--wall);display:grid;grid-template-rows:minmax(360px,1fr) auto;min-height:100svh;max-height:1168px}
.bm-h-mirror .bm-mirror-a{height:auto;min-height:0;max-height:none}
.bm-h-mirror .bm-shade{background:linear-gradient(180deg,rgba(var(--shade),.4) 0,rgba(var(--shade),0) 22%)}
.bm-h-mirror .bm-hero-t{position:static;color:var(--onwall);padding:calc(clamp(26px,4vw,40px)*var(--tune-space,1)) clamp(12px,2.6vw,40px) clamp(14px,2vw,26px)}
.bm-h-mirror .bm-kicker,.bm-h-mirror .bm-lede{color:var(--onwall);text-shadow:none}
.bm-h-mirror .bm-h1{color:var(--wallh);text-shadow:none}
.bm-h-mirror .bm-sig{background:var(--btn);color:var(--onbtn)}
@media (min-width:1000px){
  .bm-h-mirror{grid-template-columns:minmax(0,.82fr) minmax(0,1fr);grid-template-rows:1fr;height:100svh;min-height:600px}
  .bm-h-mirror .bm-mirror-a{grid-column:2;grid-row:1}
  .bm-h-mirror .bm-hero-t{grid-column:1;grid-row:1;align-self:end;padding:0 clamp(32px,3.4vw,56px) var(--bev) clamp(26px,2.6vw,40px)}
  .bm-h-mirror .bm-h1{font-size:calc(clamp(46px,6.2vw,104px)*var(--tune-size,1))}
  .bm-h-mirror .bm-lede{max-width:34ch}
  .bm-pg-home.bm-hk-mirror .bm-name{color:var(--onwall);text-shadow:none}
}

/* ---------- hero: pair (two mirrors side by side, the words on the wide one) ---------- */
.bm-pair{display:grid;gap:var(--inset)}
.bm-pair .bm-mirror-b{display:none}
@media (min-width:1200px){
  /* the pill stays on the wide mirror (the narrow one is 1 / 2.62 of the row) */
  .bm-pg-home.bm-hk-pair .bm-top{right:calc(2 * var(--inset) + (100% - 3 * var(--inset)) / 2.62 + var(--bev) + 12px)}
  .bm-pair{grid-template-columns:1.62fr 1fr;height:calc(100svh - 2 * var(--inset));min-height:600px;max-height:1120px}
  .bm-pair .bm-mirror-a{height:auto;min-height:0;max-height:none}
  .bm-pair .bm-mirror-b{display:block;aspect-ratio:auto;height:100%}
  .bm-h-pair .bm-h1{font-size:calc(clamp(46px,6.4vw,104px)*var(--tune-size,1))}
}

/* ---------- section heads ---------- */
.bm-head{display:grid;gap:16px;margin-bottom:calc(clamp(32px,4vw,60px)*var(--tune-space,1))}
.bm-head p{color:var(--mute);font-size:calc(18px*var(--tune-size,1));max-width:46ch}
@media (min-width:900px){.bm-head{grid-template-columns:1.25fr 1fr;align-items:end;column-gap:6vw}.bm-head-s{grid-template-columns:1fr}}

/* ---------- the mirror wall (finished work) ---------- */
.bm-wall{margin-top:var(--gap)}
.bm-wall-l{display:grid;grid-auto-flow:column;grid-auto-columns:78%;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;
  margin-inline:calc(-1 * var(--pad));padding:0 var(--pad) 4px;scroll-padding-inline:var(--pad)}
.bm-wall-l::-webkit-scrollbar{display:none}
.bm-wall-l li{scroll-snap-align:start}
@media (min-width:600px) and (max-width:899.98px){.bm-wall-l{grid-auto-columns:46%}}
@media (min-width:900px){
  .bm-wall-l{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(220px,21vw,300px);gap:14px;overflow:visible;margin:0;padding:0}
  .bm-wall-l .bm-mir{aspect-ratio:auto;height:100%}
  .bm-wall-lead{grid-column:span 2;grid-row:span 2}
  .bm-n4 .bm-wall-l li:last-child{grid-column:span 2}
  .bm-n3 .bm-wall-l{grid-template-columns:repeat(3,1fr)}
}

/* ---------- services: list beside a mirror that stays in view ---------- */
.bm-svc{margin-top:var(--gap)}
.bm-svl{display:grid;gap:36px}
.bm-svl-m .bm-mir{aspect-ratio:5/4}
@media (min-width:900px){
  .bm-svl{grid-template-columns:5fr 7fr;gap:clamp(48px,6vw,104px);align-items:start}
  .bm-svl-m{position:sticky;top:var(--inset)}
  .bm-svl-m .bm-mir{aspect-ratio:4/5;max-height:calc(100svh - 2 * var(--inset))}
}
.bm-rows{border-top:1px solid var(--line)}
.bm-rows li{border-bottom:1px solid var(--line)}
.bm-rows a{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:6px 16px;padding:20px 0;text-decoration:none}
.bm-row-n,.bm-row-p{font:400 calc(21px*var(--tune-size,1))/1.15 var(--fd);letter-spacing:-.005em}
.bm-row-p{font-family:var(--fq)}
.bm-row-p{font-size:calc(19px*var(--tune-size,1))}
@media (min-width:600px){.bm-rows a{gap:6px 24px;padding:22px 0}.bm-row-n,.bm-row-p{font-size:calc(clamp(24px,2.1vw,30px)*var(--tune-size,1))}}
.bm-row-p{white-space:nowrap;font-variant-numeric:tabular-nums;text-align:right}
.bm-row-s{grid-column:1/-1;color:var(--mute);font-size:calc(16px*var(--tune-size,1));line-height:1.5}
.bm-dur{white-space:nowrap;margin-left:14px;color:var(--mute)}
@media (hover:hover){.bm-rows a:hover .bm-row-n{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.16em}}
.bm-more{margin-top:calc(clamp(28px,3vw,40px)*var(--tune-space,1))}

/* ---------- services: each in its own mirror ---------- */
.bm-svm{display:grid;gap:clamp(28px,3vw,40px) 14px}
.bm-svm .bm-mir{aspect-ratio:auto;height:clamp(300px,30vw,440px);margin-bottom:18px}
.bm-svm h3 a{text-decoration:none}
.bm-svm p{color:var(--mute);font-size:calc(16px*var(--tune-size,1));margin-top:6px}
.bm-svm .bm-dur{margin-left:10px}
.bm-svm .bm-tag{left:auto;right:calc(var(--bev) + 10px);bottom:auto;top:calc(var(--bev) + 10px);font:400 20px/1.1 var(--fq);white-space:nowrap}
@media (min-width:700px){
  .bm-svm{grid-template-columns:repeat(6,1fr)}
  .bm-svm li{grid-column:span 2}
  .bm-svm li:first-child{grid-column:span 4}
  .bm-svm.bm-n4 li:nth-child(n+3){grid-column:span 3}
  .bm-svm.bm-n3 li:last-child{grid-column:span 6}
  .bm-svm.bm-n2 li:last-child{grid-column:span 2}
  .bm-svm.bm-n1 li{grid-column:span 6}
}

/* ---------- what we use ---------- */
/* the first visit: three (or four) numbered steps on hairlines, figures in the headline face */
.bm-first{margin-top:var(--gap)}
.bm-fs{display:grid;gap:30px;list-style:none;margin:0;padding:0}
.bm-fs li{display:grid;grid-template-columns:52px 1fr;column-gap:16px;border-top:1px solid var(--line);padding-top:22px}
.bm-fs-n{grid-row:span 2;font:400 calc(46px*var(--tune-size,1))/.9 var(--fq);color:var(--ink);font-variant-numeric:lining-nums}
.bm-fs p{color:var(--mute);margin-top:8px;max-width:34ch}
@media (min-width:1000px){
  .bm-fs{grid-template-columns:repeat(3,1fr);gap:clamp(24px,3.4vw,52px)}
  .bm-fs.bm-n4{grid-template-columns:repeat(4,1fr)}
  .bm-fs li{grid-template-columns:1fr;padding-top:28px}
  .bm-fs-n{grid-row:auto;font-size:calc(clamp(60px,5.4vw,80px)*var(--tune-size,1));margin-bottom:clamp(20px,2.4vw,34px)}
}
.bm-prod{margin-top:var(--gap);display:grid;gap:36px}
.bm-prod-m{aspect-ratio:5/4}
.bm-prod-x{color:var(--mute);font-size:calc(18px*var(--tune-size,1));margin-top:18px;max-width:44ch}
.bm-prod-l{margin-top:calc(clamp(26px,3vw,40px)*var(--tune-space,1));border-top:1px solid var(--line)}
.bm-prod-l div{padding:18px 0;border-bottom:1px solid var(--line);display:grid;gap:4px}
.bm-prod-l dt{font:400 calc(clamp(22px,1.9vw,26px)*var(--tune-size,1))/1.15 var(--fd)}
.bm-prod-l dd{color:var(--mute);font-size:calc(16px*var(--tune-size,1))}
@media (min-width:900px){.bm-prod{grid-template-columns:7fr 5fr;gap:clamp(48px,6vw,104px);align-items:center}.bm-prod-m{order:2;aspect-ratio:4/5}}

/* ---------- the team's stations ---------- */
.bm-crew{margin-top:var(--gap)}
.bm-st{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(28px,3vw,40px) 14px}
@media (min-width:600px){.bm-st{grid-template-columns:repeat(4,1fr)}.bm-st.bm-n3{grid-template-columns:repeat(3,1fr)}.bm-st.bm-n3 .bm-st-m{aspect-ratio:4/5}}
.bm-st-m{position:relative;aspect-ratio:3/4;border-radius:var(--r);display:grid;place-items:center;overflow:hidden;
  background:linear-gradient(165deg,color-mix(in oklab,var(--sig) 62%,var(--bg2)) 0%,var(--bg2) 78%)}
.bm-st-m>span:first-child{font:400 calc(clamp(84px,10vw,150px)*var(--tune-size,1))/1 var(--fd);color:var(--ink);opacity:.82;transform:translateY(-.04em)}
.bm-st-m .bm-bevel{border-color:color-mix(in oklab,var(--glass) 70%,transparent)}
.bm-st h3{margin-top:18px}
.bm-st-r{color:var(--mute);font-size:calc(15px*var(--tune-size,1));margin-top:4px}
.bm-st-b{font-size:calc(16px*var(--tune-size,1));margin-top:10px}
.bm-st-a{display:inline-block;margin-top:12px;font-weight:600;font-size:calc(15px*var(--tune-size,1))}

/* ---------- reviews ---------- */
.bm-rv{margin-top:var(--gap)}
.bm-rv-score{display:grid;gap:32px}
.bm-score-k{font-size:calc(clamp(30px,3vw,40px)*var(--tune-size,1))}
.bm-score-n{font:400 calc(clamp(110px,13vw,190px)*var(--tune-size,1))/.82 var(--fq);letter-spacing:-.03em;margin-top:clamp(18px,2vw,28px)}
.bm-score-l{color:var(--mute);margin-top:14px;font-size:calc(16px*var(--tune-size,1));max-width:24ch}
.bm-q p,.bm-rv-l p{font:400 calc(clamp(28px,3.3vw,46px)*var(--tune-size,1))/1.18 var(--fq);letter-spacing:-.012em}
.bm-q figcaption,.bm-rv-l figcaption{color:var(--mute);margin-top:22px;font-size:calc(16px*var(--tune-size,1))}
.bm-q em,.bm-rv-l em{font-style:normal;background:color-mix(in oklab,var(--sig) 42%,transparent);padding:0 .1em;border-radius:calc(.12em*var(--tune-radius,1))}
@media (min-width:900px){.bm-rv-score{grid-template-columns:4fr 8fr;gap:clamp(48px,6vw,104px);align-items:start}}
.bm-rv-pair h2{margin-bottom:calc(clamp(28px,3vw,48px)*var(--tune-space,1))}
.bm-rv-l{display:grid;gap:40px}
.bm-rv-l p{font-size:calc(clamp(26px,2.4vw,34px)*var(--tune-size,1))}
.bm-rv-s{margin-top:36px;color:var(--mute)}
.bm-rv-s span{font:400 calc(44px*var(--tune-size,1))/1 var(--fq);color:var(--ink);margin-right:8px}
@media (min-width:900px){.bm-rv-l{grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,96px)}}

/* ---------- visit: a wide mirror with the card on its glass ---------- */
.bm-visit{margin-top:var(--gap);padding-inline:var(--inset);position:relative}
.bm-visit-m{height:min(70svh,640px);min-height:380px}
.bm-card{position:relative;z-index:3;margin:-72px 14px 0;background:var(--glass);color:var(--onglass);border-radius:calc(calc(var(--r) - 6px)*var(--tune-radius,1));padding:clamp(26px,3vw,40px);
  box-shadow:0 1px 2px rgba(var(--shade),.1),0 12px 32px rgba(var(--shade),.16)}
.bm-card h2{font-size:calc(clamp(36px,3.4vw,48px)*var(--tune-size,1))}
@media (min-width:600px) and (max-width:899.98px){.bm-card{margin:-120px calc(var(--inset) + 24px) 0 auto;max-width:460px}}
.bm-card-x{color:var(--mute2);margin-top:12px;font-size:calc(16px*var(--tune-size,1))}
.bm-addr{margin-top:20px;font:400 calc(24px*var(--tune-size,1))/1.25 var(--fq)}
.bm-card-c{display:flex;flex-wrap:wrap;gap:6px 20px;margin-top:12px;font-size:calc(16px*var(--tune-size,1))}
.bm-card .bm-k{color:var(--mute2);margin-top:24px}
.bm-hrs div{display:flex;justify-content:space-between;gap:16px;padding:7px 0;border-bottom:1px solid color-mix(in oklab,currentColor 14%,transparent);font-size:calc(16px*var(--tune-size,1))}
.bm-hrs dd{font-variant-numeric:tabular-nums;text-align:right}
.bm-shut{opacity:.72}
@media (min-width:900px){
  /* mirror and card share one grid cell: the card sits bottom right on the glass, and a tall card (map, week chart)
     makes the mirror taller instead of hanging over its edge */
  .bm-visit{display:grid}
  .bm-visit-m,.bm-card{grid-area:1/1}
  .bm-visit-m{height:auto;min-height:max(560px,min(86svh,860px))}
  .bm-card{justify-self:end;align-self:end;margin:clamp(18px,3vw,48px);width:min(440px,40%)}
  .bm-card-wk{width:min(520px,46%)}
}
.wk{font:500 calc(14px*var(--tune-size,1))/1.2 var(--ft);margin-top:4px}
.wk ol{display:grid;gap:9px}
.wk li{display:grid;grid-template-columns:2.6em 1fr 7.2em;align-items:center;gap:12px}
.wk-bar{position:relative;height:8px;border-radius:99px;background:color-mix(in oklab,var(--onglass) 10%,transparent)}
.wk-bar i{position:absolute;top:0;bottom:0;border-radius:99px;background:var(--btn)}
.wk-t{text-align:right;font-variant-numeric:tabular-nums}
.wk .off{opacity:.65}
.wk-scale{display:flex;justify-content:space-between;margin:8px 7.2em 0 2.6em;padding-inline:12px;color:var(--mute2);font-size:calc(13px*var(--tune-size,1))}

/* ---------- closing ---------- */
.bm-end{margin-top:var(--gap);text-align:center}
.bm-end h2{font-size:calc(clamp(48px,7vw,108px)*var(--tune-size,1));line-height:.95;max-width:14ch;margin-inline:auto}
.bm-end-x{color:var(--mute);font-size:calc(18px*var(--tune-size,1));max-width:42ch;margin:22px auto 0}
.bm-end-a{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:16px 28px;margin-top:calc(clamp(28px,3vw,40px)*var(--tune-space,1))}
.bm-end-tel{font:400 clamp(24px,2vw,28px)/1 var(--fq);text-decoration:none;white-space:nowrap}
.bm-end-m{padding-inline:var(--inset);text-align:left}
.bm-end-mm{height:min(76svh,760px);min-height:460px}
.bm-end-t{position:absolute;z-index:3;left:clamp(22px,3.4vw,58px);right:clamp(22px,3.4vw,58px);bottom:clamp(30px,4.6vw,66px);color:#fff}
.bm-end-m h2{color:var(--sig);margin:0;max-width:12ch}
.bm-end-m .bm-end-x{color:rgba(255,255,255,.94);margin:18px 0 0}
.bm-end-m .bm-end-a{justify-content:flex-start}
.bm-end-m .bm-end-tel{color:#fff}

/* ---------- footer ---------- */
.bm-foot{margin-top:var(--gap);background:var(--bg2);padding:calc(clamp(48px,6vw,80px)*var(--tune-space,1)) 0 calc(40px*var(--tune-space,1));font-size:calc(16px*var(--tune-size,1))}
.bm-foot-in{display:grid;gap:36px}
.bm-foot-n{font:400 calc(32px*var(--tune-size,1))/1 var(--fd);margin-bottom:14px}
.bm-foot p{margin-bottom:4px}
.bm-foot a{text-decoration-color:color-mix(in oklab,currentColor 40%,transparent)}
.bm-foot-h .bm-hrs{max-width:300px}
.bm-legal-l{display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:12px}
.bm-foot .langs{display:flex;gap:12px;margin-bottom:12px}
.bm-foot .langs a[aria-current]{font-weight:700;text-decoration:none}
.bm-foot-f{color:var(--mute)}
@media (min-width:600px){.bm-foot-in{grid-template-columns:1fr 1fr}}
@media (min-width:900px){.bm-foot-in{grid-template-columns:1.2fr 1fr 1fr}}

/* ---------- inner pages ---------- */
.bm-page{padding:var(--inset)}
.bm-page-m{height:clamp(460px,66svh,700px)}
.bm-page-t{position:absolute;z-index:3;left:clamp(22px,3.4vw,58px);right:clamp(22px,3.4vw,58px);bottom:clamp(30px,4.6vw,66px);color:#fff}
.bm-page .bm-h1{font-size:calc(clamp(40px,6.6vw,100px)*var(--tune-size,1))}
.bm-items{margin-top:var(--gap)}
.bm-item{display:grid;gap:28px;margin-bottom:calc(clamp(72px,8vw,128px)*var(--tune-space,1));scroll-margin-top:24px}
.bm-item-m{aspect-ratio:5/4}
.bm-item-t h2{font-size:calc(clamp(38px,4.2vw,60px)*var(--tune-size,1))}
.bm-item-t>p{margin-top:18px;max-width:52ch}
.bm-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:0 24px;margin-top:28px;border-top:1px solid var(--line)}
.bm-facts div{padding:14px 0;border-bottom:1px solid var(--line)}
.bm-facts dt{color:var(--mute);font-size:calc(15px*var(--tune-size,1))}
.bm-facts dd{font:400 calc(20px*var(--tune-size,1))/1.25 var(--fq);margin-top:4px;overflow-wrap:break-word}
.bm-item .bm-tag{font:400 20px/1.1 var(--fq);white-space:nowrap}
@media (min-width:900px){.bm-item{grid-template-columns:1fr 1fr;gap:clamp(48px,6vw,104px);align-items:center}.bm-item-r .bm-item-m{order:2}}
.bm-prices{margin-top:calc(var(--gap) * -.2)}
.bm-plist{margin-top:28px;border-top:1px solid var(--line);max-width:760px}
.bm-plist div{display:flex;justify-content:space-between;gap:20px;padding:18px 0;border-bottom:1px solid var(--line);font:400 calc(24px*var(--tune-size,1))/1.2 var(--fd)}
.bm-plist dd{white-space:nowrap;font-family:var(--fq)}
.bm-faq{margin-top:var(--gap)}
.bm-faq h2{margin-bottom:calc(clamp(28px,3vw,44px)*var(--tune-space,1))}
.bm-faq details{border-top:1px solid var(--line)}
.bm-faq details:last-child{border-bottom:1px solid var(--line)}
.bm-faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;padding:22px 0;font:400 calc(clamp(22px,2vw,27px)*var(--tune-size,1))/1.2 var(--fd)}
.bm-faq summary::-webkit-details-marker{display:none}
.bm-faq summary::after{content:"+";font:400 calc(30px*var(--tune-size,1))/.8 var(--fd);color:var(--mute)}
.bm-faq details[open] summary::after{content:"–"}
.bm-faq details p{padding:0 0 24px;max-width:60ch;color:var(--mute)}
.bm-faq-open dl{display:grid;gap:32px}
.bm-faq-open dt{font:400 calc(24px*var(--tune-size,1))/1.2 var(--fd)}
.bm-faq-open dd{color:var(--mute);margin-top:8px}
@media (min-width:900px){.bm-faq-open dl{grid-template-columns:1fr 1fr;gap:40px 6vw}}
.bm-next{margin-top:calc(clamp(56px,6vw,96px)*var(--tune-space,1));text-align:center}
.bm-crew-l{margin-top:var(--gap)}
.bm-crew-l h2{margin-bottom:calc(clamp(28px,3vw,44px)*var(--tune-space,1))}
.bm-crew-l ul{border-top:1px solid var(--line)}
.bm-crew-l li{display:grid;gap:4px 32px;padding:24px 0;border-bottom:1px solid var(--line)}
@media (min-width:900px){.bm-crew-l li{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr) minmax(0,2fr) minmax(0,11rem);align-items:baseline}.bm-crew-l .bm-st-a{justify-self:end;text-align:right}}
.bm-ct{margin-top:var(--gap)}
.bm-ct-g{display:grid;gap:44px}
@media (min-width:900px){.bm-ct-g{grid-template-columns:5fr 7fr;gap:clamp(48px,6vw,104px)}.bm-ct-nf{grid-template-columns:1fr}}
.bm-ct-d div{padding:14px 0;border-bottom:1px solid var(--line)}
.bm-ct-d dt{color:var(--mute);font-size:calc(15px*var(--tune-size,1))}
.bm-ct-d dd{font:400 calc(23px*var(--tune-size,1))/1.3 var(--fq);margin-top:2px}
.bm-ct-h{margin-top:32px}
.bm-form{display:grid;gap:18px;background:var(--bg2);border-radius:var(--r);padding:clamp(24px,3vw,40px)}
.bm-form label{display:grid;gap:8px;font-size:calc(15px*var(--tune-size,1));font-weight:500}
.bm-form input,.bm-form textarea{font:inherit;font-weight:400;font-size:calc(17px*var(--tune-size,1));color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:calc(14px*var(--tune-radius,1));padding:13px 16px;width:100%}
.bm-form button{justify-self:start}
.bm-form-n{color:var(--mute);font-size:calc(15px*var(--tune-size,1))}
.bm-ct-m{display:grid;gap:14px}
.bm-ct-m li{position:relative;background:var(--bg2);border-radius:var(--r);padding:clamp(28px,3vw,40px);min-height:200px;display:flex;flex-direction:column;justify-content:flex-end}
.bm-ct-m .bm-bevel{border-color:color-mix(in oklab,var(--ink) 12%,transparent);background:none}
.bm-ct-v{font:400 calc(clamp(24px,2.2vw,30px)*var(--tune-size,1))/1.2 var(--fq);text-decoration:none}
@media (min-width:900px){.bm-ct-m{grid-template-columns:repeat(3,1fr)}}
.bm-reg{margin-top:calc(48px*var(--tune-space,1));color:var(--mute);font-size:calc(15px*var(--tune-size,1))}
.bm-legal{padding-block:calc(clamp(48px,6vw,96px)*var(--tune-space,1))}
.bm-legal h1{font-size:calc(clamp(36px,6vw,84px)*var(--tune-size,1));margin-bottom:28px}
.bm-legal h2{font-size:calc(clamp(28px,3vw,40px)*var(--tune-size,1));margin:calc(40px*var(--tune-space,1)) 0 14px}
.bm-legal p,.bm-legal li{max-width:68ch}
.bm-legal ul{list-style:disc;padding-left:1.2em}
.bm-gal{margin-top:var(--gap)}
/* the spread gallery as BM spreads: the rounded mirror corner, a soft shadow, the bevel line inside the photo page */
.bm-gal .g-sp-in{border-radius:var(--r);overflow:hidden;background:var(--bg2);box-shadow:0 1px 2px rgba(var(--shade),.08),0 24px 48px -28px rgba(var(--shade),.32)}
.bm-gal .g-sp-m::after{content:"";position:absolute;inset:var(--bev);border-radius:calc(var(--r) - var(--bev));border:1px solid rgba(255,255,255,.42);pointer-events:none}

/* ---------- Advanced hero moment ----------
   "The approach": you step up to the mirror. The glass comes towards you (the card grows the last few percent while
   the photo inside settles back from a slow push), the bevel catches the light, then the headline rises line by
   line, the lede and the one button follow, and the white pill drops into place. Transform and opacity only, ending
   exactly at the still page; layers that follow the pointer (data-depth) use fill-mode backwards. */
@media (prefers-reduced-motion:no-preference){
  .m-js .bm-hero .bm-mirror-a{animation:bm-near 1.3s cubic-bezier(.2,.75,.2,1) backwards}
  .m-js .bm-hero .bm-mirror-a .bm-mirror-ph img{animation:bm-settle 1.9s cubic-bezier(.2,.7,.2,1) backwards}
  .m-js .bm-hero .bm-bevel{animation:bm-fade 1s ease-out .55s backwards}
  .m-js .bm-hero .bm-kicker{animation:bm-fade .7s ease-out .6s backwards}
  .m-js .bm-hero .bm-l:first-child{animation:bm-rise .9s cubic-bezier(.2,.8,.2,1) .68s backwards}
  .m-js .bm-hero .bm-l+.bm-l{animation:bm-rise .9s cubic-bezier(.2,.8,.2,1) .8s backwards}
  .m-js .bm-hero .bm-lede,.m-js .bm-hero .bm-acts{animation:bm-rise .8s cubic-bezier(.2,.8,.2,1) .98s backwards}
  .m-js .bm-hero .bm-mirror-b{animation:bm-near 1.3s cubic-bezier(.2,.75,.2,1) .18s backwards}
  .m-js .bm-hero .bm-mirror-b .bm-tag{animation:bm-rise .7s cubic-bezier(.2,.8,.2,1) 1.05s backwards}
  .m-js .bm-pg-home .bm-top{animation:bm-drop .8s cubic-bezier(.2,.8,.2,1) .4s backwards}
}
@keyframes bm-near{from{transform:scale(.955);opacity:.4}}
@keyframes bm-settle{from{transform:scale(1.12)}}
@keyframes bm-fade{from{opacity:0}}
@keyframes bm-rise{from{opacity:0;transform:translateY(22px)}}
@keyframes bm-drop{from{opacity:0;transform:translateY(-14px)}}

/* team page: the heading straight over the stations; contact mirrors: labels on one line at the top, values on one line at the foot */
.bm-crew>h2,.bm-crew-l>h2{margin-bottom:calc(clamp(32px,4vw,60px)*var(--tune-space,1))}
.bm-ct-m .bm-k{margin-bottom:auto;padding-bottom:28px}
@media (max-width:899.98px){.bm-ct-m li{min-height:0}.bm-ct-m .bm-k{margin-bottom:0;padding-bottom:12px}}
/* grid cells may shrink below their longest word, so a long Hungarian or Dutch heading wraps inside its column */
:where(.bm-pair,.bm-head,.bm-svl,.bm-svl-t,.bm-rows a,.bm-svm,.bm-fs,.bm-fs li,.bm-prod,.bm-prod-t,.bm-st,.bm-rv-score,.bm-rv-l,.bm-item,.bm-item-t,.bm-facts,.bm-faq-open dl,.bm-crew-l li,.bm-ct-g,.bm-ct-m,.bm-foot-in)>*{min-width:0}
.bm-wall-l:focus-visible{outline:2px solid var(--ink);outline-offset:6px;border-radius:var(--r)}

/* reviews: the first quote large, the rest smaller on hairlines beside each other (three to six, never a slider) */
.bm-qs{display:grid;gap:28px;margin-top:calc(clamp(36px,4vw,56px)*var(--tune-space,1))}
.bm-qs li{border-top:1px solid var(--line);padding-top:22px}
.bm-qs p{font:400 calc(clamp(21px,1.7vw,24px)*var(--tune-size,1))/1.3 var(--fq)}
.bm-qs figcaption{color:var(--mute);margin-top:12px;font-size:calc(15px*var(--tune-size,1))}
@media (min-width:700px){.bm-qs{grid-template-columns:1fr 1fr;column-gap:clamp(28px,3vw,48px)}.bm-qs.bm-n1{grid-template-columns:1fr}.bm-qs.bm-n3 li:first-child{grid-column:1/-1}}
.bm-rv-l li{border-top:1px solid var(--line);padding-top:24px}
@media (min-width:1100px){.bm-rv-l.bm-n3,.bm-rv-l.bm-n5,.bm-rv-l.bm-n6{grid-template-columns:repeat(3,1fr)}}

/* the map on the visit card, greyed like an old print; until the visitor asks it is a placeholder in the page itself */
.bm-map{margin-top:18px;border-radius:calc(16px*var(--tune-radius,1));overflow:hidden;aspect-ratio:16/9;background:#ecebe6;box-shadow:inset 0 0 0 1px rgba(25,23,20,.08)}
.bm-map iframe{display:block;width:100%;height:100%;border:0;filter:grayscale(1) contrast(.92) brightness(1.03)}
@media(min-width:1000px){.bm-rv{margin-top:calc(var(--gap) * 1.35)}.bm-qs{row-gap:44px}.bm-qs li{padding-top:28px}.bm-rv-l li{padding-top:30px}.bm-rv-l{row-gap:56px}}

/* sales step 4 (photo-slice): on phones the first photo keeps more of the picture; the main button and the phone bar stay on the first screen */
@media (max-width:760px){.bm-mirror-a{height:calc(70svh - 2 * var(--inset));min-height:520px}}