/*
Theme Name: Carlo Quast Fotografie
Theme URI: https://carloquast.de/
Author: Carlo Quast Fotografie
Description: Dark, cinematic photography portfolio theme with native WordPress portfolio management.
Version: 5.2.17
Requires at least: 6.4
Requires PHP: 8.0
Text Domain: carlo-quast
*/
:root{
  --black:#080808; --black-2:#101010; --white:#f5f5f2; --muted:#a8a8a3;
  --gold:#c9a86a; --line:rgba(201,168,106,.42); --max:1440px;
  --ease:cubic-bezier(.2,.75,.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--black)}
body{margin:0;background:var(--black);color:var(--white);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
button,input{font:inherit}
.site-header{position:absolute;z-index:50;top:0;left:0;right:0;padding:26px 4vw;display:flex;align-items:center;justify-content:space-between}
.site-logo img{width:auto;max-width:190px;max-height:58px;object-fit:contain}
.site-logo-text{font-size:14px;letter-spacing:.16em;text-transform:uppercase}
.main-nav ul{display:flex;gap:34px;list-style:none;margin:0;padding:0}
.main-nav a{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#ddd;transition:.25s}
.main-nav a:hover,.main-nav .current-menu-item>a{color:var(--gold)}
.menu-toggle{display:none;border:0;background:none;color:#fff;font-size:25px}
.hero{min-height:92vh;position:relative;display:flex;align-items:flex-end;overflow:hidden;background:#111}
.hero-media{position:absolute;z-index:0;inset:0;overflow:hidden;background:#111 center center/cover no-repeat}.hero-media img{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:center center;opacity:1!important;visibility:visible!important}
.hero-overlay{position:absolute;z-index:1;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.62),rgba(0,0,0,.12) 70%),linear-gradient(0deg,rgba(0,0,0,.55),transparent 50%)}
.hero-content{position:relative;z-index:2;padding:0 7vw 10vh;max-width:920px}
.hero-title{margin:0;text-transform:uppercase;font-size:clamp(52px,9vw,142px);line-height:.83;letter-spacing:-.055em;font-weight:900}
.hero-title .gold{color:var(--gold)}
.section{padding:110px 4vw}
.section-head{max-width:var(--max);margin:0 auto 46px;display:flex;align-items:end;justify-content:space-between;gap:30px}
.eyebrow{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.section-title{margin:8px 0 0;font-size:clamp(36px,5vw,74px);line-height:.95;letter-spacing:-.04em;text-transform:uppercase}
.portfolio-grid{max-width:var(--max);margin:auto;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:minmax(240px,26vw);gap:18px}
.portfolio-card{position:relative;min-height:0;overflow:hidden;background:#111}
.portfolio-card:nth-child(1),.portfolio-card:nth-child(4){grid-column:span 7;grid-row:span 2}
.portfolio-card:nth-child(2),.portfolio-card:nth-child(3){grid-column:span 5;grid-row:span 2}
.portfolio-card img{width:100%;height:100%;min-height:0;object-fit:cover;filter:grayscale(100%);transition:transform .8s var(--ease),filter .8s var(--ease),opacity .8s var(--ease)}
.portfolio-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.72),transparent 58%);pointer-events:none}
.portfolio-card:hover img{transform:scale(1.035);filter:grayscale(100%) brightness(.84)}
.card-content{position:absolute;z-index:2;left:32px;right:32px;bottom:30px}
.card-title{font-size:clamp(26px,3.2vw,52px);font-weight:800;letter-spacing:-.035em;text-transform:uppercase;margin:0}
.card-line{height:1px;width:55px;background:var(--gold);margin-top:12px}
.gallery{max-width:var(--max);margin:auto;columns:3 280px;column-gap:16px}
.gallery-item{break-inside:avoid;margin:0 0 16px;position:relative;overflow:hidden;background:#111;cursor:zoom-in}
.gallery-item img{width:100%;transition:transform .65s var(--ease),opacity .3s}
.gallery-item:hover img{transform:scale(1.02);opacity:.92}
.about-wrap{max-width:1200px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:center}
.about-photo img{width:100%;max-height:760px;object-fit:cover}
.about-copy p{color:#c5c5c0;font-size:17px;max-width:580px}
.contact-block{max-width:var(--max);margin:auto;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:65px 0;display:flex;align-items:center;justify-content:space-between;gap:30px}
.contact-email{font-size:clamp(24px,4vw,58px);letter-spacing:-.04em}
.gold-button,.cq-contact-form button.gold-button{appearance:none;-webkit-appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid var(--gold);padding:15px 24px;background:transparent;color:var(--gold);font:inherit;font-size:11px;line-height:1.2;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;cursor:pointer;box-shadow:none;border-radius:0;transition:background-color .25s ease,color .25s ease,border-color .25s ease,transform .25s ease}
.gold-button:hover,.cq-contact-form button.gold-button:hover{background:var(--gold);color:#080808}.gold-button:active,.cq-contact-form button.gold-button:active{transform:none;box-shadow:none}.gold-button:disabled,.cq-contact-form button.gold-button:disabled{opacity:.55;cursor:not-allowed}
.site-footer{padding:55px 4vw 28px;background:#050505}
.footer-inner{max-width:var(--max);margin:auto;display:flex;justify-content:space-between;gap:30px;align-items:center}
.footer-meta{color:#777;font-size:11px;letter-spacing:.08em}
.footer-links{display:flex;gap:24px;font-size:11px;letter-spacing:.15em;text-transform:uppercase}
.lightbox{position:fixed;z-index:100;inset:0;background:rgba(0,0,0,.97);display:none;align-items:center;justify-content:center;padding:30px}
.lightbox.is-open{display:flex}
.lightbox img{max-width:94vw;max-height:90vh;width:auto;height:auto;object-fit:contain}
.lb-close,.lb-prev,.lb-next{position:absolute;background:none;border:0;color:#fff;cursor:pointer;opacity:.8}
.lb-close{right:25px;top:20px;font-size:34px}.lb-prev,.lb-next{top:50%;font-size:42px}.lb-prev{left:20px}.lb-next{right:20px}
.admin-note{max-width:var(--max);margin:30px auto;padding:18px;border:1px solid #333;color:#aaa;font-size:13px}

@media(max-width:800px){
  .portfolio-grid{grid-template-columns:1fr;grid-auto-rows:68vw}
  .portfolio-card:nth-child(1),.portfolio-card:nth-child(2),.portfolio-card:nth-child(3),.portfolio-card:nth-child(4){grid-column:span 1;grid-row:span 1}
.hero{min-height:78vh}.hero-media img{object-position:50% 50%}
 .site-header{padding:18px 5vw}.site-logo img{max-width:145px;max-height:48px}
 .main-nav{display:none;position:fixed;inset:0;background:#080808;padding:110px 10vw}
 .main-nav.is-open{display:block}.main-nav ul{display:flex;flex-direction:column;gap:28px}.main-nav a{font-size:22px}
 .menu-toggle{display:block;position:relative;z-index:60}
 .hero{min-height:82vh}.hero-content{padding:0 7vw 9vh}.hero-title{font-size:clamp(48px,14vw,86px)}
 .section{padding:75px 5vw}.portfolio-grid{grid-template-columns:1fr;gap:12px}.portfolio-card{aspect-ratio:4/3}.portfolio-card img{min-height:0}
 .about-wrap{grid-template-columns:1fr;gap:35px}.about-copy p{font-size:16px}
 .contact-block,.footer-inner{align-items:flex-start;flex-direction:column}.footer-inner{gap:22px}
 .gallery{columns:2 150px;column-gap:9px}.gallery-item{margin-bottom:9px}
}
@media(max-width:460px){.gallery{columns:1}.portfolio-card{aspect-ratio:4/3}}

.portfolio-intro{max-width:320px;color:#8e8e89;font-size:14px;letter-spacing:.02em;text-align:right}
@media(max-width:800px){.portfolio-intro{display:none}}

.gallery-header{max-width:var(--max);margin:0 auto 38px}.gallery-header .section-head{margin:18px 0 0}.gallery-back{display:inline-flex;align-items:center;gap:9px;color:#b9b9b4;font-size:11px;letter-spacing:.16em;text-transform:uppercase;transition:color .25s,transform .25s}.gallery-back:hover{color:var(--gold);transform:translateX(-3px)}
.portfolio-card:focus-visible{outline:2px solid var(--gold);outline-offset:4px}


/* Gallery polish v2.1 */
body.lightbox-open{overflow:hidden}
.gallery{column-fill:balance}
.gallery-item{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease),background .3s}
.gallery-item.is-visible{opacity:1;transform:none}
.gallery-open{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;color:inherit;text-align:left}
.gallery-item img{width:100%;height:auto;transition:transform .8s var(--ease),filter .5s ease,opacity .3s}
.gallery-item:hover img{transform:scale(1.018);opacity:1}
.gallery-count{margin-top:12px;color:#777;font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.gallery-back{position:relative}
.lightbox{padding:24px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;visibility:hidden;transition:opacity .28s ease,visibility .28s ease}
.lightbox.is-open{opacity:1;visibility:visible}
.lb-stage{position:relative;display:flex;align-items:center;justify-content:center;width:min(92vw,1600px);height:90vh}
.lightbox img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;transition:opacity .2s ease}
.lightbox img.is-loading{opacity:.25}
.lb-loading{position:absolute;width:28px;height:28px;border:1px solid rgba(255,255,255,.25);border-top-color:#fff;border-radius:50%;opacity:0;pointer-events:none;animation:cqSpin .7s linear infinite}
.lb-loading.is-visible{opacity:1}
@keyframes cqSpin{to{transform:rotate(360deg)}}
.lb-close,.lb-prev,.lb-next{z-index:2;width:54px;height:54px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.16);border-radius:50%;background:rgba(0,0,0,.18);transition:background .25s,color .25s,border-color .25s,transform .25s}
.lb-close:hover,.lb-prev:hover,.lb-next:hover{background:var(--gold);color:#080808;border-color:var(--gold)}
.lb-close:focus-visible,.lb-prev:focus-visible,.lb-next:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.lb-close{right:24px;top:22px;font-size:30px;line-height:1}.lb-prev,.lb-next{top:50%;transform:translateY(-50%);font-size:36px;line-height:1}.lb-prev{left:24px}.lb-next{right:24px}.lb-prev:hover,.lb-next:hover{transform:translateY(-50%) scale(1.04)}
.lb-counter{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);font-size:10px;letter-spacing:.22em;color:#aaa;text-transform:uppercase}
@media(max-width:800px){
  .gallery{columns:2 150px}
  .gallery-header{margin-bottom:28px}
  .lb-stage{width:100vw;height:78vh}
  .lb-close{right:14px;top:14px}.lb-prev{left:12px}.lb-next{right:12px}
  .lb-close,.lb-prev,.lb-next{width:46px;height:46px}
  .lb-counter{bottom:16px}
}
@media(max-width:460px){.gallery{columns:1}}
@media(prefers-reduced-motion:reduce){.gallery-item{opacity:1;transform:none;transition:none}.lightbox{transition:none}.lb-loading{animation:none}}

/* v3 logo integration */
.site-logo{display:flex;align-items:center;min-width:0}
.site-logo .custom-logo-link{display:flex;align-items:center;line-height:0}
.site-logo .custom-logo{width:var(--cq-logo-width);height:auto;max-height:var(--cq-logo-height);object-fit:contain}
.cq-logo-mobile{display:none!important}
.cq-logo-desktop-wrap{display:flex}
@media(max-width:700px){
  .cq-logo-desktop-wrap{display:none}
  .site-logo .cq-logo-mobile{display:flex!important}
  .site-logo .cq-logo-mobile img{display:block;width:var(--cq-logo-mobile-width);height:auto;max-height:var(--cq-logo-mobile-height);object-fit:contain}
}


/* =========================================================
   v3.1 — Editorial polish
   ========================================================= */
.skip-link{position:fixed;left:16px;top:12px;z-index:9999;padding:10px 14px;background:var(--gold);color:#080808;font-size:12px;font-weight:700;transform:translateY(-160%);transition:transform .2s ease}.skip-link:focus{transform:translateY(0)}
.site-header{position:fixed;transition:background .35s ease,backdrop-filter .35s ease,-webkit-backdrop-filter .35s ease,padding .35s ease,box-shadow .35s ease}.site-header.is-scrolled{background:rgba(7,7,7,.78);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 1px 0 rgba(255,255,255,.06);padding-top:18px;padding-bottom:18px}
.site-logo{position:relative;z-index:2}.site-logo img{transition:width .35s ease,max-height .35s ease,opacity .25s ease}.site-header.is-scrolled .site-logo .custom-logo{max-height:52px}.site-header.is-scrolled .site-logo img{opacity:.98}
.menu-toggle{width:44px;height:44px;padding:0;display:none;align-items:center;justify-content:center;flex-direction:column;gap:6px}.menu-toggle span{display:block;width:22px;height:1px;background:#fff;transition:transform .25s ease,opacity .25s ease}.menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
.hero{min-height:100svh}.hero-media img{will-change:transform}.hero-content{padding-bottom:11vh}.hero-overlay{background:linear-gradient(90deg,rgba(0,0,0,.7),rgba(0,0,0,.08) 76%),linear-gradient(0deg,rgba(0,0,0,.62),transparent 54%)}
.section{scroll-margin-top:90px}.portfolio-grid{grid-auto-rows:minmax(270px,27vw);gap:14px}.portfolio-card{box-shadow:0 18px 50px rgba(0,0,0,.16)}.portfolio-card:before{content:"";position:absolute;inset:0;border:1px solid rgba(255,255,255,.08);z-index:3;pointer-events:none}.portfolio-card img{filter:grayscale(100%) contrast(.98);transition:transform 1s var(--ease),filter .6s ease}.portfolio-card:hover img{filter:grayscale(100%) contrast(1.02) brightness(.8);transform:scale(1.04)}.card-content{left:34px;right:34px;bottom:32px}.card-title{font-size:clamp(24px,2.8vw,48px);letter-spacing:-.045em}.card-line{width:70px;transition:width .45s var(--ease)}.portfolio-card:hover .card-line{width:105px}
.about-photo{position:relative}.about-photo:after{content:"";position:absolute;inset:12px -12px -12px 12px;border:1px solid rgba(201,168,106,.28);z-index:-1}.about-copy{padding-right:3vw}.about-copy p{line-height:1.8}.contact-block{padding:78px 0}.site-footer{border-top:1px solid rgba(255,255,255,.06)}.footer-logo{display:block;max-width:180px;max-height:52px;width:auto;height:auto;margin-bottom:18px;opacity:.82}
.gallery-page{padding-top:150px;min-height:70vh}.gallery-header{position:relative}.gallery-header:after{content:"";display:block;width:100%;height:1px;background:rgba(255,255,255,.08);margin-top:34px}.gallery{columns:3 320px;column-gap:14px}.gallery-item{margin-bottom:14px;background:#0d0d0d}.gallery-item:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);pointer-events:none}.gallery-open{overflow:hidden}.gallery-item img{transition:transform 1s var(--ease),opacity .35s ease}.gallery-item:hover img{transform:scale(1.025)}
.gallery-back{padding:7px 0}.gallery-back span{transition:color .25s ease}.gallery-back:hover span{color:var(--gold)}
.lightbox{background:rgba(4,4,4,.985)}.lb-stage{height:calc(100svh - 80px)}.lightbox img{max-width:calc(100vw - 150px);max-height:calc(100svh - 120px)}.lb-close,.lb-prev,.lb-next{background:rgba(10,10,10,.58);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
@media(max-width:800px){
  .site-header{padding:15px 5vw}.site-header.is-scrolled{padding-top:12px;padding-bottom:12px}.menu-toggle{display:flex}.main-nav{z-index:1}.main-nav.is-open{display:flex;align-items:flex-start;justify-content:center}.main-nav ul{width:100%;margin-top:10vh}.main-nav a{font-size:clamp(22px,7vw,34px);letter-spacing:.08em}.site-logo .custom-logo{max-width:145px}.hero{min-height:100svh}.hero-content{padding-bottom:8vh}.hero-title{font-size:clamp(44px,13.5vw,82px)}
  .portfolio-grid{gap:10px}.card-content{left:22px;right:22px;bottom:22px}.card-title{font-size:clamp(25px,8vw,42px)}
  .about-photo:after{inset:8px -8px -8px 8px}.contact-block{padding:54px 0}.gallery-page{padding-top:120px}.gallery{columns:2 170px;column-gap:10px}.gallery-item{margin-bottom:10px}.gallery-header:after{margin-top:24px}.lb-stage{height:calc(100svh - 110px)}.lightbox img{max-width:calc(100vw - 34px);max-height:calc(100svh - 145px)}
}
@media(max-width:460px){.gallery{columns:1}.gallery-item{margin-bottom:12px}.portfolio-card{aspect-ratio:4/3}}
@media(prefers-reduced-motion:reduce){.site-header,.site-logo img,.portfolio-card img,.card-line,.gallery-item img,.menu-toggle span{transition:none}.portfolio-card:hover img,.gallery-item:hover img{transform:none}}

/* v3.2 — Baukasten controls */
.portfolio-card{border-radius:var(--cq-card-radius,0)}
@media(max-width:800px){
  .section{padding-top:calc(var(--cq-section-spacing,110px) * .68);padding-bottom:calc(var(--cq-section-spacing,110px) * .68)}
  .portfolio-grid{grid-template-columns:1fr!important}
  .portfolio-card{min-height:0!important;aspect-ratio:4/3}
  .portfolio-card img{min-height:0!important;height:100%;object-fit:cover}
  .gallery{column-count:2!important;column-gap:var(--cq-gallery-gap,10px)}
}
@media(max-width:460px){.gallery{column-count:1!important}}


/* v3.3 — robust desktop header + gallery layout */
.site-header{
  z-index:1000!important;
  visibility:visible!important;
  opacity:1!important;
  display:flex!important;
}
@media(min-width:801px){
  .site-header .main-nav{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
  }
  .site-header .main-nav ul{
    display:flex!important;
    visibility:visible!important;
    align-items:center;
  }
  .site-header .menu-toggle{display:none!important}
  .site-logo,
  .site-logo > *,
  .site-logo .cq-logo-desktop-wrap,
  .site-logo .custom-logo-link{visibility:visible!important}
  .gallery{
    column-count:3!important;
    columns:3!important;
    column-width:auto!important;
    column-gap:var(--cq-gallery-gap,14px)!important;
  }
  .gallery-item{width:100%;display:inline-block}
}
@media(min-width:801px) and (max-width:1100px){
  .site-header{padding-left:28px;padding-right:28px}
  .gallery{column-count:2!important;columns:2!important}
}
@media(max-width:800px){
  .gallery{column-count:2!important;columns:2!important}
}
@media(max-width:460px){
  .gallery{column-count:1!important;columns:1!important}
}


/* v3.4 — mobile logo fallback + scroll-linked hero */
@media(max-width:700px){
  .site-logo .cq-logo-mobile{display:flex!important}
  .site-logo .cq-logo-mobile img{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
  }
  .site-logo .cq-logo-desktop-wrap{display:none!important}
}

/* v3.5 — stable builder + header/logo + responsive portfolio */
.site-header{
  position:fixed!important;
  top:0!important;left:0!important;right:0!important;
  z-index:99999!important;
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  min-height:72px;
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  border-bottom:1px solid transparent;
}
.site-header .site-logo,
.site-header .main-nav,
.site-header .main-nav ul{visibility:visible!important;opacity:1!important}
.site-header .main-nav{display:block!important}
.site-header .main-nav ul{display:flex!important;align-items:center!important}
.site-logo .cq-logo-universal{display:flex!important;align-items:center!important;visibility:visible!important;opacity:1!important;line-height:0}
.site-logo .cq-logo-universal img{display:block!important;visibility:visible!important;opacity:1!important;width:var(--cq-logo-width,220px)!important;max-width:var(--cq-logo-width,220px)!important;height:auto!important;max-height:var(--cq-logo-height,70px)!important;object-fit:contain}
@media(min-width:801px){
  .site-header .menu-toggle{display:none!important}
  .portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .portfolio-card:nth-child(1),.portfolio-card:nth-child(2),.portfolio-card:nth-child(3),.portfolio-card:nth-child(4){grid-column:span 1!important;grid-row:span 1!important}
  .gallery{column-count:3!important;columns:3 auto!important;column-gap:var(--cq-gallery-gap,14px)!important}
  .gallery-item{width:100%!important;display:inline-block!important}
}
@media(min-width:801px) and (max-width:1100px){
  .gallery{column-count:2!important;columns:2 auto!important}
}
@media(max-width:800px){
  .site-header{min-height:62px!important;padding:12px 5vw!important;background:rgba(5,5,5,.88)!important}
  .site-header .main-nav{display:none!important}
  .site-header .main-nav.is-open{display:flex!important;visibility:visible!important;opacity:1!important}
  .site-logo .cq-logo-universal img{width:var(--cq-logo-mobile-width,150px)!important;max-width:var(--cq-logo-mobile-width,150px)!important;max-height:var(--cq-logo-mobile-height,56px)!important}
  .portfolio-grid{grid-template-columns:1fr!important}
  .gallery{column-count:2!important;columns:2 auto!important}
}
@media(max-width:460px){.gallery{column-count:1!important;columns:1 auto!important}}


/* v3.6 — definitive hero image visibility fix */
.hero{
  position:relative!important;
  isolation:isolate;
}
.hero-media{
  z-index:0!important;
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  transform:none!important;
  animation:none!important;
}
.hero-media img{
  z-index:0!important;
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  transform:none!important;
  animation:none!important;
}
.hero-overlay{
  z-index:1!important;
  pointer-events:none!important;
}
.hero-content{
  z-index:2!important;
}


/* =========================================================
   v3.7 — final header + contact polish
   ========================================================= */

/* Header is clean/transparent at the top. The glass treatment is
   intentionally applied ONLY by .is-scrolled from main.js. */
.site-header{
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  border-bottom-color:transparent!important;
  box-shadow:none!important;
  transition:
    background .35s ease,
    backdrop-filter .35s ease,
    -webkit-backdrop-filter .35s ease,
    border-color .35s ease,
    box-shadow .35s ease,
    padding .35s ease!important;
}
.site-header.is-scrolled{
  background:rgba(7,7,7,.82)!important;
  backdrop-filter:blur(16px)!important;
  -webkit-backdrop-filter:blur(16px)!important;
  border-bottom-color:rgba(255,255,255,.07)!important;
  box-shadow:0 8px 28px rgba(0,0,0,.14)!important;
}
.site-header:not(.is-scrolled) .site-logo img{
  filter:drop-shadow(0 1px 7px rgba(0,0,0,.65));
}
.site-header:not(.is-scrolled) .main-nav a{
  text-shadow:0 1px 7px rgba(0,0,0,.65);
}

@media(max-width:800px){
  .site-header{
    background:transparent!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    border-bottom-color:transparent!important;
  }
  .site-header.is-scrolled{
    background:rgba(7,7,7,.88)!important;
    backdrop-filter:blur(16px)!important;
    -webkit-backdrop-filter:blur(16px)!important;
    border-bottom-color:rgba(255,255,255,.07)!important;
  }
}

/* Contact block: clean editorial CTA instead of a giant exposed email address. */
.contact-copy{max-width:760px}
.contact-title{
  margin:12px 0 12px;
  font-size:clamp(34px,5vw,72px);
  line-height:.96;
  letter-spacing:-.045em;
}
.contact-text{
  max-width:620px;
  margin:0;
  color:#8e8e89;
  font-size:15px;
  line-height:1.75;
}
.contact-email-small{
  display:inline-block;
  margin-top:18px;
  color:#aaa;
  font-size:13px;
  letter-spacing:.04em;
}
.contact-email-small:hover{color:var(--gold)}
.contact-block .gold-button{flex:none}
@media(max-width:800px){
  .contact-title{font-size:clamp(34px,10vw,58px)}
  .contact-text{font-size:14px}
}

/* v3.8 — definitive hero visibility */
.hero{
  background-color:#111!important;
  background-repeat:no-repeat!important;
  background-position:center center!important;
  background-size:cover!important;
}
.hero-media{
  background:transparent!important;
  z-index:0!important;
  opacity:1!important;
  visibility:visible!important;
}
.hero-media img{
  opacity:1!important;
  visibility:visible!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}
.hero-overlay{
  background:linear-gradient(90deg,rgba(0,0,0,.24),rgba(0,0,0,.04) 76%),linear-gradient(0deg,rgba(0,0,0,.28),transparent 54%)!important;
  opacity:1!important;
}


/* v3.9 — image setting sanitizer + generated WP image */
.hero-media .hero-image{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;display:block!important;object-fit:cover!important;object-position:center center!important;opacity:1!important;visibility:visible!important;z-index:0!important}
.hero{background-repeat:no-repeat!important;background-position:center center!important;background-size:cover!important}


/* v4.0 — builder polish */
.gallery-intro{max-width:680px;margin:18px 0 0;color:#8e8e89;font-size:15px;line-height:1.75}
.gallery-count{margin-top:14px;color:#777;font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.portfolio-intro{max-width:420px;color:#888;font-size:13px;line-height:1.7}
@media(max-width:800px){.gallery-intro{font-size:14px}.portfolio-intro{max-width:none;margin-top:16px}.section-head{align-items:flex-start;flex-direction:column;gap:8px}}

/* v4.0.1 — mobile hero headline centered; desktop remains unchanged */
@media(max-width:800px){
  .hero-content{
    width:100%;
    max-width:none;
    padding-left:5vw;
    padding-right:5vw;
    text-align:center;
  }
  .hero-title{
    width:100%;
    text-align:center;
  }
  .hero-title .hero-line{
    display:block;
    width:max-content;
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
  }
}


/* v4.0.2 — mobile lightbox controls + touch feedback */
.lightbox{z-index:100000!important;}
.lightbox .lb-close,.lightbox .lb-prev,.lightbox .lb-next{z-index:5;}
@media(max-width:800px){
  /* Keep the close button visually and interactively below the fixed site header. */
  .lightbox .lb-close{
    top:calc(62px + env(safe-area-inset-top) + 10px)!important;
    right:18px!important;
    width:46px!important;
    height:46px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    font-size:32px!important;
    line-height:1!important;
    border-radius:50%;
  }
  /* The portfolio card's desktop hover cue also works on touch devices. */
  .portfolio-card:active .card-line,
  .portfolio-card.cq-touch-active .card-line{
    width:105px!important;
  }
  .portfolio-card:active img,
  .portfolio-card.cq-touch-active img{
    transform:scale(1.04)!important;
    filter:grayscale(100%) contrast(1.02) brightness(.8)!important;
  }
}

/* v4.0.3 — mobile hero headline back to desktop-style left alignment */
@media(max-width:800px){
  .hero-content{
    width:auto;
    max-width:920px;
    padding-left:7vw!important;
    padding-right:12vw!important;
    text-align:left!important;
  }
  .hero-title{
    width:auto!important;
    max-width:100%!important;
    text-align:left!important;
  }
  .hero-title .hero-line{
    display:inline!important;
    width:auto!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
  }
}

/* v4.1 legal pages */
.legal-page{max-width:980px;margin:0 auto;padding-top:150px;padding-bottom:100px}
.legal-page h1{font-size:clamp(48px,8vw,100px);letter-spacing:-.055em;line-height:.95;margin:10px 0 55px}
.legal-copy{max-width:760px;color:#aaa;line-height:1.8;font-size:15px}
.legal-copy h2{color:#f1f1ed;font-size:18px;margin:38px 0 10px}
.legal-copy p{margin:0 0 18px}
.legal-copy a{color:var(--gold)}
.legal-note{margin-top:50px;padding-top:20px;border-top:1px solid rgba(255,255,255,.08);font-size:12px;color:#777}


/* v4.2 — 404 / legal / SEO presentation */
.error-page{
  min-height:68vh;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
}
.error-page .section-title{max-width:900px;margin:10px 0 18px}
.error-copy{max-width:620px;color:#8e8e89;line-height:1.8;margin:0 0 28px}
.legal-page{padding-top:150px;min-height:70vh}
.legal-page h1{font-size:clamp(52px,8vw,110px);line-height:.92;letter-spacing:-.05em;margin:10px 0 55px}
.legal-copy{max-width:760px;color:#aaa;line-height:1.8}
.legal-copy h2{color:#eee;font-size:18px;margin:38px 0 10px}
.legal-copy a{color:#c9a86a}
.legal-note{margin-top:45px;padding-top:20px;border-top:1px solid rgba(255,255,255,.08);font-size:12px;color:#666}
@media(max-width:800px){
  .error-page{min-height:70svh}
  .legal-page{padding-top:120px}
  .legal-page h1{font-size:clamp(48px,13vw,76px);margin-bottom:38px}
}

/* v4.3 — legal footer links */
.footer-links{display:flex;flex-wrap:wrap;gap:22px;align-items:center}
.footer-links a{color:#8f8f89;text-decoration:none;transition:color .25s ease}
.footer-links a:hover{color:#c9a86a}
@media(max-width:800px){.footer-links{gap:14px}}

/* =========================================================
 * v4.4 — final polish
 * ========================================================= */

/* Keyboard accessibility without changing the visual language. */
a:focus-visible,button:focus-visible,.gallery-item:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:4px;
}

/* Gallery touch state mirrors the desktop hover cue. */
.portfolio-card.cq-touch-active img{
  transform:scale(1.035);
  filter:grayscale(100%) brightness(.84);
}
.portfolio-card.cq-touch-active .card-line{
  width:110px;
  transition:width .35s var(--ease);
}

/* Lightbox always sits above the header. */
.lightbox{z-index:9999}
.lb-close{
  z-index:10001;
}
@media(max-width:800px){
  .lb-close{
    top:calc(env(safe-area-inset-top, 0px) + 72px);
    right:18px;
  }
  .lb-prev,.lb-next{
    z-index:10001;
  }
}

/* Legal links remain discreet but clearly discoverable. */
.footer-links a{
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.footer-links a:hover{color:var(--gold)}

@media(max-width:800px){
  .footer-links{
    justify-content:flex-start;
    row-gap:12px;
  }
}

/* Respect users who request reduced motion. */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}

/* v4.4.1 — legal pages are publicly reachable after the draft-page repair. */

/* v4.4.2 — image performance and basic copy deterrence. */

/* v4.4.5 — expanded visual builder controls. */


/* v4.4.8 — final polish: stable layouts, mobile UX, accessibility */
.portfolio-card img{width:100%;height:100%;object-fit:cover;transform-origin:center;will-change:transform,filter}
.portfolio-card .card-line{transform-origin:left center}
.portfolio-card.cq-touch-active .card-line{width:105px}
.gallery-item img{width:100%;height:auto;object-fit:cover;will-change:transform}
.gallery-open{display:block;width:100%;padding:0;border:0;background:none;color:inherit;cursor:zoom-in;text-align:inherit}
.gallery-item{break-inside:avoid;page-break-inside:avoid}
.skip-link{position:fixed;left:12px;top:12px;z-index:100000;padding:10px 14px;background:#fff;color:#111;transform:translateY(-150%);transition:transform .2s ease}
.skip-link:focus{transform:translateY(0)}
@media(min-width:801px){
  .portfolio-grid{align-items:stretch!important;grid-auto-flow:row!important}
  .portfolio-card{min-width:0!important;min-height:0!important}
  .portfolio-card img{min-width:0;min-height:0}
}
@media(max-width:800px){
  .portfolio-card{min-height:0!important}
  .gallery-open{touch-action:manipulation}
  .lb-close{top:max(14px,env(safe-area-inset-top))!important;right:14px!important}
  .lb-stage{padding-top:64px!important}
}
@media(prefers-reduced-motion:reduce){
  .hero-title,.portfolio-card img,.gallery-item img{transition:none!important;transform:none!important}
}

/* v4.5.0 — responsive gallery polish */
.gallery-grid,.cq-gallery,.cq-portfolio-gallery{align-items:stretch}
.gallery-item,.cq-gallery-item,.portfolio-card{min-width:0}
.lightbox{overscroll-behavior:contain}
.lb-close,.lb-prev,.lb-next{-webkit-tap-highlight-color:transparent}
@media(max-width:767px){.lightbox{padding-left:12px;padding-right:12px}}

/* v4.5.1 — gallery monochrome preview with optional color hover */
.gallery-item img,
.cq-gallery-item img{
  transition:filter .45s ease, transform .55s ease;
}
.gallery-item:hover img,
.cq-gallery-item:hover img,
.gallery-item:focus-within img,
.cq-gallery-item:focus-within img,
.gallery-item:hover .gallery-open img,
.gallery-item:focus-within .gallery-open img{
  filter:grayscale(0%) !important;
}

/* v4.5.2 — crisp built-in vector logo */
.site-logo .cq-logo-universal img[src$="cq-logo-vector.svg"],
.site-logo img.cq-vector-logo{shape-rendering:geometricPrecision;image-rendering:auto;}
.footer-logo{shape-rendering:geometricPrecision;image-rendering:auto;}

/* v4.5.3 — touch feedback for gallery color hover */
.gallery-item.cq-touch-active img,
.cq-gallery-item.cq-touch-active img{
  filter:grayscale(0%) !important;
}

/* v5.0 builder content */
.cq-builder-text-inner{max-width:1100px;margin:0 auto}.cq-builder-copy{font-size:clamp(18px,2vw,26px);line-height:1.55}.cq-builder-statement .cq-builder-copy{font-size:clamp(34px,6vw,92px);line-height:1.05;max-width:1200px}.cq-builder-full-image{display:block;width:100%;height:auto}.cq-builder-button{text-align:center}.cq-builder-spacer{width:100%}.cq-all-gallery-link{text-align:center;margin-top:30px}


/* v5.2.0 — final motion fixes */
.hero-title.cq-hero-scroll-bound{animation:none!important;will-change:transform,opacity}
.portfolio-card{will-change:transform,opacity,filter,clip-path}
@media(prefers-reduced-motion:reduce){.hero-title.cq-hero-scroll-bound,.portfolio-card{animation:none!important}}


/* =========================================================
   v5.2.3 — reliable Hero entrance + homepage tile motion
   ========================================================= */

/* Hero: entrance animation lives on the inner text lines so the
   scroll-bound transform on .hero-title never cancels it. */
.hero-title.cq-hero-enter .hero-line-inner{
  display:inline-block;
  animation-duration:var(--cq-hero-animation-duration,.8s);
  animation-timing-function:cubic-bezier(.22,.8,.2,1);
  animation-fill-mode:both;
  animation-delay:var(--cq-hero-delay,0s);
  will-change:opacity,transform,filter,clip-path;
}
.hero-title.cq-hero-animation-fade .hero-line-inner{animation-name:cqHeroFade}
.hero-title.cq-hero-animation-reveal .hero-line-inner{animation-name:cqHeroReveal}
.hero-title.cq-hero-animation-slide-left .hero-line-inner{animation-name:cqHeroSlideLeft}
.hero-title.cq-hero-animation-slide-right .hero-line-inner{animation-name:cqHeroSlideRight}
.hero-title.cq-hero-animation-scale .hero-line-inner{animation-name:cqHeroScale}
.hero-title.cq-hero-animation-blur .hero-line-inner{animation-name:cqHeroBlur}
.hero-title.cq-hero-animation-blur-scale .hero-line-inner{animation-name:cqHeroBlurScale}
.hero-title.cq-hero-animation-float .hero-line-inner{animation-name:cqHeroFloat}
.hero-title.cq-hero-animation-rotate .hero-line-inner{animation-name:cqHeroRotate}
.hero-title.cq-hero-animation-skew .hero-line-inner{animation-name:cqHeroSkew}
.hero-title.cq-hero-animation-clip-up .hero-line-inner{animation-name:cqHeroClipUp}
.hero-title.cq-hero-animation-clip-left .hero-line-inner{animation-name:cqHeroClipLeft}
.hero-title.cq-hero-animation-clip-right .hero-line-inner{animation-name:cqHeroClipRight}
.hero-title.cq-hero-animation-wipe .hero-line-inner{animation-name:cqHeroWipe}
.hero-title.cq-hero-animation-tracking .hero-line-inner{animation-name:cqHeroTracking}
.hero-title.cq-hero-animation-bounce .hero-line-inner{animation-name:cqHeroBounce}
.hero-title.cq-hero-animation-split .hero-line-inner{animation-name:cqHeroSplit}
.hero-title.cq-hero-animation-split .hero-line:nth-child(1) .hero-line-inner{--cq-split-x:-45px}
.hero-title.cq-hero-animation-split .hero-line:nth-of-type(2) .hero-line-inner{--cq-split-x:45px}

@keyframes cqHeroFade{from{opacity:0}to{opacity:1}}
@keyframes cqHeroReveal{from{opacity:0;transform:translateY(48px)}to{opacity:1;transform:translateY(0)}}
@keyframes cqHeroSlideLeft{from{opacity:0;transform:translateX(70px)}to{opacity:1;transform:translateX(0)}}
@keyframes cqHeroSlideRight{from{opacity:0;transform:translateX(-70px)}to{opacity:1;transform:translateX(0)}}
@keyframes cqHeroScale{from{opacity:0;transform:scale(.82)}to{opacity:1;transform:scale(1)}}
@keyframes cqHeroBlur{from{opacity:0;filter:blur(14px)}to{opacity:1;filter:blur(0)}}
@keyframes cqHeroBlurScale{from{opacity:0;filter:blur(14px);transform:scale(1.08)}to{opacity:1;filter:blur(0);transform:scale(1)}}
@keyframes cqHeroFloat{from{opacity:0;transform:translateY(26px)}55%{opacity:1;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
@keyframes cqHeroRotate{from{opacity:0;transform:rotate(-4deg) translateY(20px)}to{opacity:1;transform:rotate(0) translateY(0)}}
@keyframes cqHeroSkew{from{opacity:0;transform:skewX(-10deg) translateX(28px)}to{opacity:1;transform:skewX(0) translateX(0)}}
@keyframes cqHeroClipUp{from{opacity:0;clip-path:inset(100% 0 0 0);transform:translateY(22px)}to{opacity:1;clip-path:inset(0 0 0 0);transform:none}}
@keyframes cqHeroClipLeft{from{opacity:0;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
@keyframes cqHeroClipRight{from{opacity:0;clip-path:inset(0 0 0 100%)}to{opacity:1;clip-path:inset(0 0 0 0)}}
@keyframes cqHeroWipe{from{opacity:0;clip-path:polygon(0 0,0 0,0 100%,0 100%)}to{opacity:1;clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}}
@keyframes cqHeroTracking{from{opacity:0;letter-spacing:.16em}to{opacity:1;letter-spacing:inherit}}
@keyframes cqHeroBounce{0%{opacity:0;transform:translateY(32px)}65%{opacity:1;transform:translateY(-7px)}85%{transform:translateY(2px)}100%{opacity:1;transform:translateY(0)}}
@keyframes cqHeroSplit{from{opacity:0;transform:translateX(var(--cq-split-x,0))}to{opacity:1;transform:translateX(0)}}

/* Homepage portfolio tiles: JS adds cq-portfolio-motion only when
   the feature is enabled, so a JS failure never leaves the portfolio invisible. */
.portfolio-card.cq-portfolio-motion{
  --cq-portfolio-parallax:0px;
  --cq-portfolio-enter-y:var(--cq-portfolio-parallax);
  will-change:transform,opacity,filter,clip-path;
}
.portfolio-card.cq-portfolio-motion:not(.is-visible){
  opacity:0;
}
.portfolio-card.cq-portfolio-motion.is-visible{
  opacity:1;
  transition:
    opacity var(--cq-portfolio-animation-duration,.7s) var(--ease),
    transform var(--cq-portfolio-animation-duration,.7s) var(--ease),
    filter var(--cq-portfolio-animation-duration,.7s) var(--ease),
    clip-path var(--cq-portfolio-animation-duration,.7s) var(--ease);
  transition-delay:calc(var(--cq-portfolio-delay-index,0) * var(--cq-portfolio-delay,70ms));
}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="fade"]:not(.is-visible){transform:none}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="fade-up"]:not(.is-visible){transform:translate3d(0,55px,0)}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="fade-down"]:not(.is-visible){transform:translate3d(0,-55px,0)}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="slide-left"]:not(.is-visible){transform:translate3d(70px,0,0)}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="slide-right"]:not(.is-visible){transform:translate3d(-70px,0,0)}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="scale"]:not(.is-visible){transform:scale(.88)}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="zoom"]:not(.is-visible){transform:scale(.72)}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="blur"]:not(.is-visible){filter:blur(12px)}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="rotate"]:not(.is-visible){transform:translateY(30px) rotate(-3deg)}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="float"]:not(.is-visible){transform:translateY(34px)}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="clip"]:not(.is-visible){clip-path:inset(0 0 100% 0)}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="stagger"]:not(.is-visible){transform:translateY(46px) scale(.96)}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax"],
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax-fade"]{
  transform:translate3d(0,var(--cq-portfolio-parallax),0);
}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax-fade"]{transition:opacity .45s ease,transform .12s linear}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax-fade"]{opacity:1}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="none"]{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){
  .hero-title.cq-hero-enter .hero-line-inner{animation:none!important;opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important}
  .portfolio-card.cq-portfolio-motion{opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important;transition:none!important}
}


/* =========================================================
 * v5.2.12 — isolated, robust Hero slideshow
 * ========================================================= */
.hero--slider{isolation:isolate}
.hero--slider .hero-media.hero-slide{
  position:absolute!important;inset:0!important;z-index:0!important;
  opacity:0!important;visibility:hidden!important;pointer-events:none!important;
  transform:translate3d(0,0,0)!important;
  transition:opacity var(--cq-hero-slider-speed,1s) var(--ease),transform var(--cq-hero-slider-speed,1s) var(--ease)!important;
  will-change:opacity,transform;
}
.hero--slider.is-ready .hero-media.hero-slide.is-active{
  z-index:2!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translate3d(0,0,0)!important;
}
.hero--slider.is-ready .hero-media.hero-slide.is-outgoing{z-index:1!important;opacity:0!important;visibility:visible!important}
.hero--slider.is-ready[data-hero-transition="slide-left"] .hero-slide{transform:translate3d(100%,0,0)!important}
.hero--slider.is-ready[data-hero-transition="slide-left"] .hero-slide.is-active{transform:translate3d(0,0,0)!important}
.hero--slider.is-ready[data-hero-transition="slide-left"] .hero-slide.is-outgoing{transform:translate3d(-100%,0,0)!important}
.hero--slider.is-ready[data-hero-transition="slide-right"] .hero-slide{transform:translate3d(-100%,0,0)!important}
.hero--slider.is-ready[data-hero-transition="slide-right"] .hero-slide.is-active{transform:translate3d(0,0,0)!important}
.hero--slider.is-ready[data-hero-transition="slide-right"] .hero-slide.is-outgoing{transform:translate3d(100%,0,0)!important}
.hero--slider.is-ready[data-hero-transition="zoom"] .hero-slide{transform:scale(1.07)!important}
.hero--slider.is-ready[data-hero-transition="zoom"] .hero-slide.is-active{transform:scale(1)!important}
.hero--slider.is-ready[data-hero-transition="zoom-fade"] .hero-slide{transform:scale(1.06)!important}
.hero--slider.is-ready[data-hero-transition="zoom-fade"] .hero-slide.is-active{transform:scale(1)!important}
.hero--slider .hero-media.hero-slide .hero-image{opacity:1!important;visibility:visible!important}
.hero-slider-controls{position:absolute!important;z-index:6!important;right:4vw;bottom:4vh;display:flex;align-items:center;gap:10px}
.hero-slider-controls button{appearance:none;border:1px solid rgba(255,255,255,.35);background:rgba(0,0,0,.18);color:#fff;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;cursor:pointer;transition:background .2s ease,border-color .2s ease,color .2s ease}
.hero-slider-controls button:hover{background:var(--gold);border-color:var(--gold);color:#080808}
.hero-slider-dots{display:flex;gap:6px}
.hero-slider-dot{width:8px!important;height:8px!important;padding:0;border-radius:50%!important}
.hero-slider-dot.is-active{background:var(--gold)!important;border-color:var(--gold)!important}
@media(prefers-reduced-motion:reduce){.hero--slider .hero-slide{transition:none!important;transform:none!important}}

/* Never animate the outer tile itself during parallax: moving the image is
   much cheaper and doesn't fight the grid/layout engine. */
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax"],
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax-fade"]{
  transform:none!important;
  transition:opacity .45s ease!important;
  will-change:opacity;
}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax"] img,
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax-fade"] img{
  --cq-portfolio-parallax:0px;
  transform:translate3d(0,var(--cq-portfolio-parallax),0) scale(1.045)!important;
  transition:none!important;
  will-change:transform;
}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax"]:hover img,
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax-fade"]:hover img{
  transform:translate3d(0,var(--cq-portfolio-parallax),0) scale(1.075)!important;
}

/* Gallery parallax uses the image compositor layer, not the masonry item. */
.gallery-item[data-parallax="1"] img{
  --cq-gallery-parallax:0px;
  transform:translate3d(0,var(--cq-gallery-parallax),0) scale(1.045)!important;
  transition:none!important;
  will-change:transform;
}
.gallery-item[data-parallax="1"]:hover img{
  transform:translate3d(0,var(--cq-gallery-parallax),0) scale(1.065)!important;
}
@media(prefers-reduced-motion:reduce){
  .hero--slider .hero-slide{transition:none!important;transform:none!important}
  .portfolio-card.cq-portfolio-motion[data-portfolio-animation^="parallax"] img,
  .gallery-item[data-parallax="1"] img{transform:none!important;transition:none!important}
}


/* v5.2.5 — robust gallery colour interaction */
.cq-gallery .gallery-open img,
.cq-gallery .gallery-item img,
.gallery-grid .gallery-open img,
.gallery-grid .gallery-item img,
.cq-gallery-grid .gallery-open img,
.cq-gallery-grid .gallery-item img {
  transition: filter .45s ease, transform .55s ease;
}

/* Only apply grayscale when the gallery colour option is enabled.
   The builder can add .cq-gallery-color-hover to the gallery wrapper. */
.cq-gallery.cq-gallery-color-hover .gallery-open img,
.cq-gallery.cq-gallery-color-hover .gallery-item img,
.gallery-grid.cq-gallery-color-hover .gallery-open img,
.gallery-grid.cq-gallery-color-hover .gallery-item img,
.cq-gallery-grid.cq-gallery-color-hover .gallery-open img,
.cq-gallery-grid.cq-gallery-color-hover .gallery-item img {
  filter: grayscale(100%);
}

.cq-gallery.cq-gallery-color-hover .gallery-open:hover img,
.cq-gallery.cq-gallery-color-hover .gallery-item:hover img,
.gallery-grid.cq-gallery-color-hover .gallery-open:hover img,
.gallery-grid.cq-gallery-color-hover .gallery-item:hover img,
.cq-gallery-grid.cq-gallery-color-hover .gallery-open:hover img,
.cq-gallery-grid.cq-gallery-color-hover .gallery-item:hover img,
.cq-gallery.cq-gallery-color-hover .gallery-open:focus img,
.cq-gallery.cq-gallery-color-hover .gallery-item:focus img,
.gallery-grid.cq-gallery-color-hover .gallery-open:focus img,
.gallery-grid.cq-gallery-color-hover .gallery-item:focus img,
.cq-gallery-grid.cq-gallery-color-hover .gallery-open:focus img,
.cq-gallery-grid.cq-gallery-color-hover .gallery-item:focus img {
  filter: grayscale(0%);
}

/* Touch devices: :active keeps the colour state during a real touch.
   The JS touch handler below adds .cq-touch-active for a short persistent state. */
.cq-gallery.cq-gallery-color-hover .gallery-open.cq-touch-active img,
.cq-gallery.cq-gallery-color-hover .gallery-item.cq-touch-active img,
.gallery-grid.cq-gallery-color-hover .gallery-open.cq-touch-active img,
.gallery-grid.cq-gallery-color-hover .gallery-item.cq-touch-active img,
.cq-gallery-grid.cq-gallery-color-hover .gallery-open.cq-touch-active img,
.cq-gallery-grid.cq-gallery-color-hover .gallery-item.cq-touch-active img {
  filter: grayscale(0%);
}

/* v5.2.5 — start-page portfolio tile parallax */
.cq-portfolio-grid .portfolio-card,
.portfolio-grid .portfolio-card,
.cq-home-portfolio .portfolio-card,
.cq-portfolio-tile {
  --cq-parallax-y: 0px;
  --cq-parallax-x: 0px;
}

.cq-portfolio-grid.cq-portfolio-parallax .portfolio-card,
.portfolio-grid.cq-portfolio-parallax .portfolio-card,
.cq-home-portfolio.cq-portfolio-parallax .portfolio-card,
.cq-portfolio-tile.cq-portfolio-parallax {
  transform: translate3d(var(--cq-parallax-x), var(--cq-parallax-y), 0);
  will-change: transform;
}

@media (prefers-reduced-motion: reduce) {
  .cq-portfolio-grid.cq-portfolio-parallax .portfolio-card,
  .portfolio-grid.cq-portfolio-parallax .portfolio-card,
  .cq-home-portfolio.cq-portfolio-parallax .portfolio-card,
  .cq-portfolio-tile.cq-portfolio-parallax {
    transform: none !important;
    will-change: auto;
  }
}


/* v5.2.6 — contact form select styling */
.cq-form-grid select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  color: #f5f5f2;
  background-color: #111;
  background-image:
    linear-gradient(45deg, transparent 50%, #cfae69 50%),
    linear-gradient(135deg, #cfae69 50%, transparent 50%);
  background-position:
    calc(100% - 17px) 50%,
    calc(100% - 12px) 50%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  min-height: 44px;
  padding-right: 42px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 0;
  font: inherit;
  letter-spacing: .01em;
  cursor: pointer;
}

.cq-form-grid select:hover {
  border-color: rgba(207,174,105,.55);
}

.cq-form-grid select:focus {
  border-color: var(--gold);
  outline: none;
  box-shadow: 0 0 0 1px rgba(207,174,105,.16);
}

.cq-form-grid select option {
  background: #111;
  color: #f5f5f2;
}

@media (max-width: 767px) {
  .cq-form-grid select {
    min-height: 46px;
    padding-right: 40px;
  }
}

/* v5.2.7 — motion safety: JS opt-in only */
.gallery-item,
.portfolio-card{opacity:1}


/* v5.2.12 — motion stability: masonry items remain in normal flow; only image layers move. */
.gallery-item{opacity:1!important;}
.gallery-item[data-parallax="1"]{transform:none!important;overflow:hidden;}
.gallery-item[data-parallax="1"] img{transform:translate3d(0,var(--cq-gallery-parallax,0px),0) scale(1.035)!important;will-change:transform;}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax"],
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax-fade"]{transform:none!important;overflow:hidden;}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax"] img,
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax-fade"] img{transform:translate3d(0,var(--cq-portfolio-parallax,0px),0) scale(1.045)!important;will-change:transform;}

/* v5.2.8 — stable motion layer */
.gallery.cq-motion-ready .gallery-item{opacity:1!important}
.gallery.cq-motion-ready .gallery-item.is-visible{opacity:1!important}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax"],
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax-fade"]{
  transform:none!important; overflow:hidden;
}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax"] img,
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax-fade"] img{
  --cq-portfolio-parallax:0px;
  transform:translate3d(0,var(--cq-portfolio-parallax),0) scale(1.045)!important;
  will-change:transform;
}
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax"]:hover img,
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax-fade"]:hover img,
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax"].cq-touch-active img,
.portfolio-card.cq-portfolio-motion[data-portfolio-animation="parallax-fade"].cq-touch-active img{
  transform:translate3d(0,var(--cq-portfolio-parallax),0) scale(1.075)!important;
}
.gallery-item img{transition:filter .45s ease,transform .55s var(--ease),opacity .3s ease}
.gallery-item:hover img,.gallery-item:focus-within img,.gallery-item.cq-touch-active img{filter:grayscale(0)!important}

/* v5.2.9 — contact form UX */
.cq-contact-form input::placeholder,.cq-contact-form textarea::placeholder{color:rgba(245,245,242,.38);opacity:1}.cq-contact-form input:focus::placeholder,.cq-contact-form textarea:focus::placeholder{color:rgba(207,174,105,.55)}.cq-form-status{margin:0 0 24px;padding:18px 20px;border:1px solid rgba(207,174,105,.45);background:rgba(207,174,105,.07);color:#f5f5f2;line-height:1.6}.cq-form-status-error{border-color:rgba(220,90,90,.5);background:rgba(220,90,90,.07)}
