/* =========================================================
   MASTERCRETE THEME TOKENS
   Rebrand (e.g. to Concrete Wizard) = change these values,
   swap the badge initials in each page header, and run a
   find-replace on the brand name. See README-REBRAND.md.
   ========================================================= */
:root{
  --accent:#C98F2D;        /* brand CTA colour (bronze gold, from Mastercrete logo) */
  --accent-deep:#A9761F;   /* hover state */
  --black:#171512;         /* header/footer */
  --grey:#A29B8E;
  --offwhite:#F4F1EA;      /* page background */
  --charcoal:#2B2723;      /* body text */
  --line:#D8D1C3;          /* borders */
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--charcoal);background:var(--offwhite);line-height:1.6}
h1,h2,h3{line-height:1.15;letter-spacing:.2px}
a{text-decoration:none;color:inherit}
.wrap{max-width:1140px;margin:0 auto;padding:0 22px}
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:700;border-radius:8px;
  padding:14px 22px;font-size:16px;cursor:pointer;transition:.15s}
.btn-call{background:var(--accent);color:#fff}
.btn-call:hover{background:var(--accent-deep)}
.btn-ghost{background:transparent;color:var(--black);border:2px solid var(--black)}
.btn-ghost:hover{background:var(--black);color:#fff}
header{position:sticky;top:0;z-index:50;background:var(--black);color:var(--offwhite)}
.hdr{display:flex;align-items:center;justify-content:space-between;padding:12px 22px;max-width:1140px;margin:0 auto}
.brand{display:flex;align-items:center;gap:12px}
.brand .name{font-weight:800;font-size:18px;letter-spacing:1px}
.brand .name span{color:var(--accent)}
.brand .tag{font-size:10px;letter-spacing:2px;color:var(--grey);display:block}
nav a{margin:0 12px;font-size:14px;font-weight:600;color:var(--offwhite);opacity:.85}
nav a:hover{opacity:1;color:var(--accent)}
.hdr-call{display:flex;align-items:center;gap:14px}
.hdr-phone{font-weight:800;font-size:18px;color:#fff}
.hdr-phone small{display:block;font-size:10px;font-weight:600;color:var(--grey);letter-spacing:1px}
@media(max-width:860px){nav{display:none}.hdr-phone{display:none}}
.hero{position:relative;color:#fff;background-image:linear-gradient(rgba(15,13,10,.70),rgba(15,13,10,.80)),url('images/hero.jpg');background-size:cover;background-position:center}
.hero-inner{position:relative;max-width:1140px;margin:0 auto;padding:78px 22px 88px}
.hero h1{font-size:46px;font-weight:800;max-width:760px;margin-bottom:18px}
.hero p.sub{font-size:19px;max-width:640px;color:#e6ded3;margin-bottom:30px}
.hero .cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:22px}
.hero .btn-ghost{color:#fff;border-color:#fff}
.hero .btn-ghost:hover{background:#fff;color:var(--black)}
.microtrust{display:flex;gap:10px;flex-wrap:wrap;font-size:13px;color:#cabfb1}
.microtrust span{display:flex;align-items:center;gap:6px}
.microtrust b{color:var(--accent);font-size:15px}
@media(max-width:680px){.hero h1{font-size:33px}.hero p.sub{font-size:17px}}
.trustbar{background:var(--black);color:var(--offwhite);font-size:14px;font-weight:600}
.trustbar .wrap{display:flex;flex-wrap:wrap;gap:8px 26px;padding:14px 22px;justify-content:center}
.trustbar i{color:var(--accent);font-weight:800;margin-right:6px}
section{padding:62px 0}
.eyebrow{color:var(--accent);font-weight:800;font-size:13px;letter-spacing:2px;text-transform:uppercase;margin-bottom:8px}
h2.sec{font-size:32px;font-weight:800;margin-bottom:10px}
.lead{font-size:17px;color:#574e45;max-width:680px;margin-bottom:34px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:860px){.grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.grid{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.card .img{height:185px;background:#cfc8bb center/cover no-repeat}
.card .body{padding:18px;flex:1;display:flex;flex-direction:column}
.card h3{font-size:19px;margin-bottom:6px}
.card .body p{font-size:14px;color:#6b6258;flex:1;margin-bottom:14px}
.card .feat-flag{display:inline-block;background:var(--accent);color:#fff;font-size:11px;font-weight:700;
  letter-spacing:1px;padding:3px 10px;border-radius:5px;margin-bottom:10px;width:max-content}
.card a.svc-call{font-weight:700;color:var(--accent);font-size:14px}
.owner{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.owner .row{display:grid;grid-template-columns:300px 1fr;gap:40px;align-items:center}
@media(max-width:780px){.owner .row{grid-template-columns:1fr}}
.owner .pic{height:340px;background:#cfc8bb center/cover no-repeat;border-radius:12px}
.owner ul{list-style:none;margin:18px 0 24px}
.owner li{display:flex;gap:12px;margin-bottom:14px;font-size:16px}
.owner li b{display:block}
.owner li .dot{color:var(--accent);font-weight:800;font-size:18px;line-height:1.4}
.owner li span small{color:#6b6258;font-size:14px;font-weight:400}
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media(max-width:780px){.gallery{grid-template-columns:1fr 1fr}}
.gallery .ph{aspect-ratio:4/3;background:#cfc8bb center/cover no-repeat;border-radius:10px}
.reviews{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:780px){.rev-grid{grid-template-columns:1fr}}
.rev{border:1px solid var(--line);border-radius:12px;padding:22px;background:var(--offwhite)}
.rev .stars{color:var(--accent);font-size:16px;letter-spacing:2px;margin-bottom:10px}
.rev p{font-size:15px;font-style:italic;color:#4a423a;margin-bottom:12px}
.rev .who{font-weight:700;font-size:14px}
.rev .seed{color:#9a8f80;font-size:12px}
.rev-link{display:inline-block;margin-top:26px;font-weight:700;color:var(--accent);font-size:15px}
.area .towns{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.area .towns span{background:#fff;border:1px solid var(--line);border-radius:30px;padding:8px 16px;font-size:14px;font-weight:600}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:10px}
@media(max-width:780px){.steps{grid-template-columns:1fr}}
.step{background:#fff;border:1px solid var(--line);border-radius:12px;padding:24px}
.step .n{width:42px;height:42px;border-radius:50%;background:var(--accent);color:#fff;font-weight:800;
  display:flex;align-items:center;justify-content:center;font-size:18px;margin-bottom:14px}
.step h3{font-size:18px;margin-bottom:6px}
.step p{font-size:14px;color:#6b6258}
.showcase{position:relative;min-height:360px;display:flex;align-items:center;justify-content:center;text-align:center;
  color:#fff;background-size:cover;background-position:center;background-attachment:fixed}
.showcase .ov{position:absolute;inset:0;background:rgba(15,13,10,.58)}
.showcase .txt{position:relative;max-width:780px;padding:54px 22px}
.showcase h2{font-size:34px;font-weight:800;margin-bottom:12px}
.showcase h2 span{color:var(--accent)}
.showcase p{font-size:19px;color:#ece4d8}
@media(max-width:860px){.showcase{background-attachment:scroll;min-height:280px}.showcase h2{font-size:27px}}
.final{background:var(--accent);color:#fff;text-align:center}
.final h2{font-size:34px;font-weight:800;margin-bottom:10px}
.final p{font-size:18px;margin-bottom:24px;opacity:.95}
.final .btn-call{background:var(--black)}
.final .btn-call:hover{background:#000}
.final .phone-big{display:block;font-size:40px;font-weight:800;margin-bottom:18px}
footer{background:var(--black);color:#cabfb1;font-size:14px;padding:46px 0 110px}
.foot{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:30px}
@media(max-width:780px){.foot{grid-template-columns:1fr}}
footer h4{color:#fff;font-size:14px;letter-spacing:1px;text-transform:uppercase;margin-bottom:12px}
footer a{display:block;margin-bottom:7px;color:#cabfb1}
footer a:hover{color:var(--accent)}
.foot .fphone{color:#fff;font-weight:800;font-size:22px}
.mobile-call{position:fixed;bottom:0;left:0;right:0;z-index:60;background:var(--accent);
  display:none;align-items:center;justify-content:center;gap:10px;padding:14px;
  color:#fff;font-weight:800;font-size:18px;box-shadow:0 -3px 14px rgba(0,0,0,.25)}
@media(max-width:860px){.mobile-call{display:flex}}
.badge-hex{width:34px;height:38px;flex:none}
.badge-logo{width:46px;height:46px;flex:none;border-radius:50%}
.svc-hero{position:relative;color:#fff;background-size:cover;background-position:center;padding:0}
.svc-hero .ov{position:absolute;inset:0;background:linear-gradient(rgba(15,13,10,.62),rgba(15,13,10,.74))}
.svc-hero .inner{position:relative;max-width:1140px;margin:0 auto;padding:70px 22px 76px}
.svc-hero .crumb{font-size:13px;color:#cabfb1;margin-bottom:12px}
.svc-hero .crumb a{color:#cabfb1}
.svc-hero .crumb a:hover{color:var(--accent)}
.svc-hero h1{font-size:42px;font-weight:800;max-width:760px;margin-bottom:14px}
.svc-hero p{font-size:19px;max-width:620px;color:#e6ded3;margin-bottom:26px}
@media(max-width:680px){.svc-hero h1{font-size:31px}}
.intro-row{display:grid;grid-template-columns:1fr 360px;gap:40px;align-items:start}
@media(max-width:820px){.intro-row{grid-template-columns:1fr}}
.intro-row .copy p{font-size:17px;color:#574e45;margin-bottom:16px}
.intro-row ul{list-style:none;background:#fff;border:1px solid var(--line);border-radius:12px;padding:22px}
.intro-row li{display:flex;gap:10px;font-size:15px;margin-bottom:12px}
.intro-row li:last-child{margin-bottom:0}
.intro-row li i{color:var(--accent);font-weight:800}
.svc-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:8px}
@media(max-width:680px){.svc-gallery{grid-template-columns:1fr 1fr}}
.svc-gallery .ph{aspect-ratio:4/3;background:#cfc8bb center/cover no-repeat;border-radius:10px}
.faq{max-width:820px}
.faq .q{background:#fff;border:1px solid var(--line);border-radius:10px;padding:18px 20px;margin-bottom:12px}
.faq .q h3{font-size:16px;margin-bottom:6px}
.faq .q p{font-size:15px;color:#574e45}

/* ===== BUILDERS BANNER (home) ===== */
.builders-banner{background:var(--black);color:var(--offwhite);border-top:3px solid var(--accent)}
.builders-banner .row{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center}
@media(max-width:780px){.builders-banner .row{grid-template-columns:1fr}}
.builders-banner h2{font-size:28px;font-weight:800;margin-bottom:8px}
.builders-banner h2 span{color:var(--accent)}
.builders-banner p{color:#cabfb1;font-size:16px;max-width:640px}

/* ===== QUOTE FORM ===== */
.qform{max-width:760px}
.qgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
@media(max-width:600px){.qgrid{grid-template-columns:1fr}}
.qform label{display:block;font-size:14px;font-weight:600;color:var(--charcoal);margin-bottom:16px}
.qform input,.qform select,.qform textarea{display:block;width:100%;margin-top:6px;padding:12px 14px;
  font-size:15px;font-family:inherit;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--charcoal)}
.qform input:focus,.qform select:focus,.qform textarea:focus{outline:none;border-color:var(--accent)}
.qform textarea{resize:vertical}
.qfile input{padding:10px 0;border:none}
.qform button.btn-call{border:none;cursor:pointer;font-size:16px}

/* ===== TEXT-US / WHATSAPP FLOATING WIDGET ===== */
.textus-wrap{position:fixed;right:18px;bottom:18px;z-index:70;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
@media(max-width:860px){.textus-wrap{bottom:84px}}
.textus-fab{display:inline-flex;align-items:center;gap:8px;background:#2BB24C;color:#fff;font-weight:700;
  padding:13px 18px;border-radius:30px;box-shadow:0 4px 14px rgba(0,0,0,.28);font-size:16px}
.textus-fab:hover{background:#239a41}
.textus-fab svg{width:22px;height:22px;fill:#fff}
.textus-bubble{background:#fff;color:var(--charcoal);border:1px solid var(--line);border-radius:12px;
  padding:12px 16px;font-size:14px;max-width:235px;box-shadow:0 4px 14px rgba(0,0,0,.18);
  opacity:0;transform:translateY(8px);pointer-events:none;transition:.3s}
.textus-bubble.show{opacity:1;transform:translateY(0);pointer-events:auto}
.textus-bubble .tx-close{color:var(--grey);cursor:pointer;font-weight:700;margin-left:6px}