/* Language switch: the only new control added to the reference homepage. */
.language-switch{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);color:var(--navy);padding:7px 10px;border-radius:6px;font-size:12px;font-weight:700;white-space:nowrap;flex-shrink:0}
.language-switch:hover{background:var(--bg);border-color:var(--blue)}

/* Logical spacing keeps the reference layout correct in LTR and RTL. */
.stats .wrap>div{border-left:0;border-inline-end:1px solid var(--line)}
.stats .wrap>div:last-child{border:0}
.checks li:before{margin-left:0;margin-inline-end:11px}
html[dir="ltr"] .hero-photo:after{background:linear-gradient(270deg,transparent 70%,var(--navy))}
html[dir="ltr"] .phone-list small{direction:ltr}
.phone-list bdi{direction:ltr}
html{scroll-padding-top:100px}

/* Keyboard access and native controls do not change the default sample design. */
.skip-link{position:fixed;z-index:100;top:-90px;inset-inline-start:20px;background:white;border:1px solid var(--line);padding:10px 16px;border-radius:6px;color:var(--navy)}
.skip-link:focus{top:12px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #b4d5ed;outline-offset:1px}
[hidden]{display:none!important}

/* Secondary page banner and links; these are not shown on the home page. */
.inner-banner{background:var(--navy);color:white;padding:48px 0 55px}
.inner-banner h1{font-size:clamp(30px,3.8vw,46px);line-height:1.35;margin:15px 0}
.inner-banner p{max-width:730px;color:#d6e5f3;margin:0}
.breadcrumbs{display:flex;gap:12px;align-items:center;font-size:13px;color:#a9d3f1}
.inner-shortcuts{background:white;border-bottom:1px solid var(--line)}
.inner-shortcuts .wrap{display:flex;flex-wrap:wrap;gap:13px 26px;padding:15px 0}
.inner-shortcuts a{font-size:13px;font-weight:700;color:var(--muted)}
.inner-shortcuts a:hover{color:var(--blue)}

/* Additional about and HVAC sections reuse the sample's typography and cards. */
.background-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px}
.background-grid p{color:var(--muted);font-size:17px;margin:18px 0 0}
.hvac-cards{grid-template-columns:repeat(4,1fr)}
.hvac-cards .card{min-height:220px;padding:24px}
.hvac-cards .card h3{font-size:21px;margin-top:0}
.hvac-cards .card p{font-size:15px}

/* Service detail copy and navigation to other service pages. */
.detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:60px;align-items:start}
.detail-copy>p{color:var(--muted);font-size:17px;margin:20px 0 28px}
.detail-copy>h3{color:var(--navy);font-size:22px;margin:30px 0 18px}
.detail-copy .checks li{font-weight:400}
.detail-copy>.btn{margin-top:22px}
.detail-aside{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:25px;position:sticky;top:112px}
.detail-aside h3{color:var(--navy);margin:0 0 20px;font-size:20px}
.detail-aside a{display:block;border-top:1px solid var(--line);padding:13px 0;font-size:14px;line-height:1.7}
.detail-aside a:hover,.detail-aside a[aria-current="page"]{color:#467fb1}

/* Original poster details with a translated description beside the artwork. */
.post-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:start}
.post-detail-image{margin:0;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.post-detail-image img{width:100%;height:auto}
.post-detail-image figcaption{padding:12px 20px;font-size:13px;color:var(--muted);background:var(--bg)}
.post-detail-grid article>p{color:var(--muted);font-size:17px;margin:20px 0 28px}
.return-link a{color:#467fb1;font-size:14px;font-weight:bold}

/* Secondary contact information and email-draft form. */
.contact-info-cards .card{min-height:210px}
.contact-info-cards .card h3{font-size:22px;margin-top:0}
.contact-channel{display:block;font-size:15px;overflow-wrap:anywhere;margin:9px 0;color:var(--navy)}
.contact-channel:hover{color:var(--blue)}
.contact-form{background:white;border:1px solid var(--line);border-radius:10px;padding:32px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px 25px;margin-bottom:25px}
.form-grid label{font-size:14px;color:var(--navy);font-weight:700;display:block}
.form-grid input,.form-grid select,.form-grid textarea{display:block;font:inherit;font-weight:400;color:var(--ink);background:#fbfcfe;width:100%;max-width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:6px;margin-top:8px;min-height:48px}
.form-grid textarea{resize:vertical;min-height:165px;line-height:1.8}
.full-field{grid-column:1/-1}
.contact-form .btn{border:0;cursor:pointer}
.form-status{margin:18px 0 0;max-width:800px}
.location-link h2{max-width:850px;font-size:clamp(25px,3vw,36px)}
.location-link p{color:var(--muted);font-size:17px;margin:20px 0}

/* Native FAQ accordions and the image gallery. */
.faq-wrap{max-width:930px}
.faq-item{border:1px solid var(--line);background:white;border-radius:9px;margin-bottom:16px;padding:0 25px}
.faq-item summary{padding:20px 0;cursor:pointer;color:var(--navy);font-weight:700;line-height:1.7}
.faq-item p{margin:0;padding:0 0 23px;color:var(--muted)}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.gallery-grid figure{border:1px solid var(--line);border-radius:12px;background:white;overflow:hidden;margin:0}
.gallery-grid img{width:100%;height:330px;object-fit:cover}
.gallery-grid figcaption{padding:15px 20px;font-weight:700;color:var(--navy)}
.image-dialog{padding:22px;border:1px solid var(--line);border-radius:10px;background:white;color:var(--navy);max-width:95vw;max-height:94vh;box-shadow:0 20px 80px #001b3f55}
.image-dialog::backdrop{background:#00132deb}
.image-dialog>img{max-height:72vh;max-width:86vw;object-fit:contain;margin:auto}
.image-dialog>[data-close-image]{position:absolute;top:7px;inset-inline-end:8px;width:35px;height:35px;background:var(--navy);color:white;border:0;border-radius:50%;font-size:25px;line-height:1;cursor:pointer}
.image-dialog p{margin:15px 15px 0;text-align:center;font-size:14px}
.image-controls{display:flex;justify-content:center;gap:12px;margin-top:15px;direction:ltr}
.image-controls button{background:var(--navy);color:white;border:0;border-radius:5px;width:40px;height:32px;cursor:pointer}

/* Error page in the same visual language. */
.error-wrap{padding-top:35px;padding-bottom:60px}
.error-wrap .kicker{font-size:50px}
.error-wrap h1{font-size:clamp(32px,5vw,54px);color:var(--navy);margin:10px 0}
.error-wrap p{color:var(--muted);margin-bottom:25px}

/* Language control must fit next to the original hamburger on smaller screens. */
@media(max-width:1100px) and (min-width:851px){
    .header .wrap{gap:18px}.header nav{gap:19px;font-size:14px}
    .header .brand{min-width:185px}.header .brand-name{font-size:19px}
    .header-cta{padding:11px 17px}
}
@media(max-width:950px) and (min-width:851px){
    .header .wrap{gap:14px}.header nav{gap:14px;font-size:13px}
    .header .brand{min-width:175px}.header .brand-name{font-size:17px}
    .header-cta{padding:10px 13px;font-size:13px}
}
@media(max-width:850px){
    .header .wrap{gap:16px}
    .header .menu{order:5;margin-right:0;margin-inline-start:0;padding:0 2px}
    .language-switch{order:4;margin-inline-start:auto}
    .header nav{order:3;text-align:start}
    html[dir="ltr"] .hero-photo:after{background:linear-gradient(0deg,transparent 75%,var(--navy))}
    .background-grid,.detail-grid,.post-detail-grid{grid-template-columns:1fr;gap:32px}
    .detail-aside{position:static}
    .hvac-cards,.gallery-grid{grid-template-columns:repeat(2,1fr)}
    .gallery-grid img{height:330px}
    .inner-banner{padding:35px 0 42px}
}
@media(max-width:600px){
    .stats .wrap>div{border-inline-end:0;border-bottom:1px solid var(--line)}
    .stats .wrap>div:last-child{border:0}
    .hvac-cards,.gallery-grid{grid-template-columns:1fr}
}
@media(max-width:520px){
    .header .wrap{gap:10px}
    .header .brand{gap:9px;flex:0 1 auto;min-width:0}
    .header .brand-name{font-size:16px;max-width:126px}
    .header .brand-name small{font-size:10px;letter-spacing:.05em}
    .header .brand img{width:48px;height:54px;flex-shrink:0}
    .language-switch{padding:6px 8px;font-size:11px}
    .header .menu{font-size:25px;flex-shrink:0}
    .form-grid{grid-template-columns:1fr;gap:18px}
    .contact-form{padding:23px}
    .form-grid input,.form-grid select,.form-grid textarea{font-size:16px}
    .post-detail-grid article>p{font-size:16px}
    .inner-shortcuts .wrap{gap:10px 20px}
    .gallery-grid img{height:auto}
    .image-dialog{padding:15px}
    .image-dialog>img{max-width:88vw}
}

/* Respect the visitor's motion preferences without hiding content. */
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

/* Print readable content while omitting navigation controls. */
@media print{.header,.top,.inner-shortcuts,.language-switch{display:none}.section{padding:30px 0}.hero .wrap{display:block}.hero-photo{min-height:0}.contact .wrap{display:block}.phone-list{margin-top:25px}}


/* Home overview links lead to dedicated content pages. */
.section-action{margin-top:30px}
.gallery-grid{grid-template-columns:repeat(2,1fr)}
.post-preview img{height:330px;object-fit:contain;background:white}
.footer-links{padding-bottom:22px;margin-bottom:22px!important;border-bottom:1px solid #ffffff25;display:flex!important;flex-wrap:wrap;justify-content:flex-start!important;gap:15px 26px!important}
.footer-links a:hover{color:white}
.header nav a[aria-current="page"]{color:var(--blue)}
/* Server-side contact feedback and bot field. */
.honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-alert{padding:18px 22px;border-radius:6px;margin-bottom:22px;font-size:14px}
.form-alert.error{background:#fff0ec;color:#8b3224;border:1px solid #eec4bb}
.form-alert.success{background:#edf7ef;color:#246237;border:1px solid #bbdcc4}
.form-alert ul{margin:8px 0 0}
/* Six navigation pages remain reachable on narrow desktop widths. */
@media(max-width:1100px) and (min-width:851px){.header nav{gap:13px;font-size:13px}.header .wrap{gap:13px}.header-cta{padding:10px 13px}}
@media(max-width:950px) and (min-width:851px){.header nav{gap:9px;font-size:12px}.header .wrap{gap:9px}.header .brand-name{font-size:16px}.header .brand{min-width:165px}}
@media(max-width:520px){.post-preview img{height:auto}}
@media(max-width:600px){.gallery-grid{grid-template-columns:1fr}}