/* Preserve Roofpro's staggered title and roof silhouette, with clear separation. */
body[data-template=roofwork] .hero{height:850px;min-height:0}
body[data-template=roofwork] .hero h1{font-size:clamp(88px,8.2vw,130px);line-height:1}
body[data-template=roofwork] .hero .first-word{top:55px;left:17%;z-index:4}
body[data-template=roofwork] .hero .second-word{top:190px;left:43%;z-index:4}
body[data-template=roofwork] .hero-note{top:52px;left:66%;width:29%}
body[data-template=roofwork] .hero-note p{font-size:19px}
body[data-template=roofwork] .info-mark{display:none}
body[data-template=roofwork] .hero-action{top:320px;left:7%;z-index:5}
body[data-template=roofwork] .hero-roof{top:180px;left:0;width:100%;filter:brightness(1.13);transform-origin:center bottom;z-index:2}
body[data-template=roofwork] .hero-material{top:62px;left:5%;width:9%}
body[data-template=roofwork] .hero-caption{background:#17202bd9;padding:9px 13px;border-radius:10px;bottom:25px}
body[data-template=roofwork] .process-choice{appearance:none;display:block;text-align:left;color:inherit;font:inherit;border:1px solid #d1ccca;border-radius:18px;padding:28px 24px;background:#faf8f6;transition:background .4s,box-shadow .4s,translate .4s,border-color .4s}
body[data-template=roofwork] .process-choice span{margin-bottom:25px}
body[data-template=roofwork] .process-choice h3{font-size:25px}
body[data-template=roofwork] .process-choice p{font-size:18px}
body[data-template=roofwork] .process-choice:hover,body[data-template=roofwork] .process-choice:focus-visible,body[data-template=roofwork] .process-choice[aria-pressed=true]{background:#fff;border-color:#bc1b2e;box-shadow:0 15px 28px -20px #56252b55;translate:0 -4px}
body[data-template=roofwork] .process-choice:focus-visible{outline:3px solid #bc1b2e;outline-offset:5px}
.process-detail{margin-top:30px;padding:28px 32px;border-left:4px solid #bc1b2e;border-radius:0 18px 18px 0;background:#fff;min-height:215px}.process-detail .eyebrow{margin-bottom:12px}.process-detail h3{margin-bottom:14px}.process-detail p{max-width:72ch;margin:0}
@media(max-width:1100px) and (min-width:701px){body[data-template=roofwork] .hero{height:840px}body[data-template=roofwork] .hero h1{font-size:8.4vw}body[data-template=roofwork] .hero .first-word{top:55px}body[data-template=roofwork] .hero .second-word{top:190px;left:38%}body[data-template=roofwork] .hero-note{top:45px;left:68%;width:28%}body[data-template=roofwork] .hero-note p{font-size:17px}body[data-template=roofwork] .hero-action{top:300px}body[data-template=roofwork] .hero-roof{top:325px;width:110%;left:-5%}.process-choices{gap:18px}body[data-template=roofwork] .process-choice{padding:22px 18px}.process-choices h3{font-size:23px!important}}
@media(max-width:700px){body[data-template=roofwork] .hero{height:820px}body[data-template=roofwork] .hero h1{font-size:15vw}body[data-template=roofwork] .hero .first-word{top:38px;left:7%}body[data-template=roofwork] .hero .second-word{top:115px;left:12%}body[data-template=roofwork] .hero-material{top:225px;left:7%;width:21%}body[data-template=roofwork] .hero-note{top:215px;left:35%;width:58%}body[data-template=roofwork] .hero-note p{font-size:18px;line-height:1.55}body[data-template=roofwork] .hero-action{top:370px;left:7%;right:7%}body[data-template=roofwork] .hero-roof{top:420px;width:145%;left:-22.5%}body[data-template=roofwork] .hero-caption{font-size:12px;max-width:85%}.process-detail{padding:24px;min-height:270px}.process-choices{grid-template-columns:1fr}.process-choice p{margin-bottom:0!important}}
@media(prefers-reduced-motion:reduce){.process-choice{transition:none!important;translate:none!important}}
[data-motion-off] .process-choice{transition:none!important;translate:none!important}