/* Jensen Beach Concrete Pros — poured-panel skeleton · BUILD JBC-SITE-v1.0 */
:root{
  --slab:#E9E8E3; --panel:#FBFAF7; --charcoal:#282824; --mid:#6E6C64;
  --joint:#C9C7BF; --mark:#E4551F; --mark-dark:#C24417; --footer:#1E1E1B;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Public Sans',system-ui,sans-serif;background:var(--slab);color:var(--charcoal);line-height:1.6;font-size:16.5px}
.broom{background-image:repeating-linear-gradient(90deg, rgba(40,40,36,0.025) 0 1px, transparent 1px 7px)}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
h1,h2,.display{font-family:'Anton',sans-serif;font-weight:400;letter-spacing:.01em;text-transform:uppercase;line-height:1.08}
h1{font-size:clamp(1.9rem,6vw,3.2rem)}
h2{font-size:clamp(1.4rem,4vw,2rem);margin-bottom:.75rem}
h3{font-size:1.08rem;font-weight:700;margin-bottom:.4rem}
p{margin-bottom:1rem}
a{color:inherit}
.mono{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mid)}
.joint{display:flex;align-items:center;gap:14px;padding:2.6rem 0 1.4rem}
.joint::before,.joint::after{content:"";flex:1;border-top:3px solid var(--charcoal);border-bottom:1px solid var(--joint);height:5px}
.joint span{white-space:nowrap;color:var(--charcoal);font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase}
header{background:var(--panel);border-bottom:3px solid var(--charcoal);position:sticky;top:0;z-index:50}
.nav{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.brand{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:1.02rem;letter-spacing:.02em;text-decoration:none}
.brand em{font-style:normal;color:var(--mark)}
.navlinks{display:none;gap:20px;font-size:.9rem;font-weight:600}
.navlinks a{text-decoration:none}
.navlinks a:hover{color:var(--mark-dark)}
.headphone{text-decoration:none;background:var(--mark);color:#fff;font-weight:700;padding:9px 15px;font-size:.9rem;border:2px solid var(--charcoal);box-shadow:3px 3px 0 var(--charcoal)}
.headphone:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--charcoal)}
@media(min-width:880px){.navlinks{display:flex}}
.hero{padding:2.4rem 0 2.6rem}
.hero-grid{display:grid;gap:2rem}
@media(min-width:880px){.hero-grid{grid-template-columns:1.15fr .85fr;gap:3rem;align-items:start}}
.hero .mono{display:block;margin-bottom:.9rem;color:var(--mark-dark)}
.hero p.lead{font-size:1.05rem;margin-top:1.1rem}
.page-hero{padding:2.4rem 0 1.2rem}
.page-hero .mono{display:block;margin-bottom:.8rem;color:var(--mark-dark)}
.page-hero p.lead{font-size:1.05rem;margin-top:1rem;max-width:760px}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:1.3rem}
.btn{display:inline-block;text-decoration:none;font-weight:700;font-size:1rem;padding:13px 22px;border:2px solid var(--charcoal)}
.btn-call{background:var(--mark);color:#fff;box-shadow:4px 4px 0 var(--charcoal)}
.btn-quote{background:var(--panel);color:var(--charcoal);box-shadow:4px 4px 0 var(--charcoal)}
.btn:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--charcoal)}
.slab-panel{background:var(--panel);border:2px solid var(--charcoal);clip-path:polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 0 100%);padding:1.4rem 1.3rem 1.5rem;position:relative}
.slab-panel::before{content:"";position:absolute;top:0;right:0;width:22px;height:22px;background:linear-gradient(135deg, transparent 49%, var(--charcoal) 50%)}
.qform label{display:block;font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin:12px 0 4px}
.qform input,.qform select,.qform textarea{width:100%;padding:11px 12px;font-size:1rem;font-family:inherit;border:2px solid var(--charcoal);background:#fff}
.qform textarea{min-height:84px;resize:vertical}
.qform button{margin-top:16px;width:100%;cursor:pointer;background:var(--charcoal);color:#fff;font-weight:700;font-size:1.02rem;padding:14px;border:2px solid var(--charcoal)}
.qform button:hover{background:var(--mark)}
.qform .fine{font-size:.74rem;color:var(--mid);margin-top:10px;line-height:1.45}
.svc-grid{display:grid;gap:16px;margin-top:1.2rem}
@media(min-width:640px){.svc-grid{grid-template-columns:1fr 1fr}}
@media(min-width:980px){.svc-grid{grid-template-columns:1fr 1fr 1fr}}
.svc{padding:1.2rem 1.15rem 1.25rem}
.svc .mono{display:block;margin-bottom:.5rem;color:var(--mark-dark)}
.svc p{font-size:.94rem;margin-bottom:.7rem}
.svc a{font-weight:700;font-size:.9rem;color:var(--mark-dark);text-decoration:none;border-bottom:2px solid var(--mark)}
.tier-grid{display:grid;gap:16px;margin-top:1.2rem}
@media(min-width:760px){.tier-grid{grid-template-columns:1fr 1fr}}
.tier{padding:1.3rem 1.25rem}
.tier .tag{display:inline-block;font-family:'IBM Plex Mono',monospace;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;background:var(--charcoal);padding:4px 10px;margin-bottom:.8rem}
.tier.b .tag{background:var(--mark)}
.local{display:grid;gap:1.6rem}
@media(min-width:860px){.local{grid-template-columns:1fr 1fr;gap:2.4rem}}
.local ul,.marklist{list-style:none;margin-top:.3rem}
.local li,.marklist li{padding:12px 0 12px 26px;border-bottom:1px solid var(--joint);position:relative;font-size:.97rem}
.local li::before,.marklist li::before{content:"";position:absolute;left:0;top:19px;width:12px;height:12px;background:var(--mark);clip-path:polygon(0 0,100% 0,100% 70%,70% 100%,0 100%)}
.local li strong,.marklist li strong{display:block}
.prose{max-width:760px}
.faq{margin-top:1rem}
.faq details{background:var(--panel);border:2px solid var(--charcoal);margin-bottom:10px}
.faq summary{cursor:pointer;font-weight:700;padding:15px 16px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq summary::after{content:"+";font-family:'Anton',sans-serif;font-size:1.2rem;color:var(--mark-dark)}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 16px 15px;font-size:.96rem;margin:0}
.final{background:var(--charcoal);color:#fff;padding:3rem 0;margin-top:3rem;background-image:repeating-linear-gradient(90deg, rgba(255,255,255,0.03) 0 1px, transparent 1px 7px)}
.final h2{color:#fff}
.final p{color:#D8D6CE;max-width:640px}
.final .btn-call{box-shadow:4px 4px 0 var(--mark-dark)}
.final .btn-quote{background:transparent;color:#fff;border-color:#fff;box-shadow:4px 4px 0 var(--mark-dark)}
footer{background:var(--footer);color:#B9B7AF;font-size:.85rem;padding:2.4rem 0 5.5rem}
footer .cols{display:grid;gap:1.6rem;margin-bottom:1.8rem}
@media(min-width:760px){footer .cols{grid-template-columns:1.2fr 1fr 1fr}}
footer h4{color:#fff;font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.6rem}
footer a{color:#B9B7AF;text-decoration:none;display:block;padding:3px 0}
footer a:hover{color:#fff}
.disclosure{border-top:1px solid #3A3A35;padding-top:1.2rem;font-size:.78rem;line-height:1.55}
.buildstamp{margin-top:1rem;font-family:'IBM Plex Mono',monospace;font-size:.68rem;color:#6E6C64}
.callbar{position:fixed;bottom:0;left:0;right:0;z-index:60;display:flex;background:var(--charcoal);border-top:3px solid var(--mark)}
.callbar a{flex:1;text-align:center;padding:15px 8px;font-weight:700;font-size:.95rem;text-decoration:none;color:#fff}
.callbar a.c{background:var(--mark)}
@media(min-width:880px){.callbar{display:none} footer{padding-bottom:2.4rem}}
img.ph{width:100%;display:block;border:2px solid var(--charcoal);background:#D6D4CC;object-fit:cover;aspect-ratio:16/10}
.legal{max-width:760px;font-size:.95rem}
.legal h2{font-size:1.2rem;margin-top:1.6rem}
.brand-with-logo{display:inline-flex;align-items:center;gap:10px;line-height:1.05}.brand-with-logo img{width:44px;height:44px;object-fit:contain;display:block;flex:0 0 44px;border-radius:0}.brand-with-logo span{display:inline-block}@media(max-width:640px){.brand-with-logo img{width:38px;height:38px;flex-basis:38px}}
