/* Cutler Bay Plumbing Service Pages
   No image URLs are stored in this CSS.
   Hero and content image paths are assigned inline in each HTML page. */

.service-page { background:#f3f7fb; }
.service-page .site-header { position:relative; z-index:20; }
.service-hero { position:relative; min-height:690px; display:flex; align-items:center; background-position:center; background-size:cover; background-repeat:no-repeat; overflow:hidden; }
.service-hero-overlay { position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,18,43,.95) 0%,rgba(3,18,43,.80) 48%,rgba(3,18,43,.32) 100%); }
.service-hero-content { position:relative; z-index:2; max-width:980px; padding:105px 0 115px; }
.service-page .eyebrow { font-family:Arial,sans-serif; font-size:12px; line-height:1; font-weight:900; letter-spacing:.18em; text-transform:uppercase; }
.service-hero .eyebrow { margin:0 0 18px; color:#9fd4ff; }
.service-hero h1 { max-width:1080px; margin:0; color:#fff; font-size:clamp(54px,7vw,100px); line-height:.92; letter-spacing:-.055em; font-weight:900; text-shadow:0 8px 30px rgba(0,0,0,.36); }
.service-hero p { max-width:850px; margin:28px 0 0; color:rgba(255,255,255,.96); font-family:Arial,sans-serif; font-size:21px; line-height:1.55; font-weight:700; text-shadow:0 5px 18px rgba(0,0,0,.34); }
.service-hero-actions { margin-top:34px; display:flex; gap:14px; flex-wrap:wrap; }
.service-hero .btn { min-height:56px; padding:18px 30px; border-radius:999px; font-family:Arial,sans-serif; font-size:16px; font-weight:900; line-height:1; }
.service-call-btn { background:#fff; color:#051b3d; border:1px solid rgba(255,255,255,.75); }
.service-call-btn:hover { background:#eaf5ff; color:#051b3d; }
.service-topic-nav { position:sticky; top:0; z-index:15; background:#fff; border-bottom:1px solid #d9e3ef; box-shadow:0 8px 25px rgba(8,47,99,.08); }
.service-topic-nav .container { display:flex; gap:22px; overflow-x:auto; padding-top:15px; padding-bottom:15px; }
.service-topic-nav a { color:#051b3d; font-weight:900; white-space:nowrap; text-decoration:none; }
.service-copy-section { padding:90px 0; background:#f3f7fb; }
.service-copy-section.service-white { background:#fff; }
.service-copy-section .container { max-width:1180px; }
.service-copy-section .eyebrow { color:#0a84e8; margin:0 0 12px; }
.service-copy-section h2 { color:#051b3d; font-size:clamp(32px,4vw,52px); line-height:1; letter-spacing:-.04em; margin:0 0 20px; }
.service-copy-section p { color:#1f2937; font-size:17px; line-height:1.78; }
.service-feature-card { display:grid; grid-template-columns:.9fr 1.1fr; gap:34px; align-items:stretch; background:#fff; border:1px solid #d9e3ef; border-radius:30px; padding:24px; box-shadow:0 24px 60px rgba(8,47,99,.15); }
.service-feature-image { min-height:430px; border-radius:22px; background-position:center; background-size:cover; background-repeat:no-repeat; }
.service-feature-copy { align-self:center; }
.service-text-list { margin-top:24px; display:grid; gap:10px; padding:0; list-style:none; }
.service-text-list li { position:relative; background:#f5f9fd; border:1px solid #d9e3ef; border-radius:12px; padding:12px 14px 12px 40px; }
.service-text-list li:before { content:'✓'; position:absolute; left:15px; color:#0a84e8; font-weight:900; }
.service-issue-grid { margin-top:36px; display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.service-issue-card { background:#fff; border:1px solid #d9e3ef; border-radius:22px; padding:28px; box-shadow:0 14px 34px rgba(8,47,99,.09); }
.service-issue-card h3 { color:#051b3d; font-size:24px; line-height:1.12; margin:0 0 12px; }
.service-issue-card p { margin:0; font-size:16px; line-height:1.7; }
.service-dark-section { padding:90px 0; background:radial-gradient(circle at top left,rgba(10,132,232,.22),transparent 34%),linear-gradient(135deg,#051b3d 0%,#082f63 100%); }
.service-dark-section .eyebrow { color:#9fd4ff; }
.service-dark-section h2,.service-dark-section p { color:#fff; }
.service-problem-list { margin-top:34px; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.service-problem-list div { background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.22); border-radius:16px; padding:18px 18px 18px 44px; min-height:82px; color:#fff; font-weight:900; position:relative; }
.service-problem-list div:before { content:'✓'; position:absolute; left:18px; top:18px; color:#9fd4ff; }
.service-proof-grid { margin-top:30px; display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.service-proof-card { background:#fff; border:1px solid #d9e3ef; border-radius:20px; padding:24px; box-shadow:0 14px 32px rgba(8,47,99,.08); }
.service-proof-card strong { display:block; color:#051b3d; font-size:20px; margin-bottom:8px; }
.service-proof-card span { color:#445064; line-height:1.55; }
.service-cta-band { position:relative; min-height:340px; display:flex; align-items:center; background-position:center; background-size:cover; background-repeat:no-repeat; overflow:hidden; }
.service-cta-band:before { content:''; position:absolute; inset:0; background:rgba(3,18,43,.78); }
.service-cta-band .container { position:relative; z-index:2; }
.service-cta-band .eyebrow,.service-cta-band h2 { color:#fff; }
.service-cta-band h2 { max-width:920px; font-size:clamp(30px,4vw,48px); line-height:1.04; letter-spacing:-.035em; margin:0; }
.service-faq-grid { margin-top:34px; display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
.service-faq-card { background:#fff; border:1px solid #d9e3ef; border-radius:18px; padding:24px; box-shadow:0 12px 28px rgba(8,47,99,.08); }
.service-faq-card h3 { color:#051b3d; font-size:21px; margin:0 0 10px; }
.service-faq-card p { font-size:16px; margin:0; }
.service-contact-section { padding:90px 0; background:#eef5fc; }
.service-contact-section .contact-box { background:#051b3d; border-radius:28px; padding:42px; box-shadow:0 24px 60px rgba(8,47,99,.22); }
.service-contact-section .eyebrow,.service-contact-section h2,.service-contact-section p { color:#fff; }
.service-contact-section .contact-info a,.service-contact-section .contact-info span { background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18); color:#fff; }
.service-copy-section p a { color:#006fd6; font-weight:900; text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px; }
.service-copy-section p a:hover { color:#051b3d; background:#eaf5ff; }
@media(max-width:980px){.service-feature-card{grid-template-columns:1fr}.service-issue-grid,.service-problem-list{grid-template-columns:repeat(2,1fr)}.service-proof-grid,.service-faq-grid{grid-template-columns:1fr}}
@media(max-width:620px){.service-hero{min-height:560px}.service-hero-content{padding:76px 0}.service-hero h1{font-size:clamp(44px,13vw,64px)}.service-hero p{font-size:17px}.service-copy-section,.service-dark-section{padding:62px 0}.service-issue-grid,.service-problem-list{grid-template-columns:1fr}.service-feature-card{padding:18px;border-radius:22px}.service-feature-image{min-height:280px}.service-contact-section .contact-box{padding:28px}}
