@font-face { font-family: "Montserrat"; font-weight: 500; font-display: swap; src: url("/fonts/Montserrat-Medium.woff2") format("woff2"); } @font-face { font-family: "Montserrat"; font-weight: 600; font-display: swap; src: url("/fonts/Montserrat-SemiBold.woff2") format("woff2"); } @font-face { font-family: "Montserrat"; font-weight: 700; font-display: swap; src: url("/fonts/Montserrat-Bold.woff2") format("woff2"); } @font-face { font-family: "Montserrat"; font-weight: 800; font-display: swap; src: url("/fonts/Montserrat-ExtraBold.woff2") format("woff2"); } @font-face { font-family: "Open Sans"; font-weight: 400; font-display: swap; src: url("/fonts/OpenSans-Regular.woff2") format("woff2"); } @font-face { font-family: "Open Sans"; font-weight: 600; font-display: swap; src: url("/fonts/OpenSans-SemiBold.woff2") format("woff2"); } @font-face { font-family: "Font Awesome 6 Free"; font-style: normal; font-weight: 900; font-display: swap; src: url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/webfonts/fa-solid-900.woff2") format("woff2"); } @font-face { font-family: "Font Awesome 6 Brands"; font-style: normal; font-weight: 400; font-display: swap; src: url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/webfonts/fa-brands-400.woff2") format("woff2"); } .fas, .fab, .far { display: inline-block; font-style: normal; font-variant: normal; line-height: 1; text-rendering: auto; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } .fas, .far { font-family: "Font Awesome 6 Free"; font-weight: 900; } .fab        { font-family: "Font Awesome 6 Brands"; font-weight: 400; }  .fa-home::before              { content: ""; } .fa-phone-alt::before       { content: ""; } .fa-phone-volume::before      { content: ""; } .fa-star::before            { content: ""; } .fa-bars::before              { content: ""; } .fa-check::before           { content: ""; } .fa-check-circle::before      { content: ""; } .fa-envelope::before        { content: ""; } .fa-map-marker-alt::before    { content: ""; } .fa-tools::before           { content: ""; } .fa-chevron-down::before      { content: ""; } .fa-shield-alt::before      { content: ""; } .fa-clock::before             { content: ""; } .fa-google::before          { content: ""; } .fa-hammer::before            { content: ""; } .fa-layer-group::before     { content: ""; } .fa-store::before             { content: ""; } .fa-paper-plane::before     { content: ""; } .fa-angle-right::before       { content: ""; } .fa-lock::before            { content: ""; } .fa-key::before               { content: ""; } .fa-book::before            { content: ""; } .fa-window-maximize::before   { content: ""; } .fa-window-restore::before  { content: ""; } .fa-align-justify::before     { content: ""; } .fa-users::before           { content: ""; } .fa-rocket::before            { content: ""; } .fa-file-invoice::before    { content: ""; } .fa-file-invoice-dollar::before { content: ""; } .fa-file-contract::before { content: ""; } .fa-clipboard-list::before    { content: ""; } .fa-exclamation-triangle::before { content: ""; } .fa-gift::before              { content: ""; } .fa-square::before          { content: ""; } .fa-tree::before              { content: ""; } .fa-search::before          { content: ""; }  :root { --primary: #1e6dbf; --primary-dark: #164f8a; --green-call: #1db856; --green-hover: #178a42; --dark: #1a1f2e; --dark-card: #222b3a; --slate-700: #3a4a5c; --slate-600: #4e5f72; --slate-500: #6b7c8f; --slate-200: #dde4ed; --slate-100: #edf1f6; --slate-50: #f5f7fa; --accent-yellow: #e8940a; --warm-bg: #fafaf8; --warm-border: #e8e4dc; } *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } body { font-family: "Open Sans", system-ui, sans-serif; color: var(--slate-600); background: var(--warm-bg); line-height: 1.65; padding-bottom: 80px; overflow-x: hidden; } h1, h2, h3, h4 { font-family: "Montserrat", system-ui, sans-serif; color: var(--dark); font-weight: 800; } a { text-decoration: none; color: inherit; transition: all .2s; } img { max-width: 100%; height: auto; display: block; } .container { max-width: 1180px; margin: 0 auto; padding: 0 22px; } .section-padding { padding: 58px 0 62px; } .text-center { text-align: center; }  .flat-card { background: #ffffff; border: 1px solid var(--warm-border); border-radius: 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04); padding: 24px; transition: transform 0.25s, box-shadow 0.25s; } .flat-card:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,0.09); } .bg-slate { background-color: #f2f4f7; }  .section-header { text-align: center; margin-bottom: 38px; } .section-header h2 { margin-bottom: 12px; letter-spacing: -0.3px; } .section-header p { color: var(--slate-600); max-width: 660px; margin: 0 auto; line-height: 1.7; }  .btn { display: inline-flex; align-items: center; gap: 8px; padding: 11px 22px; border-radius: 8px; font-weight: 700; font-size: 0.95rem; transition: all 0.2s; } .btn-primary { background: var(--primary); color: white; } .btn-primary:hover { background: var(--primary-dark); transform: translateY(-1px); } .btn-white { background: white; border: 1.5px solid var(--warm-border); color: var(--dark); } .btn-white:hover { border-color: var(--primary); color: var(--primary); } .btn-green { background: var(--green-call); color: white; padding: 11px 22px; border-radius: 8px; font-weight: 700; display: inline-flex; align-items: center; gap: 8px; transition: background 0.2s, transform 0.15s; } .btn-green:hover { background: var(--green-hover); transform: translateY(-1px); } .btn-outline { background: transparent; border: 2px solid rgba(255,255,255,0.7); color: white; padding: 11px 22px; border-radius: 8px; font-weight: 700; display: inline-flex; align-items: center; gap: 8px; transition: background 0.2s; } .btn-outline:hover { background: rgba(255,255,255,0.12); border-color: white; }  .breadcrumb-wrapper { background: var(--slate-50); border-bottom: 1px solid var(--slate-100); } .breadcrumb-container { max-width: 1200px; margin: 0 auto; padding: 10px 20px; } .breadcrumb-nav { font-size: 0.85rem; color: var(--slate-500); display: flex; align-items: center; flex-wrap: wrap; gap: 6px; } .breadcrumb-nav a { color: var(--slate-500); } .breadcrumb-nav a:hover { color: var(--primary); } .breadcrumb-separator { color: #999; } .breadcrumb-current { color: var(--primary); font-weight: 700; }  header { background: #ffffff; border-bottom: 1px solid #e4ecf4; position: sticky; top: 0; z-index: 1000; padding: 0; box-shadow: none; } .header-container { max-width: 1250px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; padding: 0 24px; height: 64px; gap: 16px; position: relative; } .logo-wrapper { display: flex; align-items: center; gap: 12px; flex-shrink: 0; } .logo-area img { height: 44px; width: auto; } .header-artisan-block { display: flex; align-items: center; gap: 8px; padding-left: 12px; border-left: 1px solid #eef1f5; flex-shrink: 0; } .header-artisan-img { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; border: 2px solid var(--primary); flex-shrink: 0; } .header-artisan-info { display: flex; flex-direction: column; line-height: 1.2; } .header-artisan-name { font-weight: 800; font-size: .78rem; color: var(--dark); } .header-artisan-status { font-size: .67rem; color: var(--green-call); font-weight: 600; display: flex; align-items: center; gap: 4px; } .blinking-dot { width: 7px; height: 7px; background: #4cd137; border-radius: 50%; position: relative; display: inline-block; } .blinking-dot::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: #4cd137; animation: pulse-green 2s infinite; } @keyframes pulse-green { 0%{opacity:1;transform:scale(1)} 70%{opacity:0;transform:scale(2.5)} 100%{opacity:0;transform:scale(2.5)} } .header-actions { display: flex; align-items: center; gap: 15px; } .nav-desktop { display: none; gap: 18px; align-items: center; } .nav-desktop a { font-weight: 700; font-size: .77rem; text-transform: uppercase; letter-spacing: .4px; color: #555; white-space: nowrap; transition: color .2s; } .nav-desktop a:hover { color: var(--primary); } .btn-call-header { display: none; background: var(--green-call); color: white; padding: 10px 20px; border-radius: 50px; font-weight: 700; font-size: .88rem; white-space: nowrap; align-items: center; gap: 8px; box-shadow: 0 2px 10px rgba(33,136,56,.25); transition: background .2s, transform .15s; } .btn-call-header:hover { background: var(--green-hover); transform: scale(1.02); } .hamburger { font-size: 1.6rem; color: var(--dark); cursor: pointer; background: none; border: none; flex-shrink: 0; }  .mobile-menu { position: fixed; top: 64px; left: 0; width: 100%; background: white; flex-direction: column; box-shadow: 0 6px 24px rgba(0,0,0,.13); transform: translateX(-100%); transition: transform .26s cubic-bezier(.4,0,.2,1); display: flex; z-index: 999; border-radius: 0 0 12px 12px; } .mobile-menu.active { transform: translateX(0); } .mm-link { padding: 14px 18px; font-weight: 700; color: var(--dark); border-bottom: 1px solid #f0f0f0; display: flex; align-items: center; gap: 12px; font-size: .88rem; text-transform: uppercase; } .mm-link i { color: var(--primary); font-size: .95rem; width: 22px; text-align: center; } .mm-link:hover { background: #f5f7fa; color: var(--primary); } @media(min-width: 992px) { .nav-desktop, .btn-call-header { display: flex; } .hamburger { display: none; } .mobile-menu { display: none !important; } body { padding-bottom: 0; } } @media(max-width: 768px) { .header-artisan-info { display: none; } }  .hero { background: linear-gradient(155deg, #f0f7ff 0%, #e6f1fb 50%, #f7fbff 100%); padding: 56px 24px 64px; position: relative; overflow: hidden; display: block; } .hero::before { content: ""; position: absolute; right: -80px; top: -80px; width: 420px; height: 420px; background: rgba(30,109,191,.05); border-radius: 50%; pointer-events: none; } .hero::after { content: ""; position: absolute; right: 180px; bottom: -100px; width: 280px; height: 280px; background: rgba(30,109,191,.04); border-radius: 50%; pointer-events: none; } .hero-inner { position: relative; z-index: 2; max-width: 1180px; margin: 0 auto; display: flex; flex-direction: column; gap: 36px; align-items: center; padding: 0; } @media(min-width: 992px) { .hero-inner { flex-direction: row; justify-content: space-between; align-items: center; gap: 48px; } }  .hero-card { background: transparent; border: none; border-radius: 0; box-shadow: none; padding: 0; max-width: 580px; width: 100%; } .hero-eyebrow { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.8px; color: var(--primary); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; } .hero-eyebrow::before { content: ""; display: block; width: 24px; height: 2px; background: var(--primary); border-radius: 2px; flex-shrink: 0; } .hero-card h1 { font-size: clamp(1.9rem, 4vw, 2.6rem); font-weight: 800; line-height: 1.25; color: #1a252f; margin-bottom: 12px; text-transform: none; } .hero-card h1 .h1-brand { display: block; font-size: 0.68em; font-weight: 700; color: var(--primary); letter-spacing: 0.04em; text-transform: uppercase; margin-bottom: 4px; line-height: 1.2; } .hero-card h1 .h1-kw { display: block; } .franchise-link { color: var(--primary); font-weight: 800; text-decoration: underline; font-size: .85em; } .hero-subtitle { font-size: 15px; color: #3a4a5c; line-height: 1.6; margin-bottom: 26px; } .hero-urgence-tag { display: inline-flex; align-items: center; gap: 6px; background: #fef2f2; color: #c62828; font-weight: 800; font-size: .85rem; padding: 7px 14px; border-radius: 50px; margin-bottom: 20px; border: 1px solid #fecaca; }  .hero-buttons { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 0; } .btn-green { background: var(--green-call); color: white; padding: 14px 28px; border-radius: 50px; font-weight: 700; font-size: 1.05rem; display: inline-flex; align-items: center; gap: 10px; box-shadow: 0 4px 18px rgba(29,184,86,.25); transition: background .2s, transform .15s; } .btn-green:hover { background: var(--green-hover); transform: scale(1.02); } .btn-outline { border: 2px solid var(--primary); color: var(--primary); padding: 13px 24px; border-radius: 50px; font-weight: 700; font-size: .9rem; display: inline-flex; align-items: center; gap: 8px; background: transparent; transition: background .2s, color .2s; } .btn-outline:hover { background: var(--primary); color: white; }  .hero-portrait-wrapper { position: relative; flex-shrink: 0; display: flex; justify-content: center; align-items: flex-start; } .hero-blob { width: 240px; height: 270px; border-radius: 20px; border: none; box-shadow: 0 8px 36px rgba(0,0,0,.10); object-fit: cover; display: block; } @media(min-width: 992px) { .hero-blob { width: 280px; height: 310px; } } .hero-status-badge { position: absolute; bottom: -12px; right: -12px; background: var(--green-call); color: white; padding: 7px 14px; border-radius: 50px; font-size: .8rem; font-weight: 700; box-shadow: 0 4px 14px rgba(29,184,86,.35); border: 2px solid #fff; white-space: nowrap; display: flex; align-items: center; gap: 6px; } .dot-white { width: 7px; height: 7px; background: #4cd137; border-radius: 50%; display: inline-block; } .hero-avis-pill { position: absolute; top: -14px; left: -14px; background: #fff; border: 1px solid #e2eaf5; border-radius: 50px; padding: 7px 14px; display: flex; align-items: center; gap: 7px; box-shadow: 0 4px 14px rgba(0,0,0,.09); font-size: 12px; font-weight: 700; color: #1a252f; white-space: nowrap; z-index: 2; text-decoration: none; } .hero-avis-pill .star { color: #f5a623; font-size: 14px; } .hero-avis-pill .count { font-size: 11px; color: #888; font-weight: 400; }  .trust-bar { background: #ffffff; border-top: 1px solid #e4ecf4; border-bottom: 1px solid #e4ecf4; padding: 0; } .trust-container { max-width: 1180px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center; padding: 0 20px; } .trust-item { flex: 1; min-width: 180px; padding: 16px 20px; display: flex; align-items: center; gap: 10px; border-right: 1px solid #e4ecf4; font-size: 13px; font-weight: 700; color: #1a252f; } .trust-item:last-child { border-right: none; } .trust-item i { color: var(--primary); font-size: 1rem; }  .rea-section { background: #ffffff; border-bottom: 1px solid #e4ecf4; padding: 0; } .rea-list { max-width: 1180px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center; padding: 20px; gap: 0; } .rea-item { flex: 1; min-width: 220px; padding: 12px 24px; display: flex; align-items: center; gap: 14px; border-right: 1px solid #e4ecf4; } .rea-item:last-child { border-right: none; } .rea-icon { font-size: 1.4rem; color: var(--primary); } .rea-content h3 { margin: 0; font-size: 13px; font-weight: 800; color: #1a252f; } .rea-content p { margin: 0; font-size: 11px; color: #888; }  .hero-avis-banner { display: none; } .hero-reviews-summary { display: none; }  .hero-avis-banner { position: relative; margin-top: 38px; background: #ffffff; border-radius: 14px; padding: 10px 18px 10px 14px; display: inline-flex; align-items: center; gap: 12px; box-shadow: 0 2px 12px rgba(0,0,0,0.12); border: 1px solid #e8e8e8; white-space: nowrap; z-index: 3; text-decoration: none; animation: fadeUpBadge 0.5s ease 0.3s both; } .hero-avis-banner:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.18); transform: translateY(-1px); transition: all 0.2s; } @keyframes fadeUpBadge { from { opacity:0; transform: translateY(8px); } to { opacity:1; transform: translateY(0); } } .ban-g-logo { width: 32px; height: 32px; flex-shrink: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='%23EA4335' d='M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.08 17.74 9.5 24 9.5z'/%3E%3Cpath fill='%234285F4' d='M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z'/%3E%3Cpath fill='%23FBBC05' d='M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z'/%3E%3Cpath fill='%2334A853' d='M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.18 1.48-4.97 2.31-8.16 2.31-6.26 0-11.57-3.58-13.46-8.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-size: contain; } .ban-text-block { display: flex; flex-direction: column; line-height: 1.3; } .ban-label { font-size: 0.8rem; font-weight: 700; color: #3c3c3c; font-family: "Montserrat", sans-serif; } .ban-rating-row { display: flex; align-items: center; gap: 5px; margin-top: 1px; } .ban-score { font-size: 0.9rem; font-weight: 800; color: #3c3c3c; } .ban-stars { color: #FBBC05; font-size: 1rem; letter-spacing: 1px; line-height: 1; } @keyframes fadeUpBadge { from { opacity:0; transform: translateY(8px); } to { opacity:1; transform: translateY(0); } } @media(min-width: 992px) { .hero-inner { flex-direction: row; justify-content: space-between; padding: 55px 22px; } .hero-card { margin-right: 20px; } .hero-blob { width: 310px; height: 310px; } .hero-card h1 { font-size: 2.35rem; } } @media(max-width: 767px) { .hero-card { padding: 22px 18px; } .hero-card h1 { font-size: 1.72rem; } .hero-blob { width: 210px; height: 210px; } .hero-buttons .btn-green, .hero-buttons .btn-outline { width: 100%; justify-content: center; } .hero-avis-banner { padding: 7px 13px 7px 10px; gap: 8px; border-radius: 10px; } .ban-g-logo { width: 24px; height: 24px; } .ban-label { font-size: 0.70rem; } .ban-score { font-size: 0.80rem; } .ban-stars { font-size: 0.85rem; } }  .trust-bar { background: #fff; border-bottom: 1px solid var(--warm-border); padding: 13px 0; } .trust-container { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px 36px; max-width: 1180px; margin: 0 auto; padding: 0 22px; } .trust-item { display: flex; align-items: center; gap: 8px; font-size: 0.88rem; font-weight: 700; color: var(--slate-700); } .trust-item i { color: var(--primary); font-size: 1.1rem; } .trust-item .fa-star { color: var(--accent-yellow); } .trust-item .fa-check-circle { color: var(--green-call); }  .rea-section { background: white; border-bottom: 1px solid var(--warm-border); padding: 28px 0; } .rea-list { max-width: 1180px; margin: 0 auto; padding: 0 22px; display: flex; flex-wrap: wrap; gap: 16px; justify-content: center; } .rea-item { display: flex; align-items: center; gap: 14px; flex: 0 1 300px; background: var(--slate-50); border: 1px solid var(--warm-border); border-radius: 8px; padding: 18px 22px; } .rea-icon { width: 46px; height: 46px; background: white; border: 1px solid var(--warm-border); border-radius: 9px; display: flex; align-items: center; justify-content: center; color: var(--primary); font-size: 1.3rem; flex-shrink: 0; } .rea-content h3 { font-size: 0.98rem; margin-bottom: 3px; color: var(--dark); } .rea-content p { font-size: 0.84rem; color: var(--slate-600); margin: 0; }  .services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 20px; margin-top: 36px; } .service-icon { width: 46px; height: 46px; background: #eef3fb; border-radius: 9px; display: flex; align-items: center; justify-content: center; color: var(--primary); font-size: 1.4rem; margin-bottom: 16px; } .flat-card ul { list-style: none; margin-top: 14px; } .flat-card li { margin-bottom: 9px; font-size: 0.93rem; display: flex; gap: 9px; align-items: flex-start; } .flat-card li i { color: var(--green-call); margin-top: 4px; }  .flat-card.has-img { padding: 0; overflow: hidden; } .flat-card.has-img .service-card-img { width: 100%; height: 180px; object-fit: cover; display: block; border-radius: 0; } .flat-card.has-img .card-body { padding: 20px 24px 24px; } .flat-card.has-img .card-body ul { list-style: none; margin-top: 14px; } .flat-card.has-img .card-body li { margin-bottom: 9px; font-size: 0.93rem; display: flex; gap: 9px; align-items: flex-start; } .flat-card.has-img .card-body li i { color: var(--green-call); margin-top: 4px; }  .crossell-wrapper { margin-top: 36px; display: flex; flex-wrap: wrap; gap: 18px; } .crossell-card { flex: 1; min-width: 260px; padding: 22px; border-left: 4px solid var(--primary); } .crossell-card h4 { margin-top: 0; font-size: 1.05rem; } .crossell-card p { font-size: 0.93rem; margin-bottom: 10px; color: var(--slate-600); } .crossell-card a { color: var(--primary); font-weight: 700; text-decoration: underline; } .guide-card { flex: 100%; border-left: 4px solid var(--accent-yellow); background: #fdf9ee; }   .carousel-track { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; padding-bottom: 12px; scrollbar-width: none; margin-top: 28px; } .carousel-track::-webkit-scrollbar { display: none; } .carousel-item { flex: 0 0 240px; scroll-snap-align: start; position: relative; border-radius: 10px; overflow: hidden; box-shadow: 0 3px 12px rgba(0,0,0,0.12); background: #000; } .carousel-item img { width: 100%; height: 180px; object-fit: cover; opacity: 0.9; display: block; transition: opacity .25s; } .carousel-item:hover img { opacity: 1; } .gallery-caption { position: absolute; bottom: 0; left: 0; width: 100%; background: linear-gradient(to top, rgba(10,18,36,.85), transparent); color: white; padding: 14px 12px 8px; font-size: 0.82rem; font-weight: 700; }  .avis-header-box { display: flex; align-items: center; justify-content: center; gap: 15px; margin-bottom: 28px; flex-wrap: wrap; } .avis-score { font-size: 2.4rem; font-weight: 900; color: var(--dark); line-height: 1; letter-spacing: -1px; } .avis-scroll-container { display: flex; gap: 16px; overflow-x: auto; padding-bottom: 18px; scroll-snap-type: x mandatory; scrollbar-width: none; -ms-overflow-style: none; } .avis-scroll-container::-webkit-scrollbar { display: none; } .avis-card { flex: 0 0 305px; scroll-snap-align: center; } .avis-card-header { display: flex; justify-content: space-between; margin-bottom: 10px; } .avis-name { font-weight: 800; color: var(--dark); font-size: 0.93rem; } .avis-date { font-size: 0.78rem; color: var(--slate-500); font-style: italic; } .avis-stars { color: var(--accent-yellow); font-size: 0.88rem; letter-spacing: 1px; } .avis-text { font-size: 0.92rem; color: var(--slate-600); line-height: 1.62; font-style: italic; } .avis-cta { text-align: center; margin-top: 22px; }  .steps-wrapper { display: flex; flex-wrap: wrap; gap: 16px; justify-content: center; margin-top: 28px; } .step-card { flex: 0 1 175px; text-align: center; } .step-circle { width: 54px; height: 54px; background: var(--primary); color: white; border-radius: 12px; display: flex; align-items: center; justify-content: center; margin: 0 auto 13px; font-size: 1.3rem; } .step-card h3 { font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.8px; margin-bottom: 7px; color: var(--dark); } .step-card p { font-size: 0.83rem; color: var(--slate-600); line-height: 1.55; } .step-badge { background: var(--accent-yellow); color: var(--dark); padding: 2px 9px; border-radius: 5px; font-size: 0.7rem; font-weight: 800; display: inline-block; margin-top: 6px; }  .materials-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 20px; margin-top: 28px; } .material-item { padding: 26px; } .material-item h3 { margin-bottom: 10px; font-size: 1.05rem; } .material-item hr { border: 0; border-top: 1px solid var(--warm-border); margin: 13px 0; }  .seo-img-float { float: right; margin: 0 0 20px 30px; border-radius: 9px; max-width: 190px; box-shadow: 0 4px 14px rgba(0,0,0,0.12); } @media(max-width: 600px) { .seo-img-float { float: none; margin: 0 auto 20px; display: block; max-width: 130px; } } .owner-article blockquote { border-left: 4px solid var(--primary); padding: 14px 18px; background: #f4f7fc; border-radius: 0 7px 7px 0; margin: 18px 0; font-style: italic; color: var(--slate-700); font-size: 1.02rem; line-height: 1.65; }  .vitrine-features ul { list-style: none; padding: 0; margin: 0; } .vitrine-features li { padding: 9px 0; border-bottom: 1px solid var(--slate-100); display: flex; align-items: center; gap: 10px; font-size: 0.93rem; } .vitrine-features li:last-child { border-bottom: none; } .vitrine-features li i { color: var(--green-call); font-size: 1.05rem; flex-shrink: 0; } .alert-warning { background: #fef5d8; border-left: 4px solid var(--accent-yellow); padding: 14px; border-radius: 5px; margin-bottom: 18px; color: #7a5300; font-weight: 600; font-size: 0.95rem; } .pro-avantages { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 22px; margin-top: 28px; } .pro-av-item { text-align: center; padding: 18px; } .pro-av-icon { width: 58px; height: 58px; background: var(--primary); color: white; border-radius: 11px; display: flex; align-items: center; justify-content: center; margin: 0 auto 13px; font-size: 1.6rem; }  .franchise-icon-box { text-align: center; } .franchise-icon-box i { font-size: 5rem; color: var(--primary); margin-bottom: 20px; display: block; }  .zones-grid { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 28px; } .zone-btn { background: white; border: 1px solid var(--warm-border); color: var(--primary); padding: 7px 14px; border-radius: 6px; font-weight: 600; font-size: 0.83rem; transition: all 0.2s; } .zone-btn:hover { background: var(--primary); color: white; border-color: var(--primary); } #map-container { width: 100%; height: 390px; position: relative; border-radius: 8px; overflow: hidden; border: 1px solid var(--warm-border); } .map-placeholder { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #999; text-align: center; }  .contact-faq-wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; } @media(max-width: 991px) { .contact-faq-wrapper { grid-template-columns: 1fr; } } .form-control { width: 100%; padding: 14px 16px; border: 1px solid var(--warm-border); border-radius: 7px; margin-bottom: 13px; font-family: inherit; font-size: 0.97rem; background: #fafaf8; color: var(--dark); transition: border-color 0.2s, box-shadow 0.2s; } .form-control:focus { outline: none; border-color: var(--primary); background: white; box-shadow: 0 0 0 3px rgba(30,109,191,0.1); } .btn-submit { width: 100%; background: var(--primary); color: white; border: none; padding: 15px; border-radius: 7px; font-size: 1.05rem; font-weight: 800; cursor: pointer; transition: background 0.2s, transform 0.15s; display: flex; align-items: center; justify-content: center; gap: 10px; } .btn-submit:hover { background: var(--primary-dark); transform: translateY(-1px); } .faq-item { background: white; border: 1px solid var(--warm-border); border-radius: 8px; margin-bottom: 12px; overflow: hidden; } .faq-question { padding: 17px 20px; font-weight: 700; color: var(--dark); cursor: pointer; display: flex; justify-content: space-between; align-items: center; font-size: 0.95rem; } .faq-question:hover { background: var(--slate-50); } .faq-question i { transition: transform 0.3s ease; color: var(--primary); } .faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; padding: 0 20px; color: var(--slate-600); line-height: 1.65; } .faq-item.active .faq-answer { padding-bottom: 18px; } .faq-item.active .faq-question i { transform: rotate(180deg); }  .mobile-sticky-bar { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 2000; display: flex; background: white; box-shadow: 0 -3px 14px rgba(0,0,0,0.12); padding-bottom: env(safe-area-inset-bottom); border-top: 1px solid var(--warm-border); transform: translateY(100%); opacity: 0; transition: transform .35s ease, opacity .35s ease; pointer-events: none; } .mobile-sticky-bar.visible { transform: translateY(0); opacity: 1; pointer-events: auto; } .mob-btn-call { flex: 2; background: var(--green-call); color: white; display: flex; align-items: center; justify-content: center; padding: 13px 10px; font-weight: 800; font-size: 1.08rem; gap: 10px; text-decoration: none; } .mob-btn-call:active { background: var(--green-hover); } .mob-btn-call .sub-text { font-size: 0.73rem; font-weight: 600; display: block; opacity: 0.85; line-height: 1.1; margin-top: 2px; } .mob-btn-quote { flex: 1; background: var(--primary); color: white; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 10px 8px; font-weight: 700; font-size: 0.83rem; line-height: 1.2; text-align: center; border-left: 1px solid rgba(255,255,255,0.18); text-decoration: none; } .mob-btn-quote i { font-size: 1.15rem; margin-bottom: 3px; } .mob-btn-quote:active { background: var(--primary-dark); } @media(min-width: 992px) { .mobile-sticky-bar { display: none; } }  #cookie-banner { position: fixed; bottom: 0; left: 0; right: 0; z-index: 9999; background: #1a252f; color: #ecf0f1; padding: 8px 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: nowrap; box-shadow: 0 -4px 20px rgba(0,0,0,0.3); font-family: "Open Sans", sans-serif; font-size: 0.85rem; line-height: 1.4; } #cookie-banner p { margin: 0; flex: 1; color: #bdc3c7; min-width: 0; } #cookie-banner p .cookie-full-text { display: inline; } #cookie-banner p .cookie-short-text { display: none; } #cookie-banner p a { color: #66b2ff; text-decoration: underline; white-space: nowrap; } .cookie-btns { display: flex; gap: 8px; flex-shrink: 0; } .cookie-btn-accept { background: var(--green-call); color: white; border: none; padding: 9px 18px; border-radius: 50px; font-weight: 700; font-size: 0.82rem; cursor: pointer; white-space: nowrap; transition: background .2s; } .cookie-btn-accept:hover { background: var(--green-hover); } .cookie-btn-refuse { background: transparent; color: #bdc3c7; border: 1px solid #4a5a6a; padding: 9px 18px; border-radius: 50px; font-weight: 700; font-size: 0.82rem; cursor: pointer; white-space: nowrap; transition: all .2s; } .cookie-btn-refuse:hover { background: rgba(255,255,255,0.08); color: #fff; border-color: #7f8c8d; } @media(max-width: 991px) { #cookie-banner { padding: 8px 14px; padding-bottom: calc(8px + 52px); font-size: 0.76rem; gap: 6px; } .cookie-btn-accept, .cookie-btn-refuse { padding: 6px 10px; font-size: 0.74rem; } #cookie-banner p .cookie-full-text { display: none; } #cookie-banner p .cookie-short-text { display: inline; } }  footer { background: #141b2a; color: white; padding: 54px 0 0; } .footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 36px; max-width: 1180px; margin: 0 auto; padding: 0 22px 38px; } .footer-col h3 { color: white; margin-bottom: 18px; font-size: 1.15rem; } .footer-col h4 { color: white; margin-bottom: 13px; font-size: 1.05rem; } .footer-col p { color: #8fa0b8; font-size: 0.92rem; line-height: 1.65; } .footer-col ul { list-style: none; } .footer-col ul li { margin-bottom: 10px; color: #8fa0b8; font-size: 0.92rem; display: flex; align-items: center; gap: 8px; } .footer-col ul li i { color: var(--primary); font-size: 0.78rem; } .footer-col ul li a:hover { color: white; text-decoration: underline; } .footer-bottom { border-top: 1px solid #263040; padding: 18px 0; text-align: center; color: #506070; font-size: 0.83rem; } .footer-bottom a { color: #506070; margin: 0 10px; } .footer-bottom a:hover { color: white; }   .assurances-bar { background: #f7f8f5; border-top: 1px solid var(--warm-border); border-bottom: 3px solid var(--primary); padding: 26px 20px; } .assurances-bar-inner { max-width: 1100px; margin: 0 auto; text-align: center; } .assurances-bar-label { display: inline-flex; align-items: center; gap: 7px; font-size: 0.78rem; font-weight: 800; color: var(--primary); text-transform: uppercase; letter-spacing: 1.2px; margin-bottom: 18px; } .assurances-bar-label i { font-size: 0.95rem; }  .assurances-wrap { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 40px; } .assurances-text { flex: 1; min-width: 280px; } .assurances-logos-col { flex: 1; min-width: 260px; } .assurance-carousel { overflow: hidden; width: 100%; position: relative; } .assurance-carousel::before, .assurance-carousel::after { content: ""; position: absolute; top: 0; bottom: 0; width: 40px; z-index: 2; pointer-events: none; } .assurance-carousel::before { left: 0; background: linear-gradient(to right, white, transparent); } .assurance-carousel::after  { right: 0; background: linear-gradient(to left, white, transparent); } .assurance-track { display: flex; gap: 16px; animation: scroll-logos 18s linear infinite; width: max-content; } .assurance-track:hover { animation-play-state: paused; } @keyframes scroll-logos { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } } .assurance-logo { flex: 0 0 auto; background: #fff; border: 1px solid #e8edf4; border-radius: 10px; padding: 12px 16px; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 8px rgba(0,0,0,.05); } .assurance-logo img { height: 48px; width: auto; object-fit: contain; display: block; }  .assurances-bar .assurance-carousel::before { background: linear-gradient(to right, #f7f8f5, transparent); } .assurances-bar .assurance-carousel::after  { background: linear-gradient(to left, #f7f8f5, transparent); } @media(min-width: 992px) { .assurances-bar { display: none; } }  a.franchise-link { color: inherit; text-decoration: underline dotted; text-underline-offset: 3px; cursor: pointer; transition: color 0.2s; } a.franchise-link:hover { color: var(--primary); text-decoration: underline; } .accent-text a.franchise-link, .hero-card a.franchise-link { color: inherit; } .trust-item a.franchise-link { color: inherit; } .step-badge a.franchise-link { color: inherit; text-decoration: none; }  :root{ --mk-navy:#0b2a4a; --mk-navy-2:#143957; --mk-blue:#116fbd; --mk-blue-2:#0b5ea6; --mk-orange:#ff681d; --mk-orange-2:#ff8c19; --mk-text:#172b3d; --mk-muted:#566879; --mk-line:#dfe7ef; --mk-soft:#f5f8fb; --mk-soft-blue:#eaf5fd; --mk-white:#fff; --mk-shadow:0 8px 24px rgba(23,43,61,.09); } html{scroll-behavior:smooth} body{background:#fff;color:var(--mk-text);padding-bottom:72px} .breadcrumb-wrapper{display:none!important} .container{max-width:1180px;margin:0 auto;padding-left:22px;padding-right:22px}  .mk-header{position:sticky;top:0;z-index:1200;background:#fff;border-bottom:1px solid #e5ebf2;box-shadow:0 1px 10px rgba(8,35,59,.05)} .mk-header-inner{max-width:1240px;height:72px;margin:0 auto;padding:0 22px;display:flex;align-items:center;gap:28px} .mk-brand{display:flex;align-items:center;flex:0 0 auto} .mk-brand img{display:block;width:auto;height:51px;max-width:245px;object-fit:contain} .mk-nav{display:flex;align-items:center;justify-content:center;gap:25px;margin-left:auto} .mk-nav a{position:relative;color:#172b3d;font-family:Montserrat,sans-serif;font-size:.79rem;font-weight:600;white-space:nowrap;padding:27px 0 24px} .mk-nav a:hover,.mk-nav a.active{color:var(--mk-blue)} .mk-nav a.active:after,.mk-nav a:hover:after{content:"";position:absolute;left:0;right:0;bottom:17px;height:2px;background:var(--mk-blue);border-radius:2px} .mk-header-call{display:inline-flex;align-items:center;gap:11px;background:linear-gradient(135deg,var(--mk-blue),#2d83cf);color:#fff!important;border-radius:6px;padding:12px 17px;font-family:Montserrat,sans-serif;font-weight:800;font-size:.92rem;box-shadow:0 5px 16px rgba(17,111,189,.23);white-space:nowrap} .mk-header-call i{font-size:1rem} .mk-mobile-actions{display:none;margin-left:auto;align-items:center;gap:8px} .mk-mobile-call,.mk-menu-btn{width:42px;height:42px;border-radius:8px;display:flex;align-items:center;justify-content:center;border:0} .mk-mobile-call{background:var(--mk-blue);color:#fff} .mk-menu-btn{background:#eef4f8;color:var(--mk-navy);font-size:1.15rem;cursor:pointer} .mk-mobile-menu{display:none}  .mk-hero{position:relative;background:var(--mk-navy);overflow:hidden;min-height:455px} .mk-hero-photo{position:absolute;inset:0 0 0 43%;background:url("/assets-vitrerie-2026/hero-vitrerie.webp") center center/cover no-repeat} .mk-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,34,57,.98) 0%,rgba(9,34,57,.96) 37%,rgba(9,34,57,.73) 52%,rgba(9,34,57,.20) 72%,rgba(9,34,57,.03) 100%)} .mk-hero-inner{position:relative;z-index:2;max-width:1180px;margin:0 auto;padding:43px 22px 28px;min-height:455px;display:flex;flex-direction:column;justify-content:center} .mk-hero-copy{width:min(620px,56%);color:#fff} .mk-eyebrow{font-family:Montserrat,sans-serif;font-size:.82rem;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:#fff;margin-bottom:9px} .mk-hero h1{color:#fff;font-family:Montserrat,sans-serif;font-size:clamp(2.35rem,4vw,4rem);font-weight:800;line-height:1.03;letter-spacing:-1.3px;margin:0 0 13px} .mk-hero-lead{font-size:1.02rem;line-height:1.48;max-width:600px;color:#fff;margin:0 0 20px} .mk-hero-lead strong{color:#fff!important;text-transform:none!important} .mk-hero-actions{display:flex;gap:14px;align-items:stretch;flex-wrap:wrap} .mk-call-main,.mk-quote-main{min-height:61px;border-radius:8px;display:inline-flex;align-items:center;gap:13px;font-family:Montserrat,sans-serif;font-weight:800} .mk-call-main{background:linear-gradient(135deg,var(--mk-orange),var(--mk-orange-2));color:#fff;padding:11px 21px;box-shadow:0 8px 20px rgba(255,104,29,.26)} .mk-call-main i{font-size:1.42rem} .mk-call-main .mk-number{display:block;font-size:1.17rem;letter-spacing:.2px;line-height:1.15} .mk-call-main small{display:block;font-family:"Open Sans",sans-serif;font-size:.69rem;font-weight:700;margin-top:3px} .mk-quote-main{border:1px solid rgba(255,255,255,.70);color:#fff;padding:11px 20px;background:rgba(12,42,67,.38)} .mk-quote-main:hover{background:rgba(255,255,255,.1)} .mk-hero-proof{display:flex;gap:37px;align-items:center;margin-top:29px;max-width:680px} .mk-proof{display:flex;gap:11px;align-items:center;color:#fff;font-size:.79rem;font-weight:700;line-height:1.28} .mk-proof i{font-size:1.7rem;color:#fff} .mk-proof span{display:block}  .mk-problems{background:#fff;padding:26px 0 18px} .mk-section-top{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:15px} .mk-section-top h2{font-size:1.55rem;line-height:1.2;margin:0;color:var(--mk-navy);letter-spacing:-.4px} .mk-small-link{color:var(--mk-blue);font-weight:700;font-size:.78rem;white-space:nowrap;border-bottom:1px solid currentColor;padding-bottom:2px} .mk-problem-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px} .mk-problem-card{background:#fff;border:1px solid #e0e7ee;border-radius:11px;padding:10px 10px 14px;text-align:center;box-shadow:0 5px 16px rgba(14,45,70,.055);transition:.18s ease} .mk-problem-card:hover{transform:translateY(-2px);box-shadow:var(--mk-shadow)} .mk-problem-card img{width:100%;height:108px;display:block;object-fit:cover;border-radius:7px;background:#f0f2f4} .mk-problem-card h3{font-size:.92rem;color:var(--mk-navy);margin:8px 0 4px;line-height:1.2} .mk-problem-card p{font-size:.75rem;color:#425466;line-height:1.35;margin:0}  .mk-intent-copy{padding:13px 0 22px;background:#fff} .mk-intent-copy-inner{border-left:4px solid var(--mk-blue);padding:14px 18px;background:#f7fafc;border-radius:0 8px 8px 0;color:#465d70;font-size:.91rem;line-height:1.55} .mk-intent-copy strong{color:var(--mk-navy)}  .mk-trust{padding:0;background:#fff;border-top:1px solid #eef2f6} .mk-trust-grid{display:grid;grid-template-columns:1.02fr 1.08fr;min-height:390px} .mk-trust-photo{min-height:390px;background:url("/assets-vitrerie-2026/maison-vitrages.webp") center center/cover no-repeat} .mk-trust-copy{padding:42px 42px 30px;display:flex;flex-direction:column;justify-content:center} .mk-kicker{font-family:Montserrat,sans-serif;text-transform:uppercase;letter-spacing:1.2px;font-size:.73rem;font-weight:800;color:#43647f;margin-bottom:7px} .mk-trust h2{font-size:2rem;line-height:1.08;color:var(--mk-navy);margin:0 0 10px;letter-spacing:-.5px} .mk-trust-copy>p{font-size:.94rem;line-height:1.55;color:#425466;margin:0;max-width:620px} .mk-strengths{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:28px} .mk-strength{text-align:center;color:#193b5c;font-size:.76rem;line-height:1.3;font-weight:600} .mk-strength i{width:38px;height:38px;margin:0 auto 8px;border-radius:50%;background:#edf6fc;color:var(--mk-blue);display:flex;align-items:center;justify-content:center;font-size:1.05rem} .mk-owner-mini{display:flex;align-items:center;gap:13px;margin-top:23px;padding-top:19px;border-top:1px solid #e6edf3} .mk-owner-mini img{width:54px;height:54px;border-radius:50%;object-fit:cover;border:3px solid #edf4f9} .mk-owner-mini strong{display:block;color:var(--mk-navy);font-family:Montserrat,sans-serif;font-size:.89rem} .mk-owner-mini span{font-size:.76rem;color:#617487}  .mk-reviews{background:linear-gradient(90deg,#e9f5fc,#f3f9fd);padding:24px 0 27px;border-top:1px solid #d9ebf6;border-bottom:1px solid #d9ebf6} .mk-reviews-grid{display:grid;grid-template-columns:190px 1fr auto;gap:18px;align-items:center} .mk-review-summary h2{font-size:1.42rem;color:var(--mk-navy);margin:0 0 2px} .mk-review-summary p{font-size:.77rem;color:#496176;margin:0 0 9px} .mk-google-score{display:flex;align-items:center;gap:12px} .mk-google-g{width:43px;height:43px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.08)} .mk-google-g i{font-size:1.65rem;color:#4285f4} .mk-score-stars{color:#ffa500;letter-spacing:1px;font-size:.96rem;line-height:1} .mk-score-number{display:block;color:var(--mk-navy);font-weight:800;font-size:1.15rem;margin-top:4px} .mk-review-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px} .mk-review-card{position:relative;background:#fff;border:1px solid #e1ebf1;border-radius:10px;padding:16px 16px 13px;min-height:122px;box-shadow:0 4px 13px rgba(13,56,88,.045)} .mk-review-card:before{content:"“";position:absolute;left:12px;top:-7px;font-family:Georgia,serif;font-size:3.2rem;color:#cbd8e3;line-height:1} .mk-review-card p{font-size:.76rem;line-height:1.42;color:#435467;margin:12px 0 8px;padding-left:13px} .mk-review-card strong{font-size:.68rem;color:#31495d} .mk-review-card .stars{font-size:.69rem;color:#ffa500;letter-spacing:.6px;margin-left:6px} .mk-review-link{background:var(--mk-blue);color:#fff!important;border-radius:6px;padding:10px 14px;font-size:.7rem;font-weight:800;white-space:nowrap;align-self:start}  .mk-gallery{padding:24px 0 16px;background:#fff} .mk-gallery-row{display:grid;grid-template-columns:repeat(5,1fr);gap:8px} .mk-gallery-item{position:relative;height:138px;border-radius:7px;overflow:hidden;background:#e8eef3} .mk-gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s ease} .mk-gallery-item:hover img{transform:scale(1.035)} .mk-gallery-item span{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(transparent,rgba(3,26,45,.78));color:#fff;padding:25px 9px 7px;font-size:.67rem;font-weight:700}  .mk-contact{position:relative;background:linear-gradient(110deg,#0b5ea5 0%,#0d6ebd 46%,#1378c4 100%);overflow:hidden;padding:31px 0 34px;color:#fff} .mk-contact:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(4,56,103,.66),rgba(4,56,103,.66)),url("/assets-vitrerie-2026/maison-vitrages.webp") left center/55% auto no-repeat;opacity:.28} .mk-contact-grid{position:relative;z-index:1;display:grid;grid-template-columns:.92fr 1.18fr;gap:46px;align-items:center} .mk-contact-copy h2{font-size:2rem;color:#fff;margin:0 0 4px;line-height:1.1} .mk-contact-copy>p{font-size:.92rem;color:#fff;margin:0;max-width:470px} .mk-contact-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:35px} .mk-contact-benefit{display:flex;align-items:center;gap:9px;font-size:.72rem;font-weight:700;line-height:1.3} .mk-contact-benefit i{font-size:1.45rem} .mk-form-card{background:#fff;border-radius:8px;padding:17px 18px 15px;box-shadow:0 12px 30px rgba(0,27,55,.18)} .mk-form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px 13px} .mk-field{display:flex;flex-direction:column;gap:4px} .mk-field label{font-size:.62rem;font-weight:700;color:#3f5264} .mk-field label .req{color:#e6382f} .mk-field input,.mk-field select,.mk-field textarea{width:100%;border:1px solid #dbe4ec;border-radius:4px;background:#fbfcfd;color:#1e3448;padding:9px 10px;font:inherit;font-size:.73rem;outline:none;min-height:39px} .mk-field input:focus,.mk-field select:focus,.mk-field textarea:focus{border-color:#7db4df;box-shadow:0 0 0 3px rgba(17,111,189,.08)} .mk-field-wide{grid-column:1/-1} .mk-field textarea{height:70px;resize:vertical} .mk-form-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:12px} .mk-submit{border:0;border-radius:5px;background:linear-gradient(135deg,var(--mk-orange),#ff5e11);color:#fff;font-family:Montserrat,sans-serif;font-weight:800;font-size:.76rem;padding:13px 26px;cursor:pointer;box-shadow:0 5px 14px rgba(255,104,29,.24)} .mk-captcha{min-width:304px;display:flex;justify-content:flex-end} #recaptcha-error{color:#d93025!important;font-size:.7rem!important}  .mk-faq-section{background:#f6f8fb;padding:42px 0 48px;border-bottom:1px solid #e7edf3} .mk-faq-section .section-header{text-align:left;margin-bottom:22px} .mk-faq-section .section-header h2{font-size:1.65rem;color:var(--mk-navy)} .mk-faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px} .mk-faq-section .faq-item{background:#fff!important;border:1px solid #e1e8ee!important;border-radius:9px!important;box-shadow:none!important;margin:0!important;overflow:hidden} .mk-faq-section .faq-question{padding:16px 17px!important;font-size:.86rem!important;font-weight:700!important;color:var(--mk-navy)!important} .mk-faq-section .faq-answer{background:#fbfcfd} .mk-faq-section .faq-answer p{font-size:.82rem;line-height:1.55;color:#4d6072}  #depannage-volet,#processus,#owner,[id^="seo-local-"],#hub-villes{background:#fff!important} #depannage-volet .section-header h2,#processus .section-header h2,#owner .section-header h2,[id^="seo-local-"] .section-header h2,#hub-villes .section-header h2{color:var(--mk-navy)} .service-card,.step-card,.owner-card,.zone-btn,.quartier-badge{border-color:#e1e8ee!important} .zone-btn{border-radius:7px!important} footer{background:#082640!important}  .mobile-sticky{z-index:1300!important} .mobile-sticky .bg-call{background:var(--mk-orange)!important} @media(max-width:1050px){ .mk-nav{gap:15px}.mk-nav a{font-size:.73rem}.mk-header-call{font-size:.82rem;padding:11px 13px} .mk-hero-copy{width:62%}.mk-problem-grid{gap:10px}.mk-problem-card img{height:92px} .mk-strengths{gap:10px}.mk-trust-copy{padding:35px 26px} .mk-reviews-grid{grid-template-columns:165px 1fr}.mk-review-link{grid-column:2;justify-self:end}.mk-review-cards{grid-column:2} .mk-contact-grid{gap:28px}.mk-contact-benefits{gap:10px} } @media(max-width:850px){ .mk-header-inner{height:64px;padding:0 14px}.mk-brand img{height:42px}.mk-nav,.mk-header-call{display:none}.mk-mobile-actions{display:flex} .mk-mobile-menu{position:fixed;top:64px;left:0;right:0;background:#fff;border-top:1px solid #e6edf3;box-shadow:0 12px 25px rgba(7,34,56,.13);padding:8px 16px 16px;z-index:1199;display:flex;flex-direction:column;gap:0;transform:translateY(-125%);opacity:0;pointer-events:none;transition:.23s ease} .mk-mobile-menu.active{transform:translateY(0);opacity:1;pointer-events:auto} .mk-mobile-menu a{padding:13px 4px;border-bottom:1px solid #edf1f4;color:var(--mk-navy);font-weight:700;font-size:.86rem} .mk-mobile-menu a:last-child{border-bottom:0} .mk-hero{min-height:510px}.mk-hero-photo{left:39%;opacity:.96}.mk-hero:after{background:linear-gradient(90deg,rgba(8,34,57,.99) 0%,rgba(8,34,57,.95) 49%,rgba(8,34,57,.48) 75%,rgba(8,34,57,.2) 100%)} .mk-hero-inner{min-height:510px;padding:40px 18px 24px}.mk-hero-copy{width:66%}.mk-hero h1{font-size:2.55rem}.mk-hero-lead{font-size:.92rem}.mk-hero-proof{gap:16px;flex-wrap:wrap}.mk-proof{font-size:.72rem} .mk-problem-grid{grid-template-columns:repeat(3,1fr)} .mk-trust-grid{grid-template-columns:1fr}.mk-trust-photo{min-height:310px}.mk-strengths{grid-template-columns:repeat(4,1fr)} .mk-reviews-grid{grid-template-columns:1fr}.mk-review-cards{grid-column:1}.mk-review-link{grid-column:1;justify-self:start}.mk-review-summary{display:flex;align-items:center;justify-content:space-between;gap:20px}.mk-review-summary p{display:none} .mk-gallery-row{grid-template-columns:repeat(3,1fr)}.mk-gallery-item:nth-child(4),.mk-gallery-item:nth-child(5){display:none} .mk-contact-grid{grid-template-columns:1fr}.mk-contact-benefits{max-width:580px}.mk-contact:before{background-size:100% auto}.mk-faq-grid{grid-template-columns:1fr} } @media(max-width:620px){ body{padding-bottom:66px}.container{padding-left:15px;padding-right:15px} .mk-header-inner{padding:0 12px}.mk-brand img{height:38px;max-width:205px} .mk-hero{min-height:640px}.mk-hero-photo{inset:0;background-position:62% top}.mk-hero:after{background:linear-gradient(180deg,rgba(5,28,49,.68) 0%,rgba(6,31,53,.86) 38%,rgba(7,35,59,.99) 68%,rgba(7,35,59,1) 100%)} .mk-hero-inner{min-height:640px;justify-content:flex-end;padding:170px 16px 26px}.mk-hero-copy{width:100%}.mk-eyebrow{font-size:.7rem}.mk-hero h1{font-size:2.25rem;line-height:1.04;letter-spacing:-.6px}.mk-hero-lead{font-size:.89rem;line-height:1.45}.mk-hero-actions{display:grid;grid-template-columns:1fr}.mk-call-main,.mk-quote-main{justify-content:center;width:100%}.mk-hero-proof{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:20px}.mk-proof:last-child{grid-column:1/-1}.mk-proof i{font-size:1.4rem} .mk-problems{padding-top:23px}.mk-section-top{align-items:center}.mk-section-top h2{font-size:1.28rem}.mk-small-link{font-size:.69rem}.mk-problem-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:11px;padding-bottom:8px;margin-right:-15px;padding-right:15px}.mk-problem-card{flex:0 0 74%;scroll-snap-align:start}.mk-problem-card img{height:125px}.mk-problem-card h3{font-size:.96rem}.mk-problem-card p{font-size:.79rem} .mk-trust-photo{min-height:260px}.mk-trust-copy{padding:28px 17px}.mk-trust h2{font-size:1.72rem}.mk-trust-copy>p{font-size:.88rem}.mk-strengths{grid-template-columns:1fr 1fr;gap:17px}.mk-strength{font-size:.74rem} .mk-reviews{padding:22px 0}.mk-review-summary{display:block}.mk-review-summary p{display:block}.mk-review-cards{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:7px}.mk-review-card{flex:0 0 83%;scroll-snap-align:start} .mk-gallery-row{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}.mk-gallery-item,.mk-gallery-item:nth-child(4),.mk-gallery-item:nth-child(5){display:block;flex:0 0 78%;height:175px;scroll-snap-align:start} .mk-contact{padding:28px 0 31px}.mk-contact-copy h2{font-size:1.65rem}.mk-contact-copy>p{font-size:.84rem}.mk-contact-benefits{grid-template-columns:1fr;gap:11px;margin-top:21px}.mk-form-card{padding:14px}.mk-form-grid{grid-template-columns:1fr}.mk-field-wide{grid-column:1}.mk-form-bottom{align-items:stretch;flex-direction:column}.mk-submit{width:100%}.mk-captcha{min-width:0;justify-content:center;overflow:hidden}.g-recaptcha{transform:scale(.88);transform-origin:left top;width:267px;height:69px} .mk-faq-section{padding:32px 0 38px} }  body{ font-family:"Open Sans",system-ui,sans-serif; color:#3f5366; background:#fff!important; } h1,h2,h3,h4{font-family:Montserrat,system-ui,sans-serif} a{transition:.18s ease} .breadcrumb-wrapper{display:none!important}  .mk-h1-brand{ display:block; color:#fff; font-size:.42em; line-height:1.15; text-transform:uppercase; letter-spacing:.8px; margin-bottom:8px; } .mk-h1-main{display:block} .mk-hero h1 .franchise-link{ color:#fff!important; text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px; } .mk-hero-tag{ display:inline-flex; align-items:center; gap:8px; max-width:100%; margin:-3px 0 18px; padding:8px 12px; border:1px solid rgba(255,255,255,.22); border-radius:7px; color:#eef8ff; background:rgba(8,37,61,.35); font-size:.73rem; line-height:1.35; font-weight:700; } .mk-hero-tag a{color:#fff!important} .mk-score-label{display:block;font-size:.67rem;color:#526b80;margin-top:2px} .mk-section-sub{font-size:.78rem;color:#5b6f81;margin:3px 0 0} .mk-gallery-context{font-size:.82rem;color:#586c7c;margin:-4px 0 14px} .mk-gallery-item{margin:0} .mk-gallery-item span{font-family:"Open Sans",sans-serif}  .section-padding{ padding:46px 0!important; } .bg-slate{background:#f5f8fb!important} .flat-card{ border:1px solid #e1e8ee!important; border-radius:10px!important; box-shadow:0 5px 18px rgba(14,45,70,.06)!important; background:#fff!important; } .flat-card:hover{transform:none!important} .section-header h2,
#owner h2,
#vitrines-pro h2,
#assurances h2,
#hub-villes h2{ color:var(--mk-navy)!important; } .section-header p{color:#5c6f80!important}  #owner{background:#fff!important} #owner .owner-article{ max-width:1040px; margin:0 auto; padding:34px 38px!important; } #owner .owner-article h2{ border-left:4px solid var(--mk-blue)!important; padding-left:15px!important; font-size:1.65rem!important; } #owner .owner-article h3{color:var(--mk-navy)} #owner .owner-article p{font-size:.94rem;line-height:1.75;color:#526779} #owner .owner-article blockquote{ border-left:4px solid #9cc7e7; background:#f4f9fd; color:#3d566b; margin:24px 0; padding:16px 20px; border-radius:0 8px 8px 0; font-style:italic; } #owner .seo-img-float{ width:150px!important; height:150px!important; border-radius:50%!important; object-fit:cover!important; border:5px solid #edf5fb; box-shadow:0 8px 24px rgba(10,48,78,.12); margin-left:28px!important; }  [id^="seo-local-"]{ background:#f7fafc!important; } [id^="seo-local-"] .flat-card{ max-width:1040px; margin:auto; }  #vitrines-pro{ background:#f5f8fb!important; } #vitrines-pro > .container > div:first-child{ max-width:1100px; margin:auto; } #vitrines-pro img{ border-radius:13px!important; box-shadow:0 10px 28px rgba(8,38,62,.12)!important; } #vitrines-pro .vitrine-features{ padding:22px!important; } #vitrines-pro .vitrine-features ul{list-style:none;padding:0;margin:12px 0 0} #vitrines-pro .vitrine-features li{ display:flex; gap:9px; align-items:flex-start; padding:10px 0; border-bottom:1px solid #e8eef3; font-size:.9rem; } #vitrines-pro .vitrine-features li:last-child{border-bottom:0} #vitrines-pro .vitrine-features i{color:#20ad59;margin-top:3px} #vitrines-pro .alert-warning{ border-left:4px solid #f0a000; background:#fff7da; color:#73531d; border-radius:5px; padding:13px 15px; margin:17px 0; font-size:.88rem; } #vitrines-pro .pro-avantages{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; } #vitrines-pro .pro-av-item{text-align:center} #vitrines-pro .pro-av-icon{ width:46px;height:46px;border-radius:50%; display:flex;align-items:center;justify-content:center; margin:0 auto 10px; background:#eaf4fb;color:var(--mk-blue); }  #assurances{background:#fff!important} #assurances .assurances-wrap{ display:grid; grid-template-columns:1.05fr .95fr; gap:44px; max-width:1080px; margin:auto; align-items:center; } #assurances .assurances-text h2{font-size:1.8rem!important} #assurances .assurances-text p{line-height:1.65;color:#516678} #assurances .assurances-logos-col{ background:#f7fafc; border:1px solid #e0e8ef; border-radius:12px; padding:22px; } #assurances .assurance-carousel{overflow:hidden} #assurances .assurance-track{ display:flex; gap:12px; width:max-content; animation:mkAssurance 30s linear infinite; } #assurances .assurance-logo{ width:130px;height:72px;display:flex;align-items:center;justify-content:center; background:#fff;border:1px solid #e4eaf0;border-radius:8px;padding:10px; } #assurances .assurance-logo img{max-width:100%;max-height:52px;object-fit:contain} @keyframes mkAssurance{to{transform:translateX(-50%)}}  #hub-villes{background:#f5f8fb!important} #hub-villes #map-container{ max-width:1050px; margin:0 auto; border-radius:12px!important; } #hub-villes .zones-grid{ max-width:1050px; margin:22px auto 0; display:flex; flex-wrap:wrap; justify-content:center; gap:9px; } #hub-villes .zone-btn{ background:#fff!important; color:#23445e!important; border:1px solid #dbe5ec!important; padding:8px 13px!important; font-size:.77rem!important; font-weight:700!important; box-shadow:none!important; } #hub-villes .zone-btn:hover{border-color:#77add5!important;color:var(--mk-blue)!important}  .btn.btn-primary,
.btn-submit{ background:var(--mk-blue)!important; color:#fff!important; border:0!important; } .btn.btn-white{ background:#fff!important; color:var(--mk-navy)!important; border:1px solid #dce5ec!important; } .btn-green{background:#1fad59!important}  .crossell-wrapper{ max-width:1040px; margin:auto; display:grid!important; grid-template-columns:1fr 1fr; gap:16px!important; } .crossell-wrapper .crossell-card{ padding:22px!important; } .crossell-wrapper .guide-card{grid-column:1/-1} .crossell-wrapper h4{color:var(--mk-navy)} .crossell-wrapper a{color:var(--mk-blue)!important;font-weight:800}  footer{ background:#082640!important; color:#dce9f3!important; padding-top:42px!important; } footer .footer-grid{ max-width:1180px; margin:auto; padding:0 22px 34px; display:grid; grid-template-columns:1.1fr 1fr 1fr; gap:45px; } footer h3,footer h4{color:#fff!important} footer p,footer li,footer a{color:#dce9f3!important} footer ul{list-style:none;padding:0} footer li{margin:9px 0;font-size:.85rem} footer .footer-bottom{ border-top:1px solid rgba(255,255,255,.12); padding:17px 0; font-size:.75rem; color:#bdd0df; }  .mobile-sticky-bar{ position:fixed!important; left:0;right:0;bottom:0; z-index:1500!important; display:none; grid-template-columns:1.25fr .75fr; gap:0; box-shadow:0 -7px 22px rgba(4,32,54,.18); transform:translateY(110%); transition:transform .25s ease; } .mobile-sticky-bar.visible{transform:translateY(0)} .mobile-sticky-bar a{ min-height:61px; display:flex;align-items:center;justify-content:center;gap:9px; color:#fff!important;font-weight:800;font-size:.82rem; } .mob-btn-call{background:linear-gradient(135deg,var(--mk-orange),#ff8517)!important} .mob-btn-quote{background:var(--mk-blue)!important}  #cookie-banner{ border-radius:10px!important; box-shadow:0 12px 36px rgba(10,34,53,.18)!important; }  @media(max-width:900px){ #assurances .assurances-wrap{grid-template-columns:1fr} #vitrines-pro .pro-avantages{grid-template-columns:1fr} footer .footer-grid{grid-template-columns:1fr 1fr} } @media(max-width:620px){ .mk-h1-brand{font-size:.39em} .mk-hero-tag{font-size:.68rem} #owner .owner-article{padding:25px 18px!important} #owner .seo-img-float{ float:none!important; display:block!important; margin:0 auto 18px!important; } #vitrines-pro{padding-top:34px!important} #vitrines-pro > .container > div:first-child{gap:23px!important} #vitrines-pro .flat-card[style*="margin-top:50px"]{padding:24px 18px!important} #assurances .assurances-logos-col{padding:15px} .crossell-wrapper{grid-template-columns:1fr} .crossell-wrapper .guide-card{grid-column:auto} footer .footer-grid{grid-template-columns:1fr;gap:25px} .mobile-sticky-bar{display:grid} }  .mk-hero-owner{display:flex;align-items:center;gap:16px;margin-bottom:20px;color:#fff} .mk-hero-owner img{display:block;flex:0 0 auto;width:96px;height:96px;object-fit:cover;border-radius:50%;border:3px solid #fff;box-shadow:0 5px 20px rgba(0,0,0,.25)} .mk-hero-owner strong{display:block;font-family:Montserrat,system-ui,sans-serif;font-size:1rem;line-height:1.4} .mk-hero-owner span{display:block;font-size:.8rem;color:#e0edf7;margin-top:3px} .mk-google-g img{display:block;width:32px;height:32px} .mk-reviews{background:#f8f9fa;border-color:#e8eaed} .mk-review-link{background:#fff;color:#174ea6!important;border:1px solid #dadce0;box-shadow:0 2px 5px rgba(60,64,67,.08)} .mk-review-link:hover{background:#f1f3f4} .mobile-sticky-bar .mob-btn-reviews{background:#fff;color:#263238!important;flex-direction:row;padding:8px;gap:8px;border-left:1px solid #dadce0;line-height:1.25} .mob-btn-reviews img{flex:0 0 auto;width:26px;height:26px} .mob-btn-reviews small{display:block;font-size:.65rem;font-weight:600;color:#52616b;margin-top:3px} @media(max-width:620px){ .mk-hero-owner{gap:13px;margin-bottom:17px} .mk-hero-owner img{width:84px;height:84px} .mk-hero-owner strong{font-size:.88rem} .mk-hero-owner span{font-size:.74rem} }
@media(max-width:620px){.mk-hero-photo{background-image:url('/assets-vitrerie-2026/hero-vitrerie-mobile.webp')}}