.site-k7-design{--ink:#352b25;--accent:#76543c;--cream:#f4efe6}
.site-hli{--ink:#172d23;--accent:#356443;--cream:#f4f5ed}
.site-roy-houle{--ink:#1b2d3c;--accent:#a83227;--cream:#f4f2ec}
.site-gazon-canada{--ink:#223021;--accent:#2b6e37;--cream:#f7f8ef}
.site-leks{--ink:#21362a;--accent:#b8ce76;--cream:#f2f0e7}
.site-meunier{--ink:#102b40;--accent:#155f85;--cream:#f4f7f8}
.site-boulatec{--ink:#182329;--accent:#e2b92e;--cream:#f3f4f0}
.studio .hero-caption{left:20px}
/* Logo sizes use visible artwork, not the dimensions of padded source files. */
.site-header .brand{flex:0 1 auto;min-width:0;gap:14px;max-width:300px;padding:0;background:transparent}
.site-header .brand .brand-logo{display:block;flex:none;object-fit:contain;max-width:none}
.site-k7-design .site-header .brand-logo{width:auto;height:78px}
.site-k7-design .site-header{min-height:108px}
.site-roy-houle .site-header .brand-logo{width:69px;height:auto;mix-blend-mode:multiply}
.site-roy-houle .brand-text{font:700 21px/1.1 var(--sans);letter-spacing:-.035em}
/* Gazon Canada: the 2026 logo has light lettering, so the header itself is dark instead of a plate behind the logo. */
.site-gazon-canada .site-header{min-height:110px;background:var(--ink);color:var(--cream);border-bottom-color:#ffffff24}
.site-gazon-canada .brand-art{padding:0;background:none;flex:none}
.site-gazon-canada .previewbar{background:#e7eddb;color:var(--ink)}
.site-gazon-canada .previewbar a:focus-visible{outline-color:var(--ink)}
.site-gazon-canada .site-header .brand-logo{width:250px;height:auto}
.site-gazon-canada .site-header .nav a:not(.btn):hover{color:#c6e0a6}
.site-gazon-canada .site-header .btn{background:var(--cream);color:var(--ink);border-color:var(--cream)}
.site-gazon-canada .site-header .lang{border-left-color:#ffffff40}
.site-gazon-canada .site-header .lang a{opacity:.72}
.site-gazon-canada .site-header .lang a[aria-current]{opacity:1}
.site-gazon-canada .site-header .menu-toggle{color:var(--cream);border-color:#ffffff59}
.site-gazon-canada .site-header a:focus-visible,.site-gazon-canada .site-header button:focus-visible{outline-color:var(--cream)}
.site-gazon-canada .hero-media>img{object-position:50% 62%}
.site-gazon-canada .ribbon{font-size:14px;font-weight:600;gap:18px 32px}
.site-gazon-canada .ribbon b{color:var(--accent);font-weight:700}
/* Service cards: photo on top, whole card clickable through its arrow link. */
.site-gazon-canada .services-list .service{position:relative;min-height:0;padding:0 28px 28px;overflow:hidden}
.site-gazon-canada .services-list .service:hover{padding:0 28px 28px}
.site-gazon-canada .service-photo{display:block;width:calc(100% + 56px);max-width:none;margin:0 -28px 6px;height:200px;object-fit:cover;transition:transform .5s}
.site-gazon-canada .service:hover .service-photo{transform:scale(1.03)}
.site-gazon-canada .service a:after{content:"";position:absolute;inset:0}
.site-gazon-canada .contact-facts{list-style:none;padding:0;margin:30px 0 0;max-width:460px;font-size:15px}
.site-gazon-canada .contact-facts li{padding:12px 0;border-top:1px solid #ffffff2e}
.site-gazon-canada .contact-facts b{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;opacity:.75;margin-bottom:2px}
.site-leks .site-header .brand-logo{width:138px;height:auto;mix-blend-mode:multiply}
.site-leks .brand-art{mix-blend-mode:multiply}
.site-meunier .site-header .brand-logo{width:245px;height:auto;mix-blend-mode:multiply}
.site-hli .brand-text,.site-boulatec .brand-text{font:700 23px/1.1 var(--sans);letter-spacing:-.035em}
.site-header .brand-text small{font:500 11px/1.4 var(--sans);letter-spacing:.025em;margin-top:6px}
@media(max-width:820px){
 .site-header .brand{gap:9px;max-width:58%;padding:0}
 .site-k7-design .site-header{min-height:88px}
 .site-k7-design .site-header .brand-logo{height:64px;width:auto}
 .site-roy-houle .site-header .brand-logo{width:53px;height:auto}
 .site-roy-houle .brand-text{font-size:18px}
 .site-gazon-canada .site-header{min-height:92px}
 .site-gazon-canada .site-header .brand-logo{width:184px;height:auto}
 .site-gazon-canada .site-header .nav{background:var(--ink);border-bottom-color:#ffffff24}
 .site-leks .site-header .brand-logo{width:106px;height:auto}
 .site-meunier .site-header .brand-logo{width:178px;height:auto}
 .site-hli .brand-text,.site-boulatec .brand-text{font-size:20px}
 .site-header .brand-text small{font-size:10px}
 .studio .hero-caption{left:16px}
}
@media(max-width:360px){.site-header .brand{gap:7px}.site-gazon-canada .site-header .brand-logo{width:156px}.site-roy-houle .site-header .brand-logo{width:42px}.site-roy-houle .brand-text{font-size:16px}.site-meunier .site-header .brand-logo{width:145px}}
@media(max-width:480px){.site-gazon-canada .services-list .service,.site-gazon-canada .services-list .service:hover{padding:0 22px 24px}.site-gazon-canada .service-photo{width:calc(100% + 44px);margin:0 -22px 4px;height:180px}.site-gazon-canada .ribbon span{width:auto}}
/* Wide screens: the shared rule centres every .section on a 1600px container using the full viewport width.
   The about band's text sits in a half-width column, so keep a normal gutter beside the photo and align only its outer edge. */
@media(min-width:1700px){.site-gazon-canada .about-band .section{padding-left:var(--gutter);padding-right:max(var(--gutter),calc((100vw - 1600px)/2));align-self:center}}
/* Responsive pass (17 Oct 2026). */
.site-gazon-canada .policy h1{font-size:clamp(34px,8.5vw,58px);overflow-wrap:break-word;hyphens:auto}
@media(min-width:1700px){.site-gazon-canada .policy{padding-left:var(--gutter);padding-right:var(--gutter)}}
@media(max-width:700px){.site-gazon-canada .steps{grid-template-columns:1fr;gap:28px}}
@media(min-width:481px) and (max-width:820px){
 .site-gazon-canada .services-list{grid-template-columns:1fr}
 .site-gazon-canada .services-list .service,.site-gazon-canada .services-list .service:hover{display:grid;grid-template-columns:minmax(200px,42%) 1fr;grid-template-rows:auto auto 1fr auto;column-gap:26px;row-gap:10px;align-items:start;padding:0 26px 0 0;min-height:0}
 .site-gazon-canada .service-photo{grid-column:1;grid-row:1/-1;width:100%;height:100%;min-height:210px;margin:0}
 .site-gazon-canada .services-list .service .num{grid-column:2;grid-row:1;margin-top:24px}
 .site-gazon-canada .services-list .service h3{grid-column:2;grid-row:2}
 .site-gazon-canada .services-list .service p{grid-column:2;grid-row:3}
 .site-gazon-canada .services-list .service a{grid-column:2;grid-row:4;margin:4px 0 24px}
}
@media(max-width:480px){.site-gazon-canada .hero-copy .eyebrow{font-size:11px}}
/* Privacy policy (17 Oct 2026). */
.site-gazon-canada .policy h2{font-size:clamp(24px,3.2vw,32px);margin:36px 0 12px}
.site-gazon-canada .policy .notice{margin:20px 0 32px}
/* Featured service: topdressing and overseeding (client request, 18 Oct 2026). */
.site-gazon-canada .services-list .service.service-featured,.site-gazon-canada .services-list .service.service-featured:hover{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:0;align-items:stretch;padding:0;background:var(--ink);color:var(--cream);border-color:var(--ink)}
.site-gazon-canada .service-featured .service-photo{grid-column:1;grid-row:1;width:100%;height:100%;min-height:380px;margin:0}
.site-gazon-canada .service-featured .featured-body{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:14px;padding:44px 48px}
.site-gazon-canada .featured-badge{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;background:var(--accent);color:#fff;padding:6px 12px;border-radius:999px}
.site-gazon-canada .service-featured h3{font-size:clamp(28px,2.6vw,40px)}
.site-gazon-canada .service-featured .featured-sub{margin:-6px 0 0;font-weight:600;opacity:.75}
.site-gazon-canada .service-featured p{font-size:16px;max-width:520px}
.site-gazon-canada .featured-points{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.site-gazon-canada .featured-points li{font-size:13px;padding:5px 12px;border:1px solid #ffffff45;border-radius:999px}
.site-gazon-canada .services-list .service-featured a.btn{width:auto;height:auto;min-height:52px;display:inline-flex;margin:8px 0 0;padding:15px 24px;font-size:14px;border-radius:28px;background:var(--cream);color:var(--ink);border:1px solid var(--cream)}
.site-gazon-canada .services-list .service-featured a.btn:hover{background:var(--accent);border-color:var(--accent);color:#fff}
@media(max-width:820px){
 .site-gazon-canada .services-list .service.service-featured,.site-gazon-canada .services-list .service.service-featured:hover{display:block;padding:0}
 .site-gazon-canada .service-featured .service-photo{width:100%;height:240px;min-height:0;margin:0}
 .site-gazon-canada .service-featured .featured-body{padding:26px 24px 28px}
 .site-gazon-canada .services-list .service-featured a.btn{width:100%;justify-content:center}
}
/* Service checkboxes as chips: a request can cover several services (18 Oct 2026). */
.site-gazon-canada .service-choices{border:0;margin:0;padding:0;min-width:0}
.site-gazon-canada .service-choices legend{padding:0;margin-bottom:10px;font-size:13px;font-weight:500}
.site-gazon-canada .service-choices .hint{font-weight:400;opacity:.7}
.site-gazon-canada .chips{display:flex;flex-wrap:wrap;gap:8px}
.site-gazon-canada .chip{position:relative;display:inline-flex}
.site-gazon-canada .chip input{position:absolute;left:12px;bottom:0;width:1px;height:1px;min-height:0;padding:0;margin:0;opacity:0}
.site-gazon-canada .chip span{display:inline-flex;align-items:center;min-height:44px;padding:9px 16px;border:1px solid var(--line);border-radius:999px;font-size:14px;line-height:1.3;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.site-gazon-canada .chip span:hover{border-color:var(--accent)}
.site-gazon-canada .chip input:checked+span{background:var(--accent);border-color:var(--accent);color:#fff}
.site-gazon-canada .chip input:checked+span:before{content:"✓";margin-right:7px;font-weight:700}
.site-gazon-canada .chip input:focus-visible+span{outline:3px solid var(--accent);outline-offset:2px}
/* Real work gallery: six even tiles, before/after labels (client photos, 18 Oct 2026). */
.site-gazon-canada .gallery-grid{grid-template-columns:repeat(3,1fr);gap:22px}
.site-gazon-canada .gallery-item:nth-child(n){padding:0;grid-column:auto}
.site-gazon-canada .gallery-item img,.site-gazon-canada .gallery-item:first-child img{height:320px}
.site-gazon-canada .ba-label{position:absolute;top:14px;left:14px;z-index:1;padding:5px 12px;border-radius:999px;background:var(--ink);color:var(--cream);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
@media(max-width:1100px){.site-gazon-canada .gallery-grid{grid-template-columns:repeat(2,1fr)}.site-gazon-canada .gallery-item img,.site-gazon-canada .gallery-item:first-child img{height:280px}}
@media(max-width:480px){.site-gazon-canada .gallery-grid{gap:12px}.site-gazon-canada .gallery-item img,.site-gazon-canada .gallery-item:first-child img{height:190px}.site-gazon-canada .ba-label{top:8px;left:8px;padding:4px 9px;font-size:10px}}
/* Before / during / after band: three steps on desktop, swipeable on phones (18 Oct 2026). */
.site-gazon-canada .transformation{background:var(--ink);color:var(--cream)}
.site-gazon-canada .ba-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.site-gazon-canada .ba-step figure{margin:0}
.site-gazon-canada .ba-step button{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;overflow:hidden}
.site-gazon-canada .ba-step img{width:100%;height:auto;aspect-ratio:16/11;object-fit:cover;transition:transform .5s}
.site-gazon-canada .ba-step button:hover img{transform:scale(1.03)}
.site-gazon-canada .ba-step figcaption{display:flex;gap:14px;align-items:flex-start;padding-top:18px;font-size:15px;line-height:1.5}
.site-gazon-canada .ba-num{flex:none;width:30px;height:30px;display:grid;place-items:center;border:1px solid #ffffff59;border-radius:50%;font-size:13px}
.site-gazon-canada .ba-step:last-child .ba-num{background:var(--cream);color:var(--ink);border-color:var(--cream)}
.site-gazon-canada .ba-step figcaption b{display:block;font:500 22px/1.2 var(--display);letter-spacing:-.02em;margin-bottom:2px}
.site-gazon-canada .ba-dots{display:none}
.site-gazon-canada .gallery-grid{grid-template-columns:repeat(4,1fr)}
@media(max-width:1100px){.site-gazon-canada .gallery-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){
 .site-gazon-canada .ba-steps{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin:0 calc(var(--gutter)*-1);padding:0 var(--gutter);scrollbar-width:none}
 .site-gazon-canada .ba-steps::-webkit-scrollbar{display:none}
 .site-gazon-canada .ba-step{flex:0 0 84%;scroll-snap-align:center}
 .site-gazon-canada .ba-dots{display:flex;justify-content:center;gap:8px;margin-top:22px}
 .site-gazon-canada .ba-dots span{width:8px;height:8px;border-radius:50%;background:#ffffff4d;transition:background .2s}
 .site-gazon-canada .ba-dots span.on{background:var(--cream)}
}

/* Live form: an unsent request must not look like the green confirmation. */
.form-feedback[data-state=error]{background:#fbefe6;border-color:#c0773f}
