/* ==========================================================================
   911 — Служба порятунку побутової техніки
   Navy = довіра → Yellow = дія → White = простір → Blue = навігація (ТЗ п.1)
   Mobile first. Без бібліотек.
   ========================================================================== */

@font-face{font-family:"Onest";src:url(../fonts/Onest-cyrillic.woff2) format("woff2");font-weight:400 800;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";src:url(../fonts/Onest-latin.woff2) format("woff2");font-weight:400 800;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Caveat";src:url(../fonts/Caveat-cyrillic.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Caveat";src:url(../fonts/Caveat-latin.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F}

:root{
	--navy:#0B1F4B;
	--navy-2:#13306E;
	--navy-3:#071633;
	--yellow:#FFD21F;
	--yellow-2:#FFC300;
	--yellow-soft:#FFF6CC;
	--blue:#1D5FD6;
	--blue-soft:#EAF1FD;
	--ink:#0B1F4B;
	--text:#3A4868;
	--muted:#5F6E8C;
	--line:#E2E8F2;
	--soft:#F4F7FC;
	--white:#fff;
	--on-navy:rgba(255,255,255,.76);
	--line-navy:rgba(255,255,255,.12);

	--r-sm:10px;
	--r:16px;
	--r-lg:22px;
	--r-xl:32px;
	--shadow-sm:0 1px 2px rgba(11,31,75,.06),0 2px 8px -2px rgba(11,31,75,.08);
	--shadow:0 1px 2px rgba(11,31,75,.05),0 14px 36px -12px rgba(11,31,75,.18);
	--shadow-lg:0 30px 70px -24px rgba(7,22,51,.45);

	--font:"Onest",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
	--hand:"Caveat","Segoe Print",cursive;
	--wrap:1240px;
	--gut:16px;
	--hdr-h:72px;
	--sec:clamp(64px,9vw,120px);
	--ease:cubic-bezier(.2,.7,.2,1);
}
@media (min-width:760px){:root{--gut:32px;--hdr-h:84px}}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr-h) + 16px)}
body{margin:0;font:400 16px/1.6 var(--font);color:var(--text);background:var(--white);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img,svg,video{max-width:100%;height:auto;display:block}
[hidden]{display:none!important}
a{color:var(--blue);text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer}
h1,h2,h3,h4{margin:0;color:var(--ink);font-weight:800;line-height:1.1;letter-spacing:-.025em;text-wrap:balance}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
em{font-style:normal}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--yellow);color:var(--navy);padding:10px 16px;border-radius:10px;font-weight:700}
.skip:focus{top:12px}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

.wrap{width:100%;max-width:calc(var(--wrap) + var(--gut) * 2);margin-inline:auto;padding-inline:var(--gut)}
.ic{width:24px;height:24px;flex:none}

/* ---------- типографіка секцій ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:12px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:16px}
.eyebrow::before{content:"";width:28px;height:3px;border-radius:3px;background:var(--yellow);flex:none}
.eyebrow--inv{color:var(--yellow)}
.shead{max-width:640px;margin-bottom:clamp(32px,4vw,48px)}
.shead--center{margin-inline:auto;text-align:center}
.shead--center .eyebrow{justify-content:center}
.shead__title{font-size:clamp(32px,4.6vw,52px)}
.shead__title em{color:var(--blue)}
.shead__sub{margin-top:14px;font-size:clamp(16px,1.6vw,18px);color:var(--muted);max-width:52ch}
.shead--center .shead__sub{margin-inline:auto}
.scribble{font-family:var(--hand);font-weight:600;line-height:.95;color:var(--navy);transform:rotate(-7deg);pointer-events:none}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#22C55E;box-shadow:0 0 0 0 rgba(34,197,94,.5);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 8px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
.link-more{display:inline-flex;align-items:center;gap:8px;font-weight:700;margin-top:24px}
.link-more .ic{width:20px;height:20px;transition:transform .25s var(--ease)}
.link-more:hover .ic{transform:translateX(4px)}

/* ---------- кнопки ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 22px;border:0;border-radius:14px;font-size:16px;font-weight:700;line-height:1.1;letter-spacing:-.01em;text-decoration:none;white-space:nowrap;transition:background-color .2s,box-shadow .25s,transform .2s var(--ease),border-color .2s,color .2s}
.btn:active{transform:translateY(1px) scale(.99)}
.btn .ic{width:22px;height:22px}
.btn--sm{min-height:46px;padding:0 18px;font-size:15px;border-radius:12px}
.btn--lg{min-height:62px;padding:0 26px;font-size:17px;border-radius:16px}
.btn--block{display:flex;width:100%}
.btn--call{background:var(--yellow);color:var(--navy);box-shadow:0 12px 28px -12px rgba(255,195,0,.75),inset 0 -2px 0 rgba(0,0,0,.08);text-transform:uppercase;letter-spacing:.01em}
.btn--call:hover{background:var(--yellow-2);box-shadow:0 16px 34px -12px rgba(255,195,0,.9),inset 0 -2px 0 rgba(0,0,0,.08)}
.btn--call .btn__arrow{margin-left:4px;width:32px;height:32px;padding:6px;border-radius:10px;background:var(--navy);color:var(--yellow);transition:transform .25s var(--ease)}
.btn--sm.btn--call .btn__arrow{width:26px;height:26px;padding:5px;border-radius:8px}
.btn--call:hover .btn__arrow{transform:translateX(3px)}
.btn--call:hover .btn__bell{animation:ring .6s var(--ease)}
@keyframes ring{20%{transform:rotate(16deg)}40%{transform:rotate(-12deg)}60%{transform:rotate(8deg)}80%{transform:rotate(-4deg)}}
.btn--ghost{background:var(--white);color:var(--navy);box-shadow:inset 0 0 0 1.5px var(--navy)}
.btn--ghost:hover{background:var(--navy);color:var(--white)}
.btn--ghost-inv{background:transparent;color:var(--white);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35)}
.btn--ghost-inv:hover{background:var(--white);color:var(--navy);box-shadow:inset 0 0 0 1.5px var(--white)}

/* ---------- лого ---------- */
.logo{display:inline-flex;align-items:center;gap:10px;color:var(--navy);text-decoration:none;flex:none}
.logo__img{height:52px;width:auto}
.logo__mark{position:relative;display:inline-flex;align-items:center;padding-left:18px;height:40px}
.logo__mark i{position:absolute;left:0;height:4px;border-radius:4px;background:var(--yellow);transform:skewX(-20deg)}
.logo__mark i:nth-child(1){top:11px;width:14px}
.logo__mark i:nth-child(2){top:18px;width:10px;left:3px}
.logo__mark i:nth-child(3){top:25px;width:14px}
.logo__mark b{font-size:38px;font-weight:800;line-height:1;letter-spacing:-.06em;transform:skewX(-11deg);color:currentColor}
.logo__dom{align-self:flex-end;margin:0 0 5px 3px;font-size:15px;font-weight:800;line-height:1;letter-spacing:-.02em;color:var(--blue);transform:skewX(-11deg)}
.logo--inv .logo__dom{color:var(--yellow)}
.cta__logo .logo__dom,.wcard__logo .logo__dom{display:none}
.logo__txt{display:flex;flex-direction:column;font-size:9.5px;font-weight:800;line-height:1.18;letter-spacing:.03em;text-transform:uppercase}
.logo__txt em{display:flex;align-items:center;gap:5px;margin-top:2px;font-size:8.5px;letter-spacing:.14em;color:var(--blue)}
.logo__txt em::before,.logo__txt em::after{content:"";height:2px;flex:1;max-width:14px;background:var(--yellow);border-radius:2px}
.logo--inv{color:var(--white)}
.logo--inv .logo__txt em{color:var(--yellow)}

/* ---------- шапка ---------- */
.hdr{position:sticky;top:0;z-index:60;background:var(--white);transition:box-shadow .3s}
.hdr.is-scrolled{box-shadow:0 1px 0 var(--line),0 10px 30px -18px rgba(11,31,75,.35)}
.hdr__in{display:flex;align-items:center;gap:8px;height:var(--hdr-h)}
.hdr__logo{margin-right:auto}
.hdr__motto,.nav,.hdr__cta{display:none}
.hdr .hdr__lang{display:none}
.hdr__logo .logo__txt{display:none}
.hdr__burger{display:grid;flex:none;align-content:center;gap:5px;width:42px;height:42px;padding:0 11px;border:0;border-radius:12px;background:var(--soft)}
.hdr__burger span{height:2px;border-radius:2px;background:var(--navy);transition:transform .3s var(--ease),opacity .2s}
.hdr__burger span:nth-child(2){width:70%}
.hdr__burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hdr__burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.hdr__burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (min-width:1140px){
	.hdr__in{gap:20px}
	.hdr__logo{margin-right:0}
	.nav{display:block;margin-inline:auto}
	.hdr__cta{display:inline-flex}
	.hdr .hdr__lang{display:inline-flex}
	.hdr__burger{display:none}
}
@media (min-width:1140px) and (max-width:1359px){
	.hdr__num{display:none}
}
@media (min-width:2400px){
	.hdr__motto{display:flex;flex-direction:column;padding-left:18px;border-left:1px solid var(--line);font-size:11px;font-weight:800;line-height:1.3;letter-spacing:.06em;text-transform:uppercase;color:var(--navy)}
}
.nav__list{display:flex;align-items:center;gap:2px}
.nav__item{position:relative}
.nav__link,.nav__list>li>a{display:flex;align-items:center;gap:4px;padding:10px 10px;white-space:nowrap;border-radius:10px;font-size:15px;font-weight:600;color:var(--navy);transition:background-color .2s,color .2s}
.nav__link:hover,.nav__list>li>a:hover{background:var(--soft);color:var(--blue)}
.nav__chev{width:16px;height:16px;transition:transform .25s var(--ease)}
.has-sub:hover .nav__chev,.has-sub:focus-within .nav__chev{transform:rotate(180deg)}
/* Випадне меню лише на :hover/:focus-within — без JS-перемикача (граблі подвійного тоглу).
   Прозорий padding-top перекриває щілину між пунктом і панеллю. */
.sub{position:absolute;left:-16px;top:100%;padding-top:10px;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .2s,transform .25s var(--ease),visibility 0s .25s}
.has-sub:hover .sub,.has-sub:focus-within .sub{opacity:1;visibility:visible;transform:none;transition:opacity .2s,transform .25s var(--ease)}
.sub{border-radius:var(--r-lg)}
.sub__grid{display:grid;grid-template-columns:repeat(2,minmax(230px,1fr));gap:4px;padding:12px;background:var(--white);border-radius:var(--r-lg) var(--r-lg) 0 0;box-shadow:0 0 0 1px var(--line)}
.sub__grid a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;color:var(--navy);font-weight:600;font-size:15px;line-height:1.2}
.sub__grid a .ic{width:40px;height:40px;padding:8px;border-radius:10px;background:var(--soft);transition:background-color .2s}
.sub__grid a small{display:block;margin-top:2px;font-size:12.5px;font-weight:500;color:var(--muted)}
.sub__grid a:hover{background:var(--soft)}
.sub__grid a:hover .ic{background:var(--yellow)}
.sub__all{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-radius:0 0 var(--r-lg) var(--r-lg);background:var(--soft);color:var(--navy);font-weight:700;box-shadow:0 0 0 1px var(--line),var(--shadow-lg)}
.sub__all:hover{background:var(--yellow)}
.sub__all .ic{width:20px;height:20px;color:var(--blue)}
/* меню, створене в адмінці (Вигляд → Меню): другий рівень */
.nav__list>li{position:relative}
.nav__list .sub-menu{position:absolute;left:0;top:100%;min-width:250px;padding:10px;border-radius:var(--r-lg);background:var(--white);box-shadow:var(--shadow-lg),0 0 0 1px var(--line);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .2s,transform .25s var(--ease),visibility 0s .25s}
.nav__list .sub-menu::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
.nav__list li:hover>.sub-menu,.nav__list li:focus-within>.sub-menu{opacity:1;visibility:visible;transform:none;transition:opacity .2s,transform .25s var(--ease)}
.nav__list .sub-menu a{display:block;padding:10px 12px;border-radius:10px;color:var(--navy);font-size:15px;font-weight:600}
.nav__list .sub-menu a:hover{background:var(--soft)}
.hdr__phone{display:flex;align-items:center;gap:8px;margin-left:auto;color:var(--navy);text-decoration:none;white-space:nowrap}
.hdr__num{text-align:right}
.hdr__num b{display:block;font-size:14px;font-weight:800;letter-spacing:-.01em;line-height:1.2}
.hdr__num small{display:none;font-size:12px;color:var(--muted)}
.hdr__cc{display:none}
.hdr__ring{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:50%;background:#16A34A;color:var(--white);box-shadow:0 8px 18px -8px rgba(22,163,74,.85);transition:background-color .2s,transform .2s var(--ease)}
.hdr__ring .ic{width:21px;height:21px}
.hdr__phone:hover .hdr__ring{background:#15803D;transform:scale(1.05)}
.hdr__phone:hover b{color:#15803D}
/* перемикач мов */
.lang{display:inline-flex;flex:none;padding:3px;border-radius:999px;background:var(--soft)}
.lang a{padding:6px 10px;border-radius:999px;color:var(--muted);font-size:12px;font-weight:800;letter-spacing:.04em;line-height:1}
.lang a:hover{color:var(--navy)}
.lang a[aria-current]{background:var(--navy);color:var(--white)}
.lang--inv{background:rgba(255,255,255,.08)}
.lang--inv a{color:var(--on-navy)}
.lang--inv a[aria-current]{background:var(--yellow);color:var(--navy)}
.mnav__lang{align-self:flex-start}
@media (min-width:400px){.hdr__cc{display:inline}}
@media (min-width:560px){.hdr__in{gap:12px}.hdr__logo .logo__txt{display:flex}.hdr__num b{font-size:15px}}
@media (min-width:760px){.hdr__num small{display:block}.hdr__ring{width:44px;height:44px}}
@media (max-width:399px){.hdr__logo .logo__mark b{font-size:31px}.hdr__logo .logo__dom{font-size:13px}.hdr__logo .logo__mark{padding-left:16px}}
@media (min-width:1140px){.hdr__phone{margin-left:0}.hdr__logo{margin-right:auto}}

/* мобільне меню: повноекранна темна шторка */
.mnav{position:fixed;inset:var(--hdr-h) 0 0;z-index:55;background:var(--navy);color:var(--white);overflow-y:auto;overscroll-behavior:contain;opacity:0;transform:translateY(-8px);transition:opacity .25s,transform .3s var(--ease)}
.mnav.is-open{opacity:1;transform:none}
.mnav__in{min-height:100%;display:flex;flex-direction:column;gap:28px;padding:24px var(--gut) calc(28px + env(safe-area-inset-bottom))}
.mnav__label{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--yellow)}
.mnav__devices{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:-16px}
.mnav__devices a{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 6px;border-radius:14px;background:rgba(255,255,255,.06);color:var(--white);font-size:12.5px;font-weight:600;line-height:1.2;text-align:center}
.mnav__devices .ic{width:28px;height:28px;color:var(--yellow)}
.mnav__links{border-top:1px solid var(--line-navy)}
.mnav__links a{display:block;padding:15px 0;border-bottom:1px solid var(--line-navy);color:var(--white);font-size:20px;font-weight:700}
.mnav__foot{margin-top:auto;display:grid;gap:14px;text-align:center}
.mnav__phone{display:flex;align-items:center;justify-content:center;gap:10px;color:var(--white);font-size:22px;font-weight:800}
.mnav__phone .ic{color:var(--yellow)}
.mnav__hours{font-size:14px;color:var(--on-navy)}
body.menu-open{overflow:hidden}

/* ---------- HERO ---------- */
.hero{position:relative;background:var(--navy);color:var(--white);overflow:clip;isolation:isolate}
.hero__grid-bg{position:absolute;inset:0;z-index:-1;background:
	radial-gradient(60% 55% at 78% 42%,rgba(255,210,31,.16),transparent 70%),
	radial-gradient(50% 60% at 0% 100%,rgba(29,95,214,.35),transparent 70%),
	linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px) 0 0/56px 56px,
	linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px) 0 0/56px 56px;
	-webkit-mask-image:linear-gradient(180deg,#000 60%,rgba(0,0,0,.4));mask-image:linear-gradient(180deg,#000 60%,rgba(0,0,0,.4))}
.hero__in{display:grid;gap:40px;padding-block:36px 48px}
.hero__eyebrow{margin-bottom:18px}
.hero__city{display:none;margin-left:.3em}
@media (min-width:560px){.hero__city{display:inline}}
.hero__title{color:var(--white);font-size:clamp(34px,9.6vw,70px);line-height:.96;letter-spacing:-.035em;text-transform:uppercase}
.hero__line{display:block}
.hero__911{display:inline-block;margin-top:.06em;font-size:1em;line-height:.96;color:var(--yellow);letter-spacing:-.04em;transform:skewX(-8deg);transform-origin:left bottom}
.hero__911 i{font-style:normal;color:var(--white)}
.hero__lead{margin-top:22px;max-width:30ch;font-size:clamp(17px,2vw,21px);line-height:1.5;color:var(--on-navy)}
.hero__cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:30px}
.hero__cta .btn{flex:1 1 100%}
.hero__phone{display:flex;align-items:center;gap:12px;color:var(--white)}
.hero__phone-ic{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.3);color:var(--yellow)}
.hero__phone b{display:block;font-size:18px;font-weight:800}
.hero__phone small{display:block;font-size:13px;color:var(--on-navy)}
.hero__benefits{display:grid;grid-template-columns:1fr 1fr;gap:16px 14px;margin-top:34px;padding-top:26px;border-top:1px solid var(--line-navy)}
.hero__benefits li{display:flex;align-items:center;gap:12px;font-size:14px;font-weight:600;line-height:1.3;color:var(--white)}
.hero__bic{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:50%;background:var(--yellow);color:var(--navy)}
.hero__bic .ic{width:21px;height:21px}

.hero__media{position:relative;max-width:460px;width:100%;margin-inline:auto;padding:18px 0 0}
.hero__photo{position:relative;margin:0;aspect-ratio:4/5;border-radius:var(--r-xl);overflow:hidden;background:var(--navy-2);box-shadow:var(--shadow-lg),0 0 0 1px rgba(255,255,255,.08)}
.hero__photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(7,22,51,.55))}
.hero__img{width:100%;height:100%;object-fit:cover;object-position:50% 15%;filter:contrast(1.04) saturate(1.06)}
.hero__media::before{content:"";position:absolute;inset:34px -12px -12px 26px;border-radius:var(--r-xl);background:var(--yellow);transform:rotate(3.5deg);z-index:-1}
.hero__scribble{position:absolute;right:-6px;top:-8px;z-index:3;padding:10px 16px 14px;border-radius:14px;background:var(--white);font-size:24px;color:var(--navy);box-shadow:var(--shadow);transform:rotate(5deg)}
.hero__status{position:absolute;left:-10px;bottom:24px;z-index:3;width:min(250px,72%);padding:14px 16px;border-radius:18px;background:var(--white);color:var(--navy);box-shadow:var(--shadow-lg)}
.hero__status-top{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--muted);margin-bottom:10px}
.hero__status ol{display:grid;gap:8px}
.hero__status li{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700;color:#98A3BA}
.hero__status li .ic{width:26px;height:26px;padding:5px;border-radius:50%;background:var(--soft);color:#98A3BA}
.hero__status li.is-done{color:var(--navy)}
.hero__status li.is-done .ic{background:var(--navy);color:var(--yellow)}
.hero__status li.is-now{color:var(--blue)}
.hero__status li.is-now .ic{background:var(--blue-soft);color:var(--blue);animation:bob 1.6s var(--ease) infinite}
@keyframes bob{50%{transform:translateX(3px)}}
.hero__seal{position:absolute;right:-8px;bottom:-14px;z-index:3;display:flex;align-items:center;gap:8px;padding:10px 16px 10px 12px;border-radius:999px;background:var(--navy-3);color:var(--white);box-shadow:var(--shadow-lg),0 0 0 1px rgba(255,255,255,.12);font-size:12px;line-height:1.1}
.hero__seal .ic{width:30px;height:30px;color:var(--yellow)}
.hero__seal b{display:block;font-size:20px;color:var(--yellow)}
.hero__seal span{font-weight:600}

@media (min-width:560px){
	.hero__cta .btn{flex:0 0 auto}
}
@media (min-width:980px){
	.hero__in{grid-template-columns:1.1fr .9fr;align-items:center;gap:56px;padding-block:72px 88px}
	.hero__benefits{grid-template-columns:repeat(4,1fr);gap:14px}
	.hero__benefits li{flex-direction:column;align-items:flex-start;gap:12px}
	.hero__media{max-width:500px;margin-right:0}
	.hero__scribble{right:auto;left:-54px;top:40px;font-size:30px;transform:rotate(-7deg)}
	.hero__status{left:-64px;bottom:64px}
}

/* ---------- техніка ---------- */
.devices{padding-block:var(--sec) 40px}
.devices__hint{display:inline-flex;align-items:center;gap:8px;margin-top:22px;padding:8px 14px 8px 10px;border-radius:999px;background:var(--yellow-soft);color:var(--navy);font-size:14px;font-weight:600}
.devices__hint .ic{width:20px;height:20px}
.devices__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.dcard{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;height:100%;min-height:124px;padding:16px 6px 14px;border-radius:18px;background:var(--soft);color:var(--navy);text-align:center;transition:background-color .25s,box-shadow .25s,transform .25s var(--ease)}
.dcard__ic{display:grid;place-items:center;width:52px;height:52px;border-radius:15px;background:var(--white);color:var(--navy);box-shadow:var(--shadow-sm);transition:background-color .25s,transform .35s var(--ease)}
.dcard__ic .ic{width:28px;height:28px}
.dcard__name{max-width:100%;font-size:13px;font-weight:700;line-height:1.2;letter-spacing:-.01em;text-wrap:balance;overflow-wrap:anywhere;hyphens:auto}
.dcard__from{display:none;font-size:12.5px;color:var(--muted)}
.dcard__faults{display:none;font-size:13px;line-height:1.4;color:var(--muted)}
.dcard__go{display:none}
.dcard:hover{background:var(--white);box-shadow:var(--shadow),0 0 0 1px var(--line);transform:translateY(-3px)}
.dcard:hover .dcard__ic{background:var(--yellow);transform:rotate(-6deg) scale(1.04)}
.dcard--all{background:var(--navy);color:var(--white)}
.dcard--all .dcard__ic{background:var(--yellow)}
.dcard--all .dcard__from,.dcard--all .dcard__faults{color:var(--on-navy)}
.dcard--all:hover{background:var(--navy-2)}
.brands-wrap{padding-bottom:8px}

@media (min-width:560px){
	.devices__grid{gap:12px}
	.dcard{padding:20px 12px 18px}
	.dcard__name{font-size:15px}
	.dcard__from{display:block}
}
@media (min-width:980px){
	.devices__in{display:grid;grid-template-columns:minmax(300px,380px) 1fr;gap:64px;align-items:start}
	.devices__head{position:sticky;top:calc(var(--hdr-h) + 32px);margin:0}
	.dcard{align-items:flex-start;text-align:left;padding:22px;min-height:172px;gap:6px}
	.dcard__ic{margin-bottom:14px}
	.dcard__name{margin-top:auto;font-size:17px}
	.dcard__faults{display:block}
	.dcard__from{margin-top:2px;font-weight:600;color:var(--blue)}
	.dcard__go{display:block;position:absolute;right:18px;top:22px;width:22px;height:22px;opacity:0;transform:translateX(-6px);transition:opacity .25s,transform .25s var(--ease)}
	.dcard:hover .dcard__go{opacity:1;transform:none}
}

/* ---------- бренди ---------- */
.brands{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;margin-top:28px;padding:18px 20px;border-radius:var(--r-lg);background:var(--soft)}
.brands__label{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;color:var(--navy)}
.brands__label .ic{width:22px;height:22px;color:var(--blue)}
.brands__list{flex:1 1 0;min-width:240px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px}
.brands__list li{font-size:15px;font-weight:800;letter-spacing:.02em;text-transform:uppercase;color:#7C89A6}
.brands__list .brands__more{font-size:13px;font-weight:600;text-transform:none;letter-spacing:0;color:var(--blue)}

/* ---------- як працює ---------- */
.how{padding-block:var(--sec);background:var(--soft)}
.how__steps{position:relative;display:grid;gap:12px;counter-reset:s}
.how__steps::before{content:"";position:absolute;left:27px;top:28px;bottom:28px;width:2px;background:repeating-linear-gradient(180deg,var(--navy) 0 6px,transparent 6px 12px);opacity:.25}
.step{position:relative;display:grid;grid-template-columns:56px 1fr;grid-template-areas:"n t" "n d";column-gap:18px;align-items:center;padding:14px 18px 14px 0}
.step__n{grid-area:n;align-self:start;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--white);color:var(--navy);font-size:18px;font-weight:800;box-shadow:0 0 0 1.5px var(--navy),0 0 0 8px var(--soft);position:relative;z-index:1}
.step__ic{display:none}
.step__t{grid-area:t;font-size:20px}
.step__d{grid-area:d;color:var(--muted);font-size:15px}
.step--final{padding:18px;border-radius:var(--r-lg);background:var(--yellow);box-shadow:0 18px 40px -20px rgba(255,195,0,.9);margin-left:-18px;grid-template-columns:56px 1fr;padding-left:18px}
.step--final .step__n{background:var(--navy);color:var(--yellow);box-shadow:none;font-size:22px}
.step--final .step__d{color:var(--navy)}
.how__cta{display:flex;justify-content:center;margin-top:40px}
@media (min-width:980px){
	.how__steps{grid-template-columns:repeat(5,1fr);gap:20px}
	.how__steps::before{left:6%;right:14%;top:44px;bottom:auto;width:auto;height:2px;background:repeating-linear-gradient(90deg,var(--navy) 0 8px,transparent 8px 16px)}
	.step{grid-template-columns:1fr;grid-template-areas:"n" "t" "d";row-gap:10px;align-items:start;padding:16px 16px 22px;border-radius:var(--r-lg)}
	.step__n{width:58px;height:58px;margin-bottom:12px}
	.step--final{margin-left:0;padding:16px 20px 22px}
	.step:not(.step--final){transition:background-color .25s,box-shadow .25s}
	.step:not(.step--final):hover{background:var(--white);box-shadow:var(--shadow)}
}

/* ---------- лічильник ---------- */
.counter{position:relative;padding-block:var(--sec);background:var(--navy);color:var(--white);text-align:center;overflow:clip;isolation:isolate}
.counter__rays{position:absolute;inset:0;z-index:-1;background:
	radial-gradient(circle at 50% 55%,rgba(255,210,31,.16),transparent 42%),
	repeating-radial-gradient(circle at 50% 55%,rgba(255,255,255,.055) 0 1px,transparent 1px 88px)}
.counter .eyebrow{justify-content:center;margin-bottom:10px}
.counter__num{font-size:clamp(76px,19vw,220px);font-weight:800;line-height:.95;letter-spacing:-.055em;color:var(--yellow);text-shadow:0 20px 60px rgba(255,195,0,.25)}
.counter__label{margin-top:10px;font-size:clamp(20px,2.8vw,32px);font-weight:700;color:var(--white);letter-spacing:-.02em}
.counter__label mark{background:none;color:var(--white);box-shadow:inset 0 -.35em 0 rgba(255,210,31,.45)}
.counter__more{margin-top:10px;font-family:var(--hand);font-size:clamp(26px,3vw,36px);font-weight:600;color:var(--yellow);transform:rotate(-2deg)}
.counter__src{display:inline-flex;align-items:center;gap:10px;margin-top:34px;padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.06);font-size:13px;color:var(--on-navy);text-wrap:balance}

/* ---------- кейси ---------- */
.cases{padding-block:var(--sec)}
.cases__list{display:grid;gap:16px}
.case{position:relative;display:flex;flex-direction:column;padding:22px;border-radius:var(--r-lg);background:var(--white);box-shadow:0 0 0 1px var(--line);transition:box-shadow .3s,transform .3s var(--ease)}
.case:hover{box-shadow:var(--shadow),0 0 0 1px var(--line);transform:translateY(-3px)}
.case__head{display:flex;align-items:center;gap:12px;padding-bottom:18px;border-bottom:1px dashed var(--line)}
.case__ic{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:14px;background:var(--soft);color:var(--navy)}
.case__who{min-width:0}
.case__who b{display:block;color:var(--navy);font-size:17px;line-height:1.2}
.case__who small{display:block;color:var(--muted);font-size:13px}
.case__stamp{position:absolute;right:18px;top:-13px;display:inline-flex;align-items:center;gap:5px;padding:6px 10px 6px 7px;border-radius:999px;background:var(--yellow);color:var(--navy);font-size:12px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;transform:rotate(-4deg);white-space:nowrap}
.case__stamp .ic{width:16px;height:16px}
.case__flow{position:relative;display:grid;gap:14px;margin:20px 0;padding-left:20px}
.case__flow::before{content:"";position:absolute;left:4px;top:8px;bottom:8px;width:2px;background:var(--line)}
.case__flow div{position:relative}
.case__flow div::before{content:"";position:absolute;left:-20px;top:7px;width:10px;height:10px;border-radius:50%;background:var(--white);box-shadow:inset 0 0 0 2px #B7C2D8}
.case__flow div:last-child::before{background:var(--yellow);box-shadow:inset 0 0 0 2px var(--navy)}
.case__flow dt{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.case__flow dd{margin:2px 0 0;color:var(--ink);font-size:15px;line-height:1.5}
.case__foot{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:auto;padding-top:16px;border-top:1px solid var(--line);font-size:13.5px;font-weight:600;color:var(--navy)}
.case__foot span{display:inline-flex;align-items:center;gap:6px}
.case__foot .ic{width:18px;height:18px;color:var(--blue)}
@media (min-width:760px){.cases__list{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.cases__list{grid-template-columns:repeat(3,1fr);gap:22px}}

/* ---------- поради ---------- */
.advice{padding-block:var(--sec);background:var(--soft)}
.advice__in{display:grid;gap:48px}
.advice__master{position:relative;max-width:440px;width:100%;margin-inline:auto}
.advice__photo{margin:0;aspect-ratio:1/1;border-radius:var(--r-xl);overflow:hidden;background:var(--line)}
.advice__img{width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.advice__quote{position:relative;margin:-72px 16px 0;padding:24px 22px 20px;border-radius:var(--r-lg);background:var(--navy);color:var(--white);box-shadow:var(--shadow-lg)}
.advice__q{position:absolute;right:18px;top:-20px;width:44px;height:44px;padding:10px;border-radius:50%;background:var(--yellow);color:var(--navy)}
.advice__quote p{font-size:16px;line-height:1.55}
.advice__quote footer{display:flex;flex-direction:column;margin-top:14px;font-size:13px;color:var(--on-navy)}
.advice__quote footer b{color:var(--yellow);font-size:15px}
.tips{display:grid;gap:10px}
.tip{display:grid;grid-template-columns:48px 1fr;gap:4px 16px;align-items:start;padding:18px;border-radius:var(--r-lg);background:var(--white);color:var(--text);box-shadow:0 0 0 1px var(--line);transition:box-shadow .25s,transform .25s var(--ease)}
.tip:hover{box-shadow:var(--shadow),0 0 0 1px var(--line);transform:translateY(-2px)}
.tip__ic{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--blue-soft);color:var(--blue)}
.tip__t{display:block;color:var(--navy);font-size:17px;font-weight:700;line-height:1.3;letter-spacing:-.01em}
.tip__d{display:block;margin-top:6px;font-size:14.5px;color:var(--muted)}
.tip__meta{grid-column:2;display:flex;align-items:center;gap:8px;margin-top:8px;font-size:13px;font-weight:600;color:var(--blue)}
.tip__meta .ic{width:18px;height:18px;transition:transform .25s var(--ease)}
.tip:hover .tip__meta .ic{transform:translateX(4px)}
@media (min-width:980px){
	.advice__in{grid-template-columns:420px 1fr;gap:72px;align-items:center}
	.tip{grid-template-columns:52px 1fr auto;padding:22px 24px}
	.tip__meta{grid-column:auto;margin-top:0;align-self:center}
}

/* ---------- FAQ ---------- */
.faq{padding-block:var(--sec)}
.faq__in{display:grid;gap:32px}
.faq__ask{padding:22px;border-radius:var(--r-lg);background:var(--soft)}
.faq__ask p{color:var(--muted);font-size:15px}
.faq__phone{display:inline-flex;align-items:center;gap:10px;margin-top:10px;color:var(--navy);font-size:22px;font-weight:800}
.faq__phone .ic{width:36px;height:36px;padding:8px;border-radius:50%;background:var(--yellow)}
.qa{border-bottom:1px solid var(--line)}
.qa summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;list-style:none;cursor:pointer;color:var(--navy);font-size:18px;font-weight:700;line-height:1.35}
.qa summary::-webkit-details-marker{display:none}
.qa summary i{position:relative;flex:none;width:36px;height:36px;border-radius:50%;background:var(--soft);transition:background-color .25s,transform .3s var(--ease)}
.qa summary i::before,.qa summary i::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;margin:-1px 0 0 -7px;border-radius:2px;background:var(--navy)}
.qa summary i::after{transform:rotate(90deg);transition:transform .3s var(--ease)}
.qa[open] summary i{background:var(--yellow);transform:rotate(180deg)}
.qa[open] summary i::after{transform:rotate(0)}
.qa summary:hover{color:var(--blue)}
.qa__a{padding:0 52px 22px 0;color:var(--text)}
@media (min-width:980px){
	.faq__in{grid-template-columns:380px 1fr;gap:80px;align-items:start}
	.faq__side{position:sticky;top:calc(var(--hdr-h) + 32px)}
	.qa summary{font-size:19px}
}

/* ---------- фінальний заклик ---------- */
.cta{padding-block:0 var(--sec)}
.cta__in{position:relative;display:grid;gap:32px;padding:40px 22px;border-radius:var(--r-xl);background:var(--navy);color:var(--white);overflow:clip;isolation:isolate}
.cta__in::before{content:"";position:absolute;inset:0;z-index:-1;background:
	radial-gradient(50% 80% at 100% 0%,rgba(255,210,31,.16),transparent 70%),
	linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px) 0 0/48px 48px,
	linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px) 0 0/48px 48px}
.cta__title{color:var(--white);font-size:clamp(34px,5vw,60px);line-height:1.02;text-transform:uppercase}
.cta__title em{color:var(--yellow)}
.cta__sub{margin-top:18px;max-width:46ch;color:var(--on-navy);font-size:17px}
.cta__facts{display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:24px}
.cta__facts li{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600}
.cta__facts .ic{width:22px;height:22px;color:var(--yellow)}
.cta__act{display:grid;gap:12px;align-content:center}
.cta__brush{justify-self:start;margin-bottom:10px;padding:14px 30px 16px 22px;background:var(--yellow);color:var(--navy);font-family:var(--hand);font-size:30px;font-weight:600;line-height:.95;transform:rotate(-4deg);clip-path:polygon(2% 12%,12% 4%,30% 9%,52% 2%,74% 7%,97% 0,100% 30%,96% 58%,100% 88%,78% 95%,55% 90%,34% 98%,12% 92%,0 100%,3% 62%,0 36%)}
@media (min-width:900px){
	.cta__in{grid-template-columns:1.2fr .8fr;gap:56px;padding:64px}
	.cta__brush{justify-self:end;margin:-20px -8px 18px 0}
}

/* ---------- підвал ---------- */
.ftr{position:relative;padding-top:64px;background:var(--navy-3);color:var(--on-navy);overflow:clip;isolation:isolate}
.ftr__top,.ftr__bottom{position:relative;z-index:1}
.ftr a{color:var(--white)}
.ftr__top{display:grid;grid-template-columns:1fr 1fr;gap:36px 20px}
.ftr__brand,.ftr__contact{grid-column:1/-1}
.ftr__about{margin-top:18px;max-width:36ch;font-size:15px}
.ftr__msg{display:flex;gap:10px;margin-top:20px}
.ftr__msg a{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:rgba(255,255,255,.07);transition:background-color .2s,color .2s}
.ftr__msg a:hover{background:var(--yellow);color:var(--navy)}
.ftr__msg .ic{width:20px;height:20px}
.ftr__h{margin-bottom:14px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--yellow)}
.ftr__col li+li{margin-top:8px}
.ftr__col a{color:var(--on-navy);font-size:15px;transition:color .2s}
.ftr__col a:hover{color:var(--white)}
.ftr__col .btn{margin-top:14px}
.ftr__col .btn--call{color:var(--navy)}
.ftr__phone{display:block;font-size:24px;font-weight:800;color:var(--white)!important}
.ftr__line{display:flex;gap:10px;margin-top:10px;font-size:14.5px}
.ftr__line .ic{width:20px;height:20px;margin-top:2px;color:var(--yellow)}
.ftr__mark{position:absolute;right:-2%;bottom:40px;z-index:0;font-size:clamp(160px,26vw,340px);font-weight:800;line-height:.8;letter-spacing:-.07em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.07);transform:skewX(-10deg);user-select:none;pointer-events:none}
.ftr__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;margin-top:56px;padding:22px 0 calc(22px + 76px + env(safe-area-inset-bottom));border-top:1px solid var(--line-navy);font-size:13px}
@media (min-width:760px){
	.ftr__top{grid-template-columns:1fr 1fr}
	.ftr__brand,.ftr__contact{grid-column:auto}
}
@media (min-width:1100px){
	.ftr__top{grid-template-columns:1.4fr .8fr .7fr 1fr;gap:48px}
	.ftr__bottom{padding-bottom:26px}
}

/* ---------- нижня панель на телефоні ---------- */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:50;display:grid;grid-template-columns:1fr 1.15fr;box-shadow:0 -10px 30px -12px rgba(7,22,51,.35);transition:transform .35s var(--ease)}
.dock a{display:flex;align-items:center;gap:10px;min-height:68px;padding:10px 14px calc(10px + env(safe-area-inset-bottom))}
.dock b{display:block;font-size:15px;font-weight:800;line-height:1.15;text-transform:uppercase;letter-spacing:.01em}
.dock small{display:block;font-size:12px;line-height:1.2;opacity:.8;white-space:nowrap}
.dock .ic{width:26px;height:26px;flex:none}
.dock__call{background:var(--navy);color:var(--white)}
.dock__call .ic{color:var(--yellow)}
.dock__call b{text-transform:none}
.dock__order{background:var(--yellow);color:var(--navy)}
body.menu-open .dock,body.sheet-open .dock{transform:translateY(110%)}
@media (min-width:1140px){.dock{display:none}}

/* ---------- шторка виклику ---------- */
.sheet{width:100%;max-width:640px;max-height:100dvh;margin:auto auto 0;padding:0;border:0;background:transparent;color:var(--text)}
.sheet::backdrop{background:rgba(7,22,51,.62);backdrop-filter:blur(3px)}
.sheet[open]{animation:sheet-up .38s var(--ease)}
@keyframes sheet-up{from{transform:translateY(40px);opacity:0}}
.sheet__box{max-height:94dvh;overflow-y:auto;overscroll-behavior:contain;padding:22px 18px calc(22px + env(safe-area-inset-bottom));border-radius:24px 24px 0 0;background:var(--white)}
.sheet__head{position:relative;margin-bottom:18px;padding-right:48px}
.sheet__kicker{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--muted)}
.sheet__title{margin-top:6px;font-size:28px;text-transform:uppercase}
.sheet__close{position:absolute;right:0;top:0;display:grid;place-items:center;width:42px;height:42px;border:0;border-radius:50%;background:var(--soft);color:var(--navy)}
.order{display:grid;gap:16px}
.order__set{margin:0;padding:0;border:0;min-width:0}
.order__label{display:block;margin-bottom:8px;font-size:14px;font-weight:700;color:var(--navy)}
.order__label i{font-style:normal;font-weight:500;color:var(--muted)}
.order__label b{color:#D92D20}
.order__devices{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.chip,.pill{position:relative;display:block}
.chip input,.pill input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.chip span{display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;padding:10px 4px;border-radius:14px;box-shadow:inset 0 0 0 1.5px var(--line);font-size:12px;font-weight:600;line-height:1.15;text-align:center;color:var(--navy);transition:box-shadow .2s,background-color .2s}
.chip .ic{width:26px;height:26px}
.chip input:checked+span,.pill input:checked+span{background:var(--yellow-soft);box-shadow:inset 0 0 0 2px var(--navy)}
.chip input:focus-visible+span,.pill input:focus-visible+span{outline:3px solid var(--blue);outline-offset:2px}
.order__when{display:flex;flex-wrap:wrap;gap:6px}
.pill span{display:block;padding:10px 16px;border-radius:999px;box-shadow:inset 0 0 0 1.5px var(--line);font-size:14px;font-weight:600;color:var(--navy)}
.order__row{display:grid;gap:16px}
.field{display:block;min-width:0}
.field input,.field textarea{display:block;width:100%;min-height:52px;padding:14px 16px;border:0;border-radius:14px;background:var(--soft);box-shadow:inset 0 0 0 1.5px transparent;color:var(--ink);font-size:16px;transition:box-shadow .2s,background-color .2s;resize:vertical}
.field textarea{min-height:76px}
.field input::placeholder,.field textarea::placeholder{color:#8B97AF}
.field input:focus,.field textarea:focus{outline:0;background:var(--white);box-shadow:inset 0 0 0 1.5px var(--blue),0 0 0 4px rgba(29,95,214,.14)}
.field__err{display:none;margin-top:6px;font-size:13px;color:#D92D20}
.field.is-bad input{box-shadow:inset 0 0 0 1.5px #D92D20}
.field.is-bad .field__err{display:block}
.order__legal{font-size:12.5px;color:var(--muted);text-align:center}
.order__fail{padding:12px 14px;border-radius:12px;background:#FEF3F2;color:#B42318;font-size:14px}
.order.is-busy [data-submit]{opacity:.7;pointer-events:none}
.order.is-busy [data-submit] .btn__bell{animation:ring .8s infinite}
.done{text-align:center;padding:8px 0}
.done__badge{display:inline-flex;align-items:center;gap:8px;padding:8px 14px 8px 10px;border-radius:999px;background:#ECFDF3;color:#067647;font-size:14px;font-weight:700}
.done__badge .ic{width:20px;height:20px}
.done__title{margin-top:18px;font-size:30px}
.done__text{margin:10px auto 0;max-width:40ch;color:var(--muted)}
.track{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin:26px 0}
.track__step{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;font-size:11.5px;font-weight:600;color:var(--muted)}
.track__step::before{content:"";position:absolute;top:17px;right:50%;width:100%;height:2px;background:var(--line);z-index:-1}
.track__step:first-child::before{display:none}
.track__dot{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--white);box-shadow:inset 0 0 0 1.5px var(--line);font-size:13px;font-weight:800;color:var(--muted)}
.track__step.is-done .track__dot{background:var(--navy);color:var(--yellow);box-shadow:none}
.track__step.is-done .track__dot .ic{width:18px;height:18px}
.track__step.is-now .track__dot{box-shadow:inset 0 0 0 2px var(--blue);color:var(--blue);animation:nowring 1.6s infinite}
@keyframes nowring{50%{box-shadow:inset 0 0 0 2px var(--blue),0 0 0 6px rgba(29,95,214,.15)}}
.track__step.is-final .track__dot{background:var(--yellow-soft);color:var(--navy)}
.track__step.is-done,.track__step.is-now{color:var(--navy)}
@media (min-width:640px){
	.sheet{margin:auto}
	.sheet[open]{animation:sheet-in .3s var(--ease)}
	@keyframes sheet-in{from{transform:translateY(16px) scale(.98);opacity:0}}
	.sheet__box{padding:30px 32px;border-radius:28px;max-height:92dvh}
	.order__devices{grid-template-columns:repeat(5,1fr)}
	.order__row{grid-template-columns:1fr 1fr}
}

/* ---------- сторінка послуги ---------- */
.svc-hero{position:relative;padding-bottom:40px;background:linear-gradient(180deg,var(--soft),var(--white) 85%);overflow:clip}
.svc-hero__in{position:relative;display:grid;grid-template-columns:1fr;padding-top:14px}
.crumbs ol{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:13.5px;color:var(--muted)}
.crumbs li{display:flex;align-items:center;gap:8px}
.crumbs li+li::before{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-top:1.5px solid currentColor;transform:rotate(45deg);opacity:.6}
.crumbs a{color:inherit}
.crumbs a:hover{color:var(--blue)}
.svc-hero__copy{position:relative;z-index:2;max-width:64%}
.svc-hero .crumbs{margin-bottom:22px}
.svc-hero .eyebrow{font-size:12px;letter-spacing:.06em;gap:10px}
.svc-hero .eyebrow::before{width:20px}
.svc-hero__title{text-shadow:0 0 18px rgba(255,255,255,.9);font-size:clamp(34px,9.6vw,72px);line-height:1;letter-spacing:-.04em}
.svc-hero__title span{display:block}
.svc-hero__lead{margin-top:16px;font-size:15px;line-height:1.5;color:var(--text)}
.svc-hero__benefits{display:grid;gap:12px;margin-top:22px}
.svc-hero__benefits li{display:flex;align-items:center;gap:12px;max-width:215px;font-size:14px;font-weight:600;line-height:1.25;color:var(--navy)}
.svc-hero__bic{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 5px rgba(255,210,31,.2)}
.svc-hero__bic .ic{width:20px;height:20px}
.svc-hero__media{position:absolute;right:calc(var(--gut) * -1);top:70px;width:60%;height:min(520px,106vw);z-index:1}
.svc-hero__photo{margin:0;height:100%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3) 22%,#000 58%);mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3) 22%,#000 58%)}
.svc-hero__img{width:100%;height:100%;object-fit:cover;object-position:60% 50%}
.svc-hero__note{position:absolute;right:14px;top:-44px;max-width:170px;font-size:22px;text-align:center}
.svc-hero__note::after{content:"";display:block;width:70%;height:6px;margin:4px auto 0;border-radius:6px;background:var(--yellow);transform:rotate(-3deg)}
.svc-hero__badge{position:absolute;right:0;bottom:-8px;display:flex;align-items:center;gap:8px;max-width:150px;padding:10px 12px 10px 16px;background:var(--yellow);color:var(--navy);font-size:12.5px;font-weight:800;line-height:1.15;text-transform:uppercase;clip-path:polygon(9% 0,100% 0,100% 100%,0 100%)}
.svc-hero__badge .ic{width:28px;height:28px;flex:none}
.svc-hero__cta{position:relative;z-index:2;display:grid;gap:10px;margin-top:28px}
.svc-hero__price{font-size:14px;color:var(--muted);text-align:center}
.svc-hero__price b{color:var(--navy)}
@media (min-width:560px){
	.svc-hero__cta{grid-template-columns:auto auto;justify-content:start}
	.svc-hero__price{grid-column:1/-1;text-align:left}
}
@media (min-width:980px){
	.svc-hero{padding-bottom:56px}
	.svc-hero__in{grid-template-columns:1.05fr .95fr;grid-template-areas:"copy media" "cta media";column-gap:48px;padding-top:28px}
	.svc-hero__copy{grid-area:copy;max-width:none;padding-top:16px}
	.svc-hero__lead{font-size:19px;max-width:40ch}
	.svc-hero__benefits{grid-template-columns:1fr 1fr;gap:16px 20px;margin-top:30px}
	.svc-hero__benefits li{font-size:15px;max-width:none}
	.svc-hero__title{text-shadow:none}
	.svc-hero__badge .ic{width:34px;height:34px}
	.svc-hero__media{grid-area:media;position:relative;right:auto;top:auto;width:100%;height:600px;margin-top:20px}
	.svc-hero__photo{border-radius:var(--r-xl);-webkit-mask-image:none;mask-image:none;box-shadow:var(--shadow-lg)}
	.svc-hero__note{right:auto;left:-58px;top:36px;font-size:28px;padding:10px 16px 12px;border-radius:14px;background:var(--white);box-shadow:var(--shadow)}
	.svc-hero__badge{right:-18px;bottom:40px;max-width:230px;padding:16px 20px;font-size:14px}
	.svc-hero__cta{grid-area:cta;align-self:start}
}

.faults{padding-block:var(--sec) calc(var(--sec) - 20px)}
.faults__grid{display:grid;gap:12px}
.fault{display:flex;flex-direction:column;padding:22px;border-radius:var(--r-lg);background:var(--white);box-shadow:0 0 0 1px var(--line);transition:box-shadow .25s,transform .25s var(--ease)}
.fault:hover{box-shadow:var(--shadow),0 0 0 1px var(--line);transform:translateY(-3px)}
.fault__ic{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--yellow-soft);color:var(--navy)}
.fault__ic .ic{width:22px;height:22px}
.fault__t{margin-top:16px;font-size:19px;letter-spacing:-.015em}
.fault__d{margin-top:6px;font-size:14.5px;color:var(--muted)}
.fault__foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:18px}
.fault__price{color:var(--muted);font-size:14px}
.fault__price b{color:var(--navy);font-size:24px;font-weight:800;letter-spacing:-.02em}
.fault__go{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:14.5px}
.fault__go .ic{width:18px;height:18px;transition:transform .25s var(--ease)}
.fault__go:hover .ic{transform:translateX(3px)}
@media (min-width:640px){.faults__grid{grid-template-columns:1fr 1fr}}
@media (min-width:1040px){.faults__grid{grid-template-columns:repeat(3,1fr);gap:20px}}

/* ---------- внутрішні сторінки ---------- */
.phead{position:relative;background:var(--navy);color:var(--white);overflow:clip;isolation:isolate}
.phead__in{padding-block:28px 56px}
.phead .crumbs{margin-bottom:28px}
.phead .crumbs ol{color:rgba(255,255,255,.6)}
.phead .crumbs a:hover{color:var(--yellow)}
.phead__title{max-width:18ch;color:var(--white);font-size:clamp(36px,6vw,68px);line-height:1;letter-spacing:-.04em}
.phead__title em{color:var(--yellow)}
.phead__lead{margin-top:18px;max-width:52ch;font-size:clamp(16px,1.8vw,19px);color:var(--on-navy)}
@media (min-width:980px){.phead__in{padding-block:36px 88px}}

.svc-list{padding-block:clamp(40px,6vw,72px) var(--sec)}
.svc-list__grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.svc-card{display:flex;flex-direction:column;height:100%;border-radius:var(--r-lg);overflow:hidden;background:var(--white);box-shadow:0 0 0 1px var(--line);color:var(--text);transition:box-shadow .3s,transform .3s var(--ease)}
.svc-card:hover{box-shadow:var(--shadow),0 0 0 1px var(--line);transform:translateY(-4px)}
.svc-card__pic{display:block;aspect-ratio:4/3;background:var(--soft);overflow:hidden}
.svc-card__pic img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.svc-card:hover .svc-card__pic img{transform:scale(1.05)}
.svc-card__body{position:relative;display:flex;flex-direction:column;flex:1;gap:6px;padding:28px 14px 14px}
.svc-card__ic{position:absolute;left:14px;top:-24px;display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--yellow);color:var(--navy);box-shadow:var(--shadow)}
.svc-card__t{color:var(--navy);font-size:16px;font-weight:800;line-height:1.2}
.svc-card__faults{display:none;font-size:13.5px;color:var(--muted)}
.svc-card__foot{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:8px;font-size:13px;color:var(--muted)}
.svc-card__foot b{color:var(--navy);font-size:17px}
.svc-card__foot .ic{width:20px;height:20px;color:var(--blue)}
.svc-extra{display:grid;gap:18px;margin-top:28px;padding:26px 22px;border-radius:var(--r-lg);background:var(--soft)}
.svc-extra__t{font-size:24px}
.svc-extra ul{display:flex;flex-wrap:wrap;gap:8px}
.svc-extra li{display:flex;align-items:center;gap:6px;padding:8px 14px 8px 10px;border-radius:999px;background:var(--white);font-size:14px;font-weight:600;color:var(--navy)}
.svc-extra li .ic{width:18px;height:18px;color:var(--blue)}
.svc-extra .btn{justify-self:start}
@media (min-width:760px){
	.svc-list__grid{grid-template-columns:repeat(3,1fr);gap:20px}
	.svc-card__body{padding:32px 20px 20px}
	.svc-card__faults{display:block}
	.svc-card__t{font-size:19px}
}
@media (min-width:1100px){
	.svc-list__grid{grid-template-columns:repeat(4,1fr)}
	.svc-extra{grid-template-columns:auto 1fr auto;align-items:center;padding:26px 32px}
}

.prices{padding-block:clamp(32px,5vw,64px) var(--sec)}
.prices__in{display:grid;gap:24px}
.prices__nav{position:sticky;top:var(--hdr-h);z-index:5;display:flex;gap:6px;margin-inline:calc(var(--gut) * -1);padding:10px var(--gut);overflow-x:auto;background:rgba(255,255,255,.96);scrollbar-width:none}
.prices__nav::-webkit-scrollbar{display:none}
.prices__nav a{display:flex;align-items:center;gap:8px;flex:none;padding:8px 14px 8px 10px;border-radius:999px;background:var(--soft);color:var(--navy);font-size:14px;font-weight:600;white-space:nowrap}
.prices__nav .ic{width:20px;height:20px}
.prices__nav a:hover{background:var(--yellow)}
.prices__tables{display:grid;gap:20px}
.ptable{border-radius:var(--r-lg);box-shadow:0 0 0 1px var(--line);overflow:hidden;scroll-margin-top:calc(var(--hdr-h) + 72px)}
.ptable__head{display:flex;align-items:center;gap:12px;padding:16px 18px;background:var(--soft)}
.ptable__ic{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--white);color:var(--navy)}
.ptable__head h2{font-size:20px}
.ptable__head h2 a{color:var(--navy)}
.ptable__head h2 a:hover{color:var(--blue)}
.ptable__call{display:inline-flex;align-items:center;gap:6px;margin-left:auto;font-weight:700;font-size:14px}
.ptable__call .ic{width:18px;height:18px}
.ptable table{width:100%;border-collapse:collapse}
.ptable thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ptable th,.ptable td{padding:14px 18px;border-top:1px solid var(--line);text-align:left;vertical-align:top}
.ptable tbody th{color:var(--navy);font-weight:700;font-size:15.5px}
.ptable tbody th small{display:block;margin-top:2px;font-weight:400;font-size:13.5px;color:var(--muted)}
.ptable td{text-align:right;white-space:nowrap;color:var(--muted);font-size:14px}
.ptable td b{color:var(--navy);font-size:19px;font-weight:800}
.prices__note{display:flex;gap:12px;padding:18px 20px;border-radius:var(--r-lg);background:var(--yellow-soft);color:var(--navy);font-weight:600}
.prices__note .ic{flex:none}
@media (min-width:980px){
	.prices__in{grid-template-columns:260px 1fr;gap:48px;align-items:start}
	.prices__nav{top:calc(var(--hdr-h) + 24px);flex-direction:column;margin:0;padding:0;overflow:visible;background:none}
	.prices__nav a{border-radius:12px;padding:10px 14px 10px 10px}
	.ptable{scroll-margin-top:calc(var(--hdr-h) + 24px)}
}

.contacts{padding-block:clamp(32px,5vw,64px) var(--sec)}
.contacts__grid{display:grid;gap:12px}
.ccard{display:flex;flex-direction:column;gap:4px;padding:22px;border-radius:var(--r-lg);background:var(--white);box-shadow:0 0 0 1px var(--line);color:var(--text);transition:box-shadow .25s,transform .25s var(--ease)}
.ccard:hover{box-shadow:var(--shadow),0 0 0 1px var(--line);transform:translateY(-3px)}
.ccard__ic{display:grid;place-items:center;width:48px;height:48px;margin-bottom:14px;border-radius:14px;background:var(--soft);color:var(--navy)}
.ccard__ic--tg{background:#229ED9;color:#fff}
.ccard__ic--vb{background:#7360F2;color:#fff}
.ccard__k{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ccard__v{color:var(--navy);font-size:20px;font-weight:800;word-break:break-word}
.ccard__s{font-size:14px;color:var(--muted)}
.ccard--main{background:var(--yellow);box-shadow:none}
.ccard--main .ccard__ic{background:var(--navy);color:var(--yellow)}
.ccard--main .ccard__k,.ccard--main .ccard__s{color:var(--navy)}
.area{display:grid;gap:24px;margin-top:20px;padding:28px 22px;border-radius:var(--r-xl);background:var(--navy);color:var(--on-navy)}
.area__t{color:var(--white);font-size:30px;margin-bottom:10px}
.area .btn{margin-top:20px}
.area__list{display:flex;flex-wrap:wrap;gap:8px;align-content:start}
.area__list li{display:flex;align-items:center;gap:6px;padding:9px 14px 9px 10px;border-radius:999px;background:rgba(255,255,255,.07);color:var(--white);font-size:14.5px;font-weight:600}
.area__list .ic{width:18px;height:18px;color:var(--yellow)}
@media (min-width:640px){.contacts__grid{grid-template-columns:1fr 1fr}}
@media (min-width:1040px){
	.contacts__grid{grid-template-columns:repeat(4,1fr);gap:20px}
	.area{grid-template-columns:1fr 1fr;gap:56px;padding:48px}
}

.principles{padding-block:clamp(40px,6vw,80px) 0}
.principles__grid{display:grid;gap:12px}
.principles__grid li{padding:24px;border-radius:var(--r-lg);background:var(--soft)}
.principles__grid span{display:grid;place-items:center;width:52px;height:52px;margin-bottom:18px;border-radius:15px;background:var(--yellow);color:var(--navy)}
.principles__grid h2{font-size:20px}
.principles__grid p{margin-top:8px;color:var(--muted);font-size:15px}
@media (min-width:760px){.principles__grid{grid-template-columns:1fr 1fr}}
@media (min-width:1100px){.principles__grid{grid-template-columns:repeat(4,1fr);gap:20px}}

.posts,.page-body{padding-block:clamp(40px,6vw,80px)}
.posts__grid{display:grid;gap:16px}
.post-card{display:flex;flex-direction:column;height:100%;border-radius:var(--r-lg);overflow:hidden;box-shadow:0 0 0 1px var(--line);color:var(--text);transition:box-shadow .3s,transform .3s var(--ease)}
.post-card:hover{box-shadow:var(--shadow),0 0 0 1px var(--line);transform:translateY(-3px)}
.post-card__pic{display:grid;place-items:center;aspect-ratio:3/2;background:var(--soft);color:var(--navy);overflow:hidden}
.post-card__pic img{width:100%;height:100%;object-fit:cover}
.post-card__pic .ic{width:48px;height:48px;opacity:.4}
.post-card__body{display:flex;flex-direction:column;gap:8px;padding:20px}
.post-card time{font-size:13px;color:var(--muted)}
.post-card__t{color:var(--navy);font-size:19px;font-weight:800;line-height:1.25}
.post-card__d{font-size:14.5px;color:var(--muted)}
.pager{display:flex;justify-content:center;gap:6px;margin-top:40px}
.pager .page-numbers{display:grid;place-items:center;min-width:44px;height:44px;padding:0 10px;border-radius:12px;background:var(--soft);color:var(--navy);font-weight:700}
.pager .current{background:var(--navy);color:var(--white)}
.empty{padding:40px;border-radius:var(--r-lg);background:var(--soft);text-align:center;color:var(--muted)}
@media (min-width:760px){.posts__grid{grid-template-columns:repeat(2,1fr);gap:22px}}
@media (min-width:1100px){.posts__grid{grid-template-columns:repeat(3,1fr)}}

.article{display:grid;gap:40px}
.article__card{padding:24px;border-radius:var(--r-lg);background:var(--navy);color:var(--on-navy)}
.article__k{color:var(--yellow);font-size:20px;font-weight:800;margin-bottom:8px}
.article__card .btn{margin-top:18px}
@media (min-width:1040px){
	.article{grid-template-columns:1fr 320px;gap:64px;align-items:start}
	.article__aside{position:sticky;top:calc(var(--hdr-h) + 32px)}
}

.seo-text{padding-block:0 var(--sec)}
.prose{max-width:760px;font-size:17px;line-height:1.7}
.prose>*+*{margin-top:1em}
.prose h2{margin-top:1.6em;font-size:clamp(26px,3vw,34px)}
.prose h3{margin-top:1.4em;font-size:22px}
.prose ul{padding-left:0}
.prose ul li{position:relative;padding-left:26px}
.prose ul li+li{margin-top:8px}
.prose ul li::before{content:"";position:absolute;left:4px;top:.62em;width:9px;height:9px;border-radius:3px;background:var(--yellow);box-shadow:0 0 0 2px var(--navy)}
.prose ol{padding-left:22px;list-style:decimal}
.prose a{text-decoration:underline;text-underline-offset:3px}
.prose img{border-radius:var(--r-lg)}
.prose blockquote{margin:1.4em 0;padding:18px 22px;border-left:4px solid var(--yellow);border-radius:0 var(--r) var(--r) 0;background:var(--soft);color:var(--navy);font-weight:600}

.e404{position:relative;background:var(--navy);color:var(--white);text-align:center;overflow:clip;isolation:isolate}
.e404__in{padding-block:72px 96px}
.e404__code{font-size:clamp(120px,30vw,260px);font-weight:800;line-height:.9;letter-spacing:-.06em;color:var(--white)}
.e404__code span{display:inline-block;color:var(--yellow);transform:rotate(-12deg)}
.e404__t{margin-top:10px;color:var(--white);font-size:clamp(28px,4vw,44px)}
.e404__d{margin:14px auto 0;max-width:44ch;color:var(--on-navy)}
.e404__act{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:32px}

/* ---------- анімації появи ----------
   Початковий стан — лише під .js (ставиться інлайном у <head>), тож без JS усе видно.
   Рух тільки вгору: боковий зсув тягнув би горизонтальний скрол. */
.js [data-rise]{opacity:0;transform:translateY(18px)}
.js.is-ready [data-rise]{opacity:1;transform:none;transition:opacity .7s var(--ease) var(--d,0ms),transform .8s var(--ease) var(--d,0ms)}
.js.is-ready .hero__line:nth-child(2),.js.is-ready .svc-hero__title{--d:80ms}
.js.is-ready .hero__911{--d:160ms}
.js.is-ready .hero__lead,.js.is-ready .svc-hero__lead{--d:240ms}
.js.is-ready .hero__cta{--d:320ms}
.js.is-ready .hero__media,.js.is-ready .svc-hero__media{--d:200ms}
.js.is-ready .svc-hero__cta{--d:600ms}
.js.is-ready .hero__911[data-rise]{transform:skewX(-8deg)}
.js .hero__911[data-rise]{transform:translateY(18px) skewX(-8deg)}
.js [data-reveal]{opacity:0;transform:translateY(26px)}
.js [data-reveal].is-in{opacity:1;transform:none;transition:opacity .7s var(--ease),transform .8s var(--ease)}
.js [data-reveal-group]>*{opacity:0;transform:translateY(22px)}
.js [data-reveal-group]>.is-in{opacity:1;transform:none;transition:opacity .6s var(--ease) var(--i,0ms),transform .7s var(--ease) var(--i,0ms)}

@media (prefers-reduced-motion:reduce){
	html{scroll-behavior:auto}
	*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0ms!important}
	.js [data-rise],.js [data-reveal],.js [data-reveal-group]>*{opacity:1!important;transform:none!important}
	.js .hero__911[data-rise]{transform:skewX(-8deg)!important}
}

/* ==========================================================================
   ТЗ v2.0 п.11–18: несправності, чому 911, ціни, гарантія, відгуки, історії викликів
   ========================================================================== */

/* ---------- популярні несправності ---------- */
.problems{padding-block:var(--sec);background:var(--soft)}
.problems__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.pcard{position:relative;display:flex;flex-direction:column;gap:6px;height:100%;padding:18px 16px;border-radius:18px;background:var(--white);color:var(--navy);box-shadow:0 0 0 1px var(--line);transition:box-shadow .25s,transform .25s var(--ease)}
.pcard:hover{box-shadow:var(--shadow),0 0 0 1px var(--line);transform:translateY(-3px)}
.pcard__ic{display:grid;place-items:center;width:44px;height:44px;margin-bottom:8px;border-radius:12px;background:var(--yellow-soft);color:var(--navy);transition:background-color .25s}
.pcard:hover .pcard__ic{background:var(--yellow)}
.pcard__t{font-size:17px;font-weight:800;line-height:1.2;letter-spacing:-.01em}
.pcard__d{font-size:13px;line-height:1.35;color:var(--muted)}
.pcard__go{position:absolute;right:16px;top:18px;width:20px;height:20px;color:var(--blue);opacity:0;transform:translateX(-6px);transition:opacity .25s,transform .25s var(--ease)}
.pcard:hover .pcard__go{opacity:1;transform:none}
@media (min-width:760px){.problems__grid{grid-template-columns:repeat(4,1fr);gap:16px}.pcard{padding:24px 22px}}

/* ---------- чому 911 ---------- */
.trust{padding-block:var(--sec)}
.trust__in{display:grid;gap:36px}
.trust__head .btn{margin-top:8px}
.trust__grid{display:grid;gap:12px}
.titem{padding:22px;border-radius:var(--r-lg);background:var(--soft)}
.titem__ic{display:grid;place-items:center;width:48px;height:48px;margin-bottom:16px;border-radius:14px;background:var(--navy);color:var(--yellow)}
.titem__t{font-size:18px}
.titem__d{margin-top:8px;font-size:14.5px;color:var(--muted)}
@media (min-width:640px){.trust__grid{grid-template-columns:1fr 1fr}}
@media (min-width:1040px){
	.trust__in{grid-template-columns:minmax(300px,380px) 1fr;gap:72px;align-items:start}
	.trust__head{position:sticky;top:calc(var(--hdr-h) + 32px);margin:0}
	.trust__grid{gap:16px}
}

/* ---------- ціни (превʼю) ---------- */
.pprev{padding-block:var(--sec);background:var(--navy);color:var(--white)}
.pprev__in{display:grid;gap:36px}
.pprev .eyebrow{color:var(--yellow)}
.pprev .shead__title{color:var(--white)}
.pprev .shead__title em{color:var(--yellow)}
.pprev .shead__sub{color:var(--on-navy)}
.pprev__from{margin-top:18px;font-size:15px;color:var(--on-navy)}
.pprev__from b{color:var(--white);font-size:18px}
.pprev__more{margin-top:18px;background:transparent;color:var(--white);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35)}
.pprev__more:hover{background:var(--white);color:var(--navy)}
.pprev__more .ic{width:20px;height:20px}
.pprev__steps{position:relative;display:grid;gap:10px}
.pstep{position:relative;display:grid;grid-template-columns:48px 1fr;column-gap:16px;padding:20px;border-radius:var(--r-lg);background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px var(--line-navy)}
.pstep__n{grid-row:1/3;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--white);color:var(--navy);font-size:18px;font-weight:800}
.pstep__n .ic{width:24px;height:24px}
.pstep__ic{display:none}
.pstep__t{color:var(--white);font-size:19px}
.pstep__d{margin-top:6px;font-size:14.5px;color:var(--on-navy)}
.pstep--final{background:var(--yellow);box-shadow:none}
.pstep--final .pstep__n{background:var(--navy);color:var(--yellow)}
.pstep--final .pstep__t{color:var(--navy)}
.pstep--final .pstep__d{color:var(--navy)}
@media (min-width:980px){
	.pprev__in{grid-template-columns:minmax(300px,400px) 1fr;gap:72px;align-items:center}
	.pprev__steps{gap:16px}
	.pstep{grid-template-columns:1fr;padding:24px}
	.pstep__n{grid-row:auto;margin-bottom:18px}
	.pstep::after{content:"";position:absolute;right:-16px;top:40px;width:16px;height:2px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.4) 0 4px,transparent 4px 8px)}
	.pstep:last-child::after{display:none}
	.pstep__t{font-size:20px}
}

/* ---------- digital warranty ---------- */
.warranty{padding-block:var(--sec);background:linear-gradient(180deg,var(--white),var(--soft))}
.warranty__in{display:grid;gap:40px}
.warranty__facts{display:grid;gap:12px;margin:24px 0 28px}
.warranty__facts li{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:600;color:var(--navy)}
.warranty__facts .ic{flex:none;width:36px;height:36px;padding:8px;border-radius:10px;background:var(--yellow-soft)}
.warranty .btn .ic{width:20px;height:20px}
.wcard{position:relative;max-width:440px;margin-inline:auto;padding:24px;border-radius:var(--r-lg);background:var(--white);box-shadow:var(--shadow-lg),0 0 0 1px var(--line);overflow:hidden}
.wcard::before{content:"";position:absolute;inset:0 0 auto;height:6px;background:linear-gradient(90deg,var(--yellow),var(--yellow) 60%,var(--navy) 60%)}
.wcard__head{display:flex;align-items:center;gap:12px;padding-bottom:16px;border-bottom:1px dashed var(--line)}
.wcard__logo{height:32px;padding-left:14px;color:var(--navy)}
.wcard__logo b{font-size:28px}
.wcard__logo i{height:3px}
.wcard__logo i:nth-child(1){top:9px;width:11px}
.wcard__logo i:nth-child(2){top:14.5px;width:8px;left:2px}
.wcard__logo i:nth-child(3){top:20px;width:11px}
.wcard__title{font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--navy)}
.wcard__ok{display:inline-flex;align-items:center;gap:5px;margin-left:auto;padding:5px 10px 5px 7px;border-radius:999px;background:#ECFDF3;color:#067647;font-size:12px;font-weight:700}
.wcard__ok .ic{width:16px;height:16px}
.wcard__rows{display:grid;gap:12px;margin:18px 0 0}
.wcard__rows div{display:grid;grid-template-columns:120px 1fr;gap:12px;font-size:14.5px}
.wcard__rows dt{color:var(--muted)}
.wcard__rows dd{margin:0;color:var(--navy);font-weight:600}
.wcard__until{padding-top:12px;border-top:1px solid var(--line)}
.wcard__until dd{color:var(--blue);font-weight:800;font-size:17px}
.wcard__foot{display:flex;align-items:center;gap:8px;margin-top:18px;font-size:12.5px;color:var(--muted)}
@media (min-width:980px){
	.warranty__in{grid-template-columns:1fr 1fr;gap:80px;align-items:center}
	.wcard{transform:rotate(-2deg)}
}

/* ---------- відгуки ---------- */
.reviews{padding-block:var(--sec)}
.reviews__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;max-width:none}
.reviews__google{display:inline-flex;align-items:center;gap:10px;padding:12px 18px 12px 14px;border-radius:999px;background:var(--soft);color:var(--navy);font-weight:700;transition:background-color .2s}
.reviews__google:hover{background:var(--yellow)}
.reviews__google .ic{width:20px;height:20px}
.reviews__grid{display:grid;gap:14px}
.rcard{display:flex;flex-direction:column;padding:22px;border-radius:var(--r-lg);background:var(--white);box-shadow:0 0 0 1px var(--line)}
.rcard__top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.rcard__stars{display:inline-flex;gap:2px}
.rcard__stars .ic{width:18px;height:18px;color:#D3DAE6}
.rcard__stars .is-on{color:var(--yellow-2)}
.rcard__src{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.rcard__text{margin:16px 0 20px;font-size:15.5px;line-height:1.55;color:var(--text)}
.rcard__foot{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:16px;border-top:1px solid var(--line)}
.rcard__ava{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;background:var(--navy);color:var(--yellow);font-weight:800}
.rcard__foot b{display:block;color:var(--navy);font-size:15px}
.rcard__foot small{display:block;font-size:13px;color:var(--muted)}
@media (min-width:640px){.reviews__grid{grid-template-columns:1fr 1fr}}
@media (min-width:1100px){.reviews__grid{grid-template-columns:repeat(4,1fr);gap:20px}}

/* ---------- виклики: доповнення до .case ---------- */
.cases__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;max-width:none}
.cases__head .shead__sub{max-width:52ch}
.cases__all{margin:0 0 6px}
.case__head{justify-content:space-between;border-bottom:0;padding-bottom:0}
.case__num{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.case__num b{color:var(--navy)}
.case__stamp{position:static;transform:rotate(-3deg)}
.case__who{display:flex;align-items:center;gap:12px;margin-top:16px;padding-bottom:16px;border-bottom:1px dashed var(--line)}
.case__more{display:inline-flex;align-items:center;gap:6px;margin-left:auto;font-weight:700;font-size:13.5px}
.case__more .ic{width:16px;height:16px;color:var(--blue);transition:transform .25s var(--ease)}
.case__more:hover .ic{transform:translateX(3px)}
.cases--archive{padding-top:clamp(40px,6vw,72px)}
.case--single{margin-bottom:32px}
.case__photo{margin:0 0 32px;border-radius:var(--r-lg);overflow:hidden}

/* ---------- final cta: доповнення ---------- */
.cta__logo{height:36px;margin-bottom:22px;color:var(--yellow)}
.cta__logo b{font-size:32px;color:var(--white)}
.cta__call{margin-top:10px;font-size:clamp(28px,4vw,44px);font-weight:800;line-height:1;letter-spacing:-.03em;text-transform:uppercase;color:var(--white)}
.cta__call em{color:var(--yellow)}
.cta__note{display:flex;align-items:center;justify-content:center;gap:8px;font-size:14px;color:var(--on-navy)}
.cta__note .ic{width:18px;height:18px;color:var(--yellow)}

/* ---------- сторінка несправності ---------- */
.prob{padding-block:clamp(40px,6vw,72px) var(--sec)}
.prob__in{display:grid;gap:32px}
.prob__main{display:grid;gap:16px}
.prob__block{padding:24px;border-radius:var(--r-lg);background:var(--white);box-shadow:0 0 0 1px var(--line)}
.prob__block--diy{background:var(--soft);box-shadow:none}
.prob__block--call{background:var(--navy);color:var(--on-navy)}
.prob__block--call .prob__h{color:var(--white)}
.prob__block--call .prob__h .ic{background:var(--yellow);color:var(--navy)}
.prob__h{display:flex;align-items:center;gap:12px;font-size:22px}
.prob__h .ic{width:40px;height:40px;padding:8px;border-radius:12px;background:var(--yellow-soft);color:var(--navy)}
.prob__causes{display:grid;gap:12px;margin-top:18px}
.prob__causes li{display:flex;gap:12px;font-size:16px;line-height:1.45;color:var(--ink)}
.prob__causes span{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--navy);color:var(--yellow);font-size:13px;font-weight:800}
.prob__diy{display:grid;gap:12px;margin-top:18px}
.prob__diy li{display:flex;gap:10px;font-size:15.5px;line-height:1.45;color:var(--ink)}
.prob__diy .ic{flex:none;width:22px;height:22px;color:var(--blue)}
.prob__block--call p{margin-top:14px;font-size:16px;line-height:1.55;color:var(--white)}
.prob__cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:22px}
.prob__price{font-size:14px;color:var(--on-navy)}
.prob__price b{color:var(--yellow)}
.prob__sh{font-size:18px;margin-bottom:12px}
.prob__devices{display:grid;gap:8px}
.prob__devices a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:var(--soft);color:var(--navy);font-weight:700;font-size:15px}
.prob__devices a:hover{background:var(--yellow-soft)}
.prob__devices a>.ic:first-child{width:36px;height:36px;padding:7px;border-radius:10px;background:var(--white)}
.prob__devices span{flex:1}
.prob__devices small{display:block;font-weight:500;font-size:12.5px;color:var(--muted)}
.prob__devices a>.ic:last-child{width:18px;height:18px;color:var(--blue)}
.prob__phone{margin-top:20px;padding:20px;border-radius:var(--r-lg);background:var(--yellow-soft);color:var(--navy)}
.prob__phone p{font-size:14.5px}
.prob__phone a{display:inline-flex;align-items:center;gap:8px;margin-top:10px;color:var(--navy);font-size:20px;font-weight:800}
.prob__phone .ic{color:var(--blue)}
@media (min-width:980px){
	.prob__in{grid-template-columns:1fr 340px;gap:56px;align-items:start}
	.prob__side{position:sticky;top:calc(var(--hdr-h) + 32px)}
}

/* ---------- перевірка гарантії ---------- */
.wcheck{padding-block:clamp(40px,6vw,72px) var(--sec)}
.wcheck__in{display:grid;gap:32px}
.wcheck__form{display:grid;gap:14px;padding:24px;border-radius:var(--r-lg);background:var(--soft)}
.wcheck__form .btn{justify-self:start}
.wcheck__result{padding:18px 20px;border-radius:14px;background:var(--white);box-shadow:0 0 0 1px var(--line)}
.wcheck__result dl{display:grid;gap:8px}
.wcheck__result div{display:grid;grid-template-columns:140px 1fr;gap:10px;font-size:15px}
.wcheck__result dt{color:var(--muted)}
.wcheck__result dd{margin:0;color:var(--navy);font-weight:600}
.wcheck__result.is-bad{background:#FEF3F2;color:#B42318;box-shadow:none}
.wcheck__fallback{padding:14px 16px;border-radius:12px;background:var(--yellow-soft);color:var(--navy);font-size:14.5px}
.wcheck__about h2{font-size:24px;margin-bottom:16px}
.wcheck__about ul{display:grid;gap:14px}
.wcheck__about li{display:flex;gap:12px;font-size:15.5px;line-height:1.5}
.wcheck__about .ic{flex:none;width:36px;height:36px;padding:8px;border-radius:10px;background:var(--yellow-soft);color:var(--navy)}
.wcheck__about b{color:var(--navy)}
@media (min-width:980px){.wcheck__in{grid-template-columns:1fr 1fr;gap:64px;align-items:start}.wcheck__form{padding:32px}}

/* ---------- меню на 1140–1359: ховаємо другорядні пункти ---------- */
@media (min-width:1140px) and (max-width:1919px){.nav__item--minor{display:none}}
@media (min-width:1560px){.hdr .wrap{max-width:calc(1480px + var(--gut) * 2)}}
@media (min-width:1920px){.hdr .wrap{max-width:calc(1660px + var(--gut) * 2)}}
@media (min-width:1140px) and (max-width:1559px){.hdr__in{gap:14px}.hdr__cta .btn__arrow{display:none}.hdr .lang a{padding:6px 8px}.nav__link,.nav__list>li>a{padding:10px 9px}}
@media (min-width:1140px) and (max-width:1359px){.nav__item--mid{display:none}.hdr__in{gap:14px}}

/* ---------- 1.1.0: приклад талона, нижній рядок підвалу ---------- */
.wcard__sample{display:inline-flex;margin:16px 0 0;padding:6px 12px;border-radius:999px;background:var(--yellow-soft);color:var(--navy);font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.ftr__links{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
.order__legal a{color:inherit;text-decoration:underline;text-underline-offset:2px}
