@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Manrope:wght@700;800&display=swap');

:root{
  --primary:#FF7A00;
  --secondary:#2BB673;
  --surface:#FFF7ED;
  --text:#1C1C1C;
  --muted:#6B6B6B;
  --line:#EFE7DC;
  --bg:#FFFFFF;
  --danger:#E53935;
  --page-bg:none;

  --radius:16px;
  --shadow:0 8px 24px rgba(28,28,28,.08);
  --shadow-soft:0 6px 18px rgba(28,28,28,.06);

  --tl-gap:20px;

  /* Safe area insets для устройств с вырезами */
  --safe-area-top: env(safe-area-inset-top);
  --safe-area-bottom: env(safe-area-inset-bottom);
  --safe-area-left: env(safe-area-inset-left);
  --safe-area-right: env(safe-area-inset-right);
}

html{ scroll-behavior:smooth }
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Arial, sans-serif;
  color:var(--text);
  background-color:var(--bg);
  background-image:var(--page-bg);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  background-attachment:fixed;
  overflow-x:hidden;
  line-height:1.55;
}

/* Skeleton shimmer */
img.skel{
  background:
    linear-gradient(100deg, #eee 8%, #f5f5f5 18%, #eee 33%) 0 0/200% 100% no-repeat;
  animation: shimmer 1.2s linear infinite;
  color:transparent;
}
img.skel.is-loaded{ animation:none;background:none; }
@keyframes shimmer{ 0%{background-position:200% 0} 100%{background-position:-200% 0} }

/* Layout */
.container{
  max-width:1200px;
  margin:0 auto;
  padding:0 20px;
  padding-left:max(20px, var(--safe-area-left));
  padding-right:max(20px, var(--safe-area-right));
}
.section{
  padding:88px 0;
  background-image:var(--page-bg);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  background-attachment:fixed;
}
.section.alt{
  background-color:rgba(255,255,255,.9);
  -webkit-backdrop-filter:saturate(140%) blur(12px);
  backdrop-filter:saturate(140%) blur(12px);
}
h1,h2,h3{font-family:Manrope, Inter, sans-serif;margin:0 0 12px}
h1{font-size:clamp(32px,6vw,60px);line-height:1.1;font-weight:800}
h2{font-size:clamp(26px,4vw,38px);font-weight:700}
h3{font-size:clamp(20px,2.6vw,24px);font-weight:700}
.lead{font-size:clamp(16px,2.2vw,20px);color:var(--muted);line-height:1.6}
.muted{color:var(--muted)}

/* Улучшенная читаемость на мобильных */
@media (max-width:720px){
  body{
    font-size:16px;
    -webkit-text-size-adjust:100%;
    -moz-text-size-adjust:100%;
    text-size-adjust:100%;
  }
  p{
    line-height:1.65;
    margin-bottom:14px;
  }
}

.btn{
  display:inline-flex;align-items:center;justify-content:center;
  height:44px;padding:0 18px;border-radius:12px;border:1px solid var(--line);
  text-decoration:none;color:var(--text);background:#fff;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
  will-change:transform;
}
.btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-soft)}
.btn:active{transform:translateY(0)}
.btn-primary{background:var(--primary);color:#fff;border-color:transparent}
.btn-primary:hover{box-shadow:0 10px 26px rgba(255,122,0,.28)}
.btn-ghost{background:transparent}
.btn-whatsapp{background:#25D366;color:#fff;border-color:#25D366}
.btn-whatsapp:hover{box-shadow:0 10px 26px rgba(37,211,102,.28);background:#22c05e}
.btn-telegram{background:#229ED9;color:#fff;border-color:#229ED9}
.btn-telegram:hover{box-shadow:0 10px 26px rgba(34,158,217,.28);background:#1f8fc6}
.btn-outline{background:#fff;border-color:var(--text);}

/* Header */
.site-header{
  position:sticky;top:0;left:0;right:0;z-index:60;
  background-color:rgba(255,255,255,0);
  backdrop-filter:saturate(180%) blur(10px);
  border-bottom:1px solid transparent;
  transition:box-shadow .2s ease, background-color .3s ease, border-bottom-color .3s ease, transform .2s ease;
  padding-top:var(--safe-area-top);
}
.site-header.is-scrolled{
  box-shadow:0 8px 24px rgba(28,28,28,.06);
  background-color:rgba(255,255,255,.9);
  border-bottom-color:var(--line);
}
.header-inner{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:16px;
  min-height:70px;
  padding-left:max(12px, var(--safe-area-left));
  padding-right:max(12px, var(--safe-area-right));
}

/* Nav */
.nav{
  display:flex;
  gap:8px;
  align-items:center;
  flex:1;
  justify-content:space-between;
  min-width:0;
  flex-wrap:nowrap;
}
.nav a{
  display:inline-flex;align-items:center;justify-content:center;
  height:38px;padding:0 6px;border-radius:12px;text-decoration:none;
  color:var(--muted);font-weight:600;font-size:14px;
  transition: color .18s ease, transform .15s ease;
  white-space: nowrap;
  flex-shrink:0;
}
.nav a:hover{color:var(--text)}
.nav a.active{color:#fff;background:var(--primary);border:1px solid var(--primary)}
.nav a.active:hover{transform:translateY(-1px)}

/* CTA */
.cta{display:flex;align-items:center;gap:10px}
.icon-link{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--line);border-radius:12px;color:var(--text);text-decoration:none}
.icon-link:hover{box-shadow:var(--shadow-soft)}
.icon-link.wa svg,.icon-link.tg svg{display:block}
.icon-link.max-link{width:auto;gap:8px;padding:0 12px;font-weight:800;font-size:14px}
.icon-link.max-link img{height:24px;width:auto;display:block}

/* MAX logo sizing in contact lists/footer */
.footer-contacts img{width:24px;height:24px;object-fit:contain;display:block}
.desktop-only{display:inline-flex}
.mobile-nav-inline{
  display:none;
  width:100%;
  align-items:center;
  gap:10px;
}
.mobile-logo img{
  height:38px;
  width:auto;
  display:block;
}
.mobile-nav-links{
  display:flex;
  gap:8px;
  justify-content:center;
  width:100%;
}
.mobile-nav-links a{
  flex:1;
  text-align:center;
  text-decoration:none;
  border:1px solid var(--line);
  border-radius:10px;
  padding:6px 12px;
  font-weight:600;
  color:var(--text);
  background:#fff;
  font-size:14px;
}
.brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
}
.brand img{
  height:50px;
  width:auto;
  display:block;
}

/* Burger */
.hamburger{
  display:none;
  background:none;
  border:0;
  padding:8px;
  width:40px;
  height:40px;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  flex-direction:column;
  gap:4px;
}
.hamburger span{
  display:block;
  width:24px;
  height:2px;
  background:var(--text);
}

/* Mobile nav */
@media (max-width:1200px){
  .header-inner{
    display:flex;
    align-items:center;
    gap:10px;
  }
  .nav{
    position:fixed;
    inset:66px 0 auto 0;
    display:grid;
    flex:auto;
    justify-content:center;
    grid-template-columns:1fr;
    min-width:initial;
    gap:8px;
    padding:14px 16px;
    padding-left:max(16px, var(--safe-area-left));
    padding-right:max(16px, var(--safe-area-right));
    background:rgba(255,255,255,.98);
    backdrop-filter:blur(6px);
    border-bottom:1px solid var(--line);
    transform:translateY(-8px);
    opacity:0;
    pointer-events:none;
    transition:transform .18s ease, opacity .18s ease;
    grid-auto-rows:min-content;
    max-height:calc(100vh - 66px);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
  }
  .site-header.open .nav{transform:translateY(0);opacity:1;pointer-events:auto}
  .nav a{
    height:48px;
    justify-content:center;
    text-align:center;
    width:100%;
    padding:0 14px;
    border:1px solid var(--line);
    border-radius:14px;
    background:#fff;
    color:var(--text);
    overflow:hidden;
    text-overflow:ellipsis;
    font-size:16px;
  }
  .nav a.active{background:var(--primary);color:#fff;border-color:var(--primary)}
  .desktop-only{display:none}
  .cta .icon-link,
  .cta .btn{display:none !important}
  .cta{display:none}
  .hamburger{display:inline-flex;cursor:pointer}
  .brand{display:none}
  .mobile-nav-inline{
    display:flex;
    align-items:center;
    width:100%;
    gap:10px;
  }
  .mobile-nav-links{
    flex:1;
    display:flex;
    justify-content:center;
    gap:10px;
  }
  .mobile-fab{display:flex}
}

/* HERO */
.hero{
  position:relative;
  padding:88px 0;
  background-color:rgba(255,255,255,.9);
  background-image:var(--page-bg);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  background-attachment:fixed;
  -webkit-backdrop-filter:saturate(140%) blur(12px);
  backdrop-filter:saturate(140%) blur(12px);
  overflow:visible;
  z-index:2;
}
.hero-inner{display:grid;grid-template-columns:1.1fr .9fr;gap:32px;align-items:center}
.badges{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0 0;padding:0}
.badges li{list-style:none;background:#fff;border:1px solid var(--line);padding:6px 10px;border-radius:999px;color:var(--muted)}

/* HERO COLLAGE */
.hero-collage{position:relative;height:460px}
.hero-collage img{
  position:absolute;border-radius:18px;border:1px solid var(--line);box-shadow:var(--shadow);
  will-change:transform; /* для плавности JS-анимации */
}
.hero-slider-nav{display:none}
.hero-collage .a{ top:0;     left:-5%;    width:70%; z-index:2 }
.hero-collage .b{ top:-10%;   right:-18%;   width:60%; z-index:3 }
.hero-collage .c{ bottom:6%; left:10%;  width:55%; z-index:1 }
.hero-collage .d{ bottom:-15%; right:-20%; width:60%; z-index:4 }

/* Cards */
.grid{display:grid;gap:20px}
.cards-4{grid-template-columns:repeat(4,1fr)}
.cards-3{grid-template-columns:repeat(3,1fr)}
.card{
  background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;
  box-shadow:var(--shadow-soft);transition:transform .2s ease, box-shadow .2s ease;
  display:flex;flex-direction:column;
  text-align:center;
}
.card > :not(img):not(.step-num):not(.sla){
  padding-inline:20px;
  margin:0;
}
.card > :not(img):not(.step-num):not(.sla):first-of-type{
  margin-top:20px;
}
.card > :not(img):not(.step-num):not(.sla) + :not(img):not(.step-num):not(.sla){
  margin-top:12px;
}
.card > :not(img):not(.step-num):not(.sla):last-child{
  padding-bottom:20px;
}
.card h3{
  margin:0;
}
.card p{
  margin:0;
}
.card .sla{
  text-align:left;
  margin:12px 0 20px;
  padding-inline:26px;
}
.card img{width:100%;height:auto;display:block}
.cards-4 .card img{ aspect-ratio:10/7; object-fit:cover }
.cards-3 .card img{ aspect-ratio:4/3;  object-fit:cover }

/* Steps */
.step{position:relative}
.step-num{
  position:absolute;top:12px;left:12px;width:36px;height:36px;border-radius:10px;
  background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--muted)
}

/* BENEFITS — DIAGONAL STEPPER */
.benefits-stepper{
  background-color:rgba(255,255,255,.9);
  background-image:var(--page-bg);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  background-attachment:fixed;
  -webkit-backdrop-filter:saturate(140%) blur(12px);
  backdrop-filter:saturate(140%) blur(12px);
}
.stepper{position:relative;display:grid;gap:28px}
.stepper::before{
  content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;transform:translateX(-50%);
  background:var(--primary);
}
.stepper-item{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center;position:relative}
.stepper-item.reverse .media{order:2}
.stepper-item.reverse .content{order:1}
.stepper-item .media img{
  width:100%;height:auto;border-radius:18px;border:1px solid var(--line);box-shadow:var(--shadow-soft);
  aspect-ratio:16/10; object-fit:cover
}
.stepper-item .content{
  position:relative;background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:var(--shadow-soft)
}
/* отступ контента от центра */
.benefits-stepper .stepper-item:not(.reverse) .content{ margin-left:10px }
.benefits-stepper .stepper-item.reverse .content{ margin-right:10px }
/* маркер ближе к центру */
.stepper-item .marker{
  position:absolute;top:-16px;width:40px;height:40px;border-radius:50%;
  background:#fff;border:2px solid var(--primary);display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 20px rgba(255,122,0,.18);font-weight:800;color:var(--primary)
}
.benefits-stepper .stepper-item:not(.reverse) .content .marker{ left: calc(-16px - 15px) }
.benefits-stepper .stepper-item.reverse .content .marker{ right: calc(-16px - 15px) }

.section.delivery{
  position:relative;
  overflow:hidden;
  background:#fef7ee;
  min-height: 810px;
  padding:72px 0 72px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
}
.section.delivery > .container{
  position:relative;
  z-index:2;
  width:100%;
  margin-top:40px;
}
.delivery-track{
  position:absolute;
  inset:-320px 0 0;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
}
.delivery-track__frame{
  position:absolute;
  inset:-2% 0 -2%;
  width:100%;
  height:104%;
  border:0;
  display:block;
  pointer-events:none;
}
.delivery-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(260px,320px));
  grid-auto-rows:1fr;
  gap:24px;
  width:100%;
  align-items:stretch;
  justify-content:center;
}
.delivery-card{
  --delivery-gradient:linear-gradient(130deg,#a8c8ff 0%,#5a8fe4 60%,#2451b7 100%);
  --delivery-border:rgba(36,86,188,.6);
  --delivery-inner:linear-gradient(185deg,rgba(199,220,255,.92) 0%, rgba(157,192,247,.88) 65%, rgba(132,173,235,.85) 100%);
  position:relative;
  display:flex;
  flex-direction:column;
  gap:16px;
  border-radius:24px;
  border:1px solid var(--delivery-border);
  padding:20px 20px 0px;
  height:100%;
  overflow:hidden;
  box-shadow:0 18px 36px rgba(13,34,62,.14);
  background:transparent;
}
.delivery-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:var(--delivery-gradient);
  z-index:0;
  pointer-events:none;
}
.delivery-card::after{
  content:"";
  position:absolute;
  inset:5px;
  border-radius:19px;
  background:var(--delivery-inner);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.4);
  z-index:1;
  pointer-events:none;
}
.delivery-card:nth-of-type(even){
  --delivery-gradient:linear-gradient(140deg,#dcfbf0 0%,#8de7d2 45%,#3ec3f3 100%);
  --delivery-border:rgba(45,156,176,.35);
  --delivery-inner:linear-gradient(190deg,rgba(218,250,245,.95) 0%, rgba(204,241,235,.92) 60%, rgba(196,239,241,.88) 100%);
}
.delivery-card__content{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:12px;
  color:#0b0b0b;
  z-index:2;
}
.delivery-card__content h3{margin:0;color:#0b0b0b;letter-spacing:.02em;}
.delivery-card__content p{margin:0;color:#0b0b0b}
.delivery-card .sla{
  margin:0;
  padding-left:18px;
  color:#0b0b0b;
}
.delivery-card .sla li{margin-bottom:6px}
.delivery-card .sla li:last-child{margin-bottom:0}
.sla{margin:8px 0 0;color:var(--muted)}

@media (max-width:1080px){
  .delivery-grid{
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  }
}
@media (min-width:1025px){
  .delivery-card{
    margin-top:36px;
  }
}
@media (max-width:900px){
 .delivery-card{
    grid-template-columns:1fr;
  }
  .delivery-card__media{
    width:100%;
    height:auto;
    margin:0;
  }
  .delivery-card__media img{height:auto;}
  .delivery-card__content{
    width:100%;
  }
}

/* Reviews */
.review{
  background:#ffffff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:18px;
  box-shadow:var(--shadow-soft);
}
.review blockquote{margin:0 0 8px;font-size:18px;color:var(--text)}
.review figcaption{color:var(--muted)}

/* Reviews — carousel */
.section.reviews{
  position:relative;
  color:var(--text);
  padding:96px 0 110px;
  overflow:hidden;
}
.section.reviews::before{
  content:"";
  position:absolute;
  inset:0;
  background:#fff8ef;
  backdrop-filter:blur(50px);
  z-index:0;
}
.section.reviews::after{display:none}
.section.reviews > .container{position:relative;z-index:1}

.reviews-heading{display:flex;flex-direction:column;gap:14px;margin-bottom:28px}
.reviews-heading__row{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.reviews-heading__left{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.reviews-heading__row h2{margin:0}
.reviews-subtitle{margin:0;color:var(--muted);max-width:660px}
.reviews-rating{display:flex;align-items:flex-start;gap:12px;padding:14px 18px;border-radius:18px;border:1px solid rgba(15,23,42,.06);background:linear-gradient(140deg,#ffffff 0%,#fff9f0 100%);box-shadow:0 10px 22px rgba(15,23,42,.06);color:var(--text);min-width:180px}
.reviews-rating__stars{font-size:20px;letter-spacing:4px;line-height:1;background:linear-gradient(135deg, #FF9A42 0%, #FF7A00 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.reviews-rating__meta{display:flex;flex-direction:column;line-height:1.2;color:var(--text)}
.reviews-rating__meta strong{font-size:18px;color:var(--text)}
.reviews-rating__meta span{font-size:13px;color:var(--muted)}

.reviews-avito{display:inline-flex;align-items:center;justify-content:center;width:130px;height:46px;border-radius:16px;border:1px solid rgba(15,23,42,.12);background:#ffffff;text-decoration:none;box-shadow:0 16px 30px rgba(15,23,42,.08);transition:transform .18s ease, box-shadow .18s ease;padding:6px 18px}
.reviews-avito img{max-height:100%;max-width:100%;width:auto;height:auto;object-fit:contain;display:block}
.reviews-avito:hover{transform:translateY(-2px);box-shadow:0 22px 36px rgba(15,23,42,.14)}
.reviews-avito:active{transform:translateY(0);box-shadow:0 12px 24px rgba(15,23,42,.08)}

.reviews-carousel{position:relative;margin:0}
.reviews-window{
  position:relative;
  padding:34px 96px 46px;
  border-radius:28px;
  background:linear-gradient(160deg, rgba(8,12,22,.94) 0%, rgba(20,28,43,.9) 50%, rgba(32,44,64,.88) 100%);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 26px 48px rgba(4,8,20,.32);
  overflow:hidden;
}
.reviews-window::before{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.07);
  pointer-events:none;
}
.reviews-window::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(60% 85% at 12% 10%, rgba(90,150,255,.32) 0%, rgba(90,150,255,0) 70%),
    radial-gradient(55% 75% at 88% 12%, rgba(255,130,96,.32) 0%, rgba(255,130,96,0) 68%),
    radial-gradient(50% 110% at 50% 120%, rgba(255,122,64,.24) 0%, rgba(255,122,64,0) 80%);
  mix-blend-mode:screen;
  pointer-events:none;
  opacity:.88;
}
@media (max-width:1024px){
  .reviews-window::after{content:none}
}

.reviews-track{display:flex;gap:28px;overflow-x:auto;padding:12px 0 20px;scroll-snap-type:x mandatory;scroll-padding-inline:104px;-webkit-overflow-scrolling:touch}
.reviews-track::-webkit-scrollbar{display:none}
.reviews-track{scrollbar-width:none}

.review-card{scroll-snap-align:start;background:rgba(255,255,255,.1);backdrop-filter:saturate(200%) blur(22px);border:1px solid rgba(255,255,255,.16);border-radius:20px;padding:22px 24px;box-shadow:0 28px 48px rgba(3,7,16,.35);min-width:320px;max-width:360px;display:flex;flex-direction:column;gap:16px;position:relative;overflow:hidden;transition:transform .24s ease, box-shadow .24s ease}
.review-card::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(145deg, rgba(255,255,255,.2) 0%, rgba(255,255,255,0) 62%);opacity:.7;pointer-events:none}
.review-card::after{content:"";position:absolute;inset:1px;border-radius:inherit;border:1px solid rgba(255,255,255,.14);pointer-events:none;z-index:0}
.review-card:hover{transform:translateY(-4px);box-shadow:0 36px 56px rgba(3,7,16,.42)}
.review-card > *{position:relative;z-index:1}
.review-card__header{display:flex;align-items:flex-start;gap:16px;width:100%;min-height:60px;position:relative;padding-right:110px;}
.review-card__meta{display:flex;flex-direction:column;gap:4px;flex:1 1 auto;min-width:0;}
.review-card__meta strong{font-size:17px;color:#fff}
.review-card__meta span{font-size:13px;color:rgba(220,230,255,.74);display:block;white-space:nowrap;}
.review-card__stars{position:absolute;top: 5px;right:0;margin-left:0;font-size:17px;letter-spacing:3px;line-height:1;display:inline-flex;align-items:center;justify-content:flex-end;min-width:92px;white-space:nowrap;flex:0 0 auto;background:linear-gradient(135deg,#FFE3A6 0%,#FF9658 100%);-webkit-background-clip:text;color:transparent;}
.review-card p{margin:0;font-size:16px;line-height:1.65;color:rgba(245,249,255,.94)}
.review-card__footer{display:flex;align-items:center;justify-content:space-between;font-size:13px;color:rgba(214,224,245,.66);gap:16px;}
.review-card__footer time{font-weight:600;color:#FFBC6F;white-space:nowrap;}
.review-tag{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:rgba(255,188,111,.2);color:#FFBC6F;font-weight:600}

.review-avatar{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:18px;color:#fff;background:linear-gradient(135deg,#FF7A00 0%,#FFB347 100%);box-shadow:0 16px 32px rgba(255,145,54,.35);position:relative;overflow:hidden;flex-shrink:0}
.review-avatar::after{content:attr(data-initials);letter-spacing:.03em}
.review-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.reviews-track article:nth-of-type(2) .review-avatar{background:linear-gradient(135deg,#6366F1 0%,#7C3AED 100%);box-shadow:0 16px 32px rgba(115,125,255,.35)}
.reviews-track article:nth-of-type(3) .review-avatar{background:linear-gradient(135deg,#34D399 0%,#059669 100%);box-shadow:0 16px 32px rgba(34,197,94,.3)}
.reviews-track article:nth-of-type(4) .review-avatar{background:linear-gradient(135deg,#F472B6 0%,#FB7185 100%);box-shadow:0 16px 32px rgba(244,114,182,.3)}
.reviews-track article:nth-of-type(5) .review-avatar{background:linear-gradient(135deg,#22D3EE 0%,#0EA5E9 100%);box-shadow:0 16px 32px rgba(34,211,238,.3)}
.reviews-track article:nth-of-type(6) .review-avatar{background:linear-gradient(135deg,#A855F7 0%,#6366F1 100%);box-shadow:0 16px 32px rgba(168,85,247,.32)}
.reviews-track article:nth-of-type(6n+1) .review-avatar{background:linear-gradient(135deg,#FF7A00 0%,#FFB347 100%);box-shadow:0 16px 32px rgba(255,145,54,.35)}
.reviews-track article:nth-of-type(6n+2) .review-avatar{background:linear-gradient(135deg,#6366F1 0%,#7C3AED 100%);box-shadow:0 16px 32px rgba(115,125,255,.35)}
.reviews-track article:nth-of-type(6n+3) .review-avatar{background:linear-gradient(135deg,#34D399 0%,#059669 100%);box-shadow:0 16px 32px rgba(34,197,94,.3)}
.reviews-track article:nth-of-type(6n+4) .review-avatar{background:linear-gradient(135deg,#F472B6 0%,#FB7185 100%);box-shadow:0 16px 32px rgba(244,114,182,.3)}
.reviews-track article:nth-of-type(6n+5) .review-avatar{background:linear-gradient(135deg,#22D3EE 0%,#0EA5E9 100%);box-shadow:0 16px 32px rgba(34,211,238,.3)}
.reviews-track article:nth-of-type(6n+6) .review-avatar{background:linear-gradient(135deg,#A855F7 0%,#6366F1 100%);box-shadow:0 16px 32px rgba(168,85,247,.32)}

.reviews-nav{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:16px;border:1px solid rgba(255,255,255,.22);background:rgba(4,8,18,.7);color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;line-height:1;cursor:pointer;transition:transform .18s ease,opacity .18s ease, box-shadow .18s ease;z-index:5;backdrop-filter:blur(18px)}
.reviews-nav:hover{transform:translateY(-50%) scale(1.07);box-shadow:0 22px 36px rgba(4,8,18,.4)}
.reviews-nav:active{transform:translateY(-50%) scale(.96)}
.reviews-nav[disabled]{opacity:.28;pointer-events:none;box-shadow:none}
.reviews-nav--prev{left:26px}
.reviews-nav--next{right:26px}

.reviews-progress{margin-top:26px;position:relative;width:100%;height:8px;border-radius:999px;background:rgba(255,255,255,.16);overflow:hidden}
.reviews-progress span{position:absolute;inset:0;background:linear-gradient(90deg,#FF9F74 0%, rgba(255,122,0,0.35) 100%);transform-origin:left center;transform:scaleX(.05);transition:transform .4s ease}

.reviews-carousel::before,
.reviews-carousel::after{display:none}

@media (max-width:1024px){
  .reviews-heading{gap:16px}
  .reviews-heading__row{gap:16px}
  .reviews-heading__left{gap:14px}
  .reviews-track{gap:20px;scroll-padding-inline:60px}
}

@media (max-width:720px){
  .reviews-heading{gap:14px;margin-bottom:22px}
  .reviews-heading__row{gap:14px}
  .reviews-heading__left{gap:10px}
  .reviews-rating{width:100%;justify-content:space-between}
  .reviews-track{scroll-padding-inline:34px}
  .review-card{min-width:280px;max-width:300px;padding:20px}
  .reviews-window{padding:24px 34px 32px}
  .reviews-nav--prev{left:10px}
  .reviews-nav--next{right:10px}
}

@media (max-width:500px){
  .reviews-track{scroll-padding-inline:26px}
  .reviews-heading__row h2{font-size:clamp(24px,6vw,32px)}
  .reviews-subtitle{font-size:14px}
  .reviews-window{padding:22px 24px 28px}
  .reviews-nav--prev{left:6px}
  .reviews-nav--next{right:6px}
}

/* FAQ */
.faq{display:grid;gap:12px}
.faq-item{background:#ffffff;border:1px solid var(--faq-border);border-radius:14px;padding:12px 16px;box-shadow:var(--shadow-soft)}
.faq-item summary{cursor:pointer;font-weight:600;color:var(--text)}
.faq-item p{margin:8px 0 0;color:var(--muted)}

#faq{
  background:linear-gradient(180deg,#101725 0%, #161f2c 100%);
  color:#f2f4f8;
  color-scheme:dark;
}
.faq{display:grid;gap:12px}
.faq-item{background:#ffffff;border:1px solid var(--faq-border);border-radius:14px;padding:12px 16px;box-shadow:var(--shadow-soft)}
.faq-item summary{cursor:pointer;font-weight:600;color:var(--text)}
.faq-item p{margin:8px 0 0;color:var(--muted)}

/* Footer */
.site-footer{
  background:linear-gradient(135deg, #1a1f2e 0%, #252b3d 100%);
  color:#e8ecf4;
  padding:60px 0 0;
  position:relative;
  overflow:hidden;
}

.site-footer::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:1px;
  background:linear-gradient(90deg, transparent 0%, rgba(255,138,60,.3) 50%, transparent 100%);
}

/* Footer Grid */
.footer-grid{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1.3fr;
  gap:40px;
  padding-bottom:40px;
  border-bottom:1px solid rgba(255,255,255,.1);
}

.footer-col{
  display:flex;
  flex-direction:column;
  gap:16px;
}

/* Footer Logo & About */
.footer-logo{
  display:inline-block;
  margin-bottom:8px;
  opacity:0.95;
  transition:opacity .2s ease;
}

.footer-logo:hover{
  opacity:1;
}

.footer-logo img{
  height:40px;
  width:auto;
  display:block;
}

.footer-desc{
  font-size:14px;
  line-height:1.6;
  color:rgba(232,236,244,.75);
  margin:0;
  max-width:280px;
}

/* Social Links */
.footer-social{
  display:flex;
  gap:10px;
  margin-top:8px;
}

.social-link{
  display:flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:10px;
  background:rgba(255,255,255,.08);
  color:#e8ecf4;
  transition:all .25s ease;
  border:1px solid rgba(255,255,255,.08);
}

.social-link:hover{
  background:rgba(255,138,60,.15);
  border-color:rgba(255,138,60,.3);
  transform:translateY(-2px);
}

.social-link.wa:hover{
  background:rgba(37,211,102,.15);
  border-color:rgba(37,211,102,.3);
  color:#25D366;
}

.social-link.tg:hover{
  background:rgba(34,158,217,.15);
  border-color:rgba(34,158,217,.3);
  color:#229ED9;
}

/* Footer Titles */
.footer-title{
  font-size:16px;
  font-weight:700;
  color:#ffffff;
  margin:0 0 4px;
  letter-spacing:0.02em;
}

/* Footer Links */
.footer-links{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.footer-links li{
  margin:0;
}

.footer-links a{
  display:inline-block;
  color:rgba(232,236,244,.75);
  text-decoration:none;
  font-size:14px;
  transition:all .2s ease;
  position:relative;
  padding-left:0;
}

.footer-links a::before{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:0;
  height:1px;
  background:var(--primary);
  transition:width .25s ease;
}

.footer-links a:hover{
  color:#ffffff;
  padding-left:8px;
}

.footer-links a:hover::before{
  width:100%;
}

/* Footer Contacts */
.footer-contacts{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.footer-contacts li{
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-size:14px;
  color:rgba(232,236,244,.75);
  line-height:1.5;
}

.footer-contacts svg{
  flex-shrink:0;
  margin-top:2px;
  opacity:0.7;
}

.footer-contacts a{
  color:rgba(232,236,244,.85);
  text-decoration:none;
  transition:color .2s ease;
}

.footer-contacts a:hover{
  color:#ffffff;
}

.footer-contacts span{
  color:rgba(232,236,244,.75);
}
.footer-max-icon{
  flex-shrink:0;
  margin-top:2px;
  display:inline-flex;
  align-items:center;
}
.footer-max-icon img{
  width:20px;
  height:20px;
  object-fit:contain;
  display:block;
}
.footer-contacts li.footer-max-item{
  align-items:center;
}

.footer-schedule{
  padding-top:4px;
  border-top:1px solid rgba(255,255,255,.1);
  margin-top:4px;
}

/* Footer Bottom */
.footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:24px 0;
  gap:20px;
  flex-wrap:wrap;
}

.footer-bottom-left{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.footer-copyright{
  font-size:14px;
  color:rgba(232,236,244,.85);
  margin:0;
  font-weight:500;
}

.footer-legal{
  font-size:13px;
  color:rgba(232,236,244,.5);
  margin:0;
}

.footer-bottom-right{
  margin-left:auto;
}

.footer-credit-link{
  display:flex;
  align-items:center;
  gap:8px;
  text-decoration:none;
  padding:8px 16px;
  border-radius:10px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  transition:all .25s ease;
}

.footer-credit-link:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,138,60,.2);
  transform:translateY(-1px);
}

.footer-credit-text{
  font-size:13px;
  color:rgba(232,236,244,.65);
}
.rainbow-link{
  font-weight:600;text-decoration:none;position:relative;
  background-image:
    linear-gradient(115deg,#b8860b 0%,#ffd700 25%,#fff4c2 47%,#e0ac00 70%,#f5e1a4 85%,#c07d00 100%),
    radial-gradient(circle,rgba(255,255,255,.92) 20%,rgba(255,255,255,0) 65%),
    radial-gradient(circle,rgba(255,255,255,.8) 18%,rgba(255,255,255,0) 62%),
    radial-gradient(circle,rgba(255,255,255,.75) 22%,rgba(255,255,255,0) 68%);
  background-size:200% 200%,0% 0%,0% 0%,0% 0%;
  background-position:0% 50%,18% 70%,52% 38%,86% 62%;
  background-repeat:no-repeat;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:golden-glimmer 9s ease-in-out infinite;
}
.rainbow-link:hover{opacity:.9}
@keyframes golden-glimmer{
  0%{
    background-position:0% 50%,18% 70%,52% 38%,86% 62%;
    background-size:200% 200%,0% 0%,0% 0%,0% 0%;
  }
  16%{
    background-position:22% 50%,22% 64%,52% 38%,84% 60%;
    background-size:200% 200%,16% 16%,0% 0%,0% 0%;
  }
  20%{
    background-position:28% 50%,24% 58%,52% 38%,82% 58%;
    background-size:200% 200%,0% 0%,0% 0%,0% 0%;
  }
  46%{
    background-position:60% 50%,24% 58%,58% 32%,80% 55%;
    background-size:200% 200%,0% 0%,18% 18%,0% 0%;
  }
  52%{
    background-position:68% 50%,24% 58%,60% 30%,78% 52%;
    background-size:200% 200%,0% 0%,0% 0%,0% 0%;
  }
  74%{
    background-position:100% 50%,22% 64%,60% 30%,82% 58%;
    background-size:200% 200%,0% 0%,0% 0%,14% 14%;
  }
  78%{
    background-position:96% 50%,22% 64%,60% 30%,84% 60%;
    background-size:200% 200%,0% 0%,0% 0%,0% 0%;
  }
  100%{
    background-position:0% 50%,18% 70%,52% 38%,86% 62%;
    background-size:200% 200%,0% 0%,0% 0%,0% 0%;
  }
}

/* Mobile FAB */
.mobile-fab{
  position:fixed;
  right:max(20px, var(--safe-area-right));
  bottom:calc(24px + var(--safe-area-bottom, 0px));
  z-index:60;
  display:none;
  flex-direction:column-reverse;
  align-items:flex-end;
  gap:10px;
  pointer-events:none;
  opacity:1;
  transition:opacity .25s ease;
}
.mobile-fab.is-hidden{opacity:0}
.mobile-fab__button,
.mobile-fab__menu{pointer-events:auto}
.mobile-fab.is-hidden .mobile-fab__button,
.mobile-fab.is-hidden .mobile-fab__menu{pointer-events:none}
.mobile-fab__button{
  pointer-events:auto;
  border:none;
  border-radius:999px;
  padding:12px 15px;
  font-weight:800;
  font-size:21px;
  color:#fff;
  background:linear-gradient(120deg,#ff7a00,#ffb347,#ff7a00);
  background-size:200% 200%;
  animation:fobPulse 3s ease infinite;
  box-shadow:0 12px 28px rgba(255,122,0,.35);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:175px;
}
.mobile-fab__button:focus-visible{outline:3px solid rgba(255,255,255,.6);outline-offset:3px}
.mobile-fab__menu{
  pointer-events:auto;
  position:relative;
  background:rgba(255,255,255,.96);
  border:1px solid var(--line);
  border-radius:16px;
  box-shadow:0 18px 32px rgba(28,28,28,.18);
  width:260px;
  padding:10px;
  display:flex;
  flex-direction:column;
  gap:6px;
  opacity:0;
  transform:translateY(12px);
  pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;
  margin-bottom:8px;
}
.mobile-fab.is-open .mobile-fab__menu{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.mobile-fab__menu a{
  text-decoration:none;
  padding:10px 12px;
  border-radius:12px;
  font-weight:600;
  color:var(--text);
  background:#fff;
  border:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  white-space:nowrap;
}
.mobile-fab__menu a:hover{background:#fff7ed;border-color:#ffd1a3}
@keyframes fobPulse{
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}

/* Улучшенное touch-взаимодействие */
.btn, .icon-link, .nav a, .hamburger, summary {
  -webkit-tap-highlight-color: rgba(255, 122, 0, 0.1);
  touch-action: manipulation;
}

.btn:active, .icon-link:active {
  transform: scale(0.96);
}

/* Предотвращаем bounce на iOS */
body {
  overscroll-behavior-y: none;
  -webkit-overflow-scrolling: touch;
}

/* Reveal */
.reveal{opacity:0;transform:translateY(12px);transition:opacity .6s ease, transform .6s ease}
.reveal.visible{opacity:1;transform:translateY(0)}

/* Tilt */
.tilt-wrap{display:block;width:100%;height:100%}
.tilt-wrap > .tilt{height:100%}
.tilt{transform-style:preserve-3d;transition:transform .15s ease}

/* A11y focus */
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid rgba(255,122,0,.6);outline-offset:3px;border-radius:12px}

/* Responsive */
@media (max-width:1200px){
  .hero-inner{grid-template-columns:1fr}
  .hero-collage{
    position:relative;
    display:block;
    width:min(400px, 100%);
    aspect-ratio:1 / 1;
    margin:0 auto;
    justify-self:center;
    border-radius:22px;
    overflow:hidden;
    background:#fff;
    box-shadow:0 12px 30px rgba(28,28,28,.12);
  }
  .hero-collage img,
  .hero-collage img.parallax{
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    border:none;
    border-radius:inherit;
    opacity:0;
    transition:opacity .45s ease;
    transform:none !important;
  }
  .hero-collage img.is-active{opacity:1}
  .hero-slider-nav{
    display:flex;
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:42px;
    height:42px;
    border-radius:50%;
    border:none;
    background:rgba(0,0,0,.55);
    color:#fff;
    font-size:22px;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    z-index:5;
    transition:background .2s ease;
  }
  .hero-slider-nav span{line-height:1}
  .hero-slider-nav.prev{left:12px}
  .hero-slider-nav.next{right:12px}
  .hero-slider-nav:active{transform:translateY(-50%) scale(.92)}
}
@media (max-width:1080px){
  .cards-4{grid-template-columns:repeat(2,1fr)}
  .delivery-grid{grid-template-columns:1fr}
}
@media (max-width:960px){
  .stepper::before{display:none}
  .stepper-item{grid-template-columns:1fr;gap:12px}
  .stepper-item .media{order:1}
  .stepper-item .content{order:2;margin:0}
  .stepper-item .marker{top:-20px;left:24px;right:auto}
}
@media (max-width:720px){
  body{
    padding-bottom:0;
  }
  .section{padding:64px 0}
  .hero + .section{padding-top:12px}
  .hero{padding:24px 0 24px;}
  .hero-inner{gap:28px}
  .hero-text{text-align:center}
  .hero-text .lead{margin:0 auto;max-width:360px}
  .hero-text h1{padding:0 8px}
  .hero-ctas{display:none}
  .badges{justify-content:center;font-size:13px}
  .badges li{padding:5px 9px}
  .cards-3{grid-template-columns:1fr;gap:16px}
  .cards-4{grid-template-columns:1fr;gap:16px}
  #audience .cards-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  #audience + .section{padding-top:6px}
  #how + .section{padding-top:6px}
  #sets + .section{padding-top:6px}
  .card{
    padding:0 0 12px;
    margin-bottom:0;
    overflow:hidden;
  }
  .card img{
    width:100%;
    height:auto;
    display:block;
    border-radius:0;
  }
  .card > :not(img):not(.step-num):not(.sla){padding-inline:12px}
  .card > :not(img):not(.step-num):not(.sla) + :not(img):not(.step-num):not(.sla){margin-top:10px}
  .card > h3{margin-top:12px}
  .card > p{margin-top:8px;margin-bottom:0}
  .contacts-grid{
    grid-template-columns:1fr;
    gap:20px;
  }

  .mobile-fab{
    display:flex;
    right:max(16px, var(--safe-area-right));
    bottom:max(18px, calc(16px + var(--safe-area-bottom, 0px)));
  }

  /* Contact Card Mobile */
  .contact-card{
    padding:24px 20px;
    gap:20px;
    border-radius:18px;
  }
  .contact-card::after{display:none}
  .contact-card h3{
    font-size:24px;
    line-height:1.3;
  }
  .contact-card__header{
    gap:12px;
  }
  .contact-card__badge{
    font-size:12px;
    padding:5px 12px;
  }
  .contact-card__subtitle{
    font-size:15px;
    line-height:1.6;
  }

  /* Contact List Mobile */
  .contact-list{
    gap:16px;
  }
  .contact-list li{
    align-items:flex-start;
    gap:12px;
  }
  .contact-list__icon{
    flex:0 0 48px;
    width:48px;
    height:48px;
    border-radius:14px;
  }
  .contact-list__icon svg{
    width:24px;
    height:24px;
  }
  .contact-list__label{
    font-size:12px;
    margin-bottom:3px;
  }
  .contact-list a{
    font-size:16px;
    word-break:break-word;
    line-height:1.4;
  }
  .contact-list div{
    flex:1;
    min-width:0;
  }

  /* Contact Footer Mobile */
  .contact-card__footer{
    gap:16px;
  }
  .contact-card__schedule{
    font-size:14px;
  }
  .contact-card__cta{
    width:100%;
    flex-direction:column;
    gap:10px;
  }
  .contact-card__cta .btn{
    flex:1;
    min-width:0;
    width:100%;
    min-height:48px;
    font-size:16px;
  }

  /* Contact Map Mobile */
  .contact-map{
    width:100%;
    min-height:300px;
    border-radius:18px;
  }
  .contact-map__embed{
    padding-top:65%;
  }
  .contact-map__iframe{
    border-radius:18px;
  }
  .contact-map__info{
    left:14px;
    right:14px;
    bottom:14px;
    padding:14px 16px;
    border-radius:14px;
    gap:5px;
  }
  .contact-map__label{
    font-size:11px;
  }
  .contact-map__info strong{
    font-size:15px;
  }
  .contact-map__info span{
    font-size:13px;
  }
  /* Footer адаптация */
  .site-footer{
    padding:48px 0 0;
  }

  .footer-grid{
    grid-template-columns:1fr;
    gap:32px;
    padding-bottom:32px;
  }

  .footer-col{
    gap:14px;
  }

  .footer-about{
    order:-1;
  }

  .footer-desc{
    max-width:100%;
  }

  .footer-title{
    font-size:15px;
    margin-bottom:8px;
  }

  .footer-links{
    gap:9px;
  }

  .footer-links a{
    font-size:15px;
  }

  .footer-contacts{
    gap:11px;
  }

  .footer-contacts li{
    font-size:15px;
  }

  .footer-bottom{
    flex-direction:column;
    align-items:flex-start;
    gap:16px;
    padding:20px 0;
  }

  .footer-bottom-left{
    width:100%;
    gap:8px;
  }

  .footer-bottom-right{
    margin-left:0;
    width:100%;
  }

  .footer-credit-link{
    width:100%;
    justify-content:center;
  }

  .footer-copyright{
    font-size:14px;
  }

  .footer-legal{
    font-size:12px;
  }

  /* Улучшенная типографика для мобильных */
  h1{line-height:1.15;margin-bottom:16px}
  h2{margin-bottom:20px;font-size:30px}
  h3{margin-bottom:10px}
  .lead{line-height:1.6}

  /* Touch-friendly элементы */
  .btn{min-height:48px;font-size:16px;font-weight:600}
  .nav a{font-size:16px}

  /* Оптимизация секций */
  .stepper-item{margin-bottom:16px}
  .stepper-item .content{padding:18px}
  .stepper-item .content h3{font-size:20px;margin-bottom:8px}
  .stepper-item .content p{font-size:15px;line-height:1.65}
  .delivery-card{padding:20px}
  .delivery-card h3{font-size:22px}
  .delivery-card p,.delivery-card .sla{font-size:15px}

  /* Улучшенные отзывы */
  .review{padding:20px}
  .review blockquote{font-size:16px;line-height:1.6}
  .review figcaption{font-size:14px;margin-top:10px}

  /* FAQ оптимизация */
  .faq-item{padding:14px 18px}
  .faq-item summary{font-size:16px;padding:4px 0}
  .faq-item p{font-size:15px;line-height:1.6;margin-top:10px}

  /* Delivery секция */
  .delivery-grid{gap:18px}
  .section.delivery{min-height:810px;padding:72px 0}

  /* Note текст */
  .note{font-size:14px;text-align:center;margin-top:20px;color:var(--muted)}
}

@media (max-width:460px){
  .hero-collage{width:100%;aspect-ratio:1 / 1}
  .container{
    padding:0 16px;
    padding-left:max(16px, var(--safe-area-left));
    padding-right:max(16px, var(--safe-area-right));
  }
  .section{padding:52px 0}
  .section.delivery{padding:72px 0}
  .mobile-fab{
    right:max(12px, var(--safe-area-right));
    bottom:max(12px, calc(12px + var(--safe-area-bottom, 0px)));
  }
  h1{font-size:28px;line-height:1.2}
  h2{font-size:26px}
  h3{font-size:19px}
  .card{padding:0 0 10px;margin-bottom:0;overflow:hidden}
  .card img{width:100%;height:auto;display:block;border-radius:0}
  .card > :not(img):not(.step-num):not(.sla){padding-inline:12px}
  .card > :not(img):not(.step-num):not(.sla) + :not(img):not(.step-num):not(.sla){margin-top:10px}
  .card > h3{margin-top:12px;font-size:19px}
  .card > p{margin-top:8px;margin-bottom:0;font-size:14px}
  .stepper-item .content{padding:16px}
  .stepper-item .content h3{font-size:19px}
  .stepper-item .marker{width:36px;height:36px;font-size:14px}
  /* Contact для маленьких экранов */
  .contact-card{
    padding:20px 18px;
    gap:18px;
  }
  .contact-card h3{
    font-size:22px;
  }
  .contact-card__subtitle{
    font-size:14px;
  }
  .contact-list{
    gap:14px;
  }
  .contact-list__icon{
    flex:0 0 44px;
    width:44px;
    height:44px;
    border-radius:12px;
  }
  .contact-list__icon svg{
    width:22px;
    height:22px;
  }
  .contact-list a{
    font-size:15px;
  }
  .contact-card__cta .btn{
    min-height:46px;
    font-size:15px;
  }
  .contact-map{
    min-height:280px;
  }
  .contact-map__info{
    left:12px;
    right:12px;
    bottom:12px;
    padding:12px 14px;
  }

  .delivery-card{padding:18px}
  .delivery-card h3{font-size:20px}
  .review{padding:18px}
  .faq-item{padding:12px 16px}
}

/* Промежуточные планшетные размеры */
@media (min-width:721px) and (max-width:960px){
  .cards-3{grid-template-columns:repeat(2,1fr)}
  .cards-4{grid-template-columns:repeat(2,1fr)}
  .hero-inner{grid-template-columns:1fr;gap:40px}
  .hero-text{max-width:600px;margin:0 auto;text-align:center}
  .hero-ctas{justify-content:center}
  .badges{justify-content:center}

  /* Footer для планшетов */
  .footer-grid{
    grid-template-columns:repeat(2, 1fr);
    gap:32px;
  }

  .footer-about{
    grid-column:1/-1;
  }
}

/* Footer для средних экранов */
@media (max-width:1080px){
  .footer-grid{
    grid-template-columns:repeat(2, 1fr);
    gap:36px;
  }

  .footer-about{
    grid-column:1/-1;
    max-width:500px;
  }
}

/* Оптимизация для горизонтальной ориентации мобильных */
@media (max-height:500px) and (orientation:landscape){
  .hero{padding:40px 0 32px}
  .section{padding:48px 0}
  .hero-collage{width:min(320px, 70vw);aspect-ratio:1 / 1}
  .mobile-fab{
    right:max(10px, var(--safe-area-right));
    bottom:max(10px, calc(10px + var(--safe-area-bottom, 0px)));
  }
}



/* Contacts */
.contacts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px;align-items:stretch}
.contact-card{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:22px;
  padding:28px;
  border-radius:22px;
  border:1px solid rgba(239,231,220,.5);
  background:#ffffff;
  box-shadow:var(--shadow-soft);
  overflow:hidden;
}
.contact-card::after{
  content:"";
  position:absolute;
  inset:auto -40% -40% auto;
  width:220px;
  height:220px;
  background:radial-gradient(circle, rgba(255,122,0,.08) 0%, rgba(255,122,0,0) 70%);
  pointer-events:none;
}
.contact-card__header{position:relative;z-index:1;display:flex;flex-direction:column;gap:10px}
.contact-card__badge{
  align-self:flex-start;
  padding:6px 14px;
  border-radius:999px;
  background:rgba(255,122,0,.1);
  color:var(--primary);
  font-size:13px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.contact-card__subtitle{margin:0;color:var(--muted);font-size:15px;line-height:1.5}
.contact-list{
  position:relative;
  z-index:1;
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.contact-list li{
  display:flex;
  align-items:center;
  gap:14px;
}
.contact-list__icon{
  flex:0 0 44px;
  width:44px;
  height:44px;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,122,0,.1);
  color:var(--primary);
}
.contact-list__icon svg{width:22px;height:22px}
.contact-list__label{display:block;font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:4px}
.contact-list a{color:var(--text);font-weight:600;text-decoration:none}
.contact-list a:hover{color:var(--primary)}
.contact-faq{
  background:#fff;
  border:1px solid rgba(255,255,255,.12);
  border-radius:22px;
  box-shadow:var(--shadow-soft);
  padding:28px;
  display:flex;
  flex-direction:column;
  gap:22px;
  height:100%;
}
.contact-faq h3{
  margin:0;
  font-size:22px;
}
.contact-faq .faq{
  display:grid;
  gap:12px;
}
.contact-faq .faq-item{
  background:#121b28;
  border:1px solid rgba(255,255,255,.12);
  color:#f8faff;
  box-shadow:0 24px 38px rgba(0,0,0,.4);
}
.contact-faq .faq-item summary{
  color:#ffffff;
}
.contact-faq .faq-item p{
  color:rgba(232,236,248,.78);
}
.contact-card__footer{position:relative;z-index:1;display:flex;flex-direction:column;gap:14px}
.contact-card__schedule{font-size:14px}
.contact-card__cta{display:flex;gap:10px;flex-wrap:wrap}
.contact-card__cta .btn{min-width:130px}
.contact-map{
  position:relative;
  border-radius:22px;
  overflow:hidden;
  box-shadow:var(--shadow-soft);
}
.contact-map__embed{position:relative;padding-top:65%}
.contact-map__iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  border-radius:22px;
}
.contact-map__info{
  position:absolute;
  left:20px;
  bottom:20px;
  padding:14px 18px;
  border-radius:18px;
  background:rgba(255,255,255,.95);
  color:var(--text);
  display:flex;
  flex-direction:column;
  gap:4px;
  box-shadow:0 20px 36px rgba(0,0,0,.15);
  backdrop-filter:blur(6px);
  border:1px solid rgba(0,0,0,.1);
}
.contact-map__label{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--primary);font-weight:600}
.contact-map__info strong{font-size:16px;color:var(--text);font-weight:700}


#contacts{
  background:linear-gradient(180deg,#0f1522 0%, #141d2c 100%);
  color:#f4f6fb;
  color-scheme:dark;
}

#contacts h2{
  color:#ffffff;
}

#contacts .muted{
  color:rgba(232,236,244,.75);
}

#contacts .contact-card{
  background:rgba(17,24,36,.92);
  border:1px solid rgba(255,255,255,.12);
  color:#f4f6fb;
  box-shadow:0 24px 48px rgba(0,0,0,.4);
}

#contacts .contact-card::after{
  background:radial-gradient(circle, rgba(255,186,90,.2) 0%, rgba(255,186,90,0) 70%);
}

#contacts .contact-card h3{
  color:#ffffff;
}

#contacts .contact-card__subtitle{
  color:rgba(227,233,247,.75);
}

#contacts .contact-card__badge{
  background:rgba(255,186,90,.2);
  color:#ffcd81;
}

#contacts .contact-list__label{
  color:rgba(225,232,246,.65);
}

#contacts .contact-list__icon{
  background:rgba(255,186,90,.18);
  color:#ffcd81;
  border:1px solid rgba(255,186,90,.15);
}

#contacts .contact-list a{
  color:#ffffff;
}

#contacts .contact-list a:hover{
  color:#ffcd81;
}

#contacts .contact-card__schedule{
  color:rgba(220,228,245,.65);
}

#contacts .contact-card__cta .btn{
  box-shadow:none;
}

#contacts .contact-card__cta .btn-primary{
  background:var(--primary);
  border-color:var(--primary);
  color:#ffffff;
}

#contacts .contact-card__cta .btn-primary:hover{
  background:#ff8a1f;
  border-color:#ff8a1f;
}

#contacts .contact-card__cta .btn-outline{
  border-color:rgba(255,255,255,.35);
  color:#ffffff;
  background:transparent;
}

#contacts .contact-card__cta .btn-outline:hover{
  border-color:rgba(255,255,255,.5);
  background:rgba(255,255,255,.08);
}

#contacts .contact-map{
  box-shadow:0 24px 48px rgba(0,0,0,.35);
  border:1px solid rgba(255,255,255,.08);
}

#contacts .contact-map__info{
  background:rgba(13,19,30,.92);
  border:1px solid rgba(255,255,255,.12);
  color:#f4f6fb;
  box-shadow:0 20px 40px rgba(0,0,0,.5);
  backdrop-filter:blur(10px);
}

#contacts .contact-map__label{
  color:#ffcd81;
}

#contacts .contact-map__info strong{
  color:#ffffff;
}

#contacts .contact-map__info span{
  color:rgba(228,233,246,.8);
}

/* Производительность и оптимизация */
img, picture, video {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Аппаратное ускорение для анимируемых элементов */
.hero-collage img,
.parallax,
.tilt,
.nav {
  will-change: transform;
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.mobile-fab {
  will-change: transform;
  transform: translate3d(0, var(--fab-translate, 0px), 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Оптимизация скроллинга */
.section,
.card,
.stepper-item {
  will-change: auto;
}

/* Скрываем элементы вне viewport для экономии ресурсов */
@media (max-width: 720px) {
  .hero-collage .parallax {
    will-change: auto;
  }
}

/* Улучшенная загрузка шрифтов */
@font-face {
  font-family: 'Inter';
  font-display: swap;
}

@font-face {
  font-family: 'Manrope';
  font-display: swap;
}

/* Предотвращение FOUT (Flash of unstyled text) */
body {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Улучшенный скроллинг на мобильных */
* {
  -webkit-tap-highlight-color: transparent;
}

/* Оптимизация iframe для доставки */
.delivery-track__frame,
.contact-map__iframe {
  will-change: auto;
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
  .hero-collage img,
  .parallax,
  .tilt {
    will-change: auto !important;
    transform: none !important;
  }
}

/* Dark mode support для системной темы */
@media (prefers-color-scheme: dark) {
  /* Сохраняем светлую тему, но улучшаем контраст для OLED */
  body {
    -webkit-font-smoothing: antialiased;
  }
}

/* Дополнительные оптимизации для очень маленьких экранов */
@media (max-width: 360px) {
  h1 { font-size: 26px; }
  h2 { font-size: 24px; }
  .container { padding: 0 14px; }
  .card, .stepper-item .content, .review, .delivery-card { padding: 14px; }
  .hero { padding: 56px 0 44px; }
  .section { padding: 48px 0; }

  /* Contacts для очень маленьких экранов */
  .contact-card{
    padding:18px 16px;
    gap:16px;
  }
  .contact-card h3{
    font-size:20px;
  }
  .contact-card__badge{
    font-size:11px;
    padding:4px 10px;
  }
  .contact-card__subtitle{
    font-size:14px;
  }
  .contact-list{
    gap:12px;
  }
  .contact-list li{
    gap:10px;
  }
  .contact-list__icon{
    flex:0 0 10px;
    width:40px;
    height:40px;
    border-radius:11px;
  }
  .contact-list__icon svg{
    width:20px;
    height:20px;
  }
  .contact-list__label{
    font-size:11px;
  }
  .contact-list a{
    font-size:14px;
  }
  .contact-card__cta .btn{
    min-height:44px;
    font-size:14px;
  }
  .contact-map{
    min-height:260px;
  }
  .contact-map__embed{
    padding-top:70%;
  }
  .contact-map__info{
    left:10px;
    right:10px;
    bottom:10px;
    padding:10px 12px;
    gap:3px;
  }
  .contact-map__label{
    font-size:10px;
  }
  .contact-map__info strong{
    font-size:14px;
  }
  .contact-map__info span{
    font-size:12px;
  }

  /* Footer для маленьких экранов */
  .site-footer{
    padding:40px 0 0;
  }

  .footer-grid{
    gap:28px;
    padding-bottom:28px;
  }

  .footer-social{
    justify-content:flex-start;
  }

  .social-link{
    width:38px;
    height:38px;
  }

  .footer-title{
    font-size:14px;
  }

  .footer-links a,
  .footer-contacts li{
    font-size:14px;
  }

  .footer-bottom{
    padding:18px 0;
  }

  .footer-copyright{
    font-size:13px;
  }

  .footer-legal{
    font-size:11px;
  }

  .footer-credit-link{
    padding:6px 14px;
  }

  .footer-credit-text{
    font-size:12px;
  }
}

/* Оптимизация для устройств с низким разрешением */
@media (max-resolution: 1dppx) {
  img {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
  }
}

/* Оптимизация для устройств с высоким разрешением (Retina) */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
}

/* Улучшения для accessibility */
@media (prefers-contrast: high) {
  .btn, .card, .nav a {
    border-width: 2px;
  }

  .btn-primary, .btn-whatsapp, .btn-telegram {
    font-weight: 700;
  }
}

/* Оптимизация для устройств с низким энергопотреблением */
@media (prefers-reduced-data: reduce) {
  /* Отключаем фоновые изображения и тяжелые эффекты */
  .delivery-track {
    display: none;
  }

  .hero-collage img.parallax {
    will-change: auto;
  }

  * {
    background-image: none !important;
  }
}

/* Печать */
@media print {
  .site-header,
  .mobile-fab,
  .hamburger,
  .hero-collage,
  .delivery-track,
  iframe {
    display: none !important;
  }

  body {
    background: white;
    color: black;
    font-size: 12pt;
  }

  .section {
    page-break-inside: avoid;
    padding: 20pt 0;
  }

  a[href^="tel:"]::after,
  a[href^="mailto:"]::after {
    content: " (" attr(href) ")";
  }
}

/* Улучшенная поддержка старых браузеров */
@supports not (backdrop-filter: blur(10px)) {
  .site-header {
    background-color: rgba(255, 255, 255, 0.95);
  }

  .mobile-fab {
    background: rgba(255, 255, 255, 0.98);
  }

  .nav {
    background: rgba(255, 255, 255, 0.98);
  }
}

/* Улучшенная поддержка CSS Grid для старых браузеров */
@supports not (display: grid) {
  .grid,
  .cards-3,
  .cards-4,
  .delivery-grid,
  .contacts-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
  }

  .card {
    flex: 1 1 300px;
  }
}
