/* Chandler Home Plumbing & Repair
   Pine teal + sand from the logo. Montserrat (same family as the logo) for headings, Lato for text.
   Dark teal page tops with a wall of small, sharp job photos. Photos are always shown at or
   below their real pixel size, so nothing is stretched. Bullets are the water drop from the logo. */
:root{
  --teal:#0e3b3b; --deep:#082a2b; --teal-2:#175757; --teal-3:#236e6c;
  --sand:#c8a66e; --sand-d:#a98549; --sand-l:#ecdfc6;
  --mist:#eff4f3; --line:#d9e3e1; --ink:#152524; --muted:#556664; --paper:#fff;
  --w:1200px; --r:8px; --rp:6px;
  --hf:"Montserrat",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --bf:"Lato",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --shadow:0 18px 44px rgba(8,42,43,.14);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font:400 1.0625rem/1.65 var(--bf);color:var(--ink);background:var(--paper);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--teal-2);text-underline-offset:3px}
a:hover{color:var(--teal)}
a[href^="tel:"]{white-space:nowrap}
a[href^="mailto"]{overflow-wrap:anywhere}
h1,h2,h3{font-family:var(--hf);color:var(--teal);margin:0 0 .5em;font-weight:800;letter-spacing:-.022em;line-height:1.1;text-wrap:balance}
h1{font-size:clamp(2.15rem,1.2rem + 3.4vw,3.55rem);line-height:1.04}
h2{font-size:clamp(1.6rem,1.15rem + 1.7vw,2.3rem)}
h3{font-size:1.14rem;font-weight:700;letter-spacing:-.01em;line-height:1.25}
p{margin:0 0 1em}
ul,ol{margin:0 0 1em;padding:0;list-style:none}
figure{margin:0}
address{font-style:normal}
[id]{scroll-margin-top:96px}
.wrap{width:min(var(--w),100% - 2.5rem);margin-inline:auto}
.slim{max-width:800px}
.center{text-align:center}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:.6rem 1rem;z-index:99}
.skip:focus{left:1rem}
.ico{width:1.15em;height:1.15em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
:focus-visible{outline:3px solid var(--sand);outline-offset:2px}
.chev{display:block;flex:none;width:.6rem;height:.6rem;border-top:2.5px solid currentColor;border-right:2.5px solid currentColor;transform:rotate(45deg);margin-right:.25rem}

/* top bar + header */
.util{background:var(--deep);color:#c9dad8;font-size:.84rem}
.util-in{display:flex;justify-content:space-between;gap:1rem;padding:.5rem 0}
.util span{display:inline-flex;align-items:center;gap:.45rem}
.util .ico{color:var(--sand)}
.hd{background:#fff;position:sticky;top:0;z-index:40;box-shadow:0 1px 0 var(--line),0 6px 18px rgba(8,42,43,.05)}
.hd-in{display:flex;align-items:center;gap:1.5rem;min-height:86px}
.logo img{height:50px;width:auto}
.nav{margin-left:auto}
.nav ul{display:flex;gap:.15rem;margin:0}
.nav a{display:block;padding:.5rem .7rem;color:var(--ink);text-decoration:none;font:600 .92rem var(--hf);letter-spacing:-.005em;border-bottom:3px solid transparent}
.nav a:hover{color:var(--teal-2);border-bottom-color:var(--sand-l)}
.nav a.on{color:var(--teal);border-bottom-color:var(--sand)}
.hd-call{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--teal)}
.hd-ic{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--sand);color:var(--deep);font-size:1.1rem}
.hd-num{font:800 1.22rem/1.1 var(--hf);letter-spacing:-.02em;white-space:nowrap}
.hd-num small{display:block;font:400 .78rem/1.3 var(--bf);letter-spacing:0;color:var(--muted)}
.hd-call:hover .hd-ic{background:var(--teal);color:#fff}
.burger{display:none;width:46px;height:46px;border:0;border-radius:var(--rp);background:var(--mist);cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px}
.burger i{display:block;width:21px;height:2.5px;background:var(--teal);border-radius:2px;transition:transform .2s,opacity .2s}
.burger[aria-expanded="true"] i:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;padding:.95rem 1.45rem;border-radius:var(--rp);border:2px solid transparent;font:700 1rem/1.15 var(--hf);letter-spacing:-.005em;text-decoration:none;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.btn-sand{background:var(--sand);color:var(--deep);border-color:var(--sand)}
.btn-sand:hover{background:#fff;border-color:#fff;color:var(--deep)}
.btn-teal{background:var(--teal);color:#fff;border-color:var(--teal)}
.btn-teal:hover{background:var(--teal-2);border-color:var(--teal-2);color:#fff}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.btn-ghost:hover{background:#fff;border-color:#fff;color:var(--deep)}
.btn.wide{width:100%}
.more{font:700 .98rem var(--hf);color:var(--teal);text-decoration:none;display:inline-flex;align-items:center;gap:.5rem;border-bottom:2px solid var(--sand);padding-bottom:2px}
.more::after{content:"";width:.45rem;height:.45rem;border-top:2.5px solid currentColor;border-right:2.5px solid currentColor;transform:rotate(45deg)}
.more:hover{color:var(--teal-3)}

/* drop bullets (the water drop from the logo) */
.drops{display:grid;gap:.6rem}
.drops li{position:relative;padding-left:1.65rem}
.drops li::before{content:"";position:absolute;left:.15rem;top:.42em;width:.72rem;height:.72rem;background:var(--sand);border-radius:0 50% 50% 50%;transform:rotate(45deg)}
.drops.two-col{grid-template-columns:1fr 1fr;column-gap:2rem}
.drops.inline{display:flex;flex-wrap:wrap;gap:.5rem 1.6rem}

/* dark page tops (home hero + inner page heads) */
.hero,.ph{background:var(--teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 520'%3E%3Cpath d='M40 500 450 90l410 410' fill='none' stroke='%23ffffff' stroke-opacity='.045' stroke-width='74'/%3E%3C/svg%3E") no-repeat right -120px bottom -40px/860px auto;color:#d5e3e1}
.hero h1,.ph h1{color:#fff}
.hero{padding:0}
.hero-grid,.ph-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,47%);align-items:stretch;padding-left:max(1.25rem,calc((100% - var(--w)) / 2))}
.hero-copy{padding:4.4rem 3.5rem 7rem 0;align-self:center}
.hero-where{display:inline-flex;align-items:center;gap:.45rem;font:600 .95rem var(--hf);color:var(--sand);margin-bottom:1.1rem}
.lede{font-size:1.17rem;line-height:1.6;max-width:34em}
.acts{display:flex;flex-wrap:wrap;gap:.8rem;margin:1.7rem 0 1.5rem}
.hero .drops.inline{font-size:.98rem;color:#e6efee}
.hero-photo{position:relative;min-height:600px}
.hero-main{position:absolute;inset:0;margin:0}
.hero-main img,.ph-big img{width:100%;height:100%;object-fit:cover}
.hero-inset{position:absolute;left:-4.5rem;bottom:5.2rem;width:205px;aspect-ratio:4/5;border:6px solid #fff;border-radius:var(--r);overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.35)}
.hero-inset img{width:100%;height:100%;object-fit:cover}
.ph.has-big{padding:0}
.ph-grid .ph-copy{padding:2rem 3.5rem 3.6rem 0;align-self:center}
.ph-big{position:relative;min-height:440px;margin:0}
.ph-big img{position:absolute;inset:0}
.ph-pics img,.jobs img,.pair img,.gallery img,.shots img,.duo-b img,.guide img{width:100%;aspect-ratio:4/5;object-fit:cover}

/* facts bar */
.facts{position:relative;z-index:2;margin:-3.1rem 0 0;display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border-radius:var(--r);box-shadow:var(--shadow);border-top:5px solid var(--sand)}
.facts li{padding:1.35rem 1.5rem 1.4rem}
.facts li+li{border-left:1px solid var(--line)}
.facts b{display:block;font:800 1.5rem/1.15 var(--hf);letter-spacing:-.025em;color:var(--teal)}
.facts span{font-size:.94rem;color:var(--muted)}

/* sections */
.sec{padding:5rem 0}
.sec.on-mist{background:var(--mist)}
.sec.on-teal{background:var(--deep);color:#c9dad8}
.sec.on-teal h2{color:#fff}
.sec-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem 3rem;align-items:end;margin-bottom:2.4rem}
.sec-head h2{margin:0}
.sec-head p{margin:0;font-size:1.08rem;color:var(--muted);max-width:30em;justify-self:end}
.sec.on-teal .sec-head p{color:#b9cecb}
.after{margin:2.2rem 0 0;text-align:center}

/* service rows */
.svc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.svc-grid.cols2{grid-template-columns:repeat(2,minmax(0,1fr))}
.svc{display:flex;align-items:center;gap:1rem;padding:.8rem 1rem .8rem .8rem;background:var(--mist);border-radius:var(--r);text-decoration:none;color:var(--ink);border-left:4px solid transparent;transition:background .15s,box-shadow .15s,border-color .15s}
.sec.on-mist .svc{background:#fff}
.svc img{width:84px;height:84px;border-radius:var(--rp);flex:none;object-fit:cover}
.svc-t{display:grid;gap:.2rem;flex:1;min-width:0}
.svc-t strong{font:700 1.04rem/1.25 var(--hf);letter-spacing:-.012em;color:var(--teal)}
.svc-t span{font-size:.9rem;line-height:1.4;color:var(--muted)}
.svc .chev{color:var(--sand-d)}
.svc:hover{background:#fff;box-shadow:var(--shadow);border-left-color:var(--sand);color:var(--ink)}
.also{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;margin:1.8rem 0 0}
.also b{font:700 .95rem var(--hf);color:var(--teal);margin-right:.3rem}
.also a{padding:.45rem .9rem;border:1.5px solid var(--line);border-radius:var(--rp);text-decoration:none;font:600 .9rem var(--hf);color:var(--teal)}
.also a:hover{border-color:var(--teal);background:var(--teal);color:#fff}
.also a.all{border-color:var(--teal);background:var(--teal);color:#fff}
.also a.all:hover{background:var(--teal-2)}

/* photo + text split */
.duo{display:grid;grid-template-columns:minmax(0,520px) minmax(0,1fr);gap:4.5rem;align-items:center}
.duo.flip{grid-template-columns:minmax(0,1fr) minmax(0,490px)}
.duo-pics{position:relative;padding:0 3.2rem 3.4rem 0}
.duo-a{border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.duo-a img{width:100%;aspect-ratio:4/4.4;object-fit:cover}
.duo-b{position:absolute;right:0;bottom:0;width:38%;border:6px solid #fff;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.sec.on-mist .duo-b{border-color:var(--mist)}
.duo .drops{margin:1.4rem 0 1.8rem}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:start}
.pair figure{border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.pair figure:nth-child(2){margin-top:2.4rem}

/* call strip */
.strip{background:var(--sand);color:var(--deep)}
.strip-in{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:1.7rem 0}
.strip p{margin:0;font-size:1.08rem}
.strip b{font:800 1.45rem var(--hf);letter-spacing:-.02em;margin-right:.6rem}

/* steps (a real sequence, so numbered) */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem;counter-reset:st}
.steps li{counter-increment:st;position:relative;padding-top:4.4rem;border-top:3px solid var(--teal)}
.steps li::before{content:counter(st);position:absolute;top:.6rem;left:0;font:800 3.2rem/1 var(--hf);letter-spacing:-.04em;color:transparent;-webkit-text-stroke:2px var(--sand)}
.steps h3{font-size:1.25rem;font-weight:800}
.steps p{margin:0;color:var(--muted)}

/* job wall */
.jobs-big{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-bottom:1rem}
.jobs-big img{width:100%;aspect-ratio:4/5;object-fit:cover}
.jobs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.8rem}
.jobs figure{box-shadow:none}

/* neighborhoods */
.hoods{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.9rem;margin:0}
.hoods.cols3{grid-template-columns:repeat(3,minmax(0,1fr))}
.hoods a{display:flex;align-items:center;gap:.8rem;padding:1.05rem 1.1rem;background:#fff;border-radius:var(--r);text-decoration:none;color:var(--muted);font-size:.88rem;line-height:1.35;border-bottom:3px solid transparent;transition:box-shadow .15s,border-color .15s}
.body .hoods a,.sec:not(.on-mist) .hoods a{background:var(--mist)}
.hoods .ico{color:var(--sand-d);font-size:1.25rem}
.hoods span{flex:1;min-width:0}
.hoods b{display:block;font:700 1.04rem var(--hf);letter-spacing:-.012em;color:var(--teal)}
.hoods .chev{color:var(--sand-d)}
.hoods a:hover{box-shadow:var(--shadow);border-bottom-color:var(--sand)}

/* faq */
.faq-split{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:4rem;align-items:start}
.faq-side{position:sticky;top:120px}
.big-tel{font:800 1.7rem var(--hf);letter-spacing:-.025em;color:var(--teal);text-decoration:none}
.qa{border-top:2px solid var(--teal)}
.qa details{border-bottom:1px solid var(--line)}
.qa summary{cursor:pointer;list-style:none;padding:1.1rem 2.6rem 1.1rem 0;font:700 1.06rem/1.35 var(--hf);letter-spacing:-.012em;color:var(--teal);position:relative}
.qa summary::-webkit-details-marker{display:none}
.qa summary::before,.qa summary::after{content:"";position:absolute;right:.35rem;top:1.72rem;width:1rem;height:2.5px;background:var(--sand-d);transition:transform .2s}
.qa summary::after{transform:rotate(90deg)}
.qa details[open] summary::after{transform:rotate(0)}
.qa p{margin:0 0 1.2rem;color:#394947;max-width:44em}

/* inner page head */
.ph{padding:2rem 0 3.4rem}
.ph-in{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3.5rem;align-items:center}
.ph h1{font-size:clamp(1.95rem,1.2rem + 2.6vw,3rem)}
.ph .lede{font-size:1.1rem}
.ph-note{margin:0;font-size:.93rem;color:#b9cecb}
.ph-pics{display:grid;align-items:start;gap:.85rem;grid-auto-flow:column;grid-auto-columns:210px}
.ph-pics.n3{grid-auto-columns:176px}
.ph-pics figure:nth-child(2){margin-top:2.2rem}
.ph-pics.n3 figure:nth-child(3){margin-top:1.1rem}
.crumbs ol{display:flex;flex-wrap:wrap;gap:.4rem;font-size:.86rem;color:#a9c2bf;margin:0 0 1.4rem}
.crumbs li+li::before{content:"/";margin-right:.4rem;color:var(--sand)}
.crumbs a{color:#d5e3e1}

/* inner page body */
.body-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:4rem;padding:4rem 0 4.5rem;align-items:start}
.body>section{margin-bottom:3rem}
.body>section:last-child{margin-bottom:0}
.body h2{font-size:clamp(1.45rem,1.1rem + 1.1vw,1.85rem)}
.flow{display:grid;gap:.9rem;counter-reset:f}
.flow li{counter-increment:f;position:relative;padding:1.15rem 1.3rem 1.15rem 4rem;background:var(--mist);border-radius:var(--r)}
.flow li::before{content:counter(f);position:absolute;left:1.15rem;top:1.05rem;width:2rem;height:2rem;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;font:800 .95rem var(--hf)}
.flow h3{margin-bottom:.25em}
.flow p{margin:0;color:#3a4a48}
.shots{display:flex;gap:1rem;margin:-.8rem 0 3rem}
.shots figure{flex:0 1 250px;border-radius:var(--r);overflow:hidden;background:var(--mist)}
figcaption{font-size:.84rem;color:var(--muted);padding:.55rem .7rem .65rem;line-height:1.35}
.side{display:grid;gap:1rem;position:sticky;top:112px}
.side-box{border:1px solid var(--line);border-radius:var(--r);padding:1.35rem 1.4rem;background:#fff}
.side-box .side-h{font:800 1.15rem var(--hf);letter-spacing:-.015em;color:var(--teal);margin:0 0 .5rem}
.side-box p{font-size:.95rem}
.side-box.call{background:var(--teal);border-color:var(--teal);color:#d5e3e1}
.side-box.call .side-h{color:#fff;font-size:1.3rem}
.side-links{display:grid;margin:0}
.side-links a{display:block;padding:.5rem 0;text-decoration:none;font-size:.97rem;border-bottom:1px solid var(--line)}
.side-links li:last-child a{border-bottom:0}
.side-links a:hover{color:var(--sand-d)}
.side-areas{margin:0}
.prose h2{margin-top:1.7em}
.prose>h2:first-child{margin-top:0}
.prose .svc-grid{margin-top:1rem}
.gallery{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem}
.gallery figure{border-radius:var(--r);overflow:hidden;background:var(--mist)}
.guide-list{display:grid;gap:1rem}
.guide{display:flex;gap:1.5rem;align-items:center;padding:1rem;background:var(--mist);border-radius:var(--r);text-decoration:none;color:var(--muted)}
.guide figure{flex:none;width:150px;border-radius:var(--rp);overflow:hidden}
.gallery img{width:100%;aspect-ratio:4/5;object-fit:cover}
.guide>span{display:grid;gap:.5rem;justify-items:start}
.guide strong{font:800 1.3rem/1.2 var(--hf);letter-spacing:-.02em;color:var(--teal)}
.guide:hover{background:#fff;box-shadow:var(--shadow)}
.map{border-radius:var(--r);overflow:hidden;border:1px solid var(--line);margin-top:2rem}
.map iframe{display:block;width:100%;height:360px;border:0}
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,450px);gap:4rem;align-items:start}
.contact-list{display:grid;gap:1.1rem;margin-bottom:1.6rem}
.contact-list li{display:flex;gap:1rem;align-items:center}
.contact-list .ico{width:46px;height:46px;padding:12px;border-radius:50%;background:var(--mist);color:var(--teal)}
.contact-list b{display:block;font:700 .88rem var(--hf);color:var(--muted)}
.contact-list a,.contact-list div{font-size:1.08rem;color:var(--ink)}
.contact-grid .req{background:var(--teal)}

/* request band + form */
.ask{background:var(--teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 520'%3E%3Cpath d='M40 500 450 90l410 410' fill='none' stroke='%23ffffff' stroke-opacity='.045' stroke-width='74'/%3E%3C/svg%3E") no-repeat left -160px bottom -60px/820px auto;color:#d5e3e1;padding:5rem 0}
.ask-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,470px);gap:4rem;align-items:center}
.ask h2{color:#fff;font-size:clamp(1.8rem,1.2rem + 2.2vw,2.7rem)}
.ask-phone{display:inline-block;font:800 clamp(2rem,1.3rem + 2.6vw,3rem) var(--hf);letter-spacing:-.03em;color:var(--sand);text-decoration:none;margin:.3rem 0 1.4rem}
.ask-phone:hover{color:#fff}
.ask-list{display:grid;gap:.7rem;margin:0}
.ask-list li{display:flex;gap:.75rem;align-items:center}
.ask-list .ico{color:var(--sand)}
.ask-list a{color:#fff}
.req{background:#fff;color:var(--ink);border-radius:var(--r);padding:1.9rem 1.8rem;display:grid;gap:.85rem;box-shadow:0 26px 60px rgba(0,0,0,.3);border-top:5px solid var(--sand)}
.contact-grid .req{background:#fff;box-shadow:var(--shadow)}
.req-h{margin:0;font:800 1.5rem/1.1 var(--hf);letter-spacing:-.025em;color:var(--teal)}
.req .fine{margin:0;font-size:.9rem;color:var(--muted)}
.req label{display:grid;gap:.3rem;font:700 .86rem var(--hf);color:var(--teal)}
.req .opt{font-weight:400;font-family:var(--bf);color:var(--muted)}
.req input,.req select,.req textarea{width:100%;font:400 1rem var(--bf);color:var(--ink);padding:.75rem .8rem;border:1.5px solid var(--line);border-radius:var(--rp);background:var(--mist)}
.req input:focus,.req select:focus,.req textarea:focus{outline:none;border-color:var(--teal-2);background:#fff}
.req .two{display:grid;grid-template-columns:1fr 1fr;gap:.85rem}
.req .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.req .btn-sand:hover{background:var(--teal);border-color:var(--teal);color:#fff}

/* footer */
.ft{background:var(--deep);color:#a9c2bf;font-size:.95rem;padding:4rem 0 1.2rem}
.ft-in{display:grid;grid-template-columns:1.5fr 1.25fr 1fr .8fr;gap:2.5rem}
.ft-brand img{width:260px;height:auto;margin-bottom:1.2rem}
.ft h3{color:#fff;font-size:1rem;margin-bottom:.9em}
.ft ul{display:grid;gap:.35rem;margin:0}
.ft ul.cols{grid-template-columns:1fr 1fr;column-gap:1.2rem}
.ft a{color:#d5e3e1;text-decoration:none}
.ft a:hover{color:var(--sand)}
.ft address{margin-bottom:.8rem;line-height:1.6}
.ft .ft-phone{font:800 1.3rem var(--hf);letter-spacing:-.02em;color:var(--sand)}
.ft-base{display:flex;justify-content:space-between;gap:1rem 2rem;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.12);margin-top:3rem;padding-top:1.2rem;font-size:.84rem}
.ft-base p{margin:0}
.ft-base a+a{margin-left:1rem}
.dock{display:none}

/* responsive */
@media (max-width:1180px){
  .nav a{padding:.5rem .5rem;font-size:.88rem}
  .hd-in{gap:1rem}
  .hd-num small{display:none}
  .hero-copy{padding-right:2.5rem}
  .hero-inset{left:-3rem;width:170px}
  .jobs{grid-template-columns:repeat(6,minmax(0,1fr))}
  .gallery{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:1100px){
  .burger{display:flex}
  .nav{position:absolute;left:0;right:0;top:100%;background:#fff;display:none;margin:0;box-shadow:0 18px 30px rgba(8,42,43,.14);border-top:1px solid var(--line)}
  .nav.open{display:block}
  .nav ul{flex-direction:column;padding:.4rem 1.25rem 1rem;gap:0}
  .nav a{padding:.85rem .2rem;font-size:1.05rem;border-bottom:1px solid var(--line)}
  .logo{margin-right:auto}
  .svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .body-grid{grid-template-columns:1fr;gap:2.5rem}
  .side{position:static}
  .hoods{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ft-in{grid-template-columns:1fr 1fr}
  .duo,.duo.flip{gap:3rem}
}
@media (max-width:860px){
  .hero-grid,.ph-grid{grid-template-columns:1fr;padding:0}
  .hero-copy{padding:2.4rem 1.25rem 2rem}
  .ph-grid .ph-copy{padding:1.5rem 1.25rem 2rem}
  .hero{background-image:none}
  .ph{background-image:none}
  .hero-photo{min-height:0;aspect-ratio:4/3.4}
  .hero-inset{display:none}
  .ph-big{min-height:0;aspect-ratio:4/3}
  .hero-photo{padding-bottom:0}
  .facts{margin-top:-1.8rem}
  .ph-in,.duo,.duo.flip,.ask-in,.contact-grid,.faq-split{grid-template-columns:1fr;gap:2.4rem}
  .faq-side{position:static}
  .jobs-big{grid-template-columns:repeat(2,minmax(0,1fr))}
  .facts{grid-template-columns:repeat(2,1fr)}
  .facts li:nth-child(3){border-left:0}
  .facts li:nth-child(n+3){border-top:1px solid var(--line)}
  .sec-head{grid-template-columns:1fr;margin-bottom:1.8rem}
  .sec-head p{justify-self:start}
  .steps{grid-template-columns:1fr;gap:1.8rem}
  .ph-pics,.ph-pics.n3{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(3,minmax(0,1fr));max-width:480px}
  .ph-pics.n2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:340px}
  .duo-pics{max-width:520px}
  .pair{max-width:440px}
  .strip-in{flex-direction:column;align-items:flex-start;gap:1rem}
  .util-addr{display:none!important}
  .gallery{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:600px){
  html{font-size:93.75%}
  .wrap{width:calc(100% - 2rem)}
  .util-in{justify-content:center;font-size:.8rem;padding:.42rem 0}
  .hd-in{min-height:66px;gap:.7rem}
  .logo img{height:38px}
  .hd-num{display:none}
  .hd-ic{width:44px;height:44px}
  .hero-copy{padding:2rem 1rem 1.8rem}
  .ph-grid .ph-copy{padding:1.3rem 1rem 1.8rem}
  .lede{font-size:1.08rem}
  .acts{margin:1.4rem 0 1.3rem}
  .acts .btn{flex:1 1 100%}
  .hero .drops.inline{gap:.45rem 1.2rem}
  .jobs-big{gap:.6rem;margin-bottom:.6rem}
  .facts{margin-top:-1.5rem}
  .facts li{padding:1rem 1rem 1.05rem}
  .facts b{font-size:1.2rem}
  .facts span{font-size:.86rem;line-height:1.35;display:block}
  .sec{padding:3.4rem 0}
  .svc-grid,.svc-grid.cols2{grid-template-columns:1fr;gap:.7rem}
  .svc img{width:72px;height:72px}
  .drops.two-col{grid-template-columns:1fr}
  .duo-pics{padding:0 2rem 2.4rem 0}
  .duo-b{border-width:4px}
  .strip b{display:block;margin:0 0 .2rem;font-size:1.35rem}
  .strip .btn{width:100%}
  .jobs{grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem}
  .hoods,.hoods.cols3{grid-template-columns:1fr;gap:.6rem}
  .ph{padding:1.5rem 0 2.6rem}
  .ph-pics,.ph-pics.n3,.ph-pics.n2{gap:.6rem}
  .body-grid{padding:2.8rem 0 3.2rem}
  .shots{gap:.7rem}
  .gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}
  figcaption{font-size:.8rem;padding:.45rem .55rem .55rem}
  .guide{gap:1rem;align-items:flex-start}
  .guide figure{width:96px}
  .guide strong{font-size:1.1rem}
  .ask{padding:3.4rem 0}
  .req{padding:1.4rem 1.15rem}
  .req .two{grid-template-columns:1fr}
  .ft-in{grid-template-columns:1fr;gap:2rem}
  .ft{padding:3rem 0 5.6rem}
  .map iframe{height:270px}
  .dock{display:grid;grid-template-columns:1fr 1.3fr;position:fixed;left:0;right:0;bottom:0;z-index:50;box-shadow:0 -6px 20px rgba(0,0,0,.2)}
  .dock a{display:flex;align-items:center;justify-content:center;gap:.45rem;padding:1rem .5rem;font:700 1rem var(--hf);text-decoration:none}
  .dock-call{background:var(--sand);color:var(--deep)}
  .dock-req{background:var(--teal);color:#fff}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}