/* ===================================================================
   Ironform Concrete & Paving — HTML Template by TemplatesJungle
   https://templatesjungle.com/
   =================================================================== */
:root{--slab:#6B7280;--dark:#1F2429;--yellow:#FACC15;--yellow-dk:#CA9A04;--lt:#E8EAED;--ink:#14181C;--muted:#64748b}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Archivo',sans-serif;color:var(--ink);background:#fff;line-height:1.65}
h1,h2,h3{font-family:'Archivo Black',sans-serif;text-transform:uppercase;line-height:1.1;letter-spacing:-.01em}
a{color:inherit}
img{max-width:100%;display:block}

/* ---------- Header / Nav (shared across every page) ---------- */
header{position:sticky;top:0;z-index:40;background:#fff;border-bottom:1px solid rgba(0,0,0,.10)}
nav{display:flex;align-items:center;justify-content:space-between;height:78px}
.logo{font-family:'Archivo Black',sans-serif;font-weight:700;font-size:1.25rem;text-decoration:none;color:var(--ink);text-transform:uppercase}
.logo span{color:var(--yellow)}
.nav-links{gap:26px;list-style:none;align-items:center}
.nav-links>li>a{text-decoration:none;color:var(--ink);font-size:.93rem;font-weight:500;text-transform:uppercase;letter-spacing:.04em}
.btn{display:inline-block;background:var(--yellow);color:#111;padding:13px 26px;border-radius:8px;
  text-decoration:none;font-weight:700;font-size:.9rem;text-transform:uppercase;letter-spacing:.03em;border:0;cursor:pointer;font-family:'Archivo',sans-serif}
.btn:hover{background:var(--yellow-dk)}
.btn.inv{background:var(--dark);color:#fff}

/* Pages dropdown + PRO badge */
.has-dd{position:relative}
.dd-toggle{cursor:pointer}
.dd-menu{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(6px);
  min-width:220px;background:var(--lt);border:1px solid rgba(0,0,0,.10);border-radius:10px;
  padding:8px;list-style:none;display:flex;flex-direction:column;gap:2px;opacity:0;visibility:hidden;
  transition:.16s ease;box-shadow:0 18px 44px rgba(0,0,0,.18);z-index:50}
.has-dd:hover .dd-menu,.has-dd:focus-within .dd-menu,.has-dd.dd-open .dd-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.dd-menu li{display:block}
.dd-menu a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;
  border-radius:7px;font-size:.9rem;white-space:nowrap;color:var(--ink);text-transform:none;letter-spacing:normal}
.dd-menu a:hover,.dd-menu a.dd-active{background:#FACC1522}
.pro{font-family:'Archivo',sans-serif;font-size:.6rem;font-weight:700;letter-spacing:.08em;
  background:var(--yellow);color:#111;padding:2px 7px;border-radius:999px;line-height:1.4;text-transform:uppercase}
/* ---------- Homepage hero ---------- */
.hero{background:var(--lt);padding:0}
.hero .container{min-height:560px}
.hero .row{min-height:560px}
.hero .copy{padding:80px 40px 80px 0;display:flex;flex-direction:column;justify-content:center}
.hero .k{background:var(--dark);color:var(--yellow);display:inline-block;align-self:flex-start;padding:6px 12px;font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;font-weight:600;margin-bottom:22px}
.hero h1{font-size:clamp(2.4rem,5.5vw,4.2rem);margin-bottom:20px}
.hero h1 span{-webkit-text-stroke:2px var(--ink);color:transparent}
.hero p{color:#454c55;margin-bottom:30px;max-width:44ch;font-size:1.05rem}
.hero-image{display:flex;align-items:center;justify-content:center;min-height:480px;background:var(--slab);margin:40px 0 40px 40px;border:6px solid var(--dark);overflow:hidden}
.hero-image img{width:100%;height:100%;max-height:468px;object-fit:contain}
.bar{background:var(--yellow);padding:18px 24px;display:flex;justify-content:center;gap:48px;flex-wrap:wrap;font-weight:600;text-transform:uppercase;font-size:.85rem;letter-spacing:.05em}
section{padding:90px 0}
h2{font-size:2.2rem;margin-bottom:12px}
.sub{color:#454c55;max-width:60ch;margin-bottom:48px}
.grid{gap:0;border:3px solid var(--ink)}
.cell{padding:38px 34px;border-right:3px solid var(--ink);border-bottom:3px solid var(--ink)}
.cell:nth-child(even){border-right:0}
.cell:nth-child(3),.cell:nth-child(4){border-bottom:0}
.cell h3{font-size:1.2rem;margin-bottom:10px}
.cell h3::before{content:"■ ";color:var(--yellow);-webkit-text-stroke:1px var(--ink)}
.cell p{color:#454c55;font-size:.93rem}
.specs{background:var(--dark);color:#fff}
.specs .container{gap:3px;background:#39404a;border:3px solid #39404a}
.specs .s{background:var(--dark);padding:34px 24px;text-align:center}
.specs b{display:block;font-family:'Archivo Black',sans-serif;font-size:2.4rem;color:var(--yellow)}
.specs small{color:#aab2bd;text-transform:uppercase;letter-spacing:.1em;font-size:.72rem}
.cta{background:var(--lt);text-align:center}
.cta h2{font-size:2.4rem}
.cta p{color:#454c55;margin:12px 0 30px}
@media(max-width:920px){.hero .row{min-height:0}.hero-image{margin:0 0 40px;min-height:280px}.hero-image img{max-height:520px}.hero .copy{padding:60px 0 30px}.cell{border-right:0!important;border-bottom:3px solid var(--ink)!important}.cell:last-child{border-bottom:0!important}}

/* ---------- Interior pages: hero, prose, tiles ---------- */
.page-hero{background:linear-gradient(135deg,var(--yellow),var(--yellow-dk));color:#111;padding:78px 0}
.page-hero .crumb{font-size:.8rem;opacity:.85;margin-bottom:12px;letter-spacing:.08em;text-transform:uppercase}
.page-hero h1{font-size:clamp(2.1rem,4.5vw,3rem)}
.page-hero p{margin-top:12px;max-width:60ch;opacity:.92;font-size:1.05rem}
.lead{color:var(--muted);max-width:66ch;margin-bottom:28px;font-size:1.02rem}
.prose p{color:var(--muted);margin-bottom:16px;max-width:70ch}
.tile{background:#fff;border:1px solid rgba(0,0,0,.10);border-radius:12px;padding:26px 24px}
.tile h3{font-size:1.1rem;margin-bottom:8px}
.tile p{color:var(--muted);font-size:.92rem}
.tile .num{display:inline-block;font-family:'Archivo Black',sans-serif;font-weight:700;color:var(--yellow);font-size:1.4rem;margin-bottom:10px}
.svc-list{list-style:none}
.svc-list li{background:#fff;border:1px solid rgba(0,0,0,.10);border-left:4px solid var(--yellow);
  border-radius:10px;padding:20px 22px}
.svc-list li b{display:block;margin-bottom:4px}
.svc-list li span{color:var(--muted);font-size:.9rem}
.stats{text-align:center;margin-top:10px}
.stats div{padding:24px 14px;background:#fff;border:1px solid rgba(0,0,0,.10);border-radius:12px}
.stats b{display:block;font-family:'Archivo Black',sans-serif;font-size:1.9rem;color:var(--yellow)}
.stats small{color:var(--muted);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase}
.contact-grid{align-items:start}
.info-card{background:#fff;border:1px solid rgba(0,0,0,.10);border-radius:12px;padding:28px}
.info-card h3{margin-bottom:16px}
.info-card .row{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid rgba(0,0,0,.10);font-size:.94rem;color:var(--muted)}
.info-card .row:last-child{border-bottom:0}
.info-card .row b{color:var(--ink);min-width:78px}

/* ---------- Gallery ---------- */
.gallery-grid{gap:18px}
.gallery-grid:not(.row){display:grid;grid-template-columns:repeat(3,1fr)}
.gallery-grid figure{margin:0;border-radius:12px;overflow:hidden;border:1px solid rgba(0,0,0,.10);position:relative;aspect-ratio:4/3}
.gallery-grid img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.gallery-grid a:hover img{transform:scale(1.06)}
.gallery-grid figcaption{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(0deg,rgba(0,0,0,.72),transparent);
  color:#fff;font-size:.82rem;padding:26px 14px 10px;text-transform:uppercase;letter-spacing:.04em}

/* ---------- Testimonials ---------- */
.testi-grid{gap:22px}
.testi-grid:not(.row){display:grid;grid-template-columns:repeat(3,1fr)}
.testi-card{background:#fff;border:1px solid rgba(0,0,0,.10);border-radius:12px;padding:26px}
.testi-card .stars{color:var(--yellow-dk);letter-spacing:2px;margin-bottom:12px;font-size:1rem}
.testi-card p{color:var(--muted);font-size:.94rem;margin-bottom:18px}
.testi-card .who{display:flex;align-items:center;gap:12px}
.testi-card .avatar{width:42px;height:42px;border-radius:50%;background:var(--lt);display:flex;align-items:center;justify-content:center;
  font-family:'Archivo Black',sans-serif;color:var(--ink)}
.testi-card .who b{display:block;font-size:.92rem}
.testi-card .who span{color:var(--muted);font-size:.8rem}

/* ---------- FAQ ---------- */
.faq-list{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:14px}
.faq-item{background:#fff;border:1px solid rgba(0,0,0,.10);border-radius:12px;overflow:hidden}
.faq-q{width:100%;text-align:left;background:none;border:0;padding:20px 24px;font-weight:700;font-size:1rem;
  cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;font-family:'Archivo',sans-serif;color:var(--ink)}
.faq-q .ic{font-size:1.3rem;color:var(--yellow-dk);transition:transform .2s;flex:none}
.faq-item.open .faq-q .ic{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .25s ease}
.faq-a p{color:var(--muted);padding:0 24px 20px;font-size:.94rem;max-width:none}
.faq-item.open .faq-a{max-height:320px}

/* ---------- Blog ---------- */
.blog-grid{gap:26px}
.blog-grid:not(.row){display:grid;grid-template-columns:repeat(3,1fr)}
.blog-card{background:#fff;border:1px solid rgba(0,0,0,.10);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.blog-card .thumb{aspect-ratio:16/10;overflow:hidden}
.blog-card .thumb img{width:100%;height:100%;object-fit:cover}
.blog-card .body{padding:22px 22px 26px;display:flex;flex-direction:column;gap:10px;flex:1}
.blog-card .meta{font-size:.75rem;color:var(--yellow-dk);text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.blog-card h3{font-size:1.08rem;text-transform:none;letter-spacing:0}
.blog-card p{color:var(--muted);font-size:.9rem;flex:1}
.blog-card .more{font-size:.85rem;font-weight:700;text-decoration:none;color:var(--ink)}
.blog-card .more:hover{color:var(--yellow-dk)}
.blog-single .hero-img{width:100%;aspect-ratio:21/9;object-fit:cover;border-radius:12px;margin-bottom:36px}
.blog-single .prose h2{font-size:1.5rem;margin:34px 0 12px;text-transform:none;letter-spacing:0}
.blog-single .prose ul{color:var(--muted);margin:0 0 16px 20px;max-width:70ch}
.blog-single .prose li{margin-bottom:6px}
.blog-meta-row{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:.85rem;margin-bottom:30px;text-transform:uppercase;letter-spacing:.04em}

/* ---------- Footer ---------- */
footer{background:var(--dark);color:#b9bec4;padding:52px 0 0;font-size:.9rem}
.foot-grid{padding-bottom:30px}
.foot-grid>div{flex:1 0 0}
.foot-grid h4{color:#fff;font-family:'Archivo Black',sans-serif;margin-bottom:14px;font-size:1rem}
.foot-grid a{display:block;color:#b9bec4;text-decoration:none;padding:5px 0;font-size:.9rem}
.foot-grid a:hover{color:#fff}
.tj-bottom-row{border-top:6px solid var(--yellow);font-size:.82rem}
.tj-bottom-row .container{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:16px;padding-bottom:16px}
.tj-bottom-row .tj-credit a{color:var(--yellow);font-weight:700;text-decoration:none}
.tj-bottom-row .tj-credit a:hover{text-decoration:underline}
.tj-bottom-row .foot-copy{opacity:.85}

/* ---------- Floating contact button + modal ---------- */
.tj-fab{position:fixed;right:22px;bottom:22px;z-index:9000;display:inline-flex;align-items:center;gap:10px;
  background:var(--yellow);color:#111;border:0;cursor:pointer;padding:15px 22px;border-radius:999px;
  font-family:'Archivo Black',sans-serif;font-weight:700;font-size:.98rem;box-shadow:0 12px 30px rgba(0,0,0,.28);
  text-transform:uppercase;letter-spacing:.03em;transition:transform .15s,background .15s}
.tj-fab:hover{transform:translateY(-2px);background:var(--yellow-dk)}
.tj-fab svg{width:20px;height:20px;flex:none}
.tj-fab .tj-fab-label{white-space:nowrap}
@media(max-width:560px){.tj-fab{right:16px;bottom:16px;padding:14px}.tj-fab .tj-fab-label{display:none}}

.tj-overlay{position:fixed;inset:0;z-index:9001;background:rgba(8,10,14,.55);backdrop-filter:blur(3px);
  display:none;align-items:center;justify-content:center;padding:20px;opacity:0;transition:opacity .18s}
.tj-overlay.open{display:flex;opacity:1}
.tj-modal{background:#fff;color:var(--ink);width:100%;max-width:480px;border-radius:16px;
  border:1px solid rgba(0,0,0,.10);box-shadow:0 30px 70px rgba(0,0,0,.4);max-height:92vh;overflow:auto;
  transform:translateY(14px) scale(.98);transition:transform .2s}
.tj-overlay.open .tj-modal{transform:none}
.tj-modal-head{background:linear-gradient(135deg,var(--yellow),var(--yellow-dk));color:#111;
  padding:22px 26px;position:relative;border-radius:16px 16px 0 0}
.tj-modal-head h3{font-family:'Archivo Black',sans-serif;font-size:1.3rem;margin:0;text-transform:uppercase}
.tj-modal-head p{margin:4px 0 0;font-size:.88rem;opacity:.92}
.tj-close{position:absolute;top:14px;right:14px;background:rgba(255,255,255,.2);border:0;color:inherit;
  width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:1.1rem;line-height:1;display:flex;
  align-items:center;justify-content:center}
.tj-close:hover{background:rgba(255,255,255,.35)}
.tj-modal-body{padding:24px 26px 28px}
.tj-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.tj-field{margin-bottom:14px}
.tj-field label{display:block;font-size:.8rem;font-weight:600;margin-bottom:6px;color:var(--ink)}
.tj-field input,.tj-field select,.tj-field textarea{width:100%;padding:11px 13px;border:1px solid rgba(0,0,0,.10);
  border-radius:8px;font-family:'Archivo',sans-serif;font-size:.94rem;background:#fff;color:var(--ink);outline:none}
.tj-field input:focus,.tj-field select:focus,.tj-field textarea:focus{border-color:var(--yellow);
  box-shadow:0 0 0 3px #FACC1533}
.tj-field textarea{min-height:104px;resize:vertical}
.tj-form button.tj-submit{width:100%;background:var(--yellow);color:#111;border:0;padding:14px;
  border-radius:8px;font-family:'Archivo Black',sans-serif;font-size:1rem;font-weight:700;cursor:pointer;
  text-transform:uppercase;letter-spacing:.04em}
.tj-form button.tj-submit:hover{background:var(--yellow-dk)}
.tj-note{font-size:.76rem;color:var(--muted);text-align:center;margin-top:12px}
.tj-alert{padding:11px 14px;border-radius:8px;margin-bottom:16px;font-size:.88rem;display:none}
.tj-alert.ok{display:block;background:#dcfce7;color:#166534;border:1px solid #86efac}
.tj-alert.err{display:block;background:#fee2e2;color:#991b1b;border:1px solid #fca5a5}

/* Inline (embedded, non-modal) contact form used on the Contact page */
.tj-inline-form .tj-row{grid-template-columns:1fr 1fr}

@media(max-width:900px){
  .foot-grid>div{flex-basis:100%}
  .tj-row{grid-template-columns:1fr}
  .tj-bottom-row .container{justify-content:center;text-align:center}
}
