/* Responsive navigation and touch layouts; the desktop visual identity is retained. */
.mobile-menu,.floating-call { display:none }
.mobile-menu:not([open])>.mobile-menu-panel,.menu-services:not([open])>div,.product-family-disclosure:not([open])>.product-family-list { display:none }
.mobile-call { display:none!important }
img,svg { max-width:100% }
main { min-width:0 }
.hero-copy,.hero-grid>* { min-width:0 }
.article-content,.case-card,.brand-group,.guide-card,.coverage-block,.contact-box { min-width:0 }
.article-sources a,.coverage-place-list li { overflow-wrap:anywhere }
.service-product-families { margin:30px 0 }
.service-product-families h3 { font-size:25px;line-height:1.3;margin:0 0 18px;letter-spacing:-.4px }
.product-family-list { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;list-style:none;padding:0;margin:18px 0 }
.product-family-list li { border:1px solid #d7e1cf;border-radius:5px;padding:17px 19px;background:#fff;min-width:0 }
.product-family-list strong { display:block;font-size:14px;line-height:1.5;margin-bottom:7px }
.product-family-list span { display:block;font-size:15px;line-height:1.65;color:#255841 }
.product-family-list p { margin:9px 0 0;font-size:13px;line-height:1.75;color:#617268 }
.product-family-disclosure { border-top:1px solid #d3deca;border-bottom:1px solid #d3deca;margin:23px 0 }
.product-family-disclosure summary { display:flex;justify-content:space-between;align-items:center;gap:15px;min-height:48px;font-size:15px;cursor:pointer;list-style:none;font-weight:600 }
.product-family-disclosure summary::-webkit-details-marker { display:none }
.product-family-disclosure summary>span { font-size:22px;font-weight:400 }
.product-family-disclosure[open] summary>span { transform:rotate(45deg) }
.brand-group .product-family-list { grid-template-columns:1fr;gap:8px }.brand-group .product-family-list li { background:#f7f9f1;padding:13px 15px }
:target { scroll-margin-top:100px }
@media(max-width:1050px) {
  html { scroll-padding-top:84px }
  .site-header { z-index:30 }
  .header-inner { height:72px;gap:20px }
  .desktop-navigation { display:none }
  .header-phone { margin-left:auto;font-size:14px }
  .mobile-menu { display:block;flex-shrink:0 }
  .mobile-menu>summary { min-height:44px;display:flex;align-items:center;gap:9px;cursor:pointer;list-style:none;font-size:14px;font-weight:600;border:1px solid #cbd6c6;padding:0 13px;border-radius:5px;background:#fff }
  .mobile-menu>summary::-webkit-details-marker,.menu-services>summary::-webkit-details-marker { display:none }
  .mobile-menu[open]>summary { background:#e5efda;border-color:#9bb88c }
  .menu-symbol { display:grid;gap:4px;width:18px }
  .menu-symbol i { height:1.5px;width:18px;background:currentColor;display:block;transition:transform .2s,opacity .2s }
  .mobile-menu[open] .menu-symbol i:nth-child(1) { transform:translateY(5.5px) rotate(45deg) }
  .mobile-menu[open] .menu-symbol i:nth-child(2) { opacity:0 }
  .mobile-menu[open] .menu-symbol i:nth-child(3) { transform:translateY(-5.5px) rotate(-45deg) }
  .mobile-menu-panel { position:absolute;left:24px;right:24px;top:calc(100% + 8px);background:#f7f8f2;border:1px solid #c8d7bf;border-radius:8px;padding:18px;box-shadow:0 12px 32px #122f2b24;max-height:calc(100dvh - 98px - env(safe-area-inset-bottom,0px));overflow:auto;overscroll-behavior:contain }
  .mobile-navigation { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 16px;font-size:15px;font-weight:600 }
  .mobile-navigation>a,.menu-services a { display:flex;justify-content:space-between;gap:10px;align-items:center;min-height:46px;padding:10px 4px;border-bottom:1px solid #dce5d6;line-height:1.4 }
  .mobile-navigation>a>span,.menu-services a>span { font-size:17px;color:#55764e }
  .menu-services { margin-top:17px;border:1px solid #d0ddc6;border-radius:5px }
  .menu-services>summary { display:flex;justify-content:space-between;align-items:center;min-height:48px;padding:12px 14px;font-size:14px;cursor:pointer;list-style:none;font-weight:600 }
  .menu-services>summary>span { font-size:22px;font-weight:400 }
  .menu-services[open]>summary>span { transform:rotate(45deg) }
  .menu-services>div { padding:0 13px 9px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px }
  .menu-services a { font-size:14px;font-weight:400 }
  .menu-contact { display:flex;align-items:center;gap:14px;padding:18px 4px 2px;font-size:21px;font-weight:600 }
  .menu-contact svg { width:26px;height:26px;fill:#177248;flex-shrink:0 }
  .menu-contact small { display:block;font-size:11px;line-height:1.7;font-weight:400;margin-top:4px;color:#52674c }
  .floating-call { display:flex;position:fixed;right:max(18px,env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));width:58px;height:58px;justify-content:center;align-items:center;background:#1b9757;color:#fff;border:2px solid #fff;border-radius:50%;z-index:20;box-shadow:0 5px 18px #0e432b33 }
  .floating-call svg { width:27px;height:27px;fill:currentColor }
  .floating-call:focus-visible { outline-color:#0d3e36;outline-offset:4px }
  .footer { padding-bottom:100px }
  :target { scroll-margin-top:84px }
}
@media(max-width:900px) {
  .wrap { padding-left:24px;padding-right:24px }
  .hero { padding:38px 0 42px }
  .hero-grid { grid-template-columns:1fr;gap:28px }
  .hero-copy h1,.article-hero .hero-copy h1 { font-size:clamp(32px,5.2vw,46px);line-height:1.13;letter-spacing:-1.3px;max-width:720px;overflow-wrap:normal }
  .hero-description { font-size:16px;line-height:1.75;max-width:680px }
  .hero-realization,.article-photo { width:100%;max-width:680px;margin:0;justify-self:start }
  .hero-realization>img { max-height:390px }
  .article-photo img { height:320px }
  .case-hero .hero-realization>img { height:auto;max-height:430px;aspect-ratio:4/3;object-fit:contain }
  .services-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
  .service-card { min-height:240px;padding:23px }
  .service-card h3 { font-size:24px }
  .pro-service { display:flex;min-height:230px }
  .pro-service p { margin-top:14px }.pro-service .card-action { margin-top:20px }
  .section { padding-top:52px;padding-bottom:52px }
  .section-heading { display:block;margin-bottom:26px }
  .section-heading p:not(.eyebrow) { max-width:680px;font-size:15px;margin-top:20px }
  h2,.service-page-content .section-heading h2,.installation-story h2 { font-size:clamp(28px,4.4vw,36px);line-height:1.16;letter-spacing:-1px }
  .problem-groups,.business-grid,.area-grid,.contact-grid,.faq-section,.service-scope,.installation-story,.article-layout { grid-template-columns:1fr;gap:28px }
  .problem-group,.case-card { padding:22px }
  .problem-group h3 { font-size:17px }.problem-group li p,.problem-intro { font-size:14px }
  .problem-contact { flex-direction:column;align-items:flex-start;gap:12px }
  .business-section { padding:52px 0 }.business-list { margin-top:0 }.business-list>div { padding-left:34px }
  .business-grid p:not(.eyebrow) { max-width:680px;font-size:15px }
  .business-list h3 { font-size:22px }.business-list p { font-size:14px!important }
  .area-section,.contact-section { padding:45px 0 }
  .area-grid p:not(.eyebrow),.contact-grid p:not(.eyebrow) { max-width:680px;font-size:15px }
  .coverage-block { margin-top:0 }.coverage-controls input { font-size:16px;min-height:48px }
  .coverage-controls { flex-direction:column }.coverage-controls .button { justify-content:space-between }
  .case-card p,.service-scope p,.service-scope li,.quote-prompt p,.guide-card p { font-size:15px;line-height:1.75 }
  .case-grid,.installation-check-grid { grid-template-columns:repeat(2,minmax(0,1fr));gap:16px }
  .quote-prompt { gap:20px;padding:24px;align-items:flex-start;flex-direction:column }
  .quote-prompt .button,.problem-contact .button { max-width:100%;width:100%;justify-content:space-between }
  .guide-card-grid { grid-template-columns:repeat(2,minmax(0,1fr));gap:16px }
  .guide-card h3 { font-size:23px }.guide-card { padding:23px }
  .article-layout { padding-top:0 }.article-toc { position:static }
  .article-toc nav { display:flex;border:1px solid #cfdcc7;border-radius:5px;padding:18px 22px;font-size:14px }
  .article-content p,.article-content li { font-size:16px;line-height:1.8 }.article-section h2 { font-size:28px }
  .article-help .button { max-width:100%;width:100%;justify-content:space-between }
  .brand-directory,.coverage-area-groups { grid-template-columns:repeat(2,minmax(0,1fr)) }
  .breadcrumbs,.gallery-category-nav { display:flex;flex-wrap:wrap;font-size:12px }
  .gallery-intro h1 { font-size:clamp(34px,6vw,48px);letter-spacing:-1.5px;line-height:1.12 }
  .contact-number { font-size:38px;letter-spacing:-1px;white-space:normal;gap:14px }
  .footer-navigation { display:flex;gap:12px 22px }.footer-navigation a { min-height:44px;display:flex;align-items:center;font-size:13px }
}
@media(max-width:600px) {
  .header-inner { height:66px;gap:12px }
  .header-phone { display:none }
  .brand { font-size:28px }.brand img { width:30px;height:30px }
  .mobile-menu { margin-left:auto }
  .mobile-menu-panel { left:16px;right:16px;top:calc(100% + 6px);padding:16px;max-height:calc(100dvh - 90px - env(safe-area-inset-bottom,0px)) }
  .menu-services>div { grid-template-columns:1fr }
  .wrap { padding-left:20px;padding-right:20px }
  .hero { padding-top:30px;padding-bottom:34px }
  .hero-grid { gap:26px }
  .hero-copy h1,.article-hero .hero-copy h1 { font-size:clamp(30px,8.7vw,38px);line-height:1.12;letter-spacing:-1px;margin-bottom:22px }
  .hero-description { font-size:16px;line-height:1.7 }
  .eyebrow,.hero-notes,.card-number { font-size:11px;letter-spacing:1px }
  .hero-notes span { font-size:11px }.hero-notes { gap:11px 18px;line-height:1.6 }
  .hero-actions { align-items:stretch;gap:16px;margin-top:24px }
  .hero-actions .button { width:100%;justify-content:space-between }
  .hero-actions .text-link { min-height:44px;font-size:14px }
  .button { font-size:14px;line-height:1.4;min-height:48px;gap:14px;padding:15px 18px;text-align:left;max-width:100% }
  .button>span { flex-shrink:0 }
  .text-link { font-size:14px;line-height:1.55;min-height:44px }
  .section { padding-top:42px;padding-bottom:42px }
  .service-strip .wrap { gap:12px 22px;font-size:12px;line-height:1.5 }
  .services-grid,.case-grid,.guide-card-grid,.installation-check-grid,.brand-directory,.coverage-area-groups,.detail-photo-grid { grid-template-columns:1fr }
  .service-card,.pro-service { min-height:0;padding:24px }
  .service-card h3 { font-size:25px;line-height:1.2;margin-top:18px }
  .service-card h3 br { display:none }
  .service-card p { font-size:15px;line-height:1.7;margin-bottom:20px }
  .card-action { font-size:13px;min-height:32px }
  .pro-service p { margin-bottom:0 }.pro-service .card-action { margin-top:22px }
  .realizations-grid,.gallery-focused { grid-template-columns:1fr;gap:20px }
  .realization-card figcaption { font-size:16px;padding:18px 20px;line-height:1.5 }
  .realization-card figcaption span { font-size:10px }.realization-caption-link small { font-size:12px }
  .hero-realization figcaption,.article-photo figcaption { font-size:14px;padding:17px 19px }
  .hero-realization>img { max-height:none }.article-photo img { height:auto;max-height:370px;aspect-ratio:4/3;object-fit:contain }
  .gallery-category-nav a,.related-services a { display:flex;align-items:center;min-height:46px;font-size:14px;line-height:1.4 }
  .related-services>div { display:grid;grid-template-columns:1fr }.related-services span { margin-left:auto }
  .coverage-block { padding:21px }.coverage-block>p { font-size:15px }.coverage-small { font-size:12px!important }
  .coverage-result { padding:17px;grid-template-columns:26px minmax(0,1fr);gap:10px }
  .coverage-result h4 { font-size:21px;overflow-wrap:normal }.coverage-result p { font-size:15px }
  .coverage-result .button { justify-content:center }.coverage-result .button>span { display:none }
  .coverage-result .result-actions { display:flex;align-items:stretch;flex-direction:column;gap:10px }
  .coverage-result .text-link { justify-content:center }.coverage-mark { width:26px;height:26px }
  .brand-group { padding:23px }.brand-group p,.brand-note { font-size:14px }.brand-tags span { font-size:14px }
  .product-family-list { grid-template-columns:1fr }.product-family-list p { font-size:14px }
  .coverage-area-group summary { font-size:20px }.coverage-place-list li { font-size:14px }
  .coverage-area-group p { font-size:14px }
  .article-help { padding:23px }.article-meta { font-size:12px }
  .article-faq summary,.faqs summary { font-size:16px;line-height:1.5 }
  .article-sources a,.article-sources summary { font-size:13px;line-height:1.7 }
  .case-service-links { gap:10px 20px }.case-service-links a { max-width:100% }
  .process { gap:25px }.process h3 { font-size:24px }
  .contact-number { font-size:clamp(29px,8.3vw,38px);letter-spacing:-.6px;min-height:48px;flex-wrap:nowrap;gap:10px }
  .contact-number>span { font-size:30px }.sms-link { font-size:15px;line-height:1.7;min-height:44px;padding:8px 0 }
  .email-link { margin-top:4px }.contact-hours { font-size:14px!important;line-height:1.7!important }
  .contact-small { font-size:12px!important }.contact-label { font-size:11px }
  .footer { padding-bottom:108px;gap:20px }.footer>p,.footer small,.footer>div>a { font-size:12px;line-height:1.7 }
  .footer>div>a { min-height:44px;padding:8px 0 }
  .floating-call { width:56px;height:56px;right:max(16px,env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px)) }
  .legal-page h1 { font-size:32px;line-height:1.15 }.legal-page p,.legal-page li { font-size:16px;line-height:1.8 }
}
@media(max-width:360px) {
  .wrap { padding-left:16px;padding-right:16px }
  .mobile-menu-panel { left:12px;right:12px;padding:14px }
  .mobile-navigation { font-size:14px;gap:3px 12px }
  .service-card,.guide-card,.brand-group { padding:21px }
  .coverage-block { padding:18px }.coverage-result { padding:14px;gap:9px }
  .coverage-result .button { font-size:13px;padding:13px 10px }
}
@media(orientation:landscape) and (max-width:1050px) and (max-height:500px) {
  .header-inner { height:60px }.mobile-menu-panel { max-height:calc(100dvh - 78px);top:calc(100% + 4px) }
  .hero { padding-top:28px }.floating-call { width:50px;height:50px;bottom:12px }
  .hero-realization>img,.article-photo img { max-height:300px }
}
@media(prefers-reduced-motion:reduce) { .menu-symbol i { transition:none } }
