:root{
  --bg:#f6f1e8; --paper:#fffaf0; --ink:#25312c; --muted:#6f7b72;
  --line:#ded5c5; --sage:#5c7f67; --moss:#315846; --mint:#dfeadc;
  --amber:#e6a83f; --clay:#b46f48; --blue:#597b91; --shadow:0 24px 70px rgba(49,88,70,.18);
  --radius:28px; --max:1160px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth; overflow-y:scroll}
body{
  margin:0; font-family:"Inter",system-ui,-apple-system,Segoe UI,sans-serif; color:var(--ink);
  background:linear-gradient(180deg,#fbf7ef 0%,var(--bg) 48%,#efe6d7 100%);
}
a{color:inherit}
img{max-width:100%; display:block}
.skip{position:absolute; left:-999px; top:8px; background:var(--ink); color:#fff; padding:.7rem 1rem; border-radius:999px; z-index:20}
.skip:focus{left:8px}
.site-header{
  position:sticky; top:0; z-index:10; backdrop-filter:blur(18px);
  background:rgba(246,241,232,.78); border-bottom:1px solid rgba(222,213,197,.75);
}
.nav{max-width:var(--max); margin:auto; padding:.85rem 1.2rem; display:flex; align-items:center; gap:1rem; justify-content:space-between; position:relative}
.brand{font-family:"Fraunces",Georgia,serif; font-weight:700; text-decoration:none; letter-spacing:.01em; font-size:1.15rem; display:flex; gap:.55rem; align-items:center; white-space:nowrap; flex:0 0 auto}
.brand-mark{width:2.1rem; height:2.1rem; display:grid; place-items:center; border-radius:50%; background:var(--moss); color:#fff; box-shadow:0 10px 22px rgba(49,88,70,.22)}
.nav-links{display:flex; gap:.45rem; flex-wrap:nowrap; justify-content:flex-end; align-items:center; min-width:0}
.nav-links a{flex:0 0 auto}
.nav-links a,.lang button,.btn{
  border:1px solid rgba(49,88,70,.18); background:rgba(255,250,240,.76); border-radius:999px;
  padding:.72rem 1rem; text-decoration:none; font-weight:800; font-size:.9rem; transition:.2s ease; white-space:nowrap;
}
.nav-links a:hover,.lang button:hover{transform:translateY(-2px); background:#fff; box-shadow:0 12px 25px rgba(49,88,70,.12)}
.nav-toggle{
  display:none; width:2.7rem; height:2.7rem; border:1px solid rgba(49,88,70,.18); border-radius:50%;
  background:rgba(255,250,240,.86); color:var(--ink); align-items:center; justify-content:center; cursor:pointer;
  flex:0 0 auto; transition:.2s ease; box-shadow:0 10px 24px rgba(49,88,70,.08);
}
.nav-toggle:hover{transform:translateY(-2px); background:#fff; box-shadow:0 12px 25px rgba(49,88,70,.12)}
.nav-toggle:focus-visible{outline:3px solid rgba(49,88,70,.32); outline-offset:3px}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{
  display:block; width:1.15rem; height:2px; border-radius:999px; background:currentColor;
}
.nav-toggle span{position:relative}
.nav-toggle span::before,.nav-toggle span::after{content:""; position:absolute; left:0}
.nav-toggle span::before{top:-.38rem}
.nav-toggle span::after{top:.38rem}
.nav.is-collapsed .nav-toggle{display:inline-flex}
.nav.is-collapsed .nav-links{
  display:none; position:absolute; top:calc(100% + .45rem); right:1.2rem; min-width:min(19rem,calc(100vw - 2.4rem));
  max-width:calc(100vw - 2.4rem); padding:.55rem; flex-direction:column; align-items:stretch; gap:.35rem;
  border:1px solid rgba(49,88,70,.16); border-radius:20px; background:rgba(255,250,240,.97);
  box-shadow:0 22px 55px rgba(49,88,70,.18); z-index:30;
}
.nav.is-collapsed.is-open .nav-links{display:flex}
.nav.is-collapsed .nav-links a{width:100%; text-align:left; padding:.72rem .9rem}
.lang{display:flex; gap:.35rem}
.lang button[aria-pressed=true]{background:var(--moss); color:#fff}
.hero{max-width:var(--max); margin:auto; padding:4.5rem 1.2rem 2.2rem; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(280px,.72fr); gap:2rem; align-items:center; position:relative}
.hero>*:not(.hero-glow){position:relative; z-index:1}
.hero-glow{position:absolute; border-radius:999px; filter:blur(10px); opacity:.6; pointer-events:none; z-index:0}
.hero-glow-one{width:160px; height:160px; background:rgba(226,143,85,.22); left:calc(6vw - max(0px,(100vw - var(--max)) / 2)); top:16%}
.hero-glow-two{width:220px; height:220px; background:rgba(126,91,239,.13); right:calc(9vw - max(0px,(100vw - var(--max)) / 2)); bottom:14%}
.eyebrow{font-weight:900; color:var(--clay); text-transform:uppercase; letter-spacing:.12em; font-size:.78rem}
h1,h2,h3{font-family:"Fraunces",Georgia,serif; line-height:.96; margin:.35em 0}
h1{font-size:clamp(3rem,7vw,5.1rem); letter-spacing:-.06em}
h2{font-size:clamp(2.1rem,5vw,4.6rem); letter-spacing:-.05em}
h3{font-size:1.45rem; letter-spacing:-.02em}
.lead{font-size:clamp(1.08rem,2vw,1.35rem); color:#425149; line-height:1.72; max-width:64ch}
.hero-card{position:relative; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; overflow:visible}
.hero-card-link{text-decoration:none; color:inherit; cursor:pointer}
.hero-card-link:focus-visible{outline:3px solid var(--amber); outline-offset:4px}
.hero-card::after{display:none}
.hero-card img{width:100%; max-height:610px; object-fit:contain; filter:none}
.hero-swap{display:grid; place-items:center}
.hero-swap img{grid-area:1/1; transition:.45s ease}
.hero-swap img.hover{opacity:0; transform:scale(.98)}
.hero-swap:hover img.main{opacity:0; transform:scale(1.03)}
.hero-swap:hover img.hover{opacity:1; transform:scale(1)}
.info-strip{max-width:var(--max); margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:1rem}
.hero-info{grid-column:1/-1; max-width:none; margin:.2rem 0 0}
.hero-info .info-card{padding:.68rem .85rem; grid-template-columns:4.25rem minmax(0,1fr); background:rgba(255,250,240,.82); border-color:rgba(49,88,70,.14); box-shadow:0 16px 38px rgba(49,88,70,.09)}
.hero-info .info-card-icon{width:4.25rem; height:4.25rem}
.hero-info .info-card strong{color:var(--moss)}
.hero-info .info-card span{color:#425149}
.info-card,.service-card,.text-card,.contact-card{
  border:1px solid var(--line); background:rgba(255,250,240,.82); border-radius:var(--radius); box-shadow:0 18px 45px rgba(49,88,70,.10);
}
.info-card{padding:.85rem .95rem; display:grid; grid-template-columns:4.8rem minmax(0,1fr); gap:.75rem; align-items:center}
.info-card-icon{width:4.8rem; height:4.8rem; object-fit:contain; align-self:center}
.info-card strong{display:block; margin-bottom:.25rem}
.section-head{max-width:var(--max); margin:3.4rem auto 0; padding:0 1.2rem; display:flex; justify-content:space-between; gap:1rem; align-items:end}
.section-head p{max-width:54ch; color:var(--muted); line-height:1.65}
.service-group{max-width:var(--max); margin:0 auto; padding:clamp(2.6rem,6vw,4.8rem) 1.2rem}
.first-service-group{padding-top:clamp(1.1rem,2.5vw,2rem)}
.anchor-target{display:block; height:0; scroll-margin-top:5rem}
.service-group.accent{max-width:none; background:#f0e7d9; padding-left:0; padding-right:0}
.service-group-inner{max-width:var(--max); margin:0 auto; padding:0 1.2rem}
.group-head{display:grid; grid-template-columns:auto minmax(0,1fr); gap:.8rem 1.35rem; align-items:end; margin-bottom:1.45rem}
.group-num{font-family:"Fraunces",Georgia,serif; font-size:clamp(2.8rem,5vw,4.4rem); font-weight:800; line-height:.85; color:var(--amber)}
.group-head h2{font-size:clamp(2rem,4vw,3.45rem)}
.group-head p:not(.eyebrow){max-width:60ch; color:var(--muted); line-height:1.65; margin:.45rem 0 0}
.grid{max-width:var(--max); margin:auto; padding:0 1.2rem 3.4rem; display:grid; grid-template-columns:repeat(12,1fr); gap:1rem}
.service-group .grid{max-width:none; margin:0; padding:0}
.service-card{
  grid-column:span 4; min-height:420px; overflow:hidden; position:relative; text-decoration:none;
  display:flex; flex-direction:column; isolation:isolate; transform:translateY(18px); opacity:0;
}
.service-card.is-visible{transform:translateY(0); opacity:1; transition:.65s cubic-bezier(.2,.8,.2,1)}
.service-media{height:230px; position:relative; display:grid; place-items:center; background:linear-gradient(145deg,#efe5d4,#fdf8ef); overflow:hidden}
.service-media img{position:absolute; max-width:84%; max-height:88%; object-fit:contain; transition:.45s ease; filter:drop-shadow(0 16px 18px rgba(49,88,70,.18))}
.service-media img.hover{opacity:0; transform:scale(.94) rotate(-2deg)}
.service-card:hover .service-media img.main{opacity:0; transform:scale(1.05) rotate(3deg)}
.service-card:hover .service-media img.hover{opacity:1; transform:scale(1) rotate(0)}
.service-body{padding:1.2rem; display:flex; flex-direction:column; gap:.75rem; flex:1}
.service-body p{color:var(--muted); line-height:1.55; margin:0}
.badge{width:max-content; border-radius:999px; padding:.35rem .65rem; background:var(--mint); color:var(--moss); font-weight:900; font-size:.78rem}
.service-link{margin-top:auto; color:var(--moss); font-weight:900}
.cta{max-width:var(--max); margin:1rem auto 4rem; padding:1.2rem}
.contact-card{padding:clamp(1.4rem,4vw,3rem); display:grid; grid-template-columns:1fr auto; gap:2rem; align-items:center; overflow:hidden}
.contact-card .hero-mini{max-height:300px; object-fit:contain; filter:drop-shadow(0 22px 25px rgba(49,88,70,.2))}
.btn{display:inline-flex; align-items:center; gap:.45rem; background:var(--moss); color:#fff; border-color:var(--moss)}
.btn.secondary{background:#fffaf0; color:var(--moss)}
.btn:hover{transform:translateY(-2px); background:var(--sage); color:#fff; border-color:var(--sage); box-shadow:0 12px 25px rgba(49,88,70,.16)}
.btn.secondary:hover{background:var(--mint); color:var(--moss); border-color:rgba(49,88,70,.28)}
.service-hero{max-width:var(--max); margin:auto; padding:3.8rem 1.2rem 1.2rem; display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,.9fr); gap:2rem; align-items:end}
.service-hero.tall{align-items:center; min-height:620px}
.service-hero.compact{padding-top:2.5rem}
.service-hero figure{margin:0; border-radius:42px; border:1px solid var(--line); background:rgba(255,250,240,.8); padding:1.4rem; box-shadow:var(--shadow)}
.service-hero img{width:100%; max-height:480px; object-fit:contain}
.article{max-width:var(--max); margin:auto; padding:1rem 1.2rem 4rem; display:grid; grid-template-columns:minmax(0,.78fr) minmax(260px,.42fr); gap:1.3rem}
.text-card{padding:clamp(1.3rem,3vw,2.2rem); line-height:1.8; font-size:1.08rem}
.text-card ul{padding-left:1.2rem}
.side-illustration{border:1px solid var(--line); background:rgba(255,250,240,.82); border-radius:42px; padding:1.2rem; align-self:start; position:sticky; top:6rem}
.side-illustration img{width:100%; max-height:350px; object-fit:contain; filter:drop-shadow(0 16px 20px rgba(49,88,70,.18))}
.next-nav{max-width:var(--max); margin:-2rem auto 4rem; padding:0 1.2rem; display:flex; gap:.8rem; flex-wrap:wrap; justify-content:space-between}
.contact-page{max-width:var(--max); margin:auto; padding:4rem 1.2rem; display:grid; grid-template-columns:1fr .75fr; gap:1.4rem; align-items:center}
.contact-methods{display:grid; gap:.45rem; margin-top:1.3rem}
.contact-method{
  display:grid; grid-template-columns:minmax(10rem,.42fr) minmax(0,1fr); align-items:center; gap:1rem;
  padding:.9rem 1rem; border:1px solid var(--line); border-radius:20px; background:rgba(255,250,240,.82);
  box-shadow:0 14px 34px rgba(49,88,70,.08); color:var(--ink); text-decoration:none;
  transition:background .2s,color .2s,transform .2s,border-color .2s;
}
.contact-method:hover{background:var(--moss); border-color:var(--moss); color:#fff; transform:translateY(-1px)}
.contact-method:focus-visible{outline:3px solid rgba(49,88,70,.32); outline-offset:3px}
.contact-method-title{display:flex; align-items:center; gap:.75rem; font-weight:900}
.contact-method-icon{
  width:2.15rem; height:2.15rem; border-radius:50%; background:var(--moss); color:#fff;
  display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; font-weight:900;
}
.contact-method-icon svg{width:1.05rem; height:1.05rem; display:block}
.contact-method-icon img{width:1.28rem; height:1.28rem; object-fit:contain}
.contact-method-icon-img{background:#fff; border:1px solid rgba(49,88,70,.14)}
.contact-method:hover .contact-method-icon{background:#fff; color:var(--moss)}
.contact-method-value{color:var(--muted); font-weight:800; overflow-wrap:anywhere}
.contact-method:hover .contact-method-value{color:rgba(255,255,255,.9)}

.service-page-layout{max-width:var(--max); margin:auto; padding:4rem 1.2rem; display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,.65fr); gap:3.5rem; align-items:start}
.service-page-layout h1{margin-top:0}
@media (max-width:900px){
  .service-page-layout{grid-template-columns:1fr; gap:2rem}

  .hero,.service-hero,.article,.contact-page,.contact-card{grid-template-columns:1fr}
  .info-strip{grid-template-columns:1fr}
  .service-card,.service-card:nth-child(n){grid-column:span 6}
  .side-illustration{position:static}
}
@media (max-width:760px){
  .nav .nav-toggle{display:inline-flex}
  .nav .nav-links{
    display:none; position:absolute; top:calc(100% + .45rem); right:1.2rem; min-width:min(19rem,calc(100vw - 2.4rem));
    max-width:calc(100vw - 2.4rem); padding:.55rem; flex-direction:column; align-items:stretch; gap:.35rem;
    border:1px solid rgba(49,88,70,.16); border-radius:20px; background:rgba(255,250,240,.97);
    box-shadow:0 22px 55px rgba(49,88,70,.18); z-index:30;
  }
  .nav.is-open .nav-links{display:flex}
  .nav .nav-links a{width:100%; text-align:left; padding:.72rem .9rem}
}

.service-page-centered{max-width:860px; margin:auto; padding:4rem 1.2rem; display:flex; flex-direction:column; gap:2.5rem}
.service-page-expanded{max-width:var(--max)}
.service-header-row{display:flex; align-items:center; gap:2.5rem}
.service-badge-img{width:160px; height:160px; object-fit:contain; filter:drop-shadow(0 14px 22px rgba(49,88,70,.2))}
.service-header-text h1{margin-top:0; margin-bottom:.5rem; font-size:clamp(2.2rem,4vw,3.5rem); line-height: 1.1}
.service-header-text .lead{margin:0; font-size:1.15rem}
.service-feature-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; align-items:start}
.service-feature-grid-four,.service-feature-grid-two{grid-template-columns:repeat(2,minmax(0,1fr))}
.service-feature-grid-cleaning{grid-template-columns:repeat(3,minmax(0,1fr))}
.service-feature-card{overflow:hidden; align-self:start}
.service-feature-card img,.service-image-strip img{
  width:100%; height:auto; max-height:190px; aspect-ratio:1/1; object-fit:contain;
  border:1px solid var(--line); border-radius:calc(var(--radius) - 10px); background:linear-gradient(145deg,#efe5d4,#fdf8ef);
}
.service-feature-grid-two .service-feature-card img,
.service-feature-grid-cleaning .service-feature-card img,
.service-feature-grid-upgrade .service-feature-card img{
  width:100%; height:220px; max-height:none; aspect-ratio:auto; object-fit:contain;
  box-sizing:border-box; padding:.55rem; justify-self:stretch;
}
.service-feature-grid-cleaning .service-feature-card img{height:200px}
.service-feature-card h2,.service-copy h2{font-size:clamp(1.45rem,2.5vw,2.2rem); line-height:1.08}
.service-copy{display:grid; gap:1rem}
.service-copy p{margin:0}
.service-note{font-weight:900; color:var(--moss)}
.service-image-strip{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem}
.service-image-strip figure{margin:0; border:1px solid var(--line); background:rgba(255,250,240,.82); border-radius:var(--radius); padding:.8rem; box-shadow:0 16px 36px rgba(49,88,70,.09)}
.service-image-strip img{max-height:210px}
@media (max-width:640px){
  .service-header-row{flex-direction:column; align-items:flex-start; gap:1.2rem}
  .service-badge-img{width:120px; height:120px}

  .nav{padding:.7rem 1rem}.nav-links a{font-size:.78rem; padding:.58rem .75rem}
  .nav.is-collapsed .nav-links,.nav .nav-links{right:1rem; min-width:calc(100vw - 2rem); max-width:calc(100vw - 2rem)}
  .contact-method{grid-template-columns:1fr; gap:.55rem}
  .group-head{grid-template-columns:1fr; gap:.55rem}
  .grid{grid-template-columns:1fr}.service-card,.service-card:nth-child(n){grid-column:auto; min-height:auto}
  .hero{padding-top:2.4rem} h1{font-size:3rem}.section-head{display:block}
}
@media (max-width:900px){
  .service-feature-grid,.service-image-strip{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *,::before,::after{scroll-behavior:auto!important; transition:none!important; animation:none!important}
  .service-card{transform:none; opacity:1}
}
