.main_visual { position:relative; height: 100vh; overflow:hidden; color:#fff; background:#101010; } 
.main_visual_image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; } 
.main_visual_dim { position:absolute; inset:0; background:radial-gradient(ellipse at 50% 50%,rgba(0,0,0,0) 0%,rgba(0,0,0,.3) 100%),linear-gradient(90deg,rgba(0,0,0,.4),rgba(0,0,0,.4)),linear-gradient(180deg,rgba(16,16,16,0) 76%,#101010 100%); } 
.main_visual_content { position:relative; z-index:2; width:calc(100% - 40px); max-width:1440px; margin:0 auto; height: 100%; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; } 
.main_visual_badge { display:inline-flex; min-height:50px; align-items:center; padding:8px 20px; border-radius:25px; color:#fff; background:rgba(211,155,61,.4); box-shadow:inset 0 0 18px rgba(244,233,194,.14); font-size:24px; font-weight: 600; line-height:1.4; } 
.main_visual h1 { margin-top:24px; font-size:70px; font-weight:500; line-height:1.4; letter-spacing:0; } 
.main_visual h1 strong { display:block; width:max-content; font-weight:700; } 
.work_intro { height:370px; color:#fff; background:#101010; } 
.work_intro .main_inner { padding-top:110px; } 
.work_intro h2 { font-family:"Montserrat",sans-serif; font-size:50px; line-height:1.4; } 
.work_intro p { margin-top:8px; font-size:16px; line-height:1.6; } 
.service_stack { position:relative; z-index:4; height:1805px; margin-top:-60px; } 
.service_stage { display:contents; } 
.service_step { display:contents; } 
.service_panel { position:absolute; left:0; width:100%; height:500px; overflow:hidden; border-radius:40px 40px 0 0; box-shadow: inset 0px 20px 20px rgb(0 0 0 / 3%), 0px -14px 20px rgba(0, 0, 0, .06); } 
.service_silicone { --service_background:#f2f5e2; top:0; z-index:1; background:var(--service_background); } 
.service_crack { --service_background:#e3dea4; top:176px; z-index:2; background:var(--service_background); } 
.service_waterproof { --service_background:#ecc681; top:384px; z-index:3; background:var(--service_background); } 
.service_roof { --service_background:#be9b62; top:634px; z-index:4; background:var(--service_background); } 
.service_paint { --service_background:#675a49; top:950px; z-index:5; color:#fff; background:var(--service_background); } 
.service_rope { --service_background:#433724; top:1305px; z-index:6; color:#fff; background:var(--service_background); } 
.service_inner { display:flex; width:calc(100% - 40px); max-width:1440px; height:100%; justify-content:space-between; margin:0 auto; padding-top:80px; } 
.service_copy { display:flex; width:620px; flex-direction:column; align-items:flex-start; padding-top:20px; } 
.service_copy h2 { font-size:40px; font-weight:700; line-height:1.4; } 
.service_copy h3 { margin-top:28px; font-family:"Montserrat",sans-serif; font-size:24px; line-height:1.4; } 
.service_copy p { margin-top:8px; color:rgba(19,19,19,.6); font-size:16px; line-height:1.6; } 
.service_paint .service_copy p, .service_rope .service_copy p { color:rgba(255,255,255,.6); } 
.service_copy a { display:flex; height:40px; align-items:center; gap:8px; margin-top:24px; padding:0 16px; border-radius:10px; background:#fff; box-shadow:inset 0 0 12px rgba(19,19,19,.04); color:#131313; font-size:16px; } 
.service_copy a img { width:5px; height:10px; } 
.service_image { width:621px; height:340px; overflow:hidden; border-radius:20px; object-fit:cover; } 
.service_image_layered { position:relative; display:block; } 
.service_image_layered img { position:absolute; inset:0; width:100%; height:100%; border-radius:20px; object-fit:cover; } 
.showcase_section { position:relative; z-index:5; padding-top:120px; background:#fff; } 
.review_band, .result_band { position:relative; width:calc(100% - 40px); max-width:1880px; margin:0 auto; overflow:hidden; border-radius:40px; } 
.review_band { height:674px; background:#f8f8f8; } 
.review_layout { display:flex; height:100%; align-items:flex-start; gap:80px; padding-top:120px; } 
.review_layout h2, .result_layout h2, .faq_section h2 { flex:none; font-size:50px; font-weight:700; line-height:1.4; } 
.review_layout h2 { width:460px; } 
.review_slider { width:900px; height:474px; margin:0; } 
.slider_wrapper { position:relative; z-index:1; display:flex; width:100%; height:100%; box-sizing:content-box; transition-property:transform; } 
.slider_slide { position:relative; display:block; flex-shrink:0; } 
.review_slider .slider_slide { width:376px; height:402px; opacity:.4; transition:opacity .25s ease; } 
.review_slider .slider_slide.is_active { opacity:1; } 
.review_slider .slider_slide img { width:100%; height:100%; border:1px solid #d5d5d5; border-radius:20px; object-fit:cover; } 
.showcase_section .review_pagination { position:absolute; left: 50%; transform: translateX(-50%); bottom: 120px; } 
.review_pagination, .faq_pagination { display:flex; height:8px; align-items:center; justify-content:center; gap:8px; margin-top:24px; } 
.review_pagination .slider_bullet, .faq_pagination .slider_bullet { width:8px; height:8px; margin:0!important; border-radius:4px; opacity:1; background:rgba(16,16,16,.2); } 
.review_pagination .slider_bullet.is_active, .faq_pagination .slider_bullet.is_active { width:40px; background:#c19242; } 
.result_band { height:770px; margin-top:20px; color:#fff; background:#101010; } 
.result_background, .result_dim { position:absolute; inset:0; width:100%; height:100%; } 
.result_background { object-fit:cover; } 
.result_dim { background:rgba(0,0,0,.7); } 
.result_layout { position:relative; z-index:2; display:flex; height:100%; align-items:flex-start; gap:125px; padding-top:120px; } 
.result_layout h2 { width:325px; } 
.result_gallery { width:558px; } 
.result_compare { display:flex; flex-wrap:wrap; } 
.result_compare figure { display:flex; width:50%; flex-direction:column; } 
.result_compare figcaption { display:flex; height:44px; align-items:center; justify-content:center; background:#101010; font-family:"Montserrat",sans-serif; font-size:20px; font-weight:600; } 
.result_compare figure:nth-child(2) figcaption { color:#433724; background:linear-gradient(90deg,#d0ab62 0%,#e3dea4 50%,#d39b3d 100%); box-shadow:inset 0 0 16px rgba(255,255,255,.16); } 
.result_compare figure img { width:100%; height:344px; object-fit:cover; } 
.result_compare > span { display:flex; width:50%; height:44px; align-items:center; justify-content:center; background:#808080; font-size:20px; } 
.result_compare > span:last-child { color:#433724; background:linear-gradient(90deg,#d0ab62 0%,#e3dea4 50%,#d39b3d 100%); box-shadow:inset 0 0 16px rgba(255,255,255,.16); } 
.result_thumbnails { display:flex; gap:2px; margin-top:20px; justify-content: center; } 
.result_thumbnails button { width:78px; height:78px; flex:none; overflow:hidden; padding:0; border:0; opacity:.7; background:#111; filter: grayscale(100%); } 
.result_thumbnails button.active { border:3px solid #000; opacity:1; filter: grayscale(0); } 
.result_thumbnails img { width:100%; height:100%; object-fit:cover; } 
.faq_section { position:relative; z-index:5; height:600px; padding-top:120px; background:#fff; } 
.faq_section h2 { height:140px; } 
.faq_slider { margin-top:40px; overflow:hidden; } 
.faq_slider .slider_wrapper { gap:20px; } 
.faq_slider .slider_slide { width:272px; height:300px; padding:30px 20px; border-radius:20px; color:rgba(19,19,19,.6); background:#f8f8f8; transition:all .3s ease-in-out; } 
.faq_slider .slider_slide.active, .faq_slider .slider_slide.is_active { color:#fff; background:#101010; box-shadow:inset 0 0 22px rgba(255,255,255,.04); } 
.faq_slider h3 { display:flex; gap:0; font-size:20px; font-weight:700; line-height:1.4; } 
.faq_slider h3 span { flex:none; } 
.faq_slider p { margin-top:20px; font-size:16px; line-height:1.6; } 
.faq_pagination { display:none; } 
.main_contact { position:relative; z-index:5; height:475px; margin-top:120px; overflow:hidden; color:#fff; background:#101010; } 
.main_contact_image, .main_contact_dim { position:absolute; inset:0; width:100%; height:100%; } 
.main_contact_image { object-fit:cover; object-position: center 34%;} 
.main_contact_content { position:relative; z-index:2; display:flex; height:100%; align-items:center; flex-direction:column; text-align:center; justify-content: center; } 
.contact_logo { width: 120px; height: 120px; margin: -10px; object-fit:contain; } 
.main_contact h2 { margin-top: 13px; font-size:32px; line-height:1.4; } 
.main_contact p { margin-top: 16px; font-size:20px; line-height:1.6; } 
.contact_actions { display:flex; gap:12px; margin-top:24px; align-items: center; } 
.contact_actions a { display:flex; height:44px; align-items:center; gap:8px; padding:0 20px; border-radius:30px; } 
.contact_actions img { width:24px; height:24px; } 
.contact_actions span { font-size:24px; font-weight:700; } 
.contact_actions a:nth-of-type(2) img{width:20px; height:20px;}
#main .site_footer { margin-top:10px; } 

@media (hover:hover) and (pointer:fine) { 
.result_thumbnails button:hover { opacity:1; } 
.faq_slider .slider_slide:hover { color:#fff; background:#101010; box-shadow:inset 0 0 22px rgba(255,255,255,.04); } 
 } 

 
@media (min-width:1025px) { 
.service_stack { --service_sticky_top:max(80px,calc((100vh - 500px) / 2)); height:auto; background:#101010; } 
.service_stage { display:flex; flex-direction:column; } 
.service_step { position:relative; display:block; height:calc(820px + var(--service_sticky_top)); flex:none; margin-bottom:-320px; } 
.service_step:nth-child(1) { z-index:1; } 
.service_step:nth-child(2) { z-index:2; } 
.service_step:nth-child(3) { z-index:3; } 
.service_step:nth-child(4) { z-index:4; } 
.service_step:nth-child(5) { z-index:5; } 
.service_step:nth-child(6) { z-index:6; } 
.service_step:last-child { height:1000px; margin-bottom:0; } 
.service_stage .service_panel { position:sticky; top:var(--service_sticky_top); left:auto; overflow:visible; transform:none; } 
.service_stage .service_panel::after { position:absolute; top:calc(100% - 20px); left:0; width:100%; height:calc(var(--service_sticky_top) + 80px); background:var(--service_background); pointer-events:none; content:""; } 
 } 
@media (min-width:1025px) and (max-width:1100px) { 
.result_layout { justify-content:space-between; gap:30px; } 
.result_layout h2 { width:330px; font-size:40px; } 
.result_gallery { width:calc(100% - 360px); max-width:558px; } 
 } 
@media (max-width:1024px) { 
.main_visual { min-height:700px; } 
.main_visual_image { object-position:center; } 
.main_visual_dim { background:linear-gradient(90deg,rgba(0,0,0,.4),rgba(0,0,0,.4)),linear-gradient(180deg,rgba(16,16,16,0) 72%,#101010 100%); } 
.main_visual_content { width:100%; padding: 0 20px; text-align:center; align-items: center; } 
.main_visual_badge { min-height:33px; padding:4px 20px; font-size:18px; } 
.main_visual h1 { margin-top:20px; font-size:36px; line-height:1.4; } 
.main_visual h1 strong { width:auto; } 
.work_intro { height:370px; } 
.work_intro .main_inner { padding:60px 20px 0; } 
.work_intro h2 { font-size:30px; } 
.work_intro p { margin-top:8px; font-size:15px; line-height:1.6; } 
.work_intro p br { display:none; } 
.service_stack { height:1658px; margin-top:-134px; } 
.service_panel { height:542px; border-radius:40px 40px 0 0; } 
.service_silicone { top:0; } 
.service_crack { top:104px; height:566px; } 
.service_waterproof { top:242px; } 
.service_roof { top:423px; } 
.service_paint { top:724px; height:570px; } 
.service_rope { top:1116px; } 
.service_inner { display:flex; width:100%; flex-direction:column; justify-content:flex-start; padding:40px 20px 60px; } 
.service_copy { width:100%; padding:0; } 
.service_copy h2 { font-size:24px; } 
.service_copy h3 { margin-top:30px; font-size:20px; } 
.service_copy p { margin-top:8px; font-size:15px; } 
.service_copy p br { display:none; } 
.service_copy a { height:36px; margin-top:24px; padding:0 16px; font-size:15px; } 
.service_image { width:100%; height:180px; flex:none; margin-top:30px; border-radius:20px; } 
.service_image_layered img { border-radius:20px; } 
.showcase_section { padding-top:60px; } 
.review_band, .result_band { width:100%; /* border-radius:0; */ } 
.review_band { height:604px; } 
.review_layout { display:block; padding:60px 20px 0; } 
.review_layout h2, .result_layout h2, .faq_section h2 { font-size:30px; } 
.review_layout h2 { width:100%; } 
.review_slider { width:100%; height:410px; margin-top:30px; } 
.review_slider .slider_slide { width:320px; height:342px; } 
.showcase_section .review_pagination { bottom:60px; } 
.result_band { height:570px; margin-top:10px; } 
.result_layout { display:block; padding:60px 20px 0; } 
.result_layout h2 { width:100%; } 
.result_gallery { width:100%; margin-top:30px; } 
.result_compare figcaption { height:36px; font-size:16px; } 
.result_compare figure img { height:200px; } 
.result_compare > span { height:36px; font-size:16px; } 
.result_thumbnails { gap:2px; margin-top:20px; justify-content: center; } 
.result_thumbnails button { width:44px; height:44px; } 
.faq_section { height:502px; padding-top:60px; overflow:hidden; } 
.faq_section .main_inner { padding:0 20px; } 
.faq_section h2 { height:84px; } 
.faq_slider { width:calc(100% + 40px); margin:30px -20px 0; overflow:visible; } 
.faq_slider .slider_slide { width:272px; height:300px; padding:30px 20px; } 
.faq_pagination { display:flex; margin-top:20px; } 
.faq_slider .slider_wrapper { gap:0; } 
.main_contact { height:420px; margin-top:60px; } 
.main_contact_image { object-position:center; } 
.contact_logo { width:68px; height:68px; } 
.main_contact h2 { margin-top:16px; font-size:24px; } 
.main_contact p { font-size:16px; } 
.contact_actions { flex-direction:column; gap:16px; margin-top:24px; align-items: center; } 
.contact_actions a { height:44px; } 
.contact_actions span { font-size:24px; } 
.service_stack { --service_panel_height:570px; --service_sticky_top:max(48px,calc((100vh - var(--service_panel_height)) / 2)); height:auto; background:#101010; } 
.service_stage { display:flex; flex-direction:column; } 
.service_step { position:relative; display:block; height:calc(var(--service_panel_height) + var(--service_sticky_top) + 320px); flex:none; margin-bottom:-320px; } 
.service_step:nth-child(1) { z-index:1; } 
.service_step:nth-child(2) { z-index:2; } 
.service_step:nth-child(3) { z-index:3; } 
.service_step:nth-child(4) { z-index:4; } 
.service_step:nth-child(5) { z-index:5; } 
.service_step:nth-child(6) { z-index:6; } 
.service_step:last-child { height:calc(var(--service_panel_height) + var(--service_sticky_top) + 280px); margin-bottom:0; } 
.service_stage .service_panel { position:sticky; top:var(--service_sticky_top); left:auto; height:var(--service_panel_height); overflow:visible; transform:none; } 
.service_stage .service_panel::after { position:absolute; top:calc(100% - 20px); left:0; width:100%; height:calc(var(--service_sticky_top) + 80px); background:var(--service_background); pointer-events:none; content:""; } 
 } 
