/* Multi-page additions */
.menu a.active:not(.btn){opacity:1;color:var(--gold)}
.menu a.active:not(.btn)::after{width:100%}

/* Inner page hero */
.page-hero{position:relative;padding:190px 0 100px;color:#fff;background:linear-gradient(100deg,rgba(10,11,12,.92),rgba(10,11,12,.6)),var(--bg) center/cover,var(--ink2)}
.page-hero h1{font-family:var(--serif);font-weight:600;font-size:clamp(38px,5.5vw,68px);line-height:1.1;margin-bottom:14px}
.page-hero p:not(.crumbs){color:rgba(255,255,255,.8);font-size:18px;max-width:560px}
.crumbs{font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-bottom:18px}
.crumbs a:hover{text-decoration:underline}

/* Home service cards as links */
a.card{display:block;color:#fff}
.more{display:inline-block;margin-top:18px;color:var(--gold);font-size:13px;letter-spacing:1px;text-transform:uppercase;transition:.3s}
.card:hover .more{transform:translateX(6px)}
.quotes.dark blockquote{background:var(--ink2);box-shadow:none;border:1px solid var(--line);border-top:3px solid var(--gold)}
.quotes.dark blockquote p{color:rgba(255,255,255,.8)}
.quotes.dark cite span{color:rgba(255,255,255,.5)}
.quotes.dark blockquote:hover{background:var(--ink3);box-shadow:none}

/* CTA strip */
.cta{background:var(--gold);color:var(--ink);text-align:center;padding:90px 0}
.cta h2{margin-bottom:10px}
.cta p{margin-bottom:30px;font-size:18px}
.cta .btn-dark:hover{background:#fff;color:var(--ink)}

/* Services page */
.svc{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;padding:60px 0}
.svc+.svc{border-top:1px solid rgba(0,0,0,.08)}
.svc.rev .svc-img{order:2}
.svc-img{overflow:hidden}
.svc-img img{width:100%;height:480px;object-fit:cover;transition:transform 1.2s var(--ease)}
.svc:hover .svc-img img{transform:scale(1.06)}
.num{display:block;font-family:var(--serif);font-size:70px;line-height:1;color:var(--gold);opacity:.5;margin-bottom:6px}
.svc-txt p{color:var(--muted);margin-bottom:22px;font-size:17px}
.svc-txt .ticks{margin-bottom:30px}

/* About page */
.stats-strip{background:var(--ink);color:#fff;padding:70px 0}
.stats-strip .container{display:grid;grid-template-columns:repeat(4,1fr);text-align:center}
.stats-strip b{display:block;font-family:var(--serif);font-size:54px;color:var(--gold);line-height:1.1}
.stats-strip span{color:rgba(255,255,255,.7);font-size:14px;letter-spacing:.5px}
.team{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.member{text-align:center;padding:40px 20px;background:#fff;box-shadow:0 10px 40px rgba(0,0,0,.06);transition:.5s var(--ease)}
.member:hover{transform:translateY(-8px);box-shadow:0 24px 50px rgba(0,0,0,.12)}
.av{width:96px;height:96px;margin:0 auto 20px;border-radius:50%;background:var(--ink);color:var(--gold);display:grid;place-items:center;font-family:var(--serif);font-size:40px;border:3px solid var(--gold)}
.member h3{font-family:var(--serif);font-size:19px;margin-bottom:4px}
.member span{color:var(--muted);font-size:14px}

/* Projects page */
.center-f{justify-content:center;margin-bottom:50px}

/* Footer (multi-column) */
.footer{text-align:left;padding:80px 0 0}
.fgrid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.3fr;gap:50px;padding-bottom:60px}
.fgrid h5{color:#fff;font-family:var(--serif);font-size:18px;font-weight:600;margin-bottom:18px}
.fgrid a,.fgrid span{display:block;padding:5px 0;font-size:14.5px;transition:.3s}
.fgrid div>a:hover{color:var(--gold);padding-left:6px}
.fabout{margin-top:18px;font-size:14.5px;max-width:320px}
.fbottom{border-top:1px solid rgba(255,255,255,.1);padding:24px 0;text-align:center}

@media(max-width:1000px){
  .svc{grid-template-columns:1fr;gap:34px}
  .svc.rev .svc-img{order:0}
  .svc-img img{height:360px}
  .team,.stats-strip .container{grid-template-columns:repeat(2,1fr);gap:30px}
  .fgrid{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .page-hero{padding:150px 0 70px}
  .team,.stats-strip .container,.fgrid{grid-template-columns:1fr}
  .svc-img img{height:280px}
}

/* Longer brand name */
@media(max-width:1100px){.logo{font-size:17px}}
@media(max-width:520px){.logo{font-size:14px;gap:8px}.logo-mark{width:32px;height:32px;font-size:17px}}

/* Testimonial slider */
.rating{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:6px}
.rating .stars{color:var(--gold);letter-spacing:3px;font-size:20px;margin:0}
.rating b{font-family:var(--serif);font-size:26px;color:#fff}
.rating small{color:rgba(255,255,255,.6);font-size:14px}
.tslider{max-width:860px;margin:0 auto;overflow:hidden}
.ttrack{display:flex;transition:transform .8s var(--ease)}
.tslide{min-width:100%;padding:10px 30px 30px;text-align:center;position:relative}
.qmark{font-family:var(--serif);font-size:120px;line-height:.6;color:var(--gold);opacity:.35;height:60px}
.tslide blockquote{background:none;box-shadow:none;border:0;padding:0;font-family:var(--serif);font-size:clamp(20px,2.6vw,29px);line-height:1.5;font-style:italic;color:#fff;margin-bottom:34px}
.tslide blockquote:hover{transform:none;box-shadow:none}
.tslide figcaption{display:flex;align-items:center;justify-content:center;gap:16px;text-align:left}
.av2{width:56px;height:56px;border-radius:50%;background:var(--gold);color:var(--ink);display:grid;place-items:center;font-weight:600;font-size:16px;letter-spacing:1px}
.tslide figcaption b{display:block;font-family:var(--serif);font-size:19px;color:#fff}
.tslide figcaption small{color:rgba(255,255,255,.6);font-size:13.5px}
.tcontrols{display:flex;align-items:center;justify-content:center;gap:22px;margin-top:14px}
.tbtn{width:46px;height:46px;border-radius:50%;background:none;border:1px solid rgba(255,255,255,.3);color:#fff;font-size:18px;cursor:pointer;transition:.3s}
.tbtn:hover{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.tdots{display:flex;gap:10px}
.tdots button{width:10px;height:10px;border-radius:50%;border:0;background:rgba(255,255,255,.3);cursor:pointer;padding:0;transition:.4s}
.tdots button.on{background:var(--gold);width:30px;border-radius:6px}

/* FAQ */
.faq-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;align-items:start}
.faq-intro{position:sticky;top:110px}
.faq-intro>p:not(.eyebrow){color:var(--muted);margin-bottom:28px;font-size:17px}
.faq-item{border-bottom:1px solid rgba(0,0,0,.12)}
.faq-item:first-child{border-top:1px solid rgba(0,0,0,.12)}
.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:24px;background:none;border:0;padding:24px 0;text-align:left;cursor:pointer;font:500 18px/1.4 var(--serif);color:var(--ink);transition:color .3s}
.faq-q:hover,.faq-item.open .faq-q{color:#a9822f}
.faq-q i{flex-shrink:0;width:34px;height:34px;border:1px solid rgba(0,0,0,.2);border-radius:50%;position:relative;transition:.4s var(--ease)}
.faq-q i::before,.faq-q i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;background:currentColor;translate:-50% -50%;transition:.4s var(--ease)}
.faq-q i::after{rotate:90deg}
.faq-item.open .faq-q i{background:var(--gold);border-color:var(--gold);color:var(--ink);rotate:180deg}
.faq-item.open .faq-q i::after{rotate:0deg;opacity:0}
.faq-a{max-height:0;overflow:hidden;transition:max-height .5s var(--ease)}
.faq-a p{padding:0 60px 26px 0;color:var(--muted);font-size:16.5px}

@media(max-width:900px){.faq-wrap{grid-template-columns:1fr;gap:40px}.faq-intro{position:static}}
@media(max-width:640px){.tslide{padding:10px 6px 24px}.faq-q{font-size:16.5px}.faq-a p{padding-right:10px}}

/* Mobile header: stack the long brand name on two lines so it never overflows */
@media(max-width:520px){
  .nav{padding-left:16px;padding-right:16px}
  .logo{font-size:15px;line-height:1.1;gap:10px}
  .logo b{display:block;font-size:11.5px;letter-spacing:2.5px;text-transform:uppercase;margin-top:2px}
}

/* Never allow sideways scrolling; slide-ins on phones move vertically instead */
html,body{overflow-x:clip}
@media(max-width:820px){
  .reveal-left,.reveal-right{transform:translateY(40px)}
  .reveal-left.in,.reveal-right.in{transform:none}
}

/* Header background on its own layer: backdrop-filter on .nav itself would trap the fixed mobile menu inside the header */
.nav.scrolled{background:none;backdrop-filter:none;box-shadow:none}
.nav::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(15,17,19,.92);backdrop-filter:blur(14px);box-shadow:0 8px 30px rgba(0,0,0,.25);opacity:0;transition:opacity .4s}
.nav.scrolled::before{opacity:1}

/* Touch targets: at least ~44px tall on phones */
.burger::before,.tdots button::before,.crumbs a::before{content:"";position:absolute;inset:-10px}
.tdots button{position:relative}
.crumbs a{position:relative}
@media(max-width:820px){
  .fgrid a,.fgrid span{padding:12px 0}
  .fgrid div>a:hover{padding-left:0}
  .fgrid .logo{padding:0}
  .fbottom small{display:block;padding-bottom:70px} /* clear the floating call button */
  .tbtn{width:48px;height:48px}
  .tdots button::before{inset:-16px -8px}
  .filters button,.chip{padding:12px 20px}
  .fab{width:48px;height:48px;right:14px;bottom:14px;opacity:.95}
  .fab svg{width:21px;height:21px}
}
/* Hide the call button while the mobile menu is open */
body:has(.menu.open) .fab{opacity:0;pointer-events:none}

@media(max-width:820px){
  .menu a:not(.btn){padding:12px 24px}
  .filters .chip,.filters button{padding:13px 20px;min-height:44px}
  .info a{display:inline-block;padding:10px 0}
  .info li{padding:6px 0}
}

/* WhatsApp chat button (stacked above the call button) */
.fab.wa{bottom:90px;background:#25d366;animation:pulseWa 2.4s infinite}
.fab.wa svg{fill:#fff;stroke:none;width:30px;height:30px}
.fab.wa:hover{background:#1ebe5b}
@keyframes pulseWa{0%{box-shadow:0 0 0 0 rgba(37,211,102,.55)}70%{box-shadow:0 0 0 18px rgba(37,211,102,0)}100%{box-shadow:0 0 0 0 rgba(37,211,102,0)}}
@media(max-width:820px){
  .fab.wa{bottom:74px}
  .fab.wa svg{width:26px;height:26px}
  .fbottom small{padding-bottom:130px}
}

/* Service areas + map */
.hero-areas{display:flex;align-items:center;gap:10px;margin-top:34px;color:rgba(255,255,255,.85);font-size:14px;letter-spacing:1px;text-transform:uppercase}
.hero-areas svg{width:20px;height:20px;fill:none;stroke:var(--gold);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.areas-lead{color:var(--muted);max-width:560px;font-size:17px}
@media(max-width:640px){.hero-areas{font-size:12.5px;margin-top:26px}}

/* Service area cards (no map) */
.area-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.area-card{background:#fff;padding:40px 34px;text-align:center;box-shadow:0 10px 40px rgba(0,0,0,.06);border-top:3px solid var(--gold);transition:.5s var(--ease)}
.area-card:hover{transform:translateY(-8px);box-shadow:0 24px 50px rgba(0,0,0,.12)}
.area-card .pin{width:58px;height:58px;margin:0 auto 20px;border:1px solid rgba(201,164,92,.5);border-radius:50%;display:grid;place-items:center}
.area-card .pin svg{width:26px;height:26px;fill:none;stroke:#a9822f;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.area-card h3{font-family:var(--serif);font-size:26px;margin-bottom:8px}
.area-card p{color:var(--muted);font-size:15.5px}
.areas-note{text-align:center;margin-top:36px}
@media(max-width:900px){.area-cards{grid-template-columns:1fr}}
.areas-note{color:var(--muted);font-size:15px}
.areas-note a{color:#a9822f;text-decoration:underline}

/* Four service-area cards with office address */
.area-cards{grid-template-columns:repeat(4,1fr);gap:22px}
.area-card{padding:36px 26px}
.area-card small{display:block;margin-top:16px;padding-top:14px;border-top:1px solid rgba(0,0,0,.1);color:#7a6a45;font-size:13px;line-height:1.5}
@media(max-width:1000px){.area-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.area-cards{grid-template-columns:1fr}}

/* Individual service pages */
.section.tight{padding-top:0}
.section.tight-y{padding:90px 0}
.other-svc{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.other-svc a{display:flex;flex-direction:column;gap:6px;padding:28px 28px 24px;border:1px solid var(--line);background:var(--ink2);transition:.4s var(--ease)}
.other-svc a:hover{border-color:var(--gold);transform:translateY(-6px);background:var(--ink3)}
.other-svc span{font-family:var(--serif);font-size:21px;color:#fff}
.other-svc small{color:rgba(255,255,255,.6);font-size:14px;line-height:1.5;flex:1}
.other-svc em{font-style:normal;color:var(--gold);font-size:13px;letter-spacing:1px;text-transform:uppercase;margin-top:10px}
.blog-link{text-align:center;margin-top:40px;color:rgba(255,255,255,.65)}
.blog-link a{color:var(--gold);text-decoration:underline}
.btn-outline{border-color:var(--ink);color:var(--ink);margin-left:12px}
.btn-outline:hover{background:var(--ink);color:#fff;transform:translateY(-3px)}
.svc-txt .btn+.btn{margin-top:10px}
@media(max-width:1000px){.other-svc{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.other-svc{grid-template-columns:1fr}.btn-outline{margin-left:0}}