/* gegenereerd door build.py — bewerk style.src.css */
/* BRUSH Amsterdam — homepage
   Bron: Figma "Homepage — concept" (1440 breed). Dit bestand is geschreven in px op 1440;
   build.py zet px om naar rem, zodat de pagina tussen 900 en 1440 proportioneel meeschaalt. */

:root{
  --ink:#15110e; --esp:#241c17; --bone:#f5f2ed; --greige:#e8e4e0; --gold:#b08d57; --white:#fff;
  --serif:"Playfair Display",Georgia,serif; --sans:"Jost",system-ui,sans-serif; --num:"Prata",Georgia,serif;
  --ease:cubic-bezier(.22,1,.36,1);        /* zacht uitlopend, geen overshoot */
  --ease-io:cubic-bezier(.65,0,.35,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:min(16px,calc(100vw / 90));-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--white);color:var(--ink);font-family:var(--sans);font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
img{display:block;width:100%;height:100%;object-fit:cover}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul{list-style:none}
em{font-style:italic}
:focus-visible{outline:2px solid var(--gold);outline-offset:0.25rem}

.wrap{max-width:90rem;margin:0 auto}
.label{font-family:var(--sans);font-weight:500;font-size:0.6875rem;line-height:1rem;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap}
.label--10{font-size:0.625rem;line-height:0.875rem}
.label--9{font-size:0.5625rem;line-height:0.8125rem}
.is-muted{opacity:.6}
.h2{font-family:var(--serif);font-weight:400;font-size:4rem;line-height:4.25rem;letter-spacing:-.025em}
.h2--light{color:var(--bone)}
.h2--lh123{line-height:4.9375rem}
.body-18{font-weight:300;font-size:1.125rem;line-height:1.8125rem}

/* ---------- knoppen ----------
   Eén hover-systeem voor de hele site:
   · gevulde knop (donker of licht)  → goud vlak schuift omhoog, tekst wordt ink
   · omlijnde knop / ronde pijlknop  → vult zich met de eigen lijnkleur, tekst keert om
   · pijl schuift overal 0.3125rem op, indrukken = direct iets kleiner; toetsenbordfocus toont dezelfde staat als hover */
:root{--t-hover:.5s}
.btn{display:inline-flex;align-items:center;gap:0.875rem;height:3.75rem;padding:0 1.875rem;font-weight:500;font-size:0.75rem;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap;position:relative;overflow:hidden;isolation:isolate;
  transition:color var(--t-hover) var(--ease),border-color var(--t-hover) var(--ease),transform var(--t-hover) var(--ease)}
.btn::before,.arrow::before,.bookdot::before{content:"";position:absolute;inset:-0.0625rem;z-index:-1;background:var(--fill,var(--gold));transform:translateY(102%);transition:transform var(--t-hover) var(--ease)}
.ico{--arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 12'%3E%3Cpath d='M1 6h21.5M18 1.6 22.4 6 18 10.4' fill='none' stroke='%23000' stroke-width='1.25'/%3E%3C/svg%3E");display:inline-block;flex:none;width:1em;height:.5em;font-size:0.9375rem;color:inherit;background:currentColor;-webkit-mask:var(--arrow) center/82% 82% no-repeat;mask:var(--arrow) center/82% 82% no-repeat;text-indent:-62.4375rem;overflow:hidden}
.ico--l{transform:scaleX(-1)}
.btn__arrow,.rel__arrow,.ig__info .ico{transition:transform var(--t-hover) var(--ease)}
.btn--sm{height:2.9375rem;padding:0 1.375rem;font-size:0.6875rem}.btn--sm .btn__arrow{font-size:0.8125rem}
.btn--md{height:3.375rem;padding:0 1.625rem;font-size:0.6875rem}.btn--md .btn__arrow{font-size:0.875rem}
.btn--dark{background:var(--ink);color:var(--white);--hover-text:var(--ink)}
.btn--light{background:var(--white);color:var(--ink);--hover-text:var(--ink)}
.btn--ghost-light{color:var(--white);border:1px solid var(--white);height:3.875rem;padding:0 1.9375rem;--fill:var(--white);--hover-text:var(--ink)}
.btn--ghost-light.btn--md{height:3.5rem;padding:0 1.6875rem}
.btn--ghost-dark{color:var(--ink);border:1px solid var(--ink);height:3.875rem;padding:0 1.9375rem;--fill:var(--ink);--hover-text:var(--white)}
.btn:active{transform:scale(.97);transition-duration:.1s}
.btn:focus-visible::before{transform:none}.btn:focus-visible{color:var(--hover-text)}.btn:focus-visible .btn__arrow{transform:translateX(0.3125rem)}
@media (hover:hover){
  .btn:hover::before{transform:none}
  .btn:hover{color:var(--hover-text)}
  .btn:hover .btn__arrow{transform:translateX(0.3125rem)}
}

.textlink{display:inline-flex;flex-direction:column;gap:0.375rem;position:relative;padding-bottom:1px}
.textlink::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform-origin:right;transition:transform .6s var(--ease)}
@media (hover:hover){
  .textlink:hover::after,.textlink:focus-visible::after{animation:linkline .8s var(--ease)}
}
@keyframes linkline{0%{transform:scaleX(1);transform-origin:right}45%{transform:scaleX(0);transform-origin:right}46%{transform:scaleX(0);transform-origin:left}100%{transform:scaleX(1);transform-origin:left}}

.arrows{display:flex;gap:0.75rem}
.arrow{width:3.5rem;height:3.5rem;border-radius:50%;border:1px solid rgba(21,17,14,.4);display:grid;place-items:center;position:relative;overflow:hidden;isolation:isolate;--fill:var(--ink);--hover-text:var(--white);
  transition:color var(--t-hover) var(--ease),border-color var(--t-hover) var(--ease),transform var(--t-hover) var(--ease)}
.arrow .ico{font-size:1.125rem;transition:transform var(--t-hover) var(--ease)}
.arrows--light .arrow{border-color:rgba(245,242,237,.4);color:var(--bone);--fill:var(--bone);--hover-text:var(--ink)}
.arrow:active{transform:scale(.94);transition-duration:.1s}
.arrow:focus-visible::before{transform:none}.arrow:focus-visible{color:var(--hover-text);border-color:var(--fill)}
@media (hover:hover){
  .arrow:hover::before{transform:none}
  .arrow:hover{color:var(--hover-text);border-color:var(--fill)}
  .arrow:hover .ico:not(.ico--l){transform:translateX(0.1875rem)}
  .arrow:hover .ico--l{transform:scaleX(-1) translateX(0.1875rem)}
}

/* ---------- header ---------- */
.header{position:fixed;top:0;left:0;right:0;z-index:50;height:6rem;transition:transform .6s var(--ease),background-color .5s var(--ease),box-shadow .5s var(--ease),height .5s var(--ease)}
.header__inner{max-width:90rem;height:100%;margin:0 auto;padding:0 3rem;display:flex;justify-content:space-between;align-items:center;position:relative}
.header__nav{display:flex;align-items:center;gap:2.25rem}
.header__right{display:flex;align-items:center;gap:2rem}
.menu-trigger{display:flex;align-items:center;gap:0.75rem}
.menu-trigger__icon{width:1.75rem;height:0.5625rem;position:relative;display:block}
.menu-trigger__icon i{position:absolute;left:0;height:1.5px;background:var(--ink);transition:width .5s var(--ease)}
.menu-trigger__icon i:first-child{top:0;width:1.75rem}.menu-trigger__icon i:last-child{top:0.46875rem;width:1.125rem}
.header__logo{position:absolute;left:50%;top:50%;width:9.375rem;height:3.54375rem;transform:translate(-50%,-50%);color:var(--ink);transition:width .5s var(--ease),height .5s var(--ease)}
.header__logo svg{width:100%;height:100%;fill:currentColor;display:block}
.nav-link{position:relative}
.nav-link--muted{opacity:.6}
.nav-link[aria-current="page"]::after{transform:scaleX(1)}
.nav-link::after{content:"";position:absolute;left:0;right:.18em;bottom:-0.3125rem;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .6s var(--ease)}
@media (hover:hover){
  .nav-link:hover::after{transform:scaleX(1);transform-origin:left}
  .menu-trigger:hover .menu-trigger__icon i:last-child{width:1.75rem}
}
/* translucent materiaal zodra de pagina onder de header door schuift */
.header.is-scrolled{height:4.75rem;background:rgba(245,242,237,.72);-webkit-backdrop-filter:blur(1.25rem) saturate(160%);backdrop-filter:blur(1.25rem) saturate(160%);box-shadow:0 1px 0 rgba(21,17,14,.08)}
.header.is-scrolled .header__logo{width:7.375rem;height:2.7875rem}
.header.is-hidden{transform:translateY(-100%)}

/* ---------- hero ---------- */
.hero{background:var(--bone);overflow:hidden}
.hero__inner{position:relative;max-width:90rem;height:60rem;margin:0 auto}
.hero__eyebrow{position:absolute;left:3rem;top:9.75rem;opacity:.7}
.hero__title{position:absolute;left:2.75rem;top:12.25rem;font-family:var(--serif);font-weight:400;font-size:10.25rem;line-height:9.625rem;display:flex;flex-direction:column;align-items:flex-start;letter-spacing:-.03em;white-space:nowrap}
.hero__img{position:absolute;overflow:hidden}
.hero__img--main{left:52rem;top:8.25rem;width:35rem;height:46.25rem}
.hero__img--small{left:34.75rem;top:37.75rem;width:14.375rem;height:18.75rem}
.hero__img-in{position:absolute;inset:0}
.caption{position:absolute;left:0;bottom:0;display:flex;align-items:center;gap:0.625rem;padding:0.75rem 1rem;background:var(--bone)}
.caption em{font-family:var(--serif);font-size:0.875rem;line-height:1.1875rem}
.hero__intro{position:absolute;left:3rem;top:35rem;width:27.4375rem;display:flex;flex-direction:column;gap:2rem}
.hero__lead{width:26.25rem;font-weight:300;font-size:1.1875rem;line-height:1.8125rem}
.hero__cta{display:flex;align-items:center;gap:1.75rem}
.hero__smallcap{position:absolute;left:34.75rem;top:57.25rem;opacity:.7}
.hero__score{position:absolute;left:3rem;top:54.5rem}
.score{display:flex;align-items:center;gap:0.875rem}
.score__num{font-family:var(--num);font-size:2.125rem;line-height:2.875rem;letter-spacing:-.02em}
.score__meta{display:flex;flex-direction:column;gap:0.1875rem}
.score__meta .label{opacity:.7}
.stars{font-size:0.6875rem;line-height:1rem;letter-spacing:.2em;color:var(--gold)}

/* lijn-masker voor koppen */
.line{display:block;overflow:hidden;padding:.14em .08em .2em;margin:-.14em -.08em -.2em}
.line__in{display:block}

/* "Boek"-cirkel: volgt de scroll */
.bookdot{position:fixed;right:max(2.25rem,calc(50vw - 45rem + 2.25rem));bottom:2.25rem;z-index:40;width:8.25rem;height:8.25rem;border-radius:50%;background:var(--ink);color:var(--white);display:grid;place-items:center;
  box-shadow:0 0 0 1px rgba(245,242,237,.18);transform:rotate(17.2deg);will-change:transform;overflow:hidden;isolation:isolate;transition:color var(--t-hover) var(--ease)}
.bookdot::before{border-radius:50%}
.bookdot:focus-visible::before{transform:none}.bookdot:focus-visible{color:var(--ink)}
@media (hover:hover){.bookdot:hover::before{transform:none}.bookdot:hover{color:var(--ink)}}
.bookdot__in{display:flex;flex-direction:column;align-items:center;gap:0.25rem}
.bookdot em{font-family:var(--serif);font-size:1.625rem;line-height:2.1875rem}
.bookdot .label{opacity:.8}

/* ---------- press ---------- */
.press{background:var(--greige);box-shadow:inset 0 1px 0 rgba(21,17,14,.1),inset 0 -0.0625rem 0 rgba(21,17,14,.1)}
.press__inner{max-width:90rem;margin:0 auto;padding:2.5rem 3rem;display:flex;justify-content:space-between;align-items:center}
.press__label{opacity:.6}
.press__vogue{font-family:var(--serif);font-size:1.875rem;line-height:2.5rem;letter-spacing:.06em}
.press__afw{font-weight:500;font-size:0.8125rem;line-height:1.1875rem;letter-spacing:.22em;text-transform:uppercase}
.press__award{font-family:var(--serif);font-style:italic;font-size:1.5rem;line-height:2rem}

/* ---------- positionering ---------- */
.pos{padding:10rem 3rem}
.pos .wrap{max-width:84rem;display:flex;flex-direction:column;gap:7rem}
.pos__statement{padding-left:23.25rem}
.statement{font-family:var(--serif);font-size:3.625rem;line-height:4.375rem;letter-spacing:-.02em}
.pos__row{display:flex;align-items:flex-end;gap:1.5rem;height:36.25rem}
.pos__img{overflow:hidden;flex:none}.pos__img>div{width:100%;height:100%}
.pos__img--a{width:27.75rem;height:36.25rem}.pos__img--b{width:20.25rem;height:25rem}
.pos__text{margin-left:auto;width:26.3125rem;display:flex;flex-direction:column;align-items:flex-start;gap:2.25rem}
.pos__text .body-18{width:26.25rem}
.quote{padding-left:1.5rem;border-left:1px solid var(--gold);display:flex;flex-direction:column;gap:0.75rem}
.quote p{font-family:var(--serif);font-style:italic;font-size:1.3125rem;line-height:1.6875rem}
.quote cite{font-style:normal;opacity:.6}

/* ---------- behandelingen ---------- */
.treat{background:var(--esp);padding:8.75rem 0;display:flex;flex-direction:column;gap:4rem}
.treat__head{width:100%;max-width:90rem;margin:0 auto;padding:0 3rem;display:flex;justify-content:space-between;align-items:flex-end}
.treat__note{width:22.5rem;font-weight:300;font-size:1rem;line-height:1.625rem;color:rgba(245,242,237,.8)}
.treat__body{width:100%;max-width:90rem;margin:0 auto;display:flex;flex-direction:column;gap:2.5rem}
.treat__ctrl{padding:0 3rem;display:flex;justify-content:flex-end}
.strips{display:flex;gap:0.5rem;height:42.5rem;padding:0 3rem}
.strook{position:relative;flex:92 1 0;min-width:0;overflow:hidden;cursor:pointer;color:var(--white);text-align:left;transition:flex-grow .9s var(--ease)}
.strook.is-open{flex-grow:544;cursor:default}
.strook__img{position:absolute;top:0;left:50%;width:34rem;height:100%;margin-left:-17rem;transition:transform 1.4s var(--ease)}
.strook__dim{position:absolute;inset:0;background:rgba(21,17,14,.4);transition:opacity .7s var(--ease)}
.strook__grad{position:absolute;inset:0;background:linear-gradient(180deg,rgba(21,17,14,0) 30%,rgba(21,17,14,.8) 100%);opacity:0;transition:opacity .7s var(--ease)}
.strook__num{position:absolute;top:1.5rem;left:0;right:0;text-align:center;opacity:.8;transition:opacity .4s var(--ease)}
.strook__name{position:absolute;left:50%;bottom:1.75rem;font-family:var(--serif);font-size:1.625rem;line-height:1;letter-spacing:-.01em;white-space:nowrap;writing-mode:vertical-rl;transform:translateX(-50%) rotate(180deg);transition:opacity .4s var(--ease)}
.strook__count{position:absolute;left:2rem;top:1.75rem;opacity:0}
.strook__price{position:absolute;right:2rem;top:1.75rem;opacity:0}
.strook__info{position:absolute;left:2rem;bottom:2rem;width:27.5rem;opacity:0;transform:translateY(1.125rem);pointer-events:none}
.strook__count,.strook__price,.strook__info{transition:opacity .35s var(--ease),transform .5s var(--ease)}
.strook__title{font-family:var(--serif);font-style:italic;font-weight:400;font-size:4rem;line-height:1;letter-spacing:-.02em;white-space:nowrap}
.strook__desc{margin-top:1rem;font-weight:300;font-size:1rem;line-height:1.5625rem;color:rgba(255,255,255,.9)}
.strook__cta{margin-top:1.5rem;display:flex;align-items:center;gap:1.25rem}
.strook.is-open .strook__dim{opacity:0}
.strook.is-open .strook__grad{opacity:1}
.strook.is-open .strook__num,.strook.is-open .strook__name{opacity:0}
.strook.is-open .strook__count{opacity:.9}
.strook.is-open .strook__price{opacity:1}
.strook.is-open .strook__info{opacity:1;transform:none;pointer-events:auto}
.strook.is-open .strook__count,.strook.is-open .strook__price,.strook.is-open .strook__info{transition:opacity .7s var(--ease) .35s,transform .9s var(--ease) .35s}
@media (hover:hover){
  .strook:not(.is-open):hover .strook__dim{opacity:.55}
  .strook:not(.is-open):hover .strook__img{transform:scale(1.045)}
}

/* ---------- resultaten ---------- */
.results{padding:10rem 0;display:flex;flex-direction:column;gap:4rem;overflow:hidden}
.results__head{width:100%;max-width:90rem;margin:0 auto;padding:0 3rem;display:flex;justify-content:space-between;align-items:flex-end}
.dragstrip{position:relative;width:100%;max-width:90rem;margin:0 auto;padding-left:3rem;height:38.125rem;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.dragstrip__track{display:flex;align-items:flex-start;gap:1.5rem;width:max-content;will-change:transform}
.rcard{flex:none}
.rcard--lg{width:26.25rem}.rcard--sm{width:21.25rem;padding-top:6rem}
.rcard__img{overflow:hidden}
.rcard--lg .rcard__img{height:35rem}.rcard--sm .rcard__img{height:28.125rem}
.rcard__img img{transition:transform 1.4s var(--ease)}
.rcard__meta{margin-top:1.125rem;display:flex;justify-content:space-between;align-items:center}
.rcard__meta em{font-family:var(--serif);font-size:1.5rem;line-height:2rem}
.rcard__meta .label{opacity:.6}
@media (hover:hover){.rcard:hover .rcard__img img{transform:scale(1.045)}}
.dragcursor{position:absolute;left:0;top:0;width:9.375rem;height:9.375rem;margin:-4.6875rem 0 0 -4.6875rem;border-radius:50%;background:var(--ink);color:var(--white);display:grid;place-items:center;pointer-events:none;z-index:5;opacity:0;will-change:transform}
.dragcursor span{display:flex;align-items:center;gap:0.4375rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase}
.dragcursor b{font-weight:500;font-size:1rem;line-height:1.4375rem;margin-right:-.18em}
.dragcursor__l{font-size:1.5rem}.dragcursor__r{font-size:1.375rem}
.dragstrip.is-dragging{cursor:grabbing}

/* ---------- team ---------- */
.team{background:var(--greige);padding:9.375rem 3rem}
.team .wrap{max-width:84rem;display:flex;flex-direction:column;gap:4rem}
.team__head{display:flex;justify-content:space-between;align-items:flex-end}
.team__note{width:22.5rem;font-weight:300;font-size:1.0625rem;line-height:1.6875rem;opacity:.8}
.team__row{display:flex;gap:2.5rem}
.stylist{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:1.5rem}
.stylist__img{position:relative;height:36.25rem;overflow:hidden}
.stylist__img img{transition:transform 1.4s var(--ease)}
.stylist__ov{position:absolute;inset:0;padding:2rem;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:1.5rem;background:rgba(21,17,14,.7);color:var(--white);
  opacity:0;transition:opacity .6s var(--ease)}
.stylist__ov .label{opacity:.7}
.stylist__ov ul{display:flex;flex-direction:column;gap:1rem}
.stylist__ov li{font-family:var(--serif);font-style:italic;font-size:1.875rem;line-height:2.5rem}
.stylist__ov>*{transform:translateY(1.25rem);opacity:0;transition:transform .8s var(--ease),opacity .6s var(--ease)}
.stylist__meta{display:flex;justify-content:space-between;align-items:flex-end}
.stylist__meta>div{display:flex;flex-direction:column;gap:0.5rem}
.stylist__meta .label--10{opacity:.6}
.stylist__name{font-family:var(--serif);font-weight:400;font-size:2.75rem;line-height:1;letter-spacing:-.02em}
.stylist.is-active .stylist__ov,.stylist__img:focus-within .stylist__ov{opacity:1}
.stylist.is-active .stylist__ov>*,.stylist__img:focus-within .stylist__ov>*{transform:none;opacity:1}
.stylist.is-active .stylist__ov>*:nth-child(2){transition-delay:.06s}
.stylist.is-active .stylist__ov>*:nth-child(3){transition-delay:.12s}
.stylist.is-active .stylist__ov .label{opacity:.7}
.stylist.is-active .stylist__img img{transform:scale(1.045)}

/* ---------- haircare ---------- */
.care{padding:7.5rem 3rem}
.care__inner{max-width:84rem;margin:0 auto;display:flex;align-items:center;gap:4.5rem}
.care__text{width:28.75rem;flex:none;display:flex;flex-direction:column;align-items:flex-start;gap:2.5rem}
.care__top{display:flex;flex-direction:column;gap:1.5rem}
.care__p{width:21.25rem;font-weight:300;font-size:1rem;line-height:1.625rem;opacity:.8}
.care__products{flex:1 1 0;display:flex;gap:1.5rem}
.product{flex:1 1 0;min-width:0;display:block}
.product__img{height:21.875rem;overflow:hidden;background:#efece8}
.product__img img{transition:transform 1.4s var(--ease)}
.product__row{margin-top:1rem;display:flex;justify-content:space-between;align-items:center;height:1.375rem}
.product__row .label{opacity:.6}
.product__price{font-size:0.9375rem;line-height:1.375rem;opacity:.8}
.product__name{margin-top:1rem;font-size:1rem;line-height:1.375rem}
@media (hover:hover){.product:hover .product__img img{transform:scale(1.045)}}

/* ---------- journal ---------- */
.journal{background:var(--greige);padding:10rem 3rem}
.journal .wrap{max-width:84rem;display:flex;flex-direction:column;gap:4rem}
.journal__head{display:flex;justify-content:space-between;align-items:flex-end}
.journal__row{display:flex;gap:2.5rem;align-items:flex-start}
.article{flex:1 1 0;min-width:0;display:block}
.article--lg{flex:none;width:41.25rem}
.article__img{height:26.25rem;overflow:hidden}.article--lg .article__img{height:32.5rem}
.article__img img{transition:transform 1.4s var(--ease)}
.article__meta{margin-top:1.5rem;display:flex;gap:1rem}
.article__title{margin-top:1.5rem;font-family:var(--serif);font-weight:400;font-size:1.75rem;line-height:2rem;letter-spacing:-.015em}
.article__title--lg{font-size:2.5rem;line-height:2.875rem;width:35rem}
.article__title span{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .8s var(--ease)}
@media (hover:hover){
  .article:hover .article__img img{transform:scale(1.045)}
  .article:hover .article__title span{background-size:100% 1px}
}

/* ---------- instagram ---------- */
.insta{background:var(--white);padding:8.75rem 0;display:flex;flex-direction:column;gap:4rem;overflow:hidden}
.insta__head{width:100%;max-width:90rem;margin:0 auto;padding:0 3rem;display:flex;justify-content:space-between;align-items:flex-end}
.insta .h2{font-style:italic}
.marquee{height:27.75rem;overflow:hidden;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:grab}
.marquee.is-dragging{cursor:grabbing}
.marquee__track{display:flex;align-items:flex-end;gap:1rem;width:max-content;height:100%;will-change:transform;transform:translate3d(-9.125rem,0,0)}
.ig{position:relative;flex:none;overflow:hidden;display:block}
.ig--336{width:21rem}.ig--250{width:15.625rem}.ig--420{width:26.25rem}.ig--444{height:27.75rem}.ig--420.ig--420,.ig--336.ig--420{height:26.25rem}
.ig.ig--420.ig--444{height:27.75rem}
.ig img{transition:transform 1.4s var(--ease);pointer-events:none}
.ig::before{content:"";position:absolute;inset:0;z-index:1;background:rgba(21,17,14,.6);opacity:0;transition:opacity .5s var(--ease)}
.ig__info{position:absolute;z-index:2;left:1.5rem;bottom:2.375rem;width:16.25rem;display:flex;flex-direction:column;gap:0.875rem;color:var(--white);opacity:0;transform:translateY(0.875rem);transition:opacity .5s var(--ease),transform .7s var(--ease)}
.ig__info .label{opacity:.8}
.ig__info em{font-family:var(--serif);font-size:1.875rem;line-height:2.0625rem;letter-spacing:-.01em}
.ig__info .ico{font-size:1.375rem;margin:0.625rem 0}
.ig__chip{position:absolute;z-index:2;left:0.75rem;top:0.75rem;display:flex;align-items:center;gap:0.5rem;padding:0.5rem 0.75rem 0.5rem 0.625rem;background:var(--bone)}
.ig__chip::before{content:"";border-left:0.5rem solid var(--ink);border-top:0.25rem solid transparent;border-bottom:0.25rem solid transparent}
.ig.is-active::before{opacity:1}
.ig.is-active .ig__info{opacity:1;transform:none}
.ig.is-active .ig__info .ico{transform:translateX(0.3125rem);transition-delay:.15s}
.ig.is-active img{transform:scale(1.045)}

/* ---------- booking CTA ---------- */
.cta{position:relative;height:47.5rem;overflow:hidden;color:var(--white)}
.cta__bg{position:absolute;inset:-10% 0;will-change:transform}
.cta__overlay{position:absolute;inset:0;background:rgba(21,17,14,.6)}
.cta__in{position:absolute;left:0;right:0;top:7.8125rem;display:flex;flex-direction:column;align-items:center;gap:2.5rem;text-align:center}
.cta__label{opacity:.8}
.cta__title{font-family:var(--serif);font-weight:400;font-size:8.25rem;line-height:7.9375rem;letter-spacing:-.03em;white-space:nowrap;display:flex;flex-direction:column;align-items:center}
.cta__p{width:30rem;font-weight:300;font-size:1.125rem;line-height:1.8125rem;opacity:.9}
.cta__btns{display:flex;gap:1.25rem;align-items:flex-start}

/* ---------- footer ---------- */
.footer{background:var(--ink);color:var(--bone);padding:7rem 3rem 2.5rem}
.footer__cols,.footer__bar{max-width:84rem;margin:0 auto}
.footer__cols{display:flex;gap:4rem;align-items:flex-start}
.footer__brand{flex:1 1 0;display:flex;flex-direction:column;align-items:flex-start;gap:1.75rem}
.footer__logo{width:11.875rem;height:4.4875rem;fill:var(--white);display:block}
.footer__tag{font-family:var(--serif);font-style:italic;font-size:1.5rem;line-height:2rem}
.footer__cta{margin-top:0.75rem}
.footer__col{flex:none}
.footer__col--nav{width:10.625rem}.footer__col--visit{width:14.375rem}.footer__col--hours{width:17.5rem}
.footer__col>.label{opacity:.5;display:block}
.footer__col ul{margin-top:2.25rem;display:flex;flex-direction:column;gap:0.875rem}
.footer__col li{font-weight:300;font-size:1rem;line-height:1.4375rem}
.footer__col ul.footer__social{margin-top:1.75rem;padding-top:1.5rem;border-top:1px solid rgba(245,242,237,.14);flex-direction:row;gap:1.75rem}
.footer__col a,.footer__legal a{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .6s var(--ease)}
@media (hover:hover){.footer__col a:hover,.footer__legal a:hover{background-size:100% 1px}}
.footer__bar{margin-top:6rem;padding-top:1.75rem;border-top:1px solid rgba(245,242,237,.2);display:flex;justify-content:space-between}
.footer__bar .label{opacity:.5}
.footer__legal{display:flex;gap:1.75rem}

/* openingstijden: dagen links, tijden rechts op één lijn (tabelcijfers), vandaag uitgelicht */
.hours{margin-top:2.25rem;display:flex;flex-direction:column}
.hours__r{display:flex;justify-content:space-between;align-items:baseline;gap:1.5rem;padding:0.5625rem 0;border-top:1px solid color-mix(in srgb,currentColor 14%,transparent);font-weight:300;font-size:1rem;line-height:1.4375rem}
.hours__r:first-child{border-top:0;padding-top:0}
.hours__r dt{position:relative}
.hours__r dd{font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
.hours__r.is-closed{opacity:.5}
.hours__r.is-today{font-weight:400;opacity:1}
.hours__r.is-today dt{padding-left:1rem}
.hours__r.is-today dt::before{content:"";position:absolute;left:0;top:50%;width:0.375rem;height:0.375rem;margin-top:-0.1875rem;border-radius:50%;background:var(--gold)}
.hours__status{margin-top:1.25rem;display:flex;align-items:flex-start;gap:0.625rem;font-weight:500;font-size:0.625rem;line-height:0.875rem;letter-spacing:.18em;text-transform:uppercase;opacity:.75}
.hours__status[hidden]{display:none}
.hours__status::before{content:"";margin-top:0.21875rem;width:0.4375rem;height:0.4375rem;border-radius:50%;background:#7a746e;flex:none}
.hours__status.is-open::before{background:#6fae7b;box-shadow:0 0 0 0.25rem rgba(111,174,123,.18)}
.vcol--hours .hours{margin-top:0.75rem}
.visit__info .vcol{width:12.5rem}.visit__info .vcol.vcol--hours{width:17rem}

/* =====================================================================
   SUBPAGINA'S — gedeeld
   ===================================================================== */
.page-inner{background:var(--bone)}
.page-inner main{padding-top:6rem}
.body-17{font-weight:300;font-size:1.0625rem;line-height:1.75rem;opacity:.9}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end}
.sec-note{width:22.5rem;font-weight:300;font-size:1rem;line-height:1.625rem;opacity:.8}.sec-note--365{width:22.8125rem}
.score--lg{gap:1rem}.score--lg .score__num{font-size:3.5rem;line-height:3.5rem}.score--lg .score__meta{gap:0.25rem}.score--lg .stars{font-size:0.8125rem;line-height:1.1875rem}.score--lg .label{opacity:.6}
.stars--16{font-size:1rem;line-height:1.4375rem}
.rows__r,.prow,.miles__r{display:flex;align-items:center}
.rows__r+.rows__r,.prow+.prow,.miles__r+.miles__r,.qa+.qa{border-top:1px solid rgba(21,17,14,.2)}

/* ---------- balayage: hero ---------- */
.bhero__inner{max-width:90rem;margin:0 auto;padding:1.5rem 3rem 3.5rem;display:flex;gap:1.5rem}
.bhero__text{width:47.5rem;height:47.5rem;flex:none;display:flex;flex-direction:column;justify-content:space-between}
.bhero__top{display:flex;flex-direction:column;gap:2.25rem}
.bhero__crumb{opacity:.6}
.bhero__h1{display:flex;flex-direction:column;align-items:flex-start;gap:0.25rem;font-weight:400}
.bhero__kw{font-family:var(--sans);font-weight:500;font-size:0.75rem;line-height:1.0625rem;letter-spacing:.18em;text-transform:uppercase}
.bhero__big{font-family:var(--serif);font-size:11.5rem;line-height:11.0625rem;letter-spacing:-.04em}
.bhero__sub{font-family:var(--serif);font-size:5rem;line-height:6.125rem;letter-spacing:-.03em}
.bhero__bottom{width:32.5rem;display:flex;flex-direction:column;gap:2.25rem}
.bhero__lead{font-weight:300;font-size:1.25rem;line-height:1.9375rem}
.bhero__img{width:35rem;height:47.5rem;flex:none;overflow:hidden}

/* ---------- feitenbalk ---------- */
.facts{background:var(--greige)}
.facts__inner{max-width:90rem;margin:0 auto;padding:2.5rem 3rem;display:flex;gap:2.5rem}
.fact{flex:1 1 0;padding-top:1.5rem;display:flex;flex-direction:column;gap:0.625rem}
.fact dt{opacity:.6}
.fact__v{font-family:var(--serif);font-size:1.875rem;line-height:2.3125rem;letter-spacing:-.01em;white-space:nowrap}
.fact__v--num{font-family:var(--num)}

/* ---------- uitleg ---------- */
.explain{background:var(--white);padding:10rem 3rem}
.explain__inner{max-width:84rem;margin:0 auto;padding-left:23.25rem;display:flex;flex-direction:column;gap:4.5rem}
.explain__h{font-family:var(--serif);font-weight:400;font-size:3rem;line-height:3.5rem;letter-spacing:-.015em}
.explain__cols{display:flex;gap:3rem}
.explain__cols p{flex:1 1 0;font-weight:300;font-size:1.0625rem;line-height:1.75rem;opacity:.9}

/* ---------- laat je inspireren ---------- */
.looks{background:var(--greige);padding:8.75rem 3rem}
.looks__inner{max-width:84rem;margin:0 auto;display:flex;flex-direction:column;gap:4rem}
.looks__row{display:flex;gap:1rem}
.look{position:relative;flex:1 1 0;height:35.375rem;overflow:hidden;display:block;color:var(--white)}
.look img{filter:saturate(.1) contrast(.92);transition:filter .9s var(--ease),transform 1.6s var(--ease)}
.look__veil{position:absolute;inset:0;background:rgba(232,228,224,.4);transition:opacity .9s var(--ease)}
.look__grad{position:absolute;left:0;right:0;bottom:0;height:12.5rem;background:linear-gradient(180deg,rgba(21,17,14,0),rgba(21,17,14,.6));opacity:.667;transition:opacity .9s var(--ease)}
.look__name{position:absolute;left:1.5rem;top:32.625rem;font-weight:500;font-size:0.875rem;line-height:1.25rem;letter-spacing:.12em;text-transform:uppercase;opacity:.9;transition:opacity .6s var(--ease),transform .9s var(--ease)}
.look.is-active img{filter:none;transform:scale(1.045)}
.look.is-active .look__veil{opacity:0}
.look.is-active .look__grad,.look.is-active .look__name{opacity:1}

/* ---------- resultaat: voor/na ---------- */
.result{background:var(--white);padding:10rem 3rem}
.result__inner{max-width:84rem;margin:0 auto;display:flex;align-items:center;gap:4rem}
.ba{width:47.5rem;height:53.75rem;flex:none;position:relative;cursor:ew-resize;touch-action:pan-y;user-select:none;-webkit-user-select:none;--p:47.37%}
.ba__in{position:absolute;inset:0;overflow:hidden}
.ba__after,.ba__before img{position:absolute;inset:0;width:47.5rem;height:53.75rem;max-width:none}
.ba__before{position:absolute;inset:0;width:var(--p);overflow:hidden}
.ba__line{position:absolute;top:0;bottom:0;left:var(--p);width:1.5px;background:var(--white)}
.ba__handle{position:absolute;top:50%;left:var(--p);width:4.5rem;height:4.5rem;margin:-2.25rem 0 0 -2.25rem;border-radius:50%;background:var(--white);display:flex;align-items:center;justify-content:center;gap:2px;transition:transform .5s var(--ease)}
.ba__handle .ico{font-size:1.375rem}
.ba.is-dragging .ba__handle{transform:scale(.9)}
.ba__l,.ba__r{position:absolute;top:51.25rem;color:var(--white)}.ba__l{left:1.5rem}.ba__r{right:1.5625rem;margin-right:-.18em}
.result__text{width:32.5rem;flex:none;display:flex;flex-direction:column;align-items:flex-start;gap:2.5rem}
.rows{width:100%}
.rows__r{gap:1.5rem;padding:1rem 0}
.rows__r dt{width:10.625rem;flex:none;opacity:.6;white-space:normal}
.rows__r dd{font-size:1rem;line-height:1.4375rem}

/* ---------- werkwijze ---------- */
.process{background:var(--esp);color:var(--bone);padding:9.375rem 3rem}
.process__inner{max-width:84rem;margin:0 auto;display:flex;align-items:center;gap:6rem}
.process__media{width:35rem;flex:none}
.process__img{height:43.75rem;overflow:hidden}
.process__stack{position:relative;width:100%;height:100%}
.process__stack img{position:absolute;inset:0;opacity:0;transform:scale(1.06);transition:opacity .9s var(--ease),transform 1.6s var(--ease)}
.process__stack img.is-on{opacity:1;transform:none}
.process__meta{margin-top:1rem;display:flex;justify-content:space-between;opacity:.7}
.process__play{display:flex;align-items:center;gap:0.4375rem}
.process__play::before{content:"";border-left:0.4375rem solid currentColor;border-top:0.25rem solid transparent;border-bottom:0.25rem solid transparent}
.process__steps{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:3.5rem}
.step{padding:1.75rem 0}
.step+.step{border-top:1px solid rgba(245,242,237,.2);transition:border-color .6s var(--ease)}
.step.is-open+.step{border-top-color:rgba(245,242,237,.7)}
.step__head{width:100%;display:flex;align-items:center;gap:2rem;text-align:left;color:inherit}
.step__num{width:2.5rem;flex:none;opacity:.4;transition:opacity .5s var(--ease)}
.step__title{flex:1 1 0;font-family:var(--serif);font-size:2.25rem;line-height:2.75rem;letter-spacing:-.02em;opacity:.4;transition:opacity .5s var(--ease),font-size .7s var(--ease),line-height .7s var(--ease)}
.step__sign{position:relative;width:0.9375rem;height:2.1875rem;flex:none;opacity:.7}
.step__sign::before,.step__sign::after,.qa__sign::before,.qa__sign::after{content:"";position:absolute;left:50%;top:50%;background:currentColor;transition:transform .6s var(--ease)}
.step__sign::before{width:0.8125rem;height:1.5px;margin:-0.04688rem 0 0 -0.40625rem}.step__sign::after{width:1.5px;height:0.8125rem;margin:-0.40625rem 0 0 -0.04688rem}
.step__body,.qa__body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .8s var(--ease)}
.step__body>div,.qa__body>div{overflow:hidden;min-height:0}
.step__body p{padding:1.125rem 0 0 4.5rem;font-weight:300;font-size:1.0625rem;line-height:1.75rem;opacity:0;transform:translateY(0.625rem);transition:opacity .5s var(--ease),transform .8s var(--ease);color:rgba(245,242,237,.8)}
.step.is-open .step__body,.qa.is-open .qa__body{grid-template-rows:1fr}
.step.is-open .step__body p,.qa.is-open .qa__body p{opacity:1;transform:none;transition-delay:.15s}
.step.is-open .step__num,.step.is-open .step__title{opacity:1}
.step.is-open .step__title{font-style:italic;font-size:2.75rem;line-height:3.375rem}
.step.is-open .step__sign::after,.qa.is-open .qa__sign::after{transform:scaleY(0)}
.step__sign,.qa__sign{transition:transform var(--t-hover) var(--ease)}
.step__title,.qa__head span{transition:opacity .5s var(--ease),font-size .7s var(--ease),line-height .7s var(--ease),transform var(--t-hover) var(--ease)}
@media (hover:hover){
  .step:not(.is-open) .step__head:hover .step__title,.step:not(.is-open) .step__head:hover .step__num{opacity:.8}
  .step:not(.is-open) .step__head:hover .step__sign,.qa:not(.is-open) .qa__head:hover .qa__sign{transform:rotate(90deg)}
  .step:not(.is-open) .step__head:hover .step__title,.qa:not(.is-open) .qa__head:hover span{transform:translateX(0.375rem)}
}

/* ---------- prijzen ---------- */
.prices{padding:10rem 3rem}
.prices__inner{max-width:84rem;margin:0 auto;padding-left:23.25rem;display:flex;flex-direction:column;gap:3.5rem}
.prices__h{width:56.25rem}
.prow{gap:2rem;padding:1.875rem 0}
.prow__n{width:18.75rem;flex:none;font-family:var(--serif);font-size:2.5rem;line-height:2.5rem;letter-spacing:-.01em}
.prow__d{flex:1 1 0;font-weight:300;font-size:1rem;line-height:1.4375rem;opacity:.8}
.prow__p{font-family:var(--num);font-size:2rem;line-height:2rem;letter-spacing:-.01em;white-space:nowrap}
.prices__foot{display:flex;flex-direction:column;gap:1.5rem}
.incl{background:var(--greige);padding:1.5rem;display:flex;justify-content:space-between;align-items:center}
.incl .label{opacity:.6;display:block}
.incl p{margin-top:0.5rem;font-size:1.0625rem;line-height:1.5625rem}
.prices__note{width:35rem;font-weight:300;font-size:0.875rem;line-height:1.375rem;opacity:.6}

/* ---------- expertise ---------- */
.expert{background:var(--white);padding:10rem 3rem;overflow:hidden}
.expert__inner{max-width:84rem;margin:0 auto;display:flex;align-items:center;gap:6rem}
.expert__text{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:2.5rem}
.expert__p{width:35rem}
.stats{width:100%;display:flex;justify-content:space-between}
.stat{width:11.875rem;display:flex;flex-direction:column;gap:0.375rem}
.stat__n{font-family:var(--num);font-size:3.25rem;line-height:3.25rem;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.stat .label{opacity:.6}
.expert__fig{position:relative;width:37.30625rem;height:46.76875rem;flex:none}
.expert__img{position:absolute;left:2.355rem;top:0;width:35rem;height:45rem;overflow:hidden;transform-origin:0 0;transform:rotate(3deg)}

/* ---------- reviews ---------- */
.breviews{background:var(--greige);padding:9.375rem 3rem}
.breviews__inner{max-width:84rem;margin:0 auto;display:flex;flex-direction:column;gap:4rem}
.breviews__row{display:flex;gap:1.5rem}
.rev{flex:1 1 0;background:var(--bone);padding:1.5rem;display:flex;flex-direction:column;gap:2.5rem;justify-content:space-between;transition:transform .8s var(--ease),box-shadow .8s var(--ease)}
.rev blockquote{font-family:var(--serif);font-style:italic;font-size:1.25rem;line-height:1.6875rem;letter-spacing:-.005em}
.rev figcaption{display:flex;justify-content:space-between;align-items:center;font-weight:500;font-size:0.9375rem;line-height:1.375rem}
@media (hover:hover){.rev:hover{transform:translateY(-6px);box-shadow:0 24px 48px -28px rgba(21,17,14,.35)}}

/* ---------- faq ---------- */
.faq{background:var(--white);padding:10rem 3rem}
.faq__inner{max-width:84rem;margin:0 auto;display:flex}
.faq__left{width:29.25rem;flex:none;display:flex;flex-direction:column;align-items:flex-start;gap:2rem}
.faq__p{width:21.25rem;font-weight:300;font-size:1rem;line-height:1.625rem;opacity:.8}
.faq__list{flex:1 1 0;min-width:0}
.qa{padding:1.5rem 0}
.qa h3{font-weight:400}
.qa__head{width:100%;display:flex;align-items:center;gap:2rem;text-align:left;font-family:var(--serif);font-size:1.875rem;line-height:2.25rem;letter-spacing:-.01em}
.qa__head span{flex:1 1 0}
.qa__sign{position:relative;width:1rem;height:2.375rem;flex:none}
.qa__sign::before{width:0.875rem;height:1.5px;margin:-0.04688rem 0 0 -0.4375rem}.qa__sign::after{width:1.5px;height:0.875rem;margin:-0.4375rem 0 0 -0.04688rem}
.qa__body p{width:40rem;padding-top:1.25rem;font-weight:300;font-size:1.0625rem;line-height:1.75rem;opacity:0;transform:translateY(0.625rem);transition:opacity .5s var(--ease),transform .8s var(--ease)}
.qa.is-open .qa__body p{opacity:.9}


/* ---------- shop the look ---------- */
.stl{padding:10rem 3rem;display:flex;flex-direction:column;align-items:center;gap:4rem}
.stl__row{width:100%;max-width:84rem;display:flex;align-items:center}
.stl__look{position:relative;width:45rem;height:45rem;flex:none}
.stl__look-in{position:absolute;inset:0;background:#efece8}
.hs{position:absolute;width:2.75rem;height:2.75rem;margin:-1.375rem 0 0 -1.375rem;border-radius:50%;background:rgba(21,17,14,.4);display:grid;place-items:center;z-index:2;transition:width .6s var(--ease),height .6s var(--ease),margin .6s var(--ease)}
.hs::before{content:"";width:0.8125rem;height:0.8125rem;border-radius:50%;background:var(--ink);transition:width .6s var(--ease),height .6s var(--ease)}
.hs::after{content:"";position:absolute;inset:-0.5rem;border-radius:50%;border:1px solid rgba(21,17,14,.35);opacity:0}
.hs.is-active{width:3.625rem;height:3.625rem;margin:-1.8125rem 0 0 -1.8125rem}.hs.is-active::before{width:2.5rem;height:2.5rem}
.hs__pop{position:absolute;left:50%;top:calc(100% + 0.75rem);transform:translate(-50%,0.5rem);background:var(--white);padding:1rem 1.25rem;display:flex;flex-direction:column;align-items:flex-start;gap:0.5rem;white-space:nowrap;box-shadow:0 0.75rem 2rem -0.5rem rgba(21,17,14,.14);opacity:0;pointer-events:none;transition:opacity .4s var(--ease),transform .6s var(--ease);color:var(--ink)}
.hs__pop b{font-weight:500;font-size:0.9375rem;line-height:1.375rem}.hs__pop span{font-family:var(--num);font-size:0.875rem;line-height:1.1875rem}.hs__pop u{font-weight:500;font-size:0.5625rem;line-height:0.8125rem;letter-spacing:.18em;text-transform:uppercase;text-underline-offset:0.25rem}
.hs.is-hover .hs__pop{opacity:1;transform:translate(-50%,0)}
.stl__side{flex:1 1 0;padding-left:8.75rem;display:flex;flex-direction:column;gap:2.5rem}
.stl__cards{position:relative;width:25rem;height:32.125rem;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.pcard{position:absolute;inset:0;display:block;opacity:0;pointer-events:none;transition:opacity .7s var(--ease)}
.pcard.is-active{opacity:1;pointer-events:auto}
.pcard__img{position:relative;height:25rem;background:#efece8;overflow:hidden}
.pcard__img img{transform:scale(1.06);transition:transform 1.4s var(--ease)}
.pcard.is-active .pcard__img img{transform:none}
.pcard__badge{position:absolute;left:0.75rem;top:0.75rem;padding:0.375rem 0.625rem;background:var(--ink);color:var(--white)}
.pcard__btn{position:absolute;left:1rem;right:1rem;bottom:1rem;justify-content:center;height:3.125rem;opacity:0;transform:translateY(0.75rem);transition:opacity .4s var(--ease),transform .6s var(--ease),color .45s var(--ease)}
.pcard__info{padding-top:1.375rem;display:flex;flex-direction:column;gap:0.625rem}
.pcard__info .label{opacity:.6}
.pcard__name{font-family:var(--serif);font-size:1.75rem;line-height:1.9375rem;letter-spacing:-.01em}
.pcard__price{font-family:var(--num);font-size:1.25rem;line-height:1.6875rem;display:flex;gap:0.75rem;align-items:center}
.pcard__price s{font-family:var(--sans);font-size:0.9375rem;opacity:.45}
@media (hover:hover){.pcard:hover .pcard__btn{opacity:1;transform:none}}
.stl__dots{display:flex;align-items:flex-end;gap:0.75rem;height:0.1875rem}
.stl__dot{width:3.375rem;height:1.4375rem;margin:-0.625rem 0;position:relative}
.stl__dot::after{content:"";position:absolute;left:0;right:0;bottom:0.625rem;height:1px;background:var(--ink);opacity:.3;transition:height .4s var(--ease),opacity .4s var(--ease)}
.stl__dot.is-active::after{height:0.1875rem;opacity:1}

/* ---------- bekijk ook ---------- */
.related{background:var(--white);padding:10rem 3rem}
.related__inner{max-width:84rem;margin:0 auto;display:flex;flex-direction:column;gap:4rem}
.related__row{display:flex;gap:2.5rem}
.rel{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:1.25rem}
.rel__img{height:33.75rem;overflow:hidden}.rel__img img{transition:transform 1.4s var(--ease)}
.rel__meta{display:flex;justify-content:space-between;align-items:flex-end}
.rel__meta>div{display:flex;flex-direction:column;gap:0.5rem}
.rel h3{font-family:var(--serif);font-weight:400;font-size:2.25rem;line-height:2.25rem;letter-spacing:-.01em}
.rel p{font-weight:300;font-size:0.9375rem;line-height:1.375rem;opacity:.8}
.rel__arrow{font-size:1.375rem;margin-bottom:0.625rem}
@media (hover:hover){.rel:hover .rel__img img{transform:scale(1.045)}.rel:hover .rel__arrow{transform:translateX(5px)}}
.cta--wide .cta__in{}

/* ---------- over brush: hero ---------- */
.ohero__inner{max-width:90rem;margin:0 auto;padding:4.5rem 3rem 3.5rem;display:flex;flex-direction:column;gap:4.5rem}
.ohero__head{display:flex;justify-content:space-between;align-items:flex-end}
.ohero__t{display:flex;flex-direction:column;gap:2rem}
.ohero__label{opacity:.6}
.ohero__h1{font-family:var(--serif);font-weight:400;font-size:6rem;line-height:7.375rem;letter-spacing:-.03em;white-space:nowrap;display:flex;flex-direction:column;align-items:flex-start}
.ohero__p{width:20rem;font-weight:300;font-size:1.0625rem;line-height:1.6875rem;opacity:.9}
.ohero__img{height:41.25rem;overflow:hidden}

/* ---------- verhaal ---------- */
.story{background:var(--white);padding:10rem 3rem}
.story__inner{max-width:84rem;margin:0 auto;display:flex;align-items:center;gap:7.5rem}
.story__img{width:32.5rem;height:43.75rem;flex:none;overflow:hidden}.story__img>div{width:100%;height:100%}
.story__text{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:2.5rem}
.story__p{font-weight:300;font-size:1.0625rem;line-height:1.8125rem;opacity:.9}
.miles__r{gap:1.5rem;padding:1.125rem 0}
.miles__r dt{width:8.75rem;flex:none;font-family:var(--serif);font-style:italic;font-size:1.5rem;line-height:1.5rem;letter-spacing:-.01em}
.miles__r dd{font-size:1rem;line-height:1.4375rem}

/* ---------- de ruimte ---------- */
.space{background:var(--esp);color:var(--bone);padding:9.375rem 0;display:flex;flex-direction:column;gap:5rem;overflow:hidden}
.space__head{width:100%;max-width:90rem;margin:0 auto;padding:0 3rem;display:flex;justify-content:space-between;align-items:flex-end}
.space__note{width:21.25rem;font-weight:300;font-size:1rem;line-height:1.625rem;opacity:.7}
.spacestrip{width:100%;max-width:90rem;margin:0 auto;padding-left:3rem;height:44rem;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:grab}
.spacestrip.is-dragging{cursor:grabbing}
.spacestrip__track{display:flex;align-items:flex-end;gap:1.5rem;width:max-content;height:100%;will-change:transform}
.room{flex:none;display:flex;flex-direction:column;gap:1.125rem}
.room__img{overflow:hidden}.room__img img{transition:transform 1.4s var(--ease)}
.room--lg{width:32.5rem}.room--lg .room__img{height:41.25rem}
.room--a{width:25rem}.room--a .room__img{height:32.5rem}
.room--b{width:25rem}.room--b .room__img{height:36.25rem}
.room figcaption{display:flex;align-items:center;gap:1rem}
.room figcaption .label{opacity:.5}
.room figcaption em{font-family:var(--serif);font-size:1.625rem;line-height:1.625rem;letter-spacing:-.01em}
@media (hover:hover){.room:hover .room__img img{transform:scale(1.045)}}
.space__progress{width:100%;max-width:90rem;margin:0 auto;padding:0 3rem}
.space__track{position:relative;height:1px;background:rgba(245,242,237,.2)}
.space__fill{position:absolute;left:0;top:0;height:1px;width:28.274%;background:var(--bone);will-change:transform}

/* ---------- team op over brush ---------- */
.team--about{background:var(--white)}
.team--about .wrap{gap:5rem}
.team--about .h2{line-height:4.9375rem}
.team--about .stylist{gap:1.375rem}

/* ---------- press quote ---------- */
.pquote{background:var(--greige);padding:8.75rem 3rem;display:flex;flex-direction:column;align-items:center;gap:2.5rem;text-align:center}
.pquote__logo{font-family:var(--serif);font-size:2.125rem;line-height:2.8125rem;letter-spacing:.08em;margin-right:-.08em}
.pquote__q{width:68.75rem;font-family:var(--serif);font-style:italic;font-size:3.25rem;line-height:3.8125rem;letter-spacing:-.025em}
.pquote__cite{opacity:.6}

/* ---------- bezoek ---------- */
.visit{padding:10rem 3rem}
.visit__inner{max-width:84rem;margin:0 auto;display:flex;align-items:center;gap:6rem}
.visit__text{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:3rem}
.visit__info{display:flex;gap:3rem;align-items:flex-start}
.vcol{width:14rem;flex:none;border-top:1px solid rgba(21,17,14,.2);padding-top:1.25rem}
.vcol .label{opacity:.6;display:block}
.vcol ul{margin-top:0.75rem;display:flex;flex-direction:column;gap:0.75rem}
.vcol li{font-weight:300;font-size:1rem;line-height:1.4375rem}
.vcol a{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .6s var(--ease)}
@media (hover:hover){.vcol a:hover{background-size:100% 1px}}
.visit__cta{display:flex;gap:1.25rem;align-items:flex-start}
.visit__img{width:30rem;height:38.75rem;flex:none;overflow:hidden}.visit__img>div{width:100%;height:100%}

/* =====================================================================
   BEWEGING — alleen actief met JS (html.js); ?static toont het kale ontwerp
   ===================================================================== */
.js [data-reveal]{opacity:0;transform:translateY(1.75rem);transition:opacity 1s var(--ease),transform 1.1s var(--ease);transition-delay:calc(var(--i,0) * 90ms)}
.js [data-reveal].in{opacity:1;transform:none}
.js .press [data-reveal]{transform:translateY(0.75rem)}

.js .w{display:inline-block;overflow:hidden;vertical-align:top;padding:.14em .07em .22em;margin:-.14em -.07em -.22em}
.js .w__in{display:inline-block;transform:translateY(115%);transition:transform 1.1s var(--ease);transition-delay:calc(var(--wi,0) * 55ms)}
.js .in .w__in{transform:none}

.js .hero .line__in,.js .cta__title .line__in{transform:translateY(112%);transition:transform 1.3s var(--ease) var(--d,0s)}
.js.is-loaded .hero .line__in,.js .cta__title.in .line__in{transform:none}
.js [data-hero="fade"]{opacity:0;transform:translateY(1.25rem);transition:opacity 1s var(--ease) var(--d,0s),transform 1.1s var(--ease) var(--d,0s)}
.js.is-loaded [data-hero="fade"]{opacity:1;transform:none}
.js.is-loaded .hero__eyebrow,.js.is-loaded .hero__smallcap{opacity:.7}
.js [data-hero="img"]{clip-path:inset(100% 0 0 0);transition:clip-path 1.5s var(--ease-io) var(--d,0s)}
.js [data-hero="img"] img{transform:scale(1.18);transition:transform 2s var(--ease) var(--d,0s)}
.js.is-loaded [data-hero="img"]{clip-path:inset(0)}
.js.is-loaded [data-hero="img"] img{transform:none}
.js .caption{transform:translateY(101%);transition:transform .9s var(--ease) 1.2s}
.js.is-loaded .caption{transform:none}
.js .header{transform:translateY(-100%)}
.js.is-loaded .header{transform:none}
.js.is-loaded .header.is-hidden{transform:translateY(-100%)}
.js .bookdot{opacity:0}
.js.is-loaded .bookdot{opacity:1;transition:opacity .6s var(--ease) 1.1s}

/* beeld-onthulling: masker schuift van onder naar boven open terwijl de foto rustig uitzoomt; tweede beeld volgt iets later.
   Masker op het binnenste element: een volledig weggeknipt element telt voor IntersectionObserver niet als zichtbaar */
.js .reveal-img>div{clip-path:inset(100% 0 0 0);transition:clip-path 1.7s var(--ease-io);transition-delay:calc(var(--i,0) * 260ms)}
.js .reveal-img img{transform:scale(1.28);transform-origin:50% 60%;transition:transform 2.6s var(--ease);transition-delay:calc(var(--i,0) * 260ms)}
.js .reveal-img.in>div{clip-path:inset(0)}
.js .reveal-img.in img{transform:none}

.js .statement .sw{opacity:var(--o,.14);transition:opacity .25s linear}

.js .strook{clip-path:inset(0 0 100% 0);transition:flex-grow .9s var(--ease),clip-path 1.2s var(--ease-io);transition-delay:0s,calc(var(--si,0) * 60ms)}
.js .strips.in .strook{clip-path:inset(0)}
.js .strips.in.is-ready .strook{transition-delay:0s}

.js .rcard{opacity:0;transform:translateX(5rem);transition:opacity 1s var(--ease),transform 1.3s var(--ease);transition-delay:calc(var(--ci,0) * 90ms)}
.js .dragstrip.in .rcard{opacity:1;transform:none}
.js .ig{opacity:0;transform:translateY(2.5rem);transition:opacity 1s var(--ease),transform 1.2s var(--ease);transition-delay:calc(var(--ci,0) * 70ms)}
.js .marquee.in .ig{opacity:1;transform:none}

/* ---------- subpagina's: beweging + static ---------- */
.js .bhero .line__in,.js .ohero .line__in{transform:translateY(112%);transition:transform 1.3s var(--ease) var(--d,0s)}
.js.is-loaded .bhero .line__in,.js.is-loaded .ohero .line__in{transform:none}
.js.is-loaded .bhero__crumb,.js.is-loaded .ohero__label{opacity:.6}
.js .look{opacity:0;transform:translateY(2.5rem);transition:opacity 1s var(--ease),transform 1.2s var(--ease);transition-delay:calc(var(--ci,0) * 80ms)}
.js .looks__row.in .look{opacity:1;transform:none}
.js .expert__img{transform:rotate(0deg) translateY(2.5rem);opacity:0;transition:transform 1.6s var(--ease),opacity 1s var(--ease)}
.js .expert__fig.in .expert__img{transform:rotate(3deg);opacity:1}
.js .room{opacity:0;transform:translateX(5rem);transition:opacity 1s var(--ease),transform 1.3s var(--ease);transition-delay:calc(var(--ci,0) * 90ms)}
.js .spacestrip.in .room{opacity:1;transform:none}
.js .hs{transform:scale(0);transition:width .6s var(--ease),height .6s var(--ease),margin .6s var(--ease),transform .7s cubic-bezier(.3,1.4,.5,1);transition-delay:0s,0s,0s,calc(.6s + var(--hi,0) * 70ms)}
.js .stl__look.in .hs{transform:none}
.js .stl__look.in .hs.is-active::after{animation:hspulse 2.4s var(--ease) infinite}
@keyframes hspulse{0%{opacity:.7;transform:scale(.8)}100%{opacity:0;transform:scale(1.35)}}
.js [data-scrub] .sw{opacity:var(--o,.14);transition:opacity .25s linear}
.static .look.is-design-active img{filter:none}
.static .look.is-design-active .look__veil{opacity:0}
.static .look.is-design-active .look__grad,.static .look.is-design-active .look__name{opacity:1}
@media (prefers-reduced-motion:reduce){.js .look,.js .room,.js .expert__img,.js .hs{transform:none!important;opacity:1!important}.js .expert__img{transform:rotate(3deg)!important}.js [data-scrub] .sw{opacity:1!important}}

/* zachte overgang tussen de pagina's (browsers met cross-document view transitions) */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vt-out .35s var(--ease) both}
::view-transition-new(root){animation:vt-in .6s var(--ease) both}
@keyframes vt-out{to{opacity:0}}
@keyframes vt-in{from{opacity:0}}

/* ---------- static: exact het Figma-frame ---------- */
.static .header{position:absolute}
.static .bookdot{position:absolute;right:auto;bottom:auto;left:calc(50% + 34.5rem);top:49.5rem}
.static .dragcursor{opacity:1;left:calc(3rem + 38.8125rem + 4.6875rem);top:calc(14.375rem + 4.6875rem)}
.static .stylist.is-design-hover .stylist__ov,.static .stylist.is-design-hover .stylist__ov>*{opacity:1;transform:none}
.static .stylist.is-design-hover .stylist__ov .label{opacity:.7}
.static .ig.is-design-hover::before{opacity:1}
.static .ig.is-design-hover .ig__info{opacity:1;transform:none}
.static .cta__bg{inset:0}
.static .page-inner .bookdot{display:none}

/* ---------- minder beweging ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.2s!important;transition-delay:0s!important;animation-duration:.01s!important}
  .js [data-reveal],.js .w__in,.js .hero .line__in,.js .cta__title .line__in,.js [data-hero="fade"],.js .rcard,.js .ig{transform:none!important}
  .js [data-hero="img"],.js .reveal-img>div,.js .strook{clip-path:none!important}
  .js [data-hero="img"] img,.js .reveal-img img{transform:none!important}
  .js .statement .sw{opacity:1!important}
}
@media (prefers-reduced-transparency:reduce){
  .header.is-scrolled{background:var(--bone);-webkit-backdrop-filter:none;backdrop-filter:none}
}

/* =====================================================================
   TABLET & MOBIEL (< 900) — volgt de Figma-frames "Homepage — Tablet / Mobiel"
   ===================================================================== */
@media (max-width:900px){
  html{font-size:16px}
  .header{height:4.5rem}.header.is-scrolled{height:4rem}
  .header__inner{padding:0 1.25rem}
  .header__nav .nav-link,.header__right .nav-link,.menu-trigger .label{display:none}
  .header__logo{width:6.75rem;height:2.5625rem}.header.is-scrolled .header__logo{width:6rem;height:2.25rem}
  .btn--sm{height:2.5rem;padding:0 0.875rem}
  .hero__inner{height:auto;padding:6.5rem 1.25rem 3.5rem;display:flex;flex-direction:column;gap:1.5rem}
  .hero__eyebrow,.hero__title,.hero__img,.hero__intro,.hero__smallcap,.hero__score{position:relative;left:auto;top:auto}
  .hero__eyebrow{white-space:normal;font-size:0.5625rem}
  .hide-m{display:none}
  .hero__title{font-size:clamp(3.5rem,15vw,6.5rem);line-height:.96;white-space:normal}
  .cta__title{line-height:1}.article__title,.article__title--lg{line-height:1.16}
  .hero__intro,.hero__lead{width:100%}
  .hero__lead{font-size:1rem}
  .hero__cta{flex-direction:column;align-items:stretch;gap:1.25rem}.hero__cta .btn{justify-content:center}.hero__cta .textlink{align-self:center}
  .hero__img--main{width:100%;height:auto;aspect-ratio:343/430;order:3}
  .hero__intro{order:2}
  .hero__img--small{width:9.375rem;height:12.25rem;order:4}
  .hero__smallcap{order:5;margin-top:-0.75rem}.hero__score{order:6}
  .bookdot{width:6rem;height:6rem;right:1rem;bottom:1rem}.bookdot em{font-size:1.25rem;line-height:1.625rem}.bookdot .label{font-size:0.4375rem}
  .press__inner{padding:1.5rem 1.25rem;flex-wrap:wrap;gap:0.75rem 1.75rem;justify-content:flex-start}
  .press__label{width:100%}
  .press__vogue{font-size:1.375rem;line-height:1.875rem}.press__award{font-size:1.125rem;line-height:1.625rem}.press__afw{font-size:0.625rem}
  .pos{padding:5rem 1.25rem}.pos .wrap{gap:3rem}
  .pos__statement{padding-left:0}.statement{font-size:clamp(1.75rem,5.4vw,2.5rem);line-height:1.2}
  .pos__row{height:auto;flex-wrap:wrap;gap:1rem}
  .pos__img--a{width:58%;height:auto;aspect-ratio:444/580}.pos__img--b{width:calc(42% - 1rem);height:auto;aspect-ratio:324/400}
  .pos__text,.pos__text .body-18{width:100%}.pos__text{margin-top:1.5rem}
  .h2,.h2--lh123{font-size:clamp(2.25rem,7.4vw,3.5rem);line-height:1.08}
  .treat{padding:5rem 0;gap:2.5rem}
  .treat__head,.results__head,.insta__head{padding:0 1.25rem;flex-direction:column;align-items:flex-start;gap:1.25rem}
  .treat__note,.team__note{width:100%}
  .strips{flex-direction:column;height:auto;padding:0 1.25rem;gap:0.375rem}
  .strook{flex:none;height:4rem;transition:height .8s var(--ease)}
  .strook.is-open{height:27.5rem}
  .strook__img{left:0;margin-left:0;width:100%;height:27.5rem;top:50%;margin-top:-13.75rem;object-position:50% 22%}
  .strook__num{left:1.125rem;right:auto;top:50%;margin-top:-0.4375rem}
  .strook__name{writing-mode:horizontal-tb;transform:translateY(50%);left:3.25rem;bottom:50%;font-size:1.375rem}
  .strook__count{left:1.125rem;top:1.25rem}.strook__price{right:1.125rem;top:1.25rem}
  .strook__info{left:1.125rem;right:1.125rem;bottom:1.25rem;width:auto}
  .strook__title{font-size:2.5rem;white-space:normal}.strook__desc{font-size:0.9375rem}
  .strook__cta{gap:0.5rem}.strook__cta .btn{flex:1;justify-content:center;padding:0 0.75rem;height:3rem}
  .treat__ctrl{display:none}
  .results{padding:5rem 0;gap:2.25rem}
  .results__head .arrows{display:none}
  .dragstrip{padding-left:1.25rem;height:auto}
  .rcard--lg{width:15.625rem}.rcard--lg .rcard__img{height:20.8125rem}
  .rcard--sm{width:12.5rem;padding-top:2.5rem}.rcard--sm .rcard__img{height:16.625rem}
  .rcard__meta{flex-direction:column;align-items:flex-start;gap:0.25rem;margin-top:0.75rem}.rcard__meta em{font-size:1.125rem;line-height:1.5rem}
  .dragcursor{display:none}
  .team{padding:5rem 1.25rem}.team .wrap{gap:2.25rem}
  .team__head,.journal__head{flex-direction:column;align-items:flex-start;gap:1.25rem}
  .team__row{gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;margin-right:-1.25rem;padding-right:1.25rem;scrollbar-width:none}
  .stylist{flex:none;width:16.5rem;scroll-snap-align:start;gap:1rem}
  .stylist__img{height:22rem}.stylist__ov{padding:1.125rem;gap:0.75rem}.stylist__ov li{font-size:1.25rem;line-height:1.75rem}.stylist__ov ul{gap:0.5rem}.stylist__ov .btn{height:2.875rem;padding:0 1.125rem}
  .stylist__meta{flex-direction:column;align-items:flex-start;gap:0.875rem}.stylist__name{font-size:1.875rem}
  .care{padding:4.5rem 1.25rem}.care__inner{flex-direction:column;align-items:stretch;gap:2.25rem}
  .care__text,.care__p{width:100%}
  .care__products{gap:0.75rem;overflow-x:auto;margin-right:-1.25rem;padding-right:1.25rem;scrollbar-width:none}
  .product{flex:none;width:12.5rem}.product__img{height:15rem}
  .journal{padding:5rem 1.25rem}.journal .wrap{gap:2.25rem}
  .journal__row{flex-direction:column;gap:2rem}
  .article--lg,.article__title--lg{width:100%}
  .article--lg .article__img{height:auto;aspect-ratio:343/260}.article__img{height:auto;aspect-ratio:4/5}
  .article__title--lg{font-size:1.625rem}.article__title{font-size:1.375rem}
  .insta{padding:5rem 0;gap:2rem}
  .marquee{height:15.625rem}.ig--336{width:11.75rem}.ig--250{width:8.75rem}.ig--420{width:14.6875rem}.ig--444,.ig.ig--420.ig--444{height:15.625rem}.ig--420.ig--420,.ig--336.ig--420{height:14.75rem}
  .ig__info{display:none}
  .cta{height:auto;padding:6rem 1.25rem}.cta__in{position:relative;top:auto;gap:1.5rem}
  .cta__title{font-size:clamp(3rem,11.5vw,5.5rem);white-space:normal}
  .cta__label{white-space:normal;font-size:0.5625rem}
  .cta__p{width:100%;max-width:30rem;font-size:1rem}
  .cta__btns{flex-direction:column;align-items:stretch;width:100%;max-width:21.4375rem;gap:0.75rem}.cta__btns .btn{justify-content:center}
  .footer{padding:4rem 1.25rem 6.875rem}
  .footer__cols{flex-wrap:wrap;gap:2.5rem 0.75rem}
  .footer__brand{flex:none;width:100%}.footer__logo{width:8.125rem;height:3.0625rem}.footer__tag{font-size:1.1875rem}
  .footer__col,.footer__col--nav,.footer__col--visit{width:calc(50% - 0.375rem)}.footer__col--hours{width:100%}.footer__col ul{margin-top:1.25rem;gap:0.625rem}.footer__col li{font-size:0.875rem}
  .hours{margin-top:1.25rem}.hours__r{font-size:0.875rem}.footer__cta{width:100%;justify-content:center}.footer__legal{flex-wrap:wrap;gap:0.5rem 1.25rem}
  .footer__bar{margin-top:3rem;flex-direction:column;gap:0.625rem}.footer__bar .label{white-space:normal}
}
@media (min-width:601px) and (max-width:900px){
  .hero__inner{padding:7.5rem 2rem 4rem}
  .strips{flex-direction:row;height:36.25rem;padding:0 0 0 2rem;overflow-x:auto;scrollbar-width:none}
  .strook{flex:none;width:4.5rem;height:100%;transition:width .8s var(--ease)}.strook.is-open{width:25rem;height:100%}
  .strook__img{left:50%;margin-left:-14.5rem;width:29rem;height:100%;top:0;margin-top:0}
  .strook__num{left:0;right:0;top:1.375rem;margin-top:0}
  .strook__name{writing-mode:vertical-rl;transform:translateX(-50%) rotate(180deg);left:50%;bottom:1.5rem}
  .strook__info{width:22rem;right:auto;left:1.5rem;bottom:1.75rem}.strook__title{font-size:3rem;white-space:nowrap}
  .team__row{overflow:visible;margin:0;padding:0}.stylist{flex:1 1 0;width:auto}.stylist__img{height:18.75rem}
  .care__products{overflow:visible;margin:0;padding:0}.product{flex:1 1 0;width:auto}
  .journal__row{flex-direction:row;flex-wrap:wrap;gap:1rem}.article--lg{width:100%}.article{flex:1 1 40%}
  .footer__col--nav,.footer__col--visit{width:calc(50% - 0.375rem)}.footer__col--hours{width:100%}
}

/* ---------- subpagina's: tablet & mobiel ---------- */
@media (max-width:900px){
  .page-inner main{padding-top:4.5rem}
  .sec-head{flex-direction:column;align-items:flex-start;gap:1.25rem}.sec-note,.sec-note--365{width:100%}
  .bhero__inner{flex-direction:column;padding:1.5rem 1.25rem 3rem;gap:2rem}
  .bhero__text{width:100%;height:auto;gap:2rem}.bhero__top{gap:1.5rem}
  .bhero__big{font-size:clamp(4.5rem,21vw,9.375rem);line-height:.98}.bhero__sub{font-size:clamp(2.25rem,10vw,4rem);line-height:1.15}
  .bhero__bottom{width:100%}.bhero__lead{font-size:1.0625rem;line-height:1.6875rem}
  .bhero__img{width:100%;height:auto;aspect-ratio:4/5}
  .facts__inner{padding:1.5rem 1.25rem;flex-wrap:wrap;gap:0.5rem 1.25rem}.fact{flex:1 1 40%;padding-top:1rem}.fact__v{font-size:1.375rem;line-height:1.875rem;white-space:normal}
  .explain,.result,.prices,.expert,.faq,.related,.story,.visit{padding:5rem 1.25rem}
  .looks,.breviews{padding:5rem 1.25rem}.process{padding:5rem 1.25rem}.stl{padding:5rem 1.25rem;gap:2.5rem}
  .explain__inner,.prices__inner{padding-left:0;gap:2.5rem}.explain__h{font-size:1.75rem;line-height:1.22}.explain__cols{flex-direction:column;gap:1.25rem}
  .looks__inner,.breviews__inner,.related__inner{gap:2.25rem}
  .looks__row{gap:0.5rem;overflow-x:auto;scroll-snap-type:x mandatory;margin-right:-1.25rem;padding-right:1.25rem;scrollbar-width:none}
  .look{flex:none;width:62vw;height:auto;aspect-ratio:256/566;max-height:32.5rem;scroll-snap-align:start}.look img{filter:none}.look__veil{display:none}.look__grad,.look__name{opacity:1}
  .look__name{top:auto;bottom:1.375rem;left:1.125rem;font-size:0.75rem}
  .result__inner,.process__inner,.expert__inner,.story__inner,.visit__inner{flex-direction:column;align-items:stretch;gap:2.5rem}
  .ba{width:100%;height:auto;aspect-ratio:760/860}.ba__after,.ba__before img{width:100%;height:100%}.ba__before img{width:calc(100vw - 2.5rem);max-width:none}
  .ba__l,.ba__r{top:auto;bottom:1.25rem}.ba__handle{width:3.5rem;height:3.5rem;margin:-1.75rem 0 0 -1.75rem}
  .result__text,.expert__p,.prices__h,.prices__note,.faq__left,.faq__p,.qa__body p{width:100%}
  .rows__r{flex-direction:column;align-items:flex-start;gap:0.375rem}.rows__r dt{width:auto}
  .process__media{width:100%}.process__img{height:auto;aspect-ratio:4/5}.process__steps{gap:2rem}
  .step__head{gap:1rem}.step__num{width:1.5rem}.step__title{font-size:1.5rem;line-height:2rem}.step.is-open .step__title{font-size:1.75rem;line-height:2.25rem}.step__body p{padding-left:2.5rem;font-size:1rem;line-height:1.625rem}
  .prow{flex-wrap:wrap;gap:0.375rem 1rem;padding:1.375rem 0}.prow__n{width:auto;flex:1 1 auto;font-size:1.75rem;line-height:2rem}.prow__p{font-size:1.375rem;line-height:2rem}.prow__d{flex:1 1 100%;order:3}
  .incl{flex-direction:column;align-items:stretch;gap:1.25rem}.incl .btn{justify-content:center}
  .stats{flex-wrap:wrap;gap:1.5rem 1rem}.stat{width:auto;flex:1 1 40%}.stat__n{font-size:2.5rem;line-height:2.75rem}
  .expert__fig{width:100%;height:auto;aspect-ratio:560/720}.expert__img{position:relative;left:0;width:94%;height:100%;margin:0 auto}
  .breviews__row{flex-direction:column;gap:0.75rem}
  .faq__inner{flex-direction:column;gap:2.5rem}.qa__head{font-size:1.375rem;line-height:1.75rem;gap:1rem}
  .stl__row{flex-direction:column;gap:2rem}.stl__look{width:100%;height:auto;aspect-ratio:1}
  .hs{width:2.25rem;height:2.25rem;margin:-1.125rem 0 0 -1.125rem}.hs.is-active{width:2.875rem;height:2.875rem;margin:-1.4375rem 0 0 -1.4375rem}.hs.is-active::before{width:1.875rem;height:1.875rem}.hs__pop{display:none}
  .stl__side{padding-left:0;width:100%;gap:1.75rem;align-items:center}.stl__cards{width:100%;max-width:25rem;height:auto;aspect-ratio:400/514}.pcard__img{height:auto;aspect-ratio:1}.pcard__btn{opacity:1;transform:none}
  .related__row{flex-direction:column;gap:2rem}.rel__img{height:auto;aspect-ratio:4/5}.rel h3{font-size:1.75rem;line-height:2rem}
  .ohero__inner{padding:2rem 1.25rem 3rem;gap:2.25rem}.ohero__head{flex-direction:column;align-items:flex-start;gap:1.5rem}
  .ohero__h1{font-size:clamp(2.5rem,10.5vw,5rem);line-height:1.12;white-space:normal}.ohero__p{width:100%}.ohero__img{height:auto;aspect-ratio:4/3}
  .story__img,.visit__img{width:100%;height:auto;aspect-ratio:4/5}
  .miles__r dt{width:6rem;font-size:1.25rem}
  .space{padding:5rem 0;gap:2.5rem}.space__head{padding:0 1.25rem;flex-direction:column;align-items:flex-start;gap:1.25rem}.space__note{width:100%}
  .spacestrip{padding-left:1.25rem;height:auto}.room--lg{width:17.5rem}.room--lg .room__img{height:22.25rem}.room--a,.room--b{width:13.75rem}.room--a .room__img{height:17.875rem}.room--b .room__img{height:20rem}.room figcaption em{font-size:1.25rem}
  .space__progress{padding:0 1.25rem}
  .pquote{padding:5rem 1.25rem;gap:1.75rem}.pquote__q{width:100%;font-size:clamp(1.625rem,5.6vw,2.5rem);line-height:1.2}
  .visit__info{flex-direction:column;gap:1.75rem}.visit__info .vcol,.visit__info .vcol.vcol--hours{width:100%}
  .visit__cta{flex-direction:column;align-items:stretch;gap:0.75rem}.visit__cta .btn{justify-content:center}
}