/* True Essence Cinematic — motion layer v6 styles */
html.is-locked{overflow:hidden}
.hdr{transition:opacity .5s}
/* Logo dead-centre in the header (Lenval layout); Menu + Let's Talk stay on the right */
.hdr__c{position:relative;display:flex!important;justify-content:flex-end}
.hdr__talk{order:-1}
.hdr__logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
@media (max-width:37.5em){.hdr__logo{left:var(--off);transform:translateY(-50%)}}
/* Page transition: dimming layer between the zooming old page and the rising new one */
.tx-shade{position:fixed;inset:0;z-index:1255;background:#140c0a;opacity:0;pointer-events:none}
html.is-locked .hdr{opacity:0;pointer-events:none;visibility:hidden;transition:opacity .5s,visibility 0s .5s}
html.is-locked .hdr a,html.is-locked .hdr button{pointer-events:none!important}

/* ---------- Button text roll ---------- */
.btn__label{position:relative;display:inline-block;overflow:hidden;vertical-align:top}
.btn__label .roll__a,.btn__label .roll__b{display:block;transition:transform .7s var(--ease)}
.btn__label .roll__b{position:absolute;left:0;top:100%}
.btn:hover .btn__label .roll__a,.btn:hover .btn__label .roll__b{transform:translateY(-100%)}

/* ---------- Line reveal ---------- */
.lw{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.lw>span{display:inline-block;will-change:transform}

/* ---------- Hero featured project ---------- */
.hfeat{position:absolute;right:var(--off);bottom:calc(32 * var(--px));z-index:3;display:flex;align-items:stretch;gap:calc(14 * var(--px));width:calc(330 * var(--px));min-width:16.25rem;padding:calc(8 * var(--px));background:rgba(249,244,238,.1);backdrop-filter:blur(.875rem);-webkit-backdrop-filter:blur(.875rem);border:1px solid rgba(249,244,238,.16);color:var(--cream);opacity:0}
.hfeat__img{flex:0 0 38%;aspect-ratio:1/1;overflow:hidden}
.hfeat__img img{transition:transform 1.2s var(--ease)}
.hfeat:hover .hfeat__img img{transform:scale(1.08)}
.hfeat__txt{display:flex;flex-direction:column;justify-content:space-between;gap:.5rem;padding:.25rem 0}
.hfeat__t{font-family:var(--e-global-typography-secondary-font-family,'Bodoni Moda'),serif;font-size:clamp(1rem,.9rem + .4vw,1.35rem);line-height:1.15}
.hero:has(.hfeat) .hero__b{padding-right:calc(360 * var(--px))}
@media (max-width:61.9375em){.hfeat{display:none}.hero:has(.hfeat) .hero__b{padding-right:0}}
/* Headline sits in the bottom-right corner, its last line on the scroll cue's baseline */
.hero__b{align-items:end}
.hero__h{justify-self:end;max-width:11.5em}

/* ---------- Get in Touch panel ---------- */
.talk{position:fixed;inset:0;z-index:90;visibility:hidden;pointer-events:none}
.talk.is-open{visibility:visible;pointer-events:auto}
.talk__bg{position:absolute;inset:0;background:rgba(33,26,25,.55);opacity:0;cursor:pointer}
.talk__p{position:absolute;top:0;right:0;bottom:0;width:min(45rem,100%);overflow-y:auto;overscroll-behavior:contain;background:var(--cream);color:var(--ink);padding:clamp(1.75rem,4vw,3.5rem)}
.talk__x{position:absolute;top:clamp(1.25rem,3vw,2.25rem);right:clamp(1.25rem,3vw,2.5rem);display:flex;align-items:center;gap:.625rem}
.talk__x i,.lbx__x i,.film__x i{position:relative;width:.875rem;height:.875rem}
.talk__x i:before,.talk__x i:after,.lbx__x i:before,.lbx__x i:after,.film__x i:before,.film__x i:after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:currentColor;transform:rotate(45deg)}
.talk__x i:after,.lbx__x i:after,.film__x i:after{transform:rotate(-45deg)}
.talk__lbl{display:block;margin:clamp(2.5rem,6vw,4.5rem) 0 1.375rem}
.talk__h{max-width:12em}
.talk__t{margin-top:1.375rem;max-width:34em}
.talk__c{margin-top:2.125rem;padding-top:1.5rem;border-top:1px solid var(--line)}
.talk__big{display:block;font-family:var(--e-global-typography-secondary-font-family,'Bodoni Moda'),serif;font-size:clamp(1.2rem,1rem + .8vw,1.8rem);line-height:1.3}
.talk__c .p1{margin-top:.75rem}
.talk__form{margin-top:2.125rem;border:1px solid var(--line);background:var(--cream);min-height:12.5rem}
/* Dubsado forms keep their own colours (set them in Dubsado's form style settings).
   No blend mode: some browsers draw blended cross-site frames with washed-out text. */
.talk__form iframe,.tembed__box iframe{mix-blend-mode:normal}
.talk__form iframe{display:block;width:100%;height:68.75rem;border:0}
.talk__note{display:block;margin-top:1.125rem}

/* ---------- Photo viewer ---------- */
.lbx{position:fixed;inset:0;z-index:95;visibility:hidden;color:var(--cream)}
.lbx.is-open{visibility:visible}
.lbx__bg{position:absolute;inset:0;background:rgba(20,15,14,.96)}
.lbx__stage{position:absolute;inset:clamp(3.5rem,7vw,5.625rem) clamp(1rem,8vw,8.75rem);display:flex;align-items:center;justify-content:center}
.lbx__img{position:absolute;max-width:100%;max-height:100%;width:auto!important;height:auto!important;object-fit:contain!important}
.lbx__x{position:absolute;top:clamp(1rem,2.4vw,2rem);right:clamp(1rem,2.4vw,2.5rem);display:flex;align-items:center;gap:.625rem;z-index:2}
.lbx__nav{position:absolute;top:50%;width:3.25rem;height:3.25rem;margin-top:-1.625rem;display:flex;align-items:center;justify-content:center;border:1px solid rgba(249,244,238,.25);border-radius:50%;z-index:2;transition:background .4s}
.lbx__nav:hover{background:rgba(249,244,238,.1)}
.lbx__nav svg{width:1rem;height:1rem}
.lbx__prev{left:clamp(.75rem,2.4vw,2.5rem)}.lbx__next{right:clamp(.75rem,2.4vw,2.5rem)}
.lbx__n{position:absolute;left:50%;bottom:clamp(1rem,2.4vw,2rem);transform:translateX(-50%)}
@media (max-width:47.9375em){.lbx__nav{top:auto;bottom:1rem;margin-top:0}}
.gallery__i,.split__img,.about__img,.about__img2{cursor:zoom-in}

/* ---------- Film viewer ---------- */
.film{position:fixed;inset:0;z-index:95;visibility:hidden;color:var(--cream)}
.film.is-open{visibility:visible}
.film__bg{position:absolute;inset:0;background:rgba(20,15,14,.96)}
.film__box{position:absolute;inset:clamp(3.5rem,7vw,6.25rem) clamp(1rem,6vw,7.5rem);display:flex;align-items:center;justify-content:center}
.film__box video{width:100%;height:100%;object-fit:contain;background:#000}
.film__x{position:absolute;top:clamp(1rem,2.4vw,2rem);right:clamp(1rem,2.4vw,2.5rem);display:flex;align-items:center;gap:.625rem;z-index:2}
.pintro__film{margin-top:1.75rem}

/* ---------- Horizontal gallery (pinned on desktop, swipe row on touch) ---------- */
.gallery--hscroll.is-h{display:block;padding-bottom:0;overflow:hidden}
.gallery--hscroll.is-h .gallery__track{display:flex;align-items:center;gap:var(--gap,1.5rem);height:100vh;will-change:transform}
.gallery--hscroll.is-h .gallery__i{flex:0 0 auto;height:min(74vh,44vw);width:auto;aspect-ratio:4/5;margin:0!important;grid-column:auto!important;overflow:hidden}
.gallery--hscroll.is-h .gallery__i:nth-child(3n+2){height:min(58vh,36vw);aspect-ratio:3/4;align-self:flex-start;margin-top:13vh!important}
.gallery--hscroll.is-h .gallery__i:nth-child(3n){aspect-ratio:16/11;height:min(62vh,38vw);align-self:flex-end;margin-bottom:10vh!important}
.gallery--hscroll.is-h .gallery__i img{width:100%;height:100%;object-fit:cover}
.gallery--hscroll:not(.is-h) .gallery__i{grid-column:span 6!important;aspect-ratio:4/5;margin-top:0!important}
@media (max-width:63.9375em){
.gallery--hscroll.is-h{padding-bottom:var(--sec,5rem)}
.gallery--hscroll.is-h .gallery__track{height:auto;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:.5rem}
.gallery--hscroll.is-h .gallery__i,.gallery--hscroll.is-h .gallery__i:nth-child(n){height:62vh;max-height:32.5rem;aspect-ratio:4/5;margin:0!important;align-self:auto;scroll-snap-align:start}
}

/* ---------- Menu: hovered link leans in, the rest fall back ---------- */
.mnu .mnu__nav .mnu__t,.mnu .mnu__work .mnu__t{display:inline-block;transition:transform .8s cubic-bezier(.19,1,.22,1),opacity .5s}
.mnu .mnu__nav .mnu__list:hover .mnu__link:not(:hover) .mnu__t,.mnu .mnu__work .mnu__list:hover .mnu__link:not(:hover) .mnu__t{opacity:.32}
.mnu .mnu__nav .mnu__link:hover .mnu__t{transform:translateX(.28em);font-style:italic}
.mnu .mnu__work .mnu__link:hover .mnu__t{transform:translateX(.4em)}

/* ---------- Cards ---------- */
.tcard__t{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .8s cubic-bezier(.19,1,.22,1)}
.tcard:hover .tcard__t{background-size:100% 1px}
.tprice__i{transition:background-color .6s}
.tprice__i:hover{background:color-mix(in srgb,currentColor 4%,transparent)}

.tfaq__a{overflow:hidden}
.ftr{overflow:hidden}
/* Section divider under light Facts sections: hairline that draws in, small dot at centre */
.tfacts:not(.tfacts--dark){padding-bottom:calc(clamp(4.5rem,9vw,9.375rem) + 1.5rem);padding-left:clamp(1.25rem,4vw,4.5rem);padding-right:clamp(1.25rem,4vw,4.5rem)}
.tfacts:not(.tfacts--dark)::after{content:"";position:absolute;left:var(--off,.5rem);right:var(--off,.5rem);bottom:0;height:1px;background:color-mix(in srgb,currentColor 22%,transparent);transform:scaleX(var(--div,1));transform-origin:center}
.tfacts:not(.tfacts--dark)::before{content:"";position:absolute;left:50%;bottom:-.25rem;width:.5625rem;height:.5625rem;margin-left:-.2813rem;border-radius:50%;background:var(--bg,#f9f4ee);border:1px solid color-mix(in srgb,currentColor 40%,transparent);z-index:1;opacity:var(--divo,1)}
/* About: no indent before the statement; wide photo framed on faces, not chins */
.about__lead .red-in{display:none!important}
.about__img2 img{object-position:50% 18%}
.about__img img{object-position:50% 30%}
/* About middle column: breathing room on both sides, sits centred between the photos */
.about__row2{align-items:center}
.about__desc{align-self:center;padding:0 clamp(1rem,2.6vw,3rem);max-width:34em}
.about__desc .p1+.p1{margin-top:1.1em}
.about__desc .btn{margin-top:clamp(1.25rem,2vw,2rem)}
/* Image + text: keep a clear gutter between photo and copy */
.split__txt{padding-left:clamp(0px,2vw,2rem)}
.split__txt .h2{font-size:clamp(1.25rem,1rem + .9vw,1.9rem);line-height:1.3}
/* Problem / facts cards on light sections read as cards */
.tfacts:not(.tfacts--dark) .tfacts__i{padding:clamp(1.25rem,2vw,2rem);background:color-mix(in srgb,currentColor 3%,transparent);border-top:0;border-left:1px solid color-mix(in srgb,currentColor 22%,transparent)}
.ftr__col{min-width:0}
.ftr__kv a[href^="mailto:"]{overflow-wrap:anywhere;font-size:.92em}
.split__img,.about__img,.about__img2,.tcard__img,.next__b{will-change:clip-path}
/* ---------- Menu dropdowns (Portfolio / Booking) ---------- */
.mnu .mnu__c{overflow-y:auto;overscroll-behavior:contain}
.mnu .mnu__nav .mnu__row{display:flex;align-items:center;gap:clamp(.625rem,1vw,1.125rem)}
.mnu .mnu__nav .mnu__row>.mnu__link{flex:0 1 auto}
.mnu__tog{position:relative;flex:0 0 auto;width:2.125rem;height:2.125rem;padding:0;border:1px solid color-mix(in srgb,currentColor 28%,transparent);border-radius:50%;background:none;color:inherit;cursor:pointer;transition:background-color .15s,opacity .12s}
.mnu:not(.is-open) .mnu__tog{opacity:0;transition-delay:0s}
.mnu__tog i:before,.mnu__tog i:after{content:"";position:absolute;left:50%;top:50%;width:.625rem;height:1px;margin:-.5px 0 0 -.3125rem;background:currentColor;transition:transform .6s var(--ease)}
.mnu__tog i:after{transform:rotate(90deg)}
.mnu__tog:hover,.has-sub.is-open>.mnu__row>.mnu__tog{background:color-mix(in srgb,currentColor 9%,transparent)}
.has-sub.is-open>.mnu__row>.mnu__tog i:after{transform:rotate(0)}
.mnu__drop{display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s cubic-bezier(.22,1,.36,1)}
.mnu__drop>.mnu__sub{min-height:0;overflow:hidden}
.has-sub.is-open>.mnu__drop{grid-template-rows:1fr}
.mnu__sub{list-style:none;margin:0;padding:0}
.mnu__sub>li{opacity:0;transform:translateY(.375rem);transition:opacity .2s ease,transform .25s ease}
.has-sub.is-open>.mnu__drop>.mnu__sub>li{opacity:1;transform:none;transition:opacity .42s ease,transform .45s cubic-bezier(.22,1,.36,1)}
.mnu__sub--2{padding:.4em 0 1em clamp(2.625rem,3.4vw,3.875rem)}
.mnu__sub--grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(1rem,2vw,2rem)}
.mnu__slink{display:inline-block;padding:.24em 0;font-family:var(--e-global-typography-secondary-font-family,'Bodoni Moda'),serif;font-size:clamp(1.1rem,.95rem + .5vw,1.55rem);line-height:1.25;transition:transform .7s var(--ease),opacity .4s}
.mnu__slink:hover{transform:translateX(.25em);font-style:italic}
.mnu__sub--2 .mnu__tog{width:1.625rem;height:1.625rem}
.mnu__sub--3{padding:.2em 0 .7em;border-left:1px solid color-mix(in srgb,currentColor 18%,transparent);padding-left:1rem;margin:.2em 0 .3em 2px}
.mnu__sub--3 .mnu__slink{font-family:inherit;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;opacity:.78;padding:.5em 0}
.mnu__sub--3 .mnu__slink:hover{opacity:1;font-style:normal}
.mnu .mnu__nav .mnu__list:hover .mnu__item.is-open>.mnu__row .mnu__t{opacity:1}
/* Hovering inside an open dropdown keeps its own parent bright, and sub-links never dim the whole list */
.mnu .mnu__nav .mnu__list:hover .mnu__item:has(.mnu__drop:hover)>.mnu__row .mnu__t,
.mnu .mnu__nav .mnu__list:hover .mnu__item.is-open>.mnu__row .mnu__link,
.mnu .mnu__nav .mnu__list:hover .mnu__item:has(.mnu__drop:hover)>.mnu__row .mnu__link{opacity:1}
.mnu__tog{cursor:pointer}
.mnu__row{position:relative}
@media (hover:none){.mnu .mnu__nav .mnu__list:hover .mnu__link:not(:hover) .mnu__t{opacity:1}}
@media (max-width:56.1875em){.mnu__sub--2{padding-left:clamp(1.875rem,9vw,2.875rem)}.mnu__tog{width:1.875rem;height:1.875rem}}
@media (max-width:30em){.mnu__sub--grid{grid-template-columns:minmax(0,1fr)}}
/* Services: title, description and Let's Talk read as one block at the top, level with the tab list */
.svc2__txt{justify-content:flex-start;gap:0}
.svc2__txt h3{margin:0;line-height:1.02}
.svc2__txt>div{position:relative;margin-top:clamp(1.25rem,1.8vw,1.875rem);padding-top:clamp(1.25rem,1.8vw,1.875rem)}
.svc2__txt>div::before{content:"";position:absolute;left:0;top:0;width:clamp(2.5rem,3.4vw,4rem);height:1px;background:currentColor;opacity:.35}
.svc2__txt .p1{margin:0;max-width:34ch}
.svc2__txt .btn{margin-top:clamp(1.5rem,2.2vw,2.25rem)}

/* Equal primary rows; closed submenus must contribute no padding to the row height. */
.mnu .mnu__nav>.mnu__list>.mnu__item>.mnu__link,
.mnu .mnu__nav>.mnu__list>.mnu__item>.mnu__row>.mnu__link{
 display:flex;align-items:center;min-height:3.75rem;padding:.625rem 0;
}
.mnu .mnu__nav .mnu__link .mnu__in{align-items:center;width:100%}
.mnu .mnu__nav .mnu__row{align-items:center}
.mnu .mnu__nav .mnu__row>.mnu__tog{margin-left:auto}
.mnu .has-sub:not(.is-open)>.mnu__drop>.mnu__sub{padding-block:0;margin-block:0;border-block-width:0}
.mnu .mnu__nav .mnu__n{flex:0 0 2.4em}
.hdr__menu-i i,.hdr__menu-t span{transition-duration:.15s}
@media(max-width:61.9375em){
 .mnu .mnu__nav>.mnu__list>.mnu__item>.mnu__link,
 .mnu .mnu__nav>.mnu__list>.mnu__item>.mnu__row>.mnu__link{min-height:3.5rem;padding:.5rem 0}
 .mnu .mnu__nav .mnu__t{font-size:clamp(2rem,8vw,2.625rem);line-height:1.15}
}
/* True Essence | 2026 editorial Liquid Glass navigation.
   Transforms the existing header; the menu and contact panels remain intact. */
.hdr{display:flow-root}
.hdr .hdr__c{
  --tec-glass-opacity:0;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;
  gap:clamp(8px,1.6vw,26px);
  width:calc(100% - clamp(32px,5vw,96px));
  height:clamp(70px,5.5vw,84px);
  margin:0 auto;
  padding:0 clamp(12px,2.5vw,36px);
  border-radius:999px;
  position:relative;
  isolation:isolate;
  pointer-events:none;
}
.hdr .hdr__c::before{
  content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;
  pointer-events:none;opacity:var(--tec-glass-opacity);
  background:linear-gradient(120deg,rgba(255,255,255,.23) 0%,rgba(255,255,255,.06) 34%,rgba(255,255,255,.11) 68%,rgba(255,255,255,.05) 100%),rgba(33,26,25,.60);
  border:1px solid rgba(255,255,255,.38);
  box-shadow:0 12px 40px rgba(18,12,11,.22),inset 0 1px 0 rgba(255,255,255,.4),inset 0 -1px 0 rgba(255,255,255,.10);
  -webkit-backdrop-filter:blur(24px) saturate(170%);
  backdrop-filter:blur(24px) saturate(170%);
}
.hdr .hdr__c::after{
  content:"";position:absolute;top:1px;left:8%;right:8%;height:1px;
  pointer-events:none;opacity:var(--tec-glass-opacity);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.64) 43%,rgba(255,255,255,.2) 70%,transparent);
}
.hdr .hdr__logo{
  position:static!important;left:auto!important;top:auto!important;
  grid-column:2;grid-row:1;justify-self:center;
  transform:none!important;white-space:nowrap;pointer-events:auto;
  font-size:clamp(17px,1.6vw,24px);line-height:1.1;z-index:1;
}
.hdr .hdr__talk{
  grid-column:1;grid-row:1;justify-self:start;min-width:0;
  white-space:nowrap;z-index:1;pointer-events:auto;
}
.hdr .hdr__menu{
  grid-column:3;grid-row:1;justify-self:end;white-space:nowrap;
  z-index:1;pointer-events:auto;
}
.hdr.tec-is-glass{
  mix-blend-mode:normal!important;
  background:transparent!important;
  color:var(--cream,#f9f4ee)!important;
  text-shadow:0 1px 5px rgba(0,0,0,.15);
}
.hdr.tec-is-glass .hdr__talk,.hdr.tec-is-glass .hdr__logo,.hdr.tec-is-glass .hdr__menu{color:var(--cream,#f9f4ee)!important}
body.menu-open .hdr{mix-blend-mode:normal!important;color:var(--cream,#f9f4ee)!important}
body.menu-open .hdr .hdr__c::before,body.menu-open .hdr .hdr__c::after{opacity:0!important}
.hdr a:focus-visible,.hdr button:focus-visible{outline:2px solid currentColor;outline-offset:5px;border-radius:3px}
@supports not (backdrop-filter:blur(1px)){
  .hdr .hdr__c::before{background:rgba(33,26,25,.88)}
}
@media(max-width:61.9375em){
  .hdr .hdr__c{gap:10px;padding-inline:clamp(13px,2.6vw,24px)}
  .hdr .hdr__logo{font-size:clamp(16px,2.7vw,22px)}
  .hdr .hdr__menu,.hdr .hdr__talk{font-size:clamp(10px,1.4vw,12px)}
}
@media(max-width:37.5em){
  .hdr .hdr__c{gap:6px;padding-inline:14px}
  .hdr .hdr__logo{font-size:clamp(15px,4.3vw,19px);letter-spacing:0}
  .hdr .hdr__menu,.hdr .hdr__talk{font-size:10px;letter-spacing:.01em}
  .hdr .hdr__menu{gap:7px}
  .hdr .hdr__menu-i{width:16px;height:7px}
  .hdr .hdr__talk{gap:6px}
  .hdr .hdr__talk .dot{width:6px;height:6px}
}
@media(max-width:22em){.hdr .hdr__talk .dot{display:none}.hdr .hdr__c{padding-inline:11px}}
/* Header's cinematic transitions remain enabled for all preferences. */
@media(forced-colors:active){
  .hdr.tec-is-glass .hdr__c::before{background:Canvas;border-color:CanvasText}
  .hdr.tec-is-glass{color:CanvasText!important}
  .hdr.tec-is-glass .hdr__talk,.hdr.tec-is-glass .hdr__logo,.hdr.tec-is-glass .hdr__menu{color:CanvasText!important}
}

/* Contact form: instant loading feedback while the Dubsado iframe connects.
   The page reserves its embed height so late loading cannot cause layout shift. */
.talk__form-loading,
.tembed__box--deferred .tembed__loading {
  margin:0;
  padding:clamp(1rem,2.5vw,1.625rem);
  font-family:Inter,Arial,sans-serif;
  font-size:clamp(.75rem,.73rem + .16vw,.88rem);
  letter-spacing:.035em;
  line-height:1.65;
  color:#594A46;
  background:#F9F4EE;
}
.talk__form.is-form-ready .talk__form-loading,
.tembed__box--deferred.is-form-ready .tembed__loading{display:none}
.talk__form-direct{
  display:block;
  padding:.9rem 1.1rem 1.1rem;
  border-top:1px solid rgba(38,16,13,.15);
  color:var(--ink,#211a19);
  font:600 .8rem/1.45 Inter,Arial,sans-serif;
  text-decoration:underline;
  text-underline-offset:3px
}
.talk__form-direct:focus-visible{
  outline:2px solid #875849;
  outline-offset:3px
}
.tembed__box--deferred{
  position:relative;
  background:#F9F4EE;
}
.tembed__box--deferred .tembed__loading{
  position:absolute;
  z-index:3;
  left:0;right:0;top:0;
  pointer-events:none
}
.tembed__box--deferred iframe{
  position:relative;
  z-index:2;
  background:#fff
}

/* On gallery and booking pages, the fixed navigation must remain a distinct
   readable surface over introductory labels and photographs (including at
   scroll position zero, before the glass morph starts). */
@media(max-width:61.9375em){
  body:has(.tebk,.pf-mobile-motion) .hdr{
    mix-blend-mode:normal!important;
    color:var(--cream,#f9f4ee)!important;
    text-shadow:0 1px 5px rgba(0,0,0,.18);
  }
  body:has(.tebk,.pf-mobile-motion) .hdr :is(.hdr__talk,.hdr__logo,.hdr__menu){
    color:var(--cream,#f9f4ee)!important;
  }
  body:has(.tebk,.pf-mobile-motion) .hdr .hdr__c::before,
  body:has(.tebk,.pf-mobile-motion) .hdr .hdr__c::after{
    opacity:1!important;
  }
  body.menu-open:has(.tebk,.pf-mobile-motion) .hdr .hdr__c::before,
  body.menu-open:has(.tebk,.pf-mobile-motion) .hdr .hdr__c::after{
    opacity:0!important;
  }
}
