:root{--ink:#10202e;--navy:#101f2b;--navy2:#172f40;--blue:#166bba;--sky:#eaf3fb;--muted:#536777;--gold:#d2a35a;--line:#dfE7ef;--white:#fff;--max:1180px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.6}a{color:var(--blue)}a:hover{text-decoration:underline}img{max-width:100%;height:auto;display:block}button,input,textarea,select{font:inherit}button,.button{cursor:pointer}.wrap{max-width:var(--max);padding:0 22px;margin:auto}h1,h2,h3{font-family:system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.16;letter-spacing:-.025em;margin:0 0 .65em}h1{font-size:clamp(2.3rem,5.4vw,4.75rem);max-width:900px}h2{font-size:clamp(1.65rem,3vw,2.55rem)}h3{font-size:1.2rem}p{margin:0 0 1.1rem}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.76rem;font-weight:800;color:var(--blue)}
.topbar{background:#092238;color:#fff}.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:9px 22px}.topbar a{color:#fff;font-weight:700;text-decoration:none}.topbar .topcontact{background:#eab86d;color:#172534;padding:8px 17px;border-radius:6px}.topbar .phone{white-space:nowrap}
.header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:84px}.brand{text-decoration:none;display:flex;align-items:center;gap:12px;min-width:0}.brand img{max-width:235px;max-height:72px;object-fit:contain}.nav{display:flex;align-items:center;flex-wrap:wrap;gap:5px}.nav a{color:#142b3d;text-decoration:none;font-size:.88rem;font-weight:650;padding:12px 9px;border-radius:6px}.nav a:hover,.nav a[aria-current=page]{background:var(--sky);color:#0b5f9f}
.hero{background:linear-gradient(125deg,#f1f6fa,#fff 57%);padding:65px 0 55px}.hero-inner{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}.hero p{font-size:1.08rem;color:var(--muted);max-width:620px}.hero figure{margin:0}.hero img{width:100%;aspect-ratio:5/4;object-fit:cover;border-radius:14px;box-shadow:0 17px 45px #10283922}.actions{display:flex;flex-wrap:wrap;gap:12px;margin:25px 0}.button{display:inline-flex;text-align:center;align-items:center;justify-content:center;text-decoration:none;background:var(--blue);color:#fff;border-radius:6px;padding:13px 20px;font-weight:750;border:2px solid var(--blue)}.button:hover{background:#084b87;color:#fff;text-decoration:none}.button.secondary{background:transparent;color:var(--blue)}.button.secondary:hover{background:#e2eef9}.micro{font-size:.88rem!important;color:#5b6d7b}
.section{padding:68px 0}.section.alt{background:#f5f8fb}.section.compact{padding:42px 0}.lead{font-size:1.08rem;color:var(--muted);max-width:750px}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.card{display:flex;flex-direction:column;padding:25px;border:1px solid var(--line);border-radius:10px;background:#fff}.card h3{margin:0 0 10px}.card p{color:var(--muted);font-size:.94rem}.card a{margin-top:auto;font-weight:750}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:40px}.copy{max-width:800px}.copy p{color:#3d5364}.copy h2{margin-top:28px}.contact{background:#0d2537;color:#fff}.contact p,.contact .lead{color:#d6e1eb}.contact a{color:#b7deff}.contact .eyebrow{color:#e8b76e}.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px}.form{display:grid;gap:12px}.form label{font-size:.86rem;font-weight:650}.form input,.form textarea{display:block;margin-top:4px;width:100%;border:1px solid #b9c7d3;border-radius:6px;padding:12px;background:#fff;color:#152d40}.form textarea{min-height:110px}.form .button{width:fit-content}.footer{background:#081a28;color:#bbc9d5;padding:36px 0}.footer a{color:#e2f0fb}.footer .footlinks{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:14px}.footer p{margin:0;font-size:.9rem}.gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.gallery-grid figure{margin:0}.gallery-grid img{aspect-ratio:4/3;width:100%;object-fit:cover;border-radius:9px;transition:transform .15s}.gallery-grid a:hover img{transform:scale(1.018)}.gallery-grid figcaption{font-size:.85rem;color:var(--muted);margin-top:7px}.gallery-grid a{display:block}.service-list{columns:2;column-gap:25px}.service-list li{break-inside:avoid;margin-bottom:7px}.breadcrumb{font-size:.82rem;color:var(--muted);margin:0 0 18px}.breadcrumb a{color:var(--muted)}.notice{background:#f2f7fb;border-left:4px solid var(--blue);padding:14px 20px;color:#354c5d}.navdetails{display:none}
@media(max-width:1000px){.header-inner{align-items:flex-start;flex-direction:column;gap:4px;padding-top:12px;padding-bottom:13px;min-height:auto}.nav{gap:2px}.hero-inner{gap:27px}.cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.topbar-inner{padding:8px 16px}.topbar .phone{font-size:.84rem}.brand img{max-width:210px}.header-inner{flex-direction:row;align-items:center;gap:10px}.nav{display:none}.navdetails{display:block;position:relative;margin-left:auto}.navdetails summary{font-size:.9rem;font-weight:800;border:1px solid #c9d4dc;border-radius:6px;padding:8px 12px;cursor:pointer;list-style:none}.navdetails[open] .mobnav{position:absolute;right:0;top:42px;display:flex;flex-direction:column;gap:0;min-width:225px;max-height:74vh;overflow:auto;background:#fff;border:1px solid var(--line);box-shadow:0 8px 24px #001a2c25;border-radius:8px;padding:8px;z-index:12}.mobnav a{display:block;color:var(--ink);text-decoration:none;padding:10px 12px;font-weight:650}.hero{padding:33px 0}.hero-inner,.two-col,.contact-grid{grid-template-columns:1fr;gap:25px}.hero figure{grid-row:2}.hero img{aspect-ratio:16/10}.section{padding:44px 0}.cards{grid-template-columns:1fr 1fr;gap:12px}.card{padding:16px}.gallery-grid{grid-template-columns:repeat(2,1fr)}.service-list{columns:1}}
@media(max-width:420px){.cards,.gallery-grid{grid-template-columns:1fr}.topbar-inner{gap:7px}.topbar .topcontact{padding:7px 10px}.hero img{aspect-ratio:4/3}}

/* Revision 2: Oversized brand masthead + streamlined navigation */
.header{position:relative;top:auto}
.header-inner{min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding-top:14px;padding-bottom:12px}
.brand{justify-content:center;width:min(100%,540px);margin:0 auto 4px}
.brand img{width:min(100%,470px);max-width:470px;max-height:none;height:auto;object-fit:contain}
.nav{justify-content:center;gap:6px;width:100%;border-top:1px solid var(--line);padding-top:7px}
.nav a{font-size:.91rem;padding:10px 12px}
.footer .wrap{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}
.footer .footlinks{justify-content:center;margin:0;gap:12px 25px}
.footer .footlinks a{text-decoration:none;font-weight:650}
.footer .footlinks a:hover{text-decoration:underline}
@media(max-width:1000px){.header-inner{flex-direction:column;align-items:center;gap:5px;padding-top:14px}.nav{justify-content:center}}
@media(max-width:700px){.header-inner{flex-direction:row;justify-content:space-between;align-items:center;gap:8px;padding-top:8px;padding-bottom:8px}.brand{width:min(72%,320px);margin:0}.brand img{width:100%;max-width:320px}.nav{display:none}.navdetails{display:block}.topbar-inner{gap:8px}}
@media(max-width:390px){.topbar .phone{font-size:.75rem}.brand{width:66%}}

/* REVISION 3 — edge-to-edge Dallas Metal Roofs branded header, responsive */
.header{background:#07131f;border:0;position:relative}
.header-inner{max-width:none;padding:0;display:block;min-height:0}
.header .brand{display:block;position:relative;width:100%;max-width:none;margin:0;line-height:0}
.header .brand img{width:100%;height:auto;max-width:none;max-height:none;object-fit:contain;display:block}
.header .nav{background:#fff;display:flex;justify-content:center;flex-wrap:wrap;width:100%;margin:0;border-bottom:1px solid var(--line);padding:6px 12px}
.header .nav a{font-size:.91rem;padding:11px 13px}
.header .navdetails{margin:0}
.reviews-section{background:#f2f6fa;padding:62px 0}
.review-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:24px 0}
.review-card{background:#fff;border:1px solid #dce7f0;border-radius:12px;padding:22px;box-shadow:0 6px 22px #11263e0b}
.review-card .stars{color:#c38921;font-size:1.3rem;letter-spacing:.04em}
.review-card p{color:#364d5e;font-size:.98rem;margin:12px 0}
.review-card strong{color:#172b39}
.review-intro{max-width:780px}
.review-actions{display:flex;gap:12px;flex-wrap:wrap}
@media(max-width:700px){.header-inner{display:block;padding:0}.header .brand{width:100%;max-width:none}.header .brand img{width:100%;max-width:none}.header .nav{display:none}.header .navdetails{display:block;position:absolute;right:12px;bottom:10px;z-index:15;background:#fff;border-radius:7px;padding:4px}.review-cards{grid-template-columns:1fr}}

/* Revision 4 - Shingle and storm restoration services */
.service-strip{background:#e9f2fa;border-bottom:1px solid #ccddeb;color:#152f43;padding:12px 0;font-size:.96rem}
.service-strip .wrap{max-width:1180px}
.service-strip a{font-weight:700;margin-left:8px}
.cards-three{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:700px){.service-strip{font-size:.86rem}.cards-three{grid-template-columns:1fr}}

/* Revision 5 — DFW completed project map */
.project-map-stage{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#f3f6f9;margin:25px 0}.project-map-head{background:#e9f0f7;padding:20px 24px}.project-map-stage iframe{display:block;width:100%;height:clamp(430px,62vw,680px);border:0}.project-map-placeholder{padding:32px 24px;min-height:260px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:12px}.project-map-placeholder p{max-width:720px}.project-map-placeholder button:disabled{opacity:.55;cursor:not-allowed}.project-map-notice{font-size:.9rem;color:var(--muted)}.map-steps{background:#f3f7fa;border:1px solid var(--line);padding:24px;border-radius:12px;margin:28px 0}.map-steps ol{padding-left:22px}.map-steps li{margin:0 0 10px}

/* Revision 6 — restore the legacy site's signature blue/green energy, consistently across all pages */
:root{--blue:#247ac4;--sky:#e7f3fb;--gold:#d9aa58;--green:#247ac4;--green-deep:#145287;--navy:#0b2944;--navy2:#16446b;--line:#ccdeec}
body{background:#f6f9fc}
.topbar{background:linear-gradient(90deg,#071d35,#164a77 65%,#0b3154);border-bottom:4px solid #2c85cd}
.topbar .topcontact{background:#247ac4;color:#fff;border:1px solid #9bc9ee;box-shadow:0 2px 0 #145287}
.topbar .topcontact:hover{background:#175d9a;color:#fff}
.header .nav{background:#123d62;border-bottom:4px solid #2c85cd}
.header .nav a{color:#f5fbff}
.header .nav a:hover,.header .nav a[aria-current=page]{background:#2c6999;color:#fff}
.hero{background:linear-gradient(118deg,#e4f0fa 0%,#fff 64%);border-bottom:1px solid #d5e6f2}
.hero h1{color:#0c365b}
.eyebrow{color:#1f6eaa}
.button{background:#247ac4;border-color:#247ac4;box-shadow:0 3px 0 #145287}
.button:hover{background:#175d9a;border-color:#175d9a}
.button.secondary{box-shadow:none;background:#fff;border-color:#247ac4;color:#155c98}
.button.secondary:hover{background:#e9f3fb}
.section{background:#fff}
.section.alt{background:#eaf3fa}
.section h2{color:#0d3c65}
.section.alt h2:after,.reviews-section h2:after{content:'';display:block;background:#2c85cd;width:72px;height:4px;border-radius:3px;margin-top:13px}
.service-strip{background:#e2eff9;border-bottom:1px solid #bfd9ee;border-top:2px solid #2c85cd}
.service-strip strong{color:#155787}
.card{box-shadow:0 6px 20px #153e6012;border-top:4px solid #247ac4}
.card a{color:#125c99}
.reviews-section{background:linear-gradient(#e6f1f9,#f7fbfe)}
.review-card{border-top:4px solid #247ac4}
.contact{background:linear-gradient(120deg,#0b2e4f,#134b79)}
.contact h2{color:#fff}
.contact .button{background:#247ac4;border-color:#247ac4;box-shadow:0 3px 0 #145287}
.footer{background:#092239;border-top:5px solid #247ac4}
.gallery-tile{padding:0;overflow:hidden;border:1px solid #ccdfec;border-top:4px solid #247ac4;box-shadow:0 8px 20px #0b355120;background:white;transition:transform .2s,box-shadow .2s}
.gallery-tile:hover{transform:translateY(-4px);box-shadow:0 13px 25px #0a2f4a30}
.gallery-tile > a{display:block;margin:0;color:inherit;text-decoration:none}
.gallery-tile img{width:100%;height:165px;object-fit:cover;display:block;transition:transform .2s}
.gallery-tile:hover img{transform:scale(1.035)}
.gallery-tile .tile-body{padding:16px 18px 18px}
.gallery-tile h3{color:#114873;margin-bottom:7px}
.gallery-tile .tile-body p{margin-bottom:8px;color:#4b6170}
.gallery-tile .tile-action{font-weight:800;color:#1576bc}
@media(max-width:700px){.gallery-tile img{height:140px}.header .navdetails{background:#fff}}
@media(max-width:420px){.gallery-tile img{height:190px}}

.bot-trap{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}