/* We Shift | removalssouthshields.co.uk
   The look comes from the firm's own flyer: the green of "WE", the orange of
   "SHIFT", the charcoal of "REMOVALS & SINGLE ITEM TRANSPORT", and the flyer's
   green phone band with its four ticked lines (orange ticks in green rings),
   which runs under every page hero. Headings are narrow, heavy capitals like the
   strapline (Archivo, one variable font with a width axis), and each h2 gets a
   short orange rule like the one under the logo.
   No section labels above headings and no step numbers: both were taken out on
   request in an earlier build, and the layout sweep checks they stay out.
   Mobile first. Breakpoints: 375, 380, 480, 600, 720, 1000 (also in main.js), 1200. */

@font-face{font-family:"Archivo";src:url("archivo-var-latin.woff2") format("woff2");font-weight:100 900;font-stretch:62% 125%;font-style:normal;font-display:swap}

:root{
  --green:#099d47;
  --green-deep:#07803a;
  --green-dark:#056530;
  --orange:#f1592a;
  --orange-deep:#c8461a;
  --charcoal:#222021;
  --charcoal-deep:#181617;
  --charcoal-soft:#2e2b2c;
  --ink:#222021;
  --text:#3b3839;
  --muted:#5d595a;
  --tint:#f3f4f1;
  --tint-deep:#e6e8e3;
  --line:#dddfd9;
  --white:#fff;
  --pale:#d6d2d3;
  --star:#f5b301;
  --err:#b3261e;
  --gutter:16px;
  --radius:10px;
  --font:"Archivo","Arial Narrow","Helvetica Neue",Arial,sans-serif;
  --tick:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10' stroke='%23099d47' stroke-width='2.2'/%3E%3Cpath d='m7.4 12.4 3.1 3.1 6.4-7' stroke='%23f1592a' stroke-width='3'/%3E%3C/svg%3E");
  --tick-band:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='11' fill='%23fff'/%3E%3Cpath d='m7.4 12.4 3.1 3.1 6.4-7' stroke='%23f1592a' stroke-width='3'/%3E%3C/svg%3E");
  --chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9.5 6 6 6-6'/%3E%3C/svg%3E");
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;font-family:var(--font);font-size:1.0625rem;font-weight:400;line-height:1.65;color:var(--text);background:var(--white);overflow-x:clip}
img,svg{max-width:100%;height:auto;display:block}
svg{flex:none}
h1,h2,h3{color:var(--ink);font-weight:800;line-height:1.08;margin:0 0 .55em;text-wrap:balance}
h1{font-size:clamp(2.5rem,11.5vw,4.4rem);font-stretch:68%;font-weight:850;line-height:.96;letter-spacing:-.005em;text-transform:uppercase}
h2{font-size:clamp(1.8rem,6.6vw,2.6rem);font-stretch:76%;letter-spacing:-.003em}
h3{font-size:1.2rem;font-stretch:90%;font-weight:750;line-height:1.22}
p{margin:0 0 1.05em}
ul,ol{margin:0;padding:0;list-style:none}
a{color:var(--green-deep);text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--orange);outline-offset:3px;border-radius:4px}
strong{color:inherit;font-weight:700}
.on-dark,.on-dark h1,.on-dark h2,.on-dark h3{color:var(--white)}
.on-dark a:not(.btn){color:var(--white)}

.wrap{width:100%;max-width:1200px;margin-inline:auto;padding-inline:var(--gutter)}
.narrow{max-width:860px}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--white);color:var(--ink);padding:10px 16px;border-radius:6px;font-weight:700}
.skip:focus{top:12px}

/* --------------------------------------------------------------- pieces -- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:50px;padding:11px 26px;border:2px solid var(--green-deep);border-radius:6px;background:var(--green-deep);color:var(--white);font-family:inherit;font-weight:750;font-stretch:90%;font-size:1.04rem;letter-spacing:.01em;line-height:1.2;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .15s,color .15s,border-color .15s}
.btn:hover{background:var(--green-dark);border-color:var(--green-dark)}
.btn .ico{width:18px;height:18px}
.btn--line{background:var(--white);color:var(--ink);border-color:var(--ink)}
.btn--line:hover{background:var(--ink);color:var(--white);border-color:var(--ink)}
.btn--ghost{background:transparent;border-color:rgba(255,255,255,.75);color:var(--white)}
.btn--ghost:hover{background:var(--white);border-color:var(--white);color:var(--ink)}
.on-dark .btn--ghost:hover{color:var(--ink)}
.btn[disabled]{opacity:.65;cursor:progress}

.more{display:inline-flex;align-items:center;gap:7px;color:var(--green-deep);font-weight:700;text-decoration:none}
a.more:hover{text-decoration:underline}
.tel-link{font-weight:700;color:var(--ink);white-space:nowrap}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin:26px 0 0}
.note{margin:22px 0 0;font-size:.9rem;color:var(--muted)}
.intro{max-width:780px;margin-bottom:30px}
.prose p:last-child{margin-bottom:0}

.prose>.ticks{margin-bottom:1.05em}
.steps+p,.jump+p{margin-top:26px}
.ticks li{position:relative;padding:5px 0 5px 32px}
.ticks li::before{content:"";position:absolute;left:0;top:.42em;width:22px;height:22px;background:var(--tick) center/contain no-repeat}

.pills{display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start}
.pills li{padding:7px 15px;border:1px solid var(--line);border-radius:999px;background:var(--white);color:var(--ink);font-size:.95rem;font-weight:600}

.jump{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.jump a{display:block;padding:8px 16px;border:1.5px solid var(--green-deep);border-radius:999px;background:var(--white);color:var(--green-deep);font-size:.95rem;font-weight:650;text-decoration:none}
.jump a:hover{background:var(--green-deep);color:var(--white)}

.stars{position:relative;display:inline-block;width:5.2em;height:1em;font-size:1rem;line-height:1;vertical-align:-.12em;background:linear-gradient(#c9c6c7,#c9c6c7);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 104 20'%3E%3Cg id='a'%3E%3Cpath d='m10 1 2.7 5.8 6.3.8-4.6 4.4 1.2 6.3L10 15.2l-5.6 3.1 1.2-6.3L1 7.6l6.3-.8z'/%3E%3C/g%3E%3Cuse href='%23a' x='21'/%3E%3Cuse href='%23a' x='42'/%3E%3Cuse href='%23a' x='63'/%3E%3Cuse href='%23a' x='84'/%3E%3C/svg%3E") center/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 104 20'%3E%3Cg id='a'%3E%3Cpath d='m10 1 2.7 5.8 6.3.8-4.6 4.4 1.2 6.3L10 15.2l-5.6 3.1 1.2-6.3L1 7.6l6.3-.8z'/%3E%3C/g%3E%3Cuse href='%23a' x='21'/%3E%3Cuse href='%23a' x='42'/%3E%3Cuse href='%23a' x='63'/%3E%3Cuse href='%23a' x='84'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.stars span{position:absolute;inset:0 auto 0 0;background:var(--star)}
.on-dark .stars{background:linear-gradient(#5a5657,#5a5657)}

/* --------------------------------------------------------------- header -- */
.topbar{background:var(--charcoal);font-size:.8rem;font-weight:600;line-height:1.3}
.topbar__in{display:flex;align-items:center;justify-content:space-between;gap:10px 22px;min-height:38px;padding-block:6px}
.topbar__item{display:flex;align-items:center;gap:7px;margin:0;color:var(--white);text-decoration:none;white-space:nowrap}
.topbar__item .ico{width:16px;height:16px;color:var(--orange)}
.topbar__msg,.topbar__g{display:none}
.topbar__rating{margin-left:auto}
.topbar__rating:hover span:last-child{text-decoration:underline}
.topbar__rating .stars{font-size:.82rem}

.header{position:sticky;top:0;z-index:50;background:var(--white);box-shadow:0 1px 0 var(--line),0 6px 18px rgba(34,32,33,.08)}
.header__in{position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:64px}
.brand{flex:none;display:block;padding:8px 0}
.brand img{width:auto;height:34px}
.header__actions{flex:none;display:flex;align-items:center;gap:8px}
.header__tel{display:none;align-items:center;gap:8px;color:var(--ink);font-weight:750;font-stretch:92%;font-size:1.12rem;text-decoration:none;white-space:nowrap}
.header__tel .ico{width:19px;height:19px;color:var(--green)}
.header__tel:hover span{text-decoration:underline}
.header__cta{flex:none;min-height:42px;padding:8px 10px;font-size:.9rem}
.burger{flex:none;display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:42px;padding:0 11px;border:2px solid var(--charcoal);border-radius:8px;background:var(--white);cursor:pointer}
.burger span{display:block;height:2px;background:var(--charcoal);border-radius:2px}
html:not(.js) .burger{display:none}

.nav{font-weight:700;font-stretch:92%;font-size:1.04rem}
.nav__list a{display:block;padding:12px 14px;border-radius:6px;color:var(--ink);text-decoration:none}
.nav__list a:hover{color:var(--green-deep)}
.nav__list a[aria-current="page"]{color:var(--green-deep)}
.js .nav{display:none;position:absolute;top:100%;left:0;right:0;padding:8px;background:var(--white);border:1px solid var(--line);border-top:4px solid var(--orange);border-radius:0 0 10px 10px;box-shadow:0 14px 30px rgba(34,32,33,.2)}
.js .nav.is-open{display:block}
html:not(.js) .header__in{flex-wrap:wrap}
html:not(.js) .nav{order:3;width:100%;padding-bottom:8px}
html:not(.js) .nav__list{display:flex;flex-wrap:wrap}

@media (min-width:375px){
  .brand img{height:38px}
  .header__in{gap:10px}
}
@media (min-width:380px){
  :root{--gutter:20px}
  .header__cta{padding:9px 16px;font-size:.98rem}
  .burger{width:46px;height:44px}
}
@media (min-width:480px){.brand img{height:44px}}
@media (min-width:600px){
  :root{--gutter:28px}
  .header__in{min-height:78px;gap:18px}
  .brand img{height:50px}
  .header__actions{gap:16px}
  .header__cta{min-height:46px;padding:10px 22px;font-size:1.04rem}
  .topbar__g{display:inline}
}
@media (min-width:720px){.header__tel{display:flex}.topbar__msg{display:flex}}
@media (min-width:1000px){
  .js .nav,.nav,html:not(.js) .nav{display:block;position:static;order:0;width:auto;margin:0 auto 0 14px;padding:0;background:none;border:0;border-radius:0;box-shadow:none}
  .nav__list,html:not(.js) .nav__list{display:flex;flex-wrap:nowrap;gap:0}
  .nav__list a{position:relative;padding:10px 8px}
  .nav__list a[aria-current="page"]::after{content:"";position:absolute;left:8px;right:8px;bottom:2px;height:4px;border-radius:2px;background:var(--orange)}
  .burger{display:none}
  .header__in{min-height:88px;gap:14px}
  .brand img{height:50px}
  .nav{font-size:1rem}
  .header__actions{gap:14px}
  .header__tel{font-size:1.04rem;gap:6px}
  .header__tel .ico{width:17px;height:17px}
  .header__cta{padding:10px 16px}
}
@media (min-width:1200px){
  .nav,.js .nav{margin-left:34px}
  .nav__list{gap:4px}
  .nav__list a{padding:10px 14px}
  .nav__list a[aria-current="page"]::after{left:14px;right:14px}
  .header__in{gap:18px}
  .header__actions{gap:18px}
  .header__tel{font-size:1.12rem;gap:8px}
  .header__tel .ico{width:19px;height:19px}
  .header__cta{padding:10px 22px}
  .brand img{height:58px}
}

/* ----------------------------------------------------------------- hero -- */
.hero{position:relative;overflow:hidden;padding:34px 0 44px;background:var(--tint)}
.hero__in{position:relative;display:grid;gap:30px}
.hero__copy{position:relative;z-index:2}
.hero h1{margin-bottom:.3em}
.hero__place{display:block;color:var(--green)}
.hero__sub{margin:0 0 .8em;font-size:clamp(1.14rem,4.4vw,1.4rem);font-weight:700;font-stretch:90%;line-height:1.3;color:var(--ink)}
.lead{font-size:1.08rem;max-width:610px}
.hero .actions{margin-top:24px}
@media (max-width:479px){.hero .actions .btn{width:100%}}
.hero__trust{display:flex;flex-wrap:wrap;gap:10px 22px;margin:24px 0 0;color:var(--ink);font-weight:650;font-size:.98rem}
.hero__trust li{display:flex;align-items:center;gap:8px}
.hero__trust .ico{width:21px;height:21px;color:var(--green)}
.grating{display:flex;width:fit-content;align-items:center;gap:10px;margin-top:20px;color:var(--ink);font-size:.98rem;text-decoration:none}
.grating strong{font-weight:750}
.grating:hover span:last-child{text-decoration:underline}

.hero__photo{position:relative;margin:0 14px 14px 0}
.hero__photo img{position:relative;z-index:1;width:100%;aspect-ratio:4/3;object-fit:cover;object-position:50% 55%;border-radius:var(--radius);background:var(--tint-deep)}
.hero__photo::after{content:"";position:absolute;inset:14px -14px -14px 14px;border-radius:var(--radius);background:var(--orange)}
.hero__photo figcaption{position:absolute;z-index:2;left:12px;right:12px;bottom:12px;width:fit-content;max-width:calc(100% - 24px);margin:0;padding:7px 12px;border-radius:6px;background:rgba(24,22,23,.88);color:var(--white);font-size:.84rem;font-weight:600;line-height:1.35}

.phero{position:relative;padding:30px 0 40px;background:var(--charcoal)}
.phero__in{position:relative;z-index:2}
.phero h1{font-size:clamp(2.2rem,9vw,3.7rem);max-width:16em}
.phero .lead{margin-bottom:0;max-width:680px;color:var(--pale)}
.crumbs{margin-bottom:22px;font-size:.9rem;font-weight:600}
.crumbs ol{display:flex;flex-wrap:wrap;gap:6px}
.crumbs li+li::before{content:"/";margin-right:6px;color:var(--orange)}
.crumbs [aria-current]{color:var(--pale)}

/* the four ticked lines from the flyer, in its green band */
.sign{background:var(--green-deep)}
.sign__list{display:grid;gap:10px 28px;padding-block:18px;color:var(--white);font-weight:750;font-stretch:88%;font-size:1.04rem;line-height:1.3}
.sign__list li{display:flex;align-items:center;gap:11px}
.sign__list li::before{content:"";flex:none;width:24px;height:24px;background:var(--tick-band) center/contain no-repeat}

@media (min-width:600px){
  .hero{padding:50px 0 60px}
  .hero__photo img{aspect-ratio:16/10}
  .phero{padding:44px 0 56px}
  .sign__list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:1000px){
  .hero{padding:64px 0 76px}
  .hero__in{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
  .hero h1{font-size:clamp(3.7rem,5.3vw,4.8rem)}
  .lead{font-size:1.12rem}
  .hero__photo img{aspect-ratio:4/3.3}
  .hero__photo{margin:0 18px 18px 0}
  .hero__photo::after{inset:18px -18px -18px 18px}
  .phero{padding:58px 0 70px}
  .sign__list{grid-template-columns:repeat(4,auto);justify-content:space-between;padding-block:20px;font-size:1rem}
}

/* ------------------------------------------------------------- sections -- */
.section{padding:58px 0}
.section--tint{background:var(--tint)}
.section--tight{padding-bottom:40px}
.head{margin-bottom:22px}
.head h2{margin-bottom:0}
.head h2::after,.service h2::after{content:"";display:block;width:56px;height:5px;margin-top:16px;border-radius:3px;background:var(--orange)}
.split-head{display:grid;gap:8px;margin-bottom:34px}
.split-head .head{margin-bottom:14px}
@media (min-width:1000px){
  .section{padding:92px 0}
  .section--tight{padding-bottom:52px}
  .head{margin-bottom:30px}
  .split-head{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:64px;align-items:start;margin-bottom:46px}
}

/* service cards */
.cards{display:grid;gap:16px}
.card{position:relative;display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:var(--white);transition:box-shadow .18s,border-color .18s}
.card:hover{border-color:#c4c6bf;box-shadow:0 14px 30px rgba(34,32,33,.12)}
.card__img{overflow:hidden;aspect-ratio:3/2;background:var(--tint);border-bottom:4px solid var(--green)}
.card__img img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.card:hover .card__img img{transform:scale(1.03)}
.card__body{display:flex;flex-direction:column;flex:1;min-width:0;padding:20px 20px 18px}
.card h3{margin-bottom:.4em;font-size:1.32rem}
.card h3 a{color:var(--ink);text-decoration:none}
.card h3 a::after{content:"";position:absolute;inset:0;border-radius:var(--radius)}
.card:hover h3 a{color:var(--green-deep)}
.card p{margin-bottom:0;font-size:.98rem}
.card .more{margin-top:auto;padding-top:16px;font-size:.95rem}
.card--ask{background:var(--charcoal);border-color:var(--charcoal)}
.card--ask:hover{border-color:var(--charcoal);box-shadow:none}
.card--ask .card__body{padding:24px 22px}
.card--ask p{color:var(--pale)}
.card--ask .card__cta{margin-top:auto;padding-top:20px}
.card__icon{display:grid;place-items:center;width:50px;height:50px;margin-bottom:16px;border-radius:8px;background:var(--orange);color:var(--charcoal)}
.card__icon .ico{width:28px;height:28px}
@media (max-width:599px){
  /* phones: photo beside the words, so the cards do not make the page a mile long */
  .card:not(.card--ask){flex-direction:row;min-height:132px}
  .card:not(.card--ask) .card__img{position:relative;flex:none;width:36%;aspect-ratio:auto;border-bottom:0;border-right:4px solid var(--green)}
  .card:not(.card--ask) .card__img img{position:absolute;inset:0}
  .card:not(.card--ask) .card__body{padding:14px 14px 13px}
  .card .more{display:none}
  .card h3{font-size:1.18rem}
  .card p{font-size:.94rem;line-height:1.5}
}
@media (min-width:600px){.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}}
@media (min-width:1000px){.cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}}

/* photos */
figure{margin:0}
figcaption{margin-top:10px;font-size:.92rem;line-height:1.45;color:var(--muted)}
.shot__img{overflow:hidden;border-radius:var(--radius);aspect-ratio:4/3;background:var(--tint)}
.shot__img img{width:100%;height:100%;object-fit:cover}
.pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
.pair .shot__img{aspect-ratio:4/5}
.pair figcaption{font-size:.88rem}
.gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}
.tile__img{overflow:hidden;border-radius:var(--radius);aspect-ratio:4/3;background:var(--tint-deep)}
.tile__img img{width:100%;height:100%;object-fit:cover}
.tile figcaption{margin-top:8px;font-size:.92rem;font-weight:650;color:var(--ink)}
@media (min-width:600px){.gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 18px}.pair{gap:18px}}
@media (min-width:1000px){.gallery{gap:28px 24px}}

/* dark bands */
.band{position:relative;overflow:hidden;padding:62px 0}
.band--dark{background-color:var(--charcoal)}
.reasons{display:grid;gap:22px 30px}
.reasons li{padding-top:16px;border-top:3px solid var(--orange)}
.reasons h3{margin-bottom:.35em;font-size:1.28rem}
.reasons p{margin:0;color:var(--pale)}
.band__grid{display:grid;gap:30px}
.band__copy p{color:var(--pale)}
@media (min-width:600px){.reasons{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){
  .band{padding:96px 0}
  .reasons{grid-template-columns:repeat(3,minmax(0,1fr));gap:34px 46px}
  .band__grid{grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:64px;align-items:start}
}

/* steps (deliberately not numbered) */
.steps{display:grid;gap:14px}
.steps li{padding:22px;border:1px solid var(--line);border-top:5px solid var(--green);border-radius:var(--radius);background:var(--white)}
.steps h3{margin-bottom:.3em}
.steps p{margin:0;font-size:.98rem}
@media (min-width:800px){.steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.steps li{padding:26px 22px 24px}}

/* a photo beside some words */
.feature{display:grid;gap:34px}
.feature__photo{position:relative;margin:0 14px 14px 0}
.feature__photo img{position:relative;z-index:1;width:100%;aspect-ratio:4/3.4;object-fit:cover;border-radius:var(--radius)}
.feature__photo::after{content:"";position:absolute;inset:14px -14px -14px 14px;border-radius:var(--radius);background:var(--green)}
@media (min-width:1000px){
  .feature{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:70px;align-items:center}
  .feature__photo img{aspect-ratio:4/4}
}

/* reviews */
.score{display:flex;align-items:center;gap:18px}
.score .stars{font-size:1.3rem}
.score p{margin:4px 0 0;font-size:.98rem}
.score .score__num{margin:0;font-size:4rem;font-weight:850;font-stretch:72%;line-height:1;color:var(--green-deep)}
.reviews{display:grid;gap:14px}
.review{padding:24px 22px;border-radius:var(--radius);background:var(--tint)}
.section--tint .review{background:var(--white)}
.review__icon{display:block;width:34px;height:34px;margin-bottom:12px;color:var(--orange)}
.review__icon .ico{width:34px;height:34px;fill:currentColor;stroke:none}
.review h3{margin-bottom:.4em}
.review p{margin:0;font-size:.98rem}
.review .review__src{margin-top:14px;font-size:.8rem;font-weight:750;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
@media (min-width:600px){.reviews{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}}
@media (min-width:1000px){.reviews{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}}

/* coverage and maps */
.cover{display:grid;gap:30px}
.map{position:relative;height:340px;border-radius:var(--radius);overflow:hidden;background:var(--tint);border:1px solid var(--line)}
.map__fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:24px;text-align:center;font-size:.95rem}
.map__fallback strong{font-size:1.15rem;color:var(--ink)}
.map__fallback a{color:var(--green-deep)}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.areas{display:grid;gap:16px}
.areas__group{padding:24px 22px;border:1px solid var(--line);border-top:4px solid var(--green);border-radius:var(--radius);background:var(--white)}
.areas__group h3{margin-bottom:.3em;font-size:1.3rem}
.areas__group>p{font-size:.98rem;color:var(--muted)}
.areas__list li{padding:9px 0;border-top:1px solid var(--line);line-height:1.4}
.areas__list strong{color:var(--ink)}
.area__note{display:block;font-size:.9rem;color:var(--muted)}
@media (min-width:600px){
  .areas__list{columns:2;column-gap:24px}
  .areas__list li{break-inside:avoid}
}
@media (min-width:1000px){
  .cover{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:60px;align-items:center}
  .cover--plain{align-items:start}
  .map{height:440px}
  .areas{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
  .areas__list{columns:1}
}

/* faq */
.faq details{margin-bottom:10px;border-radius:var(--radius);background:var(--white);color:var(--text)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;font-weight:700;font-size:1.04rem;line-height:1.35;color:var(--ink);cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:30px;height:30px;border-radius:50%;background:var(--green-deep) var(--chev) center/17px no-repeat;transition:transform .15s}
.faq details[open] summary::after{transform:rotate(180deg)}
.faq .answer{padding:0 18px 18px;font-size:.99rem}
.faq .answer p{margin:0}
.on-dark .faq a:not(.btn){color:var(--green-deep)}

/* services page */
.svc-intro{display:grid;gap:28px}
.bars{padding:20px;border-radius:var(--radius);background:var(--charcoal)}
.bars__title{margin-bottom:14px;color:var(--white);font-size:1.3rem;text-align:left}
.bars ul{display:grid;gap:6px}
.bars a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:6px;background:var(--charcoal-soft);color:var(--white);font-weight:650;font-size:.98rem;line-height:1.25;text-decoration:none;transition:background-color .15s,color .15s}
.bars a .ico{width:20px;height:20px;color:var(--orange)}
.bars a:hover{background:var(--orange);color:var(--charcoal)}
.bars a:hover .ico{color:var(--charcoal)}
.service__icon{display:grid;place-items:center;width:52px;height:52px;margin-bottom:16px;border-radius:8px;background:var(--green-deep);color:var(--white)}
.service__icon .ico{width:28px;height:28px}
.service__grid{display:grid;gap:26px}
.service h2{margin-bottom:.6em}
.lists{display:grid;gap:22px;margin-top:30px}
.lists h3{margin-bottom:.5em;font-size:1.15rem}
@media (min-width:600px){.lists{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px}}
@media (min-width:1000px){
  .svc-intro{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:64px;align-items:center}
  .service__grid{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:64px;align-items:center}
  .service--flip .service__grid>:first-child{order:2}
  .lists{margin-top:44px}
}

/* about */
.about{display:grid;gap:30px}
@media (min-width:1000px){.about{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:64px;align-items:center}}

/* ----------------------------------------------------------------- form -- */
.contact{display:grid;gap:30px}
.contact__tel{display:inline-flex;align-items:center;gap:12px;margin:6px 0 18px;color:var(--ink);font-size:clamp(1.9rem,8vw,2.5rem);font-weight:800;font-stretch:80%;line-height:1.1;text-decoration:none;white-space:nowrap}
.contact__tel .ico{width:30px;height:30px;color:var(--green)}
.contact__tel:hover span{text-decoration:underline}
.contact__list li{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--line);overflow-wrap:anywhere}
.contact__list .ico{width:21px;height:21px;color:var(--green)}
.contact__list a{color:var(--ink);font-weight:650}
.contact__form{padding:24px 20px;border:1px solid var(--line);border-top:5px solid var(--green);border-radius:var(--radius);background:var(--white);box-shadow:0 14px 34px rgba(34,32,33,.09)}
.form{display:grid;gap:15px}
.form__row{display:grid;gap:15px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.field{min-width:0}
.field label{display:block;margin-bottom:5px;font-size:.92rem;font-weight:700;color:var(--ink)}
.field .opt{font-weight:400;color:var(--muted)}
.field input,.field select,.field textarea{display:block;width:100%;min-width:0;padding:12px 14px;border:1px solid #a9aba5;border-radius:6px;background:var(--white);color:var(--ink);font:inherit;font-size:1rem}
.field textarea{min-height:124px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:3px solid var(--orange);outline-offset:1px;border-color:var(--ink)}
.field [aria-invalid="true"]{border-color:var(--err);border-width:2px}
.field__error{margin:5px 0 0;font-size:.9rem;font-weight:600;color:var(--err)}
.form__status{margin:0;padding:12px 14px;border-left:4px solid var(--err);border-radius:4px;background:#fdecea;color:var(--ink);font-size:.98rem}
.form__status a{font-weight:700;white-space:nowrap}
.form .btn{width:100%}
.form__note{display:flex;align-items:center;gap:8px;margin:0;font-size:.88rem;color:var(--muted)}
.form__note .ico{width:16px;height:16px}
@media (min-width:600px){
  .form__row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .contact__form{padding:32px}
  .form .btn{width:auto}
}
@media (min-width:1000px){.contact{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px;align-items:start}}

/* --------------------------------------------------------------- footer -- */
.footer{position:relative;overflow:hidden;padding:54px 0 96px;background-color:var(--charcoal-deep);font-size:.97rem}
.footer__grid{display:grid;gap:34px}
.footer__logo{display:inline-block;margin-bottom:16px}
.footer__logo img{width:auto;height:64px}
.footer__about p{max-width:340px;color:var(--pale)}
.footer h2{margin-bottom:14px;font-size:1.12rem;font-stretch:85%;letter-spacing:.01em}
.footer h2::after{content:"";display:block;width:34px;height:4px;margin-top:9px;border-radius:2px;background:var(--green)}
.footer__h2b{margin-top:26px}
.footer__col li{padding:4px 0;color:var(--pale)}
.footer__col a:not(.btn){text-decoration:none}
.footer__col a:not(.btn):hover{text-decoration:underline}
.footer__areas{margin-bottom:8px;color:var(--pale)}
.footer__contact li{display:flex;align-items:flex-start;gap:10px;overflow-wrap:anywhere}
.footer__contact .ico{width:19px;height:19px;margin-top:.28em;color:var(--orange)}
.footer__rating,.footer__legal{margin:0;color:var(--pale);font-size:.9rem}
.footer__rating{margin-top:38px;padding-top:22px;border-top:1px solid #3a3637}
.footer__legal{margin-top:8px}
@media (min-width:600px){.footer__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px}}
@media (min-width:700px){.footer{padding-bottom:44px}}
@media (min-width:1000px){.footer{padding-top:76px}.footer__grid{grid-template-columns:1.3fr 1.1fr .8fr 1.2fr;gap:44px}}

/* phone bar */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:45;display:flex;gap:1px;background:var(--white);box-shadow:0 -4px 16px rgba(34,32,33,.22)}
.mbar a{flex:1 1 auto;display:flex;align-items:center;justify-content:center;gap:7px;min-height:54px;padding:8px 6px;font-weight:750;font-size:.96rem;text-decoration:none;white-space:nowrap}
.mbar .ico{width:19px;height:19px}
.mbar__call{background-color:var(--charcoal);color:var(--white)}
.mbar__form{background-color:var(--green-deep);color:var(--white)}
@media (min-width:380px){.mbar a{gap:9px;padding:8px 12px;font-size:1.02rem}}
@media (min-width:700px){.mbar{display:none}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important}
}
@media print{
  .topbar,.header__actions,.nav,.mbar,.map,.sign{display:none!important}
  .hero,.phero,.band,.footer{background:#fff!important;color:#000!important}
  .on-dark,.on-dark h1,.on-dark h2,.on-dark h3,.on-dark a:not(.btn),.lead,.reasons p,.band__copy p{color:#000!important}
}