/* mobile-app.css - общий мобильный каркас (этап 1, 29.10.2026).
   Подключается ПОСЛЕ aura.css|aura3.css(+v5.css). Граница та же, что у существующих правил: 768px.
   Слои закреплённых элементов (снизу вверх): .mobbar -> контекстное (#buybar) -> cookie -> qbar -> drawer.
   Единый источник отступов: --ma-mb, --ma-ctx, --ma-stack (старые --mb/--stack ссылаются на них). */

:root{
  --ma-mb-h:74px;
  --ma-ctx-h:76px;
  --ma-z-mobbar:70;
  --ma-z-ctx:72;
  --ma-z-cookie:74;
}

@media (max-width:768px){
  body{
    --ma-mb:calc(var(--ma-mb-h) + env(safe-area-inset-bottom,0px));
    --ma-ctx:0px;
    --ma-stack:calc(var(--ma-mb) + var(--ma-ctx));
    --mb:var(--ma-mb);
    --stack:var(--ma-stack);
  }
  body.has-buybar{--ma-ctx:var(--ma-ctx-h)}

  /* слои: значения совпадают с прежними, теперь заданы в одном месте */
  .mobbar{z-index:var(--ma-z-mobbar)}
  body.has-buybar #buybar{z-index:var(--ma-z-ctx)}
  .cookie-bar{z-index:var(--ma-z-cookie)}

  /* safe area по бокам (альбомная ориентация, вырез) */
  .cookie-bar{
    left:max(10px,env(safe-area-inset-left,0px))!important;
    right:max(10px,env(safe-area-inset-right,0px))!important;
  }
  body .callback-btn{right:max(12px,env(safe-area-inset-right,0px))}
  body .to-top{right:max(14px,env(safe-area-inset-right,0px))}

  /* открытый cookie не должен закрывать конец страницы: --cookie-top = высота от низа экрана до верха панели */
  html body.cookie-on{padding-bottom:calc(var(--cookie-top,var(--ma-stack)) + 24px)!important}

  /* второстепенные плавающие элементы скрыты: ввод в поле (экранная клавиатура), форма в зоне видимости,
     открытый поиск или диалог. Выход из состояния снимает класс/условие и возвращает всё как было. */
  body.ma-typing .callback-btn,
  body.ma-typing .to-top,
  body.ma-form-view:not(:has(.callback-pop.show)) .callback-btn,
  body.ma-form-view .to-top,
  body:has(#qbar.open, .later-pop, .at-sz:not([hidden])) .callback-btn,
  body:has(#qbar.open, .later-pop, .at-sz:not([hidden])) .to-top{
    visibility:hidden!important;
    pointer-events:none!important;
  }

  /* видимый фокус в панелях */
  .mobbar a:focus-visible,
  .drawer a:focus-visible,
  .drawer button:focus-visible,
  .qbar button:focus-visible,
  .qbar input:focus-visible{outline:2px solid currentColor;outline-offset:-3px}
}

/* короткий экран (клавиатура, альбомная ориентация): плавающие кнопки занимают слишком много */
@media (max-width:768px) and (max-height:560px){
  body .callback-btn,
  body .to-top{visibility:hidden!important;pointer-events:none!important}
  body:has(.callback-pop.show) .callback-btn{visibility:visible!important;pointer-events:auto!important}
}

@media (prefers-reduced-motion:reduce){
  .drawer,.qbar{transition-duration:.01ms!important}
}

/* ======================================================================
   Главная (этап 2, 29.10.2026): компактный мобильный вход. Только <=767px; десктоп не затронут.
   ====================================================================== */
@media (min-width:768px){
  /* десктоп: обёртка прозрачна для вёрстки, дерево боксов как в оригинале */
  details.ma-fold,details.ma-fold::details-content{display:contents}
  details.ma-fold>summary.ma-sum{display:none}
}
@media (max-width:767px){
  /* раскрытия */
  details.ma-fold>summary.ma-sum{
    display:flex;align-items:center;justify-content:space-between;gap:10px;list-style:none;cursor:pointer;
    min-height:48px;padding:0 16px;border:1px solid rgba(0,0,0,.14);border-radius:12px;background:#fff;
    font-weight:600;font-size:15px;line-height:1.3;-webkit-tap-highlight-color:transparent;
  }
  details.ma-fold>summary.ma-sum::-webkit-details-marker{display:none}
  details.ma-fold>summary.ma-sum::after{
    content:"";flex:none;width:9px;height:9px;border:solid currentColor;border-width:0 2px 2px 0;
    transform:rotate(45deg) translateY(-2px);transition:transform .2s;
  }
  details.ma-fold[open]>summary.ma-sum::after{transform:rotate(-135deg) translateY(-2px)}
  details.ma-fold>summary.ma-sum:focus-visible{outline:2px solid currentColor;outline-offset:2px}
  details.ma-fold[open]>summary.ma-sum{margin-bottom:12px}
  details.ma-fold>summary.ma-sum-btn,details.ma-fold>summary.ma-sum-btn span{background:#1a1a1a;color:#fff!important;border-color:#1a1a1a;justify-content:center;gap:12px}
  details.ma-fold>summary.ma-sum-btn span{background:none;display:inline}

  /* общий ритм секций главной */
  .home .sec,body > main .sec{padding-top:16px;padding-bottom:16px}
  .home .sec-head,body > main .sec-head{margin-bottom:14px}
  body > main .sec-head h2,body > main .ai h2,body > main .v5-plate h2{font-size:24px!important;line-height:1.15!important}

  /* 1. слайдер: ниже, явные стрелки, пауза и точки в одной полосе под изображением */
  #hsl .hsl-view{height:auto!important;min-height:0!important}
  #hsl .hslide{--ma-stage:250px}
  #hsl .hsl-view{height:600px!important;min-height:600px!important}
  #hsl .hp-media{height:var(--ma-stage)!important;min-height:0!important}
  #hsl .hp-in{padding-top:calc(var(--ma-stage) + 12px)!important;padding-bottom:44px!important;gap:6px!important}
  #hsl .hp-in h2{font-size:22px!important;line-height:1.15!important;margin:0!important}
  #hsl .hp-fig{font-size:64px!important;line-height:1.05!important;margin:0!important;min-height:0!important;flex:none!important;height:auto!important}
  #hsl .hp-fig small{font-size:.4em}
  #hsl .hp-in>*{flex-shrink:0}
  #hsl .hp-media img{object-fit:cover}
  html body #hsl .hslide .cta .btn{color:#fff!important;-webkit-text-fill-color:#fff!important}
  #hsl .hp-in p{font-size:14px!important;line-height:1.4!important;margin:0!important}
  #hsl .cta{flex-direction:row!important;flex-wrap:wrap;align-items:center;gap:6px 16px!important;margin-top:6px!important}
  #hsl .cta .btn{min-height:44px;padding:0 20px}
  #hsl .hsl-a{display:grid!important;top:calc(var(--ma-stage,200px) / 2)!important;width:40px;height:40px;background:rgba(255,255,255,.85);color:#111}
  #hsl .hsl-a.prev{left:8px}
  #hsl .hsl-a.next{right:8px}
  #hsl .hsl-dots{top:auto!important;bottom:8px!important}
  #hsl .hsl-dots i{min-width:24px;min-height:24px}
  #hsl .hsl-pp{min-width:44px;min-height:44px}

  /* 2. роутер 2x2 */
  .hs-router{display:grid!important;grid-template-columns:1fr 1fr;gap:8px;padding:8px 16px!important;overflow:visible!important}
  .hs-router{gap:6px!important}
  .hs-router a{min-height:44px;justify-content:center}

  /* 3. преимущества: компактно */
  main .sec .perks{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
  main .sec .perks .at-hallmark{grid-column:1/-1!important;width:auto!important;padding:8px 12px!important;gap:8px!important}
  main .sec .perks .at-mark{width:46px!important;height:28px!important;font-size:12px!important}
  main .sec .perks .perk{padding:8px 10px!important;min-width:0;min-height:0!important;gap:8px!important;align-items:flex-start}
  main .sec .perks .perk .p-ic{width:28px!important;height:28px!important;flex:none}
  main .sec .perks .perk b{font-size:12.5px;line-height:1.25;display:block}
  main .sec .perks .perk span:not(.p-ic){font-size:11.5px;line-height:1.3;display:block}

  /* 4. категории: плотнее, виден край следующей плитки */
  .v5-cats{padding-bottom:6px!important;scroll-padding-left:16px}
  .v5-cats .v5-cat{flex:0 0 80px!important;width:80px!important}
  .v5-cats .v5-cat-c{width:80px!important;height:80px!important}
  .v5-cats .v5-cat-n{font-size:12px!important}

  /* 5. салон: город сразу, шаги под «Как это работает» */
  #salon{display:flex;flex-direction:column}
  #salon .ma-cities{order:1}
  #salon .ma-steps{order:2;margin-top:12px}
  #salon .sec-head .sub{font-size:14px}
  #salon .step{padding:12px 14px!important}
  #salon .citypills{flex-wrap:wrap}

  /* 6. скупка/калькулятор */
  #skupka .at-rates{grid-template-columns:repeat(3,1fr)!important;gap:6px!important}
  #skupka .at-rate{flex-direction:column;align-items:center;text-align:center;gap:6px;padding:10px 6px!important;min-height:0!important}
  #skupka .at-rate span:not(.at-mark){font-size:11px!important;line-height:1.25!important}
  #skupka .at-rate .at-mark{width:48px!important;height:30px!important;font-size:12px!important}
  #skupka .at-rate b{font-size:14px!important;line-height:1.2!important;display:block}
  #atCalc .at-calc-t{font-size:20px;margin-bottom:10px}
  #atCalc details.ma-calc{margin-bottom:12px}
  #atCalc .at-calc-act{margin-top:12px}

  /* 8. подарок */
  .ai .gift-photo img{max-height:220px;object-fit:contain}
  .ai .chat-demo{margin-top:12px}
  .ai .gift-points{margin:10px 0 0}

  /* 9. производители */
  .brands{gap:6px!important}
  .brands .brand{font-size:13px;padding:6px 10px}
}

@media (max-width:767px){
  /* текст кнопки-раскрытия калькулятора: перебивает цвет, заданный правилами калькулятора */
  #atCalc details.ma-calc>summary.ma-sum-btn,
  #atCalc details.ma-calc>summary.ma-sum-btn span{color:#fff!important;-webkit-text-fill-color:#fff!important;opacity:1!important}
  body > main #salon .sec-head .sub,body > main #skupka .sec-head .sub{font-size:14px!important;line-height:1.4!important}
  body > main .sec-head.ad-head--left h2{font-size:21px!important}
}
@media (max-width:767px){
  body > main .sec-head:not(.ad-head--left){display:flex!important;flex-direction:column!important;flex-wrap:nowrap;align-items:flex-start!important;justify-content:flex-start;gap:4px 12px}
  body > main .sec-head:not(.ad-head--left)>div{min-width:0;flex:1 1 auto}
  body > main .sec-head .more{min-height:0;padding:0}
  #atCalc .at-calc-act{flex-direction:row!important;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 14px}
  #atCalc .at-calc-act .btn{flex:1 1 200px;width:auto}
  #atCalc .at-calc-more{width:auto;min-height:44px}
}

/* ======================================================================
   Этап 3А (29.10.2026): скупка, салон, контакты. Только <=767px; десктоп не затронут.
   ====================================================================== */
.ma-anchors{display:none}
/* десктоп: прямые потомки hero (.sk-hero>p) теперь внутри display:contents-обёрток - повторяем исходные правила */
@media (min-width:768px){
  .sk-hero>details.ma-fold>*{position:relative;z-index:2}
  .sk-hero>details.ma-fold>p{max-width:min(540px,44%)!important}
  .sk-hero>h1+details.ma-fold>p{margin-top:0;margin-bottom:12px;max-width:46ch}
  .sec--grey>details.ma-fold>:not(.wrap){margin-left:24px;margin-right:24px}
}
@media (max-width:767px){
  /* декоративный hero: полоса вместо крупного фото (все три страницы) */
  html body #main .sk-hero[class][class]:before{height:150px!important;padding-top:0!important;margin:0 -20px 8px!important;background-size:cover!important;background-position:50% 40%!important}
  html body #main .salonhero[class]{padding-top:150px!important;background-size:100% 150px!important;background-position:50% 0!important;background-repeat:no-repeat!important}
  html body main .sk-hero{padding-top:0!important;padding-bottom:12px!important}
  html body main .salonhero{margin-top:8px!important;padding-top:0!important}
  main .sk-hero .kicker,main .salonhero .kicker{font-size:12px}
  main .sk-hero h1{font-size:26px!important;margin:2px 0 4px}
  main .sk-hero p{font-size:14px;line-height:1.4;margin:6px 0}
  main .sk-hero .sk-facts{gap:6px;margin-top:6px;font-size:12px}
  html body #main .sk-hero .sk-facts span{display:inline-block!important;padding:3px 9px!important;line-height:1.3!important;margin:0!important}
  main .sk-hero .cta{flex-wrap:nowrap;gap:8px;margin-top:10px}
  main .sk-hero .cta>.btn,main .sk-hero .cta>.cta-plain{flex:1 1 0;min-width:0;min-height:44px;padding:0 8px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:13.5px;white-space:nowrap}
  main .sk-hero>details.ma-fold>summary.ma-sum,main .salonhero details.ma-fold>summary.ma-sum{min-height:44px;margin:4px 0;font-size:14px}
  main .sk-hero>details.ma-fold[open]>summary.ma-sum{margin-bottom:8px}

  /* якорная навигация */
  .ma-anchors{display:flex;gap:4px;margin:8px 0 0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .ma-anchors::-webkit-scrollbar{display:none}
  .ma-anchors a{flex:1 0 auto;min-height:44px;padding:0 10px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(0,0,0,.14);border-radius:999px;background:#fff;font-size:14px;font-weight:600;color:inherit;text-decoration:none;white-space:nowrap}
  main [id]{scroll-margin-top:72px}

  /* скупка: калькулятор сразу */
  #calc.sec{padding-top:10px}
  #calc .sec-head{margin-bottom:8px}
  #calc .sec-head h2{font-size:22px!important}
  #calc .sec-head .sub{font-size:13px;line-height:1.35;margin-top:4px}
  #calc .sk-calc{gap:12px}
  main .sec2{padding-top:16px;padding-bottom:16px}
  main .sec2 .sec-head{margin-bottom:10px}
  main .sec2 .sec-head .sub{font-size:14px;line-height:1.4}
  details.ma-fold>summary.ma-sum-btn+.panel,details.ma-fold>.ad-subhead{margin-top:0}
  main details.ma-fold>.sk-two{margin-bottom:0}
  main .sec2 details.ma-fold+details.ma-fold{margin-top:10px}

  /* салон: порядок - адреса и часы сразу под шапкой; звонок кнопкой */
  main:has(.salonhero){display:flex;flex-direction:column}
  main:has(.salonhero)>*{order:5}
  main:has(.salonhero)>.breadcrumbs{order:0}
  main:has(.salonhero)>.salonhero{order:1}
  main:has(.salonhero)>#salonPoints{order:2}
  main:has(.salonhero)>details.ma-sl-check{order:3}
  main .salonhero .wrap{padding:8px 14px 10px!important;gap:6px!important}
  main .salonhero h1{font-size:26px!important;margin:4px 0 0}
  main .salonhero .cr{margin-top:8px;gap:6px;font-size:13.5px;line-height:1.3}
  main .salonhero .cr div{flex-wrap:nowrap;gap:4px 8px;align-items:center}
  main .salonhero .cr a.tel-link{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;margin-left:auto;flex:none;border:1px solid var(--ink,#111);border-radius:999px;font-weight:700;font-size:13px;white-space:nowrap;text-decoration:none}
  html body #main .salonhero .cta2{display:flex!important;margin-top:8px;gap:8px;flex-wrap:nowrap}
  main .salonhero .cta2 a{flex:1 1 0;min-width:0;min-height:44px!important;padding:0 8px;font-size:13.5px;white-space:normal;text-align:center;display:flex;align-items:center;justify-content:center}
  #salonPoints{padding-top:8px;padding-bottom:8px}
  #salonPoints .sec-head{margin-bottom:8px}
  #salonPoints .sec-head h2{font-size:20px!important}
  #salonPoints .infocard{padding:12px 14px}
  #salonPoints .infocard h3{margin:0 0 6px;font-size:16px}
  #salonPoints .infocard>div>div{padding:2px 0;font-size:13.5px}
  main .salonhero .il-177{padding:12px}

  /* контакты */
  main .sk-hero.il-96 p{margin:4px 0}
  .ma-ct-form>summary.ma-sum-btn{margin-top:0}
  main .cols2.il-97{gap:12px}
  html body #main .cols2.il-97>.panel{padding:0}
  html body #main .cols2.il-97 .panel h2{font-size:20px;margin:0 0 8px}
  html body #main .cols2.il-97 .drow{padding:7px 10px!important;min-height:0!important;gap:8px}
  html body #main .cols2.il-97 .delivrows{gap:6px}
  html body #main .sk-hero.il-96{padding-bottom:10px!important}
  html body #main .ma-ct-salons .salongrid{margin-top:0}
}

/* ======================================================================
   Этап 3Б (29.10.2026): уплотнение первого экрана (скупка, контакты, салон). Только <=767px.
   ====================================================================== */
@media (max-width:767px){
  html body #main .sk-hero[class][class]:before{height:150px!important;margin:0 -20px 6px!important}
  main .sk-hero .kicker{margin:0}
  main .sk-hero h1{font-size:24px!important;margin:0 0 2px}
  html body #main .sk-hero .sk-facts{flex-wrap:wrap!important;gap:4px 5px!important;margin-top:4px!important;font-size:12px!important}
  html body #main .sk-hero .sk-facts span{flex:0 0 auto;white-space:nowrap;padding:3px 8px!important;font-size:12px!important}
  main .sk-hero details.ma-fold>summary.ma-sum{min-height:44px;margin:2px 0}
  main .sk-hero .cta{margin-top:6px}
  html body main .sk-hero{padding-bottom:6px!important}
  .ma-anchors{margin:4px 0 0}
  #calc.sec{padding-top:6px}
  #calc .sec-head{margin-bottom:6px}
  #calc .sec-head h2{font-size:20px!important;margin:2px 0 0}
  #calc .sec-head .sub{font-size:12.5px;line-height:1.3;margin-top:2px}
  #calc .sk-calc,#calc .panel{gap:10px}

  /* салон: адрес, звонок и маршрут в первом экране */
  html body #main .salonhero[class]{padding-top:150px!important;background-size:100% 150px!important}
  main:has(.salonhero)>.breadcrumbs{margin:4px 0 0;padding-top:0;padding-bottom:0;min-height:0}
  main .salonhero .wrap{padding:4px 14px 8px!important;gap:4px!important}
  #salonPoints.sec{padding-top:4px;padding-bottom:4px}
  #salonPoints .sec-head{margin-bottom:4px}
  #salonPoints .sec-head h2{font-size:18px!important}
  #salonPoints .infocard{padding:8px 14px}
  #salonPoints .infocard h3{margin:0 0 2px}

  /* контакты: выбор салона сразу после телефонов и часов, форма - ниже */
  main:has(.ma-ct-form){display:flex;flex-direction:column}
  main:has(.ma-ct-form)>section:has(.cols2){display:contents}
  main:has(.ma-ct-form) .cols2.il-97{display:contents}
  main:has(.ma-ct-form) .cols2.il-97>.panel{order:1;margin:12px 0 0}
  main:has(.ma-ct-form)>section:has(.ma-ct-salons){order:2}
  main:has(.ma-ct-form) details.ma-ct-form{order:3;margin:12px 0}
  main:has(.ma-ct-form) details.ma-ct-form>.panel{margin:0}
  main:has(.ma-ct-form)>.sk-hero{order:0}

  /* подбор: короткое вступление, шаг 1 в первом экране; итог - раскрываемый */
  html body main:has(#pbForm) .sk-hero{padding-top:0!important;padding-bottom:6px!important;margin-bottom:0!important;min-height:0!important}
  main:has(#pbForm) .sk-hero h1{font-size:22px!important;line-height:1.2}
  main:has(#pbForm) .sk-hero p{font-size:13.5px;margin:4px 0}
  main:has(#pbForm) .sk-hero details.ma-fold+*{margin-top:0}
  main:has(#pbForm) .sec{padding-top:8px;padding-bottom:12px}
  main:has(#pbForm) .chkbar{margin-bottom:8px}
  main:has(#pbForm) .pb-gain,main:has(#pbForm) .sk-hero .sk-facts{margin-top:8px}
  main:has(#pbForm) .pb-cards .checkrow{padding:8px 12px;gap:12px}
  main:has(#pbForm) .pb-cards .checkrow .pb-ph{width:64px;height:64px}
  main:has(#pbForm) .pb-q{margin-top:12px}
  main:has(#pbForm) .cols2{gap:12px}
  main:has(#pbForm) aside .panel:first-child{padding:8px}
  main:has(#pbForm) details.ma-pb-side[open]>summary.ma-sum{margin-bottom:4px}
  main:has(#pbForm) details.ma-pb-side>h2{margin-top:8px}
}

/* подбор, десктоп: дети обёртки display:contents повторяют правила прямых потомков hero */
@media (min-width:900px){
  main:has(#pbForm) .sk-hero > details.ma-fold > *{grid-column:1;max-width:none!important}
  main:has(#pbForm) .sk-hero > details.ma-fold > .pb-gain{grid-column:2;grid-row:1/span 4;align-self:center;margin:0;max-width:none!important}
}

/* ======================================================================
   Этап 4 (29.10.2026): отложенное (cart) и личный кабинет (account), только <=767px.
   ====================================================================== */
@media (max-width:767px){
  /* пустое отложенное: кольцо целиком, но миниатюрой рядом с текстом */
  main.crt .ce-top{grid-template-columns:112px minmax(0,1fr);align-items:center;gap:14px}
  main.crt .ce-top .ce-ph{aspect-ratio:1/1}
  main.crt .ce-top .ce-ph img{object-position:50% 50%}
  main.crt .ce-lead{gap:12px}
  main.crt .ce-lead p{font-size:15px;line-height:1.5}
  main.crt .pagetitle{margin-bottom:10px}
  main.crt .ce-pop h2{margin-bottom:12px;padding-top:12px}
  main.crt .ce-grid{gap:12px 10px}
  main.crt .ce-next h2{margin-bottom:8px}
  main.crt details.ma-ce-how>summary.ma-sum{margin-bottom:8px}
  main.crt .ce-next .ce-tel{margin-top:10px;padding-top:12px}
  /* вход в кабинет: фото кольца ниже, форма раньше */
  #loginView>.ce-ph{aspect-ratio:auto!important;height:104px}
  #loginView{gap:12px}
}
@media (min-width:768px){main.crt details.ma-ce-how{display:contents}}

/* ======================================================================
   Этап 5 (29.10.2026): акции, свадьба, сертификаты, помощь, о доме, новости, legal, sitemap, 404.
   Только <=767px; десктоп не затронут (details.ma-fold на >=768 - display:contents).
   ====================================================================== */
@media (max-width:767px){
  /* общее: раскрытия в панелях/карточках */
  main details.ma-fold.ma-terms>summary.ma-sum,main details.ma-fold.ma-ans>summary.ma-sum{min-height:44px;font-size:14px;margin:6px 0 0}
  main details.ma-fold.ma-terms[open]>summary.ma-sum,main details.ma-fold.ma-ans[open]>summary.ma-sum{margin-bottom:8px}
  main details.ma-fold.ma-terms>p,main details.ma-fold.ma-ans>p{margin-top:0}
  main details.ma-fold:not(.ma-terms):not(.ma-ans)>summary.ma-sum{min-height:46px;font-size:15px;margin:8px 0}
  main details.ma-fold[open]:not(.ma-terms):not(.ma-ans)>summary.ma-sum{margin-bottom:10px}

  /* hero акций, свадьбы, о доме */
  main .act-hero,main .hub-hero,main .legend,main .sm-hero{padding:18px 16px!important;gap:10px!important}
  main .act-hero h1,main .hub-hero h1,main .legend h1,main .sm-hero h1{font-size:25px!important;line-height:1.15!important;margin:4px 0 0}
  main .act-hero p,main .hub-hero p,main .legend p,main .sm-hero p{font-size:14px;line-height:1.4;margin:8px 0 0}
  main .act-hero .a-meta{margin-top:10px}
  main .act-hero .a-meta span{padding:6px 10px;font-size:12px;line-height:1.3}
  main .act-hero .cta,main .hub-hero .cta{margin-top:12px;gap:8px;flex-wrap:nowrap}
  main .act-hero .cta>.btn,main .hub-hero .cta>.btn{flex:1 1 0;min-width:0;min-height:46px;padding:0 8px;font-size:13.5px;display:flex;align-items:center;justify-content:center;text-align:center}
  main .act-hero__img{max-height:150px;object-fit:cover}

  /* карточки акций: фото ниже */
  main .actcard .a-photo,main .act-banner .a-photo{max-height:170px;object-fit:cover}
  main .actcard h3,main .act-banner h3{font-size:18px;line-height:1.25}
  main .sec{padding-top:14px;padding-bottom:14px}

  /* свадьба */
  main .hub-tile{min-height:0}
  main .wd-band__ph img{max-height:200px;object-fit:cover}
  main .plan-step{padding:10px 0}

  /* помощь: ряды услуг, гарантии */
  main .ad-rows.svc-tiles li{padding-top:10px;padding-bottom:10px}
  main .pass-grid{gap:8px}
  main .pass-feat{padding:10px 12px}
  main .panel{padding:14px}
  main .ma-ans>p{font-size:14px}

  /* о доме / новости */
  main .ab-facts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  main .ab-facts dt{font-size:22px}
  main .pack-row img{max-height:140px;object-fit:cover}
  main .news-item{padding:14px 0}
  main .ab-list a{min-height:48px}

  /* legal / sitemap / 404 */
  main .sm-item{min-height:48px;padding-top:10px;padding-bottom:10px}
  main .pagetitle{font-size:26px}
}

/* fix1 (29.10.2026): читаемость кнопок-раскрывашек, кнопка слайдера */
@media (max-width:767px){
  html body main details.ma-fold>summary.ma-sum.ma-sum-btn.ma-sum-btn span:not(#ma-x),
  html body main details.ma-fold>summary.ma-sum.ma-sum-btn.ma-sum-btn:not(#ma-x){color:#fff!important;-webkit-text-fill-color:#fff!important}
}

/* fix2 (29.10.2026): низ страницы, калькулятор, плита серёг, hero услуг */
@media (max-width:768px){
  /* контент не прячется под плавающими «Наверх»/«Позвонить» при доскролле до низа */
  html body main#main{padding-bottom:104px!important}
}
@media (max-width:767px){
  /* блок «Производители» на мобильной скрыт по решению заказчика */
  html body main section.sec:has(>details.ma-brands){display:none!important}
  /* кнопки калькулятора: один чёрный, без рамки, одинаковые размеры */
  html body main #atCalc details.ma-calc>summary.ma-sum-btn,html body main #atCalc .at-calc-act .at-calc-cta{background:#000!important;border:0!important;outline:0;box-shadow:none!important;border-radius:0!important;min-height:48px;height:48px;width:100%;box-sizing:border-box;font:500 14px/1.2 Manrope,sans-serif;color:#fff!important;display:flex;align-items:center;justify-content:center;padding:0 16px;margin:0}
  html body main #atCalc details.ma-calc[open]>summary.ma-sum-btn{margin-bottom:12px}
  html body main #atCalc details.ma-calc>summary.ma-sum-btn span{font:inherit}
  /* калькулятор: кнопка на всю ширину, ссылка под ней */
  #atCalc .at-calc-act{display:flex!important;flex-direction:column!important;flex-wrap:nowrap!important;align-items:stretch!important;justify-content:flex-start;gap:6px!important;margin-top:12px}
  #atCalc .at-calc-act .btn{flex:none!important;width:100%!important;box-sizing:border-box;min-height:48px}
  #atCalc .at-calc-more{width:100%!important;min-height:44px;display:flex;align-items:center;justify-content:center;text-align:center}
  /* плита «Серьги»: фото без пустого квадрата */
  html body main .v5-plate-img{aspect-ratio:5/2!important;height:auto!important;object-fit:cover!important}
  /* hero услуг/скупки: без обрезаний, колонкой */
  .sk-hero>:not(.sk-facts):not(.cta),.sk-hero .sk-facts,.sk-hero .cta{max-width:100%!important}
  .sk-hero .sk-facts{margin-left:0!important;overflow:visible!important;flex-wrap:wrap!important;gap:8px 0!important}
  .sk-hero .sk-facts span{padding:2px 14px!important;max-width:100%;box-sizing:border-box;white-space:normal!important}
  .sk-hero .cta{display:flex!important;flex-direction:column!important;flex-wrap:nowrap!important;align-items:stretch!important;gap:8px!important}
  .sk-hero .cta>.btn{width:100%!important;flex:none!important;box-sizing:border-box;white-space:normal;min-height:48px}
  .sk-hero .cta>.cta-plain{justify-content:center;text-align:center;white-space:normal}
}
@media (max-width:767px){
  html body main #atCalc.at-calc .at-calc-act a.btn.at-calc-cta[class][class][class]{background:#000!important;background-image:none!important;border:0!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
}

/* fix4: скупка — «Цены по пробам» дублирует ссылку «по прейскуранту» и не влезает в строку */
@media (max-width:767px){.skm__cta .cta-plain{display:none}}

/* fix5 (29.10.2026): без плавающей кнопки телефона, низ страницы, крошки, пустоты, меню, вход, сертификаты. Только <=767px */
.ma-acc-ic{display:none}
@media (max-width:767px){
  /* 1/5/9: кнопка телефона дублирует «Контакты» в нижней панели */
  html body .callback-btn,html body #callback-btn{display:none!important}
  /* низ страницы: контент заканчивается чуть выше панели (панель + safe-area + 8px) */
  html body main#main{padding-bottom:0!important}
  html body{padding-bottom:calc(var(--stack) + 8px)!important}
  html body.cookie-on{padding-bottom:calc(var(--cookie-top,var(--ma-stack)) + 24px)!important}
  /* 3: крошка «Главная» скрыта; если остаётся одна — скрыта вся строка */
  html body .breadcrumbs>a[href="index.html"]:first-child,
  html body .breadcrumbs>a[href="index.html"]:first-child+span{display:none}
  html body .breadcrumbs:has(>a[href="index.html"]:first-child):not(:has(>a:nth-of-type(2))){display:none}
  /* 2: пустоты между секциями (aura.css задаёт 24px с !important); главную не трогаем */
  html body:not(:has(#hsl)) main .sec{padding-top:14px!important;padding-bottom:14px!important}
  /* 6: на «Самовывоз и оплата» разделы идут сразу под якорями */
  html body main:has(#ma-pickup) .ma-anchors{display:none!important}
  /* 7: меню: без белой полосы под нижним блоком */
  html body .drawer{padding-bottom:0!important}
  html body .drawer .d-foot{padding-bottom:calc(26px + env(safe-area-inset-bottom,0px))}
  /* 8: вход в кабинет: иконка вместо кольца, блок по центру доступной высоты */
  html body #loginView>.ce-ph{display:none!important}
  html body .ma-acc-ic{display:grid;place-items:center;justify-self:center;width:88px;height:88px;color:#a07f35}
  html body .ma-acc-ic svg,html body .ma-acc-ic svg *{stroke-width:.75}
  html body .ma-acc-ic svg{width:72px;height:72px;color:#a07f35}
  html body #loginView:not([style*="display:none"]){display:grid!important;align-content:center;min-height:calc(100dvh - 65px - var(--stack) - 24px)}
  /* 10: номиналы сертификатов 2x2 */
  html body main:has(#gc-form) .pgrid.il-115{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px}
}

/* fix6 (29.10.2026): карусель салонов — пустота под точками (44px зона касания + 16px отступ + 14px секции). Зона касания остаётся, уходит под отступ секции. Только <=767px */
@media (max-width:767px){
  html body .crl .crl-dots{margin-top:4px!important;margin-bottom:-22px!important}
}

/* shock-tag (29.10.2026): красная бирка «Шок-цена» как в видео, акция до 80% (index слайд 1, promotions hero). Каталог не трогает */
.shock-row{display:flex;align-items:center;gap:12px;margin:10px 0 4px;flex-wrap:wrap}
.shock-tag{display:inline-block;background:#c8102e;color:#fff;font:600 14px/1 var(--font-sans,inherit);letter-spacing:.02em;padding:7px 14px 8px;border-radius:3px;transform:rotate(-6deg);box-shadow:0 2px 6px rgba(0,0,0,.25);white-space:nowrap;flex:0 0 auto}
.shock-note{font-size:13px;line-height:1.3;opacity:.85}
@media (max-width:767px){
  .shock-row{margin:6px 0 2px;gap:10px}
  .shock-tag{font-size:12.5px;padding:6px 12px 7px}
  .shock-note{font-size:12px}
}
@media (min-width:900px){html body[data-page=promotions] main section.act-hero .shock-row .shock-note:not(#a):not(#b){color:#f3e7d3!important;opacity:.95}}
/* promotions hero desktop (29.10.2026): тёмное фото -> светлый текст + градиент слева. Мобильный не затронут */
@media (min-width:900px){
  html body[data-page=promotions] main section.act-hero{position:relative}
  html body[data-page=promotions] main section.act-hero::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,rgba(14,8,4,.86) 0%,rgba(14,8,4,.78) 45%,rgba(14,8,4,.45) 62%,rgba(14,8,4,0) 85%)}
  html body[data-page=promotions] main section.act-hero>div{position:relative;z-index:1}
  html body[data-page=promotions] main section.act-hero .kicker:not(#a):not(#b){color:#e8c978!important}
  html body[data-page=promotions] main section.act-hero h1:not(#a):not(#b),
  html body[data-page=promotions] main section.act-hero p:not(#a):not(#b){color:#fff!important}
  html body[data-page=promotions] main section.act-hero h1 em:not(#a):not(#b){color:#e8c978!important}
  html body[data-page=promotions] main section.act-hero .a-meta span:not(#a):not(#b){background:rgba(14,8,4,.55)!important;color:#fff!important;border-color:rgba(255,255,255,.35)!important}
  html body[data-page=promotions] main section.act-hero .btn-o:not(#a):not(#b){color:#fff!important;border-color:#fff!important}
}
@media (min-width:900px){
  html body[data-page=promotions] main section.act-hero :is(.kicker,h1,h1 em,p,p b,.a-meta span,.btn-o,.shock-note,.shock-tag):not(#a):not(#b){-webkit-text-fill-color:currentColor!important;text-shadow:0 1px 8px rgba(0,0,0,.45)!important}
  html body[data-page=promotions] main section.act-hero p b:not(#a):not(#b){color:#fff!important}
  html body[data-page=promotions] main section.act-hero .btn-o:not(#a):not(#b){background:rgba(14,8,4,.35)!important}
}
@media (min-width:900px){html body[data-page=promotions] main section.act-hero .shock-tag:not(#a):not(#b){color:#fff!important;text-shadow:none!important}}
@media (min-width:900px){
  html body[data-page=promotions] main section.act-hero h1:not(#a):not(#b){max-width:460px}
  html body[data-page=promotions] main section.act-hero p:not(#a):not(#b){max-width:370px}
  html body[data-page=promotions] main section.act-hero .btn-o:not(#a):not(#b){background:rgba(14,8,4,.8)!important}
}
@media (min-width:900px){
  html body[data-page=promotions] main section.act-hero h1:not(#a):not(#b){font-size:clamp(34px,3.9vw,50px)!important;line-height:1.1!important}
}
@media (min-width:900px){html body[data-page=promotions] main section.act-hero p:not(#a):not(#b){max-width:450px;background:rgba(14,8,4,.55);padding:10px 14px;border-radius:6px;margin-left:-14px}}

/* contrast (29.10.2026): бирка «Шок-цена» — белый текст на красном на всех ширинах (на ≤899 перебивался тёмным цветом hero); desktop-правила hero promotions переведены с 768 на 900 (на 768–899 hero — светлый столбец, а не тёмное фото) */
html body[data-page=promotions] main section.act-hero .shock-tag:not(#a):not(#b){color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:none!important}
/* contrast index (29.10.2026): цвет текста в слайдах главной (цвет, не содержимое): кнопка слайда 1 (тёмный на коричневом, на ПК), цены ₽/г в p слайда 2 (были тёмные), кнопка слайда 3 (белый на светлом) */
html body .hslider .hslide.hp-banner .btn.btn-gold:not(#a):not(#b),html body .hslider .hslide.hp-banner .btn.btn-gold *:not(#a):not(#b){color:#fff!important;-webkit-text-fill-color:#fff!important}
html body .hslider .hslide.hp-exchange p [data-sk-rate]:not(#a):not(#b){color:#fff!important;-webkit-text-fill-color:#fff!important}
html body .hslider .hslide.hp-silver .btn.btn-gold:not(#a):not(#b),html body .hslider .hslide.hp-silver .btn.btn-gold *:not(#a):not(#b){color:#1B1B1B!important;-webkit-text-fill-color:#1B1B1B!important}

/* 29.10.2026 salon-hero: реальные изделия на светлом фоне (promo-c-sale) вместо hero-salon.webp; светлая тема только для .salonhero (salon.html) */
html body main section.salonhero[class][class]:not(#a):not(#b){background:#f7f5f1 url(pics/promo/promo-c-sale-1200.webp) right center/cover no-repeat!important;color:#2b2118!important}
html body main section.salonhero[class][class]:not(#a):not(#b):before{content:""!important;display:block!important;position:absolute!important;inset:0!important;width:auto!important;height:auto!important;padding:0!important;z-index:1!important;pointer-events:none;background:linear-gradient(90deg,rgba(247,245,241,.96) 0%,rgba(247,245,241,.86) 36%,rgba(247,245,241,.3) 54%,rgba(247,245,241,0) 66%)!important}
html body main section.salonhero:not(#a):not(#b) :is(h1,h1 span,p,li,.cr div,.cr a,.il-178,.il-179,.il-180,span:not(.btn)){color:#2b2118!important;-webkit-text-fill-color:currentColor!important}
html body main section.salonhero:not(#a):not(#b) .kicker{color:#6b5426!important}
html body main section.salonhero:not(#a):not(#b) :is(svg,[data-ic]){color:#8a6a2a!important}
html body main section.salonhero:not(#a):not(#b) .cta2 a.btn.btn-p{background:#1b1b1b!important;color:#fff!important;-webkit-text-fill-color:#fff!important;border:1px solid #1b1b1b!important}
html body main section.salonhero:not(#a):not(#b) .cta2 a.btn.btn-gold{background:rgba(255,255,255,.7)!important;color:#1b1b1b!important;-webkit-text-fill-color:#1b1b1b!important;border:1px solid #1b1b1b!important}
html body main section.salonhero:not(#a):not(#b) .il-177{border-color:rgba(43,33,24,.3)!important}
html body main section.salonhero:not(#a):not(#b) .il-180 .btn-w,html body main section.salonhero:not(#a):not(#b) .il-180 .btn-w[href^="tel:"]{color:#1b1b1b!important;border-color:#1b1b1b!important}
@media (max-width:767px){
  html body main section.salonhero[class][class]:not(#a):not(#b){background:#f7f5f1 url(pics/promo/promo-c-sale-720.webp) 50% 0/100% auto no-repeat!important;padding-top:43.9vw!important}
  html body main section.salonhero[class][class]:not(#a):not(#b):before{display:none!important}
}
@media (min-width:768px) and (max-width:899px){
  html body main section.salonhero[class][class]:not(#a):not(#b){background:#f7f5f1 url(pics/promo/promo-c-sale-1200.webp) 50% 0/100% auto no-repeat!important;padding-top:43.9vw!important}
  html body main section.salonhero[class][class]:not(#a):not(#b):before{display:none!important}
}

/* 30.10.2026 about-hero: реальные изделия на светлом фоне (promo-c-sale) вместо salon-interior-generic; только .legend--about (about.html) */
html body main section.legend.legend--about[class][class]:not(#a):not(#b){background:#f7f5f1 url(pics/promo/promo-c-sale-1200.webp) right center/cover no-repeat!important;color:#2b2118!important;position:relative!important;isolation:isolate}
html body main section.legend.legend--about[class][class]:not(#a):not(#b):before{content:""!important;display:block!important;position:absolute!important;inset:0!important;width:auto!important;height:auto!important;padding:0!important;margin:0!important;z-index:-1!important;pointer-events:none;background:linear-gradient(90deg,rgba(247,245,241,.96) 0%,rgba(247,245,241,.86) 36%,rgba(247,245,241,.3) 54%,rgba(247,245,241,0) 66%)!important}
html body main section.legend.legend--about:not(#a):not(#b) :is(h1,p){color:#2b2118!important;-webkit-text-fill-color:currentColor!important}
html body main section.legend.legend--about:not(#a):not(#b) .kicker{color:#6b5426!important}
@media (max-width:767px){
  html body main section.legend.legend--about[class][class]:not(#a):not(#b){background:#f7f5f1 url(pics/promo/promo-c-sale-720.webp) 50% 0/100% auto no-repeat!important;padding:43.9vw 16px 24px!important}
  html body main section.legend.legend--about[class][class]:not(#a):not(#b):before{display:none!important}
}
@media (min-width:768px) and (max-width:899px){
  html body main section.legend.legend--about[class][class]:not(#a):not(#b){background:#f7f5f1 url(pics/promo/promo-c-sale-1200.webp) 50% 0/100% auto no-repeat!important;padding:43.9vw 16px 24px!important}
  html body main section.legend.legend--about[class][class]:not(#a):not(#b):before{display:none!important}
}

/* ===== AURA-SHOP-OFF:start (30.10.2026) =====
   Корзина и кнопки добавления скрыты. ВЕРНУТЬ: удалить этот блок целиком
   (а в cart.html и checkout.html удалить строку с пометкой AURA-SHOP-OFF). */
.shop-only,
a[href="cart.html"],
html body .card .body>.buy,html body .card .buy,html body .pgrid .card .buy,html body .card .ph .buy,
.ctarow,
#buybar,.buybar,
.mobbar .mb-cnt,.icons .cnt{display:none!important}
/* нижнее меню: без корзины 4 пункта на всю ширину (при возврате корзины блок удаляется вместе с остальным) */
@media (max-width:768px){html body .mobbar{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
/* карточка без цены: «Цену уточняйте у консультанта» */
html body .price.price--ask,html body .pricebig .now.price--ask,html body .card .price-row .price--ask{font-size:14px!important;font-weight:500!important;font-style:normal;line-height:1.35!important;letter-spacing:0;color:var(--ink-soft,#6b625a)!important;white-space:normal}
/* ===== AURA-SHOP-OFF:end ===== */
/* AURA-WHERE-SEE: салоны с остатком на странице изделия (30.10.2026) */
.where-see{flex:1 1 100%;font-size:14px;line-height:1.45;border-top:1px solid rgba(0,0,0,.08);padding-top:10px}
.where-see>b{display:block;margin-bottom:4px}
.where-see ul{list-style:none;margin:0;padding:0}
.where-see li{padding:2px 0}
.where-see span{opacity:.75}
/* ===== AURA-CABINET-WIP:start (30.10.2026) =====
   Кабинет в разработке: заметная плашка на account.html, форма входа и демо-кабинет неактивны.
   ВЕРНУТЬ: удалить этот блок и в account.html блок с пометкой AURA-CABINET-WIP (плашка, style, script). */
.cab-wip{margin:16px 0 20px;padding:16px 18px;border:1px solid var(--brass,#b08d57);border-left-width:4px;border-radius:8px;background:rgba(176,141,87,.10);font-size:17px;line-height:1.4}
.cab-wip b{display:block;font-size:20px;margin-bottom:4px}
.cab-wip span{opacity:.8;font-size:15px}
body.cab-wip-on #loginView .panel,body.cab-wip-on #accView{opacity:.45;pointer-events:none;user-select:none}
/* ===== AURA-CABINET-WIP:end ===== */

/* ===== AURA-MOBILE-BANNERS (30.10.2026): 7 страниц, <=768px — полоса с фото 190px над текстом, ниже кремовый фон. Десктоп не затронут. ===== */
@media (max-width:768px){
  html body:not([data-page]) #main .sk-hero.il-112[class][class]:not(#z),html body:not([data-page]) #main .sk-hero.il-106[class][class]:not(#z),html body:not([data-page]) #main .sk-hero.il-168[class][class]:not(#z),html body:not([data-page]) #main .sk-hero.il-114[class][class]:not(#z),html body[data-page="uslugi"] #main .sk-hero.ad-hero[class][class]:not(#z),html body[data-page="news"] #main .sk-hero.il-131[class][class]:not(#z),html body:not([data-page]) #main:has(.ma-ct-form) .sk-hero.il-96[class][class]:not(#z){position:relative;padding-top:190px!important;background-image:none!important}
  html body:not([data-page]) #main .sk-hero.il-112[class][class]:not(#z):before,html body:not([data-page]) #main .sk-hero.il-106[class][class]:not(#z):before,html body:not([data-page]) #main .sk-hero.il-168[class][class]:not(#z):before,html body:not([data-page]) #main .sk-hero.il-114[class][class]:not(#z):before,html body[data-page="uslugi"] #main .sk-hero.ad-hero[class][class]:not(#z):before,html body[data-page="news"] #main .sk-hero.il-131[class][class]:not(#z):before,html body:not([data-page]) #main:has(.ma-ct-form) .sk-hero.il-96[class][class]:not(#z):before{content:""!important;display:block!important;position:absolute!important;top:0!important;left:0!important;right:0!important;width:auto!important;height:190px!important;margin:0!important;padding:0!important;z-index:5!important;background-color:transparent!important;background-repeat:no-repeat!important;background-size:cover!important;background-position:78% center!important}
  html body:not([data-page]) #main .sk-hero.il-112[class][class]:not(#z):before{background-image:image-set(url(pics/banners/hero-faq.webp?v=3) 1x,url(pics/banners/hero-faq-2x.webp?v=3) 2x)!important}
  html body:not([data-page]) #main .sk-hero.il-106[class][class]:not(#z):before{background-image:image-set(url(pics/banners/hero-delivery.webp?v=3) 1x,url(pics/banners/hero-delivery-2x.webp?v=3) 2x)!important}
  html body:not([data-page]) #main .sk-hero.il-168[class][class]:not(#z):before{background-image:image-set(url(pics/banners/hero-return.webp?v=3) 1x,url(pics/banners/hero-return-2x.webp?v=3) 2x)!important}
  html body:not([data-page]) #main .sk-hero.il-114[class][class]:not(#z):before{background-image:image-set(url(pics/banners/hero-giftcards.webp?v=3) 1x,url(pics/banners/hero-giftcards-2x.webp?v=3) 2x)!important}
  html body[data-page="uslugi"] #main .sk-hero.ad-hero[class][class]:not(#z):before{background-image:image-set(url(pics/banners/hero-services1.webp?v=3) 1x,url(pics/banners/hero-services1-2x.webp?v=3) 2x)!important}
  html body[data-page="news"] #main .sk-hero.il-131[class][class]:not(#z):before{background-image:image-set(url(pics/banners/hero-news-page.webp?v=3) 1x,url(pics/banners/hero-news-page-2x.webp?v=3) 2x)!important}
  html body:not([data-page]) #main:has(.ma-ct-form) .sk-hero.il-96[class][class]:not(#z):before{background-image:image-set(url(pics/banners/hero-contacts.webp?v=3) 1x,url(pics/banners/hero-contacts-2x.webp?v=3) 2x)!important}
}
/* ===== AURA-MOBILE-BANNERS:end ===== */