/*!
 * QMAN PRO - Website design and development
 * Author: Frey Gabor
 * Designer: Frey Gabor
 * Developer: Frey Gabor
 * Official developer website: https://freygabor.com/
 * Copyright (c) 2026 Frey Gabor. All rights reserved.
 * Applies to the custom website implementation and original development assets.
 * Client branding, supplied content/media and third-party assets retain their own rights.
 */

.contact-hero { padding:32px 0 86px; background:#fff; }
.contact-breadcrumb { display:inline-flex; gap:12px; align-items:center; color:#666; font-size:.8rem; margin-bottom:40px; }
.contact-breadcrumb>span:last-child { color:var(--ink); }
.contact-hero-grid { display:grid; grid-template-columns:1.06fr 1fr; align-items:center; gap:70px; }
.contact-hero h1 { font-family:Montserrat,Arial,sans-serif; font-size:clamp(3rem,4.3vw,5.2rem); line-height:1.02; font-weight:850; letter-spacing:-.065em; margin:0 0 28px; }
.contact-hero h1 em,.installer-heading h2 em { color:var(--red); font-style:normal; }
.contact-hero-copy>p:not(.eyebrow) { max-width:580px; color:#62656a; font-size:1.15rem; line-height:1.8; margin-bottom:32px; }
.contact-hero .button-row { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.art-contact-intro .art-drawing { right:-120px; top:-180px; opacity:.45; }
.art-contact-intro .art-grid { opacity:.15; }
.art-contact-intro .art-ribbon { display:none; }
.contact-loft-card { position:relative; color:white; background:#191919; border:1px solid #393939; border-radius:16px; padding:27px 30px; overflow:hidden; min-width:0; }
.contact-loft-card:before { content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(#ffffff07 1px,transparent 1px),linear-gradient(90deg,#ffffff07 1px,transparent 1px); background-size:42px 42px; }
.loft-card-top,.loft-card-caption { display:flex; justify-content:space-between; align-items:center; gap:20px; position:relative; z-index:1; }
.loft-card-tag { font-size:.6rem; font-weight:700; letter-spacing:.17em; color:#dadada; }
.loft-card-top>svg { color:#ff8984; }
.loft-animation { display:block; width:100%; height:auto; max-height:330px; margin:0 auto; overflow:visible; }
.loft-room { stroke:#64676b; stroke-width:1.2; }
.loft-measure { stroke:#616368; stroke-width:1; stroke-dasharray:4 7; }
.loft-hatch { stroke:#a1a4a8; stroke-width:3; fill:#292b2d; }
.loft-fold { stroke:#eee; stroke-width:5; stroke-linecap:round; transform-box:view-box; transform-origin:0 0; animation-play-state:paused!important; }
.loft-upper { animation:loft-upper 9s ease-in-out infinite; }
.loft-middle { animation:loft-middle 9s ease-in-out infinite; }
.loft-lower { animation:loft-lower 9s ease-in-out infinite; }
.loft-joint { fill:#e41919; }
.loft-card-caption { padding-top:16px; border-top:1px solid #ffffff22; }
.loft-card-caption strong { font-family:Montserrat,Arial,sans-serif; font-size:1.3rem; line-height:1.2; letter-spacing:-.04em; }
.loft-card-caption>span { font-size:.8rem; line-height:1.6; color:#bfc0c1; text-align:right; }
.contact-cards { display:grid; grid-template-columns:1fr 1fr 1.2fr; gap:28px; margin-top:62px; }
.contact-card { border-top:1px solid #d9dce0; padding:30px 0 0; position:relative; min-width:0; }
.contact-card-icon { display:flex; width:44px; height:44px; border:1px solid #dedfe1; border-radius:10px; align-items:center; justify-content:center; margin-bottom:23px; color:var(--red); }
.contact-card-icon svg { stroke:currentColor; stroke-width:1.5; fill:none; }
.contact-card .eyebrow { margin-bottom:12px; font-size:.65rem; }
.contact-card h2 { font-size:clamp(1.05rem,1.42vw,1.5rem); font-weight:700; margin:0 0 12px; letter-spacing:-.025em; overflow-wrap:anywhere; }
.contact-card p:not(.eyebrow),.contact-card address { font-style:normal; font-size:.92rem; line-height:1.7; color:#62656a; max-width:370px; margin:0 0 12px; }
.contact-card small { font-size:.76rem; color:#74777b; }
.contact-card .text-link { font-size:.82rem; margin-top:8px; }
.contact-card h2 a:hover { color:var(--red); }
.installer-section { background:#f4f5f6; padding:90px 0 65px; border-block:1px solid #e4e6e8; }
.art-installers .art-grid { opacity:.12; mask-image:linear-gradient(180deg,#000,transparent); }
.installer-heading { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:end; margin-bottom:44px; }
.installer-heading h2 { font-family:Montserrat,Arial,sans-serif; font-size:clamp(2.5rem,3.5vw,4rem); font-weight:800; letter-spacing:-.06em; line-height:1.07; margin:0; }
.installer-heading>div:last-child { max-width:525px; justify-self:end; }
.installer-heading p:not(.eyebrow) { color:#66696e; line-height:1.8; font-size:1rem; margin:17px 0 0; }
.installer-approved { display:inline-flex; gap:10px; align-items:center; font-size:.9rem; font-weight:700; }
.installer-approved svg { color:var(--red); }
.installer-layout { display:grid; grid-template-columns:340px minmax(0,1fr); gap:28px; align-items:stretch; }
.installer-sidebar { display:flex; flex-direction:column; gap:20px; min-width:0; }
.installer-choices { display:grid; gap:10px; }
.installer-choice { display:flex; align-items:center; gap:15px; padding:18px 20px; min-height:89px; background:#fff; border:1px solid #dedfe1; border-radius:9px; text-align:left; cursor:pointer; color:var(--ink); font:inherit; transition:border-color .2s,box-shadow .2s; }
.installer-choice:disabled { cursor:default; }
.installer-choice:hover,.installer-choice:focus-visible { border-color:#aaa; }
.installer-choice[aria-pressed=true] { border-color:#e41919; box-shadow:inset 3px 0 0 var(--red); }
.choice-pin { display:grid; place-items:center; width:39px; height:39px; border-radius:50%; background:#f5f6f7; color:var(--red); flex-shrink:0; }
.choice-pin svg { width:21px; height:21px; }
.installer-choice strong { display:block; font-size:1.04rem; }
.installer-choice small { display:block; color:#75777c; font-size:.76rem; margin-top:4px; }
.choice-arrow { margin-left:auto; font-size:1.3rem; color:#83868a; }
.installer-choice[aria-pressed=true] .choice-arrow { color:var(--red); }
.selected-installer { flex:1; background:#191919; color:white; border-radius:10px; padding:28px; }
.selected-installer .eyebrow { color:#ffa8a3; font-size:.57rem; margin-bottom:17px; }
.selected-installer h3 { font-family:Montserrat,Arial,sans-serif; font-size:2rem; letter-spacing:-.06em; margin:0 0 12px; }
.selected-installer>p:not(.eyebrow) { color:#c8c9ca; font-size:.88rem; line-height:1.8; margin:0 0 24px; min-height:95px; }
.selected-installer .button { width:100%; justify-content:space-between; padding-inline:17px; font-size:.83rem; }
.installer-call { display:block; color:#c8c9ca; font-size:.78rem; text-align:center; margin-top:16px; }
.installer-call:hover { color:white; }
.installer-map-card { min-width:0; border:1px solid #dedfe1; background:#fff; border-radius:12px; overflow:hidden; display:flex; flex-direction:column; }
.map-toolbar { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:21px 25px; min-height:68px; }
.map-toolbar>span { display:flex; align-items:center; gap:10px; font-size:.8rem; font-weight:700; }
.map-key-dot { width:8px; height:8px; background:var(--red); border-radius:50%; }
.map-toolbar button { background:none; border:0; padding:8px 0; font:inherit; font-size:.75rem; font-weight:600; color:#565960; cursor:pointer; }
.map-toolbar button:disabled { cursor:default; }
.map-toolbar button:hover { color:var(--red); }
.installer-map-wrap { position:relative; flex:1; min-height:460px; display:flex; }
#installer-map { width:100%; min-height:460px; background:#e7ebed; z-index:0; font-family:Arial,Helvetica,sans-serif; }
.map-placeholder { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#656b71; }
.map-placeholder>svg { width:40px; height:40px; color:var(--red); }
.map-fallback { position:absolute; z-index:700; left:20px; bottom:20px; right:20px; padding:14px 18px; background:#fff; border:1px solid #dedfe1; border-radius:7px; font-size:.8rem; color:#565960; margin:0; box-shadow:0 4px 18px #0001; }
.map-bottom { display:flex; justify-content:space-between; gap:22px; align-items:center; padding:19px 25px; min-height:67px; }
.map-bottom p { font-size:.75rem; color:#6b6d72; margin:0; }
.map-bottom>a { font-size:.76rem; color:var(--ink); font-weight:700; white-space:nowrap; }
.map-bottom>a:hover { color:var(--red); }
.map-noscript { padding:20px; display:flex; gap:20px; flex-wrap:wrap; }
.map-noscript p { margin:0; }
.installer-note { display:flex; align-items:center; gap:8px; color:#70747a; font-size:.78rem; margin:20px 0 0; }
.installer-note svg { width:16px; height:16px; flex-shrink:0; }
#installer-map .leaflet-tile-pane { filter:grayscale(1) contrast(.92); }
#installer-map .leaflet-control-attribution { font-size:10px; }
#installer-map .leaflet-control-zoom { border:1px solid #d9dde0; box-shadow:0 2px 10px #0001; }
#installer-map .leaflet-control-zoom a { width:36px; height:36px; line-height:36px; }
.qman-map-marker { background:transparent; border:0; }
.map-pin { display:flex; align-items:center; justify-content:center; position:relative; width:48px; height:48px; border-radius:13px 13px 13px 2px; background:#fff; border:2px solid #191919; box-shadow:0 4px 14px #0002; color:#191919; }
.map-pin>svg { width:34px; height:34px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; overflow:visible; }
.map-pin.is-selected { border-color:#e41919; color:#e41919; }
.pin-ladder { transform-origin:18px 14px; animation:pin-ladder 4s ease-in-out infinite; animation-play-state:paused!important; }
.map-pin:not(.is-selected) .pin-ladder { animation:none; }
#installer-map .leaflet-tooltip { border:0; background:white; color:#25272a; box-shadow:0 2px 7px #0001; font-family:Montserrat,Arial,sans-serif; font-size:12px; font-weight:700; padding:7px 12px; }
#installer-map .leaflet-tooltip-right:before { border-right-color:white; }
.contact-visit { padding:60px 0; background:white; }
.contact-visit-inner { display:flex; align-items:center; gap:30px; }
.visit-mark { display:grid; place-items:center; width:80px; height:80px; border-radius:50%; background:#f3f4f6; flex-shrink:0; color:var(--red); }
.visit-mark svg { width:32px; height:32px; }
.contact-visit-inner>div { flex:1; }
.contact-visit .eyebrow { font-size:.65rem; margin-bottom:10px; }
.contact-visit h2 { font-size:1.7rem; letter-spacing:-.04em; margin:0 0 10px; }
.contact-visit p:not(.eyebrow) { max-width:660px; color:#65686d; font-size:.95rem; margin:0; }
.scene-visible .loft-fold,.scene-visible .pin-ladder { animation-play-state:running!important; }
.motion-off .loft-fold,.motion-off .pin-ladder,.motion-suspended .loft-fold,.motion-suspended .pin-ladder { animation-play-state:paused!important; }
@keyframes loft-upper { 0%,12%,100% { transform:rotate(-83deg); } 36%,76% { transform:rotate(24deg); } }
@keyframes loft-middle { 0%,15%,100% { transform:scaleY(.03); } 46%,73% { transform:scaleY(1); } }
@keyframes loft-lower { 0%,22%,100% { transform:scaleY(.03); } 55%,68% { transform:scaleY(1); } }
@keyframes pin-ladder { 0%,100% { transform:scaleY(.55); } 45%,70% { transform:scaleY(1); } }
@media(min-width:1700px) { .contact-loft-card { padding:32px 40px; } .loft-animation { max-height:365px; } .installer-layout { grid-template-columns:390px minmax(0,1fr); } }
@media(max-width:1100px) { .contact-hero-grid { gap:35px; } .contact-hero h1 { font-size:3.1rem; } .contact-cards { gap:24px; } .installer-layout { grid-template-columns:300px minmax(0,1fr); gap:20px; } .map-toolbar { align-items:flex-start; } .map-toolbar>span { max-width:170px; } .selected-installer { padding:23px; } }
@media(max-width:800px) { .contact-hero-grid { grid-template-columns:1fr; gap:35px; } .contact-hero-copy { max-width:650px; } .contact-hero h1 { font-size:clamp(2.8rem,6.5vw,4rem); } .contact-loft-card { max-width:650px; width:100%; } .contact-cards { grid-template-columns:1fr 1fr; } .contact-card:last-child { grid-column:1/-1; } .contact-card h2 { font-size:1.2rem; } .installer-heading { grid-template-columns:1fr; gap:25px; } .installer-heading>div:last-child { justify-self:start; } .installer-layout { grid-template-columns:1fr; } .installer-choices { grid-template-columns:repeat(3,1fr); } .installer-choice { padding:14px; gap:10px; flex-wrap:wrap; } .choice-pin { display:none; } .choice-arrow { display:none; } .selected-installer>p:not(.eyebrow) { min-height:0; } .selected-installer .button { width:auto; gap:35px; } .installer-call { text-align:left; } .contact-visit-inner { flex-wrap:wrap; } .contact-visit-inner>.button { margin-left:110px; } }
@media(max-width:520px) { .contact-hero { padding:24px 0 55px; } .contact-breadcrumb { margin-bottom:32px; } .contact-hero h1 { font-size:2.65rem; } .contact-hero-copy>p:not(.eyebrow) { font-size:1rem; line-height:1.75; } .contact-loft-card { padding:20px; } .loft-card-tag { font-size:.5rem; letter-spacing:.1em; } .loft-card-caption strong { font-size:1.1rem; } .loft-card-caption>span { font-size:.67rem; } .contact-cards { grid-template-columns:1fr; margin-top:40px; gap:28px; } .contact-card:last-child { grid-column:auto; } .contact-card h2 { font-size:1.25rem; } .contact-card-icon { margin-bottom:20px; } .installer-section { padding:55px 0 38px; } .installer-heading h2 { font-size:2.7rem; } .installer-heading { gap:22px; margin-bottom:30px; } .installer-choices { gap:7px; } .installer-choice { min-height:78px; padding:12px 9px; } .installer-choice strong { font-size:.83rem; } .installer-choice small { font-size:.63rem; line-height:1.3; } .map-toolbar { padding:15px; gap:12px; } .map-toolbar>span { font-size:.7rem; } .map-toolbar button { font-size:.68rem; padding:0; text-align:right; } .map-toolbar>span { max-width:155px; } .installer-map-wrap,#installer-map { min-height:400px; } .map-bottom { align-items:start; flex-direction:column; padding:17px; gap:10px; } .installer-note { align-items:flex-start; font-size:.73rem; line-height:1.6; } .installer-note svg { margin-top:4px; } .contact-visit { padding:40px 0; } .contact-visit-inner { gap:20px; } .visit-mark { width:55px; height:55px; } .contact-visit-inner>div { flex-basis:70%; } .contact-visit h2 { font-size:1.4rem; } .contact-visit-inner>.button { margin-left:75px; } }
@media(prefers-reduced-motion:reduce) { .loft-fold,.pin-ladder { animation:none!important; } .loft-upper { transform:rotate(24deg); } }
@media print { .contact-loft-card,.installer-map-wrap,.map-toolbar { display:none; } .contact-cards,.installer-layout { display:block; } .selected-installer { color:#111; background:white; } }