*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:'Jost',sans-serif;background:#f9f7f4;color:#1a1816;overflow-x:hidden;}
:root{--serif:'Cormorant Garamond',Georgia,serif;--sans:'Jost',sans-serif;--black:#1a1816;--offwhite:#f9f7f4;--beige:#ede8e0;--border:#d9d0c4;--soft:#6e6660;--dark:#141210;}
nav{position:fixed;top:0;left:0;right:0;z-index:1000;height:70px;background:rgba(249,247,244,0.97);backdrop-filter:blur(10px);border-bottom:0.5px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 4%;}
.nav-links{display:flex;list-style:none;gap:24px;}
.nav-links a{font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--black);text-decoration:none;font-weight:400;opacity:0.65;transition:opacity 0.2s;}
.nav-links a:hover,.nav-links a.nav-active{opacity:1;font-weight:500;}
.nav-right{display:flex;align-items:center;gap:16px;}
.nav-phone{font-size:13px;font-weight:500;color:var(--black);text-decoration:none;}
.btn-nav{background:var(--black);color:var(--offwhite);padding:10px 20px;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;text-decoration:none;border-radius:1px;}
.btn-nav:hover{background:#2e2a26;}
.page-section{display:none;height:calc(100vh - 70px);overflow:hidden;flex-direction:column;}
.page-section.active{display:flex;}
.section-pad{padding:0 5%;width:100%;display:flex;flex-direction:column;justify-content:center;}
/* HERO */
#home{height:100vh;overflow:hidden;display:flex;}
.hero-left{flex:1;background:var(--dark);display:flex;flex-direction:column;justify-content:center;padding:80px 5% 40px;position:relative;overflow:hidden;}
.hero-right{flex:1;overflow:hidden;position:relative;}
.hero-right img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.hero-tag{font-size:9px;letter-spacing:0.2em;text-transform:uppercase;color:rgba(249,247,244,0.4);margin-bottom:20px;}
.hero-h1{font-family:var(--serif);font-size:clamp(38px,4.5vw,62px);font-weight:300;color:var(--offwhite);line-height:1.07;margin-bottom:18px;}
.hero-desc{font-size:14px;font-weight:300;color:rgba(249,247,244,0.5);line-height:1.8;max-width:400px;margin-bottom:28px;}
.hero-ctas{display:flex;gap:14px;align-items:center;margin-bottom:44px;}
.btn-primary{background:var(--offwhite);color:var(--black);padding:13px 28px;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;text-decoration:none;border-radius:1px;font-weight:500;cursor:pointer;display:inline-block;font-family:var(--sans);border:none;}
.btn-outline-light{font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:rgba(249,247,244,0.6);text-decoration:none;border-bottom:0.5px solid rgba(249,247,244,0.3);padding-bottom:2px;}
.hero-stats{display:flex;gap:0;border-top:0.5px solid rgba(255,255,255,0.08);padding-top:28px;}
.stat{flex:1;padding-right:20px;margin-right:20px;border-right:0.5px solid rgba(255,255,255,0.08);}
.stat:last-child{border:none;}
.stat-num{font-family:var(--serif);font-size:34px;font-weight:300;color:var(--offwhite);}
.stat-label{font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:rgba(249,247,244,0.35);margin-top:4px;}
.trust-strip{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,0.18);display:flex;border-top:0.5px solid rgba(255,255,255,0.06);}
.trust-item{flex:1;padding:10px 14px;border-right:0.5px solid rgba(255,255,255,0.06);font-size:10px;letter-spacing:0.08em;text-transform:uppercase;color:rgba(249,247,244,0.38);}
.trust-item:last-child{border:none;}
/* ABOUT */
#about{background:var(--beige);flex-direction:row !important;}
.about-img{flex:1;overflow:hidden;position:relative;align-self:stretch;background:var(--beige);}
.about-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.about-text{flex:1;display:flex;flex-direction:column;justify-content:center;padding:0 5%;overflow-y:auto;}
.eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.eyebrow-line{display:block;width:20px;height:0.5px;background:var(--black);flex-shrink:0;}
.eyebrow-text{font-size:10px;letter-spacing:0.18em;text-transform:uppercase;color:var(--soft);}
.section-h2{font-family:var(--serif);font-size:clamp(28px,3vw,44px);font-weight:300;color:var(--black);line-height:1.1;margin-bottom:14px;}
.about-quote{font-family:var(--serif);font-style:italic;font-size:15px;font-weight:300;line-height:1.65;color:#3a3632;border-left:2px solid var(--border);padding-left:14px;margin-bottom:14px;}
.about-body{font-size:13px;font-weight:300;color:var(--soft);line-height:1.8;margin-bottom:22px;}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);border:0.5px solid var(--border);margin-bottom:24px;}
.stat-box{padding:14px 12px;border-right:0.5px solid var(--border);}
.stat-box:last-child{border:none;}
.stat-box-num{font-family:var(--serif);font-size:24px;font-weight:300;color:var(--black);}
.stat-box-label{font-size:10px;letter-spacing:0.08em;text-transform:uppercase;color:var(--soft);margin-top:3px;}
.btn-dark{background:var(--black);color:var(--offwhite);padding:12px 26px;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;text-decoration:none;border-radius:1px;display:inline-block;}
.btn-text{font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:var(--black);text-decoration:none;border-bottom:0.5px solid var(--black);padding-bottom:2px;}
.cta-row{display:flex;gap:16px;align-items:center;}
/* SERVICES */
#services{background:var(--offwhite);}
.svc-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:28px;gap:40px;}
.svc-desc{font-size:13px;font-weight:300;color:var(--soft);line-height:1.7;max-width:300px;flex-shrink:0;}
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.svc-card{background:#fff;border:0.5px solid var(--border);padding:26px 20px;display:flex;flex-direction:column;border-radius:2px;transition:all 0.25s;cursor:pointer;}
.svc-card:hover{background:var(--black);border-color:var(--black);transform:translateY(-3px);box-shadow:0 8px 24px rgba(26,24,22,0.1);}
.svc-icon-wrap{width:38px;height:38px;border-radius:50%;background:var(--beige);display:flex;align-items:center;justify-content:center;margin-bottom:14px;transition:background 0.25s;}
.svc-card:hover .svc-icon-wrap{background:rgba(255,255,255,0.1);}
.svc-icon-wrap svg{width:17px;height:17px;stroke:var(--soft);transition:stroke 0.25s;}
.svc-card:hover .svc-icon-wrap svg{stroke:rgba(249,247,244,0.5);}
.svc-title{font-family:var(--serif);font-size:19px;font-weight:400;color:var(--black);margin-bottom:10px;transition:color 0.25s;}
.svc-card:hover .svc-title{color:var(--offwhite);}
.svc-body{font-size:13px;font-weight:300;color:var(--soft);line-height:1.7;margin-bottom:14px;flex:1;transition:color 0.25s;}
.svc-card:hover .svc-body{color:rgba(249,247,244,0.5);}
.svc-price{font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:var(--soft);margin-bottom:12px;transition:color 0.25s;}
.svc-card:hover .svc-price{color:rgba(249,247,244,0.35);}
.svc-link{font-size:11px;letter-spacing:0.08em;text-transform:uppercase;color:var(--black);text-decoration:none;border-bottom:0.5px solid var(--border);padding-bottom:2px;transition:all 0.25s;align-self:flex-start;}
.svc-card:hover .svc-link{color:var(--offwhite);border-color:rgba(249,247,244,0.25);}
/* PROCESS */
#process{background:var(--dark);}
.process-header{text-align:center;margin-bottom:36px;}
.dark-eyebrow{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:12px;}
.dark-eyebrow::before,.dark-eyebrow::after{content:'';display:block;width:20px;height:0.5px;background:rgba(249,247,244,0.18);}
.dark-eyebrow span{font-size:10px;letter-spacing:0.18em;text-transform:uppercase;color:rgba(249,247,244,0.32);}
.dark-h2{font-family:var(--serif);font-size:clamp(28px,3vw,42px);font-weight:300;color:var(--offwhite);line-height:1.1;}
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,0.05);}
.process-step{background:var(--dark);padding:32px 24px;}
.process-num{font-family:var(--serif);font-size:48px;font-weight:300;color:rgba(249,247,244,0.05);margin-bottom:14px;}
.process-title{font-family:var(--serif);font-size:18px;font-weight:400;color:var(--offwhite);margin-bottom:10px;}
.process-body{font-size:13px;font-weight:300;color:rgba(249,247,244,0.42);line-height:1.75;}
/* REVIEWS */
#reviews{background:var(--offwhite);}
.reviews-header{text-align:center;margin-bottom:32px;}
.light-eyebrow{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:12px;}
.light-eyebrow::before,.light-eyebrow::after{content:'';display:block;width:20px;height:0.5px;background:var(--border);}
.light-eyebrow span{font-size:10px;letter-spacing:0.18em;text-transform:uppercase;color:var(--soft);}
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.review-card{background:#fff;border:0.5px solid var(--border);padding:20px 18px;border-radius:2px;display:flex;flex-direction:column;overflow:hidden;}
.review-stars{color:var(--black);letter-spacing:4px;margin-bottom:14px;font-size:13px;}
.review-text{font-family:var(--serif);font-style:italic;font-size:13px;font-weight:300;line-height:1.65;color:#3a3632;margin-bottom:12px;flex:1;overflow:hidden;}
.reviewer{display:flex;align-items:center;gap:10px;overflow:hidden;flex-shrink:0;}
.reviewer-avatar{width:34px;height:34px;border-radius:50%;background:var(--black);color:var(--beige);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:500;flex-shrink:0;}
.reviewer-name{font-size:11px;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;color:var(--black);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.reviewer-proj{font-size:10px;color:var(--soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
/* BEFORE/AFTER */
#before-after{background:var(--beige);}
.ba-header{text-align:center;margin-bottom:24px;}
.ba-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;flex:1;}
.ba-card{background:#fff;border-radius:2px;overflow:hidden;display:flex;flex-direction:column;}
.ba-slider-wrap{flex:1;position:relative;overflow:hidden;cursor:col-resize;user-select:none;min-height:200px;}
/* PROJECTS */
#projects{background:var(--offwhite);padding:32px 5% 28px;}
.projects-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:18px;flex-shrink:0;}
.gallery-filters{display:flex;gap:8px;}
.gf-btn{background:#fff;border:0.5px solid var(--border);padding:8px 14px;font-size:10px;letter-spacing:0.1em;text-transform:uppercase;cursor:pointer;border-radius:1px;transition:all 0.2s;font-family:var(--sans);}
.gf-btn:hover,.gf-btn.active{background:var(--black);color:var(--offwhite);border-color:var(--black);}
#galleryGrid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:1fr;gap:10px;flex:1;min-height:0;overflow:hidden;}
.gallery-card{position:relative;overflow:hidden;border-radius:2px;cursor:pointer;background:var(--beige);}
.gallery-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.5s;}
.gallery-card:hover img{transform:scale(1.04);}
.gallery-overlay{position:absolute;inset:0;background:linear-gradient(transparent 50%,rgba(26,24,22,0.65));opacity:0;transition:opacity 0.3s;display:flex;flex-direction:column;justify-content:flex-end;padding:14px;}
.gallery-card:hover .gallery-overlay{opacity:1;}
.gallery-overlay-title{font-family:var(--serif);font-size:14px;font-weight:400;color:#fff;}
.gallery-overlay-sub{font-size:10px;color:rgba(255,255,255,0.6);margin-top:3px;}
.gallery-overlay-tag{display:inline-block;background:var(--black);color:var(--offwhite);font-size:9px;letter-spacing:0.08em;padding:2px 7px;border-radius:1px;margin-top:5px;}
/* CALCULATOR */
#calculator{background:var(--offwhite);}
.calc-inner{max-width:740px;margin:0 auto;width:100%;}
.calc-header{text-align:center;margin-bottom:24px;}
.steps{display:flex;border:0.5px solid var(--border);border-radius:2px;overflow:hidden;margin-bottom:24px;}
.step{flex:1;padding:11px;text-align:center;font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:var(--soft);border-right:0.5px solid var(--border);transition:all 0.2s;}
.step:last-child{border:none;}
.step.active{background:var(--black);color:var(--offwhite);}
.step.done{background:var(--beige);color:var(--black);}
.panel{display:none;}.panel.active{display:block;}
.panel-title{font-family:var(--serif);font-size:20px;font-weight:400;color:var(--black);margin-bottom:5px;}
.panel-sub{font-size:12px;color:var(--soft);font-weight:300;margin-bottom:18px;}
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:24px;}
.tile{border:0.5px solid var(--border);background:#fff;padding:16px 10px;cursor:pointer;transition:all 0.2s;border-radius:2px;text-align:center;position:relative;}
.tile:hover{border-color:var(--black);}
.tile.selected{border-color:var(--black);background:var(--black);}
.tile.selected::after{content:'✓';position:absolute;top:5px;right:7px;font-size:9px;color:rgba(255,255,255,0.6);}
.tile-icon{margin-bottom:10px;display:flex;align-items:center;justify-content:center;color:var(--soft);}
.tile-label{font-size:10px;font-weight:500;letter-spacing:0.04em;color:var(--black);}
.tile.selected .tile-label{color:var(--offwhite);}
  .tile.selected .tile-icon{color:var(--offwhite);}
.size-wrap{margin:14px 0 20px;}
.size-display{font-family:var(--serif);font-size:48px;font-weight:300;color:var(--black);text-align:center;line-height:1;}
.size-unit{font-size:10px;color:var(--soft);text-align:center;letter-spacing:0.12em;text-transform:uppercase;margin-bottom:14px;}
.slider{width:100%;-webkit-appearance:none;height:2px;background:var(--border);outline:none;}
.slider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--black);cursor:pointer;}
.size-range{display:flex;justify-content:space-between;font-size:11px;color:var(--soft);margin-top:5px;}
.specs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px;}
.spec-card{border:0.5px solid var(--border);background:#fff;padding:22px 16px;cursor:pointer;transition:all 0.2s;border-radius:2px;text-align:center;}
.spec-card:hover{border-color:var(--black);}
.spec-card.selected{border-color:var(--black);background:var(--black);}
.spec-name{font-family:var(--serif);font-size:19px;font-weight:400;color:var(--black);margin-bottom:5px;}
.spec-price{font-size:11px;color:var(--soft);margin-bottom:5px;}
.spec-desc{font-size:11px;color:var(--soft);line-height:1.55;font-weight:300;}
.spec-card.selected .spec-name,.spec-card.selected .spec-price,.spec-card.selected .spec-desc{color:var(--offwhite);}
.result-box{border:0.5px solid var(--border);background:#fff;padding:32px;border-radius:2px;text-align:center;}
.result-label{font-size:10px;letter-spacing:0.15em;text-transform:uppercase;color:var(--soft);margin-bottom:8px;}
.result-range{font-family:var(--serif);font-size:42px;font-weight:300;color:var(--black);margin-bottom:4px;}
.result-sub{font-size:12px;color:var(--soft);margin-bottom:20px;font-weight:300;}
.result-row{display:flex;justify-content:center;gap:32px;margin-bottom:24px;}
.result-item-label{font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:var(--soft);margin-bottom:3px;}
.result-item-val{font-size:14px;font-weight:500;color:var(--black);}
.btn-row{display:flex;gap:10px;justify-content:flex-end;}
.btn{padding:11px 26px;font-family:var(--sans);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;cursor:pointer;border-radius:1px;transition:all 0.2s;}
.btn-back{background:transparent;border:0.5px solid var(--border);color:var(--soft);}
.btn-back:hover{border-color:var(--black);color:var(--black);}
.btn-next{background:var(--black);border:0.5px solid var(--black);color:var(--offwhite);}
.btn-next:disabled{background:var(--border);border-color:var(--border);cursor:not-allowed;}
.btn-cta{background:var(--black);border:none;color:var(--offwhite);padding:13px 32px;font-size:11px;cursor:pointer;border-radius:1px;font-family:var(--sans);letter-spacing:0.12em;text-transform:uppercase;}
/* AREAS */
#areas{background:var(--beige);}
.areas-inner{max-width:780px;margin:0 auto;text-align:center;width:100%;}
.area-pills{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:28px;}
.area-pill{border:0.5px solid var(--border);padding:8px 16px;font-size:11px;letter-spacing:0.04em;color:var(--black);cursor:pointer;border-radius:1px;transition:all 0.2s;background:#fff;}
.area-pill:hover{background:var(--black);color:var(--offwhite);border-color:var(--black);}
/* CONTACT */
#contact{background:var(--offwhite);flex-direction:row !important;}
.contact-left{width:38%;background:var(--dark);display:flex;flex-direction:column;justify-content:center;padding:0 4%;flex-shrink:0;}
.contact-right{flex:1;display:flex;flex-direction:column;justify-content:center;padding:0 4%;overflow-y:auto;}
.contact-eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.contact-h2{font-family:var(--serif);font-size:clamp(28px,3vw,44px);font-weight:300;color:var(--offwhite);line-height:1.1;margin-bottom:12px;}
.contact-desc{font-size:13px;color:rgba(249,247,244,0.48);font-weight:300;line-height:1.8;margin-bottom:24px;}
.contact-detail{color:rgba(249,247,244,0.6);font-size:13px;margin-bottom:11px;}
.form-title{font-family:var(--serif);font-size:20px;font-weight:400;color:var(--black);margin-bottom:18px;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px;}
.fg{display:flex;flex-direction:column;gap:4px;}
.fg label{font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:var(--soft);font-weight:500;}
.fg input,.fg select,.fg textarea{border:0.5px solid var(--border);background:#fff;padding:10px 13px;font-family:var(--sans);font-size:13px;font-weight:300;color:var(--black);border-radius:1px;outline:none;resize:vertical;}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--black);}
.full-col{grid-column:1/-1;}
.submit-btn{margin-top:12px;width:100%;padding:14px;background:var(--black);color:var(--offwhite);font-family:var(--sans);font-size:11px;letter-spacing:0.14em;text-transform:uppercase;border:none;cursor:pointer;border-radius:1px;}
/* FOOTER */
footer{background:var(--dark);padding:44px 5% 22px;display:none;}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:36px;margin-bottom:36px;border-bottom:0.5px solid rgba(255,255,255,0.07);padding-bottom:36px;}
.footer-logo{font-family:var(--serif);font-size:21px;font-weight:300;color:rgba(249,247,244,0.75);margin-bottom:8px;}
.footer-tagline{font-size:12px;color:rgba(249,247,244,0.32);font-weight:300;line-height:1.7;}
.footer-col-title{font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:rgba(249,247,244,0.28);margin-bottom:12px;}
.footer-link{display:block;font-size:13px;color:rgba(249,247,244,0.52);text-decoration:none;font-weight:300;margin-bottom:9px;}
.footer-bottom{display:flex;justify-content:space-between;font-size:11px;color:rgba(255,255,255,0.22);letter-spacing:0.04em;}
/* CHAT */
#chatBubble{position:fixed;bottom:24px;right:24px;z-index:9999;width:50px;height:50px;border-radius:50%;background:var(--black);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(26,24,22,0.28);}
#chatBubble svg{width:20px;height:20px;stroke:#fff;}
#inboxBtn{position:fixed;bottom:24px;right:86px;z-index:9999;background:var(--dark);color:#fff;border:none;cursor:pointer;padding:11px 16px;border-radius:22px;font-size:12px;font-family:var(--sans);display:flex;align-items:center;gap:7px;box-shadow:0 4px 16px rgba(0,0,0,0.22);}
.gallery-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--beige);}

  /* Gallery card height */
  #galleryGrid { height: 0; flex: 1; min-height: 0; }
  .gallery-card { height: 100%; min-height: 120px; }
  .gallery-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .gallery-card { position: relative; }

  /* BA container */
  #baContainer { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; flex: 1; min-height: 0; }
  .ba-card { overflow: hidden; border-radius: 2px; display: flex; flex-direction: column; background: #fff; }
  .ba-slider-wrap { flex: 1; position: relative; overflow: hidden; cursor: col-resize; user-select: none; min-height: 180px; }

  /* Before/after section layout */
  #before-after .section-pad { flex: 1; display: flex; flex-direction: column; }
  #before-after .ba-header { flex-shrink: 0; }

  /* Projects layout */
  #projects .projects-header { flex-shrink: 0; }


  #baContainer > * { height: 100%; }
  .ba-slider-wrap { flex: 1; min-height: 0; position: relative; overflow: hidden; cursor: col-resize; user-select: none; }


  /* ── LIGHTBOX ── */
  #lightbox { position:fixed; inset:0; background:rgba(10,10,10,0.92); z-index:9998; display:none; align-items:center; justify-content:center; cursor:zoom-out; }
  #lightbox.open { display:flex; }
  #lightbox-img { max-width:90vw; max-height:88vh; object-fit:contain; display:block; border-radius:2px; box-shadow:0 32px 80px rgba(0,0,0,0.5); animation:lbIn 0.25s ease; }
  @keyframes lbIn { from { opacity:0; transform:scale(0.95); } to { opacity:1; transform:scale(1); } }
  #lightbox-caption { position:fixed; bottom:32px; left:0; right:0; text-align:center; color:rgba(255,255,255,0.65); font-size:12px; letter-spacing:0.1em; font-family:var(--sans); }
  #lightbox-close { position:fixed; top:24px; right:28px; color:rgba(255,255,255,0.6); font-size:28px; cursor:pointer; line-height:1; background:none; border:none; padding:8px; transition:color 0.2s; }
  #lightbox-close:hover { color:#fff; }
  #lightbox-prev, #lightbox-next { position:fixed; top:50%; transform:translateY(-50%); background:rgba(255,255,255,0.1); border:0.5px solid rgba(255,255,255,0.15); color:#fff; width:48px; height:48px; cursor:pointer; border-radius:1px; display:flex; align-items:center; justify-content:center; transition:background 0.2s; }
  #lightbox-prev:hover, #lightbox-next:hover { background:rgba(255,255,255,0.2); }
  #lightbox-prev { left:24px; }
  #lightbox-next { right:24px; }


/* ═══════════════ LOADING SCREEN ═══════════════ */
.loader{position:fixed;inset:0;z-index:9999;background:var(--dark);display:flex;align-items:center;justify-content:center;transition:opacity 0.6s ease,visibility 0.6s ease;}
.loader.hidden{opacity:0;visibility:hidden;}
.loader-inner{display:flex;flex-direction:column;align-items:center;gap:1.1rem;animation:loaderRise 0.7s ease both;}
.loader-mark{display:flex;align-items:center;gap:0.7rem;}
.loader-arc{width:2.4rem;height:2.4rem;border-radius:50%;border:2px solid rgba(249,247,244,0.15);border-top-color:#c9a24b;animation:loaderSpin 0.9s linear infinite;}
.loader-word{font-family:var(--serif);font-size:clamp(1.8rem,6vw,2.6rem);font-weight:300;letter-spacing:0.02em;color:var(--offwhite);}
.loader-iq{color:#c9a24b;}
.loader-tag{font-family:var(--sans);font-size:clamp(0.55rem,2vw,0.7rem);letter-spacing:0.25em;text-transform:uppercase;color:rgba(249,247,244,0.4);}
.loader-bar{width:min(220px,60vw);height:2px;background:rgba(249,247,244,0.12);border-radius:2px;overflow:hidden;margin-top:0.4rem;}
.loader-bar-fill{width:0%;height:100%;background:#c9a24b;transition:width 0.3s ease;}
@keyframes loaderSpin{to{transform:rotate(360deg);}}
@keyframes loaderRise{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}

/* ═══════════════ HAMBURGER + MOBILE MENU ═══════════════ */
.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;background:none;border:none;cursor:pointer;padding:8px;z-index:1005;}
.nav-toggle span{display:block;height:2px;width:100%;background:var(--black);border-radius:2px;transition:transform 0.3s ease,opacity 0.2s ease;}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.open span:nth-child(2){opacity:0;}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.mobile-menu-overlay{display:none;position:fixed;inset:0;background:rgba(20,18,16,0.45);backdrop-filter:blur(2px);z-index:1003;opacity:0;transition:opacity 0.3s ease;}
.mobile-menu-overlay.open{display:block;opacity:1;}
.mobile-menu{position:fixed;top:0;right:0;height:100%;width:min(78vw,320px);background:var(--offwhite);z-index:1004;transform:translateX(100%);transition:transform 0.35s cubic-bezier(0.4,0,0.2,1);display:flex;flex-direction:column;justify-content:space-between;padding:5.5rem 2rem 2rem;box-shadow:-8px 0 30px rgba(0,0,0,0.12);overflow-y:auto;}
.mobile-menu.open{transform:translateX(0);}
.mobile-nav-links{list-style:none;display:flex;flex-direction:column;gap:0.2rem;}
.mobile-nav-links a{display:block;padding:0.85rem 0;font-size:0.95rem;letter-spacing:0.06em;text-transform:uppercase;color:var(--black);text-decoration:none;border-bottom:0.5px solid var(--border);font-weight:400;}
.mobile-nav-links a:active{opacity:0.6;}
.mobile-menu-foot{display:flex;flex-direction:column;gap:0.9rem;margin-top:1.5rem;}
.mobile-menu-phone{font-size:1.1rem;font-weight:500;color:var(--black);text-decoration:none;text-align:center;}
body.menu-open{overflow:hidden;}

/* ═══════════════ FLUID TYPE (smooth scaling) ═══════════════ */
.hero-h1{font-size:clamp(2rem,6vw,3.9rem);}
.hero-desc{font-size:clamp(0.85rem,2vw,0.95rem);}
.stat-num{font-size:clamp(1.6rem,5vw,2.1rem);}

/* ═══════════════ RESPONSIVE — TABLET (≤900px) ═══════════════ */
@media (max-width:900px){
  .nav-links,.nav-right{display:none;}
  .nav-toggle{display:flex;position:fixed;top:11px;right:5%;}
  nav{padding:0 5%;}
  .svc-grid{grid-template-columns:repeat(2,1fr);}
  .process-grid{grid-template-columns:repeat(2,1fr);}
  .reviews-grid{grid-template-columns:repeat(2,1fr);}
  .ba-grid{grid-template-columns:repeat(2,1fr);}
  #galleryGrid{grid-template-columns:repeat(2,1fr);grid-auto-rows:auto;}
  .stats-grid{grid-template-columns:repeat(2,1fr);}
  /* let panels grow & scroll instead of locking to viewport height (inline styles need !important) */
  .page-section{height:auto !important;min-height:calc(100vh - 70px);overflow-y:auto !important;}
  .page-section.active{display:flex;}
  #galleryGrid{overflow:visible;}
}

/* ═══════════════ RESPONSIVE — PHONE (≤600px) ═══════════════ */
@media (max-width:600px){
  nav{height:64px;}
  /* CRITICAL: sections carry inline height:100vh & overflow:hidden — force them open so content isn't clipped */
  .page-section{height:auto !important;min-height:auto !important;overflow:visible !important;padding-top:1.5rem !important;padding-bottom:2rem !important;}
  .page-section.active{display:flex !important;}
  /* HERO: stack image under text */
  #home{flex-direction:column !important;height:auto !important;min-height:100vh;overflow:visible !important;}
  .hero-left{padding:5.5rem 7% 2.5rem;}
  /* drop absolute positioning so the image flows at natural height */
  .hero-right{flex:none !important;width:100%;position:relative;height:auto;min-height:0;}
  .hero-right img{position:relative !important;inset:auto !important;width:100% !important;height:auto !important;display:block;}
  .hero-ctas{flex-direction:column;align-items:stretch;gap:0.8rem;}
  .hero-ctas .btn-primary{text-align:center;}
  .hero-stats{flex-wrap:wrap;gap:1rem 0;}
  .stat{flex:0 0 50%;border-right:none;margin-right:0;padding-right:0;}
  .trust-strip{position:relative;flex-wrap:wrap;}
  .trust-item{flex:0 0 50%;}
  /* ABOUT: stack image over text */
  #about{flex-direction:column !important;height:auto !important;min-height:auto !important;}
  .about-img{flex:none !important;width:100%;position:relative;height:auto;min-height:0;}
  .about-img img{position:relative !important;inset:auto !important;width:100% !important;height:auto !important;display:block;}
  .about-text{padding:2.5rem 7%;}
  /* single-column everything */
  .svc-grid,.process-grid,.reviews-grid,.ba-grid,#galleryGrid,.stats-grid{grid-template-columns:1fr !important;}
  #galleryGrid{grid-auto-rows:auto !important;overflow:visible !important;}
  .svc-header,.projects-header,.cta-row,.cta-block .cta-row{flex-direction:column;align-items:flex-start;gap:1rem;}
  .gallery-filters{flex-wrap:wrap;}
  .ba-slider-wrap{min-height:240px;}
  .section-pad{padding:2rem 7%;}
  .steps{flex-direction:column;}
  /* universal image safety: never overflow the viewport */
  img{max-width:100% !important;height:auto;}
  /* fluid text so nothing is too big or too small */
  .hero-h1{font-size:clamp(2rem,8vw,2.6rem) !important;}
  .hero-desc{font-size:0.9rem !important;line-height:1.7;}
  body{font-size:16px;}
}