:root{
  --red:#c80d15; /* primary */
  --gold:#c9a227; /* secondary */
  --black:#000000; /* pure black */
  --white:#ffffff;
  --ink:#1b1b1b;
  --muted:#6b6b6b;
  --gray:#f5f5f5;
  --cream:#e9e1cf; /* info banner */

  --container:1200px;

  --s-1:.5rem;
  --s:.75rem;
  --m:1rem;
  --l:1.5rem;
  --xl:2rem;
  --xxl:3rem;

  --shadow-1:0 6px 24px rgba(0,0,0,.18);
  --shadow-2:0 16px 48px rgba(0,0,0,.28);

  --speed:500ms;
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* Base */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--ink);
  background:var(--white);
  line-height:1.6;
  overflow-x:hidden; /* No horizontal scrollbar anywhere */
}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
button{cursor:pointer}

/* Typography */
.display{font-family:Poppins,Inter,sans-serif;font-weight:800;letter-spacing:.01em;
  font-size:clamp(2rem,4.3vw,3.2rem);line-height:1.1;margin:0 0 .75rem}
.h-xl{font-family:Poppins,Inter,sans-serif;font-weight:800;font-size:clamp(1.6rem,3.2vw,2.2rem);margin:0}
.lead{color:#3b3b3b;margin:.4rem 0 0}

/* Utilities */
.container{max-width:var(--container);margin:0 auto;padding:0 var(--m)}
.section{padding:var(--xxl) 0;border-top:1px solid rgba(201,162,39,.12);border-bottom:1px solid rgba(201,162,39,.12)}
.section--black{background:var(--black);color:var(--white)}
.section-head{margin-bottom:var(--xl)}
.section-head.between{display:flex;align-items:end;justify-content:space-between;gap:1rem}
.section-cta{text-align:center;margin-top:var(--xl)}
.centered{text-align:center}
.two-corners{border-radius:0;border-top-right-radius:12px;border-bottom-left-radius:12px}
.gold{color:var(--gold)}
.skip{position:absolute;left:-9999px;top:auto}
.skip:focus{left:1rem;top:1rem;background:var(--gold);color:#000;padding:.5rem 1rem;z-index:9999}

/* Splash */
#splash{position:fixed;inset:0;background:var(--black);color:#fff;display:grid;place-items:center;z-index:9999;
  transition:opacity 600ms var(--ease),visibility 600ms var(--ease)}
#splash.hide{opacity:0;visibility:hidden}
.splash-inner{text-align:center}
.brand-word{font-family:Poppins,Inter,sans-serif;margin:.5rem 0 0;font-size:2rem;letter-spacing:.2em}
.brand-word span{color:var(--gold)}
.splash-tag{opacity:.9;margin:.25rem 0 0}
.splash-loader{width:260px;height:3px;background:rgba(255,255,255,.2);margin:1rem auto 0;position:relative;overflow:hidden}
.splash-loader::after{content:"";position:absolute;left:-40%;top:0;height:100%;width:40%;background:var(--gold);animation:line 1.1s linear infinite}
@keyframes line{to{left:100%}}

/* Header */
.header{position:fixed;left:0;right:0;top:0;background:var(--black);color:#fff;border-bottom:1px solid rgba(201,162,39,.25);z-index:60}
.header-row{height:88px;display:grid;grid-template-columns:86px 1fr 48px;align-items:center;gap:.5rem;max-width:var(--container);margin:0 auto;padding:0 var(--m);position:relative;z-index:61}
.logo img{width:64px;height:64px}
.brand-name{justify-self:start;display:flex;flex-direction:column;line-height:1}
.brand-top{font-family:Poppins;font-weight:800;letter-spacing:.24em;transform:translateX(-8px);font-size:1.2rem}
.brand-bottom{font-family:Poppins;font-weight:700;letter-spacing:.48em;color:var(--gold);font-size:1.05rem}
.hamburger.small{width:38px;height:38px;background:transparent;border:0;display:grid;place-items:center;z-index:62}
.hamburger .bar{width:24px;height:2px;background:#fff;display:block;margin:4px 0;transition:transform var(--speed) var(--ease),opacity var(--speed) var(--ease)}
.hamburger.active .bar:nth-child(1){transform:translateY(6px) rotate(45deg)}
.hamburger.active .bar:nth-child(2){opacity:0}
.hamburger.active .bar:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* Nav drawer (absolute under the header row; slow drop) */
.nav-drop{
  position:absolute;left:0;right:0;top:88px; /* below header */
  max-height:0;overflow:hidden;background:#0f0f0f;border-top:1px solid rgba(201,162,39,.25);
  transition:max-height 800ms var(--ease);z-index:55;
}
.nav-drop.open{max-height:760px}
.drop-list{list-style:none;margin:0;padding:.5rem var(--m) 0}
.drop-list li a{
  display:flex;align-items:center;gap:.75rem;padding:.7rem 0;color:#eee;font-weight:700;
  position:relative;
}
.drop-list li a::after{
  content:"";position:absolute;left:0;bottom:-2px;height:2px;background:var(--gold);
  width:50%; /* default half underline */
  transition:width 350ms var(--ease);
}
.drop-list li a:hover{color:#fff}
.drop-list li a:hover::after{width:100%} /* full underline on hover */

/* Drawer social buttons (big, full width) */
.drop-socials{display:grid;gap:.6rem;padding:1rem var(--m) 0}
.social-btn{
  display:block;text-align:center;font-weight:800;padding:.75rem;border:1px solid var(--gold);color:#fff;background:#121212;
}
.social-btn:hover{background:#1a1a1a}
.social-btn i{margin-right:.5rem}
.social-btn.wa{border-color:#25D366}
.social-btn.fb{border-color:#1877F2}
.social-btn.ig{border-color:#E1306C}
.social-btn.li{border-color:#0A66C2}

/* Drawer footer (address + phone) */
.drop-foot{
  padding:1rem var(--m) 1.4rem;border-top:1px solid rgba(255,255,255,.08);color:#d1d1d1;display:grid;gap:.9rem
}
.drop-foot h4{margin:0 0 .25rem;font-family:Poppins;color:var(--gold);font-size:1rem}
.drop-foot p{margin:0}

/* Ticker (seamless, soft gold) */
.ticker{height:36px;overflow:hidden;border-top:1px solid rgba(201,162,39,.18);border-bottom:1px solid rgba(201,162,39,.18);background:var(--cream);color:#1c1c1c}
.ticker-track{display:flex;white-space:nowrap;animation:ticker 28s linear infinite;will-change:transform}
.ticker-loop{display:flex}
.ticker-loop span{display:inline-block;padding:0 1.25rem}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* Hero */
.hero{padding-top:88px;position:relative;min-height:90vh;background:var(--black)}
.slides{position:relative;height:calc(90vh - 36px)} /* minus ticker */
.slide{position:absolute;inset:0;opacity:0;transition:opacity var(--speed) var(--ease)}
.slide.is-active{opacity:1;z-index:1}
.slide img{width:100%;height:100%;object-fit:cover}
.slide .overlay{position:absolute;inset:0;background:linear-gradient(rgba(0,0,0,.55), rgba(0,0,0,.65))}
.hero-box{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;color:#fff;max-width:880px;padding:0 var(--m)}
.hero .act{display:flex;gap:.75rem;justify-content:center;margin-top:1rem;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 1.3rem;border:2px solid var(--red);background:var(--red);color:#fff;text-transform:uppercase;font-weight:700;letter-spacing:.02em;box-shadow:var(--shadow-1);transition:transform var(--speed) var(--ease),box-shadow var(--speed) var(--ease),background var(--speed),color var(--speed)}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-2)}
.btn-ghost{background:transparent;border-color:var(--gold);color:#fff}
.btn-ghost:hover{background:var(--gold);color:#000}
.dots{position:absolute;left:50%;bottom:1rem;transform:translateX(-50%);display:flex;gap:.45rem}
.dot{width:9px;height:9px;border:2px solid #fff;background:transparent}
.dot.is-active{background:var(--red);border-color:var(--red)}

/* WHY (centered, black + gold) */
.why-head{display:flex;align-items:center;gap:.6rem;justify-content:center;margin-bottom:.5rem}
.why-text{max-width:920px;margin:0 auto;font-size:1.06rem;color:#e7e7e7}
.why-chips{display:flex;gap:.6rem;flex-wrap:wrap;margin:1rem auto 0;padding:0;list-style:none;justify-content:center}
.chip{background:#101010;border:1px solid var(--gold);color:#f3f3f3;padding:.5rem .75rem;font-weight:800;display:inline-flex;align-items:center;gap:.5rem}

/* KPIs */
.kpi-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:0;padding:0;list-style:none}
.kpi-item{text-align:center;padding:.6rem 0;border:1px solid rgba(0,0,0,.08)}
.kpi-val{font-family:Poppins;font-weight:800;color:var(--red);font-size:clamp(1.6rem,4.2vw,2.4rem)}
.kpi-label{color:#3f3f3f;margin-top:.2rem;font-weight:800}
.kpi-label i{color:var(--gold)}

/* SERVICES (image-led) */
.svc-grid{display:grid;grid-template-columns:1fr;gap:1rem}
.svc{position:relative;overflow:hidden;box-shadow:var(--shadow-1);border:1px solid rgba(201,162,39,.35)}
.svc img{width:100%;height:100%;object-fit:cover;transition:transform 600ms var(--ease)}
.svc:hover img{transform:scale(1.05)}
.svc figcaption{position:absolute;left:0;right:0;bottom:0;padding:.8rem 1rem;background:linear-gradient(180deg, transparent, rgba(0,0,0,.72));color:#fff;font-weight:800;display:flex;align-items:center;gap:.6rem}

/* PROCESS (premium timeline) */
.proc-line{margin:0;padding:0;list-style:none;position:relative}
.proc-line::before{content:"";position:absolute;left:calc(50% - 1px);top:0;bottom:0;width:2px;background:linear-gradient(var(--gold), rgba(201,162,39,.2))}
.node{display:grid;grid-template-columns:1fr;gap:1rem;margin:1rem 0;padding:1rem;border:1px solid rgba(201,162,39,.35);background:#0a0a0a}
@media (min-width:900px){
  .node{grid-template-columns:1fr 1fr}
  .node:nth-child(odd){grid-template-columns:1fr 1fr;direction:rtl}
  .node:nth-child(odd) .node-content{direction:ltr}
}
.dot{width:14px;height:14px;background:var(--gold);border-radius:50%;box-shadow:0 0 0 4px rgba(201,162,39,.18)}
.node-content h3{margin:.2rem 0 .25rem;font-family:Poppins;color:#f5f5f5}
.node-content p{margin:0;color:#dcdcdc}

/* PROJECTS (gradient reused) */
.projects-gradient{background:linear-gradient(120deg, rgba(201,162,39,.10), rgba(200,13,21,.08))}
.prj-grid{display:grid;grid-template-columns:1fr;gap:1rem}
.prj{background:#fff;box-shadow:var(--shadow-1);overflow:hidden;border:1px solid rgba(201,162,39,.35)}
.prj-btn{display:block;border:0;background:transparent;padding:0;position:relative;width:100%;text-align:left}
.prj img{width:100%;height:100%;object-fit:cover;transition:transform 600ms var(--ease)}
.prj:hover img{transform:scale(1.05)}
.hover-name{position:absolute;left:0;right:0;bottom:0;padding:.6rem 1rem;background:linear-gradient(180deg, transparent, rgba(0,0,0,.75));color:#fff;font-weight:800;opacity:1} /* Always visible */

/* Lightbox */
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.82);backdrop-filter:blur(2px);display:none;align-items:center;justify-content:center;z-index:80}
.lightbox.show{display:flex}
.lb-close{position:absolute;top:20px;right:20px;background:#111;border:1px solid var(--gold);color:#fff;padding:.5rem .8rem}
.lightbox img{max-width:92vw;max-height:76vh;box-shadow:var(--shadow-2);border:1px solid rgba(255,255,255,.15)}
.lb-caption{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);color:#fff;background:rgba(0,0,0,.5);padding:.4rem .7rem;border:1px solid rgba(255,255,255,.25)}

/* TESTIMONIALS */
.testi-col{display:grid;gap:1rem}
.testi.full{background:#0a0a0a;border:1px solid rgba(201,162,39,.35);padding:1rem 1.2rem;color:#ddd}
.testi-top{display:flex;align-items:center;gap:.75rem;margin-bottom:.4rem}
.pic{width:50px;height:50px;overflow:hidden}
.frame2{border-radius:0;border-top-right-radius:12px;border-bottom-left-radius:12px}
.pic img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.testi blockquote{margin:.5rem 0 0;font-size:1.02rem;line-height:1.7}
.auth{margin-top:.4rem;color:#bdbdbd;font-weight:800}

/* FAQ */
.faq-list{display:grid;gap:.6rem}
.faq-item{border:1px solid rgba(201,162,39,.35);background:#fff}
.faq-q{width:100%;text-align:left;padding:.9rem 1rem;background:#fff;border:0;font-weight:800;display:flex;align-items:center;justify-content:space-between}
.faq-q i{transition:transform var(--speed) var(--ease)}
.faq-q[aria-expanded="true"] i{transform:rotate(45deg);color:var(--red)}
.faq-a{display:none;padding:0 1rem 1rem;color:#333;border-top:1px solid rgba(0,0,0,.06)}
.faq-item.open .faq-a{display:block}

/* Coverage (mobile-first: 1 col; larger: 2 cols) */
.cov-grid{display:grid;grid-template-columns:1fr;gap:1rem}
.cov{background:#fff;border:1px solid rgba(201,162,39,.35);padding:1rem 1.1rem;box-shadow:var(--shadow-1)}
@media (min-width:840px){
  .kpi-row{grid-template-columns:repeat(4,1fr)}
  .svc-grid{grid-template-columns:repeat(3,1fr)}
  .prj-grid{grid-template-columns:repeat(3,1fr)}
  .cov-grid{grid-template-columns:repeat(2,1fr)}
}

/* Contact (special) */
.contact-special{background:linear-gradient(135deg, rgba(200,13,21,.06), rgba(201,162,39,.10))}
.contact-wrap{display:grid;grid-template-columns:1fr;gap:1rem}
@media (min-width:960px){ .contact-wrap{grid-template-columns:1.1fr .9fr} }
.form-side form{display:grid;gap:.8rem;margin-top:.6rem}
.row{display:grid;gap:.35rem}
label{font-weight:800}
input,select,textarea{border:1px solid rgba(201,162,39,.45);padding:.75rem;background:#fff;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--gold)}
.map-side{min-height:440px;border:1px solid rgba(201,162,39,.45)}

/* CTA Band (shared theme with projects section) */
.cta-band{padding:2.5rem 0;background:#111;color:#fff}
.cta-wrap{background:linear-gradient(120deg, rgba(201,162,39,.22), rgba(200,13,21,.22));padding:1.2rem 1.4rem;display:flex;flex-direction:column;align-items:center;gap:.6rem;border:1px solid rgba(255,255,255,.12)}
.cta-wrap h3{margin:0;font-family:Poppins}
.cta-actions{display:flex;gap:.6rem;flex-wrap:wrap}

/* Footer (pure black, juicy gold accents) */
.footer{background:var(--black);color:#fff;border-top:1px solid rgba(201,162,39,.35)}
.foot-grid{display:grid;grid-template-columns:1fr;gap:1rem;padding:var(--xxl) var(--m)}
@media (min-width:980px){ .foot-grid{grid-template-columns:1.2fr 1fr 1fr 1.2fr} }
.foot-brand{display:flex;align-items:center;gap:.8rem}
.foot-word strong{font-family:Poppins;font-size:1.25rem}
.foot-word .tag{display:block;color:#e4d7a3;margin-top:.2rem}
.foot-links a{display:block;color:#eaeaea;margin:.25rem 0;border-bottom:1px dashed rgba(201,162,39,.25);padding-bottom:.25rem}
.foot-links a:hover{color:var(--gold)}
.foot-services ul{list-style:none;margin:0;padding:0}
.foot-services li{padding:.25rem 0;border-bottom:1px dashed rgba(201,162,39,.25)}
.newsletter{display:flex;gap:.6rem;margin:.6rem 0 0}
.newsletter input{flex:1;border:1px solid rgba(201,162,39,.45);background:transparent;color:#fff;padding:.75rem}
.foot-badges{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.6rem}
.foot-badges span{background:#0f0f0f;border:1px solid rgba(201,162,39,.35);padding:.35rem .6rem}
.foot-contact p{margin:.25rem 0}
.socials a{margin-right:.6rem;color:#fff;border:1px solid rgba(201,162,39,.35);display:inline-grid;place-items:center;width:38px;height:38px}
.socials a:hover{color:var(--gold);border-color:var(--gold)}
.foot-bottom{border-top:1px solid rgba(255,255,255,.08);padding:1rem 0;background:#0a0a0a}
.foot-bottom .container{display:flex;align-items:center;justify-content:space-between}
.foot-legal a{margin-left:1rem;color:#eaeaea}

/* Buttons */
.btn{border:2px solid var(--red);background:var(--red);color:#fff}
.btn-ghost{border-color:var(--gold)}

/* Chat */
.chat-fab{position:fixed;right:18px;bottom:18px;width:54px;height:54px;display:grid;place-items:center;border:1px solid var(--gold);background:#101010;color:#fff;z-index:70;box-shadow:var(--shadow-2)}
.chatbox{position:fixed;right:18px;bottom:86px;width:min(380px,94vw);height:420px;background:#f6f6f6;border:1px solid var(--gold);box-shadow:var(--shadow-2);z-index:70;display:flex;flex-direction:column;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity var(--speed) var(--ease),transform var(--speed) var(--ease)}
.chatbox.open{opacity:1;visibility:visible;transform:translateY(0)}
.chat-head{background:#111;color:#fff;padding:.7rem .9rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--gold)}
.meta{display:flex;flex-direction:column}
.online{color:#cfead2;font-size:.86rem}
.online .dot{display:inline-block;width:9px;height:9px;background:#2ecc71;border-radius:50%;box-shadow:0 0 0 3px rgba(46,204,113,.25);margin-right:.4rem}
.chat-body{flex:1;overflow:auto;padding:.8rem;display:flex;flex-direction:column;gap:.5rem;background:#efefee;scrollbar-width:none}
.chat-body::-webkit-scrollbar{width:0;height:0} /* hide scrollbar visibility */
.quick{display:flex;flex-direction:column;gap:.4rem;margin-top:.25rem}
.qr{align-self:flex-end;border:1px solid var(--gold);background:#fff;padding:.45rem .6rem}
.bubble{max-width:80%;padding:.55rem .75rem;border:1px solid #ddd;background:#fff;color:#111}
.bot{align-self:flex-start}
.user{align-self:flex-end;background:#ffecec;border-color:var(--red)}
.chat-input{display:flex;gap:.4rem;padding:.6rem;border-top:1px solid #ddd;background:#fff}
.chat-input input{flex:1;border:1px solid #d9d9d9;padding:.6rem}
.chat-input .send{border:1px solid var(--red);background:var(--red);color:#fff;padding:.55rem .9rem}

/* To top */
.to-top{position:fixed;right:20px;bottom:20px;width:46px;height:46px;border:1px solid var(--gold);background:#0a0a0a;color:#fff;display:grid;place-items:center;opacity:0;visibility:hidden;transition:opacity var(--speed) var(--ease);z-index:60}
.to-top.show{opacity:1;visibility:visible}

/* Cookie bar (removable) */
.cookie-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;background:#111;color:#fff;padding:.7rem 1rem;border:1px solid var(--gold);display:flex;align-items:center;gap:1rem;z-index:90;box-shadow:var(--shadow-2)}
.cookie-actions{display:flex;gap:.5rem}

/* Reveals */
.reveal .reveal-up{opacity:0;transform:translateY(20px);transition:all 600ms var(--ease)}
.reveal.in .reveal-up{opacity:1;transform:none}