/* United Epoxy Pros — site styles. Self-contained; only external dependency is Google Fonts (loaded per page). */
:root{
  --navy:#0e1f3a;        /* deep navy */
  --navy-2:#13294d;
  --navy-3:#1c3a63;
  --steel:#8a97a8;       /* metallic/industrial gray */
  --steel-light:#c7d0db;
  --silver:#e9edf2;
  --accent:#c48a2b;      /* warm metallic/bronze accent */
  --accent-2:#e0a94a;
  --ink:#1a2535;
  --muted:#5a6676;
  --white:#ffffff;
  --line:#dfe4ea;
  --radius:10px;
  --maxw:1180px;
  --shadow:0 6px 24px rgba(14,31,58,.10);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--ink);background:var(--white);line-height:1.6;font-size:17px;
}
h1,h2,h3,h4{font-family:'Barlow Condensed','Inter',sans-serif;line-height:1.1;letter-spacing:.2px;margin:0 0 .5em;}
h1{font-size:clamp(2.1rem,5vw,3.4rem);font-weight:700;text-transform:uppercase;}
h2{font-size:clamp(1.6rem,3.5vw,2.3rem);font-weight:700;color:var(--navy);text-transform:uppercase;}
h3{font-size:1.25rem;font-weight:600;color:var(--navy);}
h4{font-size:1.05rem;text-transform:uppercase;letter-spacing:.5px;color:var(--navy);}
a{color:var(--navy-3);text-decoration:none;}
a:hover{color:var(--accent);}
p{margin:0 0 1em;}
img{max-width:100%;display:block;}
.container{max-width:var(--maxw);margin:0 auto;padding:0 20px;}
.narrow{max-width:820px;}
.center{text-align:center;}
.section{padding:64px 0;}
.section-alt{background:var(--silver);}
.section-dark{background:var(--navy);color:#eaf0f8;}
.section-dark h2{color:#fff;}
.lead{font-size:1.2rem;color:var(--muted);}
.section .sub{color:var(--muted);margin-bottom:28px;}

/* ---------- Buttons ---------- */
.btn{display:inline-block;padding:13px 24px;border-radius:var(--radius);font-weight:600;
  font-size:.98rem;cursor:pointer;border:2px solid transparent;transition:.15s;text-align:center;}
.btn-lg{padding:16px 30px;font-size:1.05rem;}
.btn-block{display:block;width:100%;}
.btn-primary{background:var(--accent);color:#1a1205;border-color:var(--accent);}
.btn-primary:hover{background:var(--accent-2);color:#1a1205;}
.btn-ghost{background:transparent;color:var(--navy);border-color:var(--steel-light);}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent);}
.btn-ghost-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.6);}
.btn-ghost-light:hover{background:rgba(255,255,255,.12);color:#fff;border-color:#fff;}
.btn-outline{background:transparent;color:var(--navy);border-color:var(--navy);}
.btn-outline:hover{background:var(--navy);color:#fff;}
.btn-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:18px;}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:var(--white);box-shadow:0 2px 12px rgba(14,31,58,.08);}
.topbar{display:flex;align-items:center;gap:18px;max-width:var(--maxw);margin:0 auto;padding:12px 20px;}
.logo{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:1.5rem;letter-spacing:1px;
  color:var(--navy);text-transform:uppercase;line-height:1;white-space:nowrap;}
.logo span{color:var(--accent);}
.main-nav{display:flex;align-items:center;gap:4px;margin-left:auto;}
.main-nav>a,.has-sub>a{display:block;padding:10px 12px;font-weight:600;color:var(--ink);font-size:.96rem;border-radius:6px;}
.main-nav>a:hover,.has-sub>a:hover{background:var(--silver);color:var(--navy);}
.main-nav a.active{color:var(--accent);}
.has-sub{position:relative;}
.submenu{position:absolute;top:100%;left:0;background:#fff;box-shadow:var(--shadow);border-radius:8px;
  min-width:240px;padding:8px;display:none;flex-direction:column;border:1px solid var(--line);}
.submenu a{padding:9px 12px;border-radius:6px;font-size:.92rem;color:var(--ink);}
.submenu a:hover{background:var(--silver);color:var(--navy);}
.has-sub:hover .submenu{display:flex;}
.header-cta{display:flex;align-items:center;gap:10px;}
.nav-toggle{display:none;background:none;border:none;font-size:1.6rem;color:var(--navy);cursor:pointer;margin-left:auto;}
.trust-strip{background:var(--navy);color:var(--steel-light);font-size:.82rem;text-align:center;
  padding:7px 20px;letter-spacing:.3px;}
.trust-strip .badge-ph{display:inline-block;margin-left:10px;color:var(--steel);font-style:italic;}

/* ---------- Hero ---------- */
.hero{background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 55%,var(--navy-3) 100%);
  color:#fff;position:relative;overflow:hidden;}
.hero:before{content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 2px,transparent 2px 22px);}
.hero-inner{max-width:var(--maxw);margin:0 auto;padding:90px 20px;position:relative;}
.hero h1{color:#fff;max-width:16ch;}
.hero-sub{font-size:1.25rem;color:var(--steel-light);max-width:60ch;margin-bottom:6px;}

/* ---------- Page hero (interior) ---------- */
.page-hero{background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff;padding:56px 0;}
.page-hero h1{color:#fff;}
.page-hero .lead{color:var(--steel-light);}

/* ---------- Value tiles ---------- */
.value-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:30px;}
.tile{background:#fff;border:1px solid var(--line);border-top:4px solid var(--accent);
  border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);}
.tile h3{margin-bottom:.4em;}
.tile p{margin:0;color:var(--muted);font-size:.96rem;}

/* ---------- Service cards ---------- */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:10px;}
.svc-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  box-shadow:var(--shadow);display:flex;flex-direction:column;transition:.15s;}
.svc-card:hover{transform:translateY(-3px);border-color:var(--accent);}
.svc-card-img{background:linear-gradient(135deg,var(--navy-3),var(--steel));color:#fff;
  min-height:120px;display:flex;align-items:center;justify-content:center;text-align:center;
  font-size:.8rem;padding:14px;font-style:italic;}
.svc-card h3{margin:16px 18px 6px;}
.svc-card p{margin:0 18px;color:var(--muted);font-size:.95rem;flex:1;}
.svc-more{display:block;margin:14px 18px 18px;font-weight:600;color:var(--accent);}

/* ---------- Process ---------- */
.process{list-style:none;counter-reset:step;padding:0;margin:26px auto 0;max-width:760px;}
.process li{display:flex;gap:16px;align-items:flex-start;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.12);}
.process .step-n{flex:none;width:40px;height:40px;border-radius:50%;background:var(--accent);
  color:#1a1205;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:1.1rem;}
.process li div{padding-top:6px;}

/* ---------- Audience band ---------- */
.audience-band{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:20px;}
.aud{background:var(--silver);border-radius:var(--radius);padding:24px;}
.aud h3{color:var(--navy);}
.aud p{color:var(--muted);}

/* ---------- Service detail layout ---------- */
.service-layout,.area-layout{display:grid;grid-template-columns:1fr 320px;gap:40px;align-items:start;}
.service-aside{position:sticky;top:120px;}
.aside-nav{display:flex;flex-direction:column;gap:2px;margin-bottom:24px;}
.aside-nav a{padding:10px 12px;border-radius:6px;background:var(--silver);color:var(--ink);font-size:.92rem;}
.aside-nav a:hover,.aside-nav a.active{background:var(--navy);color:#fff;}
.aside-card{background:var(--navy);color:#eaf0f8;border-radius:var(--radius);padding:22px;}
.aside-card h4{color:#fff;}
.aside-card p{color:var(--steel-light);font-size:.92rem;}
.great-for{background:var(--silver);border-left:4px solid var(--accent);padding:12px 16px;border-radius:0 8px 8px 0;}
.check-list{list-style:none;padding:0;}
.check-list li{padding:8px 0 8px 30px;position:relative;border-bottom:1px solid var(--line);}
.check-list li:before{content:"\2714";position:absolute;left:0;color:var(--accent);font-weight:700;}

/* ---------- Gallery ---------- */
.gal-filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px;}
.filter{padding:8px 16px;border:1px solid var(--line);border-radius:30px;font-size:.9rem;color:var(--muted);background:#fff;cursor:default;}
.filter.active{background:var(--navy);color:#fff;border-color:var(--navy);}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.gal-tile{margin:0;}
.gal-ph{min-height:180px;}
.gal-tile figcaption{margin-top:8px;font-size:.9rem;color:var(--muted);font-style:italic;}

/* ---------- Placeholders / notes ---------- */
.placeholder-box{background:repeating-linear-gradient(45deg,#eef1f5,#eef1f5 12px,#e6eaf0 12px,#e6eaf0 24px);
  border:2px dashed var(--steel);border-radius:8px;color:#56657a;padding:22px;text-align:center;
  font-size:.88rem;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0 0 16px;}
.placeholder-box.wide{min-height:150px;}
.placeholder-inline{color:#8a5a00;background:#fbf4e6;border:1px dashed #d9a94a;
  padding:1px 6px;border-radius:4px;font-size:.85em;font-style:italic;}
.note-box{background:#fbf4e6;border-left:4px solid var(--accent);padding:14px 18px;border-radius:0 8px 8px 0;
  font-size:.92rem;color:#5a4a22;margin:18px 0;}
.callout{background:var(--silver);border-radius:var(--radius);padding:22px 24px;margin:22px 0;border-left:4px solid var(--navy);}
.promise{font-size:1.1rem;}

/* ---------- CTA band ---------- */
.cta-band{background:linear-gradient(135deg,var(--accent) 0%,var(--accent-2) 100%);text-align:center;padding:52px 20px;}
.cta-band h2{color:#1a1205;margin-bottom:.2em;}
.cta-band p{color:#3a2b08;font-size:1.1rem;margin-bottom:6px;}
.cta-band .btn-row{justify-content:center;}
.cta-band .btn-ghost-light{color:#1a1205;border-color:#1a1205;}
.cta-band .btn-ghost-light:hover{background:rgba(0,0,0,.08);color:#1a1205;}

/* ---------- Audience / areas grids ---------- */
.area-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.area-card{background:var(--navy);color:#fff;border-radius:var(--radius);padding:28px 16px;text-align:center;
  font-family:'Barlow Condensed',sans-serif;font-size:1.3rem;font-weight:600;text-transform:uppercase;transition:.15s;}
.area-card:hover{background:var(--accent);color:#1a1205;}
.link-list{columns:2;list-style:none;padding:0;}
.link-list li{padding:6px 0;}

/* ---------- Quote form ---------- */
.quote-form{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow);}
.quote-form label{display:block;margin-bottom:16px;font-weight:600;font-size:.95rem;color:var(--navy);}
.quote-form input,.quote-form select,.quote-form textarea{
  width:100%;margin-top:6px;padding:11px 12px;border:1px solid var(--line);border-radius:8px;
  font:inherit;font-weight:400;color:var(--ink);background:#fff;}
.quote-form input:focus,.quote-form select:focus,.quote-form textarea:focus{outline:2px solid var(--accent);border-color:var(--accent);}
.quote-form .req{color:#c0392b;}
.quote-form .consent{font-weight:400;display:flex;gap:10px;align-items:flex-start;}
.quote-form .consent input{width:auto;margin-top:4px;}
.form-note{background:#fbf4e6;border:1px dashed #d9a94a;border-radius:8px;padding:12px 14px;
  font-size:.88rem;color:#5a4a22;margin-bottom:20px;font-weight:400;}
.file-ph{font-weight:400;}
.fineprint{font-size:.82rem;color:var(--muted);font-weight:400;}
.after-submit{margin-top:18px;color:var(--muted);font-style:italic;}
.reassurance{margin-top:8px;font-weight:600;color:var(--navy);text-align:center;}

/* ---------- Contact ---------- */
.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;}
.call-hero{display:flex;flex-direction:column;gap:6px;background:var(--navy);color:#fff;border-radius:var(--radius);
  padding:30px;text-align:center;margin-bottom:18px;}
.call-hero:hover{background:var(--navy-3);color:#fff;}
.call-label{font-size:1rem;color:var(--steel-light);text-transform:uppercase;letter-spacing:1px;}
.call-number{font-family:'Barlow Condensed',sans-serif;font-size:2.4rem;font-weight:700;color:var(--accent-2);}
.call-hero .placeholder-inline{background:transparent;border:none;color:var(--steel);}
.detail-list{list-style:none;padding:0;}
.detail-list li{padding:10px 0;border-bottom:1px solid var(--line);}

/* ---------- Footer ---------- */
.site-footer{background:#0a1628;color:#b8c3d1;font-size:.92rem;}
.footer-grid{max-width:var(--maxw);margin:0 auto;padding:48px 20px 28px;
  display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:34px;}
.foot-logo{font-size:1.4rem;color:#fff;margin-bottom:12px;}
.site-footer h4{color:#fff;margin-bottom:12px;}
.site-footer ul{list-style:none;padding:0;margin:0;}
.site-footer li{padding:4px 0;}
.site-footer a{color:#b8c3d1;}
.site-footer a:hover{color:var(--accent-2);}
.nap{color:#9fb0c2;}
.hours{color:#9fb0c2;font-size:.86rem;}
.social{font-size:.86rem;color:#9fb0c2;}
.footer-trust{background:#07101f;}
.copyright{text-align:center;padding:16px 20px;font-size:.82rem;color:#7a8aa0;border-top:1px solid rgba(255,255,255,.07);}
.site-footer .placeholder-inline{color:#d9a94a;background:transparent;border-color:#5a4a22;}

/* ---------- Mobile call bar ---------- */
.mobile-callbar{display:none;position:fixed;bottom:0;left:0;right:0;z-index:60;
  background:var(--navy);box-shadow:0 -2px 12px rgba(0,0,0,.25);}
.mobile-callbar a{flex:1;text-align:center;padding:14px 8px;color:#fff;font-weight:700;font-size:1rem;}
.mobile-callbar .mc-quote{background:var(--accent);color:#1a1205;}

/* ---------- Responsive ---------- */
@media(max-width:980px){
  .value-tiles,.svc-grid,.gallery-grid{grid-template-columns:repeat(2,1fr);}
  .audience-band{grid-template-columns:1fr;}
  .service-layout,.area-layout,.contact-layout{grid-template-columns:1fr;}
  .service-aside{position:static;}
  .area-grid{grid-template-columns:repeat(3,1fr);}
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:760px){
  body{font-size:16px;}
  .nav-toggle{display:block;}
  .header-cta{display:none;}
  .main-nav{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;
    align-items:stretch;padding:10px;box-shadow:var(--shadow);border-top:1px solid var(--line);}
  body.nav-open .main-nav{display:flex;}
  .main-nav>a,.has-sub>a{padding:12px;}
  .has-sub .submenu{position:static;display:flex;box-shadow:none;border:none;padding:0 0 0 14px;min-width:0;}
  .has-sub:hover .submenu{display:flex;}
  .area-grid,.value-tiles,.svc-grid,.gallery-grid{grid-template-columns:1fr;}
  .link-list{columns:1;}
  .footer-grid{grid-template-columns:1fr;}
  .mobile-callbar{display:flex;}
  body{padding-bottom:54px;} /* room for sticky call bar */
  .hero-inner{padding:60px 20px;}
}

/* hide empty image placeholders until real photos are added */
.placeholder-box:empty,.svc-card-img:empty{display:none!important}

.placeholder-box:has(img),.svc-card-img:has(img){border:0!important;padding:0!important;background:none!important}