:root {
  --navy:#0f1923; --navy-2:#172331; --navy-3:#213244;
  --gold:#c9a84c; --gold-2:#aa8735; --gold-soft:#f4ecd5;
  --ink:#162535; --text:#526172; --muted:#8794a3;
  --paper:#f5f6f7; --white:#fff; --line:#e2e7eb;
  --success:#297b55; --shadow:0 18px 60px rgba(15,25,35,.10);
  --max:1240px; --ease:cubic-bezier(.2,.75,.25,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"DM Sans",sans-serif;color:var(--ink);background:var(--paper);line-height:1.6;overflow-x:hidden}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
img{display:block;max-width:100%}
.container{width:min(var(--max),calc(100% - 48px));margin:auto}
.eyebrow{display:flex;align-items:center;gap:11px;color:var(--gold-2);font:700 11px/1 "Manrope",sans-serif;letter-spacing:.17em;text-transform:uppercase;margin-bottom:18px}
.eyebrow:before{content:"";width:28px;height:2px;background:currentColor}
.display{font:700 clamp(42px,6.4vw,86px)/.98 "Manrope",sans-serif;letter-spacing:-.055em}
.section-title{font:700 clamp(32px,4vw,54px)/1.06 "Manrope",sans-serif;letter-spacing:-.04em}
.lead{font-size:18px;line-height:1.75;color:var(--text)}
.btn{min-height:48px;padding:0 21px;border:1px solid transparent;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;gap:10px;font-weight:700;font-size:13px;transition:.25s var(--ease)}
.btn svg{transition:transform .25s var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.btn-gold{background:var(--gold);color:var(--navy)}
.btn-gold:hover{background:#d5b65f;transform:translateY(-2px)}
.btn-dark{background:var(--navy);color:#fff}
.btn-dark:hover{background:var(--navy-3);transform:translateY(-2px)}
.btn-outline{border-color:rgba(255,255,255,.34);color:#fff;background:rgba(255,255,255,.04);backdrop-filter:blur(8px)}
.btn-outline:hover{background:#fff;color:var(--navy)}
.arrow{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}

/* Header */
.site-header{height:78px;background:transparent;border-bottom:1px solid transparent;display:flex;align-items:center;position:fixed;z-index:1000;top:0;left:0;right:0;transition:height .3s,background .3s,border-color .3s,box-shadow .3s}
.site-header.scrolled{height:68px;background:rgba(15,25,35,.96);border-bottom-color:rgba(255,255,255,.08);box-shadow:0 10px 30px rgba(0,0,0,.16);backdrop-filter:blur(14px)}
.nav-wrap{display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:12px;color:#fff}.brand-text{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0}
.brand-mark{width:38px;height:38px;border-radius:8px;background:var(--gold);display:grid;place-items:center;color:var(--navy)}
.brand-mark svg{width:20px;height:20px}
.brand-logo-mark{width:282px;height:64px;overflow:hidden;padding:0;border-radius:0;background:transparent url("../../../assets/Shake_Mining_Logo-removebg-preview.png") center/cover no-repeat;filter:drop-shadow(0 2px 8px rgba(0,0,0,.55))}
.brand-logo-mark img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;opacity:0}
.brand-name{display:block;font:800 14px/1.1 "Manrope",sans-serif;letter-spacing:.02em;white-space:nowrap;color:#fff}
.brand-sub{display:block;font-size:9px;line-height:1;letter-spacing:.17em;text-transform:uppercase;color:rgba(255,255,255,.72);white-space:nowrap}
.nav-links{display:flex;align-items:center;gap:31px}
.nav-link{border:0;background:none;color:rgba(255,255,255,.67);font-size:13px;font-weight:600;position:relative;padding:26px 0}
.nav-link:after{content:"";position:absolute;left:0;right:100%;bottom:18px;height:2px;background:var(--gold);transition:.25s}
.nav-link:hover,.nav-link.active{color:#fff}
.nav-link.active:after,.nav-link:hover:after{right:0}
.nav-actions{display:flex;align-items:center;gap:12px}
.nav-actions .btn{min-height:42px}
.menu-btn{display:none;width:42px;height:42px;border:1px solid rgba(255,255,255,.18);background:transparent;border-radius:7px;color:#fff}

/* Page routing */
.page{display:none;animation:pageIn .45s var(--ease)}
.page.active{display:block}
@keyframes pageIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}

/* Home hero */
.hero{min-height:760px;height:100svh;position:relative;color:#fff;display:flex;align-items:center;overflow:hidden;background:var(--navy)}
.hero-media{position:absolute;inset:0;z-index:0;background:url("../images/shake-mining-hero.png") center/cover no-repeat;transform:scale(1.02)}
.hero:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,12,18,.82) 0%,rgba(6,12,18,.62) 34%,rgba(6,12,18,.22) 58%,rgba(6,12,18,.05) 78%),linear-gradient(0deg,rgba(10,18,26,.58),transparent 52%)}
.hero:after{content:"";position:absolute;inset:0;z-index:1;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(to right,#000,transparent 72%);pointer-events:none}
.hero-content{position:relative;z-index:2;width:min(760px,calc(100% - 48px));margin-left:max(24px,calc((100vw - var(--max)) / 2));margin-right:auto;padding-top:0;transform:translateY(-34px)}
.hero .eyebrow{color:var(--gold)}
.hero h1 span{color:var(--gold)}
.hero-copy{max-width:620px;font-size:18px;color:rgba(255,255,255,.68);margin:27px 0 34px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.hero-proof{position:absolute;z-index:3;bottom:0;left:0;right:0;border-top:1px solid rgba(255,255,255,.12);background:rgba(12,20,29,.57);backdrop-filter:blur(12px)}
.proof-grid{display:grid;grid-template-columns:1.25fr repeat(3,1fr)}
.proof-intro,.proof-item{padding:22px 28px;border-right:1px solid rgba(255,255,255,.1)}
.proof-intro{padding-left:0;color:rgba(255,255,255,.48);font-size:11px;letter-spacing:.13em;text-transform:uppercase;display:flex;align-items:center}
.proof-number{font:700 26px/1 "Manrope";color:#fff}
.proof-label{font-size:11px;color:rgba(255,255,255,.48);margin-top:7px}
.worked-with-belt{background:var(--navy);border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1);overflow:hidden}
.worked-shell{display:grid;grid-template-columns:260px 1fr;align-items:stretch;min-height:94px}
.worked-heading{display:flex;align-items:center;padding:24px 32px 24px 0;border-right:1px solid rgba(255,255,255,.1);font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.48)}
.worked-marquee{position:relative;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.worked-track{display:flex;width:max-content;animation:workedLoop 28s linear infinite}
.worked-marquee:hover .worked-track{animation-play-state:paused}
.worked-item{min-width:230px;height:94px;display:flex;align-items:center;justify-content:center;padding:18px 30px;border-right:1px solid rgba(255,255,255,.1);color:#fff;font:700 18px/1.1 "Manrope";white-space:nowrap}
.worked-item img{max-width:150px;max-height:42px;object-fit:contain;filter:grayscale(1) brightness(3);opacity:.86}
@keyframes workedLoop{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:720px){.worked-shell{grid-template-columns:1fr}.worked-heading{min-height:64px;padding:20px 0;border-right:0;border-bottom:1px solid rgba(255,255,255,.1)}.worked-item{min-width:210px;height:82px;font-size:16px}}

/* General sections */
.section{padding:112px 0}
.section-white{background:#fff}
.section-dark{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.section-dark:before{content:"";position:absolute;width:520px;height:520px;border:1px solid rgba(201,168,76,.12);border-radius:50%;right:-170px;top:-220px;box-shadow:0 0 0 80px rgba(201,168,76,.025),0 0 0 160px rgba(201,168,76,.018)}
.split{display:grid;grid-template-columns:.88fr 1.12fr;gap:100px;align-items:start}
.intro-copy{max-width:590px}
.intro-copy p+p{margin-top:20px}
.signature{margin-top:34px;padding-top:24px;border-top:1px solid var(--line);display:flex;align-items:center;gap:14px}
.signature-mark{width:42px;height:42px;background:var(--navy);color:var(--gold);border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:12px}
.signature strong{display:block;font-size:13px}.signature span{font-size:11px;color:var(--muted)}
.feature-visual{min-height:520px;position:relative;background:linear-gradient(145deg,#162737,#263d50);border-radius:4px;overflow:hidden;box-shadow:var(--shadow)}
.feature-visual:before{content:"";position:absolute;inset:0;background:url("../images/shake-mining-hero.png") 72% center/cover;opacity:.64;mix-blend-mode:luminosity}
.feature-card{position:absolute;left:-38px;bottom:34px;background:#fff;width:260px;padding:27px;box-shadow:var(--shadow)}
.feature-card .num{font:800 46px/1 "Manrope";color:var(--gold-2)}
.feature-card p{font-size:12px;color:var(--text);margin-top:8px}
.grid-head{display:flex;justify-content:space-between;gap:50px;align-items:end;margin-bottom:48px}
.grid-head .section-title{max-width:700px}
.grid-head p{max-width:390px;color:var(--text)}

/* Services */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.service-card{background:#fff;padding:35px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-height:330px;display:flex;flex-direction:column;transition:.3s var(--ease);position:relative;overflow:hidden}
.service-card:before{content:"";position:absolute;left:0;top:0;width:3px;height:0;background:var(--gold);transition:.3s}
.service-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);z-index:2}
.service-card:hover:before{height:100%}
.service-index{font:700 10px "Manrope";letter-spacing:.14em;color:var(--gold-2);margin-bottom:40px}
.service-icon{width:46px;height:46px;border-radius:8px;background:var(--paper);display:grid;place-items:center;color:var(--navy);margin-bottom:22px}
.service-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6}
.service-card h3{font:700 20px/1.25 "Manrope";margin-bottom:13px}
.service-card p{font-size:13px;color:var(--text);flex:1}
.text-link{
  align-self:flex-start;
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:23px;
  padding:0 0 5px;
  border:0;
  border-bottom:1px solid var(--gold);
  background:transparent;
  color:var(--ink);
  font-size:12px;
  font-weight:700;
  line-height:1.2;
  transition:color .2s var(--ease),gap .2s var(--ease),border-color .2s var(--ease);
}
.text-link:hover{
  gap:12px;
  color:var(--gold-2);
  border-color:var(--gold-2);
}
.text-link .arrow{width:14px;height:14px}

/* Services showcase (image cards) */
.services-showcase{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.service-showcase-card{background:#fff;border:1px solid var(--line);overflow:hidden;display:flex;flex-direction:column;transition:.3s var(--ease);box-shadow:0 8px 30px rgba(15,25,35,.04)}
.service-showcase-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.service-showcase-media{height:192px;position:relative;overflow:hidden;background:linear-gradient(145deg,var(--navy-2),var(--navy-3))}
.service-showcase-media:before{content:"";position:absolute;inset:0;background:url("../images/shake-mining-hero.png") center/cover;transition:transform .5s var(--ease)}
.service-showcase-card:hover .service-showcase-media:before{transform:scale(1.05)}
.service-showcase-card:nth-child(2) .service-showcase-media:before{background-position:75% center}
.service-showcase-card:nth-child(3) .service-showcase-media:before{background-position:30% center;filter:brightness(.82)}
.service-showcase-card:nth-child(4) .service-showcase-media:before{background-position:60% 40%;filter:saturate(.75)}
.service-showcase-card:nth-child(5) .service-showcase-media:before{background-position:20% center;filter:contrast(1.05)}
.service-showcase-media:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,18,26,.78),rgba(10,18,26,.12))}
.service-showcase-num{position:absolute;left:16px;bottom:16px;z-index:2;font:700 11px "Manrope";letter-spacing:.14em;text-transform:uppercase;color:var(--gold);background:rgba(15,25,35,.82);padding:6px 10px;border-radius:4px}
.service-showcase-body{padding:28px 28px 0;flex:1;display:flex;flex-direction:column;gap:12px}
.service-showcase-body h3{font:700 20px/1.25 "Manrope";letter-spacing:-.02em;transition:color .2s var(--ease)}
.service-showcase-card:hover .service-showcase-body h3{color:var(--gold-2)}
.service-showcase-body p{font-size:13px;color:var(--text);line-height:1.65;flex:1}
.service-showcase-foot{padding:20px 28px 28px}

/* Detail prose */
.detail-prose{max-width:720px;margin-top:38px}
.detail-prose h3{font:700 22px/1.2 "Manrope";letter-spacing:-.025em;color:var(--ink);margin:36px 0 16px}
.detail-prose h3:first-child{margin-top:0}
.detail-prose p{font-size:17px;line-height:1.75;color:var(--text);margin-bottom:18px}
.detail-prose p:last-child{margin-bottom:0}
.detail-prose p strong{color:var(--ink);font-weight:700}

/* Advantage */
.advantage-grid{display:grid;grid-template-columns:1fr 1fr;gap:84px;align-items:center;position:relative}
.dark-copy p{color:rgba(255,255,255,.61);margin-top:22px}
.advantage-list{margin-top:38px}
.advantage-item{display:grid;grid-template-columns:52px 1fr;gap:19px;padding:22px 0;border-top:1px solid rgba(255,255,255,.1)}
.advantage-item .number{font:700 11px "Manrope";color:var(--gold)}
.advantage-item h3{font:700 16px "Manrope";margin-bottom:6px}
.advantage-item p{margin:0;font-size:13px}
.metric-panel{display:grid;grid-template-columns:1fr 1fr;background:var(--navy-2);border:1px solid rgba(255,255,255,.09)}
.metric{padding:37px;border-right:1px solid rgba(255,255,255,.09);border-bottom:1px solid rgba(255,255,255,.09)}
.metric:nth-child(even){border-right:0}.metric:nth-last-child(-n+2){border-bottom:0}
.metric strong{display:block;font:700 40px/1 "Manrope";color:var(--gold)}
.metric span{display:block;font-size:12px;color:rgba(255,255,255,.53);margin-top:10px}

/* Projects */
.project-grid{display:grid;grid-template-columns:1.25fr .75fr;grid-template-rows:340px 340px;gap:16px}
.project-card{position:relative;overflow:hidden;background:#203142;color:#fff;cursor:pointer}
.project-card:first-child{grid-row:span 2}
.project-image{position:absolute;inset:0;background-image:linear-gradient(0deg,rgba(10,18,26,.9),transparent 70%),url("../images/shake-mining-hero.png");background-size:cover;background-position:center;transition:.6s var(--ease)}
.project-card:nth-child(2) .project-image{background-position:80% center;filter:saturate(.65)}
.project-card:nth-child(3) .project-image{background-position:30% center;filter:contrast(1.08) brightness(.78)}
.project-card:hover .project-image{transform:scale(1.045)}
.project-info{position:absolute;left:0;right:0;bottom:0;padding:28px;z-index:2}
.project-type{font:700 10px "Manrope";letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:10px}
.project-info h3{font:700 clamp(19px,2vw,29px)/1.15 "Manrope";max-width:530px}
.project-info p{font-size:12px;color:rgba(255,255,255,.62);margin-top:8px}

/* CTA */
.cta{padding:78px 0;background:var(--gold)}
.cta-inner{display:flex;justify-content:space-between;align-items:center;gap:40px}
.cta h2{font:700 clamp(30px,4vw,48px)/1.05 "Manrope";letter-spacing:-.04em;max-width:780px;color:var(--navy)}
.cta p{font-size:13px;margin-top:13px;color:rgba(15,25,35,.7)}

/* Internal pages */
.page-hero{padding:190px 0 92px;color:#fff;background:var(--navy);position:relative;overflow:hidden}
.page-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,25,35,.97),rgba(15,25,35,.78)),url("../images/shake-mining-hero.png") center 58%/cover;opacity:.88}
.page-hero:after{content:"";position:absolute;right:6%;top:30%;width:280px;height:280px;border:1px solid rgba(201,168,76,.2);transform:rotate(45deg)}
.page-hero .container{position:relative;z-index:2}
.breadcrumb{font-size:11px;color:rgba(255,255,255,.48);margin-bottom:26px}.breadcrumb span{color:var(--gold);margin:0 8px}
.page-hero h1{font:700 clamp(42px,6vw,72px)/1 "Manrope";letter-spacing:-.05em;max-width:820px}
.page-hero p{max-width:650px;color:rgba(255,255,255,.64);font-size:17px;margin-top:22px}
.values-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:54px;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.value{padding:30px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff}
.value span{font:700 10px "Manrope";color:var(--gold-2);letter-spacing:.13em}
.value h3{font:700 17px "Manrope";margin:26px 0 10px}.value p{font-size:12px;color:var(--text)}
.timeline{margin-top:50px;border-left:1px solid var(--line)}
.timeline-row{display:grid;grid-template-columns:120px 1fr;gap:35px;padding:0 0 38px 34px;position:relative}
.timeline-row:before{content:"";width:9px;height:9px;border-radius:50%;background:var(--gold);position:absolute;left:-5px;top:8px}
.timeline-row strong{font:700 13px "Manrope";color:var(--gold-2)}
.timeline-row h3{font:700 19px "Manrope";margin-bottom:8px}.timeline-row p{font-size:13px;color:var(--text)}

.service-detail{display:grid;grid-template-columns:88px 1fr 1fr;gap:35px;padding:40px 0;border-top:1px solid var(--line);align-items:start}
.service-detail:last-child{border-bottom:1px solid var(--line)}
.detail-num{font:700 12px "Manrope";color:var(--gold-2)}
.service-detail h2{font:700 25px/1.2 "Manrope";letter-spacing:-.025em}
.service-detail p{font-size:13px;color:var(--text);margin-bottom:14px}
.bullet-list{display:grid;grid-template-columns:1fr 1fr;gap:9px 22px;list-style:none}
.bullet-list li{font-size:12px;color:var(--text);padding-left:15px;position:relative}
.bullet-list li:before{content:"";width:5px;height:5px;background:var(--gold);position:absolute;left:0;top:8px}

.project-list{display:grid;gap:22px}
.project-row{display:grid;grid-template-columns:330px 1fr;background:#fff;border:1px solid var(--line);min-height:260px;transition:.25s}
.project-row:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.project-thumb{background:url("../images/shake-mining-hero.png") center/cover;min-height:260px}
.project-row:nth-child(2) .project-thumb{background-position:75% center;filter:saturate(.7)}
.project-row:nth-child(3) .project-thumb{background-position:30% center;filter:brightness(.75)}
.project-body{padding:38px;display:flex;flex-direction:column;justify-content:center}
.project-meta{display:flex;gap:20px;color:var(--gold-2);font:700 10px "Manrope";letter-spacing:.1em;text-transform:uppercase;margin-bottom:15px}
.project-body h2,.project-body h3{font:700 27px/1.15 "Manrope";letter-spacing:-.03em}.project-body p{font-size:13px;color:var(--text);margin-top:12px;max-width:650px}
.project-body .text-link{margin-top:18px}

/* Team */
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.team-card{background:#fff;border:1px solid var(--line);display:flex;flex-direction:column;transition:.3s var(--ease);overflow:hidden}
.team-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.team-photo{aspect-ratio:1.05;background:linear-gradient(145deg,var(--navy-2),var(--navy-3));display:grid;place-items:center;position:relative;overflow:hidden}
.team-photo:before{content:"";position:absolute;inset:0;background:url("../images/shake-mining-hero.png") center/cover;opacity:.22;mix-blend-mode:luminosity}
.team-photo span{position:relative;z-index:1;font:800 clamp(38px,5vw,52px)/1 "Manrope";color:var(--gold);letter-spacing:-.04em}
.team-body{padding:28px 28px 32px;flex:1;display:flex;flex-direction:column}
.team-body h3{font:700 19px/1.2 "Manrope";letter-spacing:-.02em}
.team-role{display:block;font:700 10px "Manrope";letter-spacing:.12em;text-transform:uppercase;color:var(--gold-2);margin:8px 0 14px}
.team-body p{font-size:13px;color:var(--text);flex:1;line-height:1.65}

/* Detail pages */
.detail-back{display:inline-flex;align-items:center;gap:8px;border:0;background:none;color:rgba(255,255,255,.58);font-size:12px;font-weight:700;margin-bottom:22px;padding:0;transition:color .2s var(--ease),gap .2s var(--ease)}
.detail-back:hover{color:#fff;gap:12px}
.detail-back .arrow{width:14px;height:14px;transform:rotate(180deg)}
.detail-layout{display:grid;grid-template-columns:1fr 300px;gap:70px;align-items:start}
.detail-main{min-width:0}
.detail-sidebar{position:sticky;top:98px}
.detail-panel{background:#fff;border:1px solid var(--line);padding:28px}
.detail-panel+.detail-panel{margin-top:18px}
.detail-panel h4{font:700 11px "Manrope";letter-spacing:.12em;text-transform:uppercase;color:var(--gold-2);margin-bottom:16px}
.detail-panel ul{list-style:none;display:grid;gap:10px}
.detail-panel li{font-size:12px;color:var(--text)}
.detail-panel li a,.sidebar-link{border:0;background:none;padding:0;text-align:left;font-size:12px;font-weight:600;color:var(--ink);display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;transition:color .2s}
.detail-panel li a:hover,.sidebar-link:hover{color:var(--gold-2)}
.detail-panel li a svg,.sidebar-link svg{width:14px;height:14px;flex-shrink:0}
.detail-intro{font-size:17px;line-height:1.75;color:var(--text);margin-bottom:34px;max-width:720px}
.detail-block{padding:34px 0;border-top:1px solid var(--line)}
.detail-block h3{font:700 22px/1.2 "Manrope";letter-spacing:-.025em;margin-bottom:14px}
.detail-block p{font-size:13px;color:var(--text);margin-bottom:12px;max-width:720px}
.detail-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:38px 0 10px}
.detail-stat{background:var(--paper);border:1px solid var(--line);padding:24px}
.detail-stat strong{display:block;font:700 28px/1 "Manrope";color:var(--navy);letter-spacing:-.03em}
.detail-stat span{display:block;font-size:11px;color:var(--muted);margin-top:8px;line-height:1.45}
.detail-visual{min-height:360px;border-radius:4px;background:linear-gradient(145deg,var(--navy-2),var(--navy-3));position:relative;overflow:hidden;margin-bottom:38px}
.detail-visual:before{content:"";position:absolute;inset:0;background:url("../images/shake-mining-hero.png") center/cover;opacity:.55}
.detail-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,18,26,.82),rgba(10,18,26,.18))}
.detail-visual-caption{position:absolute;left:28px;right:28px;bottom:28px;z-index:2;color:#fff}
.detail-visual-caption span{font:700 10px "Manrope";letter-spacing:.14em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:8px}
.detail-visual-caption h3{font:700 clamp(22px,3vw,32px)/1.12 "Manrope";letter-spacing:-.03em;max-width:560px}
.outcome-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:22px}
.outcome-card{background:var(--paper);border:1px solid var(--line);padding:22px}
.outcome-card strong{display:block;font:700 14px "Manrope";margin-bottom:7px;color:var(--ink)}
.outcome-card p{margin:0;font-size:12px;color:var(--text);line-height:1.6}
.project-detail-meta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.project-detail-meta span{font:700 10px "Manrope";letter-spacing:.12em;text-transform:uppercase;color:var(--gold);background:rgba(201,168,76,.12);border:1px solid rgba(201,168,76,.24);padding:8px 12px;border-radius:999px}

/* Contact */
.contact-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:74px}
.contact-details{margin-top:38px}
.contact-item{padding:22px 0;border-top:1px solid var(--line)}
.contact-item span{display:block;font:700 10px "Manrope";letter-spacing:.12em;text-transform:uppercase;color:var(--gold-2);margin-bottom:7px}
.contact-item strong{font-size:15px}
.contact-form{background:#fff;border:1px solid var(--line);padding:40px;box-shadow:var(--shadow)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.field{display:grid;gap:7px}.field.full{grid-column:1/-1}
.field label{font-size:11px;font-weight:700;color:var(--text)}
.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);background:#fafbfc;border-radius:6px;padding:13px 14px;color:var(--ink);outline:none;transition:.2s}
.field textarea{height:140px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,168,76,.13);background:#fff}
.form-note{font-size:10px;color:var(--muted);margin:15px 0}

/* Footer */
.site-footer{background:#0b131b;color:#fff;padding:70px 0 0}
.footer-grid{display:grid;grid-template-columns:1.4fr .65fr .65fr .9fr;gap:60px;padding-bottom:55px}
.footer-about{max-width:350px}.footer-about p{font-size:12px;color:rgba(255,255,255,.47);margin-top:18px}
.footer-title{font:700 11px "Manrope";letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin-bottom:20px}
.footer-links{display:grid;gap:11px}.footer-links button,.footer-links a{border:0;background:none;color:rgba(255,255,255,.56);font-size:12px;text-align:left}.footer-links button:hover,.footer-links a:hover{color:#fff}
.footer-contact{font-size:12px;color:rgba(255,255,255,.56)}.footer-contact p+p{margin-top:10px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding:18px 0;display:flex;justify-content:space-between;color:rgba(255,255,255,.32);font-size:10px}

.reveal{opacity:0;transform:translateY(24px);transition:.7s var(--ease)}
.reveal.visible{opacity:1;transform:none}

@media(max-width:1200px){
  .site-header .nav-actions{display:flex!important;align-items:center;justify-content:flex-end;margin-left:auto}
  .site-header .nav-actions>.btn{display:none!important}
  .site-header .menu-btn{display:grid!important;place-items:center;position:fixed;right:16px;top:18px;z-index:7000;width:42px;height:42px;border:0;border-radius:10px;background:var(--gold);color:var(--navy);box-shadow:0 10px 24px rgba(0,0,0,.22)}
  .site-header .nav-links{position:fixed;inset:68px 10px auto 10px;max-height:calc(100svh - 84px);background:rgba(15,25,35,.98);display:none;flex-direction:column;align-items:stretch;padding:16px 10px 14px;gap:0;border:1px solid rgba(255,255,255,.08);border-radius:0 0 8px 8px;box-shadow:0 24px 60px rgba(0,0,0,.34);overflow-y:auto;backdrop-filter:blur(14px)}
  .site-header .nav-links.open{display:flex}
}

@media(max-width:1000px){
  .nav-links{position:fixed;inset:68px 0 0;background:var(--navy);display:none;flex-direction:column;align-items:stretch;padding:28px 24px;gap:0}
  .nav-links.open{display:flex}.nav-link{text-align:left;padding:17px 0;border-bottom:1px solid rgba(255,255,255,.08)}.nav-link:after{display:none}
  .menu-btn{display:grid;place-items:center;position:fixed;right:16px;top:18px;z-index:7000;width:42px;height:42px;border:0;border-radius:10px;background:var(--gold);color:var(--navy);box-shadow:0 10px 24px rgba(0,0,0,.22)}.nav-actions>.btn{display:none}
  .split,.advantage-grid,.contact-grid{grid-template-columns:1fr;gap:55px}
  .feature-visual{margin-left:38px}.services-grid,.services-showcase{grid-template-columns:1fr 1fr}
  .proof-grid{grid-template-columns:repeat(3,1fr)}.proof-intro{display:none}
  .project-grid{grid-template-columns:1fr 1fr;grid-template-rows:480px 300px}.project-card:first-child{grid-column:1/-1;grid-row:auto}
  .values-grid{grid-template-columns:1fr 1fr}.team-grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1.3fr 1fr 1fr}.footer-grid>div:last-child{grid-column:1/-1}
  .detail-stats{grid-template-columns:repeat(3,1fr)}.outcome-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  .container{width:min(100% - 32px,var(--max))}.hero-content{width:min(100% - 32px,760px);margin-left:16px;transform:translateY(-18px)}.section{padding:78px 0}
  .hero{min-height:780px;height:auto;padding:135px 0 180px}.hero:before{background:linear-gradient(90deg,rgba(10,18,26,.94),rgba(10,18,26,.68))}
  .display{font-size:48px}.hero-copy{font-size:15px}.hero-actions{display:grid}.hero-actions .btn{width:100%}
  .proof-grid{grid-template-columns:repeat(3,1fr)}.proof-item{padding:17px 10px}.proof-number{font-size:20px}.proof-label{font-size:9px}
  .grid-head{display:block}.grid-head p{margin-top:20px}.services-grid,.services-showcase{grid-template-columns:1fr}
  .metric-panel{grid-template-columns:1fr 1fr}.metric{padding:25px}.metric strong{font-size:31px}
  .project-grid{display:grid;grid-template-columns:1fr;grid-template-rows:repeat(3,330px)}.project-card:first-child{grid-column:auto}
  .cta-inner{display:block}.cta .btn{margin-top:26px;width:100%}
  .values-grid{grid-template-columns:1fr}.service-detail{grid-template-columns:45px 1fr}.service-detail>div:last-child{grid-column:2}.bullet-list{grid-template-columns:1fr}
  .project-row{grid-template-columns:1fr}.project-thumb{min-height:220px}.project-body{padding:28px}
  .team-grid{grid-template-columns:1fr}.detail-layout{grid-template-columns:1fr;gap:40px}.detail-sidebar{position:static}.detail-stats,.outcome-grid{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}.contact-form{padding:25px}.field.full{grid-column:auto}
  .footer-grid{grid-template-columns:1fr 1fr;gap:38px}.footer-grid>div:first-child,.footer-grid>div:last-child{grid-column:1/-1}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:4px}
  .page-hero{padding:150px 0 70px}.page-hero:after{display:none}
}
/* PHP public-site additions */
a.btn, a.nav-link, a.text-link, a.sidebar-link, a.detail-back { text-decoration:none; }
button.brand, a.brand { color:inherit; text-decoration:none; }
.nav-link { display:inline-flex; align-items:center; }
.page { display:block; }
.public-content img { max-width:100%; height:auto; border-radius:18px; margin:18px 0; }
.public-content h2, .public-content h3 { color:var(--navy); margin:28px 0 12px; }
.public-content p { color:var(--text); line-height:1.8; margin:0 0 16px; }
.form-status { margin-top:14px; color:var(--muted); font-size:13px; }
.empty-state { padding:38px; border:1px dashed var(--line); background:#fff; color:var(--text); }
.service-icon svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.team-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.project-image.has-image, .service-showcase-media.has-image, .project-thumb.has-image, .detail-visual.has-image { background-size:cover; background-position:center; }
.project-image.has-image::before, .service-showcase-media.has-image::before, .project-thumb.has-image::before, .detail-visual.has-image::before { display:none; }
/* Project public-page fixes */
.project-body .text-link { margin-top:18px; color:var(--navy); align-self:flex-start; }
.project-body .text-link:hover { color:var(--gold-2); }
.project-body .text-link .arrow { stroke:currentColor; }
.detail-prose.public-content { max-width:760px; font-size:17px; }
.detail-prose.public-content p { font-size:17px; line-height:1.8; }
.detail-prose.public-content img { display:block; width:100%; max-height:520px; object-fit:cover; border-radius:18px; margin:24px 0 22px; }
.detail-prose.public-content p:empty { display:none; }
/* Align public PHP pages with all-in-one detail/contact/footer design */
.detail-prose.public-content,
.detail-prose.public-content * { font-family:"DM Sans",sans-serif; }
.detail-prose.public-content { max-width:720px; margin-top:38px; }
.detail-prose.public-content p,
.detail-prose.public-content li { font-size:17px; line-height:1.75; color:var(--text); margin-bottom:18px; }
.detail-prose.public-content h2,
.detail-prose.public-content h3 { font:700 22px/1.2 "Manrope",sans-serif; letter-spacing:-.025em; color:var(--ink); margin:36px 0 16px; }
.detail-prose.public-content h2:first-child,
.detail-prose.public-content h3:first-child { margin-top:0; }
.detail-prose.public-content strong { color:var(--ink); font-weight:700; }
.contact-grid .lead { max-width:520px; }
.form-note { font-size:11px; color:var(--muted); margin:18px 0; line-height:1.6; }
.site-footer .brand { align-items:center; }
.site-footer .brand-name { color:#fff; }
.site-footer .brand-sub { color:rgba(255,255,255,.43); }
.footer-brand-logo{display:inline-flex;margin-bottom:18px}
.site-footer .footer-brand-logo .brand-logo-mark{width:282px;height:64px}
.footer-links span { color:rgba(255,255,255,.36); font-size:12px; }
/* Homepage testimonials */
.testimonials-section{background:var(--paper);position:relative;overflow:hidden}
.testimonials-section:before{content:"";position:absolute;right:-220px;top:-260px;width:520px;height:520px;border:1px solid rgba(201,168,76,.16);border-radius:50%;box-shadow:0 0 0 80px rgba(201,168,76,.035),0 0 0 160px rgba(201,168,76,.02)}
.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;position:relative}
.testimonial-card{background:#fff;border:1px solid var(--line);padding:34px;min-height:330px;display:flex;flex-direction:column;box-shadow:0 8px 30px rgba(15,25,35,.04);transition:.3s var(--ease);position:relative;overflow:hidden}
.testimonial-card:before{content:"";position:absolute;left:0;top:0;width:3px;height:0;background:var(--gold);transition:.3s var(--ease)}
.testimonial-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.testimonial-card:hover:before{height:100%}
.testimonial-mark{font:800 62px/1 "Manrope",sans-serif;color:var(--gold);height:42px;margin-bottom:18px}
.testimonial-quote{font-size:16px;line-height:1.75;color:var(--text);margin-bottom:22px;flex:1}
.testimonial-rating{font-size:13px;letter-spacing:.08em;color:var(--gold-2);margin-bottom:22px}
.testimonial-author{display:flex;align-items:center;gap:14px;padding-top:20px;border-top:1px solid var(--line)}
.testimonial-avatar{width:46px;height:46px;border-radius:50%;background:var(--navy);color:var(--gold);display:grid;place-items:center;overflow:hidden;font:800 12px "Manrope",sans-serif;flex:0 0 auto}
.testimonial-avatar img{width:100%;height:100%;object-fit:cover}
.testimonial-author strong{display:block;font:700 14px/1.2 "Manrope",sans-serif;color:var(--ink)}
.testimonial-author span{display:block;font-size:11px;color:var(--muted);margin-top:5px}
.testimonial-card-featured{grid-column:span 2;background:var(--navy);color:#fff;border-color:rgba(255,255,255,.08)}
.testimonial-card-featured .testimonial-quote{color:rgba(255,255,255,.72);font-size:18px}.testimonial-card-featured .testimonial-author{border-top-color:rgba(255,255,255,.12)}.testimonial-card-featured .testimonial-author strong{color:#fff}.testimonial-card-featured .testimonial-author span{color:rgba(255,255,255,.45)}
@media(max-width:980px){.testimonial-grid{grid-template-columns:1fr 1fr}.testimonial-card-featured{grid-column:auto}}
@media(max-width:720px){.testimonial-grid{grid-template-columns:1fr}.testimonial-card{padding:28px;min-height:auto}}
/* Testimonial refinement */
.testimonial-card{box-shadow:0 8px 24px rgba(15,25,35,.035)}
.testimonial-card:before{display:none}
.testimonial-card:hover{transform:translateY(-2px);box-shadow:0 12px 34px rgba(15,25,35,.07);border-color:rgba(201,168,76,.36)}
.testimonial-card:hover:before{height:0}
.testimonial-author-copy{display:flex;flex-wrap:wrap;align-items:center;gap:7px 9px;min-width:0}
.testimonial-author-copy strong{width:100%;display:block;font:800 14px/1.2 "Manrope",sans-serif;color:var(--ink)}
.testimonial-author-copy span{font-size:12px;color:var(--muted);margin-top:0}
.testimonial-author-copy em{font-style:normal;font:700 10px/1 "Manrope",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-2);background:var(--gold-soft);border:1px solid rgba(201,168,76,.24);border-radius:999px;padding:6px 8px}
.testimonial-card-featured:hover{border-color:rgba(201,168,76,.45);box-shadow:0 12px 34px rgba(0,0,0,.16)}
.testimonial-card-featured .testimonial-author-copy strong{color:#fff}.testimonial-card-featured .testimonial-author-copy span{color:rgba(255,255,255,.52)}.testimonial-card-featured .testimonial-author-copy em{background:rgba(201,168,76,.14);border-color:rgba(201,168,76,.32);color:var(--gold)}
/* Testimonial author meta reset */
.testimonial-author-copy em{display:none}
.testimonial-author-copy span{display:block;width:100%;font-size:11px;color:var(--muted);margin-top:5px;line-height:1.45}
.testimonial-card-featured .testimonial-author-copy span{color:rgba(255,255,255,.45)}
/* Testimonial spacing final */
.testimonial-author{align-items:center;gap:14px}
.testimonial-author-copy{gap:2px;align-content:center}
.testimonial-author-copy strong{margin:0;line-height:1.15}
.testimonial-author-copy span{margin-top:2px;line-height:1.35}
/* Mobile menu and WhatsApp refinements */
.mobile-nav-cta,.mobile-menu-brand{display:none}
.breadcrumb a{color:rgba(255,255,255,.58);text-decoration:none;transition:color .2s var(--ease)}
.breadcrumb a:hover{color:#fff}
.whatsapp-float{position:fixed;right:22px;bottom:22px;z-index:1200;display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 18px;border-radius:999px;background:#25D366;color:#07130c;text-decoration:none;font:800 13px/1 "Manrope",sans-serif;box-shadow:0 16px 34px rgba(7,19,12,.24);transition:transform .22s var(--ease),box-shadow .22s var(--ease)}
.whatsapp-float svg{width:24px;height:24px;color:#fff;filter:drop-shadow(0 1px 0 rgba(0,0,0,.08))}.whatsapp-float:hover{transform:translateY(-3px);box-shadow:0 20px 42px rgba(7,19,12,.28)}
@media(max-width:820px){.whatsapp-float{right:16px;bottom:16px;min-height:48px;padding:0 14px}.whatsapp-float span{display:none}.whatsapp-float svg{width:25px;height:25px}}
@media(max-width:980px){
  .nav-links{position:fixed;inset:68px 10px auto 10px;max-height:calc(100svh - 84px);background:rgba(15,25,35,.98);display:none;flex-direction:column;align-items:stretch;padding:16px 10px 14px;gap:0;border:1px solid rgba(255,255,255,.08);border-radius:0 0 8px 8px;box-shadow:0 24px 60px rgba(0,0,0,.34);overflow-y:auto;backdrop-filter:blur(14px)}
  .nav-links.open{display:flex}
  .nav-link{display:flex;align-items:center;min-height:54px;text-align:left;padding:0 10px;border-bottom:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.72);font-size:14px;font-weight:800}
  .nav-link.active{background:var(--gold);color:#fff;margin:0 -10px;padding:0 18px;border-bottom-color:rgba(255,255,255,.12)}
  .nav-link:after{display:none}
  .mobile-nav-cta{display:flex;align-items:center;justify-content:center;gap:12px;margin:0 -10px 14px;padding:18px 14px;background:var(--navy);color:#fff;font:800 14px/1 "Manrope",sans-serif;text-decoration:none;order:-1;border-radius:0 0 7px 7px;box-shadow:inset 0 -1px rgba(255,255,255,.08)}
  .mobile-nav-cta .arrow{width:16px;height:16px}
  .mobile-menu-brand{display:grid;grid-template-columns:40px 1fr;gap:10px;align-items:center;padding:18px 0 0;color:#fff}
  .mobile-menu-brand .brand-mark{width:40px;height:40px}.mobile-menu-brand strong{display:block;font:800 14px/1.1 "Manrope",sans-serif}.mobile-menu-brand small{display:block;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-top:2px}.mobile-menu-brand p{grid-column:1/-1;margin:6px 0 0;padding-top:10px;border-top:1px solid rgba(255,255,255,.08);font-size:12px;line-height:1.5;color:rgba(255,255,255,.55)}
  .menu-btn{display:grid;place-items:center}.nav-actions>.btn{display:none}
}
/* Emergency nav/floater hardening */
.mobile-nav-cta,
.mobile-menu-brand { display:none !important; }
.whatsapp-float { position:fixed !important; right:22px !important; bottom:22px !important; z-index:1200 !important; width:54px !important; height:54px !important; min-height:0 !important; padding:0 !important; border-radius:50% !important; display:grid !important; place-items:center !important; background:#25D366 !important; color:#fff !important; overflow:hidden !important; line-height:1 !important; }
.whatsapp-float svg { display:block !important; width:28px !important; height:28px !important; max-width:28px !important; max-height:28px !important; flex:0 0 28px !important; }
.whatsapp-float span { display:none !important; }
@media(max-width:980px){
  .nav-links.open .mobile-nav-cta { display:flex !important; }
  .nav-links.open .mobile-menu-brand { display:grid !important; }
}
/* Active Shake public compatibility layer */
.contact-form .hp-field{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important}
.contact-form .consent-field{grid-column:1/-1;display:flex;align-items:flex-start;gap:10px;font-size:13px;line-height:1.6;color:var(--text);font-weight:500;margin:14px 0}
.contact-form .consent-field input{width:auto;margin-top:4px;box-shadow:none}
.page-hero h1,
.page-hero p,
.section-title,
.lead,
.contact-item strong{overflow-wrap:anywhere;word-break:normal}
.page-hero,
.section,
.cta{overflow:hidden}
@media(max-width:700px){
  html,body{max-width:100%;overflow-x:hidden}
  .container{width:calc(100% - 32px);max-width:100%;min-width:0}
  .site-header{height:76px}
  .site-header .nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:14px;width:calc(100% - 32px);max-width:100%}
  .site-header .brand{min-width:0;flex:1 1 auto}
  .site-header .brand-text{min-width:0}
  .site-header .nav-actions{display:flex!important;align-items:center;justify-content:flex-end;flex:0 0 auto;margin-left:auto}
  .site-header .nav-actions>.btn{display:none!important}
  .site-header .menu-btn{display:grid!important;place-items:center;position:fixed;right:16px;top:18px;z-index:7000;flex:0 0 42px;width:42px;height:42px;border:0;border-radius:10px;background:var(--gold);color:var(--navy);box-shadow:0 10px 24px rgba(0,0,0,.22)}
  .display{font-size:34px;line-height:1.08;white-space:normal;max-width:100%}
  .page-hero h1{display:block;width:100%;max-width:min(100%,330px);font-size:30px;line-height:1.08;white-space:normal;overflow-wrap:break-word;word-break:normal;letter-spacing:-.045em}
  .section-title{font-size:30px;white-space:normal;max-width:min(100%,330px)}
  .hero-copy,.page-hero p,.lead{font-size:15px;max-width:min(100%,340px);white-space:normal;overflow-wrap:break-word}
  .proof-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.proof-item{padding:16px 9px;min-width:0}.proof-label{font-size:9px;line-height:1.3;overflow-wrap:break-word}
  .contact-grid{min-width:0}.contact-grid>*{min-width:0}
  .contact-grid .lead,
  .contact-details,
  .contact-item,
  .contact-item strong{max-width:310px!important;white-space:normal;overflow-wrap:anywhere}
  .contact-form{grid-template-columns:1fr;padding:24px 18px}.contact-form>*{grid-column:1/-1!important}.contact-form button{width:100%;justify-self:stretch}
}

/* Added integration pages */
.gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.gallery-card{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden}.gallery-card img{width:100%;aspect-ratio:1.35;object-fit:cover;background:var(--navy)}.gallery-card figcaption{padding:16px 18px;font-size:13px;color:var(--text);font-weight:700}.policy-list{display:grid;gap:14px;margin-top:28px}.policy-item{background:#fff;border:1px solid var(--line);padding:22px}.policy-item h3{font:700 18px/1.2 "Manrope",sans-serif;margin-bottom:8px}.policy-item p{color:var(--text);font-size:14px}.form-note[data-form-status]{min-height:24px}.contact-form button[disabled]{opacity:.7;cursor:not-allowed}.empty-state{padding:26px;border:1px dashed var(--line);background:rgba(255,255,255,.72);color:var(--text)}
@media (min-width:981px){.nav-links{gap:22px}.nav-link{font-size:12.5px}.nav-actions .btn{padding-inline:16px}}
@media (max-width:780px){.gallery-grid{grid-template-columns:1fr}.policy-item{padding:18px}}

/* =========================================================
   PREMIUM RESPONSIVE CLIENT UI LAYER — 2026-07-07
   Mobile-first hardening, client-side feedback states, SEO-ready layout polish.
   ========================================================= */
:root{
  --radius-lg:18px;
  --radius-md:14px;
  --focus:0 0 0 4px rgba(201,168,76,.28);
  --shadow-soft:0 18px 52px rgba(15,25,35,.12);
  --shadow-premium:0 24px 80px rgba(15,25,35,.18);
}
.skip-link{position:fixed;left:14px;top:10px;z-index:10000;transform:translateY(-140%);background:var(--gold);color:var(--navy);padding:10px 14px;border-radius:10px;font-weight:800;box-shadow:var(--shadow-soft)}
.skip-link:focus{transform:none;outline:none;box-shadow:var(--focus)}
:focus-visible{outline:none;box-shadow:var(--focus)}
::selection{background:var(--gold);color:var(--navy)}
body{min-width:320px;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
main{background:var(--paper)}
.container{max-width:var(--max)}
.site-header{will-change:background,box-shadow}.site-header .brand{min-width:0}.brand-text{overflow:hidden}.brand-name,.brand-sub{overflow:hidden;text-overflow:ellipsis}
.nav-backdrop{position:fixed;inset:0;background:rgba(4,10,16,.56);z-index:990;backdrop-filter:blur(3px)}
.nav-link{border-radius:999px;padding-inline:2px}.nav-link:focus-visible{box-shadow:none;color:#fff}.nav-link:focus-visible:after{right:0}
.btn{box-shadow:0 0 0 rgba(0,0,0,0);white-space:nowrap}.btn:active{transform:translateY(0) scale(.99)}
.btn-gold,.btn-dark{box-shadow:0 12px 30px rgba(15,25,35,.14)}
.page-hero .breadcrumb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:18px;font-size:12px;color:rgba(255,255,255,.62)}
.hero-content,.page-hero .container{isolation:isolate}.hero-copy,.page-hero p{max-width:68ch}.hero-actions .btn{min-width:180px}
.service-card,.service-showcase-card,.project-card,.project-row,.team-card,.testimonial-card,.gallery-card,.policy-item,.contact-form,.contact-details .contact-item{border-radius:var(--radius-md)}
.service-card,.service-showcase-card,.project-card,.project-row,.team-card,.testimonial-card,.gallery-card,.policy-item{transition:transform .24s var(--ease),box-shadow .24s var(--ease),border-color .24s var(--ease)}
.service-card:hover,.service-showcase-card:hover,.project-row:hover,.team-card:hover,.testimonial-card:hover,.gallery-card:hover,.policy-item:hover{border-color:rgba(201,168,76,.5);box-shadow:var(--shadow-premium)}
.service-showcase-card{overflow:hidden}.service-showcase-body p,.service-card p,.project-body p,.team-body p,.testimonial-quote{overflow-wrap:anywhere}
.gallery-card img{transition:transform .5s var(--ease),filter .5s var(--ease)}.gallery-card:hover img{transform:scale(1.035);filter:saturate(1.04) contrast(1.02)}
.contact-grid{align-items:start}.contact-form{position:relative;border:1px solid var(--line);box-shadow:var(--shadow-premium)}
.contact-form .field{position:relative}.contact-form input,.contact-form select,.contact-form textarea{transition:border-color .2s var(--ease),box-shadow .2s var(--ease),background .2s var(--ease)}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--gold);box-shadow:var(--focus);background:#fff}
.contact-form .field.has-error input,.contact-form .field.has-error select,.contact-form .field.has-error textarea{border-color:#c44141;background:#fff7f7}
.field-error{display:block;margin-top:7px;color:#a12b2b;font-size:12px;font-weight:700;line-height:1.35}.form-note{border-radius:12px;padding:12px 14px;background:rgba(15,25,35,.05);color:var(--text);line-height:1.45}.form-note.is-success{background:#eefaf3;color:#16633d;border:1px solid #b8dfc9}.form-note.is-error{background:#fff1f1;color:#991b1b;border:1px solid #f3c0c0}.form-note.is-info{background:#eef5ff;color:#164e82;border:1px solid #bfdcff}
.contact-form button[disabled]{opacity:.72;cursor:wait;filter:saturate(.82)}
.footer-contact a{color:inherit;text-decoration:none}.footer-contact a:hover{color:var(--gold)}
.whatsapp-float{outline:1px solid rgba(255,255,255,.24)}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .55s var(--ease),transform .55s var(--ease)}.reveal.visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.reveal{opacity:1!important;transform:none!important}.worked-track{animation:none!important}}

/* Desktop large */
@media(min-width:1201px){
  .site-header.scrolled .nav-wrap{transform:translateY(0)}
  .hero-content{max-width:780px}.services-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.testimonial-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* Laptop / tablet landscape */
@media(max-width:1200px){
  :root{--max:1080px}.container{width:calc(100% - 40px)}
  .nav-links{gap:16px}.nav-link{font-size:12px}.nav-actions .btn{padding-inline:14px}
  .display{font-size:clamp(42px,6vw,72px)}.section-title{font-size:clamp(30px,4vw,46px)}
  .hero{min-height:720px}.proof-grid{grid-template-columns:1fr repeat(3,minmax(0,1fr))}.proof-intro,.proof-item{padding:20px 18px}
  .split,.advantage-grid,.contact-grid{gap:52px}.project-grid{grid-template-columns:1fr 1fr}.services-grid,.services-showcase{grid-template-columns:repeat(2,minmax(0,1fr))}.testimonial-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Tablet portrait and mobile navigation */
@media(max-width:980px){
  body.menu-open{overflow:hidden}.site-header{height:72px;background:rgba(15,25,35,.97);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(14px)}
  .site-header.scrolled{height:72px}.nav-wrap{width:calc(100% - 32px);gap:14px}.brand-mark{width:36px;height:36px}.brand-logo-mark{width:210px;height:54px}.brand-name{font-size:13px}.brand-sub{font-size:8px}
  .menu-btn{display:grid!important;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--gold);color:var(--navy);border:0;box-shadow:0 14px 30px rgba(0,0,0,.24)}
  .menu-btn[aria-expanded="true"]{background:#fff;color:var(--navy)}
  .nav-actions>.btn{display:none!important}
  .nav-links{position:fixed;display:flex;inset:80px 16px auto 16px;max-height:calc(100svh - 104px);background:linear-gradient(180deg,rgba(15,25,35,.99),rgba(23,35,49,.99));border:1px solid rgba(255,255,255,.1);border-radius:18px;box-shadow:0 28px 80px rgba(0,0,0,.42);padding:10px;flex-direction:column;align-items:stretch;gap:0;overflow:auto;transform:translateY(-10px) scale(.98);opacity:0;pointer-events:none;transition:opacity .22s var(--ease),transform .22s var(--ease);z-index:1100;backdrop-filter:blur(18px)}
  .nav-links.open{opacity:1;pointer-events:auto;transform:none}
  .nav-link{display:flex;align-items:center;min-height:52px;padding:0 14px;border-radius:12px;border-bottom:1px solid rgba(255,255,255,.06);color:rgba(255,255,255,.78);font-size:14px;font-weight:800}.nav-link:after{display:none}.nav-link.active{background:rgba(201,168,76,.16);color:#fff;border-color:rgba(201,168,76,.26)}
  .mobile-nav-cta{display:flex!important;margin:8px 0 10px;min-height:52px;border-radius:14px;background:var(--gold);color:var(--navy);align-items:center;justify-content:center;font-weight:900}.mobile-menu-brand{display:grid!important;grid-template-columns:1fr;gap:12px;margin-top:10px;padding:16px 4px 4px;color:#fff}.mobile-menu-brand p{grid-column:1/-1;color:rgba(255,255,255,.58);font-size:12px;line-height:1.55}.mobile-menu-brand small{display:block;color:rgba(255,255,255,.55);letter-spacing:.16em;font-size:9px;text-transform:uppercase}
  .hero{height:auto;min-height:720px;padding:146px 0 210px}.hero-content{margin-left:20px;width:calc(100% - 40px);transform:none}.hero:before{background:linear-gradient(90deg,rgba(6,12,18,.92),rgba(6,12,18,.68)),linear-gradient(0deg,rgba(10,18,26,.7),transparent 52%)}
  .proof-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.proof-intro{grid-column:1/-1;border-bottom:1px solid rgba(255,255,255,.1);border-right:0;padding:16px 0}.proof-item{padding:18px 12px}.proof-number{font-size:24px}
  .worked-shell{grid-template-columns:1fr}.worked-heading{border-right:0;border-bottom:1px solid rgba(255,255,255,.1);padding:18px 0;min-height:0}.section{padding:86px 0}.split,.advantage-grid,.contact-grid{grid-template-columns:1fr;gap:42px}.grid-head{display:block}.grid-head p,.grid-head .btn{margin-top:18px}.feature-visual{min-height:360px;margin-left:0}.services-grid,.services-showcase,.values-grid,.team-grid,.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.project-grid{grid-template-columns:1fr;grid-template-rows:auto}.project-card,.project-card:first-child{min-height:360px;grid-column:auto;grid-row:auto}.project-row{grid-template-columns:1fr}.project-thumb{min-height:300px}.contact-form{padding:28px}.form-grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr 1fr;gap:32px}
}

/* Phones */
@media(max-width:640px){
  .container,.nav-wrap{width:calc(100% - 28px)}.site-header{height:68px}.brand-sub{display:none}.brand-name{font-size:12px;max-width:170px}.brand-mark{width:34px;height:34px}.brand-logo-mark{width:170px;height:46px}.menu-btn{width:42px;height:42px}.nav-links{inset:76px 10px auto 10px;max-height:calc(100svh - 88px);border-radius:16px}
  .display{font-size:clamp(36px,13vw,48px);letter-spacing:-.052em}.section-title{font-size:clamp(28px,10vw,36px)}.lead{font-size:16px}.eyebrow{font-size:10px;letter-spacing:.14em;margin-bottom:14px}.eyebrow:before{width:22px}
  .hero{min-height:720px;padding:124px 0 210px}.hero-content{margin-left:14px;width:calc(100% - 28px)}.hero-copy{font-size:15px;margin:22px 0 26px}.hero-actions{display:grid;grid-template-columns:1fr;gap:10px}.hero-actions .btn{width:100%;min-width:0}.hero-proof{position:absolute}.proof-grid{grid-template-columns:1fr}.proof-item{border-right:0;border-top:1px solid rgba(255,255,255,.08);display:grid;grid-template-columns:70px 1fr;gap:12px;align-items:center;padding:13px 0}.proof-label{font-size:11px;margin-top:0}.proof-intro{padding:13px 0;font-size:10px}
  .worked-item{min-width:180px;height:76px;font-size:15px}.section{padding:68px 0}.page-hero{padding:126px 0 62px}.page-hero h1{font-size:clamp(32px,12vw,44px);max-width:100%}.page-hero p{font-size:15px}.breadcrumb{font-size:11px}
  .services-grid,.services-showcase,.values-grid,.team-grid,.testimonial-grid,.gallery-grid{grid-template-columns:1fr}.service-card,.service-showcase-card,.value,.team-card,.testimonial-card{padding:24px}.service-showcase-media{min-height:170px}.project-card{min-height:310px}.project-row{border-radius:16px}.project-thumb{min-height:220px}.project-body{padding:24px}.project-meta{display:grid;gap:8px}
  .contact-details{display:grid;gap:12px}.contact-item{max-width:none!important}.contact-form{padding:22px 16px;border-radius:16px}.form-grid{grid-template-columns:1fr;gap:14px}.contact-form .field.full{grid-column:1}.contact-form textarea{min-height:150px}.consent-field{font-size:12px}.contact-form button{width:100%}.cta-inner{grid-template-columns:1fr;gap:20px;text-align:left}.cta-inner .btn{width:100%}.footer-grid{grid-template-columns:1fr}.footer-bottom{display:grid;gap:8px;text-align:left}.whatsapp-float{right:14px!important;bottom:14px!important;width:50px!important;height:50px!important}.gallery-card img{aspect-ratio:1.25}.policy-item{padding:18px}.policy-list{gap:12px}
}

@media(max-width:390px){.container,.nav-wrap{width:calc(100% - 22px)}.brand-name{max-width:145px}.hero-content{margin-left:11px;width:calc(100% - 22px)}.display{font-size:34px}.btn{font-size:12px;padding-inline:16px}.service-card,.service-showcase-card,.value,.team-card,.testimonial-card,.project-body{padding:20px}}


/* Premium dashboard-connected gallery */
.gallery-hero .container{max-width:980px}.gallery-section{position:relative}.gallery-tools{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 24px}.gallery-filter{border:1px solid var(--line);background:#fff;color:var(--navy);border-radius:999px;padding:10px 14px;font-weight:800;font-size:12px;letter-spacing:.02em;cursor:pointer;transition:all .2s var(--ease)}.gallery-filter:hover,.gallery-filter.active{background:var(--navy);color:#fff;border-color:var(--navy)}.premium-gallery-grid{align-items:stretch}.premium-gallery-card{position:relative;display:flex;flex-direction:column;min-height:100%;overflow:hidden}.gallery-lightbox-trigger{display:block;width:100%;border:0;padding:0;background:transparent;cursor:pointer;position:relative;text-align:left;overflow:hidden}.gallery-lightbox-trigger img{display:block;width:100%;aspect-ratio:1.35;object-fit:cover;background:var(--navy)}.gallery-zoom{position:absolute;right:12px;bottom:12px;background:rgba(15,25,35,.82);color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:7px 11px;font-weight:800;font-size:12px;opacity:0;transform:translateY(8px);transition:all .24s var(--ease)}.premium-gallery-card:hover .gallery-zoom,.gallery-lightbox-trigger:focus-visible .gallery-zoom{opacity:1;transform:translateY(0)}.premium-gallery-card figcaption{display:grid;gap:8px;align-content:start;flex:1}.gallery-badge{width:max-content;background:rgba(201,168,76,.15);color:#7a5a11;border:1px solid rgba(201,168,76,.28);border-radius:999px;padding:5px 9px;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.04em}.premium-gallery-card figcaption strong{font-size:14px;line-height:1.35;color:var(--navy)}.premium-gallery-card figcaption a,.premium-gallery-card figcaption small{font-size:12px;color:var(--text);font-weight:800;text-decoration:none}.premium-gallery-card[hidden]{display:none}.gallery-lightbox{position:fixed;inset:0;background:rgba(8,13,18,.92);z-index:9999;display:grid;place-items:center;padding:24px}.gallery-lightbox[hidden]{display:none}.gallery-lightbox img{max-width:min(1100px,92vw);max-height:78vh;border-radius:18px;box-shadow:0 30px 80px rgba(0,0,0,.45);object-fit:contain}.gallery-lightbox p{color:#fff;text-align:center;max-width:760px;margin:14px auto 0;font-weight:700}.gallery-lightbox-close{position:absolute;top:18px;right:18px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.24);background:rgba(255,255,255,.08);color:#fff;font-size:30px;line-height:1;cursor:pointer}.detail-gallery{margin-top:34px}.detail-gallery h2{font:800 28px/1.2 "Manrope",sans-serif;color:var(--navy);margin-bottom:16px}.detail-gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.detail-gallery-grid figure{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff;box-shadow:var(--shadow)}.detail-gallery-grid img{width:100%;aspect-ratio:1.25;object-fit:cover;display:block}.detail-gallery-grid figcaption{padding:12px 14px;font-size:12px;font-weight:800;color:var(--text)}
@media(max-width:960px){.detail-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.gallery-tools{overflow:auto;flex-wrap:nowrap;padding-bottom:6px}.gallery-filter{white-space:nowrap}}@media(max-width:620px){.detail-gallery-grid{grid-template-columns:1fr}.gallery-lightbox{padding:16px}.gallery-lightbox img{max-width:94vw;max-height:72vh}.gallery-lightbox-close{top:10px;right:10px}}
