
:root {
  --black:#0d0d0f; --dark:#131416; --card:#18191d; --card2:#1c1d22;
  --border:#272830; --gold:#c9a84c; --gold-lt:#e2c97e; --gold-dk:#9a7830;
  --steel:#888898; --text:#ccccd8; --white:#ffffff; --sidebar:260px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;overflow:hidden;}
body{background:var(--black);color:var(--text);font-family:'Barlow',sans-serif;font-weight:300;display:flex;}
body::after{content:'';position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");pointer-events:none;z-index:9999;opacity:.45;}

/* SIDEBAR */
.sidebar{position:fixed;top:0;left:0;bottom:0;width:var(--sidebar);background:var(--dark);border-right:1px solid var(--border);display:flex;flex-direction:column;z-index:100;}
.sidebar::after{content:'';position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(to bottom,transparent,rgba(201,168,76,.3) 30%,rgba(201,168,76,.3) 70%,transparent);}
.sb-logo{padding:30px 26px 26px;border-bottom:1px solid var(--border);text-decoration:none;display:flex;align-items:center;gap:12px;flex-shrink:0;cursor:pointer;}
.sb-logo svg{width:34px;height:42px;}
.wm-name{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:18px;letter-spacing:3px;text-transform:uppercase;background:linear-gradient(135deg,var(--gold-lt),var(--gold),var(--gold-dk));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.1;display:block;}
.wm-sub{font-size:8px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--gold-dk);display:block;margin-top:2px;}
.sb-nav{flex:1;padding:28px 0;display:flex;flex-direction:column;gap:1px;}
.sb-link{display:flex;align-items:center;gap:14px;padding:15px 26px;color:var(--steel);font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:13px;letter-spacing:2.5px;text-transform:uppercase;position:relative;transition:color .2s,background .2s;cursor:pointer;border:none;background:transparent;width:100%;text-align:left;}
.sb-link::before{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--gold);transform:scaleY(0);transform-origin:center;transition:transform .25s cubic-bezier(.22,.8,.36,1);}
.sb-link:hover{color:var(--text);background:rgba(255,255,255,.018);}
.sb-link.active{color:var(--gold);}
.sb-link.active::before{transform:scaleY(1);}
.link-num{font-size:10px;color:var(--border);font-weight:400;letter-spacing:0;transition:color .2s;flex-shrink:0;font-family:'Barlow',sans-serif;}
.sb-link:hover .link-num,.sb-link.active .link-num{color:var(--gold-dk);}
.sb-footer{padding:22px 26px;border-top:1px solid var(--border);flex-shrink:0;}
.sf-label{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--border);margin-bottom:10px;font-weight:600;}
.sb-footer a{display:block;font-size:11px;color:var(--steel);text-decoration:none;margin-bottom:5px;transition:color .2s;}
.sb-footer a:hover{color:var(--gold);}

/* THEME TOGGLE */
/* MAIN */
.main{margin-left:var(--sidebar);flex:1;height:100vh;position:relative;overflow:hidden;}

/* PAGE SLIDE */
.page{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;}

/* SHARED */
.pg{padding:68px 6vw 88px;min-height:100%;}

.stag{display:inline-flex;align-items:center;gap:10px;font-size:10px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin-bottom:16px;opacity:0;transform:translateX(44px);transition:opacity .48s .04s cubic-bezier(.22,.8,.36,1),transform .48s .04s cubic-bezier(.22,.8,.36,1);}
.stag::before{content:'';width:22px;height:1px;background:var(--gold);}
.stag{opacity:1;transform:translateX(0);}

.sh2{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:clamp(34px,3.8vw,58px);line-height:1.0;color:var(--white);letter-spacing:-.5px;opacity:0;transform:translateX(52px);transition:opacity .55s .12s cubic-bezier(.22,.8,.36,1),transform .55s .12s cubic-bezier(.22,.8,.36,1);}
.sh2 em{font-style:normal;background:linear-gradient(135deg,var(--gold-lt),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.sh2{opacity:1;transform:translateX(0);}

.gr{width:44px;height:1px;background:linear-gradient(to right,var(--gold),transparent);margin:18px 0 32px;opacity:0;transform:translateX(30px);transition:opacity .45s .2s ease,transform .45s .2s cubic-bezier(.22,.8,.36,1);}
.gr{opacity:1;transform:translateX(0);}

.rsl{opacity:0;transform:translateX(64px);transition:opacity .6s cubic-bezier(.22,.8,.36,1),transform .6s cubic-bezier(.22,.8,.36,1);}
.rsl{opacity:1;transform:translateX(0);}
.d1{transition-delay:.16s;}.d2{transition-delay:.24s;}.d3{transition-delay:.32s;}
.d4{transition-delay:.40s;}.d5{transition-delay:.48s;}.d6{transition-delay:.56s;}

/* BUTTONS */
.btn-gold{display:inline-flex;align-items:center;gap:10px;background:linear-gradient(135deg,var(--gold-lt),var(--gold),var(--gold-dk));color:var(--black);padding:14px 30px;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:13px;letter-spacing:2px;text-transform:uppercase;text-decoration:none;transition:filter .2s,transform .2s;border:none;cursor:pointer;}
.btn-gold:hover{filter:brightness(1.1);transform:translateY(-2px);}
.btn-outline{display:inline-flex;align-items:center;gap:10px;background:transparent;color:var(--gold);border:1px solid var(--gold-dk);padding:14px 30px;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:13px;letter-spacing:2px;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .2s,transform .2s;}
.btn-outline:hover{background:rgba(201,168,76,.08);transform:translateY(-2px);}

/* HOME */
#page-home .pg{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px;position:relative;overflow:hidden;padding-top:60px;}

.home-overlay{position:absolute;inset:0;background:linear-gradient(135deg,rgba(13,13,15,.88) 0%,rgba(13,13,15,.65) 50%,rgba(13,13,15,.4) 100%);}
.home-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(201,168,76,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(201,168,76,.03) 1px,transparent 1px);background-size:60px 60px;mask-image:linear-gradient(to right,transparent,black 15%,black 85%,transparent);}
.home-left{position:relative;z-index:2;}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:9px;font-weight:600;letter-spacing:3.5px;text-transform:uppercase;color:var(--gold);margin-bottom:22px;opacity:0;transform:translateX(30px);transition:opacity .45s .05s ease,transform .45s .05s ease;}
.eyebrow::before,.eyebrow::after{content:'';width:18px;height:1px;background:linear-gradient(to right,var(--gold),transparent);}
.eyebrow{opacity:1;transform:translateX(0);}
.hero-h1{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:clamp(48px,5.5vw,80px);line-height:.95;color:var(--white);letter-spacing:-1px;opacity:0;transform:translateX(52px);transition:opacity .58s .12s cubic-bezier(.22,.8,.36,1),transform .58s .12s cubic-bezier(.22,.8,.36,1);}
.hero-h1 em{font-style:normal;background:linear-gradient(135deg,var(--gold-lt),var(--gold),var(--gold-dk));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.hero-h1{opacity:1;transform:translateX(0);}
.hero-rule{width:56px;height:2px;background:linear-gradient(to right,var(--gold),transparent);margin:22px 0;opacity:0;transform:translateX(28px);transition:opacity .45s .2s ease,transform .45s .2s ease;}
.hero-rule{opacity:1;transform:translateX(0);}
.hero-p{font-size:15px;color:var(--steel);line-height:1.8;max-width:400px;opacity:0;transform:translateX(42px);transition:opacity .55s .26s cubic-bezier(.22,.8,.36,1),transform .55s .26s cubic-bezier(.22,.8,.36,1);}
.hero-p{opacity:1;transform:translateX(0);}
.hero-actions{display:flex;gap:12px;margin-top:32px;flex-wrap:wrap;opacity:0;transform:translateX(42px);transition:opacity .55s .32s cubic-bezier(.22,.8,.36,1),transform .55s .32s cubic-bezier(.22,.8,.36,1);}
.hero-actions{opacity:1;transform:translateX(0);}
.hero-stats{display:flex;gap:36px;margin-top:48px;padding-top:32px;border-top:1px solid var(--border);opacity:0;transform:translateX(42px);transition:opacity .55s .40s cubic-bezier(.22,.8,.36,1),transform .55s .40s cubic-bezier(.22,.8,.36,1);}
.hero-stats{opacity:1;transform:translateX(0);}
.stat-n{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:42px;background:linear-gradient(135deg,var(--gold-lt),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1;}
.stat-l{font-size:9px;color:var(--steel);letter-spacing:2px;text-transform:uppercase;margin-top:4px;}
.home-right{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateX(64px);transition:opacity .65s .28s cubic-bezier(.22,.8,.36,1),transform .65s .28s cubic-bezier(.22,.8,.36,1);}
.home-right{opacity:1;transform:translateX(0);}
.logo-hero{position:relative;width:300px;height:300px;display:flex;align-items:center;justify-content:center;}
.lhr{position:absolute;border-radius:50%;border:1px solid rgba(201,168,76,.1);}
.lhr1{width:100%;height:100%;border-top-color:rgba(201,168,76,.4);animation:spinR 22s linear infinite;}
.lhr2{width:74%;height:74%;top:13%;left:13%;border-left-color:rgba(201,168,76,.25);animation:spinR 16s linear infinite reverse;}
.lhr3{width:50%;height:50%;top:25%;left:25%;border-bottom-color:rgba(201,168,76,.3);animation:spinR 10s linear infinite;}
@keyframes spinR{to{transform:rotate(360deg);}}
.logo-cbox{position:relative;z-index:2;width:128px;height:154px;background:linear-gradient(145deg,#2a2416,#1a1710,#2a2416);border:1px solid rgba(201,168,76,.2);display:flex;align-items:center;justify-content:center;box-shadow:0 0 50px rgba(201,168,76,.07),inset 0 0 30px rgba(0,0,0,.4);border-radius:10px;}
.logo-cbox svg{width:84px;height:100px;}
.hf-wrap{position:absolute;inset:0;}
.hf{position:absolute;background:var(--card);border:1px solid var(--border);padding:12px 16px;}
.hf{width:max-content;max-width:190px;}
.hf:nth-child(1){top:-2%;right:-18%;animation:fl 4s ease-in-out infinite;}
.hf:nth-child(2){bottom:6%;left:-22%;animation:fl 4s 1.4s ease-in-out infinite;}
.hf:nth-child(3){top:46%;right:-26%;animation:fl 4s .7s ease-in-out infinite;}
@keyframes fl{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.hf-lbl{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--steel);margin-bottom:3px;}
.hf-val{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:15px;color:var(--white);}
.hf-val .g{color:var(--gold);}

/* ABOUT */
.about-cols{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start;}
.about-body p{color:var(--steel);line-height:1.85;font-size:15px;margin-bottom:14px;}
.about-body p strong{color:var(--text);font-weight:500;}
.about-feats{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:28px;}
.af{background:var(--card2);border:1px solid var(--border);padding:26px 22px;transition:border-color .2s;}
.af:hover{border-color:rgba(201,168,76,.35);}
.af-icon{font-size:22px;margin-bottom:10px;display:block;}
.af h3{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:1px;color:var(--white);margin-bottom:6px;}
.af p{font-size:12px;color:var(--steel);line-height:1.6;}
.about-panel{background:var(--card);border:1px solid var(--border);border-left:3px solid var(--gold);padding:32px 28px;}
.about-panel h3{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:24px;color:var(--white);margin-bottom:10px;}
.about-panel p{color:var(--steel);font-size:14px;line-height:1.85;}
.about-nums{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:2px;}
.an{background:var(--card2);border:1px solid var(--border);padding:22px 18px;text-align:center;}
.an-n{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:36px;background:linear-gradient(135deg,var(--gold-lt),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.an-l{font-size:9px;color:var(--steel);letter-spacing:2px;text-transform:uppercase;margin-top:4px;}

/* SERVICES */
.svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;}
.sc{background:var(--card);border:1px solid var(--border);padding:34px 28px;position:relative;overflow:hidden;transition:border-color .3s,transform .3s;}
.sc::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(to right,var(--gold),transparent);transform:scaleX(0);transform-origin:left;transition:transform .3s;}
.sc:hover::before{transform:scaleX(1);}
.sc:hover{border-color:rgba(201,168,76,.25);transform:translateY(-3px);}
.sc-num{position:absolute;top:12px;right:16px;font-family:'Cormorant Garamond',serif;font-weight:700;font-size:56px;color:rgba(201,168,76,.05);line-height:1;}
.sc-ico{width:42px;height:42px;background:rgba(201,168,76,.07);border:1px solid rgba(201,168,76,.15);display:flex;align-items:center;justify-content:center;font-size:17px;margin-bottom:18px;}
.sc h3{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:17px;text-transform:uppercase;letter-spacing:.5px;color:var(--white);margin-bottom:8px;}
.sc p{font-size:13px;color:var(--steel);line-height:1.75;}

/* PRODUCTS */
.prod-cols{display:grid;grid-template-columns:1fr 1.5fr;gap:56px;align-items:start;}
.prod-intro{color:var(--steel);line-height:1.8;font-size:15px;margin-bottom:20px;}
.prod-list{list-style:none;display:flex;flex-direction:column;gap:1px;}
.prod-list li{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--border);padding:13px 18px;font-size:13px;color:var(--text);font-weight:500;transition:border-color .2s,color .2s;}
.prod-list li:hover{border-color:rgba(201,168,76,.35);color:var(--white);}
.prod-list li::before{content:'\25C6';font-size:7px;color:var(--gold);flex-shrink:0;}
.prod-cards{display:grid;grid-template-columns:1fr 1fr;gap:1px;}
.pc{background:var(--card);border:1px solid var(--border);padding:28px 24px;transition:border-color .2s;}
.pc:hover{border-color:rgba(201,168,76,.25);}
.pc-ico{font-size:26px;margin-bottom:12px;display:block;}
.pc h3{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:16px;text-transform:uppercase;color:var(--white);margin-bottom:8px;}
.pc p{font-size:13px;color:var(--steel);line-height:1.7;}

/* COVERAGE */
.cv-intro{color:var(--steel);font-size:15px;line-height:1.8;max-width:540px;margin-bottom:36px;}
.cv-cols{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:start;}
.cv-map{background:var(--card);border:1px solid var(--border);padding:36px 32px;}
.cv-map-title{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:11px;letter-spacing:2.5px;text-transform:uppercase;color:var(--gold);margin-bottom:20px;}
.loc-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;}
.loc{display:flex;align-items:center;gap:11px;background:var(--card2);border:1px solid var(--border);padding:13px 16px;transition:border-color .2s;}
.loc:hover{border-color:rgba(201,168,76,.4);}
.loc-dot{width:7px;height:7px;border-radius:50%;background:var(--gold);flex-shrink:0;box-shadow:0 0 7px rgba(201,168,76,.5);animation:dp 2.5s ease-in-out infinite;}
.loc:nth-child(2) .loc-dot{animation-delay:.3s;}.loc:nth-child(3) .loc-dot{animation-delay:.6s;}.loc:nth-child(4) .loc-dot{animation-delay:.9s;}.loc:nth-child(5) .loc-dot{animation-delay:1.2s;}.loc:nth-child(6) .loc-dot{animation-delay:1.5s;}.loc:nth-child(7) .loc-dot{animation-delay:1.8s;}
@keyframes dp{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.6)}}
.loc-name{font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:14px;color:var(--white);}
.loc-region{font-size:10px;color:var(--steel);margin-top:1px;}
.loc.more{grid-column:1/-1;border-style:dashed;border-color:rgba(201,168,76,.15);justify-content:center;}
.loc.more .loc-dot{background:var(--steel);box-shadow:none;animation:none;}.loc.more .loc-name{color:var(--steel);font-size:12px;}
.cv-right{display:flex;flex-direction:column;gap:14px;}
.cv-callout{background:var(--card);border:1px solid var(--border);border-left:3px solid var(--gold);padding:26px 22px;}
.cv-callout h3{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:16px;text-transform:uppercase;color:var(--white);margin-bottom:7px;}
.cv-callout p{font-size:13px;color:var(--steel);line-height:1.75;}
.cv-callout strong{color:var(--gold);font-weight:600;}
.cv-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;}
.cvs{background:var(--card2);border:1px solid var(--border);padding:20px 14px;text-align:center;}
.cvs-n{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:30px;background:linear-gradient(135deg,var(--gold-lt),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1;}
.cvs-l{font-size:9px;color:var(--steel);letter-spacing:1.5px;text-transform:uppercase;margin-top:4px;}

/* CONTACT */
.ct-cols{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start;}
.ct-left p{color:var(--steel);font-size:15px;line-height:1.8;margin-bottom:28px;}
.ct-info{display:flex;flex-direction:column;gap:1px;}
.ci{display:flex;align-items:center;gap:14px;background:var(--card);border:1px solid var(--border);padding:17px 20px;text-decoration:none;color:var(--text);transition:border-color .2s,color .2s;}
.ci:hover{border-color:rgba(201,168,76,.35);color:var(--white);}
.ci-ico{width:36px;height:36px;background:rgba(201,168,76,.07);border:1px solid rgba(201,168,76,.15);display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;}
.ci-lbl{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--steel);margin-bottom:2px;}
.ci-val{font-size:14px;font-weight:500;}
.cep{background:var(--card);border:1px solid var(--border);border-top:3px solid var(--gold);padding:48px 36px;text-align:center;}
.cep-icon{font-size:40px;margin-bottom:18px;display:block;}
.cep h3{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:26px;color:var(--white);margin-bottom:12px;}
.cep p{font-size:14px;color:var(--steel);line-height:1.8;max-width:280px;margin:0 auto 28px;}
.cep-promise{margin-top:18px;font-size:11px;color:var(--steel);}

/* GALLERY */
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;margin-top:32px;}
.gal-item{opacity:1;}
@media (prefers-reduced-motion: no-preference){
  .gal-item{animation:galFadeIn .5s ease backwards;}
}
@keyframes galFadeIn{from{opacity:0;transform:translateX(30px);}to{opacity:1;transform:translateX(0);}}
.gal-item{position:relative;overflow:hidden;aspect-ratio:4/3;cursor:pointer;background:var(--card);}
.gal-item img{width:100%;height:100%;object-fit:cover;transition:transform .45s cubic-bezier(.22,.8,.36,1),filter .45s ease;filter:brightness(.9);display:block;}
.gal-item:hover img{transform:scale(1.06);filter:brightness(1);}
.gal-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(13,13,15,.85) 0%,transparent 55%);opacity:0;transition:opacity .3s ease;display:flex;align-items:flex-end;padding:16px;}
.gal-item:hover .gal-overlay{opacity:1;}
.gal-cap{font-size:12px;color:var(--text);line-height:1.4;letter-spacing:.3px;}
.gal-zoom{position:absolute;top:12px;right:12px;width:32px;height:32px;background:rgba(201,168,76,.15);border:1px solid rgba(201,168,76,.3);display:flex;align-items:center;justify-content:center;font-size:14px;opacity:0;transition:opacity .3s;color:var(--gold-lt);}
.gal-item:hover .gal-zoom{opacity:1;}
.lightbox{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.94);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s ease;}
.lightbox.open{opacity:1;pointer-events:all;}
.lb-img-wrap{position:relative;max-width:min(90vw,900px);max-height:85vh;display:flex;flex-direction:column;gap:0;}
.lb-img-wrap img{max-width:100%;max-height:75vh;object-fit:contain;display:block;border:1px solid rgba(201,168,76,.15);}
.lb-cap{background:rgba(13,13,15,.9);border:1px solid var(--border);border-top:0;padding:12px 18px;font-size:12px;color:var(--steel);letter-spacing:.5px;}
.lb-close{position:absolute;top:-44px;right:0;background:transparent;border:1px solid rgba(255,255,255,.15);color:var(--steel);font-size:20px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:color .2s,border-color .2s;}
.lb-close:hover{color:var(--gold);border-color:var(--gold);}
.lb-prev,.lb-next{position:absolute;top:50%;transform:translateY(-50%);background:rgba(13,13,15,.7);border:1px solid rgba(255,255,255,.12);color:var(--steel);font-size:22px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:color .2s,border-color .2s,background .2s;}
.lb-prev:hover,.lb-next:hover{color:var(--gold);border-color:var(--gold-dk);background:rgba(13,13,15,.95);}
.lb-prev{left:-56px;}.lb-next{right:-56px;}
.lb-counter{position:absolute;bottom:-36px;left:50%;transform:translateX(-50%);font-size:10px;color:var(--steel);letter-spacing:2px;text-transform:uppercase;}

/* MOBILE */
.hamburger{display:none;position:fixed;top:14px;left:14px;z-index:300;background:var(--dark);border:1px solid var(--border);width:42px;height:42px;align-items:center;justify-content:center;cursor:pointer;flex-direction:column;gap:5px;padding:10px;}
.hamburger span{display:block;width:20px;height:1px;background:var(--gold);transition:all .3s;}

/* LIGHT MODE OVERRIDES */

@media(max-width:900px){
  :root{--sidebar:0px;}
  .sidebar{transform:translateX(-100%);width:240px;transition:transform .35s cubic-bezier(.22,.8,.36,1);box-shadow:4px 0 24px rgba(0,0,0,.5);}
  .sidebar.open{transform:translateX(0);}
  .main{margin-left:0;}
  .hamburger{display:flex;}
  #page-home .pg{grid-template-columns:1fr;}
  .home-right{display:none;}
  .about-cols,.prod-cols,.ct-cols,.cv-cols{grid-template-columns:1fr;gap:28px;}
  .svc-grid{grid-template-columns:1fr;}
  .prod-cards,.about-feats,.about-nums{grid-template-columns:1fr;}
  .gallery-grid{grid-template-columns:repeat(2,1fr);}
  .lb-prev{left:-4px;}.lb-next{right:-4px;}
  }
@media(max-width:560px){.pg{padding:56px 5vw 60px;}.cv-stats{grid-template-columns:1fr;}.hero-stats{gap:24px;}.gallery-grid{grid-template-columns:1fr;}}

/* PAGE PHOTO BACKGROUNDS */
.page-bg {
  position:absolute; inset:0; z-index:0;
  background-size:cover; background-position:center; background-repeat:no-repeat;
}
.page-overlay {
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(135deg,rgba(10,10,12,0.93) 0%,rgba(10,10,12,0.80) 45%,rgba(10,10,12,0.68) 100%);
}
.pg { position:relative; z-index:2; }
#page-home .pg { position:relative; z-index:2; }
.sc,.af,.pc,.cv-map,.cv-callout,.cvs,.about-panel,.an,.ci,.cep,.prod-list li { backdrop-filter:blur(1px); }
/* SMALL BUSINESS PAGE */
.sb-why{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-bottom:48px;}
.sb-why-card{background:var(--card);border:1px solid var(--border);padding:28px 22px;transition:border-color .2s;}
.sb-why-card:hover{border-color:rgba(201,168,76,.35);}
.sb-icon{font-size:28px;margin-bottom:14px;display:block;}
.sb-why-card h3{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.5px;color:var(--white);margin-bottom:8px;}
.sb-why-card p{font-size:13px;color:var(--steel);line-height:1.65;}
.sb-split{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-bottom:48px;}
.sb-section-title{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:22px;color:var(--white);margin-bottom:16px;}
.sb-list{list-style:none;display:flex;flex-direction:column;gap:1px;}
.sb-list li{background:var(--card);border:1px solid var(--border);padding:13px 18px;font-size:14px;color:var(--text);font-weight:500;transition:border-color .2s,color .2s;}
.sb-list li:hover{border-color:rgba(201,168,76,.35);color:var(--white);}
.sb-offer-list{display:flex;flex-direction:column;gap:1px;}
.sb-offer{display:flex;gap:16px;align-items:flex-start;background:var(--card);border:1px solid var(--border);padding:18px 20px;transition:border-color .2s;}
.sb-offer:hover{border-color:rgba(201,168,76,.25);}
.sb-offer-num{font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:22px;color:var(--gold);flex-shrink:0;line-height:1;margin-top:2px;}
.sb-offer strong{display:block;color:var(--white);font-size:14px;margin-bottom:4px;}
.sb-offer p{font-size:12px;color:var(--steel);line-height:1.6;margin:0;}
.sb-cta-inner{background:var(--card);border:1px solid var(--border);border-top:3px solid var(--gold);padding:48px 40px;text-align:center;}
.sb-cta-inner h3{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:32px;color:var(--white);margin-bottom:12px;}
.sb-cta-inner p{font-size:15px;color:var(--steel);max-width:480px;margin:0 auto;line-height:1.8;}
@media(max-width:900px){.sb-why{grid-template-columns:1fr 1fr;}.sb-split{grid-template-columns:1fr;}}
@media(max-width:560px){.sb-why{grid-template-columns:1fr;}}
/* WHATSAPP BUTTON */
.whatsapp-btn {
  position: fixed;
  bottom: calc(24px + env(safe-area-inset-bottom));
  right: 24px;
  z-index: 500;
  width: 60px;
  height: 60px;
  background: #25D366;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 20px rgba(37,211,102,0.4);
  text-decoration: none;
  transition: transform .2s, box-shadow .2s;
}
.whatsapp-btn:hover {
  transform: translateY(-3px) scale(1.05);
  box-shadow: 0 8px 28px rgba(37,211,102,0.55);
}
.whatsapp-btn svg { width: 32px; height: 32px; }
.whatsapp-pulse {
  position: absolute;
  width: 60px; height: 60px;
  border-radius: 50%;
  background: rgba(37,211,102,0.4);
  animation: wapulse 2s ease-out infinite;
}
@keyframes wapulse {
  0%   { transform: scale(1);   opacity: .7; }
  100% { transform: scale(1.7); opacity: 0;  }
}

/* TECH MENDERS CREDIT BAR */
.tm-credit {
  position: fixed;
  bottom: calc(20px + env(safe-area-inset-bottom));
  right: 96px;
  left: auto;
  z-index: 590;
  padding: 9px 16px;
  border-radius: 999px;
  background: rgba(8,9,11,0.62);
  backdrop-filter: blur(22px) saturate(150%);
  -webkit-backdrop-filter: blur(22px) saturate(150%);
  border: 1px solid rgba(255,255,255,0.06);
  box-shadow: 0 6px 24px rgba(0,0,0,0.42);
  opacity: .55;
  transition: opacity .25s ease, border-color .25s ease;
}
.tm-credit:hover { opacity: 1; border-color: rgba(201,168,76,.35); }
.tm-credit a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--steel);
  text-decoration: none;
  white-space: nowrap;
  transition: color .2s;
}
.tm-credit a:hover { color: var(--gold); }
.tm-credit img { height: 15px; width: auto; }
.tm-credit a:hover { opacity: 1; }
.tm-credit img { transition: transform .2s; }
.tm-credit a:hover img { transform: scale(1.1); }
.tm-credit a:hover { color: var(--gold); }


/* HERO CONTACT STRIP */
.hero-contacts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 1px;
  margin-top: 32px;
  max-width: 480px;
  opacity: 0; transform: translateX(42px);
  transition: opacity .55s .36s cubic-bezier(.22,.8,.36,1), transform .55s .36s cubic-bezier(.22,.8,.36,1);
}
.hero-contacts { opacity: 1; transform: translateX(0); }

.hc-item {
  display: flex; align-items: center; gap: 11px;
  background: rgba(24,25,29,0.75);
  backdrop-filter: blur(6px);
  border: 1px solid var(--border);
  padding: 12px 14px;
  text-decoration: none;
  transition: border-color .2s, background .2s, transform .2s;
}
.hc-item:hover {
  border-color: var(--gold);
  background: rgba(201,168,76,0.08);
  transform: translateY(-2px);
}
.hc-wa:hover { border-color: #25D366; background: rgba(37,211,102,.08); }
.hc-ig:hover { border-color: #E1306C; background: rgba(225,48,108,.08); }

.hc-ico { font-size: 17px; flex-shrink: 0; line-height: 1; }
.hc-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.hc-lbl {
  font-size: 8px; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--steel); font-weight: 600;
}
.hc-val {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px; font-weight: 600; color: var(--white);
  letter-spacing: .4px; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
}

@media(max-width:560px){
  .hero-contacts { grid-template-columns: 1fr; max-width: 100%; }
}

/* ============================================================
   GLASS UI — frosted translucent layer
============================================================ */

/* Softer, deeper base palette */
:root {
  --glass:        rgba(255,255,255,0.045);
  --glass-hover:  rgba(255,255,255,0.075);
  --glass-brd:    rgba(255,255,255,0.10);
  --glass-brd-hi: rgba(201,168,76,0.45);
  --glass-shadow: 0 8px 32px rgba(0,0,0,0.38);
  --glass-inset:  inset 0 1px 0 rgba(255,255,255,0.08);
}
/* ---- Universal glass panel treatment ---- */
.sc, .af, .pc, .cv-map, .cv-callout, .cvs, .about-panel, .an,
.ci, .cep, .prod-list li, .sb-why-card, .sb-list li, .sb-offer,
.sb-cta-inner, .hf, .loc, .hc-item, .gal-item {
  background: var(--glass) !important;
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  border: 1px solid var(--glass-brd) !important;
  box-shadow: var(--glass-shadow), var(--glass-inset);
  border-radius: 14px;
  transition: background .28s ease, border-color .28s ease,
              transform .28s cubic-bezier(.22,.9,.36,1), box-shadow .28s ease;
}

.sc:hover, .af:hover, .pc:hover, .cv-callout:hover, .about-panel:hover,
.ci:hover, .prod-list li:hover, .sb-why-card:hover, .sb-list li:hover,
.sb-offer:hover, .loc:hover, .hc-item:hover {
  background: var(--glass-hover) !important;
  border-color: var(--glass-brd-hi) !important;
  transform: translateY(-3px);
  box-shadow: 0 14px 44px rgba(0,0,0,0.45), var(--glass-inset);
}

/* Grid gaps need widening now cards are rounded */
.svc-grid, .about-feats, .prod-cards, .sb-why, .loc-grid,
.about-nums, .cv-stats { gap: 12px !important; }
.prod-list, .sb-list, .sb-offer-list, .ct-info, .cv-right { gap: 10px !important; }
.gallery-grid { gap: 12px !important; }

/* ---- Sidebar glass ---- */
.sidebar {
  background: rgba(16,17,20,0.72) !important;
  backdrop-filter: blur(28px) saturate(150%);
  -webkit-backdrop-filter: blur(28px) saturate(150%);
  border-right: 1px solid var(--glass-brd) !important;
  box-shadow: 4px 0 40px rgba(0,0,0,0.35);
}
.sb-link { border-radius: 0 10px 10px 0; margin-right: 12px; }
.sb-link:hover { background: var(--glass-hover) !important; }
.sb-link.active {
  background: linear-gradient(90deg, rgba(201,168,76,0.16), rgba(201,168,76,0.03)) !important;
}

/* ---- Accent left-bars ---- */
.cv-callout, .about-panel, .sb-cta-inner, .cep {
  border-left: 2px solid var(--gold) !important;
}
.sb-cta-inner, .cep { border-left: 1px solid var(--glass-brd) !important; border-top: 2px solid var(--gold) !important; }

/* ---- Buttons: glass + gold ---- */
.btn-gold {
  border-radius: 12px;
  box-shadow: 0 6px 22px rgba(201,168,76,0.28), inset 0 1px 0 rgba(255,255,255,0.28);
}
.btn-gold:hover { box-shadow: 0 10px 32px rgba(201,168,76,0.42), inset 0 1px 0 rgba(255,255,255,0.35); }

.btn-outline {
  border-radius: 12px;
  background: var(--glass) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid var(--glass-brd-hi) !important;
  box-shadow: var(--glass-inset);
}
.btn-outline:hover { background: var(--glass-hover) !important; }

/* ---- Icon chips ---- */
.sc-ico, .ci-ico {
  border-radius: 12px;
  background: rgba(201,168,76,0.12) !important;
  border: 1px solid rgba(201,168,76,0.22) !important;
  backdrop-filter: blur(8px);
}

/* ---- Hero floating cards ---- */
.hf { border-radius: 14px; }

/* ---- Gallery ---- */
.gal-item { border-radius: 14px; overflow: hidden; }
.gal-item img { border-radius: 14px; }
.gal-overlay { border-radius: 14px; }
.gal-zoom {
  border-radius: 10px;
  background: rgba(255,255,255,0.14) !important;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,0.2) !important;
}

/* ---- Logo box ---- */
.logo-cbox { border-radius: 18px; box-shadow: 0 12px 48px rgba(201,168,76,0.16), inset 0 0 30px rgba(0,0,0,0.35); }

/* ---- Lightbox glass ---- */
.lightbox { backdrop-filter: blur(20px); background: rgba(0,0,0,0.82) !important; }
.lb-img-wrap img { border-radius: 14px 14px 0 0; border: 1px solid var(--glass-brd); }
.lb-cap {
  background: var(--glass) !important;
  backdrop-filter: blur(20px);
  border: 1px solid var(--glass-brd); border-top: 0;
  border-radius: 0 0 14px 14px;
}
.lb-close, .lb-prev, .lb-next {
  border-radius: 12px;
  background: rgba(255,255,255,0.08) !important;
  backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,0.14) !important;
}
.lb-close:hover, .lb-prev:hover, .lb-next:hover {
  background: rgba(201,168,76,0.18) !important;
  border-color: var(--gold) !important;
}

/* ---- Theme toggle + credit bar ---- */
.tm-credit {
  background: rgba(16,17,20,0.6) !important;
  backdrop-filter: blur(24px) saturate(140%);
  -webkit-backdrop-filter: blur(24px) saturate(140%);
  border-top: 1px solid var(--glass-brd) !important;
}
/* ---- WhatsApp glass glow ---- */
.whatsapp-btn {
  box-shadow: 0 8px 32px rgba(37,211,102,0.42), inset 0 1px 0 rgba(255,255,255,0.3);
  border: 1px solid rgba(255,255,255,0.16);
}

/* ---- Page overlay: lighter so glass reads properly ---- */
.page-overlay {
  background: linear-gradient(135deg,
    rgba(10,10,12,0.90) 0%,
    rgba(10,10,12,0.76) 45%,
    rgba(10,10,12,0.62) 100%) !important;
}
/* ---- Softer typography shadow for legibility over glass ---- */
.sh2, .hero-h1 { text-shadow: 0 2px 24px rgba(0,0,0,0.35); }
/* ============================================================
   DEEP DARK GLASS — refined
============================================================ */

/* Deeper, cooler base */
:root {
  --black:  #060608;
  --dark:   #0a0b0d;
  --card:   #0e0f12;
  --card2:  #111215;
  --border: rgba(255,255,255,0.07);
  --steel:  #7c7c8c;
  --text:   #d4d4e0;

  --glass:        rgba(18,19,24,0.55);
  --glass-hover:  rgba(30,31,38,0.72);
  --glass-brd:    rgba(255,255,255,0.07);
  --glass-brd-hi: rgba(201,168,76,0.55);
  --glass-shadow: 0 12px 48px rgba(0,0,0,0.62);
  --glass-inset:  inset 0 1px 0 rgba(255,255,255,0.055),
                  inset 0 -1px 0 rgba(0,0,0,0.35);
}

body { background: #060608; }

/* Ambient gold bloom behind everything */
body::before {
  content:'';
  position: fixed; inset: 0; z-index: 0;
  background:
    radial-gradient(ellipse 50% 40% at 75% 25%, rgba(201,168,76,0.055) 0%, transparent 60%),
    radial-gradient(ellipse 45% 45% at 15% 85%, rgba(90,110,160,0.045) 0%, transparent 60%);
  pointer-events: none;
}

/* ---- Panels: deeper, glassier ---- */
.sc, .af, .pc, .cv-map, .cv-callout, .cvs, .about-panel, .an,
.ci, .cep, .prod-list li, .sb-why-card, .sb-list li, .sb-offer,
.sb-cta-inner, .hf, .loc, .hc-item, .gal-item {
  background: var(--glass) !important;
  backdrop-filter: blur(30px) saturate(180%) brightness(0.85);
  -webkit-backdrop-filter: blur(30px) saturate(180%) brightness(0.85);
  border: 1px solid var(--glass-brd) !important;
  box-shadow: var(--glass-shadow), var(--glass-inset);
  border-radius: 16px;
  position: relative;
  overflow: hidden;
}

/* Subtle top-edge light sweep on every panel */
.sc::after, .af::after, .pc::after, .cv-callout::after, .about-panel::after,
.sb-why-card::after, .sb-offer::after, .cep::after, .sb-cta-inner::after,
.hf::after, .hc-item::after {
  content:'';
  position:absolute; top:0; left:12%; right:12%; height:1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.16), transparent);
  pointer-events:none;
}

.sc:hover, .af:hover, .pc:hover, .cv-callout:hover, .about-panel:hover,
.ci:hover, .prod-list li:hover, .sb-why-card:hover, .sb-list li:hover,
.sb-offer:hover, .loc:hover, .hc-item:hover {
  background: var(--glass-hover) !important;
  border-color: var(--glass-brd-hi) !important;
  transform: translateY(-4px);
  box-shadow: 0 20px 60px rgba(0,0,0,0.7),
              0 0 0 1px rgba(201,168,76,0.12),
              var(--glass-inset);
}

/* ---- Sidebar: darker, heavier blur ---- */
.sidebar {
  background: rgba(8,9,11,0.78) !important;
  backdrop-filter: blur(40px) saturate(170%);
  -webkit-backdrop-filter: blur(40px) saturate(170%);
  border-right: 1px solid rgba(255,255,255,0.06) !important;
  box-shadow: 8px 0 60px rgba(0,0,0,0.5);
}
.sidebar::after {
  background: linear-gradient(to bottom, transparent, rgba(201,168,76,0.35) 25%, rgba(201,168,76,0.35) 75%, transparent);
}
.sb-logo { border-bottom: 1px solid rgba(255,255,255,0.06); }
.sb-footer { border-top: 1px solid rgba(255,255,255,0.06); }

.sb-link:hover { background: rgba(255,255,255,0.045) !important; }
.sb-link.active {
  background: linear-gradient(90deg, rgba(201,168,76,0.14), rgba(201,168,76,0.01)) !important;
  box-shadow: inset 0 0 20px rgba(201,168,76,0.06);
}

/* ---- Darker page overlays so glass pops ---- */
.page-overlay {
  background: linear-gradient(135deg,
    rgba(6,6,8,0.94) 0%,
    rgba(6,6,8,0.86) 40%,
    rgba(6,6,8,0.76) 100%) !important;
}

/* Slightly desaturate the bg photos for a moodier feel */
.page-bg { filter: saturate(0.55) contrast(1.05) brightness(0.75); }

/* ---- Icon chips ---- */
.sc-ico, .ci-ico {
  background: rgba(201,168,76,0.08) !important;
  border: 1px solid rgba(201,168,76,0.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
  border-radius: 12px;
}

/* ---- Buttons ---- */
.btn-outline {
  background: rgba(18,19,24,0.6) !important;
  backdrop-filter: blur(24px) saturate(160%);
  -webkit-backdrop-filter: blur(24px) saturate(160%);
  border: 1px solid rgba(201,168,76,0.35) !important;
}
.btn-outline:hover {
  background: rgba(201,168,76,0.1) !important;
  border-color: var(--gold) !important;
  box-shadow: 0 8px 28px rgba(201,168,76,0.15);
}
.btn-gold { box-shadow: 0 8px 30px rgba(201,168,76,0.22), inset 0 1px 0 rgba(255,255,255,0.3); }

/* ---- Bars ---- */
.tm-credit {
  background: rgba(8,9,11,0.7) !important;
  backdrop-filter: blur(34px) saturate(160%);
  -webkit-backdrop-filter: blur(34px) saturate(160%);
  border-top: 1px solid rgba(255,255,255,0.06) !important;
}

/* ---- Gallery ---- */
.gal-item { border-radius: 16px; background: rgba(12,13,16,0.5) !important; }
.gal-item img { filter: brightness(.82) saturate(.9); border-radius: 16px; }
.gal-item:hover img { filter: brightness(1) saturate(1.05); }

/* ---- Lightbox ---- */
.lightbox { background: rgba(3,3,5,0.9) !important; backdrop-filter: blur(28px) saturate(140%); }

/* ---- Grid divider lines ---- */
.hero-stats { border-top: 1px solid rgba(255,255,255,0.07) !important; }

/* ---- Text glow for depth ---- */
.sh2, .hero-h1 { text-shadow: 0 4px 40px rgba(0,0,0,0.6); }
.stat-n, .an-n, .cvs-n { filter: drop-shadow(0 2px 12px rgba(201,168,76,0.22)); }

/* ---- Light mode stays clean ---- */
/* ============================================================
   BUBBLE UI — soft, rounded, pill-shaped
============================================================ */

/* Big soft radii on all panels */
.sc, .af, .pc, .cv-map, .cv-callout, .cvs, .about-panel, .an,
.cep, .sb-why-card, .sb-offer, .sb-cta-inner, .hf, .gal-item {
  border-radius: 28px !important;
}

/* Pill-shaped list items & contact rows */
.prod-list li, .sb-list li, .loc, .ci, .hc-item {
  border-radius: 999px !important;
  padding-left: 22px !important;
  padding-right: 22px !important;
}

/* Pill buttons */
.btn-gold, .btn-outline {
  border-radius: 999px !important;
  padding: 15px 34px !important;
}

/* Sidebar nav — full pills */
.sb-link {
  border-radius: 999px !important;
  margin: 0 14px !important;
  padding: 14px 22px !important;
  width: auto !important;
}
.sb-link::before { display: none; }
.sb-link.active {
  background: linear-gradient(100deg, rgba(201,168,76,0.22), rgba(201,168,76,0.06)) !important;
  box-shadow: inset 0 0 24px rgba(201,168,76,0.1),
              0 4px 18px rgba(201,168,76,0.12);
}

/* Icon chips → circles */
.sc-ico, .ci-ico {
  border-radius: 50% !important;
  width: 46px !important; height: 46px !important;
}

/* Section tag → pill badge */
.stag {
  background: rgba(201,168,76,0.09);
  border: 1px solid rgba(201,168,76,0.22);
  border-radius: 999px;
  padding: 7px 18px 7px 14px;
  backdrop-filter: blur(12px);
}
.stag::before { width: 14px; }

/* Eyebrow → pill */
.eyebrow {
  background: rgba(201,168,76,0.08);
  border: 1px solid rgba(201,168,76,0.2);
  border-radius: 999px;
  padding: 8px 20px;
  backdrop-filter: blur(12px);
}

/* Offer numbers → circular badges */
.sb-offer-num {
  width: 34px; height: 34px;
  border-radius: 50%;
  background: rgba(201,168,76,0.12);
  border: 1px solid rgba(201,168,76,0.25);
  display: flex; align-items: center; justify-content: center;
  font-size: 14px !important;
  margin-top: 0 !important;
}

/* Gold rules → soft rounded */
.gr, .hero-rule { border-radius: 999px; height: 3px !important; }

/* Theme toggle & lightbox controls → circles */
/* Gallery zoom badge → circle */
.gal-zoom { border-radius: 50% !important; }

/* Lightbox image & caption */
.lb-img-wrap img { border-radius: 24px 24px 0 0 !important; }
.lb-cap { border-radius: 0 0 24px 24px !important; }

/* Logo box → squircle */
.logo-cbox { border-radius: 32px !important; }

/* Credit bar → floating pill */
.tm-credit {
  left: calc(var(--sidebar) + 20px) !important;
  right: 20px !important;
  bottom: calc(14px + env(safe-area-inset-bottom)) !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  padding: 10px 24px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.4);
}


/* Softer, bouncier hover */
.sc, .af, .pc, .cv-callout, .about-panel, .ci, .prod-list li,
.sb-why-card, .sb-list li, .sb-offer, .loc, .hc-item, .gal-item {
  transition: background .3s ease, border-color .3s ease,
              transform .35s cubic-bezier(.34,1.56,.64,1),
              box-shadow .3s ease !important;
}

/* Wider breathing room between bubbles */
.svc-grid, .about-feats, .prod-cards, .sb-why, .loc-grid,
.about-nums, .cv-stats, .gallery-grid { gap: 16px !important; }
.prod-list, .sb-list, .sb-offer-list, .ct-info, .cv-right,
.hero-contacts { gap: 12px !important; }

/* Hero contact pills */
.hc-item { padding: 13px 20px !important; }
.hc-ico { font-size: 16px; }

/* ============================================================
   PAGE LOAD ANIMATION (replaces SPA transition)
============================================================ */
.page {
  animation: pageSlideIn .6s cubic-bezier(.22,.8,.36,1) both;
}
@keyframes pageSlideIn {
  from { opacity: 0; transform: translateX(40px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* Content elements animate on load with stagger */
.stag, .sh2, .gr, .rsl, .eyebrow, .hero-h1, .hero-rule,
.hero-p, .hero-actions, .hero-contacts, .hero-stats, .home-right {
  animation: contentSlideIn .65s cubic-bezier(.22,.8,.36,1) both;
}
@keyframes contentSlideIn {
  from { opacity: 0; transform: translateX(50px); }
  to   { opacity: 1; transform: translateX(0); }
}
.stag        { animation-delay: .05s; }
.sh2         { animation-delay: .12s; }
.gr          { animation-delay: .20s; }
.eyebrow     { animation-delay: .05s; }
.hero-h1     { animation-delay: .12s; }
.hero-rule   { animation-delay: .20s; }
.hero-p      { animation-delay: .26s; }
.hero-actions{ animation-delay: .32s; }
.hero-contacts{animation-delay: .38s; }
.hero-stats  { animation-delay: .44s; }
.home-right  { animation-delay: .28s; }
.d1 { animation-delay: .16s; }
.d2 { animation-delay: .24s; }
.d3 { animation-delay: .32s; }
.d4 { animation-delay: .40s; }
.d5 { animation-delay: .48s; }
.d6 { animation-delay: .56s; }

/* Page backgrounds now via CSS classes */
.bg-home     { background-image: url('images/bg-home.jpg'); }
.bg-about    { background-image: url('images/bg-about.jpg'); }
.bg-services { background-image: url('images/bg-services.jpg'); }
.bg-products { background-image: url('images/bg-products.jpg'); }
.bg-coverage { background-image: url('images/bg-coverage.jpg'); }
.bg-contact  { background-image: url('images/bg-contact.jpg'); }
.bg-projects { background-image: url('images/bg-projects.jpg'); }
.bg-smallbiz { background-image: url('images/bg-smallbiz.jpg'); }

/* ============================================================
   MOBILE FLEET / VAN SECTION
============================================================ */
.van-section {
  position: relative;
  margin-top: 0;
  padding: 0;
  overflow: hidden;
}

.van-inner {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  align-items: center;
  gap: 48px;
  padding: 80px 6vw 100px;
  z-index: 2;
}

/* Animated airflow backdrop */
.van-airflow {
  position: absolute;
  inset: 0;
  z-index: 0;
  opacity: .5;
  background: url('images/airflow-divider.svg') center/cover no-repeat;
  mask-image: radial-gradient(ellipse 80% 70% at 60% 50%, black 20%, transparent 78%);
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 60% 50%, black 20%, transparent 78%);
  pointer-events: none;
}

/* Soft gold pool of light behind the van */
.van-glow {
  position: absolute;
  right: 2%;
  top: 50%;
  transform: translateY(-50%);
  width: 62%;
  aspect-ratio: 1/1;
  z-index: 1;
  background: radial-gradient(circle, rgba(201,168,76,0.16) 0%, rgba(201,168,76,0.05) 42%, transparent 68%);
  pointer-events: none;
}

/* ---- Left copy ---- */
.van-copy { position: relative; z-index: 3; }

.van-copy h2 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 700;
  font-size: clamp(30px, 3.2vw, 46px);
  line-height: 1.05;
  color: var(--white);
  letter-spacing: -.5px;
  margin-bottom: 18px;
}
.van-copy h2 em {
  font-style: normal;
  background: linear-gradient(135deg, var(--gold-lt), var(--gold));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.van-copy > p {
  color: var(--steel);
  font-size: 15px;
  line-height: 1.8;
  max-width: 420px;
  margin-bottom: 28px;
}

/* Service pills */
.van-services {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 30px;
}
.van-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--glass);
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  border: 1px solid var(--glass-brd);
  border-radius: 999px;
  padding: 9px 18px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--text);
  box-shadow: var(--glass-inset);
  transition: border-color .25s, background .25s, transform .3s cubic-bezier(.34,1.56,.64,1);
}
.van-pill:hover {
  border-color: var(--glass-brd-hi);
  background: var(--glass-hover);
  transform: translateY(-2px);
}
.van-pill .vp-tick { color: var(--gold); font-size: 11px; }

/* Trust badges */
.van-badges {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  max-width: 420px;
}
.van-badge {
  background: var(--glass);
  backdrop-filter: blur(24px) saturate(160%);
  -webkit-backdrop-filter: blur(24px) saturate(160%);
  border: 1px solid var(--glass-brd);
  border-radius: 20px;
  padding: 18px 12px;
  text-align: center;
  box-shadow: var(--glass-shadow), var(--glass-inset);
  transition: border-color .25s, transform .3s cubic-bezier(.34,1.56,.64,1);
}
.van-badge:hover { border-color: var(--glass-brd-hi); transform: translateY(-3px); }
.vb-ico { font-size: 20px; display: block; margin-bottom: 8px; }
.vb-n {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 700;
  font-size: 26px;
  line-height: 1;
  background: linear-gradient(135deg, var(--gold-lt), var(--gold));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  filter: drop-shadow(0 2px 10px rgba(201,168,76,.25));
}
.vb-l {
  font-size: 8.5px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--steel);
  margin-top: 5px;
  line-height: 1.35;
}

/* ---- Van image ---- */
.van-visual {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
}
.van-visual img {
  width: 100%;
  max-width: 560px;
  height: auto;
  display: block;
  filter: drop-shadow(0 30px 60px rgba(0,0,0,.65))
          drop-shadow(0 0 40px rgba(201,168,76,.10));
  animation: vanRoll 1s cubic-bezier(.22,.9,.36,1) both .5s;
}
@keyframes vanRoll {
  from { opacity: 0; transform: translateX(60px) scale(.94); }
  to   { opacity: 1; transform: translateX(0) scale(1); }
}

/* Ground shadow ellipse under the van */
.van-visual::after {
  content: '';
  position: absolute;
  bottom: 4%;
  left: 50%;
  transform: translateX(-50%);
  width: 62%;
  height: 26px;
  background: radial-gradient(ellipse, rgba(0,0,0,.55) 0%, transparent 72%);
  filter: blur(10px);
  z-index: -1;
}

/* "On the road" floating tag */
.van-tag {
  position: absolute;
  top: 6%;
  left: 0;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  background: var(--glass);
  backdrop-filter: blur(24px) saturate(170%);
  -webkit-backdrop-filter: blur(24px) saturate(170%);
  border: 1px solid var(--glass-brd);
  border-radius: 999px;
  padding: 10px 20px;
  box-shadow: var(--glass-shadow), var(--glass-inset);
  animation: vanFloat 4.5s ease-in-out infinite;
}
@keyframes vanFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-9px)} }
.van-tag-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #34d97b;
  box-shadow: 0 0 10px rgba(52,217,123,.8);
  animation: vanBlink 2s ease-in-out infinite;
}
@keyframes vanBlink { 0%,100%{opacity:1} 50%{opacity:.35} }
.van-tag span {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px; font-weight: 600;
  letter-spacing: 2px; text-transform: uppercase;
  color: var(--text);
}

@media(max-width: 1000px) {
  .van-inner { grid-template-columns: 1fr; gap: 36px; padding: 64px 6vw 80px; }
  .van-visual { order: -1; }
  .van-tag { top: 2%; }
  .van-glow { width: 90%; right: 5%; }
}
@media(max-width: 560px) {
  .van-badges { grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
  .van-badge { padding: 14px 6px; border-radius: 16px; }
  .vb-n { font-size: 21px; }
  .vb-l { font-size: 7.5px; letter-spacing: 1px; }
}

/* ============================================================
   SCROLLABLE HOME (hero + van section)
============================================================ */
body.has-scroll .main { overflow-y: auto; overflow-x: hidden; }
body.has-scroll .page {
  position: relative;
  inset: auto;
  overflow: visible;
  min-height: 100vh;
}
body.has-scroll #page-home .pg,
body.has-scroll .page > .pg { min-height: 100vh; }

/* Scroll cue at the bottom of the hero */
.scroll-cue {
  position: absolute;
  bottom: 92px;
  left: 6vw;
  z-index: 5;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--steel);
  text-decoration: none;
  opacity: .7;
  transition: opacity .25s, color .25s;
  animation: cueFade 1s ease both 1.2s;
}
.scroll-cue:hover { opacity: 1; color: var(--gold); }
.scroll-cue .cue-arrow {
  display: inline-block;
  animation: cueBob 2s ease-in-out infinite;
}
@keyframes cueBob { 0%,100%{transform:translateY(0)} 50%{transform:translateY(5px)} }
@keyframes cueFade { from{opacity:0} to{opacity:.7} }

@media(max-width:1000px){ .scroll-cue { display: none; } }

/* Keep the sticky bits above scrolling content */
.tm-credit, .whatsapp-btn, .tm-credit { z-index: 590; }

/* ============================================================
   THEMED SVG ARTWORK
============================================================ */
@media(max-width:900px){  }

/* Full-width animated divider between hero and van section */
.airflow-divider {
  position: relative;
  width: 100%;
  height: 190px;
  overflow: hidden;
  background: url('images/airflow-divider.svg') center/cover no-repeat;
  mask-image: linear-gradient(to bottom, transparent 0%, black 32%, black 68%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 32%, black 68%, transparent 100%);
  opacity: .85;
}
@media(max-width:900px){ .airflow-divider { height: 130px; } }

/* dark-only site — light theme removed */
html{color-scheme:dark;}


/* Tech Menders credit — mobile placement */
@media(max-width:640px){
  .tm-credit {
    right: 14px;
    bottom: calc(90px + env(safe-area-inset-bottom));
    padding: 7px 13px;
    opacity: .45;
  }
  .tm-credit a { font-size: 9px; letter-spacing: 1.2px; }
  .tm-credit img { height: 13px; }
}

/* ============================================================
   Tech Menders credit — sidebar copy hidden (belt & braces)
   Guarantees only ONE credit shows, bottom right, even if an
   older HTML file is still cached or on the server.
============================================================ */
.sidebar a[href*="techmenders"],
.sb-footer a[href*="techmenders"] {
  display: none !important;
}
