/*
Theme Name: Waterproofing CPT
Template: generatepress
Description: Lightweight child theme for Waterproofing CPT - Cape Town waterproofing specialists.
Version: 1.0
Author: Waterproofing CPT
*/

:root{
  --bg:#F5F7F9;
  --surface:#FFFFFF;
  --ink:#002050;
  --accent:#0060C0;
  --muted:#5B6B7A;
  --border:#E1E6EA;
  --radius-sm:2px;
  --radius-md:4px;
  --space-sm:8px;
  --space-md:24px;
  --space-lg:64px;
  --space-xl:96px;
  --container:1200px;
  --font-heading: Archivo, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body.wcpt{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.wcpt img{max-width:100%;height:auto;display:block;}
.wcpt a{color:var(--accent);text-decoration:none;}
.wcpt a:hover{text-decoration:underline;}
.wcpt :where(h1,h2,h3,h4,h5,h6){
  font-family:var(--font-heading);
  font-weight:700;
  line-height:1.12;
  margin:0 0 var(--space-sm);
  color:var(--ink);
}
.wcpt h1{font-size:clamp(2rem,4.5vw,3.1rem);}
.wcpt h2{font-size:clamp(1.5rem,3vw,2.2rem);}
.wcpt h3{font-size:1.25rem;}
.wcpt p{margin:0 0 var(--space-sm);}
.wcpt ul{margin:0 0 var(--space-sm);padding-left:1.2em;}
.wcpt-container{max-width:var(--container);margin:0 auto;padding:0 var(--space-md);}
.wcpt section{padding:var(--space-lg) 0;}
@media (max-width:768px){
  .wcpt section{padding:var(--space-md) 0;}
  body.wcpt{font-size:16px;}
}

.wcpt-header{
  background:var(--surface);
  border-bottom:1px solid var(--border);
  position:sticky;top:0;z-index:100;
}
.wcpt-header-inner{
  max-width:var(--container);margin:0 auto;padding:0 var(--space-md);
  display:flex;align-items:center;justify-content:space-between;
  height:84px;
}
.wcpt-logo{
  font-family:var(--font-heading);font-weight:700;font-size:1.15rem;
  color:var(--ink);text-decoration:none;letter-spacing:-0.01em;
}
.wcpt-logo:hover{text-decoration:none;}
.wcpt-nav{display:flex;align-items:center;gap:28px;}
.wcpt-nav ul{display:flex;gap:28px;margin:0;padding:0;list-style:none;position:relative;}
.wcpt-nav li{position:relative;}
.wcpt-nav a{color:var(--ink);font-weight:500;font-size:0.97rem;}
.wcpt-nav a:hover{color:var(--accent);text-decoration:none;}
.wcpt-nav .sub-menu{
  display:none;position:absolute;top:100%;left:0;background:var(--surface);
  border:1px solid var(--border);min-width:230px;padding:8px 0;margin:0;list-style:none;
}
.wcpt-nav li:hover > .sub-menu{display:block;}
.wcpt-nav .sub-menu a{display:block;padding:9px 16px;font-size:0.92rem;}
.wcpt-nav a.wcpt-header-cta,.wcpt-nav a.wcpt-header-cta:visited,.wcpt-nav a.wcpt-header-cta:active{
  display:inline-block;background:var(--accent);color:#fff;padding:11px 20px;
  border-radius:var(--radius-md);font-weight:600;font-size:0.92rem;white-space:nowrap;
}
.wcpt-nav a.wcpt-header-cta:hover{background:#1667b8;color:#fff;text-decoration:none;}
.wcpt-menu-toggle{display:none;background:none;border:1px solid var(--border);border-radius:var(--radius-md);padding:8px 10px;cursor:pointer;}
@media (max-width:900px){
  .wcpt-nav{position:fixed;top:84px;left:0;right:0;bottom:0;background:var(--surface);
    flex-direction:column;align-items:flex-start;padding:var(--space-md);
    transform:translateX(100%);transition:transform .2s ease;overflow-y:auto;}
  .wcpt-nav.is-open{transform:translateX(0);}
  .wcpt-nav ul{flex-direction:column;gap:0;width:100%;}
  .wcpt-nav li{width:100%;border-bottom:1px solid var(--border);}
  .wcpt-nav a{display:block;padding:14px 0;}
  .wcpt-nav .sub-menu{position:static;border:none;padding-left:14px;display:block;}
  .wcpt-header-cta{margin-top:16px;width:100%;text-align:center;}
  .wcpt-menu-toggle{display:block;}
}

.btn{
  display:inline-block;padding:14px 26px;border-radius:var(--radius-md);
  font-weight:600;font-size:0.98rem;border:1px solid transparent;cursor:pointer;
}
.wcpt a.btn-primary,.wcpt a.btn-primary:visited,.wcpt a.btn-primary:active{background:var(--accent);color:#fff;}
.wcpt a.btn-primary:hover{background:#1667b8;color:#fff;text-decoration:none;}
.wcpt a.btn-secondary,.wcpt a.btn-secondary:visited,.wcpt a.btn-secondary:active{background:transparent;color:var(--ink);border-color:var(--ink);}
.wcpt a.btn-secondary:hover{background:var(--ink);color:#fff;text-decoration:none;}
.wcpt a.btn-on-dark-outline,.wcpt a.btn-on-dark-outline:visited,.wcpt a.btn-on-dark-outline:active{background:transparent;color:#fff;border-color:rgba(255,255,255,0.5);}
.wcpt a.btn-on-dark-outline:hover{background:rgba(255,255,255,0.1);color:#fff;text-decoration:none;}
button.btn-primary,button.btn-primary:active{color:#fff;}

.hero{background:var(--surface);border-bottom:1px solid var(--border);padding:var(--space-xl) 0;}
.hero-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:var(--space-lg);align-items:center;}
.hero-eyebrow{color:var(--accent);font-weight:600;font-size:0.85rem;margin-bottom:12px;}
.hero h1{margin-bottom:16px;}
.hero-sub{color:var(--muted);font-size:1.1rem;max-width:46ch;margin-bottom:28px;}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;}
.hero-media{
  aspect-ratio:4/3;background:linear-gradient(135deg,var(--ink) 0%,var(--accent) 100%);
  border-radius:var(--radius-md);
}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr;}
  .hero-media{order:-1;aspect-ratio:16/9;}
}

.section-head{max-width:62ch;margin-bottom:var(--space-md);}
.section-head p{color:var(--muted);}
.section-alt{background:var(--surface);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.section-dark{background:var(--ink);color:#fff;}
.section-dark h2,.section-dark h3{color:#fff;}
.section-dark p{color:#cfd8e1;}

.trust-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--space-md);}
.trust-item{padding:var(--space-md) 0;border-top:2px solid var(--ink);}
.trust-item strong{display:block;font-family:var(--font-heading);margin-bottom:4px;}
.trust-item span{color:var(--muted);font-size:0.92rem;}
@media (max-width:900px){.trust-grid{grid-template-columns:repeat(2,1fr);}}

.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-md);}
.service-card{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);
  overflow:hidden;display:flex;flex-direction:column;
}
.service-card-media{aspect-ratio:16\/10;background:linear-gradient(135deg,var(--ink) 0%,var(--accent) 100%);}
.service-card-media img{width:100%;height:100%;object-fit:cover;}
.service-card-body{padding:28px;display:flex;flex-direction:column;flex-grow:1;}
.service-card .num{color:var(--accent);font-family:var(--font-heading);font-weight:700;font-size:0.85rem;margin-bottom:12px;}
.service-card h3{margin-bottom:8px;}
.service-card p{color:var(--muted);flex-grow:1;margin-bottom:16px;}
.service-card a{font-weight:600;color:var(--ink);}
.service-card a:hover{color:var(--accent);}
@media (max-width:900px){.card-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.card-grid{grid-template-columns:1fr;}}

.process-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--space-md);}
.process-step{border-top:1px solid var(--border);padding-top:var(--space-sm);}
.process-step .step-num{font-family:var(--font-heading);font-weight:700;font-size:1.6rem;color:var(--accent);display:block;margin-bottom:8px;}
.process-step p{color:var(--muted);font-size:0.94rem;margin:0;}
@media (max-width:900px){.process-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.process-grid{grid-template-columns:1fr;}}

.consequence-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-md);}
.consequence-item{border-top:1px solid var(--border);padding-top:var(--space-sm);color:var(--muted);font-size:0.95rem;}
@media (max-width:900px){.consequence-grid{grid-template-columns:1fr 1fr;}}

.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-md);}
.project-card{border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;background:var(--surface);}
.project-media{aspect-ratio:4/3;background:linear-gradient(135deg,#dbe4ec,#c3d4e3);}
.project-body{padding:18px;}
.project-cat{color:var(--accent);font-size:0.82rem;font-weight:600;margin-bottom:6px;}
.project-body p{color:var(--muted);font-size:0.92rem;margin:0;}
@media (max-width:900px){.project-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.project-grid{grid-template-columns:1fr;}}

.cta-band{background:var(--ink);color:#fff;padding:var(--space-lg) 0;text-align:center;}
.cta-band h2{color:#fff;}
.cta-band p{color:#cfd8e1;max-width:56ch;margin:0 auto 24px;}

.faq-item{border-top:1px solid var(--border);padding:20px 0;}
.faq-item h3{margin-bottom:8px;font-size:1.05rem;}
.faq-item p{color:var(--muted);margin:0;}

.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-lg);align-items:start;}
.wcpt-form{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:28px;}
.wcpt-form label{display:block;font-weight:600;font-size:0.9rem;margin-bottom:6px;}
.wcpt-form input,.wcpt-form select,.wcpt-form textarea{
  width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:var(--radius-md);
  font-family:var(--font-body);font-size:1rem;margin-bottom:16px;background:#fff;color:var(--ink);
}
.wcpt-form textarea{min-height:120px;resize:vertical;}
.wcpt-form .btn-primary{width:100%;border:none;font-size:1rem;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.form-row > div{width:100%;}
.contact-info-item{border-top:1px solid var(--border);padding:18px 0;}
.contact-info-item strong{display:block;margin-bottom:4px;}
.contact-info-item span,.contact-info-item p{color:var(--muted);}
.form-msg{padding:14px 16px;border-radius:var(--radius-md);margin-bottom:16px;font-size:0.94rem;}
.form-msg.success{background:#e6f4ea;color:#1a6b34;border:1px solid #b6dfc2;}
.form-msg.error{background:#fbeaea;color:#a12a2a;border:1px solid #f0c4c4;}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr;} .form-row{grid-template-columns:1fr;}}

.wcpt-footer{background:var(--ink);color:#cfd8e1;padding:var(--space-lg) 0 var(--space-md);}\n.footer-logo-badge{display:inline-block;background:#fff;border-radius:var(--radius-md);padding:8px;line-height:0;margin-bottom:12px;}\n.footer-logo-badge img{display:block;height:76px;width:76px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:var(--space-md);margin-bottom:var(--space-md);}
.wcpt-footer h4{color:#fff;font-size:0.95rem;margin-bottom:14px;}
.wcpt-footer ul{list-style:none;padding:0;margin:0;}
.wcpt-footer li{margin-bottom:8px;}
.wcpt-footer a{color:#cfd8e1;font-size:0.92rem;}
.wcpt-footer a:hover{color:#fff;}
.footer-tagline{color:#9fb0bf;font-size:0.92rem;margin-top:8px;}
.footer-bottom{border-top:1px solid rgba(255,255,255,0.12);padding-top:18px;font-size:0.85rem;color:#9fb0bf;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;}
@media (max-width:900px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.footer-grid{grid-template-columns:1fr;}}

.wcpt-breadcrumbs{font-size:0.85rem;color:var(--muted);padding:16px 0;}
.wcpt-breadcrumbs a{color:var(--muted);}
.wcpt-breadcrumbs a:hover{color:var(--accent);}

.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-md);}
.blog-card{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);overflow:hidden;display:flex;flex-direction:column;}
.blog-card-media{aspect-ratio:16/9;background:linear-gradient(135deg,#dbe4ec,#c3d4e3);}
.blog-card-body{padding:20px;flex-grow:1;display:flex;flex-direction:column;}
.blog-card-body h3{font-size:1.08rem;}
.blog-card-body p{color:var(--muted);font-size:0.92rem;flex-grow:1;}
.blog-card-body a.btn{margin-top:auto;align-self:flex-start;padding:8px 16px;font-size:0.88rem;}
@media (max-width:900px){.blog-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.blog-grid{grid-template-columns:1fr;}}
.single-article{max-width:75ch;margin:0 auto;}
.single-article h2{margin-top:2em;}
.article-cta{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:24px;margin:2em 0;text-align:center;}

.text-center{text-align:center;}
