/* Layout: fullscreen frames (fullPage-style) on a 12-column grid; photos tinted by the palette, text set in fixed zones; rich right rail = section index with progress and previews; style switcher lives inside the menu */
:root{
  --tint:#141A2E; --on:#F2EEE7; --acc:#C9A27A; --cta:#8C2F45; --cta-on:#FFF;
  --dim:color-mix(in srgb,var(--on) 72%,transparent); --hair:color-mix(in srgb,var(--on) 22%,transparent);
  --glass:color-mix(in srgb,var(--tint) 72%,transparent);
  --f-display:"Bodoni Moda","Didot",Georgia,serif;--f-body:"Jost","Futura",Arial,sans-serif;--f-label:"Jost","Futura",Arial,sans-serif;--h-case:none;--h-weight:400;--h-stretch:100%;--h-track:-.015em;--h-lead:1;--h-scale:1.02;--b-weight:400;--b-stretch:100%;--b-style:italic;
  color-scheme:dark;
}
/* typography presets */
:root[data-type="architekt"]{--f-display:"Archivo","Helvetica Neue",Arial,sans-serif; --f-body:"Manrope","Helvetica Neue",Arial,sans-serif; --f-label:"DM Mono",ui-monospace,Menlo,monospace;--h-case:uppercase; --h-weight:300; --h-stretch:112%; --h-track:-.01em; --h-lead:.92; --h-scale:1;--b-weight:700; --b-stretch:72%; --b-style:normal;}
:root[data-type="galeria"]{--f-display:"Fraunces",Georgia,serif;--f-body:"Manrope",Arial,sans-serif;--f-label:"Manrope",Arial,sans-serif;--h-case:none;--h-weight:300;--h-stretch:100%;--h-track:-.02em;--h-lead:1;--h-scale:.98;--b-weight:300;--b-stretch:100%;--b-style:italic}
:root[data-type="klasyka"]{--f-display:"Cormorant Garamond",Garamond,Georgia,serif;--f-body:"Jost","Futura",Arial,sans-serif;--f-label:"Jost","Futura",Arial,sans-serif;--h-case:uppercase;--h-weight:300;--h-stretch:100%;--h-track:.04em;--h-lead:1;--h-scale:.9;--b-weight:500;--b-stretch:100%;--b-style:normal}

*{box-sizing:border-box}
html{scroll-snap-type:y mandatory}
html.glide{scroll-snap-type:none}
body{margin:0;background:var(--tint);color:var(--on);font:300 17px/1.65 var(--f-body)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--tint)}
img,video{display:block;max-width:100%}
h1,h2,h3{font-family:var(--f-display);margin:0;text-wrap:balance;font-weight:var(--h-weight);font-stretch:var(--h-stretch);text-transform:var(--h-case);letter-spacing:var(--h-track);line-height:var(--h-lead)}
h1{font-size:calc(clamp(44px,6.2vw,108px) * var(--h-scale))}
h2{font-size:calc(clamp(38px,5.6vw,92px) * var(--h-scale))}
h3{font-size:calc(26px * var(--h-scale))}
h1 b,h2 b,h3 b{font-weight:var(--b-weight);font-stretch:var(--b-stretch);font-style:var(--b-style);color:var(--acc)}
p{margin:0}
a{color:inherit}
.lab{font:500 11px/1.4 var(--f-label);letter-spacing:.16em;text-transform:uppercase}
.acc{color:color-mix(in srgb,var(--acc) 70%,var(--on))}
.dim{color:var(--dim)}
.lede{font-size:clamp(17px,1.35vw,20px);max-width:46ch;color:var(--dim)}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.btn{display:inline-flex;align-items:center;gap:12px;font:500 13px var(--f-label);letter-spacing:.12em;text-transform:uppercase;padding:16px 24px;background:var(--cta);color:var(--cta-on);text-decoration:none;border:0;cursor:pointer;transition:gap .25s,filter .25s}
.btn:hover{gap:20px;filter:brightness(1.08)}
.btn.ghost{background:transparent;color:var(--on);box-shadow:inset 0 0 0 1px var(--hair)}
.btn[disabled]{opacity:.4;cursor:not-allowed}

/* frames */
.frame{position:relative;min-height:100svh;display:grid;overflow:hidden;scroll-snap-align:start;isolation:isolate}
.frame > .bg,.bgset > *{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.bgset{position:absolute;inset:0;z-index:-2}
.bgset > *{opacity:0;transition:opacity 1s ease}
.bgset > .on{opacity:1}
.frame::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--shade,linear-gradient(90deg,color-mix(in srgb,var(--tint) 92%,transparent) 0%,color-mix(in srgb,var(--tint) 55%,transparent) 55%,color-mix(in srgb,var(--tint) 25%,transparent)))}
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;width:100%;max-width:1480px;margin-inline:auto;padding:clamp(104px,13vh,150px) max(32px,calc(env(safe-area-inset-right,0px) + 32px)) clamp(56px,9vh,96px) max(32px,calc(env(safe-area-inset-left,0px) + 32px));align-content:end}
@media (min-width:1001px){.grid{padding-right:max(220px,calc(env(safe-area-inset-right,0px) + 220px))}}
.head{grid-column:1/-1;display:flex;align-items:baseline;gap:18px;margin-bottom:28px}
.head .num{font:500 12px var(--f-label);letter-spacing:.16em}
.head .rule{flex:1;height:1px;background:var(--hair);align-self:center}
.col-text{grid-column:1/9;display:grid;gap:26px;align-content:end}
.col-side{grid-column:9/-1;display:grid;gap:16px;align-content:end}
.caption{position:absolute;left:max(32px,calc(env(safe-area-inset-left,0px) + 32px));top:calc(env(safe-area-inset-top,0px) + 92px);font:400 11px var(--f-label);letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
@media (max-width:1000px){.col-text,.col-side{grid-column:1/-1}.col-side{margin-top:28px}.caption{display:none}}

/* top bar */
.bar{position:fixed;top:env(safe-area-inset-top,0px);left:0;right:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px max(32px,calc(env(safe-area-inset-right,0px) + 32px)) 0 max(32px,calc(env(safe-area-inset-left,0px) + 32px));pointer-events:none}
.bar > *{pointer-events:auto}
.logo{display:flex;align-items:baseline;gap:10px;text-decoration:none;font:700 19px var(--f-display);font-stretch:125%;letter-spacing:.1em;text-transform:uppercase}
.logo small{font:400 10px var(--f-label);letter-spacing:.14em;color:var(--dim);font-stretch:100%}
.bar .actions{display:flex;gap:10px}
.menu-btn{font:500 12px var(--f-label);letter-spacing:.14em;text-transform:uppercase;background:color-mix(in srgb,var(--tint) 45%,transparent);backdrop-filter:blur(10px);color:var(--on);border:1px solid var(--hair);padding:12px 16px;cursor:pointer}
@media (min-width:1001px){.bar .menu-btn{display:none}}
@media (max-width:1000px){.bar{padding-bottom:14px;background:linear-gradient(var(--tint) 50%,transparent)}.bar .btn{display:none}}

/* right index (as in Kadr 1-2): lines, label slides out on the active and hovered section */
.rail{position:fixed;right:max(34px,calc(env(safe-area-inset-right,0px) + 34px));top:50%;transform:translateY(-50%);z-index:25;display:grid;gap:12px;justify-items:end}
.rail a{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--on);opacity:.5;transition:opacity .3s}
.rail a span{font:500 11px var(--f-label);letter-spacing:.12em;text-transform:uppercase;max-width:0;overflow:hidden;white-space:nowrap;transition:max-width .4s}
.rail a i{width:18px;height:1px;background:currentColor;transition:width .3s}
.rail a.on,.rail a:hover{opacity:1}
.rail a.on i{width:40px}
.rail a:hover span,.rail a.on span{max-width:180px}
@media (max-width:1000px){.rail{display:none}}
/* thin viewfinder frame around the page */
.vf{position:fixed;inset:max(14px,env(safe-area-inset-top,0px)) max(14px,env(safe-area-inset-right,0px)) max(14px,env(safe-area-inset-bottom,0px)) max(14px,env(safe-area-inset-left,0px));border:1px solid color-mix(in srgb,var(--on) 22%,transparent);pointer-events:none;z-index:24}
/* floating style panel (palette + type), as the earlier swatch panel */
.swatches{position:fixed;z-index:26;right:max(30px,calc(env(safe-area-inset-right,0px) + 30px));top:calc(env(safe-area-inset-top,0px) + 76px);display:grid;gap:10px;background:var(--glass);backdrop-filter:blur(12px);border:1px solid var(--hair);color:var(--on);padding:12px 14px;max-width:min(440px,calc(100vw - 60px))}
.swatches .toggle{all:unset;cursor:pointer;font:500 11px var(--f-label);letter-spacing:.14em;text-transform:uppercase}
.swatches.min .setting{display:none}
.swatches .chips button{padding:7px 10px;font-size:11px}

/* overlay menu */
.ov[hidden]{display:none}
.ov{position:fixed;inset:0;z-index:50;background:var(--tint);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);overflow:auto}
.ov nav{padding:calc(env(safe-area-inset-top,0px) + 96px) 32px 40px max(32px,env(safe-area-inset-left,0px));display:grid;align-content:start;gap:2px}
.ov nav a{display:grid;grid-template-columns:44px 1fr;align-items:baseline;text-decoration:none;padding:6px 0;border-bottom:1px solid var(--hair)}
.ov nav a span:first-child{font:500 11px var(--f-label);color:var(--acc)}
.ov nav a span:last-child{font-family:var(--f-display);font-weight:var(--h-weight);font-stretch:var(--h-stretch);text-transform:var(--h-case);letter-spacing:var(--h-track);font-size:calc(clamp(26px,3vw,40px) * var(--h-scale));line-height:1.2;transition:padding .25s,color .25s}
.ov nav a:hover span:last-child{padding-left:12px;color:var(--acc)}
.ov aside{position:relative;display:grid;align-content:end;gap:22px;padding:40px max(32px,env(safe-area-inset-right,0px)) 40px 32px;isolation:isolate;min-height:100%}
.ov aside > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:opacity .4s}
.ov aside::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,var(--tint) 30%,color-mix(in srgb,var(--tint) 20%,transparent))}
.ov .close{position:fixed;top:calc(env(safe-area-inset-top,0px) + 22px);right:max(32px,env(safe-area-inset-right,0px));z-index:2}
.setting{display:grid;gap:10px}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chips button{font:400 12px var(--f-label);letter-spacing:.06em;background:transparent;color:var(--on);border:1px solid var(--hair);padding:9px 12px;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.chips button[aria-pressed="true"]{background:var(--on);color:var(--tint)}
.chips i{width:14px;height:14px;border-radius:50%;background:linear-gradient(135deg,var(--a) 0 50%,var(--b) 50% 100%);box-shadow:0 0 0 1px rgba(255,255,255,.4)}
.ov .contact{display:flex;gap:22px;flex-wrap:wrap;font:400 13px var(--f-label);letter-spacing:.06em}
@media (max-width:860px){.ov{grid-template-columns:1fr}.ov aside{min-height:auto;padding-top:24px}.ov aside > img{display:none}}
.stylepill{position:fixed;left:max(28px,calc(env(safe-area-inset-left,0px) + 28px));bottom:max(24px,calc(env(safe-area-inset-bottom,0px) + 24px));z-index:25;font:500 11px var(--f-label);letter-spacing:.1em;text-transform:uppercase;background:var(--glass);backdrop-filter:blur(10px);color:var(--on);border:1px solid var(--hair);padding:10px 14px;cursor:pointer}

/* hero */
.facts{grid-column:1/-1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;margin-top:44px;padding-top:22px;border-top:1px solid var(--hair)}
.facts b{display:block;font-family:var(--f-display);font-weight:500;font-stretch:var(--b-stretch);font-size:calc(clamp(26px,2.6vw,38px) * var(--h-scale));line-height:1.05}
.facts span{font:400 11px var(--f-label);letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
@media (max-width:1000px){.facts{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* horizontal slides (fullPage-like) */
.hslides{position:absolute;inset:0;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.hslides::-webkit-scrollbar{display:none}
.hslide{position:relative;flex:0 0 100%;min-height:100svh;display:grid;scroll-snap-align:start;isolation:isolate}
.hslide::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,color-mix(in srgb,var(--tint) 92%,transparent),color-mix(in srgb,var(--tint) 45%,transparent) 60%,color-mix(in srgb,var(--tint) 20%,transparent))}
.hslide > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hnav{position:absolute;z-index:3;left:max(32px,calc(env(safe-area-inset-left,0px) + 32px));bottom:max(28px,calc(env(safe-area-inset-bottom,0px) + 28px));display:flex;align-items:center;gap:14px}
.hnav button.arr{width:44px;height:44px;border:1px solid var(--hair);background:var(--glass);color:var(--on);cursor:pointer;font-size:16px}
.hnav .dots{display:flex;gap:8px}
.hnav .dots button{width:26px;height:3px;border:0;padding:0;background:var(--hair);cursor:pointer}
.hnav .dots button[aria-current="true"]{background:var(--acc);width:44px}
.hnav .cnt{font:500 11px var(--f-label);letter-spacing:.14em}
.hframe .grid{padding-bottom:clamp(110px,14vh,140px)}
.list{display:grid;gap:0;margin:0;padding:0;list-style:none;border-top:1px solid var(--hair)}
.list li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--hair);font-size:16px}
.list li span:last-child{font:400 12px var(--f-label);letter-spacing:.06em;color:var(--dim);text-align:right}
.panel{background:var(--glass);backdrop-filter:blur(14px);border:1px solid var(--hair);padding:24px;display:grid;gap:14px}
.spec{display:grid;grid-template-columns:auto 1fr;gap:8px 20px;margin:0;font-size:15px}
.spec dt{font:400 11px var(--f-label);letter-spacing:.12em;text-transform:uppercase;color:var(--dim);padding-top:3px}
.spec dd{margin:0}

/* light */
.sweep{position:absolute;inset:-30%;z-index:-1;background:repeating-linear-gradient(118deg,rgba(255,206,150,0) 0 7%,rgba(255,206,150,.2) 7% 10%,rgba(255,206,150,0) 10% 17%);mix-blend-mode:screen;animation:sweep 14s ease-in-out infinite alternate}
@keyframes sweep{from{transform:translateX(-8%)}to{transform:translateX(8%)}}
.hours{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--hair);border:1px solid var(--hair)}
.hours button{font:500 13px var(--f-label);letter-spacing:.08em;background:var(--glass);color:var(--on);border:0;padding:16px 8px;cursor:pointer}
.hours button[aria-pressed="true"]{background:var(--on);color:var(--tint)}

/* roles + portfolio + films */
.tabs{display:grid;border-top:1px solid var(--hair)}
.tabs button{all:unset;cursor:pointer;display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:14px 0;border-bottom:1px solid var(--hair);opacity:.55;transition:opacity .3s,padding .3s}
.tabs button span:first-child{font-family:var(--f-display);font-weight:var(--h-weight);font-stretch:var(--h-stretch);text-transform:var(--h-case);letter-spacing:var(--h-track);font-size:calc(clamp(22px,2.2vw,32px) * var(--h-scale));line-height:1.1}
.tabs button span:last-child{font:400 11px var(--f-label);letter-spacing:.1em;text-transform:uppercase}
.tabs button[aria-selected="true"],.tabs button:hover{opacity:1;padding-left:12px}
.tabs button:focus-visible{outline:2px solid var(--acc)}
.cats{display:flex;gap:6px;flex-wrap:wrap}
.cats button{font:400 12px var(--f-label);letter-spacing:.08em;text-transform:uppercase;background:transparent;color:var(--on);border:1px solid var(--hair);padding:9px 12px;cursor:pointer}
.cats button[aria-pressed="true"]{background:var(--on);color:var(--tint)}
.reel{grid-column:1/-1;display:grid;grid-auto-flow:column;grid-auto-columns:clamp(200px,20vw,300px);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 0 12px;margin-top:22px;scrollbar-width:thin}
.reel button{all:unset;cursor:zoom-in;scroll-snap-align:start;display:grid;gap:8px}
.reel button[hidden]{display:none}
.reel img{aspect-ratio:4/5;width:100%;object-fit:cover;transition:transform .8s}
.reel button:hover img{transform:scale(1.03)}
.reel button:focus-visible img{outline:2px solid var(--acc);outline-offset:3px}
.reel .cap{display:flex;justify-content:space-between;font:400 11px var(--f-label);letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
dialog.lb{border:0;padding:0;background:transparent;max-width:94vw;max-height:92vh;color:var(--on)}
dialog.lb::backdrop{background:rgba(8,10,20,.93)}
dialog.lb img{max-height:84vh;width:auto;margin-inline:auto}
dialog.lb p{text-align:center;margin-top:10px;font:400 12px var(--f-label);letter-spacing:.12em;text-transform:uppercase}
dialog.lb button{position:fixed;top:max(16px,env(safe-area-inset-top,0px));right:max(16px,env(safe-area-inset-right,0px))}
.thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.thumbs button{all:unset;cursor:pointer;display:grid;gap:8px;position:relative;align-content:start}
.thumbs img{aspect-ratio:3/4;height:auto;object-fit:cover;width:100%;display:block;opacity:.55;transition:opacity .3s}
.thumbs button[aria-pressed="true"] img{opacity:1;outline:1px solid var(--on);outline-offset:3px}
.thumbs button:focus-visible img{outline:2px solid var(--acc)}

/* prices */
.ptable{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.ptable th,.ptable td{padding:14px 10px;border-bottom:1px solid var(--hair);text-align:right}
.ptable th:first-child,.ptable td:first-child{text-align:left}
.ptable thead th{font:500 11px var(--f-label);letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.ptable td b{font-family:var(--f-display);font-weight:500;font-size:calc(26px * var(--h-scale))}
.ptable td small{display:block;font:400 11px var(--f-label);color:var(--dim)}
.tablewrap{overflow-x:auto}


/* gallery v4: featured frame, thumbnail wall, fullscreen viewer */
.gal{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:28px;align-items:end}
.feat{position:relative;margin:0;height:min(62vh,640px);overflow:hidden;cursor:zoom-in;background:color-mix(in srgb,var(--on) 6%,transparent)}
.feat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .9s ease,transform 6s ease}
.feat img.back{opacity:0}
.feat:hover img.front{transform:scale(1.03)}
.feat figcaption{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:end;gap:16px;padding:60px 20px 18px;background:linear-gradient(transparent,color-mix(in srgb,var(--tint) 85%,transparent))}
.feat figcaption h3{font-size:calc(28px * var(--h-scale))}
.feat .meta{font:400 11px var(--f-label);letter-spacing:.12em;text-transform:uppercase;color:var(--dim);text-align:right}
.feat .prog{position:absolute;left:0;top:0;height:2px;background:var(--acc);width:0}
.feat .prog.run{animation:prog var(--dur,6s) linear forwards}
@keyframes prog{to{width:100%}}
.wall{display:grid;gap:14px;align-content:end}
.thumbs-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;align-content:start;padding:2px}
.thumbs-grid button{all:unset;cursor:pointer;display:block;position:relative;width:100%;height:0;padding-top:100%;overflow:hidden;box-sizing:border-box}
.thumbs-grid button[hidden]{display:none}
.thumbs-grid img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.6;filter:grayscale(.35);transition:opacity .4s,filter .4s,transform .6s}
.thumbs-grid button:hover img{transform:scale(1.05)}
.thumbs-grid button:hover img{opacity:.9;filter:none}
.thumbs-grid button[aria-current="true"] img{opacity:1;filter:none}
.thumbs-grid button[aria-current="true"]::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 2px var(--acc);z-index:2}
.thumbs-grid button:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.gal-ctrl{display:flex;justify-content:space-between;align-items:center;gap:12px}
.gal-ctrl .arrows{display:flex;gap:6px}
.gal-ctrl .arrows button,.viewer .nav button{width:44px;height:44px;border:1px solid var(--hair);background:var(--glass);color:var(--on);cursor:pointer;font-size:16px}
.gal-ctrl .count{font:500 12px var(--f-label);letter-spacing:.14em}
@media (max-width:1000px){.gal{grid-template-columns:1fr}.feat{height:52vh}.thumbs-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media (max-width:480px){.thumbs-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}}
dialog.viewer{border:0;padding:0;width:100vw;height:100vh;max-width:none;max-height:none;background:color-mix(in srgb,var(--tint) 96%,black);color:var(--on)}
dialog.viewer::backdrop{background:rgba(5,7,14,.9)}
.viewer .stage{position:absolute;inset:70px 80px 120px;display:grid;place-items:center}
.viewer .stage img{max-width:100%;max-height:calc(100vh - 200px);object-fit:contain;transition:opacity .5s}
.viewer .top{position:absolute;top:max(18px,env(safe-area-inset-top,0px));left:max(24px,env(safe-area-inset-left,0px));right:max(24px,env(safe-area-inset-right,0px));display:flex;justify-content:space-between;align-items:center;gap:16px}
.viewer .top h3{font-size:calc(22px * var(--h-scale))}
.viewer .nav{position:absolute;top:50%;left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));display:flex;justify-content:space-between;transform:translateY(-50%);pointer-events:none}
.viewer .nav button{pointer-events:auto}
.viewer .strip{position:absolute;left:0;right:0;bottom:max(16px,env(safe-area-inset-bottom,0px));display:flex;gap:6px;justify-content:center;overflow-x:auto;padding:0 24px}
.viewer .strip button{all:unset;cursor:pointer;flex:0 0 64px;height:64px;opacity:.45}
.viewer .strip button[hidden]{display:none}
.viewer .strip button[aria-current="true"]{opacity:1;box-shadow:0 0 0 2px var(--acc)}
.viewer .strip img{width:100%;height:100%;object-fit:cover}
@media (max-width:700px){.viewer .stage{inset:70px 12px 100px}.viewer .strip button{flex-basis:48px;height:48px}}

/* hero slideshow: slow GPU zoom and pan, long crossfade (browser-smooth, no video jitter) */
.kb > img{transition:opacity 2.2s ease;will-change:transform,opacity;animation:kbA 16s ease-in-out infinite alternate}
.kb > img:nth-child(2n){animation-name:kbB}
@keyframes kbA{from{transform:scale(1.02) translate3d(0,0,0)}to{transform:scale(1.12) translate3d(-2.5%,-1.5%,0)}}
@keyframes kbB{from{transform:scale(1.12) translate3d(2%,1%,0)}to{transform:scale(1.02) translate3d(0,0,0)}}

/* booking */
.book{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,.9fr);gap:1px;background:var(--hair);border:1px solid var(--hair)}
.pane{background:var(--glass);backdrop-filter:blur(14px);padding:22px;display:grid;gap:14px;align-content:start;min-width:0}
.pane h3{font-size:calc(22px * var(--h-scale))}
.seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--hair);border:1px solid var(--hair)}
.seg.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.seg.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.seg button{font:400 12px var(--f-label);letter-spacing:.04em;background:var(--glass);color:var(--on);border:0;padding:11px 6px;cursor:pointer;line-height:1.3}
.seg button small{display:block;opacity:.7;font-size:10px}
.seg button[aria-pressed="true"]{background:var(--on);color:var(--tint)}
.cal-head{display:flex;justify-content:space-between;align-items:center}
.cal-head h3{text-transform:capitalize}
.cal-head button{font:400 13px var(--f-label);background:transparent;color:var(--on);border:1px solid var(--hair);width:38px;height:38px;cursor:pointer}
.cal-head button[disabled]{opacity:.3;cursor:default}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;text-align:center}
.cal .dow{font:400 10px var(--f-label);letter-spacing:.1em;text-transform:uppercase;color:var(--dim);padding-bottom:4px}
.cal button{aspect-ratio:1;background:color-mix(in srgb,var(--on) 7%,transparent);border:0;color:var(--on);font:500 14px var(--f-body);cursor:pointer;position:relative;font-variant-numeric:tabular-nums}
.cal button::after{content:"";position:absolute;left:50%;bottom:5px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--dot,transparent)}
.cal button.free{--dot:#8FD3A8}.cal button.some{--dot:#E9C27A}
.cal button[disabled]{background:transparent;opacity:.28;cursor:default}
.cal button[aria-pressed="true"]{background:var(--on);color:var(--tint)}
.legend{display:flex;gap:14px;flex-wrap:wrap;font:400 11px var(--f-label);color:var(--dim)}
.legend i{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:6px;vertical-align:middle}
.slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px}
.slots button{padding:10px 2px;background:color-mix(in srgb,var(--on) 7%,transparent);border:1px solid transparent;color:var(--on);font:400 13px var(--f-label);cursor:pointer}
.slots button[disabled]{text-decoration:line-through;opacity:.28;cursor:default;background:transparent}
.slots button.sel{background:var(--on);color:var(--tint)}
.slots button.in{border-color:var(--on)}
.slots .note{grid-column:1/-1;font-size:14px;color:var(--dim)}
.status{display:inline-flex;align-items:center;gap:8px;font:400 11px var(--f-label);letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.status i{width:8px;height:8px;border-radius:50%;background:#E9C27A}
.status.live i{background:#8FD3A8}
.sum{display:grid;gap:8px}
.sum .row{display:flex;justify-content:space-between;gap:12px;font-size:14px}
.sum .row span:first-child{color:var(--dim)}
.sum .tot{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--hair);padding-top:10px}
.sum .tot b{font-family:var(--f-display);font-weight:500;font-size:calc(40px * var(--h-scale));line-height:1}
.field{display:grid;gap:4px;font:400 11px var(--f-label);letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.field input,.field textarea{font:300 16px var(--f-body);text-transform:none;letter-spacing:0;color:var(--on);background:transparent;border:0;border-bottom:1px solid var(--hair);padding:8px 0;resize:vertical}
.field input:focus,.field textarea:focus{outline:none;border-bottom-color:var(--on)}
.hp{position:absolute;left:-9999px}
.okmsg{border:1px solid var(--hair);padding:12px;font-size:14px}
@media (max-width:1100px){.book{grid-template-columns:1fr 1fr}.book .pane:last-child{grid-column:1/-1}}
@media (max-width:700px){.book{grid-template-columns:1fr}}

/* faq */
.faq details{border-bottom:1px solid var(--hair);padding-block:16px}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;font-family:var(--f-display);font-weight:var(--h-weight);font-stretch:var(--h-stretch);text-transform:var(--h-case);letter-spacing:var(--h-track);font-size:calc(clamp(19px,1.8vw,26px) * var(--h-scale));line-height:1.2}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--f-label)}
.faq details[open] summary::after{content:"–"}
.faq p{margin-top:10px;max-width:60ch;color:var(--dim)}

/* screen-to-screen entrance: JS adds .pre to frames that are off screen, removes it when a frame arrives */
.frame > .bg,.frame > .bgset,.hslide > img{transition:transform 2.2s cubic-bezier(.22,.61,.36,1),opacity 1s ease}
.frame.pre > .bg,.frame.pre > .bgset,.frame.pre .hslide > img{transform:scale(1.06)}
.frame .grid > *{transition:opacity 1.2s ease,transform 1.5s cubic-bezier(.22,.61,.36,1);transition-delay:calc(var(--i,0) * 140ms + 250ms)}
.frame.pre .grid > *{opacity:0;transform:translateY(36px)}
.head .rule{transform-origin:left;transition:transform 1.2s cubic-bezier(.2,.7,.2,1) .35s}
.frame.pre .head .rule{transform:scaleX(0)}
.frame.pre .hnav{opacity:0}
.hnav{transition:opacity .8s ease .6s}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;scroll-snap-type:y proximity}*{animation:none!important;transition:none!important}.frame.pre .grid > *,.frame.pre .hnav{opacity:1;transform:none}.frame.pre > .bg,.frame.pre > .bgset,.frame.pre .hslide > img,.frame.pre .head .rule{transform:none}}

/* light rounding */
:root{--r:10px;--r-s:6px}
.btn,.menu-btn,.chips button,.cats button,.seg,.hours,.cal-head button,.slots button,.cal button,.gal-ctrl .arrows button,.viewer .nav button,.hnav button.arr,.tabs button{border-radius:var(--r-s)}
.seg,.hours{overflow:hidden}
.panel,.pane,.book,.feat,.swatches,.okmsg,.room-cards button,.tablewrap{border-radius:var(--r)}
.book{overflow:hidden}
.thumbs-grid button,.thumbs img,.viewer .strip button,.viewer .stage img,.gear-card figure{border-radius:var(--r-s);overflow:hidden}
.hnav .dots button{border-radius:2px}
.vf{border-radius:16px}

/* style panel opens from the top bar */
.bar .style-btn{display:inline-block !important}
.swatches.min{display:none}
.swatches{top:calc(env(safe-area-inset-top,0px) + 74px)}
.wm-legend{display:flex;align-items:center;gap:8px;text-transform:none;letter-spacing:.02em}

/* camera watermark: marks photos taken from the internet, to be replaced */
.wmi{position:absolute;top:12px;right:12px;width:30px;height:30px;border-radius:7px;background:rgba(10,12,22,.55) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5h3.2l1.8-2.8h7l1.8 2.8h3.2v10.8h-17z'/%3E%3Ccircle cx='12' cy='13.6' r='3.6'/%3E%3C/svg%3E") center/18px no-repeat;box-shadow:0 0 0 1px rgba(255,255,255,.28);z-index:6;pointer-events:none}
.wmi.frame-wm{top:calc(env(safe-area-inset-top,0px) + 84px);right:max(34px,calc(env(safe-area-inset-right,0px) + 34px))}
.wmi.small{top:5px;right:5px;width:20px;height:20px;border-radius:5px;background-size:12px}
.wmi.inline{position:static;display:inline-block;flex:none}
.thumbs button,.viewer .strip button,.viewer .stage,#ov aside{position:relative}

/* equipment list: quantity column, name, details underneath */
.kit{list-style:none;margin:0;padding:0;display:grid}
.kit-group{font:500 11px var(--f-label);letter-spacing:.14em;text-transform:uppercase;color:var(--acc);padding:14px 0 6px}
.kit-group:first-child{padding-top:0}
.kit-row{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--hair)}
.kit-row .q{font-family:var(--f-display);font-weight:500;font-size:calc(24px * var(--h-scale));line-height:1;color:var(--acc)}
.kit-row .n{display:grid;gap:2px;min-width:0}
.kit-row b{font-weight:500;font-size:17px;line-height:1.3}
.kit-row small{font-size:14px;color:var(--dim);line-height:1.4}
.kit-sum{margin-top:12px;font:500 11px var(--f-label);letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}

/* rooms overview cards */
.room-cards{display:grid;gap:12px}
.room-cards button{all:unset;cursor:pointer;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;padding:20px 22px;background:var(--glass);backdrop-filter:blur(14px);border:1px solid var(--hair);border-radius:var(--r);transition:border-color .3s,transform .3s}
.room-cards button:hover{border-color:var(--acc);transform:translateX(4px)}
.room-cards button:focus-visible{outline:2px solid var(--acc)}
.room-cards b{font-family:var(--f-display);font-weight:500;font-size:calc(34px * var(--h-scale));line-height:1}
.room-cards span{color:var(--dim)}
.room-cards i{font-style:normal;color:var(--acc);font-size:20px}

/* phone and tablet: frames grow with their content; nothing is clipped or overlaps */
@media (max-width:1000px){
  html,html.glide{scroll-snap-type:none}
  .frame{min-height:auto;overflow:hidden}
  #s1{min-height:100svh}
  .grid{padding:96px max(22px,calc(env(safe-area-inset-right,0px) + 22px)) 52px max(22px,calc(env(safe-area-inset-left,0px) + 22px));column-gap:0}
  .grid > *{grid-column:1/-1 !important}
  .col-side[style*="justify-items:end"],.stack[style*="justify-items:end"]{justify-items:start !important}
  h1{font-size:calc(clamp(34px,10.4vw,56px) * var(--h-scale))}
  h2{font-size:calc(clamp(28px,8.6vw,46px) * var(--h-scale))}
  h1,h2,h3{overflow-wrap:break-word;hyphens:auto}
  .lede{font-size:16px}
  .head{flex-wrap:wrap;row-gap:6px;margin-bottom:20px}
  .head .rule{min-width:30px}
  .frame,.hslide{--shade:linear-gradient(0deg,color-mix(in srgb,var(--tint) 94%,transparent),color-mix(in srgb,var(--tint) 72%,transparent)) !important}
  .hslide::before{background:var(--shade)}
  .hframe{display:block}
  .hslides{position:relative;inset:auto}
  .hslide{min-height:auto}
  .hframe .grid{padding-bottom:24px}
  .hnav{position:relative;left:auto;bottom:auto;padding:0 22px 44px}
  .panel,.pane{padding:18px}
  .spec{grid-template-columns:1fr;gap:2px 0}
  .spec dd{margin-bottom:8px}
  .room-cards b{font-size:28px}
  .feat{height:54vh}
  .hours button{padding:14px 4px}
  .logo small{display:none}
  .vf{inset:8px;border-radius:14px}
  .wmi.frame-wm{top:calc(env(safe-area-inset-top,0px) + 76px);right:22px}
  .hslide .wmi.frame-wm{top:18px}
  .swatches{left:max(12px,env(safe-area-inset-left,0px));right:max(12px,env(safe-area-inset-right,0px));top:calc(env(safe-area-inset-top,0px) + 70px);max-width:none;max-height:calc(100svh - 96px);overflow:auto}
}
@media (max-width:600px){
  .hnav .dots{display:none}
  .ptable thead{display:none}
  .ptable,.ptable tbody,.ptable tr{display:block;width:100%}
  .ptable tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 10px;padding:14px 0;border-bottom:1px solid var(--hair)}
  .ptable td{border:0;padding:0;text-align:left}
  .ptable td:first-child{grid-column:1/-1;font-weight:500;margin-bottom:6px}
  .ptable td:not(:first-child)::before{content:attr(data-label);display:block;font:400 10px var(--f-label);letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
  .ptable td b{font-size:calc(22px * var(--h-scale))}
}


/* ---------- CMS additions: skip link, page layout, footer, consent, watermark toggles ---------- */
.skip{position:absolute;left:-9999px;top:10px;z-index:100;background:var(--on);color:var(--tint);padding:10px 14px;border-radius:6px;font:500 14px var(--f-body)}
.skip:focus{left:14px}
.sr-only,.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* content pages (privacy policy etc.): classes the WordPress editor writes */
.page-inner .alignleft{float:left;margin:.3em 1.2em .8em 0}.page-inner .alignright{float:right;margin:.3em 0 .8em 1.2em}.page-inner .aligncenter{display:block;margin-inline:auto}
.page-inner img{max-width:100%;height:auto}.wp-caption,.gallery-caption{max-width:100%}.wp-caption-text,.gallery-caption{font-size:.85em;opacity:.75;margin-top:.4em}
@media (max-width:600px){.page-inner .alignleft,.page-inner .alignright{float:none;margin:.8em 0}}
.ctas{display:flex;gap:12px;flex-wrap:wrap}
.light-col{grid-column:7/-1}
.price-text{grid-column:1/6}.price-side{grid-column:7/-1}
.faq-text{grid-column:1/5}.col-side.faq{grid-column:6/-1}
.book-title{grid-column:1/-1;margin-bottom:24px}
.book-grid,.gal-grid{align-content:center}
address{font-style:normal}
.lede a,.faq a{color:inherit;text-underline-offset:3px}
.vtools{display:flex;gap:14px;align-items:center}
.feat .feat-wm,.viewer .stage .feat-wm{display:none}
.feat.is-ph .feat-wm,.viewer .stage.is-ph .feat-wm{display:block}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.45;color:var(--dim)}
.consent input{margin-top:2px;accent-color:var(--acc);width:18px;height:18px;flex:none}
.site-foot{position:relative;z-index:2;background:var(--tint);color:var(--dim);border-top:1px solid var(--hair);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-size:14px;padding:26px max(32px,calc(env(safe-area-inset-right,0px) + 32px)) calc(26px + env(safe-area-inset-bottom,0px)) max(32px,calc(env(safe-area-inset-left,0px) + 32px))}
.site-foot p{margin:0}
.site-foot a{color:var(--on)}
.foot-links,.site-foot .menu,.ov-links{display:flex;gap:18px;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.ov-links a{color:var(--on)}
.bar-page{background:linear-gradient(var(--tint) 65%,transparent);padding-bottom:16px}
.page-body{background:var(--tint);color:var(--on);min-height:72vh;padding:130px max(22px,calc(env(safe-area-inset-right,0px) + 22px)) 72px max(22px,calc(env(safe-area-inset-left,0px) + 22px))}
.page-inner{max-width:760px;margin:0 auto}
.page-body h1{font-size:calc(clamp(34px,5vw,60px) * var(--h-scale));margin-bottom:28px}
.page-body h2{font-size:calc(clamp(26px,3.2vw,38px) * var(--h-scale));margin:36px 0 14px}
.page-body p,.page-body li{font-size:18px;line-height:1.75;color:color-mix(in srgb,var(--on) 88%,transparent)}
.page-body a{color:var(--acc)}
.page-body img{height:auto;border-radius:var(--r,10px)}
.page-body input,.page-body textarea,.page-body select{font:300 16px var(--f-body);color:var(--on);background:transparent;border:1px solid var(--hair);border-radius:6px;padding:10px 12px}
.page-body .btn{color:var(--cta-on)}
.entry{margin-bottom:56px}
@media print{.bar,.rail,.vf,.swatches,.hnav,.ov,.sweep{display:none!important}.frame{min-height:auto;color:#000}.frame::before{display:none}}