/* Prestige — local marble & relief finish, matched to Johan's supplied sketch.
   Decorative styles only: no layout metrics, image crops or interaction transforms. */
:root{
  --marble-texture:url('../images/materials/prestige-marble-copper.webp');
  --relief-ivory:linear-gradient(180deg,#fff9ef 8%,#f4ecdf 43%,#d9c7b3 75%,#fff5e6 100%);
  --relief-title:-.012em -.012em .008em #fff0d699,.012em .014em 0 #b49b82,.024em .028em 0 #6b5341,.032em .044em .015em #312116,.04em .075em .04em #0009,0 .16em .12em #000a,0 .3em .3em #0005;
  --relief-small:0 -.5px .3px #fff5e655,.7px 1px 0 #957d64,1px 2px 1px #33251b,0 5px 4px #000a,0 9px 12px #0005;
  --photo-depth:0 2px 3px #0009,0 8px 12px #0005,0 22px 30px -9px #0008;
  --glass-depth:inset 0 1px 0 #f5dfc947,inset 0 -1px 0 #ad8b691c,0 2px 3px #0009,0 10px 19px #0006;
}
body{isolation:isolate;background-color:#100f0e}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;contain:strict;background-image:linear-gradient(#0807062b,#08070640),var(--marble-texture);background-size:cover;background-position:center;background-repeat:no-repeat}
/* The hero remains opaque and photograph-only; its existing overlays stay intact. */
.hero h1,.section-intro h2,.projects-heading h2,.about h2,.contact h2{color:#f7efe4;text-shadow:var(--relief-title)}
@supports(background-clip:text){
  .hero h1>span,.section-intro h2,.projects-heading h2,.about h2,.contact h2{background-image:var(--relief-ivory);background-clip:text;-webkit-background-clip:text;color:rgb(255 246 232 / .97)}
}
.hero h1 em,.section-intro h2 em,.about h2 em,.contact h2 em,.projects-heading h2 .accent{color:var(--accent);text-shadow:-.01em -.01em .008em #ffd9a06b,.012em .018em 0 #b34e00,.025em .04em .015em #5b2800,.04em .08em .055em #000b,0 .17em .13em #0009}
.project-name,.contact-address strong{color:#f7efe4;text-shadow:var(--relief-small)}
main p,main figcaption,.project-kind,.project-open,.intro-description .text-link,.about-copy .text-link,.contact-links,.site-footer{ text-shadow:0 1px 1px #000c,0 3px 5px #0006 }
.hero-subtitle,.hero .eyebrow,.reassurance span{ text-shadow:0 -.5px .4px #fff6e62e,0 2px 1px #17100dc9,0 5px 8px #0008 }
.section-kicker{ text-shadow:0 1px 0 #6f2e00,0 3px 5px #0009 }
.kitchen-main,.wardrobe-scene,.about-photo{outline:1px solid #d9bda343;outline-offset:-1px;box-shadow:inset 0 1px 0 #fff2df66,var(--photo-depth)}
.kitchen-detail>img{outline:1px solid #d9bda343;outline-offset:-1px;box-shadow:var(--photo-depth)}
.project-link figure{border-color:#d5bfaa80;box-shadow:inset 0 1px 0 #fff2df8c,0 2px 3px #000a,0 9px 12px #0007,0 20px 23px -10px #0009}
.button-primary{background-image:linear-gradient(180deg,#ffffff29,#ffffff00 42%,#77260026);box-shadow:inset 0 1px 0 #ffefc999,inset 0 -2px 1px #7b320066,0 2px 3px #0008,0 7px 14px #9a3d0033,0 15px 23px #0006;text-shadow:0 1px 1px #8d3a0059}
.button-primary:hover{background-image:linear-gradient(180deg,#ffffff30,#ffffff00 42%,#77260026)}
.button-outline{background-image:linear-gradient(180deg,#ffffff12,#0d0b090d 50%,#00000020);box-shadow:inset 0 1px 0 #fff1de47,inset 0 -1px 0 #0008,0 2px 3px #0007,0 9px 18px #0005;text-shadow:0 2px 3px #0009}
.text-link{filter:none;text-shadow:0 1px 1px #000b,0 3px 5px #0007}
.project-open{box-shadow:0 4px 8px -7px #ff800066}
/* Peripheral finish only: optical shaders, their colours and their springs are untouched. */
.site-header .liquid-nav,.site-header .liquid-nav.liquid-gl-ready,.project-filters.liquid-filters,.project-filters.liquid-filters.liquid-gl-ready{outline:1px solid #d2baa23b;outline-offset:-1px;box-shadow:var(--glass-depth)}
.project-arrows .icon-button,.gallery-arrow,.lightbox-top .icon-button,.menu-toggle:not([hidden]),.mobile-menu-top .icon-button,.scroll-cue{border-color:#ead7c09c;background-image:radial-gradient(ellipse at 35% 0,#fff0d51c,transparent 70%);box-shadow:inset 0 1px 0 #fff0d54d,inset 0 -1px 0 #0006,0 3px 4px #0008,0 10px 15px #0006}
.lightbox,.mobile-menu{background-color:#100f0e;background-image:linear-gradient(#0c0b0ac9,#0c0b0ae8),var(--marble-texture);background-position:center;background-size:cover;background-repeat:no-repeat}
.lightbox{border-color:#d8c0a163;box-shadow:inset 0 1px 0 #f8e9cf38,0 5px 10px #000a,0 30px 70px #0009}
.lightbox-top h2{color:#f7efe4;text-shadow:0 -.5px .3px #fff0d63b,0 2px 1px #000b,0 4px 5px #0007}
.circular-card{border-color:#d8c0a15c;box-shadow:inset 0 1px 0 #fff0d57a,0 3px 5px #0009,0 16px 25px #0007,0 27px 38px -10px #0008}
.lightbox.is-expanded .circular-card.is-active{border-color:#ead7bda1;box-shadow:inset 0 1px 0 #fff2db80,0 4px 7px #000a,0 24px 42px #0009}
.site-footer{border-top-color:#c3a3862e;box-shadow:inset 0 1px 0 #ffffff05}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .project-link:hover figure{border-color:#e6c7a4b3;box-shadow:inset 0 1px 0 #fff5e2a1,0 3px 4px #0009,0 12px 16px #0007,0 24px 28px -10px #0009}
  .button-primary:hover{box-shadow:inset 0 1px 0 #fff0d5b3,inset 0 -2px 1px #7b320080,0 3px 4px #0009,0 9px 18px #9a3d0040,0 18px 26px #0007}
}
@media(max-width:1023px){
  :root{--relief-title:-.01em -.01em .008em #fff0d680,.012em .018em 0 #a68b70,.025em .035em 0 #5c4231,0 .09em .06em #000a,0 .19em .17em #0007;--photo-depth:0 2px 3px #0008,0 9px 17px #0006,0 18px 24px -10px #0006}
}
@media(max-width:700px){
  :root{--marble-texture:url('../images/materials/prestige-marble-copper-mobile.webp');--relief-title:0 -.5px .3px #fff0d65c,.5px 1px 0 #b19b83,1px 2px .5px #574132,0 4px 3px #000b,0 8px 9px #0007;--relief-small:0 -.3px .2px #fff0d640,.5px 1px 0 #8a7159,0 3px 3px #0009;--glass-depth:inset 0 1px 0 #f5dfc93b,0 2px 3px #0008,0 7px 13px #0005}
  .hero h1 em,.section-intro h2 em,.about h2 em,.contact h2 em,.projects-heading h2 .accent{text-shadow:0 -.4px .3px #ffd9a04d,.5px 1px 0 #a74700,1px 2px .4px #522400,0 4px 4px #000a}
  .project-link figure,.circular-card{box-shadow:inset 0 1px 0 #fff0d557,0 2px 3px #0009,0 9px 14px #0006}
  .button-primary{box-shadow:inset 0 1px 0 #ffefc980,inset 0 -1px 0 #7b320066,0 2px 3px #0008,0 7px 12px #9a3d002b}
  .button-outline,.project-arrows .icon-button,.gallery-arrow,.lightbox-top .icon-button,.menu-toggle:not([hidden]),.scroll-cue{box-shadow:inset 0 1px 0 #fff0d53b,0 2px 3px #0008,0 7px 12px #0005}
}
@media(forced-colors:active){
  body::before{display:none}
  .hero h1>span,.section-intro h2,.projects-heading h2,.about h2,.contact h2{background:none;color:CanvasText;text-shadow:none}
}

/* Only the public product-carousel arrows: shared optical renderer, circular lenses. */
:is(#project-previous,#project-next){position:relative;isolation:isolate;display:grid;place-items:center;width:54px;height:54px;min-width:54px;min-height:54px;padding:0;overflow:hidden;border:1px solid #f1dfc6c9;border-radius:50%;background:radial-gradient(ellipse at 35% 8%,#fff1d526,transparent 62%),#191815c7;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);box-shadow:inset 0 1px 1px #fff4de80,inset 0 -1px 1px #0009,0 3px 4px #0009,0 12px 18px -4px #0009;opacity:1;transition:transform .4s cubic-bezier(.22,1.35,.36,1),box-shadow .3s,border-color .3s,opacity .25s}
:is(#project-previous,#project-next)::before{content:'';position:absolute;inset:4px;z-index:0;border:1px solid #eedfca5c;border-radius:50%;background:linear-gradient(140deg,#ffffff1c,#ffffff00 54%,#00000017);box-shadow:inset 0 1px 4px #fff1d540;pointer-events:none}
:is(#project-previous,#project-next)>.icon{position:relative;z-index:1;width:28px;height:28px;pointer-events:none;filter:brightness(0) saturate(100%) invert(94%) sepia(14%) saturate(286%) hue-rotate(346deg) brightness(104%)}
:is(#project-previous,#project-next)>.liquid-arrow-scene{position:absolute;inset:0;z-index:0;width:100%;height:100%;pointer-events:none;opacity:0;border-radius:50%}
:is(#project-previous,#project-next).liquid-gl-ready>.liquid-arrow-scene{opacity:1}
:is(#project-previous,#project-next).liquid-gl-ready>.icon,:is(#project-previous,#project-next).liquid-gl-ready::before{opacity:0}
:is(#project-previous,#project-next):disabled{opacity:.68;cursor:default;border-color:#f1dfc6a6;background-color:#191815c7}
:is(#project-previous,#project-next):focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@media(hover:hover){:is(#project-previous,#project-next):not(:disabled):hover{transform:translateY(-1px);border-color:#fff0dce6;background-color:#24211cc9;box-shadow:inset 0 1px 2px #fff4de99,inset 0 -1px 1px #0009,0 4px 5px #0009,0 14px 20px -4px #0009}}
:is(#project-previous,#project-next):not(:disabled):active{transform:translateY(1px) scale(.96)}
@media(max-width:1023px){:is(#project-previous,#project-next){width:50px;height:50px;min-width:50px;min-height:50px}}
@media(max-width:700px){:is(#project-previous,#project-next){width:46px;height:46px;min-width:46px;min-height:46px;box-shadow:inset 0 1px 1px #fff4de80,0 2px 3px #0009,0 8px 12px -3px #0009}:is(#project-previous,#project-next)>.icon{width:26px;height:26px}}
@media(prefers-reduced-motion:reduce){:is(#project-previous,#project-next){transition:none!important}:is(#project-previous,#project-next):not(:disabled):hover,:is(#project-previous,#project-next):not(:disabled):active{transform:none}}
@media(forced-colors:active){:is(#project-previous,#project-next)>.liquid-arrow-scene{display:none}:is(#project-previous,#project-next).liquid-gl-ready>.icon{opacity:1;filter:none}:is(#project-previous,#project-next){border-color:ButtonText}}
@media(forced-colors:active){
  :is(#project-previous,#project-next).liquid-gl-ready>.icon,:is(#project-previous,#project-next)>.icon{opacity:0}
  :is(#project-previous,#project-next)::after{content:'';position:absolute;inset:13px;background:ButtonText;mask:url('../icons/previous.svg') center/contain no-repeat;pointer-events:none}
  #project-next::after{mask-image:url('../icons/next.svg')}
}

/* Arrow feedback only: warm hover, and a JS-held pulse for quick clicks. */
:is(#project-previous,#project-next){transition:transform .225s cubic-bezier(.22,1.2,.36,1),box-shadow .225s ease,border-color .225s ease,background-color .225s ease,opacity .225s ease}
:is(#project-previous,#project-next).is-arrow-hot:not(:disabled){transform:translateY(-2.5px);border-color:#ff9838e6;background-color:#2c2018d6;box-shadow:inset 0 1px 2px #ffe0b9a6,inset 0 -1px 1px #4e250a99,0 0 13px 2px #ff800038,0 4px 7px #0008,0 13px 20px -4px #9a3e0047}
:is(#project-previous,#project-next).is-arrow-pressed:not(:disabled){border-color:#ffaf57f2;background-color:#382419d9;box-shadow:inset 0 2px 4px #ffbe704d,inset 0 -1px 1px #6a310d99,0 0 17px 3px #ff800047,0 2px 4px #0009,0 9px 16px -3px #9a3e004d}
:is(#project-previous,#project-next).is-arrow-hot:not(:disabled)>.icon,:is(#project-previous,#project-next).is-arrow-pressed:not(:disabled)>.icon{filter:brightness(0) saturate(100%) invert(55%) sepia(93%) saturate(2783%) hue-rotate(358deg) brightness(103%) contrast(105%)}
:is(#project-previous,#project-next).is-arrow-hot:not(:disabled)::before,:is(#project-previous,#project-next).is-arrow-pressed:not(:disabled)::before{border-color:#ffb56b99;background:linear-gradient(140deg,#ffdfb633,#ff80000a 54%,#00000017)}
:is(#project-previous,#project-next):not(:disabled):active{transform:translateY(1.5px) scale(.94)}
@media(prefers-reduced-motion:reduce){:is(#project-previous,#project-next).is-arrow-hot:not(:disabled),:is(#project-previous,#project-next):not(:disabled):active{transform:none;transition:none!important}}

:is(#project-previous,#project-next):disabled{transform:none;transition:none}
