:root{
  --bg:#f7f8fc;
  --bg2:#eef2ff;
  --card:rgba(255,255,255,.72);
  --card2:rgba(255,255,255,.86);
  --text:rgba(11,18,32,.92);
  --muted:rgba(11,18,32,.70);
  --muted2:rgba(11,18,32,.55);
  --line:rgba(11,18,32,.12);
  --brand1:#60a5fa;
  --brand2:#22c55e;
  --brand3:#a78bfa;
  --danger:#fb7185;
  --shadow: 0 18px 40px rgba(15,23,42,.14);
  --shadow2: 0 10px 24px rgba(15,23,42,.12);
  --radius: 18px;
  --radius2: 14px;
  --container: 1120px;
  --font: "Manrope", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --lh: 1.55;
  --sticky-offset: 92px;
}

*{box-sizing:border-box}
html,body{height:100%}
html.is-scroll-locked,
body.is-scroll-locked{
  overflow:hidden;
}
body{
  margin:0;
  font-family:var(--font);
  color:var(--text);
  overflow:hidden;
  background:
    radial-gradient(900px 520px at 15% -10%, rgba(96,165,250,.14), transparent 60%),
    radial-gradient(820px 520px at 95% 0%, rgba(34,197,94,.10), transparent 62%),
    linear-gradient(180deg, var(--bg) 0%, #ffffff 70%);
  line-height:var(--lh);
  overflow-x:hidden;
}

/* Better anchor positioning with sticky header */
section[id], header[id], main[id], footer[id]{
  scroll-margin-top:var(--sticky-offset);
}
@media (max-width: 640px){
  :root{ --sticky-offset: 84px; }
  section[id], header[id], main[id], footer[id]{scroll-margin-top:var(--sticky-offset)}
}
.page{
  height:100dvh;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
.page.is-scroll-locked{
  overflow:hidden;
}

a{color:inherit; text-underline-offset:3px}
a:hover{ text-decoration-thickness:2px }
img{max-width:100%; display:block}
button{font-family:inherit}
p{margin:0; line-height:var(--lh)}
h1,h2,h3{margin:0}

.container{
  max-width:var(--container);
  margin:0 auto;
  padding:0 20px;
  width:100%;
}

.skip-link{
  position:absolute;
  left:-9999px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden;
}
.skip-link:focus{
  left:16px; top:16px;
  width:auto; height:auto;
  padding:10px 12px;
  background:#ffffff;
  border:1px solid var(--line);
  border-radius:10px;
  z-index:9999;
}

.muted{color:var(--muted)}
.tiny{font-size:12px; line-height:1.45}
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0, 0, 0, 0);
  white-space:nowrap;
  border:0;
}

.site-header{
  position:sticky;
  top:0;
  z-index:50;
  backdrop-filter:saturate(140%) blur(14px);
  background:rgba(247,248,252,.70);
  border-bottom:1px solid rgba(11,18,32,.08);
}
.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:18px 0;
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  min-width:220px;
}
.brand-logo{
  height:52px;
  width:auto;
  display:block;
}
.brand-sm{min-width:unset}
.brand-mark{
  width:42px; height:42px;
  border-radius:14px;
  display:grid; place-items:center;
  font-weight:800;
  letter-spacing:.5px;
  background:
    radial-gradient(60% 70% at 30% 20%, rgba(255,255,255,.25), transparent 60%),
    linear-gradient(135deg, rgba(96,165,250,.95), rgba(34,197,94,.85));
  box-shadow:0 14px 30px rgba(34,197,94,.18), 0 12px 28px rgba(96,165,250,.15);
}
.brand-title{display:block; font-weight:800; font-size:14px; letter-spacing:.2px}
.brand-sub{display:block; font-size:12px; color:var(--muted2)}

.nav{
  display:flex;
  align-items:center;
  gap:18px;
}
.nav-link{
  text-decoration:none;
  color:var(--muted);
  font-weight:600;
  font-size:13px;
  padding:8px 10px;
  border-radius:12px;
  transition:background .2s ease, color .2s ease;
}
.nav-link:hover{
  background:rgba(11,18,32,.05);
  color:var(--text);
}
.nav-link.is-active{
  color:var(--text);
  background:
    linear-gradient(135deg, rgba(11,99,246,.10), rgba(34,197,94,.08));
  box-shadow:inset 0 0 0 1px rgba(11,99,246,.18);
}

.header-actions{
  display:flex;
  align-items:center;
  gap:12px;
}
.header-phone{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  line-height:1.2;
  gap:3px;
}
.phone{
  text-decoration:none;
  font-weight:800;
  letter-spacing:.2px;
}
.phone.big{font-size:20px}

.btn{
  appearance:none;
  border:1px solid transparent;
  background:transparent;
  color:var(--text);
  padding:12px 14px;
  border-radius:14px;
  font-weight:800;
  font-size:14px;
  line-height:1.1;
  min-height:44px;
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease, filter .18s ease;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  text-decoration:none;
  user-select:none;
  position:relative;
  overflow:hidden;
}
.btn .btn-ico{width:18px; height:18px; display:block}
.btn:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(11,99,246,.18);
}
.nav-link:focus-visible,
.svc-btn:focus-visible,
.tabbar-item:focus-visible,
.tabbar-fab:focus-visible,
.footer-links a:focus-visible,
.footer-bottom a:focus-visible,
a:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(11,99,246,.18);
  border-radius:12px;
}
.tabbar-fab:focus-visible{border-radius:999px}
.btn:active{transform:translateY(1px)}
.btn-lg{padding:14px 16px; border-radius:16px; min-height:48px}
.btn.is-loading{
  position:relative;
  pointer-events:none;
  opacity:.92;
}
.btn.is-loading::before{
  content:"";
  width:16px;
  height:16px;
  border-radius:999px;
  border:2px solid rgba(255,255,255,.55);
  border-top-color: rgba(255,255,255,.0);
  display:inline-block;
  margin-right:10px;
  animation: btnSpin .8s linear infinite;
}
@keyframes btnSpin{
  to{transform:rotate(360deg)}
}

.btn-primary{
  color:white;
  background:
    radial-gradient(120% 140% at 20% 20%, rgba(255,255,255,.22), transparent 55%),
    linear-gradient(135deg, rgba(11,99,246,.98), rgba(59,130,246,.92));
  box-shadow:0 16px 34px rgba(11,99,246,.22), 0 10px 22px rgba(15,23,42,.14);
}
.btn-primary:hover{
  transform:translateY(-1px);
  filter:saturate(1.05);
  box-shadow:0 20px 44px rgba(11,99,246,.26), 0 12px 26px rgba(15,23,42,.16);
}
.btn-primary::after{
  content:"";
  position:absolute;
  inset:-40% -60%;
  background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.32) 50%, transparent 100%);
  transform:translateX(-35%) rotate(10deg);
  opacity:0;
  transition:opacity .18s ease;
  pointer-events:none;
}
.btn-primary:hover::after{
  opacity:1;
  animation: btnShine 1.2s ease-in-out infinite;
}
@keyframes btnShine{
  0%{transform:translateX(-35%) rotate(10deg)}
  100%{transform:translateX(35%) rotate(10deg)}
}
.btn-ghost{
  border-color:rgba(11,18,32,.14);
  background:rgba(255,255,255,.72);
}
.btn-ghost:hover{
  background:rgba(255,255,255,.88);
  border-color:rgba(11,18,32,.18);
  transform:translateY(-1px);
}

.icon-btn{
  width:40px; height:40px;
  border-radius:12px;
  border:1px solid rgba(11,18,32,.14);
  background:rgba(255,255,255,.76);
  color:var(--text);
  cursor:pointer;
}
.icon-btn:hover{background:rgba(255,255,255,.92)}
.social-btn{
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  border-radius:14px;
}
.social-btn .i{
  width:20px;
  height:20px;
}

.hero{
  position:relative;
  padding:56px 0 34px;
}
.hero-grid{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap:28px;
  align-items:stretch;
}
.hero-copy{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.hero-bg{
  position:absolute;
  inset:-180px -120px auto -120px;
  height:420px;
  background:
    radial-gradient(45% 60% at 20% 35%, rgba(96,165,250,.10), transparent 62%),
    radial-gradient(45% 60% at 80% 45%, rgba(34,197,94,.08), transparent 62%);
  pointer-events:none;
  z-index:-1;
}

.social-proof{
  padding-top:22px;
  padding-bottom:16px;
}
.section-head-social{
  align-items:flex-start;
}
.social-proof-links{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:14px;
}
.social-boost{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  border-radius:18px;
  border:1px solid rgba(11,18,32,.10);
  background:
    radial-gradient(120% 140% at 18% 0%, rgba(96,165,250,.10), transparent 55%),
    rgba(255,255,255,.86);
  box-shadow:0 14px 34px rgba(15,23,42,.10);
  padding:15px 16px;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.social-boost .i{
  width:28px;
  height:28px;
  flex:0 0 auto;
}
.social-boost span{
  display:block;
  font-size:16px;
  font-weight:900;
  line-height:1.15;
}
.social-boost small{
  display:block;
  margin-top:3px;
  font-size:12px;
  color:var(--muted2);
}
.social-boost:hover{
  transform:translateY(-2px);
  box-shadow:0 20px 44px rgba(15,23,42,.14);
  border-color:rgba(11,18,32,.15);
}
.social-boost--yt .i{color:#dc2626}
.social-boost--ig .i{color:#c026d3}
.social-boost--tt .i{color:#111827}

.badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:9px 12px;
  border-radius:999px;
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.78);
  color:rgba(11,18,32,.86);
  font-weight:700;
  font-size:12px;
}
.badge-icon{
  width:22px; height:22px;
  border-radius:999px;
  display:grid; place-items:center;
  background:rgba(251,146,60,.12);
  border:1px solid rgba(251,146,60,.25);
}

.h1{
  font-size:clamp(30px, 4vw, 46px);
  line-height:1.08;
  margin:14px 0 12px;
  letter-spacing:-.8px;
}
.h1-accent{
  display:inline-block;
  background:linear-gradient(135deg, rgba(96,165,250,.98), rgba(34,197,94,.98));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.lead{
  margin:0 0 18px;
  color:var(--muted);
  font-size:16px;
  max-width:60ch;
}
.hero-cta{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  padding:6px 0 14px;
}

.trust-row{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:12px;
  margin-top:10px;
}
.trust{
  padding:12px 12px;
  border-radius:16px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(11,18,32,.10);
}
.trust-title{font-weight:900}
.trust-sub{font-size:12px; color:var(--muted2); margin-top:2px}

.hero-media{
  display:grid;
  gap:12px;
  align-content:start;
}
.media-card{
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid rgba(11,18,32,.10);
  background:
    radial-gradient(120% 140% at 10% 0%, rgba(255,255,255,.85), transparent 55%),
    rgba(255,255,255,.62);
  box-shadow:var(--shadow);
}
.media-photo{
  min-height:280px;
  position:relative;
  display:grid;
  place-items:stretch;
  background:
    radial-gradient(80% 70% at 25% 35%, rgba(96,165,250,.22), transparent 62%),
    radial-gradient(85% 80% at 70% 30%, rgba(34,197,94,.14), transparent 62%),
    linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
}
.media-photo img{
  width:100%; height:100%;
  object-fit:cover;
}
.photo-placeholder{
  padding:22px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:4px;
}
.ph-title{font-weight:900}
.ph-sub{font-size:12px; color:var(--muted2)}

.media-panel{
  padding:14px 16px;
  display:grid;
  gap:10px;
  border-top:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.70);
}
.panel-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  font-size:13px;
}
.panel-label{color:var(--muted2); font-weight:700}
.panel-value{font-weight:800}

.floating-note{
  position:static;
  width:100%;
  padding:14px 14px;
  border-radius:18px;
  background:rgba(255,255,255,.86);
  border:1px solid rgba(11,18,32,.10);
  box-shadow:var(--shadow2);
}
.note-title{font-weight:900}
.note-sub{font-size:12px; color:var(--muted2); margin-top:2px}

.section{
  padding:clamp(52px, 6vw, 76px) 0;
}
.section-alt{
  background:
    radial-gradient(820px 420px at 10% 20%, rgba(96,165,250,.08), transparent 60%),
    radial-gradient(820px 420px at 90% 30%, rgba(34,197,94,.06), transparent 60%),
    rgba(255,255,255,.66);
  border-top:1px solid rgba(11,18,32,.06);
  border-bottom:1px solid rgba(11,18,32,.06);
}
.section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-bottom:clamp(14px, 2.2vw, 22px);
  row-gap:10px;
}
.section-head p{max-width:62ch; margin:0}
.section-head .h2{padding-bottom:2px}
.section-head:not(.section-head--process):not(.section-head--coverage) .h2{
  position:relative;
  display:inline-block;
}
.section-head:not(.section-head--process):not(.section-head--coverage) .h2::after{
  content:"";
  display:block;
  width:min(68px, 20%);
  height:2px;
  margin:12px 0 0;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(11,99,246,.48), rgba(34,197,94,.38));
  opacity:.92;
}
.h2{
  margin:0;
  font-size:clamp(22px, 2.4vw, 28px);
  line-height:1.15;
  letter-spacing:-.4px;
}
.h3{
  margin:0 0 8px;
  font-size:16px;
  line-height:1.25;
  letter-spacing:-.2px;
}
.lead{font-size:17px}
.section-head{padding-bottom:4px}

.cards{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:14px;
  align-items:stretch;
}
.svc-cards{
  gap:16px;
}
.svc-card{
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid rgba(11,18,32,.10);
  background:
    radial-gradient(120% 140% at 10% 0%, rgba(255,255,255,.85), transparent 55%),
    rgba(255,255,255,.62);
  box-shadow:0 14px 32px rgba(15,23,42,.10);
  display:flex;
  flex-direction:column;
  min-height: 420px;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, filter .18s ease;
}
.svc-card--clickable{
  position:relative;
  cursor:pointer;
}
.svc-card-hit{
  position:absolute;
  inset:0;
  z-index:4;
  border-radius:inherit;
}
.svc-card--clickable .svc-photo,
.svc-card--clickable .svc-body{
  position:relative;
  z-index:2;
}
.svc-card:hover{
  transform:translateY(-2px);
  border-color:rgba(11,18,32,.14);
  box-shadow:0 18px 48px rgba(15,23,42,.12);
}
.svc-photo{
  min-height: clamp(110px, 16vw, 140px);
  position:relative;
  display:grid;
  place-items:stretch;
  background:
    radial-gradient(80% 70% at 25% 35%, rgba(96,165,250,.22), transparent 62%),
    radial-gradient(85% 80% at 70% 30%, rgba(34,197,94,.14), transparent 62%),
    linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
}
.svc-body p.muted{
  font-size:14px;
}
.svc-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.02);
  filter:saturate(1.06) contrast(1.02);
  transition:transform .25s ease, filter .25s ease;
}
.svc-photo::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(15,23,42,.00) 0%, rgba(15,23,42,.32) 100%),
    radial-gradient(90% 70% at 20% 10%, rgba(255,255,255,.20), transparent 55%);
  opacity:.95;
  pointer-events:none;
}
.svc-photo::before{
  content:"";
  position:absolute;
  inset:-45% -60%;
  background:
    linear-gradient(90deg, transparent 0%, rgba(255,255,255,.08) 34%, rgba(255,255,255,.55) 50%, rgba(255,255,255,.10) 66%, transparent 100%);
  transform:translateX(-48%) rotate(12deg);
  opacity:0;
  pointer-events:none;
  mix-blend-mode:screen;
  filter:blur(0.3px);
}
.svc-photo::before{ animation: svcGlass 9.5s ease-in-out infinite; }
.svc-card:nth-child(2) .svc-photo::before{ animation-delay: 1.4s; }
.svc-card:nth-child(3) .svc-photo::before{ animation-delay: 2.7s; }
.svc-card:nth-child(4) .svc-photo::before{ animation-delay: 4.1s; }
.svc-card:nth-child(5) .svc-photo::before{ animation-delay: 5.3s; }
.svc-card:nth-child(6) .svc-photo::before{ animation-delay: 6.6s; }
.svc-card:hover .svc-photo::after{opacity:1}
@keyframes svcGlass{
  0%, 70%{
    opacity:0;
    transform:translateX(-48%) rotate(12deg);
  }
  74%{
    opacity:.60;
  }
  82%{
    opacity:.22;
    transform:translateX(48%) rotate(12deg);
  }
  100%{
    opacity:0;
    transform:translateX(48%) rotate(12deg);
  }
}
.svc-card:hover .svc-photo img{
  transform:scale(1.06);
  filter:saturate(1.14) contrast(1.04);
}
.svc-body{
  padding:14px 16px 16px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.svc-body .h3{
  margin:0;
}
.svc-panel{
  margin-top:2px;
  padding:12px 12px;
  border-radius:18px;
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.70);
  display:grid;
  gap:10px;
}
.svc-defects{
  display:grid;
  gap:8px;
}
.svc-list{
  margin:0;
  padding:0 0 0 16px;
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}
.svc-list li{margin:0}
.svc-cta{
  margin-top:auto;
  display:flex;
}
.svc-cta .btn{
  width:100%;
}
/* Service card primary CTA — arrow icon animates on hover */
.svc-cta .btn .btn-ico{transition:transform .18s ease}
.svc-cta .btn:hover .btn-ico{transform:translateX(3px)}
@media (prefers-reduced-motion: reduce){
  .svc-photo::before{animation:none; display:none}
}
.card{
  padding:14px 14px;
  border-radius:var(--radius);
  border:1px solid rgba(11,18,32,.10);
  background:
    radial-gradient(120% 160% at 20% 10%, rgba(255,255,255,.95), transparent 55%),
    rgba(255,255,255,.72);
  box-shadow:0 14px 32px rgba(15,23,42,.10);
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height: 320px;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, filter .18s ease;
}
.card:hover{
  transform:translateY(-2px);
  border-color:rgba(11,18,32,.14);
  box-shadow:0 18px 48px rgba(15,23,42,.12);
}
.card-icon{
  --ico-a: rgba(96,165,250,.95);
  --ico-b: rgba(34,197,94,.90);
  --ico-ink: rgba(11,18,32,.88);

  width:100%;
  height:168px;
  border-radius:18px;
  display:block;
  color:var(--ico-ink);
  background:
    radial-gradient(80% 80% at 30% 20%, rgba(255,255,255,.92), transparent 58%),
    linear-gradient(135deg, rgba(255,255,255,.55), rgba(255,255,255,.16)),
    linear-gradient(135deg, color-mix(in srgb, var(--ico-a) 18%, transparent), color-mix(in srgb, var(--ico-b) 16%, transparent));
  border:1px solid rgba(11,18,32,.10);
  box-shadow:0 14px 28px rgba(15,23,42,.10);
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
  position:relative;
  overflow:hidden;
}
.card-icon{
  -webkit-mask-image: radial-gradient(120% 120% at 35% 10%, #000 65%, rgba(0,0,0,.95) 75%, transparent 100%);
  mask-image: radial-gradient(120% 120% at 35% 10%, #000 65%, rgba(0,0,0,.95) 75%, transparent 100%);
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
}
.card-icon{
  -webkit-mask-size: 140% 140%;
  mask-size: 140% 140%;
  -webkit-mask-position: 50% 50%;
  mask-position: 50% 50%;
}
.card-icon img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.02);
  filter:saturate(1.05) contrast(1.02);
  transition:transform .25s ease, filter .25s ease;
}
.card-icon::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(15,23,42,.00) 0%, rgba(15,23,42,.22) 100%),
    radial-gradient(80% 70% at 25% 15%, rgba(255,255,255,.22), rgba(255,255,255,0) 55%);
  opacity:.9;
  pointer-events:none;
}
.card-icon::before{
  content:"";
  position:absolute;
  inset:-40%;
  background:
    conic-gradient(from 210deg, rgba(96,165,250,.20), rgba(34,197,94,.16), rgba(167,139,250,.18), rgba(96,165,250,.20));
  filter:blur(18px);
  opacity:.35;
  mix-blend-mode:overlay;
  pointer-events:none;
  transform:translate3d(0,0,0);
}
.card:hover .card-icon{
  transform:translateY(-1px) scale(1.02);
  box-shadow:0 18px 36px rgba(15,23,42,.12);
  filter:saturate(1.06);
}
.card:hover .card-icon img{
  transform:scale(1.06);
  filter:saturate(1.12) contrast(1.04);
}
.card-icon .i{
  width:24px;
  height:24px;
  color:inherit;
}
.cards .card-icon .i-flame{color:inherit}

/* Service icon themes */
.card-icon--flame{
  --ico-a:#ffb100;
  --ico-b:#ff3b00;
  --ico-ink:#b73a00;
  border-color:rgba(251,146,60,.22);
  box-shadow:0 14px 28px rgba(255,90,0,.14), 0 14px 28px rgba(15,23,42,.08);
}
.card-icon--stove{
  --ico-a:#a78bfa;
  --ico-b:#60a5fa;
  --ico-ink:#1f2a62;
  border-color:rgba(167,139,250,.22);
}
.card-icon--boiler{
  --ico-a:#22c55e;
  --ico-b:#60a5fa;
  --ico-ink:#0f4d2b;
  border-color:rgba(34,197,94,.20);
}
.card-icon--washer{
  --ico-a:#60a5fa;
  --ico-b:#22c55e;
  --ico-ink:#0b3b7a;
  border-color:rgba(96,165,250,.20);
}
.card-icon--fridge{
  --ico-a:#60a5fa;
  --ico-b:#a78bfa;
  --ico-ink:#133a68;
  border-color:rgba(96,165,250,.20);
}
.card-icon--tools{
  --ico-a:#94a3b8;
  --ico-b:#60a5fa;
  --ico-ink:#263241;
  border-color:rgba(148,163,184,.22);
}
/* CTAs inside service cards */
.card-ctas{
  margin-top:auto;
  display:flex;
  gap:10px;
  flex-wrap:nowrap;
  align-items:stretch;
}
.svc-btn{
  appearance:none;
  border:1px solid transparent;
  background:transparent;
  color:rgba(11,18,32,.92);
  padding:10px 12px;
  border-radius:14px;
  font-weight:900;
  cursor:pointer;
  transition:transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease, filter .16s ease, color .16s ease;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  text-decoration:none;
  user-select:none;
  line-height:1.1;
  flex:1 1 0;
  min-height:44px;
  text-align:center;
}
.svc-ico{
  width:18px;
  height:18px;
  flex:0 0 auto;
  opacity:.95;
}
.svc-btn:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(11,99,246,.18);
}
.svc-btn:active{transform:translateY(1px)}

.svc-btn--lead{
  color:white;
  background:
    radial-gradient(120% 140% at 20% 20%, rgba(255,255,255,.22), transparent 55%),
    linear-gradient(135deg, rgba(11,99,246,.98), rgba(59,130,246,.92));
  box-shadow:0 14px 30px rgba(11,99,246,.20), 0 10px 22px rgba(15,23,42,.12);
}
.svc-btn--lead:hover{
  transform:translateY(-1px);
  filter:saturate(1.05);
  box-shadow:0 18px 40px rgba(11,99,246,.26), 0 12px 26px rgba(15,23,42,.14);
}

.svc-btn--wa{
  border-color:rgba(11,99,246,.18);
  background:
    radial-gradient(120% 140% at 15% 10%, rgba(255,255,255,.55), transparent 55%),
    rgba(255,255,255,.70);
}
.svc-btn--wa:hover{
  transform:translateY(-1px);
  border-color:rgba(11,99,246,.28);
  background:
    radial-gradient(120% 140% at 15% 10%, rgba(255,255,255,.68), transparent 55%),
    rgba(255,255,255,.86);
  box-shadow:0 14px 30px rgba(11,99,246,.10);
}
@media (max-width: 640px){
  .card-ctas{gap:10px}
  .svc-btn{
    padding:10px 10px;
    font-size:13px;
  }
  .svc-card{
    display:flex;
    flex-direction:column;
    gap:10px;
    align-items:stretch;
    min-height:unset;
    padding:12px;
    background:
      radial-gradient(120% 140% at 10% 0%, rgba(255,255,255,.92), transparent 55%),
      rgba(255,255,255,.62);
  }
  .svc-photo{
    width:100%;
    min-height: 108px;
    border-radius:16px;
    overflow:hidden;
    border:1px solid rgba(11,18,32,.10);
  }
  .svc-photo::after{ border-radius:16px; }
  .svc-body{
    padding:0;
    gap:8px;
  }
  .svc-body .h3{
    font-size:15px;
    line-height:1.2;
  }
  .svc-body p.muted{
    font-size:13.5px;
  }
  .svc-panel{
    padding:10px 10px;
    border-radius:16px;
    gap:8px;
  }
  .svc-list{
    font-size:12.5px;
  }
  .svc-cta .btn{
    min-height:42px;
    border-radius:14px;
    font-size:13px;
  }
}

.grid-2{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
  margin-top:10px;
}
.feature{
  padding:18px 18px;
  border-radius:var(--radius);
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.78);
}

/* --- Why: почему выбирают нас --- */
.section-why .section-head{
  max-width:none;
  width:100%;
}
.section-why .section-head .h2{
  position:relative;
  display:inline-block;
}
.section-why .section-head .h2::after{
  content:"";
  display:block;
  width:min(72px, 22%);
  height:2px;
  margin:12px 0 0;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(11,99,246,.55), rgba(34,197,94,.45));
  opacity:.95;
}
.why-grid{
  margin-top:18px;
  gap:16px;
}
.section-why .feature.why-card{
  position:relative;
  overflow:hidden;
  border:1px solid transparent;
  background:
    /* gradient border */
    linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,.72)) padding-box,
    linear-gradient(135deg,
      color-mix(in srgb, var(--accent, rgba(11,99,246,.95)) 38%, rgba(255,255,255,.10)),
      rgba(34,197,94,.18),
      rgba(11,18,32,.10)
    ) border-box;
  box-shadow:0 16px 34px rgba(15,23,42,.10);
  transition:transform .18s ease, box-shadow .18s ease;
  padding:16px;
  isolation:isolate;
}
.section-why .feature.why-card::after{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  border-radius:999px;
  background:linear-gradient(180deg, var(--accent, rgba(11,99,246,.75)), rgba(34,197,94,.55));
  opacity:.9;
}
.section-why .feature.why-card::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:calc(var(--radius) + 2px);
  background:
    radial-gradient(120% 140% at 18% 10%,
      color-mix(in srgb, var(--accent, rgba(11,99,246,.9)) 40%, transparent),
      transparent 62%
    ),
    conic-gradient(
      from 210deg at 18% 12%,
      rgba(255,255,255,.00),
      color-mix(in srgb, var(--accent, rgba(11,99,246,.95)) 38%, transparent),
      rgba(34,197,94,.12),
      rgba(255,255,255,.00)
    );
  opacity:.0;
  filter:blur(10px);
  z-index:-1;
  transition:opacity .18s ease;
}
.section-why .feature.why-card .why-card-row{
  position:relative;
  z-index:1;
}
.section-why .feature.why-card .why-shine{
  display:none;
}
.section-why .feature.why-card:hover::before{
  opacity:.75;
}
.section-why .feature.why-card:hover{
  transform:translateY(-2px);
  box-shadow:0 22px 54px rgba(15,23,42,.14);
}
.why-card-row{
  display:grid;
  grid-template-columns: 45% 1fr;
  gap:16px;
  align-items:stretch;
  min-height:204px;
}
.why-media{
  margin:0;
  position:relative;
  overflow:hidden;
  border-radius:18px;
  border:1px solid rgba(11,18,32,.10);
  background:rgba(11,18,32,.03);
  box-shadow:0 18px 36px rgba(15,23,42,.10);
}
.why-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(110deg, rgba(255,255,255,.00) 0%, rgba(255,255,255,.10) 42%, rgba(255,255,255,.44) 100%);
  pointer-events:none;
}
.why-media::before{
  content:"";
  position:absolute;
  inset:-40% -60%;
  background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.28) 45%, transparent 100%);
  transform:translateX(-35%) rotate(10deg);
  opacity:0;
  pointer-events:none;
}
.why-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  filter:saturate(1.03) contrast(1.02);
  transform:scale(1.02);
}
.why-media{
  transform:translateZ(0);
}
.why-media img{
  transform-origin: 50% 50%;
}
.why-content{
  padding:4px 2px 4px 0;
  min-width:0;
}
.why-card-head{min-width:0}
.why-badge{
  width:fit-content;
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.25px;
  text-transform:uppercase;
  color:color-mix(in srgb, var(--accent, rgba(11,99,246,.95)) 62%, rgba(11,18,32,.88));
  border:1px solid color-mix(in srgb, var(--accent, rgba(11,99,246,.95)) 22%, rgba(11,18,32,.10));
  background:
    radial-gradient(120% 140% at 15% 10%, rgba(255,255,255,.74), transparent 55%),
    linear-gradient(135deg,
      color-mix(in srgb, var(--accent, rgba(11,99,246,.95)) 18%, rgba(255,255,255,.82)),
      rgba(255,255,255,.82)
    );
  padding:6px 11px 6px 8px;
  border-radius:999px;
  margin-bottom:10px;
  box-shadow:0 12px 24px rgba(15,23,42,.08);
}
.why-badge .i{
  width:14px;
  height:14px;
  color:var(--accent, rgba(11,99,246,.95));
  flex:0 0 auto;
}
.why-title{
  font-size:17px;
  line-height:1.2;
  letter-spacing:-.2px;
}
.why-desc{
  margin-top:6px;
  font-size:13.5px;
  color:rgba(11,18,32,.68);
}
.why-points{
  margin:12px 0 0;
  padding:0;
  color:rgba(11,18,32,.70);
  font-size:13px;
  line-height:1.55;
  list-style:none;
}
.why-points li{
  margin:8px 0;
  padding-left:24px;
  position:relative;
}
.why-points li{
  padding-left:30px;
  font-size:13.5px;
  color:rgba(11,18,32,.74);
}
.why-points li::before{
  content:"";
  position:absolute;
  left:0;
  top:.26em;
  width:20px;
  height:20px;
  border-radius:8px;
  background:
    radial-gradient(120% 140% at 30% 20%, rgba(255,255,255,.38), transparent 55%),
    linear-gradient(135deg,
      color-mix(in srgb, var(--accent, rgba(11,99,246,.95)) 95%, rgba(255,255,255,.0)),
      color-mix(in srgb, var(--accent, rgba(11,99,246,.95)) 62%, rgba(0,0,0,.20))
    );
  box-shadow:
    0 10px 20px color-mix(in srgb, var(--accent, rgba(11,99,246,.28)) 52%, rgba(15,23,42,.10)),
    inset 0 1px 0 rgba(255,255,255,.32);
  border:1px solid color-mix(in srgb, var(--accent, rgba(11,99,246,.95)) 52%, rgba(11,18,32,.14));
}
.why-points li::after{
  content:"";
  position:absolute;
  left:5px;
  top:.58em;
  width:10px;
  height:5px;
  border-left:2.4px solid #fff;
  border-bottom:2.4px solid #fff;
  transform:rotate(-45deg);
  filter:drop-shadow(0 1px 0 rgba(0,0,0,.08));
}

/* Stat strip used at the top of "Почему выбирают нас" */
.why-stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:12px;
  margin:4px 0 clamp(18px, 2.4vw, 26px);
}
.why-stat{
  --accent: rgba(11,99,246,.95);
  position:relative;
  padding:18px 16px 16px;
  border-radius:18px;
  border:1px solid rgba(11,18,32,.09);
  background:
    radial-gradient(120% 140% at 15% 0%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 60%),
    rgba(255,255,255,.86);
  box-shadow:0 14px 32px rgba(15,23,42,.08);
  overflow:hidden;
  isolation:isolate;
}
.why-stat::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 55%, transparent), transparent 60%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;
  pointer-events:none;
  z-index:-1;
}
.why-stat-ico{
  width:38px;
  height:38px;
  border-radius:12px;
  display:grid;
  place-items:center;
  color:#fff;
  margin-bottom:10px;
  background:
    radial-gradient(120% 120% at 25% 20%, rgba(255,255,255,.55), transparent 55%),
    linear-gradient(135deg,
      color-mix(in srgb, var(--accent) 96%, rgba(0,0,0,.0)),
      color-mix(in srgb, var(--accent) 64%, rgba(0,0,0,.22))
    );
  box-shadow:0 10px 22px color-mix(in srgb, var(--accent) 36%, rgba(15,23,42,.10));
}
.why-stat-ico .i{width:20px; height:20px}
.why-stat-value{
  font-size:clamp(20px, 2.2vw, 24px);
  font-weight:900;
  letter-spacing:-.6px;
  color:var(--text);
  display:flex;
  align-items:baseline;
  gap:5px;
  font-variant-numeric:tabular-nums;
}
.why-stat-unit{
  font-size:13px;
  font-weight:800;
  color:color-mix(in srgb, var(--accent) 70%, rgba(11,18,32,.60));
  letter-spacing:0;
}
.why-stat-label{
  margin-top:2px;
  font-size:12.5px;
  line-height:1.4;
  color:var(--muted2);
}

@media (max-width: 900px){
  .why-stats{grid-template-columns:repeat(2, minmax(0,1fr))}
}
@media (max-width: 560px){
  .why-stats{grid-template-columns:1fr 1fr; gap:10px}
  .why-stat{padding:14px 12px 12px; border-radius:14px}
  .why-stat-ico{width:34px; height:34px}
}

/* Reveal animation (progressive enhancement) */
.js .reveal{
  opacity:0;
  transform:translateY(10px);
  filter:blur(.2px);
}
.js .reveal.is-in{
  opacity:1;
  transform:none;
  filter:none;
}
@media (prefers-reduced-motion: no-preference){
  .js .reveal.is-in{
    transition:
      opacity .55s cubic-bezier(.2,.8,.2,1),
      transform .65s cubic-bezier(.2,.8,.2,1),
      filter .65s cubic-bezier(.2,.8,.2,1);
    transition-delay: var(--reveal-delay, 0ms);
  }
  .why-media img{transition:transform .55s cubic-bezier(.2,.8,.2,1), filter .35s ease}
  .section-why .feature.why-card:hover .why-media img{
    transform:scale(1.06);
    filter:saturate(1.05) contrast(1.03);
  }
  .section-why .feature.why-card:hover .why-media::before{
    opacity:1;
    animation: whyMediaShine 1.15s ease-in-out 1;
  }
  .section-why .feature.why-card{
    transition:transform .22s cubic-bezier(.2,.8,.2,1), box-shadow .22s ease, border-color .22s ease;
  }
  .section-why .feature.why-card:hover{
    transform:translateY(-3px);
  }
  .section-why .feature.why-card:hover .why-media img{
    transform:scale(1.07);
  }
}
@keyframes whyMediaShine{
  0%{transform:translateX(-35%) rotate(10deg)}
  100%{transform:translateX(35%) rotate(10deg)}
}
@media (prefers-reduced-motion: reduce){
  .js .reveal{
    opacity:1;
    transform:none;
    filter:none;
  }
}
@media (max-width: 720px){
  .why-grid{gap:12px}
  .why-title{font-size:16px}
  .why-card-row{grid-template-columns:1fr; min-height:unset}
  .why-media{height:200px}
  .why-content{padding:2px}
}

/* Premium image shape on wider screens */
@media (min-width: 860px){
  .why-media{
    clip-path: polygon(0 0, 100% 0, 94% 100%, 0 100%);
  }
}

/* --- Process: как мы работаем --- */
.section-process,
.section-coverage{
  position:relative;
}
.section-head--process,
.section-head--coverage{
  display:block;
  width:100%;
  margin-bottom:clamp(14px, 2.5vw, 22px);
  padding-bottom:0;
}
.section-head--process .h2,
.section-head--coverage .h2{
  padding-bottom:0;
}
.process-hero,
.coverage-hero{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:0;
  padding:clamp(10px, 2vw, 16px) 16px clamp(6px, 1.5vw, 10px);
  border:none;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  position:relative;
  overflow:visible;
  max-width:720px;
  margin:0 auto;
}
.process-hero-title,
.coverage-hero-title{
  margin:0;
  position:relative;
  font-size:clamp(22px, 2.6vw, 30px);
  line-height:1.15;
  letter-spacing:-.45px;
  font-weight:900;
}
.process-hero-title::after,
.coverage-hero-title::after{
  content:"";
  display:block;
  width:min(56px, 18%);
  height:2px;
  margin:12px auto 0;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(11,99,246,.45), rgba(34,197,94,.4));
  opacity:.85;
}
.process-hero-accent,
.coverage-hero-accent{
  display:inline;
  background:linear-gradient(135deg, rgba(11,99,246,.92), rgba(34,197,94,.88));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.process-hero-sub,
.coverage-hero-sub{
  position:relative;
  z-index:1;
  margin:14px 0 0;
  padding:0;
  border:none;
  max-width:48ch;
  margin-left:auto;
  margin-right:auto;
  font-size:14px;
  line-height:1.55;
  color:rgba(11,18,32,.68);
}
.process-board,
.coverage-board{
  margin-top:clamp(22px, 3.2vw, 36px);
  padding:clamp(18px, 2.6vw, 26px);
  border-radius:calc(var(--radius) + 10px);
  border:1px solid rgba(11,18,32,.08);
  background:
    radial-gradient(900px 360px at 10% -40%, rgba(96,165,250,.16), transparent 58%),
    radial-gradient(760px 300px at 100% -10%, rgba(34,197,94,.10), transparent 54%),
    linear-gradient(168deg, rgba(255,255,255,.98) 0%, rgba(250,251,255,.88) 45%, rgba(255,255,255,.82) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    inset 0 0 0 1px rgba(255,255,255,.4),
    0 28px 60px rgba(15,23,42,.08);
  position:relative;
  overflow:hidden;
}
.process-board::before,
.coverage-board::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(120% 80% at 50% 120%, rgba(11,99,246,.06), transparent 55%),
    repeating-linear-gradient(
      -12deg,
      transparent,
      transparent 36px,
      rgba(11,18,32,.018) 36px,
      rgba(11,18,32,.018) 37px
    );
  opacity:.9;
  pointer-events:none;
}

.steps{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
  margin-top:0;
  padding-left:0;
  list-style:none;
  position:relative;
  z-index:1;
}
.steps > li{
  min-width:0;
  display:flex;
}
.step{
  --step-a:#0b63f6;
  --step-b:#60a5fa;
  --step-glow:rgba(11,99,246,.14);

  flex:1;
  padding:14px 16px 16px;
  border-radius:18px;
  border:1px solid rgba(11,18,32,.09);
  border-left:3px solid rgba(11,99,246,.38);
  background:
    radial-gradient(150% 130% at 0% -10%, color-mix(in srgb, var(--step-a) 14%, transparent), transparent 58%),
    radial-gradient(120% 100% at 100% 105%, color-mix(in srgb, var(--step-b) 10%, transparent), transparent 56%),
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.82));
  backdrop-filter:saturate(150%) blur(10px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.88),
    0 16px 40px rgba(15,23,42,.08);
  appearance:none;
  width:100%;
  margin:0;
  text-align:left;
  font:inherit;
  color:inherit;
  cursor:pointer;
  display:grid;
  grid-template-rows:auto minmax(0, 1fr);
  gap:10px;
  align-items:start;
  min-height:0;
  align-self:stretch;
  position:relative;
  overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.step::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:3px;
  border-radius:18px 18px 0 0;
  background:linear-gradient(90deg, var(--step-a), var(--step-b));
  opacity:.92;
  pointer-events:none;
  z-index:1;
}
.step--1{ --step-a:#0b63f6; --step-b:#38bdf8; --step-glow:rgba(11,99,246,.18); }
.step--2{ --step-a:#0d9488; --step-b:#22c55e; --step-glow:rgba(13,148,136,.16); }
.step--3{ --step-a:#7c3aed; --step-b:#a78bfa; --step-glow:rgba(124,58,237,.16); }

@supports (color: color-mix(in srgb, red, blue)){
  .step{
    border-left:3px solid color-mix(in srgb, var(--step-a) 65%, transparent);
  }
}

.step:hover{
  transform:translateY(-3px);
  border-color:rgba(11,18,32,.11);
  box-shadow:
    0 24px 52px rgba(15,23,42,.12),
    0 0 0 1px color-mix(in srgb, var(--step-a) 26%, transparent),
    inset 0 1px 0 rgba(255,255,255,.95);
}
.step:focus-visible{
  outline:none;
  border-color:rgba(11,18,32,.11);
  box-shadow:
    0 20px 48px rgba(15,23,42,.1),
    0 0 0 3px rgba(11,99,246,.28),
    0 0 0 1px color-mix(in srgb, var(--step-a) 26%, transparent);
}
.step:active{
  transform:translateY(-1px);
}
.step-top{
  display:grid;
  grid-template-columns:42px minmax(0, 1fr);
  align-items:start;
  gap:12px;
  position:relative;
  z-index:2;
}
.step-head{
  min-width:0;
  display:grid;
  gap:4px;
}
.step-head-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.step-picto{
  width:34px;
  height:34px;
  border-radius:12px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  color:var(--step-a);
  background:
    radial-gradient(80% 80% at 30% 20%, rgba(255,255,255,.92), transparent 58%),
    linear-gradient(135deg, color-mix(in srgb, var(--step-a) 18%, transparent), color-mix(in srgb, var(--step-b) 14%, transparent));
  border:1px solid color-mix(in srgb, var(--step-a) 24%, transparent);
  box-shadow:0 10px 24px var(--step-glow);
}
.step-picto .i{
  width:18px;
  height:18px;
}
.step-ico{
  width:42px;
  height:42px;
  border-radius:999px;
  display:grid;
  place-items:center;
  font-weight:900;
  font-size:15px;
  font-variant-numeric:tabular-nums;
  letter-spacing:-.5px;
  color:#fff;
  background:
    radial-gradient(70% 80% at 30% 18%, rgba(255,255,255,.32), transparent 58%),
    linear-gradient(145deg, var(--step-a), var(--step-b));
  border:1px solid color-mix(in srgb, var(--step-a) 38%, rgba(255,255,255,.4));
  box-shadow:
    0 18px 40px var(--step-glow),
    0 8px 20px rgba(15,23,42,.1),
    inset 0 1px 0 rgba(255,255,255,.25);
  flex:0 0 auto;
  position:relative;
  overflow:hidden;
}
.step-ico::after{
  content:"";
  position:absolute;
  inset:-45% -65%;
  background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.32) 50%, transparent 100%);
  transform:translateX(-35%) rotate(10deg);
  opacity:.6;
  pointer-events:none;
}
.step-title{
  font-weight:900;
  letter-spacing:-.28px;
  font-size:15px;
  line-height:1.25;
  min-height:2.5em;
}
.step-kicker{
  font-size:10px;
  font-weight:900;
  letter-spacing:.8px;
  text-transform:uppercase;
  color:color-mix(in srgb, var(--step-a) 58%, rgba(11,18,32,.42));
  margin:0;
}
.step-body{
  margin:0;
  font-size:13px;
  line-height:1.5;
  align-self:start;
  position:relative;
  z-index:2;
}

.steps--process{
  margin-top:0;
}
@media (min-width: 981px){
  .process-board .steps--process::before{
    content:"";
    position:absolute;
    z-index:0;
    left:calc(16px + 21px);
    right:calc(16px + 21px);
    top:calc(14px + 21px);
    height:2px;
    border-radius:999px;
    background:linear-gradient(90deg,
      rgba(11,99,246,.32),
      rgba(13,148,136,.26),
      rgba(124,58,237,.28));
    opacity:.88;
  }
  .process-board .steps--process .step{
    z-index:2;
  }
}

@media (max-width: 640px){
  .process-board .steps--process .step:not(:last-child)::after{
    content:"";
    position:absolute;
    left:calc(16px + 21px);
    top:calc(14px + 42px + 10px);
    bottom:-18px;
    width:2px;
    border-radius:999px;
    background:linear-gradient(180deg, rgba(11,99,246,.35), rgba(124,58,237,.28));
    opacity:.55;
    z-index:0;
    pointer-events:none;
  }
}

.chips{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}
.chip{
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.78);
  font-weight:800;
  color:rgba(11,18,32,.78);
  font-size:12px;
}

/* --- Brand strip (процесс / марки) --- */
.brand-band{
  margin-top:clamp(22px, 4vw, 34px);
  padding:clamp(18px, 3vw, 26px) clamp(14px, 3vw, 22px) clamp(4px, 1vw, 8px);
  border-radius:calc(var(--radius) + 6px);
  border:1px solid rgba(11,18,32,.07);
  background:
    radial-gradient(900px 240px at 50% -40%, rgba(96,165,250,.10), transparent 58%),
    radial-gradient(700px 200px at 0% 100%, rgba(34,197,94,.06), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.35));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.75),
    0 18px 44px rgba(15,23,42,.07);
  opacity:1;
}
@media (prefers-reduced-motion: no-preference){
  .brand-band{
    opacity:0;
    animation:brandBandIn 0.75s cubic-bezier(.2,.8,.2,1) both;
  }
}
@keyframes brandBandIn{
  from{
    opacity:0;
    transform:translateY(10px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}
.brand-band-head{
  text-align:center;
  max-width:52ch;
  margin:0 auto clamp(16px, 2.5vw, 22px);
}
.brand-band-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(11,18,32,.58);
  margin-bottom:10px;
  padding:7px 14px;
  border-radius:999px;
  border:1px solid rgba(11,99,246,.14);
  background:
    radial-gradient(120% 140% at 20% 0%, rgba(255,255,255,.9), transparent 55%),
    linear-gradient(135deg, rgba(11,99,246,.09), rgba(34,197,94,.06));
  box-shadow:0 8px 20px rgba(11,99,246,.06);
}
.brand-band-eyebrow::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:999px;
  background:linear-gradient(135deg, rgba(11,99,246,.95), rgba(34,197,94,.85));
  box-shadow:0 0 0 3px rgba(11,99,246,.12);
  flex-shrink:0;
}
.brand-band-title{
  margin:0 0 8px;
  font-size:clamp(17px, 2vw, 20px);
  font-weight:900;
  letter-spacing:-.3px;
}
.brand-band-desc{
  margin:0;
  font-size:14px;
  line-height:1.55;
}

.brand-marquee{
  position:relative;
  overflow:hidden;
  border-radius:var(--radius);
  border:1px solid rgba(11,18,32,.09);
  background:
    radial-gradient(ellipse 80% 120% at 50% -20%, rgba(96,165,250,.12), transparent 55%),
    linear-gradient(165deg, rgba(255,255,255,.94) 0%, rgba(248,250,255,.88) 50%, rgba(255,255,255,.82) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.92),
    inset 0 -1px 0 rgba(11,18,32,.04),
    0 12px 32px rgba(15,23,42,.07);
  mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.brand-marquee::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:3px;
  border-radius:var(--radius) var(--radius) 0 0;
  background:linear-gradient(90deg, rgba(11,99,246,.55), rgba(13,148,136,.45), rgba(124,58,237,.45), rgba(34,197,94,.5));
  opacity:.85;
  pointer-events:none;
  z-index:1;
}
.brand-marquee__track{
  display:flex;
  width:max-content;
  gap:14px;
  padding:18px 0 20px;
  will-change:transform;
  animation:brandMarquee 52s linear infinite;
}
@keyframes brandMarquee{
  to { transform:translateX(-50%); }
}
@media (prefers-reduced-motion: no-preference){
  .brand-marquee:hover .brand-marquee__track{
    animation-play-state:paused;
  }
}
@media (prefers-reduced-motion: reduce){
  .brand-marquee__track{
    animation:none !important;
    transform:none !important;
    flex-wrap:wrap;
    justify-content:center;
    width:auto;
    max-width:100%;
    margin:0 auto;
    padding:18px 12px 20px;
  }
  .brand-marquee__set--dup{ display:none !important; }
  .brand-marquee{
    mask-image:none;
    -webkit-mask-image:none;
  }
}
.brand-marquee__set{
  display:flex;
  align-items:center;
  gap:14px;
  flex:0 0 auto;
}
.brand-chip{
  --chip-a:rgba(11,99,246,.30);
  --chip-b:rgba(11,99,246,.08);

  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 18px;
  min-height:40px;
  border-radius:999px;
  font-weight:800;
  font-size:12px;
  letter-spacing:.04em;
  color:rgba(11,18,32,.88);
  border:1px solid color-mix(in srgb, var(--chip-a) 35%, rgba(11,18,32,.08));
  background:
    radial-gradient(140% 120% at 15% 0%, rgba(255,255,255,.98), transparent 52%),
    linear-gradient(165deg, rgba(255,255,255,.94), rgba(255,255,255,.72)),
    linear-gradient(135deg, color-mix(in srgb, var(--chip-a) 8%, transparent), color-mix(in srgb, var(--chip-b) 6%, transparent));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    0 10px 24px color-mix(in srgb, var(--chip-a) 14%, rgba(15,23,42,.05));
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  white-space:nowrap;
  overflow:hidden;
  isolation:isolate;
}
.brand-marquee .brand-chip:nth-child(4n+1){
  --chip-a:rgba(11,99,246,.30);
  --chip-b:rgba(11,99,246,.08);
}
.brand-marquee .brand-chip:nth-child(4n+2){
  --chip-a:rgba(13,148,136,.28);
  --chip-b:rgba(13,148,136,.07);
}
.brand-marquee .brand-chip:nth-child(4n+3){
  --chip-a:rgba(124,58,237,.28);
  --chip-b:rgba(124,58,237,.08);
}
.brand-marquee .brand-chip:nth-child(4n+4){
  --chip-a:rgba(34,197,94,.28);
  --chip-b:rgba(34,197,94,.07);
}
.brand-chip::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.78);
  pointer-events:none;
  z-index:0;
}
.brand-chip:hover{
  transform:translateY(-2px) scale(1.02);
  border-color:color-mix(in srgb, var(--chip-a) 55%, rgba(11,18,32,.12));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    0 14px 32px color-mix(in srgb, var(--chip-a) 22%, rgba(15,23,42,.08));
}
@supports not (color: color-mix(in srgb, red, blue)){
  .brand-chip{
    border:1px solid rgba(11,18,32,.10);
    background:
      radial-gradient(140% 120% at 15% 0%, rgba(255,255,255,.98), transparent 52%),
      linear-gradient(165deg, rgba(255,255,255,.94), rgba(255,255,255,.72));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.95), 0 10px 22px rgba(15,23,42,.07);
  }
  .brand-marquee .brand-chip:nth-child(4n+1){ border-color:rgba(11,99,246,.22); }
  .brand-marquee .brand-chip:nth-child(4n+2){ border-color:rgba(13,148,136,.20); }
  .brand-marquee .brand-chip:nth-child(4n+3){ border-color:rgba(124,58,237,.22); }
  .brand-marquee .brand-chip:nth-child(4n+4){ border-color:rgba(34,197,94,.20); }
  .brand-chip:hover{
    border-color:rgba(11,99,246,.28);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.98), 0 14px 32px rgba(11,99,246,.12);
  }
}

.cta-banner{
  margin-top:18px;
  padding:16px 16px;
  border-radius:var(--radius);
  border:1px solid rgba(11,18,32,.10);
  background:
    radial-gradient(120% 120% at 15% 0%, rgba(96,165,250,.16), transparent 52%),
    radial-gradient(100% 100% at 90% 10%, rgba(34,197,94,.12), transparent 52%),
    rgba(255,255,255,.78);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.cta-title{font-weight:900; font-size:16px}
.cta-compact{margin-top:14px}

.issue-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:14px;
}
.issue{
  padding:16px 16px;
  border-radius:var(--radius);
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.78);
  box-shadow:0 14px 32px rgba(15,23,42,.08);
}
.issue-title{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:900;
  letter-spacing:-.2px;
}
.issue-list{
  margin:12px 0 0;
  padding-left:18px;
  color:var(--muted);
}
.issue-list li{margin:6px 0}

.coverage-card{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:16px;
  align-items:stretch;
  position:relative;
  z-index:1;
}
.coverage-left,
.coverage-right{
  padding:clamp(16px, 2.2vw, 20px);
  border-radius:calc(var(--radius) + 4px);
  border:1px solid rgba(11,18,32,.08);
  background:
    radial-gradient(120% 100% at 12% 0%, rgba(96,165,250,.10), transparent 52%),
    radial-gradient(100% 90% at 100% 0%, rgba(34,197,94,.07), transparent 48%),
    rgba(255,255,255,.62);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.92),
    0 10px 28px rgba(15,23,42,.04);
}
.coverage-visual{
  margin:0 0 12px;
  border-radius:calc(var(--radius) + 2px);
  overflow:hidden;
  border:1px solid rgba(11,18,32,.08);
  background:rgba(11,18,32,.04);
}
.coverage-visual img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16 / 9;
  object-fit:cover;
}
.coverage-photo-credit{
  margin:0;
  padding:8px 10px;
  font-size:11px;
  line-height:1.35;
  color:rgba(11,18,32,.55);
  background:rgba(255,255,255,.72);
  border-top:1px solid rgba(11,18,32,.06);
}
.coverage-photo-credit a{
  color:inherit;
  text-decoration:underline;
  text-underline-offset:2px;
}
.coverage-photo-credit a:hover{color:rgba(11,18,32,.78)}
.coverage-left .chips-tight{margin-top:0}
.chips-tight{margin-top:12px}
.chips-tight .chip{padding:9px 11px}
.doc{display:grid; gap:10px}
.doc-title{font-weight:900; font-size:16px; letter-spacing:-.2px}
.doc-sub{
  margin:0;
  max-width:54ch;
}
.doc-badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding-top:2px;
}
.doc-badge{
  display:inline-flex;
  align-items:center;
  padding:7px 10px;
  border-radius:999px;
  border:1px solid rgba(11,18,32,.10);
  background:
    radial-gradient(120% 140% at 15% 10%, rgba(255,255,255,.74), transparent 55%),
    rgba(255,255,255,.70);
  font-weight:900;
  font-size:12px;
  color:rgba(11,18,32,.80);
}
.doc-badge:nth-child(1){ border-color:rgba(11,99,246,.18); }
.doc-badge:nth-child(2){ border-color:rgba(34,197,94,.18); }
.doc-points{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:8px;
  color:var(--muted);
}
.doc-points li{
  display:flex;
  gap:10px;
  line-height:1.45;
  font-size:13px;
}
.doc-points li::before{
  content:"";
  width:18px; height:18px;
  border-radius:999px;
  margin-top:1px;
  flex:0 0 auto;
  background:
    radial-gradient(120% 120% at 25% 20%, rgba(255,255,255,.75), transparent 58%),
    linear-gradient(135deg, rgba(11,99,246,.92), rgba(34,197,94,.88));
  box-shadow:0 10px 20px rgba(11,99,246,.10);
}
.doc-points strong{color:rgba(11,18,32,.88)}
.coverage-right .btn.btn-primary{
  width:100%;
  justify-content:center;
}

.price-table{
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid rgba(11,18,32,.10);
  background:
    radial-gradient(120% 140% at 18% 0%, rgba(96,165,250,.10), transparent 55%),
    rgba(255,255,255,.82);
  box-shadow:0 16px 40px rgba(15,23,42,.10);
}
.price-table{
  position:relative;
}
.price-table::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(700px 260px at 20% 0%, rgba(11,99,246,.06), transparent 60%),
    radial-gradient(700px 260px at 90% 30%, rgba(34,197,94,.05), transparent 62%);
  pointer-events:none;
}
.price-row{
  display:grid;
  grid-template-columns: 1.2fr .5fr 1fr;
  gap:0;
  position:relative;
}
.price-cell{
  padding:14px 14px;
  border-bottom:1px solid rgba(11,18,32,.08);
  font-size:13px;
  background:rgba(255,255,255,.0);
}
.price-row .price-cell:nth-child(2){
  text-align:right;
  font-variant-numeric: tabular-nums;
  font-weight:900;
}
.price-row .price-cell:nth-child(1){
  font-weight:800;
  letter-spacing:-.1px;
}
.price-row:nth-child(even):not(.price-head) .price-cell{background:rgba(11,18,32,.015)}
.price-head .price-cell{
  font-weight:900;
  background:
    radial-gradient(100% 140% at 20% 0%, rgba(255,255,255,.65), transparent 58%),
    rgba(11,18,32,.035);
  letter-spacing:.2px;
  text-transform:uppercase;
  font-size:11px;
  color:rgba(11,18,32,.72);
  position:sticky;
  top:var(--sticky-offset);
  z-index:2;
  backdrop-filter:saturate(140%) blur(10px);
}
.price-row:last-child .price-cell{border-bottom:none}
.price-row:not(.price-head):hover .price-cell{
  background:rgba(11,99,246,.045);
}

.reviews{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:14px;
  align-items:stretch;
}
.review{
  margin:0;
  padding:18px 18px;
  border-radius:var(--radius);
  border:1px solid rgba(11,18,32,.10);
  background:
    radial-gradient(120% 140% at 18% 0%, rgba(96,165,250,.09), transparent 56%),
    rgba(255,255,255,.82);
  box-shadow:0 16px 40px rgba(15,23,42,.10);
  position:relative;
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height: 210px;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  text-align:center;
}
.review:hover{
  transform:translateY(-2px);
  border-color:rgba(11,18,32,.14);
  box-shadow:0 20px 52px rgba(15,23,42,.12);
}
.review blockquote{margin:0; color:rgba(11,18,32,.86)}
.review blockquote{
  font-size:14.5px;
  line-height:1.65;
  letter-spacing:.02px;
  max-width:46ch;
  margin-left:auto;
  margin-right:auto;
  position:relative;
}
.review blockquote::before{
  content:"“";
  position:absolute;
  left:-6px;
  top:-10px;
  font-size:32px;
  line-height:1;
  color:rgba(11,99,246,.20);
}
.review blockquote::after{
  content:"”";
  position:absolute;
  right:-6px;
  bottom:-16px;
  font-size:32px;
  line-height:1;
  color:rgba(34,197,94,.16);
}
.review figcaption{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-top:auto;
  align-items:center;
  justify-content:center;
  flex-wrap:nowrap;
  padding-top:10px;
}
.who{font-weight:900}

.review::before{
  content:none;
}
.review figcaption::before{
  content:none;
}
.review figcaption .who{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(11,18,32,.10);
  background:
    radial-gradient(120% 140% at 15% 10%, rgba(255,255,255,.72), transparent 55%),
    rgba(255,255,255,.72);
  box-shadow:0 12px 24px rgba(15,23,42,.08);
  letter-spacing:-.1px;
}
.review figcaption .muted{
  display:inline-flex;
  align-items:center;
  padding:7px 11px;
  border-radius:999px;
  border:1px solid rgba(11,18,32,.08);
  background:rgba(11,18,32,.03);
  color:rgba(11,18,32,.62);
  font-size:12px;
  line-height:1.2;
}
.review figcaption::before{
  content:"";
  width:54px;
  height:1px;
  background:linear-gradient(90deg, rgba(11,99,246,.22), rgba(34,197,94,.18));
  border-radius:999px;
  opacity:.85;
  margin:2px 0 6px;
}

.faq{
  display:grid;
  gap:10px;
}
.faq-item{
  border-radius:var(--radius);
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.78);
  padding:0;
  overflow:hidden;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
  position:relative;
}
.faq-item:hover{
  border-color:rgba(11,18,32,.14);
  box-shadow:0 14px 32px rgba(15,23,42,.08);
}
.faq-item summary{
  cursor:pointer;
  font-weight:900;
  list-style:none;
  padding:16px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  position:relative;
  user-select:none;
  transition:background .18s ease;
}
.faq-item summary .muted{
  font-weight:700;
}
.faq-item summary:hover{
  background:rgba(11,18,32,.025);
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{
  content:"";
  width:10px;
  height:10px;
  border-right:2px solid rgba(11,18,32,.55);
  border-bottom:2px solid rgba(11,18,32,.55);
  transform:rotate(45deg);
  transition:transform .18s ease, border-color .18s ease;
  flex:0 0 auto;
  margin-left:auto;
}
.faq-item[open] summary{
  background:rgba(11,99,246,.04);
}
.faq-item[open]{
  border-color:rgba(11,99,246,.18);
  box-shadow:0 18px 44px rgba(15,23,42,.10);
}
.faq-item[open] summary::after{
  transform:rotate(225deg);
  border-color:rgba(11,99,246,.75);
}
.faq-item summary:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(11,99,246,.16);
  border-radius:14px;
  margin:8px;
}
.faq-body{
  padding:0 16px 16px;
}

.section-contacts{padding-bottom:64px}
.contacts-grid{
  display:grid;
  grid-template-columns: .95fr 1.05fr;
  gap:14px;
}
.contacts-card, .map-card{
  border-radius:var(--radius);
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.78);
  padding:18px 18px;
  box-shadow:0 14px 32px rgba(15,23,42,.10);
}
.contact-lines{display:grid; gap:12px; padding:8px 0 10px}
.contact-line{display:grid; gap:6px}
.contacts-actions{display:flex; gap:12px; flex-wrap:wrap; padding-top:8px}
.map-card{
  padding:0;
  overflow:hidden;
  display:flex;
}
.map-placeholder{
  min-height:360px;
  padding:22px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:6px;
  background:
    radial-gradient(85% 70% at 25% 35%, rgba(96,165,250,.20), transparent 62%),
    radial-gradient(85% 80% at 70% 30%, rgba(34,197,94,.12), transparent 62%),
    linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
}
.map-embed{
  width:100%;
  min-height:360px;
  flex:1 1 auto;
  position:relative;
  background:
    radial-gradient(85% 70% at 25% 35%, rgba(96,165,250,.10), transparent 62%),
    radial-gradient(85% 80% at 70% 30%, rgba(34,197,94,.08), transparent 62%),
    rgba(255,255,255,.72);
}
.map-embed iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  display:block;
}

/* Coverage: right panel polish */
.coverage-right .doc{
  padding:14px 14px;
  border-radius:calc(var(--radius) - 2px);
  border:1px solid rgba(11,18,32,.10);
  background:
    radial-gradient(120% 140% at 20% 10%, rgba(255,255,255,.92), transparent 55%),
    rgba(255,255,255,.70);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.92), 0 12px 28px rgba(15,23,42,.06);
}
.coverage-right .doc-title{font-size:17px}
.coverage-right .doc-sub{margin-top:-2px}
.coverage-right .doc-badges{padding-top:0}
.coverage-right .doc-badge{
  padding:7px 10px;
  border-radius:14px;
  font-weight:900;
}
.coverage-right .doc-points{
  border-top:1px solid rgba(11,18,32,.08);
  padding-top:10px;
}

@media (max-width: 640px){
  .map-embed{min-height:280px}
  .coverage-right .doc{padding:12px}
}

.site-footer{
  border-top:1px solid rgba(11,18,32,.08);
  background:
    radial-gradient(900px 420px at 15% 0%, rgba(96,165,250,.14), transparent 60%),
    radial-gradient(820px 420px at 95% 15%, rgba(34,197,94,.10), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.35) 0%, rgba(255,255,255,.70) 55%, rgba(255,255,255,.92) 100%);
}
.footer-card{
  margin:18px 0 22px;
  border-radius:22px;
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.78);
  backdrop-filter:saturate(140%) blur(14px);
  box-shadow:0 18px 44px rgba(15,23,42,.10);
  overflow:hidden;
}
.footer-logo{
  height:44px;
  width:auto;
  display:block;
  filter: drop-shadow(0 12px 22px rgba(15,23,42,.10));
}
.footer-grid{
  display:grid;
  grid-template-columns: 1.3fr .8fr .9fr 1.0fr;
  gap:16px;
  padding:18px;
}
.footer-col{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.footer-title{
  font-weight:900;
  letter-spacing:-.2px;
  font-size:13px;
  color:rgba(11,18,32,.88);
}
.footer-note{
  margin:0;
  font-size:13px;
  line-height:1.55;
  color:rgba(11,18,32,.70);
}
.footer-links{
  display:grid;
  gap:8px;
}
.footer-links a{
  text-decoration:none;
  color:rgba(11,18,32,.74);
  font-weight:700;
  font-size:13px;
  padding:6px 8px;
  border-radius:12px;
  width:fit-content;
  transition:background .15s ease, color .15s ease, transform .15s ease;
}
.footer-links a:hover{
  background:rgba(11,18,32,.04);
  color:rgba(11,18,32,.92);
  transform:translateY(-1px);
}
.footer-contacts{
  display:grid;
  gap:10px;
}
.footer-contact{
  display:grid;
  gap:4px;
  font-size:13px;
  color:rgba(11,18,32,.84);
}
.footer-social{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.footer-social a{
  width:34px;
  height:34px;
  border-radius:12px;
  display:grid;
  place-items:center;
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.72);
  color:rgba(11,18,32,.84);
  box-shadow:0 10px 22px rgba(15,23,42,.06);
}
.footer-social a:hover{
  background:rgba(255,255,255,.88);
  color:rgba(11,18,32,.92);
  transform:translateY(-1px);
}
.footer-social .i{width:18px; height:18px}
.footer-phone{
  text-decoration:none;
  font-weight:900;
  letter-spacing:.2px;
  font-size:16px;
  width:fit-content;
}
.footer-phone:hover{text-decoration:underline}
.footer-badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding-top:2px;
}
.footer-badge{
  font-size:12px;
  font-weight:800;
  color:rgba(11,18,32,.74);
  border:1px solid rgba(11,18,32,.10);
  background:
    radial-gradient(120% 140% at 15% 10%, rgba(255,255,255,.62), transparent 55%),
    rgba(255,255,255,.70);
  padding:8px 10px;
  border-radius:999px;
}
.footer-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  padding-top:2px;
}
.footer-legal-note{
  padding-top:2px;
  color:rgba(11,18,32,.62);
}
.footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 18px;
  border-top:1px solid rgba(11,18,32,.08);
  background:rgba(255,255,255,.72);
}
.footer-bottom-links{
  display:flex;
  align-items:center;
  gap:10px;
}
.footer-bottom a{ text-decoration:none }
.footer-bottom a:hover{ text-decoration:underline }

.modal{
  position:fixed;
  inset:0;
  display:none;
  z-index:200;
}
.modal[aria-hidden="false"]{display:block}
.modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.55);
}
.modal-card{
  position:relative;
  width:min(720px, calc(100% - 30px));
  margin: min(12vh, 90px) auto 0;
  border-radius:22px;
  border:1px solid rgba(11,18,32,.12);
  background:rgba(255,255,255,.94);
  backdrop-filter:saturate(140%) blur(14px);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.modal-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:18px 18px 14px;
  border-bottom:1px solid rgba(11,18,32,.10);
}
.modal-title{font-weight:900; font-size:18px; letter-spacing:-.2px}
.modal-body{padding:16px 18px 18px}

.form{padding:16px 18px 18px}
.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.field{display:grid; gap:6px}
.field-full{grid-column:1 / -1}
.field-label{font-size:12px; color:var(--muted2); font-weight:800}
.field-hint{font-size:11px; color:var(--muted2)}
input, textarea{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(11,18,32,.14);
  background:rgba(255,255,255,.86);
  color:var(--text);
  outline:none;
}
input:focus, textarea:focus{
  border-color:rgba(96,165,250,.55);
  box-shadow:0 0 0 4px rgba(96,165,250,.14);
}
textarea{resize:vertical; min-height:96px}

.form-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  padding-top:14px;
}
.form-note{
  margin-top:12px;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.86);
  display:none;
}
.form-note.is-ok{
  display:block;
  border-color:rgba(34,197,94,.35);
  background:rgba(34,197,94,.08);
}
.form-note.is-err{
  display:block;
  border-color:rgba(251,113,133,.35);
  background:rgba(251,113,133,.08);
}

@media (max-width: 980px){
  .nav{display:none}
  .brand{min-width:unset}
  .brand-logo{height:48px}
  .header-phone{display:none}
  .site-header{
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    background:rgba(247,248,252,.96);
  }
  .hero-grid{grid-template-columns:1fr; gap:18px}
  .social-proof-links{grid-template-columns:1fr}
  .cards{grid-template-columns:repeat(2, minmax(0, 1fr))}
  .reviews{grid-template-columns:repeat(2, minmax(0, 1fr))}
  .contacts-grid{grid-template-columns:1fr}
  .steps{grid-template-columns:repeat(2, minmax(0, 1fr))}
  .steps--process{grid-template-columns:1fr}
  .issue-grid{grid-template-columns:1fr}
  .coverage-card{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}

/* Icons */
.i{width:22px; height:22px; display:block}
.i-flame{color:#fb923c}
.is-flicker{
  transform-origin:50% 80%;
  animation: flameFlicker 1.4s ease-in-out infinite;
  filter: drop-shadow(0 6px 12px rgba(251,146,60,.28));
}
@keyframes flameFlicker{
  0%{transform:translateY(0) scale(1) rotate(-1deg); opacity:.95}
  35%{transform:translateY(-1px) scale(1.04) rotate(1deg); opacity:1}
  70%{transform:translateY(0) scale(.98) rotate(-.5deg); opacity:.92}
  100%{transform:translateY(0) scale(1) rotate(-1deg); opacity:.95}
}

/* Mobile tabbar */
.tabbar{
  position:fixed;
  left:0; right:0; bottom:0;
  z-index:120;
  display:none;
  height:100px;
  padding:
    10px
    max(12px, env(safe-area-inset-right, 0px))
    calc(10px + env(safe-area-inset-bottom, 0px))
    max(12px, env(safe-area-inset-left, 0px));
  background:transparent;
}
.tabbar-shell{
  position:relative;
  height:100%;
  display:grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items:end;
  gap:6px;
  padding:12px 10px 10px;
  border-radius:24px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(11,18,32,.10);
  box-shadow:0 18px 40px rgba(15,23,42,.14);
  backdrop-filter:saturate(140%) blur(14px);
}
.tabbar-shell::before{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  width:66px;
  height:14px;
  transform:translateX(-50%) translateY(-1px);
  background:rgba(255,255,255,.92);
  border:1px solid rgba(11,18,32,.10);
  border-bottom:none;
  border-top-left-radius:18px;
  border-top-right-radius:18px;
  filter: drop-shadow(0 10px 20px rgba(15,23,42,.08));
}
.tabbar-item{
  border:none;
  background:transparent;
  text-decoration:none;
  color:rgba(11,18,32,.72);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  font-weight:900;
  font-size:11px;
  padding:8px 6px;
  border-radius:16px;
  cursor:pointer;
  min-width:0;
  transition: background .15s ease, color .15s ease, transform .15s ease;
  position:relative;
}
.tabbar-ico{
  width:22px; height:22px;
  display:block;
  color:rgba(11,18,32,.70);
}
.tabbar-ico-write{color:#0b63f6}
.tabbar-ico{stroke:currentColor}
.tabbar-item:hover{background:rgba(11,18,32,.04)}
.tabbar-item.is-active{
  color:rgba(11,18,32,.92);
  background:rgba(96,165,250,.10);
}
.tabbar-item.is-active .tabbar-ico{color:rgba(96,165,250,.95)}

.tabbar-fab{
  position:relative;
  display:grid;
  place-items:center;
  width:64px;
  height:64px;
  border-radius:999px;
  margin:0 auto;
  transform:translateY(-22px);
  background:#0b63f6;
  box-shadow:0 18px 40px rgba(11,99,246,.28), 0 14px 28px rgba(15,23,42,.18);
  border:6px solid rgba(255,255,255,.92);
  text-decoration:none;
  isolation:isolate;
}
.tabbar-fab::before{
  content:"";
  position:absolute;
  inset:-10px;
  border-radius:999px;
  background:radial-gradient(closest-side, rgba(11,99,246,.28), transparent 70%);
  z-index:-1;
  animation: tabbarFabPulse 1.6s ease-in-out infinite;
}
.tabbar-fab::after{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius:999px;
  border:2px solid rgba(11,99,246,.35);
  z-index:-1;
  animation: tabbarFabRing 1.6s ease-out infinite;
}
.tabbar-fab-ico{
  width:28px;
  height:28px;
  color:white;
  transform-origin:50% 50%;
  animation: tabbarPhoneWiggle 2.6s ease-in-out infinite;
}
.tabbar-fab-ico{stroke:currentColor}
.tabbar-fab:active{transform:translateY(-21px)}

@keyframes tabbarFabPulse{
  0%, 100%{transform:scale(1); opacity:.65}
  50%{transform:scale(1.08); opacity:.95}
}
@keyframes tabbarFabRing{
  0%{transform:scale(.88); opacity:.0}
  20%{opacity:.55}
  55%{transform:scale(1.28); opacity:0}
  100%{transform:scale(1.28); opacity:0}
}
@keyframes tabbarPhoneWiggle{
  0%, 72%, 100%{transform:rotate(0deg)}
  76%{transform:rotate(-10deg)}
  80%{transform:rotate(10deg)}
  84%{transform:rotate(-8deg)}
  88%{transform:rotate(8deg)}
  92%{transform:rotate(0deg)}
}

/* --- Global polish pass (safe visual unification) --- */
:where(
  .media-card,
  .svc-card,
  .issue,
  .review,
  .faq-item,
  .contacts-card,
  .map-card,
  .coverage-left,
  .coverage-right,
  .feature,
  .floating-note,
  .cta-banner,
  .price-table
){
  border-color:rgba(11,18,32,.09);
  box-shadow:0 14px 34px rgba(15,23,42,.09);
}

:where(.section-head .h2, .doc-title, .cta-title, .step-title){
  letter-spacing:-.25px;
}

#services .panel-value{
  color:rgba(11,99,246,.9);
}
#services .svc-list li::marker{
  color:rgba(11,99,246,.68);
}

@media (hover: hover) and (pointer: fine){
  :where(.svc-card, .issue, .review, .contacts-card, .map-card, .feature, .floating-note, .cta-banner){
    transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  }
  :where(.svc-card, .issue, .review, .contacts-card, .map-card, .feature, .floating-note, .cta-banner):hover{
    transform:translateY(-3px);
    box-shadow:0 20px 46px rgba(15,23,42,.12);
    border-color:rgba(11,18,32,.15);
  }
}

@media (max-width: 980px){
  .tabbar{
    display:block;
  }
  body{padding-bottom:calc(100px + env(safe-area-inset-bottom, 0px))}
}
@media (max-width: 640px){
  .container{padding:0 14px}
  /* Mobile header spacing like: padding: 10px 14px */
  .container.header-inner{padding:10px 14px}
  .hero{padding:44px 0 26px}
  .social-proof{padding-top:18px; padding-bottom:8px}
  .social-boost{
    border-radius:16px;
    padding:13px 14px;
  }
  .social-boost .i{
    width:24px;
    height:24px;
  }
  .social-boost span{font-size:15px}
  .hero-cta{display:grid; grid-template-columns:1fr; gap:10px}
  .hero-cta .btn, .hero-cta a{width:100%}
  .trust-row{grid-template-columns:1fr; gap:10px}
  .cards{grid-template-columns:1fr}
  .grid-2{grid-template-columns:1fr}
  .reviews{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .issue-grid{grid-template-columns:1fr}
  .coverage-card{grid-template-columns:1fr}
  .price-row{grid-template-columns: 1fr .6fr}
  .price-row .price-cell:nth-child(2){text-align:left}
  .price-row .price-cell:nth-child(3){grid-column:1 / -1; padding-top:0}
  .price-head .price-cell:nth-child(3){display:none}
  .section-head{flex-direction:column; align-items:flex-start}
  .section-head{margin-bottom:14px}
  /* Reviews: centered on mobile */
  #reviews .section-head{
    align-items:center;
    text-align:center;
  }
  #reviews .section-head p{
    margin-left:auto;
    margin-right:auto;
  }
  .form-grid{grid-template-columns:1fr}
  .form-actions{
    flex-direction:column;
    align-items:stretch;
  }
  .form-actions .btn{
    width:100%;
  }
  .modal-card{margin: 9vh auto 0}
  .footer-grid{grid-template-columns:1fr; padding:16px}
  .footer-bottom{flex-direction:column; align-items:center; text-align:center}
  .footer-actions .btn{width:100%}
  .cta-banner{
    flex-direction:column;
    align-items:stretch;
  }
  .cta-banner .btn{width:100%}
}

/* Mobile UX polish pass */
@media (max-width: 640px){
  .section{
    padding:42px 0;
  }
  .h1{
    font-size:clamp(27px, 8.6vw, 34px);
    line-height:1.08;
    letter-spacing:-.6px;
  }
  .lead{
    font-size:15px;
  }
  .badge{
    padding:8px 10px;
    font-size:11.5px;
  }

  #services .svc-card{
    min-height:auto;
    border-radius:16px;
  }
  #services .svc-photo{
    min-height:98px;
  }
  #services .svc-body{
    padding:12px 12px 14px;
    gap:9px;
  }
  #services .svc-panel{
    padding:10px;
    border-radius:14px;
    gap:7px;
  }
  #services .svc-cta .btn{
    min-height:44px;
    font-size:13px;
  }

  .issue,
  .review,
  .contacts-card,
  .map-card,
  .faq-item{
    border-radius:16px;
  }
  .issue,
  .review{
    padding:14px;
  }
  .price-cell{
    padding:12px;
    font-size:12.5px;
  }
}

@media (prefers-reduced-motion: reduce){
  *{scroll-behavior:auto !important; transition:none !important; animation:none !important}
}

/* ==========================================================================
   Subpage system — shared styles for contacts.html, services.html,
   service detail pages, thank-you.html, 404.html
   ========================================================================== */

/* Small visual trail used at the top of every inner page */
.breadcrumbs{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  padding:18px 0 0;
  font-size:12.5px;
  color:var(--muted2);
}
.breadcrumbs a{
  color:var(--muted);
  text-decoration:none;
  padding:4px 8px;
  border-radius:8px;
  transition:background .18s ease, color .18s ease;
}
.breadcrumbs a:hover{
  background:rgba(11,18,32,.05);
  color:var(--text);
}
.breadcrumbs .sep{opacity:.55}
.breadcrumbs .current{
  color:var(--text);
  font-weight:700;
  padding:4px 8px;
}

/* Page hero — used by contacts, services overview, service detail, etc. */
.page-hero{
  position:relative;
  padding:28px 0 34px;
}
.page-hero-inner{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:28px;
  align-items:center;
}
.page-hero-copy{display:flex; flex-direction:column; gap:14px}
.page-hero-copy .h1{
  font-size:clamp(26px, 3.4vw, 38px);
  line-height:1.1;
  margin:4px 0 0;
  letter-spacing:-.6px;
}
.page-hero-copy .lead{margin:2px 0 0; max-width:58ch}
.page-hero-cta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  padding-top:4px;
}
.page-hero-media{
  border-radius:calc(var(--radius) + 4px);
  overflow:hidden;
  border:1px solid rgba(11,18,32,.10);
  background:
    radial-gradient(120% 140% at 10% 0%, rgba(255,255,255,.85), transparent 55%),
    rgba(255,255,255,.62);
  box-shadow:var(--shadow);
}
.page-hero-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  aspect-ratio: 16 / 10;
}

.page-hero-facts{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:10px;
  margin-top:8px;
}
.page-fact{
  padding:12px 12px;
  border-radius:14px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(11,18,32,.10);
  display:flex;
  align-items:center;
  gap:10px;
}
.page-fact .i{
  width:20px; height:20px;
  color:rgba(11,99,246,.90);
  flex:0 0 auto;
}
.page-fact-title{font-weight:900; font-size:13px}
.page-fact-sub{font-size:11.5px; color:var(--muted2); line-height:1.35}

/* Feature icon bubble used in subpages */
.feature-ico{
  width:42px;
  height:42px;
  border-radius:14px;
  display:grid;
  place-items:center;
  color:#fff;
  background:
    radial-gradient(120% 120% at 25% 20%, rgba(255,255,255,.55), transparent 55%),
    linear-gradient(135deg, rgba(11,99,246,.98), rgba(34,197,94,.90));
  box-shadow:0 10px 22px rgba(11,99,246,.18);
  margin-bottom:8px;
}
.feature-ico .i{width:22px; height:22px}

/* Services overview grid — uses existing svc-cards pattern, but with a link wrapper */
a.svc-card-link{
  text-decoration:none;
  color:inherit;
  display:block;
  border-radius:var(--radius);
}
a.svc-card-link:hover .svc-card{
  transform:translateY(-2px);
}
a.svc-card-link:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(11,99,246,.18);
  border-radius:calc(var(--radius) + 4px);
}
.svc-more{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:auto;
  font-weight:800;
  font-size:13px;
  color:rgba(11,99,246,.95);
}
.svc-more .i{width:14px; height:14px; transition:transform .2s ease}
a.svc-card-link:hover .svc-more .i{transform:translateX(3px)}
.svc-more-btn{
  margin-top:auto;
  width:100%;
  justify-content:center;
  min-height:44px;
  pointer-events:none; /* вся карточка уже кликабельна как ссылка */
}
a.svc-card-link:hover .svc-more-btn .btn-ico{transform:translateX(3px)}

/* Generic "info cards" row — benefits, steps, highlights on subpages */
.info-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
}
.info-card{
  padding:18px 18px;
  border-radius:var(--radius);
  border:1px solid rgba(11,18,32,.10);
  background:
    radial-gradient(120% 140% at 15% 0%, rgba(96,165,250,.08), transparent 55%),
    rgba(255,255,255,.80);
  box-shadow:0 12px 28px rgba(15,23,42,.06);
  display:flex;
  flex-direction:column;
  gap:6px;
}
.info-card .h3{font-size:16px}
.info-card .muted{font-size:13.5px}

/* Checklist used on service pages */
.check-list{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:10px;
}
.check-list li{
  display:flex;
  gap:10px;
  align-items:flex-start;
  font-size:14px;
  color:var(--muted);
  line-height:1.5;
}
.check-list li::before{
  content:"";
  width:20px; height:20px;
  border-radius:999px;
  flex:0 0 auto;
  margin-top:1px;
  background:
    radial-gradient(120% 120% at 25% 20%, rgba(255,255,255,.75), transparent 58%),
    linear-gradient(135deg, rgba(34,197,94,.95), rgba(11,99,246,.85));
  box-shadow:0 6px 14px rgba(34,197,94,.18);
  background-image:
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="m5 12 5 5L20 7" fill="none" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></svg>'),
    linear-gradient(135deg, rgba(34,197,94,.95), rgba(11,99,246,.85));
  background-size: 60% 60%, 100% 100%;
  background-repeat:no-repeat, no-repeat;
  background-position:center, center;
}

/* Two-column layout on service pages */
.svc-layout{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:clamp(18px, 2vw, 22px);
  align-items:start;
}
.svc-layout-main{
  padding:clamp(18px, 2.2vw, 24px);
  border-radius:calc(var(--radius) + 4px);
  border:1px solid rgba(11,18,32,.08);
  background:
    radial-gradient(120% 140% at 15% 0%, rgba(96,165,250,.07), transparent 55%),
    rgba(255,255,255,.80);
  box-shadow:0 14px 34px rgba(15,23,42,.06);
  display:grid;
  gap:18px;
}
.svc-layout-aside{
  position:sticky;
  top:calc(var(--sticky-offset) + 10px);
  display:grid;
  gap:14px;
}
.svc-aside-card{
  padding:18px 18px;
  border-radius:var(--radius);
  border:1px solid rgba(11,18,32,.10);
  background:
    radial-gradient(120% 140% at 85% 0%, rgba(34,197,94,.10), transparent 55%),
    rgba(255,255,255,.80);
  box-shadow:0 14px 32px rgba(15,23,42,.08);
  display:grid;
  gap:12px;
}
.svc-aside-title{font-weight:900; font-size:16px; letter-spacing:-.2px}
.svc-aside-price{
  display:flex;
  align-items:baseline;
  gap:8px;
}
.svc-aside-price .big{
  font-size:28px;
  font-weight:900;
  letter-spacing:-.5px;
  color:rgba(11,99,246,.98);
}
.svc-aside-price .small{font-size:13px; color:var(--muted2)}
.svc-aside-actions{
  display:grid;
  gap:8px;
}
.svc-aside-actions .btn{justify-content:center; width:100%}

/* Symptom grid on service pages */
.symptoms{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:10px;
}
.symptom{
  padding:12px;
  border-radius:14px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(11,18,32,.10);
  font-size:13px;
  color:var(--muted);
  display:flex;
  gap:8px;
  align-items:flex-start;
  line-height:1.4;
}
.symptom-dot{
  width:8px; height:8px;
  border-radius:999px;
  background:linear-gradient(135deg, rgba(251,146,60,.95), rgba(251,113,133,.9));
  flex:0 0 auto;
  margin-top:6px;
  box-shadow:0 4px 10px rgba(251,113,133,.25);
}

/* Contact page: compact information tiles */
.info-tiles{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}
.info-tile{
  padding:16px;
  border-radius:16px;
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.80);
  display:flex;
  gap:12px;
  align-items:center;
}
.info-tile .feature-ico{
  margin-bottom:0;
  width:38px; height:38px;
  border-radius:12px;
  flex:0 0 38px;
}
.info-tile .feature-ico .i{width:19px; height:19px}
.info-tile-body{display:grid; gap:2px; min-width:0}
.info-tile-value{word-break:break-word; hyphens:auto}
.info-tile-label{font-size:12px; color:var(--muted2); font-weight:700}
.info-tile-value{font-weight:800; font-size:15px; letter-spacing:-.1px}
.info-tile-value a{text-decoration:none}

/* Status pages (thank-you / 404): big centered card */
.status-wrap{
  min-height:calc(100dvh - 200px);
  display:grid;
  place-items:center;
  padding:28px 0 48px;
}
.status-card{
  width:100%;
  max-width:760px;
  margin:0 auto;
  padding:clamp(22px, 3vw, 34px);
  border-radius:calc(var(--radius) + 6px);
  border:1px solid rgba(11,18,32,.10);
  background:
    radial-gradient(120% 140% at 15% 0%, rgba(96,165,250,.14), transparent 55%),
    radial-gradient(100% 100% at 90% 0%, rgba(34,197,94,.12), transparent 55%),
    rgba(255,255,255,.84);
  box-shadow:0 30px 60px rgba(15,23,42,.14);
  text-align:center;
}
.status-ico{
  width:72px;
  height:72px;
  margin:0 auto 14px;
  border-radius:999px;
  display:grid;
  place-items:center;
  color:#fff;
  background:
    radial-gradient(120% 120% at 25% 20%, rgba(255,255,255,.55), transparent 55%),
    linear-gradient(135deg, rgba(34,197,94,.98), rgba(11,99,246,.88));
  box-shadow:0 18px 38px rgba(34,197,94,.28);
}
.status-ico.is-error{
  background:
    radial-gradient(120% 120% at 25% 20%, rgba(255,255,255,.55), transparent 55%),
    linear-gradient(135deg, rgba(251,113,133,.98), rgba(251,146,60,.88));
  box-shadow:0 18px 38px rgba(251,113,133,.28);
}
.status-ico .i{width:36px; height:36px}
.status-title{
  font-size:clamp(24px, 3vw, 32px);
  line-height:1.15;
  letter-spacing:-.5px;
  margin:0 0 8px;
  font-weight:900;
}
.status-sub{
  color:var(--muted);
  margin:0 auto;
  max-width:52ch;
  font-size:15px;
}
.status-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:center;
  padding-top:18px;
}
.status-actions .btn{min-width:180px}
.status-note{
  margin-top:22px;
  padding-top:18px;
  border-top:1px dashed rgba(11,18,32,.12);
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
  text-align:left;
}
.status-note .info-tile{padding:12px; border-radius:14px}
.status-extra{
  margin-top:18px;
  font-size:12.5px;
  color:var(--muted2);
}

/* Services.html: section with benefit callouts */
.svc-benefits{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:12px;
  margin-top:16px;
}
.svc-benefit{
  padding:14px;
  border-radius:14px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(11,18,32,.10);
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.svc-benefit .feature-ico{width:36px; height:36px; border-radius:12px; margin-bottom:0}
.svc-benefit .feature-ico .i{width:18px; height:18px}
.svc-benefit-title{font-weight:900; font-size:13.5px; letter-spacing:-.1px}
.svc-benefit-sub{font-size:12px; color:var(--muted2); line-height:1.35; margin-top:2px}

/* Tabbar active state via body class */
body.is-page-services .tabbar [data-tab="services"],
body.is-page-contacts .tabbar [data-tab="contacts"],
body.is-page-home .tabbar [data-tab="top"]{
  color:var(--text);
}

/* Responsive */
@media (max-width: 900px){
  .page-hero-inner{grid-template-columns:1fr}
  .svc-layout{grid-template-columns:1fr}
  .svc-layout-aside{position:static}
  .info-grid{grid-template-columns:1fr 1fr}
  .svc-benefits{grid-template-columns:1fr 1fr}
  .symptoms{grid-template-columns:1fr 1fr}
  .status-note{grid-template-columns:1fr}
  .info-tiles{grid-template-columns:1fr}
  .page-hero-facts{grid-template-columns:1fr 1fr}
}
@media (max-width: 560px){
  .info-grid{grid-template-columns:1fr}
  .svc-benefits{grid-template-columns:1fr}
  .symptoms{grid-template-columns:1fr}
  .page-hero-facts{grid-template-columns:1fr}
  .status-actions .btn{width:100%; min-width:0}
}