:root{--r:16px}

:root{--red:#de002b;--ink:#282424;--muted:#7b7172;--line:#ece6e3;--soft:#f8f5f3;--shell:1320px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased}
button,input,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}img{display:block;width:100%}
svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.shell{width:min(calc(100% - 40px),var(--shell));margin-inline:auto}
.site-header{background:#fff;border-bottom:1px solid var(--line)}
.header-main{height:70px;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"brand city";align-items:center;column-gap:12px}
.brand{grid-area:brand;display:inline-flex;align-items:center;width:max-content;border-radius:var(--r);overflow:hidden}
.brand img{width:130px;height:auto}
.city-button{grid-area:city;justify-self:center;display:inline-flex;align-items:center;gap:5px;padding:7px 5px;border:0;border-radius:var(--r);background:transparent;color:var(--red);font-size:15px;font-weight:600;line-height:1}.city-button svg{width:15px;height:15px;stroke-width:1.8}.city-button:hover{background:#fff1f3;color:#b90024}
.banner-carousel{padding-top:16px}.banner-track{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin-inline:-20px;padding-inline:20px}.banner-track::-webkit-scrollbar{display:none}
.banner{position:relative;flex:0 0 calc(100% - 34px);height:205px;overflow:hidden;border-radius:var(--r);background:#332d2c;scroll-snap-align:start}.banner::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgb(30 20 22 / 72%) 0%,rgb(30 20 22 / 38%) 46%,transparent 75%)}.banner--light::after{background:linear-gradient(90deg,rgb(255 250 247 / 94%) 0%,rgb(255 250 247 / 68%) 48%,transparent 78%)}
.banner>img{width:100%;height:100%;object-fit:cover}.banner--light>img{object-position:60% center}.banner-copy{position:absolute;z-index:1;left:20px;bottom:19px;display:flex;flex-direction:column;align-items:flex-start;color:#fff}.banner--light .banner-copy{color:var(--ink)}.banner-copy small{margin-bottom:8px;color:#ffdbe2;font-size:10px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.banner--light .banner-copy small{color:var(--red)}.banner-copy strong{font-size:25px;line-height:1.02;letter-spacing:-1px}.banner-copy b{margin-top:14px;font-size:11px}
.telegram-promo{display:flex;align-items:center;justify-content:center;width:100%;min-height:36px;padding:8px 14px;background:var(--red);color:#fff;font-size:11px;text-align:center}.telegram-promo strong{font-weight:700}
.catalog-navigation{padding-top:11px}
.link-row{scrollbar-width:none;-webkit-overflow-scrolling:touch}.link-row::-webkit-scrollbar,.category-links::-webkit-scrollbar{display:none}
.link-row--categories{display:flex;align-items:center;gap:12px;overflow:hidden;margin-inline:-20px;padding-inline:20px}
.category-links{display:flex;align-items:center;gap:22px;min-width:0;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.link-row a{position:relative;flex:none;padding-block:10px;white-space:nowrap;font-size:12px;font-weight:700;line-height:1}
.link-row--categories a{color:var(--ink)}
.search-control{position:relative;z-index:3;width:32px;height:34px;flex:none}.search-state{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.search-toggle{display:grid;place-items:center;width:32px;height:34px;padding:0;border:0;background:#fff;color:var(--ink);cursor:pointer}.search-toggle svg{width:19px;height:19px}.search-state:checked+.search-toggle{color:var(--red)}
.search-reveal{position:absolute;top:-1px;left:calc(100% + 5px);width:0;overflow:hidden;opacity:0;visibility:hidden;transition:width .32s cubic-bezier(.22,.8,.3,1),opacity .16s ease,visibility 0s linear .32s}.catalog-navigation.search-open .search-reveal{width:min(280px,calc(100vw - 89px));opacity:1;visibility:visible;transition:width .32s cubic-bezier(.22,.8,.3,1),opacity .18s ease .04s,visibility 0s}
.search-state:checked~.search-reveal{width:min(280px,calc(100vw - 89px));opacity:1;visibility:visible;transition:width .32s cubic-bezier(.22,.8,.3,1),opacity .18s ease .04s,visibility 0s}
.category-search{display:flex;align-items:center;width:280px;max-width:calc(100vw - 89px);height:36px;padding:3px 3px 3px 11px;border-radius:var(--r);background:#f5f2f1;box-shadow:inset 0 0 0 1px #eee8e6}.category-search input{min-width:0;flex:1;padding:0;border:0;outline:0;background:transparent;color:var(--ink);font-size:16px;zoom:.75}.category-search input::placeholder{color:#9a9190}.category-search button{display:grid;place-items:center;flex:none;padding:0;border:0}.category-search .search-submit{width:30px;height:30px;border-radius:var(--r);background:var(--red);color:#fff;font-size:18px;line-height:1}.category-search .search-close{width:27px;height:30px;background:transparent;color:#817879;font-size:20px;font-weight:300}
.link-row--prices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;overflow:visible;margin:7px 0 0;padding:0}.link-row--prices a{display:grid;place-items:center;min-width:0;min-height:31px;padding:6px 4px;border:1px solid #e7a0af;border-radius:var(--r);background:#fff;color:var(--red);font-size:12px;font-weight:700;text-align:center}
.showcase{padding-top:20px;padding-bottom:56px}
.showcase-heading{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:19px}
.eyebrow{color:var(--red);font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
h1,h2,h3,p{margin-top:0}.showcase h1{margin:8px 0 0;font-size:29px;line-height:1.08;letter-spacing:-1.25px}
.showcase-heading>p{display:none;margin:0;color:var(--muted);font-size:11px}.showcase-heading>p strong{color:var(--ink)}
.product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:27px 12px}
.product-card{min-width:0}.product-photo{position:relative;aspect-ratio:3/4;overflow:hidden;border-radius:var(--r);background:#f1edeb}
.product-image{width:100%;height:100%;background-position:center;background-size:cover;transition:transform .3s ease}.product-card:hover .product-image{transform:scale(1.025)}
.product-image--rose-hydrangea{background-image:none}.product-image--pastel-hydrangeas{background-image:none}.product-image--white-roses{background-image:none}.product-image--red-roses{background-image:none}.product-image--kenya-mix{background-image:none}.product-image--glowing-roses{background-image:none}.product-image--berry-roses{background-image:none}.product-image--soft-hydrangeas{background-image:none}.product-image--rose-composition{background-image:none}
.tag-list{position:absolute;top:8px;left:8px;display:flex;flex-wrap:wrap;gap:4px;max-width:calc(100% - 16px)}
.tag{padding:5px 7px;border-radius:var(--r);background:#fff;color:#78454d;font-size:10px;font-weight:800;line-height:1.05;white-space:nowrap;box-shadow:0 2px 7px rgb(40 20 25 / 10%)}
.tag--fresh{background:#2F9E86;color:#fff}.tag--season{background:#9B85CF;color:#fff}.tag--hit{background:#E8891A;color:#fff}.tag--stock{background:#C23A66;color:#fff}.tag--new{background:#4c7185;color:#fff}.tag--choice{background:#eadde1;color:#753d51}
.tag--sale{position:absolute;top:8px;right:8px;width:max-content;background:#fff;color:var(--red)}
.add-button{position:absolute;right:10px;bottom:10px;z-index:2;display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:#fff;color:var(--red);box-shadow:0 3px 12px rgb(40 20 25 / 18%)}
.add-button svg{width:19px;height:19px;stroke-width:2.5}.add-button:hover{background:#fff4f6;color:#bd0025}
.add-state{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.add-state:checked+.add-button{background:var(--red);color:#fff}html:not(.js-ready) body:has(.add-state:checked) .floating-cart{display:grid}html:not(.js-ready) body:has(.add-state:checked) .floating-cart-count{font-size:0}html:not(.js-ready) body:has(.add-state:checked) .floating-cart-count::after{content:"1+";font-size:9px}
.product-info{padding:10px 1px 0}.product-info h3{display:-webkit-box;height:34px;overflow:hidden;margin:0 0 8px;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:12px;font-weight:600;line-height:1.38}
.product-bottom{display:flex;align-items:baseline;justify-content:space-between;gap:6px;min-width:0}
.price-stack{display:flex;flex:0 0 auto;align-items:baseline;gap:6px;min-width:0}.price-stack--sale{flex-direction:column;align-items:flex-start;gap:2px}
.price-stack strong{color:var(--ink);font-size:16px;font-weight:800;line-height:1.2;letter-spacing:-.35px;white-space:nowrap}.price-stack--sale strong{color:var(--red)}
.price-stack del{color:#9b9292;font-size:11px;font-weight:500;line-height:1.1;text-decoration-color:#9b9292}
.messenger-order{display:inline-flex;flex:none;align-items:center;justify-content:center;gap:3px;padding:4px 5px;border:0;border-radius:999px;background:#fff;color:#b5374e;font-size:10px;font-weight:700;line-height:1;white-space:nowrap;box-shadow:inset 0 0 0 1px #efc7ce}
.messenger-order svg{width:9px;height:9px;flex:none;fill:currentColor;stroke:none;color:inherit}.messenger-order:hover{background:#fff4f5;color:#ad1837}
.seo{position:relative;margin-bottom:48px;padding:27px 20px;border-radius:var(--r);background:#f8f5f3}.seo h2{margin-bottom:13px;font-size:22px;letter-spacing:-.7px}.seo-copy{position:relative;color:#655e5f;font-size:11px;line-height:1.65}.seo-copy p{margin-bottom:10px}.seo:not(.is-open) .seo-copy{max-height:84px;overflow:hidden}.seo:not(.is-open) .seo-copy::after{content:"";position:absolute;right:0;bottom:0;left:0;height:38px;background:linear-gradient(transparent,#f8f5f3)}.seo-toggle{padding:5px 0;border:0;background:transparent;color:var(--red);font-size:11px;font-weight:700}
.footer{border-top:1px solid var(--line);background:#f8f6f4}.footer-inner{display:grid;grid-template-columns:1fr 1fr;gap:28px 20px;padding-block:36px 30px}.footer .brand img{width:130px}.footer p{margin:13px 0 0;color:var(--muted);font-size:11px;line-height:1.6}.footer-brand,.footer-contact{grid-column:1/-1}.footer-column,.footer-contact{display:grid;align-content:start;gap:8px;font-size:11px}.footer-column strong,.footer-contact strong{margin-bottom:3px;font-size:12px}.footer-contact div{margin-top:3px;color:var(--red);font-size:11px}.footer .prototype-note{grid-column:1/-1;margin:0;font-size:10px}
.floating-cart{position:fixed;z-index:90;top:48px;right:12px;display:grid;place-items:center;width:46px;height:46px;padding:0;border:0;border-radius:50%;background:#fff;color:var(--ink);appearance:none;-webkit-appearance:none;box-shadow:0 6px 24px rgb(38 22 25 / 18%)}.floating-cart svg{width:22px;height:22px;stroke:currentColor}.floating-cart-count{position:absolute;top:-2px;right:-2px;display:grid;place-items:center;min-width:19px;height:19px;padding-inline:4px;border-radius:999px;background:var(--red);color:#fff;font-size:9px;font-weight:800}
.contact-fab{position:fixed;z-index:90;right:18px;bottom:18px;display:grid;place-items:center;width:48px;height:48px;padding:0;border:0;border-radius:50%;background:var(--red);color:#fff;box-shadow:0 8px 24px rgb(93 12 30 / 25%)}.contact-fab svg{width:23px;height:23px}.contact-menu{position:fixed;z-index:89;right:18px;bottom:76px;display:none;width:150px;padding:7px;border:1px solid var(--line);border-radius:var(--r);background:#fff;box-shadow:0 12px 35px rgb(38 22 25 / 18%)}.js-ready .contact-menu:not([hidden]),.contact-menu:target{display:grid}.contact-menu[hidden]{display:none}.contact-menu a,.contact-menu button{padding:9px 10px;border:0;border-radius:var(--r);background:#fff;color:var(--ink);font-size:11px;font-weight:700;text-align:left}.contact-menu a:hover,.contact-menu button:hover{background:#fff2f4;color:var(--red)}
.chat-dialog{position:fixed;width:min(calc(100% - 32px),420px);max-height:calc(100vh - 40px);padding:28px;border:0;border-radius:var(--r);background:#fff;color:var(--ink);box-shadow:0 20px 70px rgb(35 21 25 / 20%)}.chat-dialog:target{display:block;z-index:120;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.chat-dialog::backdrop{background:rgb(27 21 24 / 42%)}
.chat-dialog__close{position:absolute;top:12px;right:14px;width:30px;height:30px;border:0;background:transparent;color:#807779;font-size:26px;line-height:1}.chat-dialog h2{margin:10px 0 9px;font-size:27px;letter-spacing:-1px}.chat-dialog__product{margin:0 0 5px;font-size:14px;font-weight:700;line-height:1.4}.chat-dialog__hint{margin:0 0 18px;color:var(--muted);font-size:12px;line-height:1.45}.chat-dialog__channels{display:grid;gap:8px}.chat-dialog__channels button{display:flex;align-items:center;justify-content:space-between;width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:#fff;color:var(--ink);font-size:13px;font-weight:700}.chat-dialog__channels button:hover{border-color:var(--red);color:var(--red)}.chat-dialog__channels span{color:var(--red);font-size:18px}.chat-dialog__note{margin:15px 0 0;color:var(--muted);font-size:11px}
.toast{position:fixed;z-index:110;left:50%;bottom:80px;transform:translate(-50%,25px);opacity:0;pointer-events:none;padding:10px 14px;border-radius:var(--r);background:var(--ink);color:#fff;font-size:12px;white-space:nowrap;transition:opacity .2s,transform .2s}.toast.is-visible{opacity:1;transform:translate(-50%,0)}
.product-card[hidden]{display:none}
@media(min-width:700px){
  .shell{width:min(calc(100% - 72px),var(--shell))}
  .header-main{height:80px;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"brand city";gap:32px}.brand img{width:170px}.city-button{justify-self:end;margin-right:54px;font-size:16px}.city-button svg{width:16px;height:16px}
  .banner-carousel{padding-top:22px}.banner-track{gap:14px;overflow-x:auto;margin-inline:0;padding-inline:0}.banner{flex-basis:calc(55% - 7px);height:280px;border-radius:var(--r)}.banner-copy{left:38px;bottom:34px}.banner-copy small{font-size:11px}.banner-copy strong{font-size:40px;letter-spacing:-1.8px}.banner-copy b{margin-top:20px;font-size:12px}
  .telegram-promo{min-height:40px;padding-inline:18px;font-size:12px}
  .catalog-navigation{padding-top:14px}.link-row--categories{justify-content:center;gap:18px;overflow:visible;margin-inline:0;padding-inline:0}.category-links{gap:34px;overflow:visible}.link-row a{font-size:13px}.link-row--categories a{padding-block:13px}.search-control,.search-toggle{width:36px}.catalog-navigation.search-open .search-reveal,.search-state:checked~.search-reveal{width:360px}.category-search{width:360px;max-width:100%;height:38px;padding-left:12px}.category-search input{font-size:16px}.category-search .search-submit{width:32px;height:32px}.link-row--prices{grid-template-columns:repeat(4,142px);justify-content:center;gap:10px;margin-top:8px}.link-row--prices a{min-height:34px;padding-block:7px;font-size:13px}
  .showcase{padding-top:30px;padding-bottom:82px}
  .product-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:37px 24px}.tag-list{top:13px;left:13px;max-width:calc(100% - 26px)}.tag{padding:7px 10px;font-size:11px}.tag--sale{top:13px;right:13px}.add-button{right:12px;bottom:12px;width:38px;height:38px}.add-button svg{width:21px;height:21px}
  .product-info{padding-top:14px}.product-info h3{height:39px;margin-bottom:11px;font-size:14px}.price-stack{flex-direction:row;align-items:baseline}.price-stack strong{font-size:20px}.price-stack del{font-size:12px}.messenger-order{gap:5px;padding:8px 11px;font-size:11px}.messenger-order svg{width:13px;height:13px}
  .seo{margin-bottom:70px;padding:40px 7%;border-radius:var(--r)}.seo h2{font-size:30px}.seo-copy{max-width:920px;font-size:13px}.seo:not(.is-open) .seo-copy{max-height:none;overflow:visible}.seo:not(.is-open) .seo-copy::after,.seo-toggle{display:none}
  .footer-inner{grid-template-columns:1.25fr .8fr .95fr 1fr;gap:50px;padding-block:52px}.footer .brand img{width:140px}.footer p,.footer-column,.footer-contact{font-size:12px}.footer-brand,.footer-contact{grid-column:auto}.footer .prototype-note{grid-column:1/-1;margin-top:10px}
  .floating-cart{top:52px;right:24px}.contact-fab{right:24px;bottom:24px}.contact-menu{right:24px;bottom:84px}
}
@media(min-width:1100px){.header-main{gap:42px}.product-grid{gap:40px 26px}.product-info h3{font-size:15px}.price-stack strong{font-size:22px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.product-image,.toast{transition:none}}


/* v17 mobile: banner on top, glass chips, prices as text */
@media(max-width:699px){
.site-header{position:absolute;top:36px;left:0;right:0;z-index:20;border:0;background:transparent}
.header-main{height:64px}
.brand img{width:122px}
.city-button{justify-self:end;margin-right:62px;padding:9px 14px;border-radius:999px;background:rgb(255 255 255 / 72%);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-size:14px}
.floating-cart{top:45px;right:14px}
.banner-carousel{position:relative;width:100%;margin:0;padding:0}
.banner-track{gap:0;margin:0;padding:0}
.banner{flex:0 0 100%;height:420px;border-radius:0 0 var(--r) var(--r)}
.banner::after,.banner--light::after{background:linear-gradient(0deg,rgb(20 12 14 / 68%) 0%,rgb(20 12 14 / 0%) 52%),linear-gradient(180deg,rgb(20 12 14 / 26%) 0%,rgb(20 12 14 / 0%) 24%)}
.banner--light .banner-copy{color:#fff}.banner--light .banner-copy small{color:#ffdbe2}
.banner-copy{left:20px;bottom:46px}
.banner-copy strong{font-size:30px;letter-spacing:-1.2px}
.banner-copy b{font-size:13px}
.banner-dots{position:absolute;left:0;right:0;bottom:18px;z-index:3;display:flex;justify-content:center;gap:7px;pointer-events:none}
.banner-dots i{width:8px;height:8px;border-radius:50%;background:rgb(255 255 255 / 55%);transition:width .25s,background .25s}
.banner-dots i.on{width:26px;border-radius:8px;background:#fff}
.link-row--categories a.price-link{color:var(--muted)}
.price-link--first::before{content:"";position:absolute;left:-12px;top:50%;height:14px;margin-top:-7px;border-left:1px solid #d9d0cc}
}

/* v19: fixed bottom tab bar */
.tabbar{position:fixed;z-index:90;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(3,1fr);padding:6px 12px calc(6px + env(safe-area-inset-bottom));background:rgb(255 255 255 / 94%);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--line)}
.tabbar .tab{position:relative;inset:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:auto;height:auto;min-height:48px;padding:4px 0;border:0;border-radius:0;background:none;box-shadow:none;color:var(--ink);font-size:11px;font-weight:600;line-height:1}
.tabbar .tab svg{width:25px;height:25px;stroke:var(--red);stroke-width:1.8}
.tabbar .floating-cart-count{top:-3px;right:calc(50% - 25px);min-width:17px;height:17px;font-size:9px}
.contact-menu{right:auto;left:50%;bottom:calc(68px + env(safe-area-inset-bottom));transform:translateX(-50%)}
.toast{bottom:calc(84px + env(safe-area-inset-bottom))}
body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
@media(max-width:699px){.city-button{margin-right:0}}

/* v20: floating rounded tab bar + quantity stepper */
.tabbar{left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));max-width:420px;margin-inline:auto;padding:6px 8px;border:0;border-radius:var(--r);background:rgb(255 255 255 / 93%);box-shadow:0 10px 30px rgb(38 22 25 / 20%),0 0 0 1px rgb(236 230 227 / 90%)}
.contact-menu{bottom:calc(84px + env(safe-area-inset-bottom))}
.toast{bottom:calc(96px + env(safe-area-inset-bottom))}
body{padding-bottom:calc(88px + env(safe-area-inset-bottom))}
.js-ready .add-button{display:none}
.qty{position:absolute;right:9px;bottom:9px;z-index:2;display:flex;align-items:center;justify-content:flex-end;width:30px;height:30px;overflow:hidden;border-radius:999px;background:#fff;color:var(--red);box-shadow:0 3px 12px rgb(40 20 25 / 18%);transition:width .28s cubic-bezier(.22,.8,.3,1),background .2s,color .2s}
.qty button{display:grid;place-items:center;flex:none;width:30px;height:30px;padding:0;border:0;background:none;color:inherit}
.qty svg{width:15px;height:15px;stroke-width:2.5}
.qty-minus,.qty-num{width:0;opacity:0;transition:width .28s cubic-bezier(.22,.8,.3,1),opacity .18s}
.qty-minus{overflow:hidden}
.qty-num{display:block;overflow:hidden;text-align:center;font-size:13px;font-weight:800;line-height:30px}
.qty.is-on{width:92px;background:var(--red);color:#fff}
.qty.is-on .qty-minus{width:30px;opacity:1}
.qty.is-on .qty-num{width:28px;opacity:1}

/* v21 */
.qty.is-on{width:72px}
.qty.is-on .qty-minus{width:26px}
.qty.is-on .qty-num{width:20px}
.qty.is-on .qty-plus{width:26px}
.qty.is-on button{height:30px}
.link-row--categories a.price-link{color:var(--ink)}
.price-link--first::before{display:none}
.category-search .search-submit{width:30px;background:transparent;color:var(--ink);font-size:20px;font-weight:400}
.category-search .search-close{color:#9a9190}

/* v22 */
.category-search .search-close,.category-search .search-submit{width:30px;height:30px;color:#5d5556;font-size:0}
.category-search .search-close svg,.category-search .search-submit svg{width:18px;height:18px;stroke-width:2}

/* v23 */
.tabbar .floating-cart.has-items>span:first-of-type{font-weight:800}

/* v26 */
.tabbar .tab .ico{position:relative;display:block;width:25px;height:25px}
.tabbar .tab .ico .floating-cart-count{position:absolute;top:8px;right:auto;left:0;display:block;width:25px;min-width:0;height:13px;padding:0;border-radius:0;background:none;color:var(--red);font-size:11px;font-weight:800;line-height:13px;text-align:center}
.tabbar .floating-cart:not(.has-items) .floating-cart-count{display:none}
.tabbar .floating-cart.has-items .cart-label{font-weight:800}
.tabbar .contact-fab svg path:nth-of-type(2){fill:var(--red)}

/* v27 */
.tabbar .tab .ico .floating-cart-count{top:8.5px}
.tabbar .floating-cart[data-len="2"] .ico .floating-cart-count{font-size:10px}
.tabbar .floating-cart[data-len="3"] .ico .floating-cart-count{font-size:8.5px}
.qty.is-on.wide{width:84px}
.qty.is-on.wide .qty-num{width:32px}

/* v28: order-in-chat button */
.product-bottom{align-items:center}
.messenger-order{gap:0;padding:7px 9px;border-radius:999px;background:#fdeff2;box-shadow:none;color:#b5374e;font-size:11px;font-weight:700;line-height:1}
.messenger-order svg{display:none}
.messenger-order:hover{background:#fbe3e8}
@media(max-width:374px){.product-bottom{gap:4px}.messenger-order{padding:7px 7px;font-size:10px}}

/* v29: telegram promo */
.telegram-promo{gap:8px}
.telegram-promo .tg-icon{flex:none;width:18px;height:18px;fill:#fff;stroke:none}
/* v30 */
.telegram-promo .tg-icon{width:20px;height:17px}

/* v31: sticky glass header + menu */
.site-header{position:sticky;top:10px;left:auto;right:auto;height:0;z-index:20;border:0;background:transparent}
.site-header .header-main{position:absolute;left:0;right:0;top:12px;height:auto;display:flex;align-items:center;justify-content:space-between}
.glass{display:inline-flex;align-items:center;justify-content:center;height:44px;border:0;border-radius:999px;background:rgb(255 255 255 / 74%);-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4);box-shadow:0 2px 14px rgb(30 15 20 / 16%),inset 0 0 0 1px rgb(255 255 255 / 55%);color:var(--ink)}
.menu-button{width:44px;padding:0}
.menu-button svg{width:22px;height:22px;stroke:var(--ink);stroke-width:2}
.city-button.glass{margin:0;padding:0 16px;gap:6px;height:44px;border-radius:999px;background:rgb(255 255 255 / 74%);color:var(--red);font-size:14px;font-weight:700}
.city-button.glass svg{width:16px;height:16px}
.menu-overlay{position:fixed;inset:0;z-index:99;background:rgb(27 21 24 / 45%);opacity:0;pointer-events:none;transition:opacity .25s}
.menu-open .menu-overlay{opacity:1;pointer-events:auto}
.menu-drawer{position:fixed;z-index:100;top:0;bottom:0;left:0;display:flex;flex-direction:column;width:min(84%,330px);padding:18px 22px calc(24px + env(safe-area-inset-bottom));overflow-y:auto;border-radius:0 var(--r) var(--r) 0;background:#fff;box-shadow:0 0 50px rgb(35 21 25 / 25%);transform:translateX(-104%);visibility:hidden;transition:transform .3s cubic-bezier(.22,.8,.3,1),visibility 0s linear .3s}
.menu-open .menu-drawer{transform:none;visibility:visible;transition:transform .3s cubic-bezier(.22,.8,.3,1),visibility 0s}
.menu-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}
.menu-head .brand img{width:118px}
.menu-close{display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:#f5f2f1;color:var(--ink)}
.menu-close svg{width:18px;height:18px;stroke-width:2}
.menu-group{display:grid;margin-bottom:22px}
.menu-group small{margin-bottom:4px;color:var(--muted);font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.menu-group a{padding:13px 0;border-bottom:1px solid var(--line);font-size:18px;font-weight:600}
.menu-group a:last-child{border-bottom:0}
.menu-call{display:grid;place-items:center;margin-top:auto;height:48px;border-radius:var(--r);background:#fdeff2;color:#b5374e;font-size:14px;font-weight:700}

/* v32: long prices */
.product-bottom{flex-wrap:wrap;row-gap:8px}
.messenger-order{padding-inline:8px}
@media(max-width:374px){.messenger-order{padding-inline:7px}}

/* v35: 6-digit prices (100 000 and up) get a short button label */
.product-card.long-price .messenger-order{font-size:0}
.product-card.long-price .messenger-order::after{content:"В чате";font-size:11px;font-weight:700}

/* v36: phone app frame (viewer bar, safe areas) */
html{background:linear-gradient(#de002b,#de002b) top/100% env(safe-area-inset-top,0px) no-repeat,#f8f6f4}
.site-header{top:calc(env(safe-area-inset-top,0px) + 10px)}
.tabbar{bottom:10px}
.contact-menu{bottom:84px}
.toast{bottom:96px}
.menu-drawer{padding-top:calc(env(safe-area-inset-top,0px) + 18px)}

/* v36: category row, larger and level with the search icon */
.link-row--categories{align-items:center}
.link-row--categories a{padding:11px 0 9px;font-size:15px;line-height:1}
.search-toggle svg{width:20px;height:20px}

/* v37: full-width search, no iOS focus zoom, sale tag centering */
.catalog-navigation.search-open .search-reveal,.search-state:checked~.search-reveal{width:calc(100vw - 77px)}
.category-search{width:100%;max-width:none}
.category-search input{font-size:16px;zoom:1}
.catalog-navigation .category-links{transition:opacity .18s ease,visibility 0s linear .2s}
.catalog-navigation.search-open .category-links{opacity:0;visibility:hidden;transition:opacity .12s ease,visibility 0s}
.tag--sale{padding:6.5px 7px 3.5px}

/* v38: sale tag centering, closer bottom bar, search icon matches text */
.tag--sale{padding:5.5px 7px 4.5px}
.tabbar{bottom:6px}
.contact-menu{bottom:80px}
.toast{bottom:92px}
.link-row--categories a{font-size:15px}
.search-toggle svg{width:18px;height:18px;stroke-width:2.1}

/* v39: square product photos, city in menu, loupe matches cap height */
.product-photo{aspect-ratio:1/1}
.search-toggle svg{width:14px;height:14px;stroke-width:2.8;transform:translateY(.4px)}
.city-button.menu-city{display:flex;align-items:center;gap:10px;width:100%;margin:-8px 0 20px;padding:13px 14px;border:0;border-radius:var(--r);background:#f8f5f3;color:var(--ink);font-size:16px;font-weight:700}
.city-button.menu-city svg{width:20px;height:20px;color:var(--red);stroke-width:2}
.city-button.menu-city::after{content:"Изменить";margin-left:auto;color:var(--muted);font-size:13px;font-weight:600}

/* v42: card stays 3:4 with original photos */
.product-photo{aspect-ratio:3/4}

/* v43: city row is just a tappable pin + name; drawer follows a left swipe */
.city-button.menu-city::after{content:none}
.city-button.menu-city:active{background:#f1ece9}
.menu-drawer{touch-action:pan-y;will-change:transform}

/* v44: promo is a rounded button under the banner; heading above the grid */
html{background:linear-gradient(#2b2524,#2b2524) top/100% env(safe-area-inset-top,0px) no-repeat,#f8f6f4}
.site-header .header-main{top:14px}
.telegram-promo.shell{display:flex;align-items:center;justify-content:center;gap:10px;width:min(calc(100% - 40px),var(--shell));min-height:46px;margin:14px auto 0;padding:0 16px;border-radius:var(--r);font-size:14px}
.telegram-promo .tg-icon{width:22px;height:19px}
.catalog-navigation{padding-top:8px}
.catalog-title{margin:0 0 14px;color:var(--ink);font-size:22px;font-weight:800;line-height:1.1;letter-spacing:-.6px}

/* v45: Cormorant Garamond for display headings, Onest for everything else */
body{font-family:'Onest',-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif}
.banner-copy strong,.catalog-title,.seo h2,.chat-dialog h2{font-family:'Cormorant Garamond',Georgia,'Times New Roman',serif;font-weight:700}
.banner-copy strong{font-size:36px;line-height:.98;letter-spacing:-.4px}
.catalog-title{font-size:30px;line-height:1;letter-spacing:-.3px}
.seo h2{font-size:28px;letter-spacing:-.2px}
.chat-dialog h2{font-size:32px;letter-spacing:-.3px}

/* v46: no shadow cut-off under the tab bar; snappier taps */
.tabbar{box-shadow:0 -3px 14px rgb(38 22 25 / 15%),0 0 0 1px rgb(236 230 227 / 90%)}
a,button,label,.qty button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.tabbar .tab:active,.messenger-order:active,.telegram-promo:active,.menu-button:active{opacity:.7}
.tabbar .tab,.messenger-order,.telegram-promo,.menu-button{transition:opacity .12s ease}

/* v47: Manrope everywhere */
body{font-family:'Manrope',-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif}
.banner-copy strong,.catalog-title,.seo h2,.chat-dialog h2{font-family:inherit;font-weight:800}
.banner-copy strong{font-size:30px;line-height:1.02;letter-spacing:-1.2px}
.catalog-title{font-size:24px;line-height:1.1;letter-spacing:-.6px}
.seo h2{font-size:22px;letter-spacing:-.7px}
.chat-dialog h2{font-size:27px;letter-spacing:-1px}

/* v48: cart tab turns into a red pill once something is in the cart */
.tabbar .floating-cart{border-radius:var(--r);transition:background-color .2s ease,color .2s ease,opacity .12s ease}
.tabbar .floating-cart.has-items{background:var(--red);color:#fff}
.tabbar .floating-cart.has-items svg{stroke:#fff}
.tabbar .floating-cart.has-items .ico .floating-cart-count{color:#fff}
.tabbar .floating-cart.has-items .cart-label{color:#fff}
.tabbar .floating-cart .cart-label{text-align:center}

/* v49: tab icons share the same optical top/bottom; no double-tap zoom */
.tabbar .tab .ico .floating-cart-count{top:8.3px}
.tabbar .contact-fab svg{transform:translateY(-.5px)}
html{touch-action:manipulation}

/* v50: more room inside the cart pill and tab bar */
.tabbar .tab{min-height:56px;padding:6px 0 8px;gap:5px}
.tabbar .tab .ico .floating-cart-count{top:7.6px;font-size:10.5px}
.tabbar .floating-cart[data-len="2"] .ico .floating-cart-count{font-size:9.5px}
.tabbar .floating-cart[data-len="3"] .ico .floating-cart-count{font-size:8px}
.contact-menu{bottom:90px}
.toast{bottom:102px}
body{padding-bottom:calc(98px + env(safe-area-inset-bottom))}

/* v51: bigger category text, loupe sized to cap height, 44px tap target */
.link-row--categories{align-items:center;gap:12px}
.link-row--categories a{padding:11px 0 9px;font-size:16px;line-height:1}
.category-links{gap:18px}
.search-control{width:44px;height:44px;margin-left:-16px}
.search-toggle{width:44px;height:44px;background:transparent}
.search-toggle svg{width:14.5px;height:14.5px;stroke-width:3.2;transform:translateY(.9px)}
.search-reveal{top:4px}
.catalog-navigation.search-open .search-reveal,.search-state:checked~.search-reveal{width:calc(100vw - 73px)}

/* v52: red tab bar with white icons (like the reference), white pill for the cart */
.tabbar{background:var(--red);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 -3px 14px rgb(38 22 25 / 16%)}
.tabbar .tab{color:#fff;font-weight:700}
.tabbar .tab svg{fill:currentColor;stroke:none;stroke-width:0}
.tabbar .tab svg .knock{fill:var(--red)}
.tabbar .contact-fab svg{transform:none}
.tabbar .floating-cart.has-items{background:#fff;color:var(--red)}
.tabbar .floating-cart.has-items svg{fill:var(--red);stroke:none}
.tabbar .floating-cart.has-items svg path{stroke:var(--red)}
.tabbar .floating-cart.has-items .ico .floating-cart-count{color:#fff}
.tabbar .floating-cart.has-items .cart-label{color:var(--red)}
.tabbar .floating-cart:not(.has-items) .floating-cart-count{display:none}
@media (display-mode:standalone){
  .site-header .header-main{top:calc(env(safe-area-inset-top,0px) + 14px)}
}

/* v53: contacts in the menu; tab icons share one vertical centre */
.tabbar .contact-fab svg{transform:translateY(-1px)}
.menu-call{display:none}
.menu-contacts{display:grid;gap:12px;margin-top:auto;padding:16px;border-radius:var(--r);background:#f8f5f3}
.menu-phone{color:var(--ink);font-size:22px;font-weight:800;letter-spacing:-.3px}
.menu-row{display:flex;align-items:flex-start;gap:10px;margin:0;color:#655e5f;font-size:14px;line-height:1.35}
.menu-row svg{flex:none;width:18px;height:18px;margin-top:1px;color:var(--red);stroke-width:2}

/* v55: menu button is bigger and steps out past the photo edge */
.menu-button{width:48px;height:48px;margin-left:-8px}
.menu-button svg{width:24px;height:24px}

/* v56: round menu button again; loupe-to-text gap equals the gap between categories */
.menu-button{width:44px;height:44px;border-radius:50%;margin-left:-8px}
.menu-button svg{width:22px;height:22px}
.link-row--categories{gap:3px}

/* v57: three tab icons share the same ink box (y 3.5-20.5); cart text weight equals the others */
.tabbar .contact-fab svg{transform:none}
.tabbar .tab .cart-label,.tabbar .floating-cart.has-items .cart-label,.tabbar .floating-cart.has-items>span:first-of-type{font-weight:700}

/* v58: bubble with a bolt, basket for the cart */
.tabbar .tab svg .weave{stroke:var(--red)}
.tabbar .floating-cart.has-items .weave{display:none}

/* v59: no item count; empty cart shows the basket, a filled cart shows only the total in the white pill */
.tabbar .floating-cart .floating-cart-count{display:none !important}
.tabbar .floating-cart.has-items .ico{display:none}
.tabbar .floating-cart.has-items{padding:7px 0}
.tabbar .floating-cart.has-items .cart-label{font-size:15px;font-weight:700;letter-spacing:-.2px}

/* v60: even red frame around the pill; search grows out of the loupe; ink-coloured icons */
.tabbar{padding:6px}
.search-toggle{position:relative;z-index:2}
.search-reveal{left:16px;top:4px;z-index:1}
.catalog-navigation.search-open .search-reveal,.search-state:checked~.search-reveal{width:calc(100vw - 40px)}
.category-search{padding-left:38px}
.search-state:checked+.search-toggle{color:var(--ink)}
.category-search .search-close,.category-search .search-submit{color:var(--ink)}

/* v60b: the loupe steps inside the field when search opens */
.search-toggle svg{transition:transform .3s cubic-bezier(.22,.8,.3,1)}
.search-state:checked+.search-toggle svg{transform:translate(14px,.4px)}

/* v61: loupe sits in a soft round button; the field grows around it. Heart in the chat bubble. */
.search-control{width:44px;height:44px;margin-left:-2px}
.search-toggle{width:44px;height:44px;background:transparent}
.search-toggle::before{content:"";position:absolute;inset:2px;border-radius:50%;background:#f3efed;transition:opacity .2s ease}
.search-toggle svg{position:relative;width:17px;height:17px;stroke-width:2.7;transform:translate(-.35px,-.35px)}
.search-state:checked+.search-toggle svg{transform:translate(-.35px,-.35px)}
.search-state:checked+.search-toggle::before{opacity:0}
.search-reveal{left:2px}
.link-row--categories{gap:12px}

.link-row--categories a{padding:10px 0}

/* v62: the loupe is an oval pill; on tap the same pill stretches to the right into the search field */
.search-control{width:56px;height:44px;margin-left:-2px}
.search-toggle{width:56px;height:44px;z-index:auto}
.search-toggle::before{inset:auto;left:2px;top:2px;width:52px;height:40px;border-radius:999px;background:#f3efed;opacity:1;z-index:0;transition:width .34s cubic-bezier(.22,.8,.3,1)}
.search-state:checked+.search-toggle::before{width:calc(100vw - 40px);opacity:1}
.search-toggle svg{z-index:3;transition:transform .34s cubic-bezier(.22,.8,.3,1)}
.search-state:checked+.search-toggle svg{transform:translate(-6.35px,-.35px)}
.search-reveal{z-index:1}
.category-search{background:transparent;box-shadow:none}

/* v63: one corner style for the search, the Telegram button and the bottom bar: fully rounded pills */
.telegram-promo.shell{border-radius:999px}
.tabbar{border-radius:999px}
.tabbar .floating-cart{border-radius:999px}

/* v64: one corner radius (12px, same as the photos) for every button and panel; tab bar always on its own layer */
.telegram-promo.shell,.tabbar,.tabbar .floating-cart,.menu-button,.menu-contacts,.city-button.menu-city,.messenger-order{border-radius:var(--r)}
.search-toggle::before{border-radius:999px}
.tabbar{transform:translate3d(0,0,0);-webkit-transform:translate3d(0,0,0);will-change:transform;backface-visibility:hidden}

/* v65: first screen ends with the search row; the gap above the bottom bar equals the 14px gap under the banner, so no heading letters peek out */
@media(max-width:699px){.banner{height:clamp(360px,calc(100svh - 200px),540px)}}

/* v66: lower banner so the "Наши букеты" heading and the top of the first cards show above the bottom bar */
@media(max-width:699px){.banner{height:clamp(300px,calc(100svh - 338px),460px)}}

/* v67: banner has one offer + one action, no small eyebrow line */
.banner-copy small{display:none}

/* v68: big surfaces and buttons share 12px; the small round things on the card (+, tags, "В чате") are fully round */
@media(max-width:699px){.banner{border-radius:0 0 var(--r) var(--r)}}
.tag,.tag--sale,.messenger-order{border-radius:999px}
.add-button{border-radius:50%}

/* v69: banner shading goes bottom-up (light on top, darker under the text) instead of left-to-right */
@media(max-width:699px){.banner::after{background:linear-gradient(180deg,transparent 35%,rgb(30 20 22 / 30%) 62%,rgb(30 20 22 / 68%) 100%)}}

/* v70: slightly smaller category text and a slightly lower search pill (44 -> 40px row, 40 -> 36px pill) */
.link-row--categories a{font-size:15px}
.search-control{width:52px;height:40px}
.search-toggle{width:52px;height:40px}
.search-toggle::before{width:48px;height:36px}
.search-state:checked+.search-toggle::before{width:calc(100vw - 40px)}
.search-state:checked+.search-toggle svg{transform:translate(-4.35px,-.35px)}
.search-toggle svg{width:16px;height:16px}
.search-reveal{top:2px}

/* v71: scrolling down shrinks the bottom bar to icons only; scrolling up (or the top of the page) brings the labels back */
.tabbar{max-width:min(420px,calc(100vw - 24px));transition:max-width .32s cubic-bezier(.22,.8,.3,1),box-shadow .2s ease}
.tabbar .tab{transition:min-height .32s cubic-bezier(.22,.8,.3,1),padding .32s cubic-bezier(.22,.8,.3,1)}
.tabbar.compact{max-width:272px}
.tabbar.compact .tab{min-height:40px;padding:0;gap:0;align-content:center}
.tabbar.compact .tab>span:not(.ico):not(.cart-label){display:none}
.tabbar.compact .floating-cart:not(.has-items) .cart-label{display:none}
.tabbar.compact .floating-cart.has-items{padding:0}
.tabbar.compact .floating-cart.has-items .cart-label{font-size:14px}
body:has(.tabbar.compact) .contact-menu{bottom:64px}

/* v72: description block and footer in the same language as the page (12px surfaces, soft greys, red only for actions) */
@media(max-width:699px){
.seo.shell{margin-top:36px;margin-bottom:36px;padding:0;background:transparent;border-radius:0}
.seo h2{margin:0 0 12px;font-size:24px;line-height:1.15;letter-spacing:-.4px}
.seo-copy{position:relative;padding:0;background:transparent;border-radius:0;color:#5f5557;font-size:15px;line-height:1.55}
.seo-copy p{margin:0 0 12px;color:inherit;font-size:15px;line-height:1.55}
.seo:not(.is-open) .seo-copy{max-height:72px;overflow:hidden}
.seo:not(.is-open) .seo-copy::after{height:44px;background:linear-gradient(180deg,rgb(255 255 255 / 0%),#fff)}
.seo-toggle{margin-top:4px;padding:8px 0;border:0;background:transparent;color:var(--red);font:inherit;font-size:15px;font-weight:700}
body{padding-bottom:0}
.footer{margin-top:40px;padding:28px 0 calc(100px + env(safe-area-inset-bottom));background:#f8f5f3;border-top:0;border-radius:var(--r) var(--r) 0 0}
.footer-inner.shell{display:grid;grid-template-columns:1fr 1fr;gap:28px 20px;padding:0 20px}
.footer-brand{grid-column:1/-1}
.footer-brand img{height:34px;width:auto;border-radius:var(--r)}
.footer-brand p{margin:10px 0 0;color:#7b7172;font-size:14px;line-height:1.45}
.footer-column{display:flex;flex-direction:column;gap:0}
.footer-column strong,.footer-contact strong{margin-bottom:6px;font-size:13px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:#9a8f90}
.footer-column a{padding:9px 0;color:var(--ink);font-size:15px;font-weight:600}
.footer-contact{grid-column:1/-1;display:flex;flex-direction:column}
.footer-phone{padding:4px 0 8px;color:var(--ink);font-size:22px;font-weight:800;letter-spacing:-.3px}
.footer-contact p{margin:0;color:#5f5557;font-size:14px;line-height:1.55}
.footer-chats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px}
.footer-chats a{display:grid;place-items:center;height:44px;border-radius:var(--r);background:#fff;color:var(--ink);font-size:14px;font-weight:700}
.footer-legal{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px 16px;margin:0;padding-top:20px;border-top:1px solid #e9e2df;color:#9a8f90;font-size:12px}
.footer-legal a{color:inherit;text-decoration:underline}
.footer .prototype-note{margin:0;color:#b3a8a9;font-size:11px}
}

/* v73: one bottom sheet for "Заказ в чате" and "Связаться" (neutral buttons with the messenger's own colour in the icon) */
.contact-menu{display:none !important}
html.sheet-lock{overflow:hidden}
.sheet-overlay{position:fixed;inset:0;z-index:140;background:rgb(30 20 22 / 46%);opacity:0;visibility:hidden;transition:opacity .28s ease,visibility 0s linear .28s}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:150;max-width:480px;margin:0 auto;padding:10px 20px calc(20px + env(safe-area-inset-bottom));border-radius:var(--r) var(--r) 0 0;background:#fff;box-shadow:0 -8px 30px rgb(38 22 25 / 18%);transform:translate3d(0,102%,0);visibility:hidden;transition:transform .32s cubic-bezier(.22,.8,.3,1),visibility 0s linear .32s}
.sheet.is-dragging{transition:none}
html.sheet-open .sheet-overlay{opacity:1;visibility:visible;transition:opacity .28s ease}
html.sheet-open .sheet{transform:translate3d(0,0,0);visibility:visible;transition:transform .32s cubic-bezier(.22,.8,.3,1)}
.sheet-grip{width:36px;height:4px;margin:0 auto 14px;border-radius:2px;background:#d9d0cc}
.sheet-close{position:absolute;top:14px;right:16px;display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:var(--r);background:#f3efed;color:var(--ink)}
.sheet-close svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.sheet-product{display:none;align-items:center;gap:12px;margin:0 44px 16px 0}
.sheet.is-order .sheet-product{display:flex}
.sheet-thumb{flex:none;width:52px;height:68px;border-radius:var(--r);background:#f1edeb center/cover no-repeat}
.sheet-product strong{display:block;font-size:15px;line-height:1.25;font-weight:700}
.sheet-product span{display:block;margin-top:4px;font-size:16px;font-weight:800}
.sheet h3{margin:0 44px 4px 0;font-size:22px;line-height:1.15;letter-spacing:-.3px}
.sheet-sub{margin:0 0 16px;color:#7b7172;font-size:14px;line-height:1.4}
.sheet-list{display:grid;gap:8px}
.sheet-btn{display:flex;align-items:center;gap:12px;width:100%;height:52px;padding:0 14px;border:0;border-radius:var(--r);background:#f3efed;color:var(--ink);font:inherit;font-size:16px;font-weight:700;text-align:left;text-decoration:none}
.sheet-btn i{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%}
.sheet-btn i svg{width:17px;height:17px;fill:#fff}
.sheet-btn--tg i{background:#2aabee}
.sheet-btn--max i{background:linear-gradient(135deg,#3ec1ff,#7a4cff)}
.sheet-btn--wa i{background:#25d366}
.sheet-btn--call{display:none;justify-content:center;background:var(--red);color:#fff}
.sheet.is-contact .sheet-btn--call{display:flex}
.sheet-note{display:none;margin:12px 0 0;color:#9a8f90;font-size:12px;text-align:center}
.sheet.is-order .sheet-note{display:block}

/* v74: official messenger icons (taken from domroz.ru), no blue focus ring after tapping "Заказ в чате", sheet reaches the very bottom */
.sheet-btn i svg{width:18px;height:18px}
.sheet-btn--max i svg{width:16px;height:16px}
.sheet-btn--tg i svg{width:19px;height:19px;margin-right:1px}
.sheet-btn--wa i svg{width:19px;height:19px}
.messenger-order:focus{outline:0}
.messenger-order:focus-visible{outline:2px solid var(--red);outline-offset:2px}
.messenger-order,.sheet-btn,.sheet-close{-webkit-tap-highlight-color:transparent}
.sheet{padding-bottom:calc(16px + env(safe-area-inset-bottom))}
.sheet::after{content:"";position:absolute;left:0;right:0;top:100%;height:240px;background:#fff}

/* v75: flat white messenger icons (no inherited dark outline); the dim layer and the sheet reach the real bottom of the screen even while Safari's toolbar is collapsed or expanded */
.sheet-btn i svg,.sheet-btn i svg path{stroke:none;stroke-width:0}
.sheet-btn--max i svg path{fill:#fff}
.sheet-overlay{bottom:calc(100dvh - 100lvh)}
.sheet{bottom:calc(100dvh - 100lvh);padding-bottom:calc(16px + env(safe-area-inset-bottom) + 100lvh - 100dvh)}

/* v76: messenger buttons are red with white logos and white labels; page stays put behind the sheet */
.sheet-btn:not(.sheet-btn--call){background:var(--red);color:#fff}
.sheet-btn i{width:26px;height:26px;border-radius:0;background:transparent !important}
.sheet-btn i svg{width:22px;height:22px;fill:#fff}
.sheet-btn--max i svg{width:22px;height:22px}
.sheet-btn--tg i svg,.sheet-btn--wa i svg{width:22px;height:22px;margin:0}
body.sheet-fixed{position:fixed;left:0;right:0;width:100%}
.sheet-overlay,.sheet{overscroll-behavior:contain;touch-action:none}
.sheet-btn,.sheet-close{touch-action:manipulation}

/* v77: grey buttons again; only the round icon badges are red, logos white */
.sheet-btn:not(.sheet-btn--call){background:#f3efed;color:var(--ink)}
.sheet-btn i{width:32px;height:32px;border-radius:50%;background:var(--red) !important}
.sheet-btn i svg,.sheet-btn--max i svg,.sheet-btn--tg i svg,.sheet-btn--wa i svg{width:17px;height:17px;fill:#fff}

/* v78: logos centred by their visual weight, not only by their bounding box */
.sheet-btn i svg{width:18px;height:18px}
.sheet-btn--tg i svg{transform:translate(-1.3px,.1px)}
.sheet-btn--max i svg{transform:translate(.2px,-.2px)}
.sheet-btn--wa i svg{transform:translate(.3px,-.3px)}

/* v79: nested radii follow the outer one (12 outside, 12 - 6px frame = 6 inside) so the red frame around the white cart pill is even; remaining odd radii (toast, menu drawer) join the 12px family */
.tabbar .floating-cart,.tabbar .floating-cart.has-items{border-radius:6px}
.toast{border-radius:var(--r)}
.menu-drawer{border-radius:0 var(--r) var(--r) 0}

/* v80: corner radius 16px for photos, banner, buttons, panels and sheet; nested white cart pill 10px (outer minus the 6px frame) */
.telegram-promo.shell,.tabbar,.menu-button,.menu-contacts,.city-button.menu-city,.product-photo,.sheet-close,.sheet-btn,.sheet-thumb,.toast{border-radius:var(--r)}
.search-toggle::before{border-radius:999px}
.tabbar .floating-cart,.tabbar .floating-cart.has-items{border-radius:10px}
@media(max-width:699px){.banner{border-radius:0 0 var(--r) var(--r)}}
.footer{border-radius:var(--r) var(--r) 0 0}
.sheet{border-radius:var(--r) var(--r) 0 0}
.menu-drawer{border-radius:0 var(--r) var(--r) 0}

/* v82: desktop (from 1024px): top navigation instead of the burger and the bottom bar, narrower feed, banner with arrows, Telegram button compact, contact sheet becomes a centred modal */
.dt-header{display:none}
@media(min-width:1024px){
:root{--shell:1120px}
.site-header,.tabbar,.menu-drawer,.menu-overlay,.contact-menu{display:none !important}
body{padding-bottom:0}
.dt-header{display:block;position:sticky;top:0;z-index:80;background:#fff;border-bottom:1px solid var(--line)}
.dt-header__in{display:flex;align-items:center;gap:40px;width:min(calc(100% - 40px),var(--shell));height:72px;margin:0 auto}
.dt-logo{display:block;flex:none}
.dt-logo img{display:block;height:34px;width:auto;border-radius:var(--r)}
.dt-nav{display:flex;flex:1;gap:30px}
.dt-nav a{padding:8px 0;border-bottom:2px solid transparent;color:var(--ink);font-size:15px;font-weight:600;text-decoration:none;transition:border-color .2s,color .2s}
.dt-nav a:hover{color:var(--red)}
.dt-nav a.is-active{border-bottom-color:var(--red)}
.dt-actions{display:flex;align-items:center;gap:12px}
.dt-phone{margin-right:8px;color:var(--ink);font-size:16px;font-weight:800;text-decoration:none;white-space:nowrap}
.dt-contact,.dt-cart{display:flex;align-items:center;gap:8px;height:44px;padding:0 20px;border:0;border-radius:var(--r);font:inherit;font-size:15px;font-weight:700;cursor:pointer}
.dt-contact{background:#f3efed;color:var(--ink)}
.dt-contact:hover{background:#ebe5e2}
.dt-cart{background:var(--red);color:#fff}
.dt-cart svg{width:20px;height:20px;fill:#fff}
.dt-cart svg path:nth-child(2){stroke:#fff}
.dt-cart.has-items{background:var(--red)}
main{display:flex;flex-direction:column}
.banner-carousel{order:1;position:relative;width:min(calc(100% - 40px),var(--shell));margin:24px auto 0;padding:0}
.banner-track{gap:0;margin:0;padding:0;border-radius:var(--r)}
.banner{flex:0 0 100%;height:400px;border-radius:var(--r)}
.banner-copy{left:56px;bottom:56px}
.banner-copy strong{font-size:46px;line-height:1.05}
.banner-copy b{font-size:18px}
.bn-arrow{position:absolute;top:50%;z-index:5;display:grid;place-items:center;width:44px;height:44px;margin-top:-22px;border:0;border-radius:var(--r);background:rgb(255 255 255 / 86%);color:var(--ink);cursor:pointer;box-shadow:0 2px 10px rgb(38 22 25 / 16%)}
.bn-arrow svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.bn-prev{left:16px}.bn-next{right:16px}
.catalog-navigation{order:2;margin-top:20px}
.telegram-promo.shell{order:3;width:fit-content;min-height:46px;margin:16px auto 0 calc((100% - min(100% - 40px,var(--shell)))/2);padding:0 28px}
.showcase{order:4}
.seo{order:5}
#product-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 20px}
.product-image{transition:transform .5s cubic-bezier(.22,.8,.3,1)}
.product-card:hover .product-image{transform:scale(1.04)}
.seo.shell{max-width:760px;margin-left:calc((100% - min(100% - 40px,var(--shell)))/2);margin-right:auto}
.sheet{left:50%;right:auto;top:50%;bottom:auto;width:440px;max-width:calc(100% - 40px);margin:0;padding:22px 24px 24px;border-radius:var(--r);transform:translate(-50%,-47%) scale(.98);opacity:0;transition:transform .25s cubic-bezier(.22,.8,.3,1),opacity .2s ease,visibility 0s linear .25s}
html.sheet-open .sheet{transform:translate(-50%,-50%) scale(1);opacity:1;transition:transform .25s cubic-bezier(.22,.8,.3,1),opacity .2s ease}
.sheet-grip,.sheet::after{display:none}
.sheet-close{top:18px;right:18px}
.sheet-btn:hover{background:#ebe5e2}
}

@media(min-width:1024px){
.dt-header__in{gap:32px}
.dt-nav{gap:26px;white-space:nowrap}
.dt-nav a{white-space:nowrap}
.dt-actions{flex:none}
.catalog-navigation,.showcase,.footer-inner{padding-inline:0}
.banner::after,.banner--light::after{background:linear-gradient(90deg,rgb(30 20 22 / 68%) 0%,rgb(30 20 22 / 34%) 42%,transparent 72%)}
.banner-copy,.banner--light .banner-copy{color:#fff}
.banner-copy strong,.banner-copy b,.banner--light .banner-copy strong,.banner--light .banner-copy b{color:#fff}
}

@media(min-width:1024px){
.dt-header__in{gap:28px}
.dt-nav{gap:24px}
.dt-actions{gap:10px}
.link-row--categories,.category-links{justify-content:flex-start}
}

/* v83: narrower feed (940px) so the product photos are ~220px wide; the header keeps its own 1120px width */
@media(min-width:1024px){
:root{--shell:940px}
.dt-header__in{width:min(calc(100% - 40px),1120px)}
.banner{height:360px}
.banner-copy{left:48px;bottom:48px}
.banner-copy strong{font-size:40px}
#product-grid{gap:28px 20px}
}

/* v84: desktop keeps the full "Заказ в чате" label even for six-digit prices (the short "В чате" is a phone-only rule) */
@media(min-width:1024px){
.product-card.long-price .messenger-order{font-size:11px}
.product-card.long-price .messenger-order::after{content:none}
}

/* v85: from 1200px the right column is a sticky cart (checkout opens inside it); the feed stays on the left in 4 columns */
.cart-panel{display:none}
@media(min-width:1200px){
:root{--shell:1284px}
.dt-header__in{width:min(calc(100% - 40px),1284px)}
.dt-cart{display:none}
main{display:grid;grid-template-columns:minmax(0,1fr) 320px;column-gap:24px;align-items:start;width:min(calc(100% - 40px),1284px);margin:0 auto}
main>.shell{width:auto;max-width:none;margin-left:0;margin-right:0;grid-column:1}
main>.banner-carousel{grid-row:1;order:0;margin-top:24px}
main>.catalog-navigation{grid-row:2;order:0}
main>.telegram-promo.shell{grid-row:3;order:0;justify-self:start;margin:16px 0 0}
main>.showcase{grid-row:4;order:0}
main>.seo{grid-row:5;order:0;margin-left:0;max-width:760px}
.cart-panel{display:block;grid-column:2;grid-row:1 / span 5;align-self:stretch;margin-top:24px}
.cart-panel__in{position:sticky;top:96px;display:flex;flex-direction:column;max-height:calc(100vh - 116px);overflow:auto;padding:20px;border:1px solid var(--line);border-radius:var(--r);background:#fff}
.cp-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:12px}
.cp-head h2{margin:0;font-size:22px;letter-spacing:-.3px}
.cp-count{color:#9a8f90;font-size:14px;font-weight:600}
.cp-empty{display:grid;gap:6px;padding:28px 16px;border-radius:var(--r);background:#f8f5f3;text-align:center}
.cp-empty strong{font-size:15px}
.cp-empty span{color:#7b7172;font-size:14px;line-height:1.4}
.cart-panel.has-items .cp-empty{display:none}
.cp-list{display:none;margin:0;padding:0;list-style:none}
.cart-panel.has-items .cp-list{display:grid;gap:14px}
.cp-item{display:grid;grid-template-columns:56px 1fr;gap:12px;align-items:start}
.cp-thumb{width:56px;height:74px;border-radius:var(--r);background:#f1edeb center/cover no-repeat}
.cp-name{display:block;font-size:14px;line-height:1.3;font-weight:600}
.cp-row{display:flex;align-items:center;justify-content:space-between;margin-top:8px}
.cp-price{font-size:15px;font-weight:800}
.cp-price.is-sale{color:var(--red)}
.cp-price del{display:block;font-size:12px;font-weight:400;color:#8a8a8a}
.cp-step{display:inline-flex;align-items:center;height:30px;border-radius:999px;background:#f3efed}
.cp-step button{width:30px;height:30px;border:0;background:transparent;color:var(--ink);font:inherit;font-size:18px;line-height:1;cursor:pointer}
.cp-step span{min-width:18px;text-align:center;font-size:14px;font-weight:700}
.cp-foot{display:none;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.cart-panel.has-items .cp-foot{display:block}
.cp-total{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:14px}
.cp-total span{color:#7b7172;font-size:15px}
.cp-total strong{font-size:22px;font-weight:800}
.cp-order{width:100%;height:50px;border:0;border-radius:var(--r);background:var(--red);color:#fff;font:inherit;font-size:16px;font-weight:700;cursor:pointer}
.cp-order:hover{background:#b3001f}
.cp-note{margin:12px 0 0;color:#9a8f90;font-size:12px;line-height:1.4}
.cp-form{display:none;gap:12px;margin-top:12px}
.cp-form label{display:grid;gap:6px;color:#7b7172;font-size:13px;font-weight:600}
.cp-form input{height:44px;padding:0 14px;border:0;border-radius:var(--r);background:#f3efed;color:var(--ink);font:inherit;font-size:15px;outline:0}
.cp-form input:focus{box-shadow:0 0 0 2px var(--red)}
.cp-back{justify-self:start;padding:0;border:0;background:transparent;color:var(--red);font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.cart-panel.is-checkout .cp-list,.cart-panel.is-checkout .cp-foot,.cart-panel.is-checkout .cp-empty{display:none}
.cart-panel.is-checkout .cp-form{display:grid}
}

/* v86: desktop banner mosaic (big carousel + two tiles: peony roses and the Telegram offer); empty cart shows three perks; the long Telegram button is gone on desktop */
.cp-perks,.mosaic-side,.bn-arrow{display:none}
@media(min-width:1024px){
.telegram-promo.shell{display:none !important}
.banner-carousel{display:grid;grid-template-columns:300px minmax(0,1fr);gap:12px;height:360px}
.banner-carousel .banner-track{order:2;height:360px}
.mosaic-side{order:1;display:grid !important;grid-template-rows:1fr 1fr;gap:12px;min-height:0}
.mosaic-tile{position:relative;display:block;height:auto !important;min-height:0;overflow:hidden;border-radius:var(--r);background:#332d2c;color:#fff;text-decoration:none}
.mosaic-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mosaic-tile .banner-copy{position:absolute;left:20px;right:16px;bottom:18px}
.mosaic-tile .banner-copy strong{font-size:22px;line-height:1.1}
.mosaic-tile .banner-copy b{display:block;margin-top:8px;font-size:14px}
.mosaic-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgb(30 20 22 / 62%) 100%)}
.mosaic-tile .banner-copy{z-index:2}
.mosaic-tg{background:var(--red)}
.mosaic-tg::after{display:none}
.mosaic-tg svg{position:absolute;left:20px;top:20px;width:30px;height:30px;fill:#fff}
.banner-track .banner:nth-child(3){display:none}
.banner-dots i:nth-child(3){display:none}
.mosaic-side{grid-column:1;grid-row:1}
.banner-carousel .banner-track{grid-column:2;grid-row:1}
.banner-carousel .banner-dots{position:absolute !important;left:312px !important;right:0 !important;bottom:16px !important;top:auto !important;width:auto !important;transform:none !important;justify-content:center;display:flex}
.banner-copy{left:36px;bottom:40px}
.banner-copy strong{font-size:34px}
.bn-prev{left:328px}
}
@media(min-width:1200px){
.cp-empty{display:none}
.cp-perks{display:grid;gap:14px;margin:0;padding:6px 0 4px;list-style:none}
.cart-panel.has-items .cp-perks{display:none}
.cp-perks li{display:grid;gap:2px;padding-left:14px;border-left:3px solid var(--red)}
.cp-perks b{font-size:15px}
.cp-perks span{color:#7b7172;font-size:13px;line-height:1.35}
}
@media(min-width:1024px){
.bn-arrow{display:grid}
.banner-carousel .banner-dots{gap:6px;align-items:center;height:8px;z-index:6;pointer-events:none}
.banner-dots i{display:block;width:8px;height:8px;border-radius:50%;background:rgb(255 255 255 / 55%);transition:width .25s,background .25s}
.banner-dots i.on{width:24px;border-radius:4px;background:#fff}
}

/* v87: desktop header = logo, city, search, phone, three messenger buttons (+ cart below 1200px); top navigation moves to the footer; all header controls are 44px tall */
.dt-city,.dt-search,.dt-chats{display:none}
@media(min-width:1024px){
.dt-header__in{gap:14px}
.dt-nav{display:none}
.dt-logo img{height:44px;border-radius:var(--r)}
.dt-city{display:flex;flex:none;align-items:center;gap:8px;height:44px;padding:0 16px 0 12px;border:0;border-radius:var(--r);background:#f3efed;color:var(--ink);font:inherit;font-size:15px;font-weight:700;cursor:pointer}
.dt-city svg{width:18px;height:18px;fill:var(--red)}
.dt-city:hover{background:#ebe5e2}
.dt-search{display:block;position:relative;flex:1;min-width:0;margin:0}
.dt-search svg{position:absolute;left:16px;top:50%;width:18px;height:18px;margin-top:-9px;fill:none;stroke:#7b7172;stroke-width:2.4;stroke-linecap:round;pointer-events:none}
.dt-search input{width:100%;height:44px;padding:0 16px 0 44px;border:0;border-radius:var(--r);background:#f3efed;color:var(--ink);font:inherit;font-size:15px;outline:0;-webkit-appearance:none;appearance:none}
.dt-search input::placeholder{color:#8a7f80}
.dt-search input:focus{background:#fff;box-shadow:0 0 0 2px var(--red)}
.dt-search input::-webkit-search-cancel-button{-webkit-appearance:none}
.dt-actions{gap:12px;flex:none}
.dt-phone{margin-right:4px}
.dt-chats{display:flex;gap:8px}
.dt-chat{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:var(--r);background:var(--red);cursor:pointer}
.dt-chat:hover{background:#b3001f}
.dt-chat svg{width:20px;height:20px;fill:#fff;stroke:none}
.dt-chat svg path{stroke:none;stroke-width:0}
.catalog-navigation .search-control{display:none !important}
}
@media(min-width:1024px) and (max-width:1199px){.dt-phone{display:none}}

/* v88: city is plain text with a small chevron (no fill, no pin, no outline) */
@media(min-width:1024px){
.dt-city{background:transparent !important;padding:0 6px;gap:2px;border-radius:var(--r);outline:0}
.dt-city svg{width:18px;height:18px;fill:none;stroke:var(--ink);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.dt-city:hover{color:var(--red)}
.dt-city:hover svg{stroke:var(--red)}
.dt-city:focus{outline:0;box-shadow:none}
.dt-city:focus-visible{box-shadow:0 0 0 2px var(--red)}
.dt-city,.dt-chat,.dt-search input{-webkit-tap-highlight-color:transparent}
.dt-chat:focus{outline:0}
.dt-chat:focus-visible{box-shadow:0 0 0 3px rgb(222 0 43 / 30%)}
}

/* v89: desktop description block is flat text on white, same left edge and width as the product feed */
@media(min-width:1024px){
.seo,.seo.shell{padding:0;background:transparent;border-radius:0;box-shadow:none}
.seo.shell{max-width:none;margin-top:56px;margin-bottom:64px}
.seo h2{margin:0 0 14px;font-size:24px;line-height:1.15;letter-spacing:-.4px}
.seo-copy{max-width:720px;padding:0;background:transparent;color:#5f5557;font-size:15px;line-height:1.6}
.seo-copy p{margin:0 0 12px;font-size:15px;line-height:1.6;color:inherit}
}
@media(min-width:1024px) and (max-width:1199px){
.seo.shell{margin-left:calc((100% - min(100% - 40px,var(--shell)))/2);margin-right:auto;width:min(calc(100% - 40px),var(--shell))}
}

@media(min-width:1200px){
main>.seo.shell{margin-left:0;margin-right:0}
}
@media(min-width:1024px){
.footer-chats{display:flex;gap:8px;margin-top:14px}
.footer-chats a{display:grid;place-items:center;height:36px;padding:0 14px;border-radius:var(--r);background:#fff;color:var(--ink);font-size:13px;font-weight:700;text-decoration:none}
.footer-chats a:hover{color:var(--red)}
}

@media(min-width:1024px){
.footer-legal{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px 20px;margin:8px 0 0;padding-top:20px;border-top:1px solid #e9e2df;color:#9a8f90;font-size:13px}
.footer-legal a{color:inherit;text-decoration:underline}
.footer .prototype-note{grid-column:1/-1;margin:0;color:#b3a8a9;font-size:12px}
}

/* v90: trust strip (four short promises, facts from the current site) and reviews from maps (placeholders marked) */
.trust{display:none}
.trust div{display:grid;gap:3px;padding:14px;border-radius:var(--r);background:#f8f5f3}
.trust b{font-size:14px;line-height:1.2}
.trust span{color:#7b7172;font-size:13px;line-height:1.3}
.reviews{margin:36px auto 0;padding:0}
.rv-head{display:grid;gap:14px;margin-bottom:16px}
.rv-head h2{margin:0;font-size:24px;line-height:1.15;letter-spacing:-.4px}
.rv-scores{display:flex;gap:10px}
.rv-score{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:var(--r);background:#f8f5f3}
.rv-score b{font-size:26px;line-height:1;font-weight:800}
.rv-score span{color:#7b7172;font-size:13px;line-height:1.25}
.rv-list{display:flex;gap:10px;margin:0 -20px;padding:0 20px 4px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.rv-list{scroll-padding:0 20px}
.rv-list::-webkit-scrollbar{display:none}
.rv{flex:0 0 82%;display:grid;align-content:start;gap:8px;padding:16px;border-radius:var(--r);background:#f8f5f3;scroll-snap-align:start}
.rv-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.rv-name{font-size:15px;font-weight:700}
.rv-stars{color:#f5a623;font-size:15px;letter-spacing:1px}
.rv p{margin:0;color:#5f5557;font-size:14px;line-height:1.5}
.rv-src{color:#9a8f90;font-size:12px;font-weight:600}
.rv-demo{margin:10px 0 0;color:var(--red);font-size:12px;font-weight:600}
@media(min-width:1024px){
.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0 0 4px;padding:0}
.trust.shell{order:2}
.catalog-navigation{order:3 !important}
.telegram-promo.shell{order:4}
.showcase{order:5 !important}
.reviews{order:6}
.seo{order:7 !important}
.reviews.shell{margin:56px 0 0;max-width:none}
.rv-head{display:flex;align-items:center;justify-content:space-between}
.rv-list{margin:0;padding:0;overflow:visible;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.rv{flex:none}
}
@media(min-width:1200px){
main>.trust{grid-row:2;grid-column:1;margin:16px 0 0}
main>.catalog-navigation{grid-row:3}
main>.telegram-promo.shell{grid-row:4}
main>.showcase{grid-row:5}
main>.reviews{grid-row:6;grid-column:1}
main>.seo{grid-row:7}
.cart-panel{grid-row:1 / span 7}
}
@media(min-width:1024px) and (max-width:1199px){
.trust.shell,.reviews.shell{margin-left:calc((100% - min(100% - 40px,var(--shell)))/2);margin-right:auto;width:min(calc(100% - 40px),var(--shell))}
}

/* v91: from 1200px the benefits live in the empty cart (all four); the strip under the banners stays only where there is no cart column */
@media(min-width:1200px){
main>.trust{display:none}
main>.catalog-navigation{margin-top:20px}
}

/* v92: benefits use the original icons from domroz.ru (recoloured to the brand red) and the real wording from the current site */
.pk-ico{flex:none;display:grid;place-items:center;width:36px;height:36px;color:var(--red)}
.pk-ico svg{width:30px;height:30px;display:block}
.pk-tx{display:grid;gap:2px}
@media(min-width:1024px){
.trust div{display:flex;align-items:center;gap:12px;padding:12px 14px}
.trust b{font-size:14px}
.cp-perks li{display:flex;align-items:center;gap:12px;padding-left:0;border-left:0}
.cp-perks b{font-size:15px}
.cp-perks{gap:16px;padding:8px 0 4px}
}

/* v93: the grey rule meant for the small captions leaked onto the icon and the bold line; icons are brand red, titles are ink, only the caption is grey */
.cp-perks .pk-ico,.trust .pk-ico{color:var(--red);font-size:0}
.cp-perks .pk-tx,.trust .pk-tx{color:var(--ink);font-size:inherit}
.cp-perks .pk-tx>b,.trust .pk-tx>b{color:var(--ink);font-size:15px;font-weight:700}
.cp-perks .pk-tx>span,.trust .pk-tx>span{color:#7b7172;font-size:13px}

/* v95: while the cart is empty the right column shows only the benefits (no "Корзина" title); the title appears with the first item */
@media(min-width:1200px){
.cart-panel:not(.has-items):not(.is-checkout) .cp-head{display:none}
.cart-panel:not(.has-items):not(.is-checkout) .cart-panel__in{padding-top:22px}
}

/* v96: Yandex Maps rating next to the search (desktop) and as a glass chip on the banner (phone); the number is a placeholder until the real one is supplied */
.dt-rating,.mb-rating{display:none}
.mb-rating svg,.dt-rating svg{fill:#f5a623;stroke:none}
@media(max-width:1023px){
.mb-rating{position:absolute;z-index:6;top:calc(env(safe-area-inset-top,0px) + 28px);right:16px;display:flex;align-items:center;gap:6px;height:36px;padding:0 12px 0 10px;border-radius:var(--r);background:rgb(255 255 255 / 86%);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--ink);font-size:13px;text-decoration:none;box-shadow:0 2px 10px rgb(38 22 25 / 14%)}
.mb-rating svg{width:16px;height:16px}
.mb-rating b{font-size:15px;font-weight:800}
.mb-rating span{color:#5f5557;font-weight:600}
}
@media(min-width:1024px){
.dt-rating{display:flex;flex:none;align-items:center;gap:8px;height:44px;color:var(--ink);text-decoration:none}
.dt-rating svg{width:24px;height:24px}
.dt-rating span{display:grid;gap:1px;line-height:1}
.dt-rating b{font-size:18px;font-weight:800}
.dt-rating small{color:#7b7172;font-size:12px;font-weight:600;white-space:nowrap}
.dt-rating:hover b{color:var(--red)}
}
@media(min-width:1024px) and (max-width:1199px){.dt-rating small{display:none}}

/* v98: rating shows score + five stars + review count; benefits use one thin line-icon set in soft pink tiles */
.dt-rating,.mb-rating{flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;line-height:1}
.rt-top{display:flex;align-items:center;gap:6px}
.rt-top b{font-size:18px;font-weight:800;line-height:1}
.rt-stars{color:#f5a623;font-size:13px;letter-spacing:1px;line-height:1}
.dt-rating small,.mb-rating small{color:#7b7172;font-size:12px;font-weight:600;line-height:1;white-space:nowrap}
@media(max-width:1023px){
.mb-rating{top:calc(env(safe-area-inset-top,0px) + 24px);height:44px;padding:0 14px;gap:4px}
.mb-rating .rt-top b{font-size:16px}
.mb-rating small{font-size:11px}
}
.dt-rating svg,.mb-rating svg{display:none}
.pk-ico{width:40px;height:40px;border-radius:var(--r);background:#fdeff2;color:var(--red)}
.pk-ico svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pk-ico svg *{fill:none;stroke:currentColor}
@media(min-width:1024px){
.cp-perks{gap:14px;padding:6px 0 4px}
.cp-perks li{gap:14px}
.trust div{gap:12px;padding:12px}
}
.mb-rating .rt-stars,.dt-rating .rt-stars{color:#f5a623}
.mb-rating .rt-top{color:var(--ink)}

/* v100: slogan "Её эмоции. Ваше спокойствие." next to the logo (desktop) and under the logo in the menu (phone); orders instead of clients */
.dt-tag{display:none}
.menu-tagline{margin:6px 0 18px;font-size:15px;line-height:1.3}
.menu-tagline b{font-weight:800;color:var(--ink)}
.menu-tagline span{color:var(--red);font-weight:700}
@media(min-width:1320px){
.dt-tag{display:grid;flex:none;gap:2px;margin:0 6px 0 -4px;font-size:13px;line-height:1.15}
.dt-tag b{font-weight:800;color:var(--ink)}
.dt-tag span{color:var(--red);font-weight:700}
}

/* v101: slogan sits right under the logo, one line; the header row is taller and every control stays on the logo's line */
@media(min-width:1024px){
.dt-brand{flex:none;display:grid;gap:5px;align-self:flex-start}
.dt-tag{display:block !important;margin:0 !important;font-size:12px;line-height:1.1;white-space:nowrap;text-align:center}
.dt-tag b{font-weight:800;color:var(--ink)}
.dt-tag span{color:var(--red);font-weight:700}
.dt-header__in{align-items:flex-start;height:90px;padding-top:14px}
.dt-header__in>*{align-self:flex-start}
.dt-phone{display:flex;align-items:center;height:44px}
.dt-nav{display:none}
}
@media(min-width:1200px){.cart-panel__in{top:112px;max-height:calc(100vh - 132px)}}

/* v102: slogan in one dark colour; the header row is centred on the logo+slogan block; rating is a light bordered pill (score, count, source) */
@media(min-width:1024px){
.dt-header__in{align-items:center;height:84px;padding-top:0}
.dt-header__in>*{align-self:center}
.dt-brand{align-self:center;gap:4px}
.dt-logo img{height:40px}
.dt-tag{font-size:12px;font-weight:700;color:var(--ink)}
.dt-tag b,.dt-tag span{color:var(--ink);font-weight:700}
.dt-rating{flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;height:44px;padding:0 14px;border:1px solid var(--line);border-radius:var(--r);background:#fff}
.dt-rating .rt-line{display:flex;align-items:baseline;gap:6px;line-height:1}
.dt-rating .rt-star{color:#f5a623;font-style:normal;font-size:15px;line-height:1}
.dt-rating .rt-line b{font-size:16px;font-weight:800}
.dt-rating .rt-line em{color:#5f5557;font-style:normal;font-size:13px;font-weight:600}
.dt-rating small{color:#9a8f90;font-size:11px;font-weight:600;line-height:1}
.dt-rating:hover{border-color:#d9d0cc}
.dt-rating:hover b{color:var(--red)}
.dt-phone{height:44px}
}
@media(min-width:1200px){.cart-panel__in{top:104px;max-height:calc(100vh - 124px)}}
@media(min-width:1024px) and (max-width:1199px){.dt-rating .rt-line em{display:none}}

/* v103: slogan moves to a thin strip above the header (header is back to 72px and everything sits on one line); rating pill is centred */
.dt-topbar{display:none}
@media(min-width:1024px){
.dt-topbar{display:block;background:#f8f5f3}
.dt-topbar__in{display:flex;align-items:center;justify-content:space-between;gap:20px;width:min(calc(100% - 40px),1284px);height:34px;margin:0 auto;font-size:13px;color:var(--ink)}
.dt-topbar p{margin:0;font-weight:700}
.dt-topbar b{font-weight:800}
.dt-topbar span{color:#5f5557;font-weight:600}
.dt-tag{display:none !important}
.dt-header__in{align-items:center;height:72px;padding-top:0}
.dt-header__in>*{align-self:center}
.dt-brand{align-self:center}
.dt-logo img{height:44px}
.dt-rating{align-items:center;text-align:center}
.dt-rating .rt-line{justify-content:center}
.dt-rating small{text-align:center}
}
@media(min-width:1200px){.cart-panel__in{top:96px;max-height:calc(100vh - 116px)}}
@media(min-width:1024px) and (max-width:1199px){.dt-topbar span{display:none}}

/* v104: slogan "Её эмоции. Ваше спокойствие" sits under the logo on one line and is exactly as wide as the logo (the two phrases are pushed to its edges); no top strip */
@media(min-width:1024px){
.dt-topbar{display:none !important}
.dt-tag{display:flex !important;justify-content:space-between;width:0;min-width:100%;margin:0 !important;font-size:12px;line-height:1.1;white-space:nowrap;text-align:left}
.dt-tag b,.dt-tag span{color:var(--ink);font-weight:700}
.dt-brand{display:grid;gap:4px;align-self:center}
.dt-logo img{height:40px}
.dt-header__in{height:84px}
}
@media(min-width:1200px){.cart-panel__in{top:104px;max-height:calc(100vh - 124px)}}

/* v105: rating uses Yandex Maps own pin; the slogan leaves the header (it breaks the header line) and heads the benefits card; header is a single 72px row again */
.rt-pin{width:18px;height:18px;flex:none;display:block}
.dt-rating,.mb-rating{align-items:center;text-align:center}
.dt-rating .rt-line,.mb-rating .rt-line{display:flex;align-items:center;justify-content:center;gap:6px;line-height:1}
.dt-rating .rt-line b,.mb-rating .rt-line b{font-size:16px;font-weight:800;color:var(--ink)}
.dt-rating .rt-line em,.mb-rating .rt-line em{color:#5f5557;font-style:normal;font-size:13px;font-weight:600}
.dt-rating small,.mb-rating small{color:#7b7172;font-size:12px;font-weight:600;line-height:1}
.cp-slogan{display:none}
@media(min-width:1024px){
.dt-header__in{height:72px;align-items:center}
.dt-brand{align-self:center}
.dt-logo img{height:44px}
.dt-rating{height:44px;padding:0 14px;gap:4px}
}
@media(min-width:1200px){
.cp-slogan{display:block;margin:0 0 16px;font-size:20px;line-height:1.2;letter-spacing:-.3px;color:var(--ink)}
.cp-slogan b{font-weight:800}
.cart-panel.has-items .cp-slogan,.cart-panel.is-checkout .cp-slogan{display:none}
.cart-panel__in{top:96px;max-height:calc(100vh - 116px)}
}
@media(min-width:1024px) and (max-width:1199px){.dt-rating .rt-line em{display:none}}
@media(max-width:1023px){
.mb-rating{height:44px;padding:0 14px;gap:4px}
.mb-rating .rt-pin{width:17px;height:17px}
}
@media(min-width:1200px){.cp-slogan b{display:block}}

/* v106: the slogan lives in the footer under a logo that is as big as in the header (44px); it is gone from the cart card and the phone menu */
.footer-brand img,.footer .footer-brand img{height:44px;width:auto;border-radius:var(--r)}
.footer-brand .footer-slogan{margin:12px 0 0;color:var(--ink);font-size:15px;line-height:1.3;font-weight:600}
.footer-brand .footer-slogan b{font-weight:800}

/* v107: the Yandex Maps pin was hidden by an old rule; wordmark gets the red "Я"; footer slogan has one weight and is exactly as wide as the logo */
.dt-rating .rt-pin,.mb-rating .rt-pin{display:block !important}
.rt-line em .ya{color:#ff3333;font-style:normal;font-weight:800}
.rt-line em{color:var(--ink) !important;font-weight:700 !important}
.footer-brand{width:max-content;max-width:100%}
.footer-brand .footer-slogan{display:flex;justify-content:space-between;width:0;min-width:100%;margin:10px 0 0;font-size:13px;line-height:1.1;font-weight:700;white-space:nowrap;color:var(--ink)}
.footer-brand .footer-slogan span{font-weight:700}
.dt-rating .rt-pin,.mb-rating .rt-pin{width:18px !important;height:18px !important}

/* v108: rating = yellow star, score, red "Я" + "Карты"; review count below; no map pin */
.rt-line .rt-star{display:block;color:#f5a623;font-style:normal;font-size:15px;line-height:1}
.rt-line em .ya{color:#ff3333;font-style:normal;font-weight:800}
.dt-rating .rt-line em,.mb-rating .rt-line em{color:var(--ink) !important;font-size:14px;font-weight:700 !important}
.dt-rating .rt-line,.mb-rating .rt-line{gap:6px}
@media(min-width:1024px) and (max-width:1199px){.dt-rating .rt-line em{display:block}}

/* v109: footer slogan sits close under the logo (like in the old header) and the two phrases are not pulled apart: the font is sized so the natural text width equals the logo width */
.footer-brand .footer-slogan{margin:5px 0 0 !important;font-size:13px;line-height:1.1;letter-spacing:0}
.footer-brand .footer-slogan span{font-weight:700}
.footer-brand .brand{display:block;line-height:0;width:max-content}
.footer-brand .brand img{display:block}

/* v110: the Yandex Maps wordmark is the original logotype image (cut from the badge the owner supplied, background removed) instead of our font */
.rt-line em.rt-wm,.rt2-wm{display:block;flex:none;width:80px;height:17px;font-size:0;background:url("../img/ui-ec9dc1bc.png") center/contain no-repeat}

/* v111: rating = Yandex Maps logotype on top, below it "★ 4,9 · 312 отзывов" */
.dt-rating,.mb-rating{flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center}
.rt2-wm{display:block;flex:none;width:82px;height:16px;font-size:0}
.rt2-bot{display:flex;align-items:center;justify-content:center;gap:5px;line-height:1;white-space:nowrap}
.rt2-bot i{color:#f5a623;font-style:normal;font-size:13px}
.rt2-bot b{font-size:14px;font-weight:800;color:var(--ink)}
.rt2-bot u{text-decoration:none;color:#7b7172;font-size:12px;font-weight:600}
.rt2-bot u::before{content:"·";margin-right:5px;color:#b3a8a9}
.dt-rating .rt2-bot,.mb-rating .rt2-bot{display:flex !important;flex-direction:row;gap:5px}
.dt-rating,.mb-rating{width:max-content}

/* v112: rating = big star + 4,9 on the left; on the right the Yandex Maps logotype with "312 отзывов" under it */
.dt-rating,.mb-rating{flex-direction:row !important;align-items:center !important;justify-content:center;gap:12px !important;width:max-content;text-align:left}
.rt3-score{display:flex !important;align-items:center;gap:5px;line-height:1}
.rt3-score i{color:#f5a623;font-style:normal;font-size:20px;line-height:1}
.rt3-score b{font-size:22px;font-weight:800;letter-spacing:-.4px;color:var(--ink)}
.rt3-src{display:flex !important;flex-direction:column;align-items:flex-start;gap:4px;line-height:1}
.rt3-src .rt2-wm{width:80px;height:16px}
.rt3-src small{color:#7b7172;font-size:12px;font-weight:600;line-height:1}
.dt-rating .rt3-src small,.mb-rating .rt3-src small{font-size:12px}
@media(max-width:1023px){
.mb-rating{padding:0 14px;gap:10px !important}
.mb-rating .rt3-score i{font-size:18px}
.mb-rating .rt3-score b{font-size:20px}
.mb-rating .rt3-src .rt2-wm{width:72px;height:14px}
.mb-rating .rt3-src small{font-size:11px}
}

/* v113: the logotype is cut tight to its ink and the right block shares one centre line: logotype and "312 отзывов" are centred on each other */
.rt3-src{align-items:center !important;text-align:center}
.rt3-src .rt2-wm{width:72px !important;height:16px !important}
.rt3-src small{text-align:center}
@media(max-width:1023px){.mb-rating .rt3-src .rt2-wm{width:65px !important;height:14.5px !important}}

/* v114: phone menu: logo (as big as in the header) with the slogan right under it, same width; Yandex Maps rating above the contacts; prototype note removed from the footer */
.menu-head .brand img{width:auto;height:44px;border-radius:var(--r)}
.menu-slogan{display:flex;justify-content:space-between;width:0;min-width:190px;margin:5px 0 16px;font-size:13px;line-height:1.1;font-weight:700;color:var(--ink);white-space:nowrap}
.menu-slogan span{font-weight:700}
.menu-rating{display:flex;align-items:center;justify-content:center;gap:14px;margin:0 0 12px;padding:12px 16px;border:1px solid var(--line);border-radius:var(--r);background:#fff;color:var(--ink);text-decoration:none}
.menu-rating .rt3-score i{font-size:20px}
.menu-rating .rt3-score b{font-size:24px}

/* v115: the chip on the phone banner is compact: star, 4,9 and the Yandex Maps logotype in one line (no review count); the full block stays in the menu and in the desktop header */
@media(max-width:1023px){
.mb-rating{top:calc(env(safe-area-inset-top,0px) + 27px);height:38px;padding:0 12px;gap:8px !important}
.mb-rating .rt3-src small{display:none}
.mb-rating .rt3-src{justify-content:center}
.mb-rating .rt3-score i{font-size:16px}
.mb-rating .rt3-score b{font-size:18px}
.mb-rating .rt3-src .rt2-wm{width:68px !important;height:15px !important}
}

/* v116: slogan hugs the logo in the phone menu; the city is plain text with a chevron (no pin, no fill) to save room; the logotype in the banner chip is optically aligned with the digits */
.menu-head{margin-bottom:0}
.menu-slogan{margin:4px 0 12px}
.city-button.menu-city{width:auto;align-self:flex-start;margin:0 0 12px;padding:6px 0;gap:2px;border-radius:0;background:transparent;font-size:18px}
.city-button.menu-city svg{display:none}
.city-button.menu-city::after{content:"";margin:0;width:20px;height:20px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23282424' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E") center/contain no-repeat}
@media(max-width:1023px){.mb-rating .rt3-src .rt2-wm{transform:translateY(1.5px)}}

/* v117: phone menu: the city is a soft rectangle again (it was lost among the catalog items); the rating is one centred block: "★ 4,9 Яндекс Карты" in a row and "312 отзывов" centred right under it */
.city-button.menu-city{width:100%;align-self:stretch;margin:0 0 16px;padding:13px 14px;border-radius:var(--r);background:#f3efed;justify-content:space-between;gap:10px;font-size:18px}
.city-button.menu-city::after{margin-left:auto}
.menu-rating{display:flex !important;flex-direction:row;align-items:center;justify-content:center;gap:14px;padding:12px 16px}
.menu-rating .rt3-score{display:flex;align-items:center;gap:5px;line-height:1}
.menu-rating .rt3-src{display:flex !important;flex-direction:column;align-items:center;justify-content:center;gap:4px;line-height:1}
.menu-rating .rt3-src .rt2-wm{width:72px !important;height:16px !important;transform:none}
.menu-rating small{text-align:center;font-size:12px;color:#7b7172;line-height:1}

/* v118 (optical): the logotype+count block sits ~1.5px above the digits by ink, so it is nudged down 1px and the digits up .5px in the menu; the desktop header block gets the same 1px nudge */
.menu-rating .rt3-src{transform:translateY(1px)}
.menu-rating .rt3-score b{transform:translateY(-.5px)}
@media(min-width:1024px){.dt-rating .rt3-src{transform:translateY(1px)}}

/* v120: footer: "Написать нам" (messengers) and "Мы в соцсетях" (channel, VK, Instagram) are two separate blocks */
.footer-label{display:block;margin:16px 0 8px;color:#9a8f90;font-size:12px;font-weight:700;letter-spacing:.4px;text-transform:uppercase}
.footer-chats{margin-top:0 !important}
.footer-social{display:block}
.footer-social__row{display:flex;gap:8px}
.footer-social__row a{display:grid;place-items:center;width:44px;height:44px;border-radius:var(--r);background:#fff;color:var(--ink);transition:color .2s,background .2s}
.footer-social__row a:hover{color:var(--red)}
.footer-social__row svg{width:22px;height:22px;fill:currentColor;stroke:none}
.footer-social__row svg path{stroke:none}
.footer-meta-note{margin:10px 0 0;max-width:340px;color:#9a8f90;font-size:12px;line-height:1.4}
.footer-contact .footer-meta-note{font-size:12px;line-height:1.4;margin:12px 0 0;color:#9a8f90}
.footer-social{margin-top:2px}

/* v121: real phone and address from domroz.ru; footer bottom has the three legal links and the company requisites; the Instagram/Meta note is tiny */
.footer-legal{display:block !important;margin:8px 0 0 !important;padding-top:20px;border-top:1px solid #e9e2df}
.fl-links{display:flex;flex-wrap:wrap;gap:8px 22px;margin-bottom:12px}
.fl-links a{color:var(--ink);font-size:13px;font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#cfc5c1}
.fl-links a:hover{color:var(--red)}
.fl-req{margin:0;max-width:760px;color:#9a8f90;font-size:12px;line-height:1.5}
.footer-contact .footer-meta-note,.footer-meta-note{font-size:10px !important;line-height:1.35;margin:10px 0 0;color:#b8aeaf;max-width:300px}

/* v122: on desktop the social icons live in the left column under the logo and slogan (the contacts column is shorter); on the phone they stay under the messengers */
@media(min-width:1024px){
.footer-brand .footer-social{margin-top:22px;width:190px}
.footer-brand .footer-social .footer-label{margin:0 0 8px}
.footer-brand .footer-social__row{gap:8px}
.footer-brand .footer-meta-note{max-width:190px;font-size:10px !important;margin-top:10px}
}

/* v123: the legal row is as small as it can be: links in one line, requisites in tiny grey type */
.footer-legal{padding-top:14px !important}
.fl-links{flex-wrap:nowrap;justify-content:space-between;gap:8px;margin-bottom:8px}
.fl-links a{font-size:11px;font-weight:600;white-space:nowrap}
.fl-req{font-size:10px;line-height:1.45;max-width:none}
@media(min-width:1024px){
.fl-links{justify-content:flex-start;gap:22px}
.fl-links a{font-size:12px}
.fl-req{font-size:11px}
}
@media(max-width:1023px){.fl-links{gap:6px 12px;justify-content:flex-start}.footer-legal{overflow:hidden}}
@media(max-width:1023px){.fl-links{gap:6px 10px}.fl-links a{font-size:10px}}

/* v124: phone footer: messengers are three red icon buttons to the right of the phone number (like the desktop header), no "Написать нам" row, no "Мы в соцсетях" caption; "О компании" removed until the page exists */
.fc-icons{display:none}
@media(max-width:1023px){
.footer-contact{display:grid !important;grid-template-columns:1fr auto;align-items:center;column-gap:12px}
.footer-contact>strong{grid-column:1 / 3}
.footer-contact .footer-phone{grid-column:1;grid-row:2;padding:4px 0}
.footer-contact .fc-icons{display:flex;grid-column:2;grid-row:2;gap:8px}
.fc-icons a{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--r);background:var(--red)}
.fc-icons svg{width:20px;height:20px;fill:#fff;stroke:none}
.fc-icons svg path{stroke:none;fill:#fff}
.footer-contact>p:not(.footer-meta-note){grid-column:1 / 3;grid-row:3;margin-top:8px}
.footer-contact .footer-label,.footer-contact .footer-chats{display:none !important}
.footer-contact .footer-social{grid-column:1 / 3;margin-top:14px}
.footer-social .footer-label{display:none !important}
}
@media(max-width:1023px){.footer-contact .footer-phone{font-size:18px;white-space:nowrap;letter-spacing:-.2px}.fc-icons a{width:38px;height:38px;border-radius:var(--r)}.fc-icons svg{width:19px;height:19px}.fc-icons{gap:7px !important}}

/* v125: product card on top of the home page (modal on desktop, bottom sheet on the phone) with real sizes and composition from domroz.ru; promo is "Скидка 10% за подписку"; the order form remembers the guest on this device */
.pd-overlay{position:fixed;inset:0;z-index:160;background:rgb(30 20 22 / 46%);opacity:0;visibility:hidden;transition:opacity .25s ease,visibility 0s linear .25s}
.pd{position:fixed;z-index:170;visibility:hidden;background:#fff;color:var(--ink)}
html.pd-open .pd-overlay{opacity:1;visibility:visible;transition:opacity .25s ease}
html.pd-open .pd{visibility:visible}
.pd-close{position:absolute;top:14px;right:14px;z-index:5;display:grid;place-items:center;width:40px;height:40px;border:0;border-radius:var(--r);background:rgb(255 255 255 / 92%);color:var(--ink);box-shadow:0 2px 10px rgb(38 22 25 / 16%);cursor:pointer}
.pd-close svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.pd-media{position:relative;background:#f1edeb}
.pd-img{width:100%;height:100%;background:#f1edeb center/cover no-repeat}
.pd-tag{position:absolute;left:14px;top:14px;padding:5px 10px;border-radius:999px;background:rgb(255 255 255 / 92%);color:#7b3347;font-size:12px;font-weight:700}
.pd-body{padding:22px 24px 8px;overflow:auto;-webkit-overflow-scrolling:touch}
.pd-body h2{margin:0 44px 8px 0;font-size:24px;line-height:1.15;letter-spacing:-.4px}
.pd-price{display:flex;align-items:baseline;gap:10px;margin-bottom:18px}
.pd-price b{font-size:30px;font-weight:800;letter-spacing:-.5px}
.pd-price s{color:#9a8f90;font-size:16px}
.pd-label{margin:0 0 8px;color:#9a8f90;font-size:12px;font-weight:700;letter-spacing:.4px;text-transform:uppercase}
.pd-sizes{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.pd-sizes button{display:grid;gap:2px;min-width:92px;padding:9px 12px;border:1.5px solid var(--line);border-radius:var(--r);background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.pd-sizes button b{font-size:14px}
.pd-sizes button span{color:#7b7172;font-size:13px;font-weight:600}
.pd-sizes button.is-on{border-color:var(--red);background:#fdeff2}
.pd-dims{margin:0 0 18px;color:#5f5557;font-size:14px}
.pd-comp{margin:0 0 18px;padding:0;list-style:none;display:grid;gap:6px}
.pd-comp li{position:relative;padding-left:16px;font-size:15px}
.pd-comp li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--red)}
.pd-perks{margin:0;padding:14px 16px;list-style:none;display:grid;gap:8px;border-radius:var(--r);background:#f8f5f3;color:#5f5557;font-size:13px;line-height:1.35}
.pd-bar{display:flex;align-items:center;gap:10px;padding:14px 24px 18px;border-top:1px solid var(--line);background:#fff}
.pd-qty{display:flex;align-items:center;flex:none;height:50px;border-radius:var(--r);background:#f3efed}
.pd-qty button{width:44px;height:50px;border:0;background:transparent;color:var(--ink);font:inherit;font-size:22px;cursor:pointer}
.pd-qty span{min-width:22px;text-align:center;font-size:18px;font-weight:800}
.pd-add{flex:1;height:50px;border:0;border-radius:var(--r);background:var(--red);color:#fff;font:inherit;font-size:16px;font-weight:700;cursor:pointer;transition:background .2s}
.pd-add.is-done{background:#1f9d55}
.pd-chat{flex:none;height:50px;padding:0 16px;border:0;border-radius:var(--r);background:#fdeff2;color:#b5374e;font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.cp-saved{margin:0;color:#7b7172;font-size:13px}
.cp-saved button{padding:0;border:0;background:transparent;color:var(--red);font:inherit;font-weight:700;text-decoration:underline;cursor:pointer}
@media(min-width:1024px){
.pd{left:50%;top:50%;width:min(920px,calc(100% - 40px));height:min(640px,calc(100vh - 48px));display:grid;grid-template-columns:380px minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;border-radius:var(--r);overflow:hidden;transform:translate(-50%,-47%) scale(.98);opacity:0;transition:transform .25s cubic-bezier(.22,.8,.3,1),opacity .2s ease,visibility 0s linear .25s}
html.pd-open .pd{transform:translate(-50%,-50%) scale(1);opacity:1;transition:transform .25s cubic-bezier(.22,.8,.3,1),opacity .2s ease}
.pd-media{grid-column:1;grid-row:1 / 3}
.pd-body{grid-column:2;grid-row:1}
.pd-bar{grid-column:2;grid-row:2}
.pd-close{background:#f3efed;box-shadow:none}
}
@media(max-width:1023px){
.pd{left:0;right:0;bottom:0;height:92vh;max-height:calc(100dvh - 24px);border-radius:var(--r) var(--r) 0 0;display:flex;flex-direction:column;overflow:hidden;transform:translate3d(0,102%,0);transition:transform .32s cubic-bezier(.22,.8,.3,1),visibility 0s linear .32s;box-shadow:0 -8px 30px rgb(38 22 25 / 18%)}
html.pd-open .pd{transform:translate3d(0,0,0);transition:transform .32s cubic-bezier(.22,.8,.3,1)}
.pd-media{flex:none;height:min(48vw,230px);width:100%}
.pd-body{flex:1;padding:18px 20px 8px}
.pd-body h2{font-size:22px}
.pd-bar{flex:none;padding:12px 16px calc(14px + env(safe-area-inset-bottom));gap:8px;flex-wrap:wrap}
.pd-qty{height:48px}.pd-qty button{height:48px;width:40px}
.pd-add{height:48px;font-size:15px;min-width:140px}
.pd-chat{height:48px;flex:1 0 100%;order:3}
}
/* footer messenger icons next to the phone: dark tiles with white logos (calmer than red, different from the white social tiles) */
@media(max-width:1023px){.fc-icons a{background:var(--ink)}}

/* v126: below 1200px the cart is a bottom sheet opened from the "Корзина" button (same list, totals and order form as the desktop column) */
.cp-x,.cart-overlay{display:none}
@media(max-width:1199px){
.cart-overlay{display:block;position:fixed;inset:0;z-index:160;background:rgb(30 20 22 / 46%);opacity:0;visibility:hidden;transition:opacity .25s ease,visibility 0s linear .25s}
html.cart-open .cart-overlay{opacity:1;visibility:visible;transition:opacity .25s ease}
.cart-panel{display:block;position:fixed;left:0;right:0;bottom:0;z-index:170;max-width:520px;margin:0 auto;transform:translate3d(0,102%,0);visibility:hidden;transition:transform .32s cubic-bezier(.22,.8,.3,1),visibility 0s linear .32s}
html.cart-open .cart-panel{transform:translate3d(0,0,0);visibility:visible;transition:transform .32s cubic-bezier(.22,.8,.3,1)}
.cart-panel__in{position:relative;display:flex;flex-direction:column;max-height:92vh;max-height:92dvh;overflow:auto;-webkit-overflow-scrolling:touch;padding:20px 20px 0;border-radius:var(--r) var(--r) 0 0;background:#fff;box-shadow:0 -8px 30px rgb(38 22 25 / 18%)}
.cp-x{display:grid;place-items:center;position:absolute;top:14px;right:14px;z-index:3;width:40px;height:40px;border:0;border-radius:var(--r);background:#f3efed;color:var(--ink);cursor:pointer}
.cp-x svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.cp-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:12px}
.cp-head h2{margin:0;font-size:22px;letter-spacing:-.3px}
.cp-count{color:#9a8f90;font-size:14px;font-weight:600}
.cp-empty{display:grid;gap:6px;padding:28px 16px;border-radius:var(--r);background:#f8f5f3;text-align:center}
.cp-empty strong{font-size:15px}
.cp-empty span{color:#7b7172;font-size:14px;line-height:1.4}
.cart-panel.has-items .cp-empty{display:none}
.cp-list{display:none;margin:0;padding:0;list-style:none}
.cart-panel.has-items .cp-list{display:grid;gap:14px}
.cp-item{display:grid;grid-template-columns:56px 1fr;gap:12px;align-items:start}
.cp-thumb{width:56px;height:74px;border-radius:var(--r);background:#f1edeb center/cover no-repeat}
.cp-name{display:block;font-size:14px;line-height:1.3;font-weight:600}
.cp-row{display:flex;align-items:center;justify-content:space-between;margin-top:8px}
.cp-price{font-size:15px;font-weight:800}
.cp-price.is-sale{color:var(--red)}
.cp-price del{display:block;font-size:12px;font-weight:400;color:#8a8a8a}
.cp-step{display:inline-flex;align-items:center;height:30px;border-radius:999px;background:#f3efed}
.cp-step button{width:30px;height:30px;border:0;background:transparent;color:var(--ink);font:inherit;font-size:18px;line-height:1;cursor:pointer}
.cp-step span{min-width:18px;text-align:center;font-size:14px;font-weight:700}
.cp-foot{display:none;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.cart-panel.has-items .cp-foot{display:block}
.cp-total{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:14px}
.cp-total span{color:#7b7172;font-size:15px}
.cp-total strong{font-size:22px;font-weight:800}
.cp-order{width:100%;height:50px;border:0;border-radius:var(--r);background:var(--red);color:#fff;font:inherit;font-size:16px;font-weight:700;cursor:pointer}
.cp-order:hover{background:#b3001f}
.cp-note{margin:12px 0 0;color:#9a8f90;font-size:12px;line-height:1.4}
.cp-form{display:none;gap:12px;margin-top:12px}
.cp-form label{display:grid;gap:6px;color:#7b7172;font-size:13px;font-weight:600}
.cp-form input{height:44px;padding:0 14px;border:0;border-radius:var(--r);background:#f3efed;color:var(--ink);font:inherit;font-size:15px;outline:0}
.cp-form input:focus{box-shadow:0 0 0 2px var(--red)}
.cp-back{justify-self:start;padding:0;border:0;background:transparent;color:var(--red);font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.cart-panel.is-checkout .cp-list,.cart-panel.is-checkout .cp-foot,.cart-panel.is-checkout .cp-empty{display:none}
.cart-panel.is-checkout .cp-form{display:grid}
.cp-head{padding-right:48px}
.cp-empty{margin-bottom:12px}
.cp-perks{display:grid;margin:0 0 calc(18px + env(safe-area-inset-bottom));padding:6px 0 0;gap:14px;list-style:none}
.cart-panel.has-items .cp-perks,.cart-panel.is-checkout .cp-perks{display:none}
.cp-perks li{display:flex;align-items:center;gap:14px}
.cp-perks b{font-size:15px}
.cp-perks .pk-tx>span{color:#7b7172;font-size:13px}
.cp-list{margin-bottom:6px}
.cp-step button{width:34px;height:34px}.cp-step{height:34px;border-radius:999px}
.cp-foot{position:sticky;bottom:0;margin:12px -20px 0;padding:14px 20px calc(16px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--line)}
.cp-form{margin-bottom:calc(18px + env(safe-area-inset-bottom))}
}
@media(max-width:1199px){.cp-form input{font-size:16px}}

/* v127: footer icons on the phone's centre line; dimensions as arrows on the photo; compact scrolling size chips and a bigger photo; order form follows the real checkout (phone mask, receive/recipient, day + slot, address, card, promo, consent) */
@media(max-width:1023px){.footer-contact .footer-phone{padding:0 !important;line-height:38px !important;align-self:center}.footer-contact .fc-icons{align-self:center}}
.pd-dims{display:none !important}
.pd-dm{position:absolute;left:14px;bottom:14px;display:flex;gap:6px}
.pd-dm span{display:inline-flex;align-items:center;gap:5px;padding:6px 10px;border-radius:999px;background:rgb(255 255 255 / 92%);color:var(--ink);font-size:13px;font-weight:700}
.pd-dm svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pd-sizes{flex-wrap:nowrap !important;overflow-x:auto;gap:6px !important;margin-bottom:8px !important;padding-bottom:2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.pd-sizes::-webkit-scrollbar{display:none}
.pd-sizes button{flex:none;min-width:0 !important;padding:6px 11px !important;border-radius:var(--r) !important;gap:0 !important;white-space:nowrap}
.pd-sizes button b{font-size:13px !important}.pd-sizes button span{font-size:12px !important}
@media(max-width:1023px){.pd-media{height:min(86vw,380px) !important}}
.cp-form .cp-seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:6px}
.cp-form .cp-seg label{display:block;position:relative;color:var(--ink)}
.cp-form .cp-seg input,.cp-slots input{position:absolute;opacity:0;width:0;height:0}
.cp-form .cp-seg span,.cp-slots span{display:grid;place-items:center;height:40px;padding:0 8px;border-radius:var(--r);background:#f3efed;color:var(--ink);font-size:14px;font-weight:700;text-align:center;cursor:pointer}
.cp-form .cp-seg input:checked+span,.cp-slots input:checked+span{background:#fdeff2;color:#b5374e;box-shadow:inset 0 0 0 1.5px var(--red)}
.cp-lab{display:block;margin-bottom:6px;color:#7b7172;font-size:13px;font-weight:600}
.cp-when{display:grid;gap:8px}.cp-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.cp-slots label{display:block;position:relative}
.cp-slots label.is-off span{opacity:.35;pointer-events:none}
.cp-rec,.cp-addr{display:grid;gap:12px}
.cp-form.is-me .cp-rec,.cp-form.is-pickup .cp-addr,.cp-form.is-pickup .cp-seg[aria-label="Кто получает"],.cp-form.is-pickup .cp-rec{display:none}
.cp-form .cp-chk{display:flex;align-items:flex-start;gap:10px;color:#5f5557;font-size:13px;font-weight:600}
.cp-form .cp-chk input{position:static;opacity:1;width:20px;height:20px;flex:none;margin:0;accent-color:var(--red)}
.cp-form .cp-chk a{color:var(--red)}
.cp-form textarea{padding:11px 14px;border:0;border-radius:var(--r);background:#f3efed;color:var(--ink);font:inherit;font-size:15px;outline:0;resize:none}
.cp-form textarea:focus{box-shadow:0 0 0 2px var(--red)}
.cp-form input.bad{box-shadow:0 0 0 2px var(--red)}
@media(max-width:1199px){.cp-form textarea{font-size:16px}.cp-pay{position:sticky;bottom:0;margin:4px -20px 0;padding:12px 20px calc(14px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--line)}.cp-form{margin-bottom:0 !important}.cp-pay .cp-total{margin-bottom:10px}}

/* v128: product card on the phone: one-line bottom bar (stepper + add + chat icon), one-line smaller title, photo a bit smaller so sizes and composition are visible */
@media(max-width:1023px){
.pd-media{height:min(64vw,260px) !important}
.pd-body{padding:14px 20px 8px !important}
.pd-body h2{font-size:18px !important;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:6px}
.pd-price b{font-size:24px !important}
.pd-bar{flex-wrap:nowrap !important;padding:10px 14px calc(12px + env(safe-area-inset-bottom)) !important;gap:8px !important;align-items:center}
.pd-qty{height:46px !important;flex:none}
.pd-qty button{width:34px !important}
.pd-add{flex:1;min-width:0;height:46px !important;font-size:15px !important;white-space:nowrap;padding:0 10px !important}
.pd-chat{flex:none;width:46px;height:46px !important;padding:0 !important;font-size:0 !important;border-radius:50% !important;background:#fdeff2 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b5374e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a8 8 0 0 1-11.6 7.1L4 20.5l1.4-4.6A8 8 0 1 1 21 12z'/%3E%3C/svg%3E") center/22px no-repeat}
}

/* v129: "В корзину" and its price on two lines, which frees room for the labelled "Заказ в чате" button in the same row */
.pd-add b{font-weight:800}.pd-add b::before{content:" \00b7  "}
@media(max-width:1023px){
.pd-add{display:grid !important;align-content:center;gap:1px;line-height:1.1;flex:none !important;padding:0 14px !important}
.pd-add span{font-size:14px;font-weight:700}.pd-add b{font-size:13px;opacity:.9}.pd-add b::before{content:none}
.pd-chat{flex:1 !important;min-width:0;width:auto !important;border-radius:var(--r) !important;background-image:none !important;font-size:14px !important;font-weight:700 !important;white-space:nowrap;padding:0 8px !important}
}

/* v130: phone product bar without the stepper (quantity is changed in the cart): wide one-line "В корзину · price" + "Заказ в чате" */
@media(max-width:1023px){
.pd-qty{display:none !important}
.pd-add{display:block !important;flex:1 !important;height:48px !important;padding:0 12px !important;font-size:15px !important;line-height:48px}
.pd-add span,.pd-add b{display:inline;font-size:15px !important;font-weight:800;opacity:1}
.pd-add b::before{content:" \00b7  "}
.pd-chat{flex:none !important;width:auto !important;height:48px !important;padding:0 16px !important}
}

/* v131: phone product card scrolls as one page: big 4:5 photo on top, then title, price, sizes, composition; the bar stays pinned at the bottom */
@media(max-width:1023px){
.pd{display:block !important;overflow-y:auto !important;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.pd-media{height:auto !important;aspect-ratio:4/5;width:100%}
.pd-img{background-position:center top}
.pd-body{overflow:visible !important;flex:none !important;padding:16px 20px 24px !important}
.pd-bar{position:sticky !important;bottom:0;z-index:4;background:#fff}
.pd-close{position:sticky !important;top:10px;right:auto !important;left:auto !important;display:grid;margin:10px 10px -54px auto;z-index:6}
}

/* v132: swipe gallery in the product card (demo: the same photo three times) and a photo capped by screen height so title, price and sizes stay visible */
.pd-img{display:none !important}
.pd-track{position:absolute;inset:0;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.pd-track::-webkit-scrollbar{display:none}
.pd-slide{flex:0 0 100%;scroll-snap-align:center;background:#f1edeb center top/cover no-repeat}
.pd-count{position:absolute;right:14px;bottom:14px;padding:6px 10px;border-radius:999px;background:rgb(255 255 255 / 92%);color:var(--ink);font-size:13px;font-weight:700}
.pd-dots{position:absolute;left:0;right:0;bottom:62px;display:flex;justify-content:center;gap:6px;pointer-events:none}
.pd-dots i{width:6px;height:6px;border-radius:50%;background:rgb(255 255 255 / 60%)}.pd-dots i.on{background:#fff;width:16px;border-radius:3px}
.pd-tag{z-index:2}.pd-dm{z-index:2}
@media(max-width:1023px){.pd-media{aspect-ratio:auto !important;height:min(100vw,46dvh) !important}}

/* v133: focus on the photo: 4:5 on the phone, the rest (title, price, sizes, composition) is below the fold */
@media(max-width:1023px){.pd-media{height:min(125vw,64dvh) !important}.pd-dots{bottom:62px}}

/* v134: phone product card photo is square again (matches the existing square photos); title, price and sizes stay visible */
@media(max-width:1023px){.pd-media{height:min(100vw,47dvh) !important}}

/* v135: vertical photo (3:4, capped by the screen) with title + price on the photo; sizes pinned above the bar; composition/perks below the fold */
.pd-ov{display:none}
@media(max-width:1023px){
.pd-media{height:min(133.3vw,calc(92vh - 150px)) !important}
.pd-ov{display:block;position:absolute;left:0;right:0;bottom:0;z-index:2;padding:70px 16px 14px;background:linear-gradient(to top,rgb(20 10 12 / 62%),rgb(20 10 12 / 0%));color:#fff;pointer-events:none}
.pd-ov b{display:block;font-size:24px;font-weight:800;line-height:1.1}
.pd-ov span{display:block;margin-top:3px;font-size:14px;font-weight:600;opacity:.95;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pd-body h2,.pd-body .pd-price{display:none !important}
.pd-body{padding-top:0 !important}
.pd-body .pd-label:first-of-type{display:none}
.pd-sizes{position:sticky;bottom:calc(70px + env(safe-area-inset-bottom));z-index:3;background:#fff;margin:0 -20px !important;padding:10px 20px !important;border-top:1px solid var(--line)}
.pd-dm{bottom:92px !important}.pd-count{bottom:92px !important}
.pd-dots{bottom:auto !important;top:16px}
}

/* v136: size chips in the top-left corner (stacked), no photo counter (dots only), photo height from the small viewport so the pinned sizes always fit above the bar */
.pd-count{display:none !important}
@media(max-width:1023px){
.pd{height:92svh !important}
.pd-media{height:min(133.3vw,calc(92svh - 150px)) !important}
.pd-dm{left:14px !important;top:14px;bottom:auto !important;flex-direction:column;align-items:flex-start;gap:5px}
.pd-dm span{padding:5px 9px;font-size:13px}
.pd-tag:not([hidden])~.pd-dm{top:50px}
.pd-dots{top:20px !important}
}

/* v137: sizes without label/border; after "В корзину" the bar turns into a stepper (− N +, small price) + red "Оформить заказ" which opens the checkout */
.pd-step2,.pd-go{display:none}
@media(max-width:1023px){
.pd-price+.pd-label{display:none !important}
.pd-sizes{border-top:0 !important;padding:8px 20px 10px !important;box-shadow:0 -10px 12px -4px #fff}
.pd.is-added .pd-add,.pd.is-added .pd-chat{display:none !important}
.pd.is-added .pd-step2{display:flex}.pd.is-added .pd-go{display:block}
.pd-step2{flex:none;align-items:center;gap:2px;height:48px;padding:0 6px;border-radius:var(--r);background:#f3efed}
.pd-step2 button{width:36px;height:36px;border:0;border-radius:50%;background:transparent;color:var(--ink);font:inherit;font-size:22px;line-height:1;cursor:pointer}
.pd-step2 span{min-width:22px;text-align:center;font-size:16px;font-weight:800}
.pd-step2 small{margin:0 8px 0 4px;color:#7b7172;font-size:13px;font-weight:700;white-space:nowrap}
.pd-go{flex:1;min-width:0;height:48px;border:0;border-radius:var(--r);background:var(--red);color:#fff;font:inherit;font-size:15px;font-weight:800;white-space:nowrap;cursor:pointer}
}

/* v138: no size switching inside the card (a size is a separate product/page); the add button turns into a stepper, "Заказ в чате" stays; photo gets the freed room */
.pd-sizes,.pd-body .pd-price+.pd-label{display:none !important}
@media(max-width:1023px){
.pd-media{height:min(133.3vw,calc(92svh - 84px)) !important}
.pd.is-added .pd-chat{display:flex !important}
.pd.is-added .pd-go{display:none !important}
.pd-chat{align-items:center;justify-content:center}
}

/* v139: air under the photo; "other sizes" are links to separate products; after adding, the bar says "В корзине" with the sum (no green flash) */
.pd-alt{margin:0 0 20px}
.pd-alt .pd-label{display:block !important;margin-bottom:8px}
.pd-alt div{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}.pd-alt div::-webkit-scrollbar{display:none}
.pd-alt button{flex:none;display:grid;gap:0;padding:6px 11px;border:1.5px solid var(--line);border-radius:var(--r);background:#fff;color:var(--ink);font:inherit;text-align:left;white-space:nowrap;cursor:pointer}
.pd-alt b{font-size:13px}.pd-alt span{color:#7b7172;font-size:12px;font-weight:600}
.pd-add.is-done{background:var(--red) !important}
.pd-step2 small{display:grid;gap:0;margin:0 8px 0 6px;line-height:1.15}
.pd-step2 small i{font-style:normal;color:#2f8f57;font-size:12px;font-weight:700}
.pd-step2 small b{color:var(--ink);font-size:13px}
@media(max-width:1023px){.pd-body{padding-top:22px !important}.pd-comp{margin-top:6px}}

/* v140: one tap = one item; the bar then shows "В корзине" + stepper without the sum */
.pd-step2 small b{display:none !important}
.pd-step2 small i{font-size:13px !important}

/* v141: fixed button widths (left 58% / chat the rest) in both states, neutral "В корзине", slimmer bar so the next block peeks out under the photo */
.pd-step2 small i{color:#7b7172 !important;font-weight:700}
@media(max-width:1023px){
.pd-bar{padding:8px 14px calc(8px + env(safe-area-inset-bottom)) !important;gap:8px !important}
.pd-add,.pd-step2{flex:0 0 58% !important;width:58%;box-sizing:border-box;height:44px !important;line-height:44px}
.pd-step2{display:none;justify-content:space-between;padding:0 10px 0 6px !important}
.pd.is-added .pd-step2{display:flex !important}
.pd-step2 button{width:32px;height:32px}
.pd-add span,.pd-add b{font-size:15px !important}
.pd-chat{flex:1 1 0 !important;min-width:0;height:44px !important;padding:0 6px !important;font-size:14px !important}
.pd-media{height:min(133.3vw,calc(92svh - 150px)) !important}
.pd-sizes+*,.pd-alt{margin-top:0}
}

/* v142: photo back to (almost) full 3:4; the bar is lower/slimmer so only a small strip of the next block peeks out */
@media(max-width:1023px){
.pd-media{height:min(133.3vw,calc(92svh - 78px)) !important}
.pd-bar{padding:6px 14px calc(4px + env(safe-area-inset-bottom)) !important}
}

/* v143: after adding, the bar is [− N +] + red "Оформить заказ" (goes straight to the checkout form); a bit more of the next block peeks under the photo */
@media(max-width:1023px){
.pd-media{height:min(133.3vw,calc(92svh - 104px)) !important}
.pd.is-added .pd-chat{display:none !important}
.pd.is-added .pd-go{display:block !important;flex:1 1 0 !important;height:44px !important;line-height:44px;padding:0 8px}
.pd.is-added .pd-step2{flex:0 0 auto !important;width:auto !important;gap:2px}
.pd.is-added .pd-step2 small{display:none}
.pd.is-added .pd-step2 span{min-width:26px}
}

/* v144: after "В корзину" in the product card a sheet "Добавить к букету" opens (gifts from domroz.ru/catalog/podarki/); X closes it, "Перейти в корзину" opens the cart */
.up-hold{display:none}
.up-ov{position:fixed;left:0;right:0;top:0;bottom:calc(100dvh - 100lvh);z-index:230;background:rgb(25 14 17 / 52%);opacity:0;visibility:hidden;transition:opacity .2s}
.up{position:fixed;left:0;right:0;bottom:0;z-index:231;max-width:520px;margin:0 auto;max-height:88svh;display:flex;flex-direction:column;background:#fff;border-radius:var(--r) var(--r) 0 0;transform:translate3d(0,102%,0);visibility:hidden;transition:transform .3s cubic-bezier(.22,.8,.3,1)}
html.up-open .up-ov{opacity:1;visibility:visible}html.up-open .up{transform:translate3d(0,0,0);visibility:visible}
.up-head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 6px}
.up-head h3{margin:0;font-size:20px;font-weight:800}
.up-x{display:grid;place-items:center;width:40px;height:40px;border:0;border-radius:var(--r);background:#f3efed;color:var(--ink);cursor:pointer}
.up-x svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.up-sub{margin:0;padding:0 20px 10px;color:#7b7172;font-size:14px}
.up-grid{flex:1;overflow-y:auto;display:grid;grid-template-columns:repeat(2,1fr);gap:16px 12px;padding:6px 20px 16px;-webkit-overflow-scrolling:touch}
.up-card{display:grid;gap:6px;align-content:start}
.up-ph{position:relative;aspect-ratio:1;border-radius:var(--r);background:#f1edeb center/cover no-repeat}
.up-name{font-size:13px;line-height:1.3;color:var(--ink)}
.up-price{font-size:16px;font-weight:800}
.up-ctl{position:absolute;right:8px;bottom:8px;display:flex;align-items:center;background:rgb(255 255 255 / 94%);border-radius:999px;box-shadow:0 2px 8px rgb(38 22 25 / 18%)}
.up-ctl button{width:36px;height:36px;border:0;border-radius:50%;background:transparent;color:var(--red);font:inherit;font-size:22px;font-weight:700;line-height:1;cursor:pointer}
.up-ctl span{min-width:18px;text-align:center;font-weight:800;font-size:15px}
.up-ctl .up-m,.up-ctl span{display:none}.up-ctl.on .up-m,.up-ctl.on span{display:block}
.up-foot{padding:12px 20px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fff}
.up-go{width:100%;height:50px;border:0;border-radius:var(--r);background:var(--red);color:#fff;font:inherit;font-size:16px;font-weight:800;cursor:pointer}
@media(min-width:1024px){.up{left:50%;right:auto;bottom:auto;top:50%;width:min(560px,calc(100% - 40px));max-width:none;margin:0;border-radius:var(--r);transform:translate(-50%,-46%);opacity:0}html.up-open .up{transform:translate(-50%,-50%);opacity:1}}

/* v145: same bouquet shown twice in the feed is one product (qty mirrored by name); with 1+ in the cart the card shows [− N +] + "Оформить", which opens "Добавить к букету" */

/* v146: phone card bar is always [− N +] [Оформить] [Заказ в чате]; "Оформить" puts N in the cart and opens "Добавить к букету" */
@media(max-width:1023px){
#pd .pd-add{display:none !important}
#pd .pd-step2{display:flex !important;flex:0 0 auto !important;width:auto !important;gap:0;padding:0 4px !important;height:44px}
#pd .pd-step2 small{display:none !important}
#pd .pd-step2 button{width:30px;height:34px}
#pd .pd-step2 span{min-width:22px;font-size:16px}
#pd .pd-go{display:block !important;flex:1 1 0 !important;min-width:0;height:44px !important;line-height:44px;padding:0 6px;font-size:15px}
#pd .pd-chat{display:flex !important;flex:0 0 auto !important;width:auto !important;padding:0 12px !important;font-size:14px !important;height:44px !important}
}

/* v151: "Заказ принят" screen (adapted from the real post-order page: delivery, contacts, composition, sums, payment by SBP, back to catalog) */
.cp-done{display:none}
.cart-panel.is-done .cp-head,.cart-panel.is-done .cp-list,.cart-panel.is-done .cp-foot,.cart-panel.is-done .cp-form,.cart-panel.is-done .cp-perks,.cart-panel.is-done .cp-empty{display:none !important}
.cart-panel.is-done .cp-done{display:grid;gap:12px}
.dn-top{display:flex;gap:12px;align-items:center;padding-right:46px}
.dn-ok{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fdeff2;color:var(--red)}
.dn-ok svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.dn-top h3{margin:0;font-size:18px;font-weight:800;line-height:1.25}
.dn-top p{margin:2px 0 0;color:#7b7172;font-size:13px}
.dn-card{padding:14px;border-radius:var(--r);background:#f8f5f3;display:grid;gap:8px;font-size:14px}
.dn-card h4{margin:0;color:#7b7172;font-size:12px;font-weight:700;letter-spacing:.4px;text-transform:uppercase}
.dn-card p{margin:0}.dn-card b{font-weight:700}
.dn-item{display:flex;gap:10px;align-items:center}
.dn-thumb{flex:none;width:40px;height:52px;border-radius:var(--r);background:#f1edeb center/cover no-repeat}
.dn-item span{flex:1;min-width:0;font-size:14px}.dn-item em{font-style:normal;color:#7b7172}.dn-item strong{white-space:nowrap}
.dn-sum{display:flex;justify-content:space-between;font-size:14px}.dn-sum.t{padding-top:8px;border-top:1px solid var(--line);font-size:16px;font-weight:800}
.dn-qr{justify-self:center;width:150px;height:150px;border-radius:var(--r);background:#fff;display:grid;place-items:center;color:#c9c0c1;font-size:12px;text-align:center;border:1px solid var(--line)}
.dn-btn{width:100%;height:48px;border:0;border-radius:var(--r);background:var(--red);color:#fff;font:inherit;font-size:15px;font-weight:800;cursor:pointer}
.dn-btn.alt{background:#f3efed;color:var(--ink)}
.dn-note{margin:0;color:#7b7172;font-size:13px;line-height:1.4}
@media(min-width:1024px){.dn-bank{display:none}}

/* v153: "Заказ в чате" passes the product (or the whole cart) to the chat: WhatsApp gets the text in the link; Telegram and MAX links cannot carry text, so the text is copied and the chat opens */
.cp-chat{width:100%;height:46px;margin-top:8px;border:0;border-radius:var(--r);background:#fdeff2;color:#b5374e;font:inherit;font-size:15px;font-weight:700;cursor:pointer}

/* v160: desktop card: the photo column is exactly 3:4 (no side crop) and the modal grows with the window; arrows to flip the gallery with the mouse */
@media(min-width:1024px){
#pd{--h:min(780px,calc(100vh - 40px));height:var(--h) !important;width:min(calc(var(--h)*.75 + 480px),calc(100% - 40px)) !important;grid-template-columns:calc(var(--h)*.75) minmax(0,1fr) !important}
.pd-arrow{position:absolute;top:50%;z-index:3;display:grid;place-items:center;width:40px;height:40px;margin-top:-20px;border:0;border-radius:50%;background:rgb(255 255 255 / 92%);color:var(--ink);box-shadow:0 2px 10px rgb(38 22 25 / 20%);cursor:pointer;opacity:0;transition:opacity .15s}
.pd-media:hover .pd-arrow{opacity:1}
.pd-arrow.l{left:12px}.pd-arrow.r{right:12px}
.pd-arrow svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
}
@media(max-width:1023px){.pd-arrow{display:none}}

/* v161: the desktop card uses the same bar as the phone: [− N +] [Оформить] [Заказ в чате]; "Оформить" opens "Добавить к букету" */
@media(min-width:1024px){
#pd .pd-qty,#pd .pd-add{display:none !important}
#pd .pd-bar{display:flex;align-items:center;gap:10px;padding:14px 24px 16px}
#pd .pd-step2{display:flex !important;flex:0 0 auto;align-items:center;gap:2px;height:48px;padding:0 6px;border-radius:var(--r);background:#f3efed}
#pd .pd-step2 button{width:34px;height:36px;border:0;border-radius:50%;background:transparent;color:var(--ink);font:inherit;font-size:22px;line-height:1;cursor:pointer}
#pd .pd-step2 span{min-width:28px;text-align:center;font-size:16px;font-weight:800}
#pd .pd-step2 small{display:none !important}
#pd .pd-go{display:block !important;flex:1 1 0;min-width:0;height:48px;border:0;border-radius:var(--r);background:var(--red);color:#fff;font:inherit;font-size:16px;font-weight:800;cursor:pointer}
#pd .pd-go:hover{background:#b3001f}
#pd .pd-chat{display:flex !important;flex:0 0 auto;height:48px;align-items:center;padding:0 18px}
}

/* v162: bar order is always [− N +] [Оформить] [Заказ в чате] */
#pd .pd-step2{order:1}#pd .pd-go{order:2}#pd .pd-chat{order:3}

/* v163: gifts sheet is one scroll with short section headings (no tabs) */
.up-h{grid-column:1/-1;margin:6px 0 -4px;font-size:15px;font-weight:800}
.up-h:first-child{margin-top:0}

/* v164: gifts: on the phone one scroll with headings; on the desktop two columns side by side (as at PIONFLO), each scrolls on its own */
.up-col{display:contents}
@media(min-width:1024px){
.up{width:min(1000px,calc(100% - 40px)) !important;height:min(720px,calc(100vh - 48px));max-height:none !important}
.up-grid{display:grid !important;grid-template-columns:1fr 1fr !important;gap:0 24px !important;overflow:hidden !important;padding:0 24px 16px !important}
.up-col{display:grid;grid-template-columns:repeat(2,1fr);gap:16px 12px;align-content:start;overflow-y:auto;min-height:0;padding:2px 4px 8px 0}
.up-col:first-of-type{border-right:1px solid var(--line);padding-right:20px}
.up-h{font-size:18px;margin:4px 0 0}
}

/* v165: composition longer than 3 lines is folded to 3 with "Показать полностью" */
.pd-comp.is-fold li:nth-child(n+4){display:none}
.pd-comp-more{margin:-10px 0 18px;padding:0;border:0;background:transparent;color:var(--red);font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.pd-comp-more[hidden]{display:none}

/* v166: description block (draft texts) between the composition and the perks; composition fold link sits closer to the list; perks quieter */
.pd-comp.is-fold{margin-bottom:6px !important}
.pd-comp-more{margin:0 0 16px !important;font-size:13px !important}
.pd-desc{margin:0 0 18px}
.pd-desc .pd-label{margin-bottom:8px}
.pd-desc p{margin:0;color:#3d3436;font-size:15px;line-height:1.55}
.pd-desc.is-fold p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pd-desc-more{margin:6px 0 0;padding:0;border:0;background:transparent;color:var(--red);font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.pd-desc-more[hidden]{display:none}
.pd-desc[hidden]{display:none}

/* v167: order in the card: composition, perks, description (folded); desktop modal is more compact (max 720px high, photo 3:4) */
@media(min-width:1024px){
#pd{--h:min(720px,calc(100vh - 80px)) !important}
}

/* v168: desktop card is more compact (max 640px high) and the photo sits in a white frame with rounded corners (focus on the photo) */
@media(min-width:1024px){
#pd{--h:min(640px,calc(100vh - 100px)) !important}
#pd .pd-media{background:#fff !important}
#pd .pd-track{inset:14px !important;border-radius:var(--r);overflow-x:auto}
#pd .pd-slide{border-radius:var(--r)}
#pd .pd-tag{left:28px !important;top:28px !important}
#pd .pd-dm{left:28px !important;bottom:28px !important}
#pd .pd-dots{bottom:30px !important}
#pd .pd-count{right:28px !important;bottom:28px !important}
#pd .pd-arrow.l{left:26px}#pd .pd-arrow.r{right:26px}
}

/* v169: wider white frame (20px) so the photo and the text column breathe evenly */
@media(min-width:1024px){
#pd .pd-track{inset:20px !important}
#pd .pd-tag{left:34px !important;top:34px !important}
#pd .pd-dm{left:34px !important;bottom:34px !important}
#pd .pd-dots{bottom:36px !important}
#pd .pd-count{right:34px !important;bottom:34px !important}
#pd .pd-arrow.l{left:32px}#pd .pd-arrow.r{right:32px}
}

/* v170: "К этому букету вы получите" tiles with photos (card photo is real; the other photos are placeholders until supplied) */
.pd-gets{margin:0 0 18px}
.pd-gets h4{margin:0 0 10px;font-size:15px;font-weight:800}
.pd-gets-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.pd-get{display:grid;gap:6px;align-content:start;text-align:center}
.pd-get-ph{aspect-ratio:1;border-radius:var(--r);background:#f3efed center/cover no-repeat;display:grid;place-items:center;color:#c46a7a}
.pd-get-ph svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.pd-get span{font-size:13px;line-height:1.25;color:var(--ink)}
@media(max-width:1023px){.pd-gets-row{display:flex;overflow-x:auto;gap:10px;margin:0 -20px;padding:0 20px;scrollbar-width:none}.pd-gets-row::-webkit-scrollbar{display:none}.pd-get{flex:0 0 112px}}

/* v171: smaller, tidier gift tiles */
.pd-gets-row{grid-template-columns:repeat(4,92px);gap:14px;justify-content:start}
.pd-get-ph{border-radius:var(--r)}
.pd-get-ph svg{width:26px;height:26px}
.pd-get span{font-size:12px}
.pd-gets h4{font-size:14px}
@media(max-width:1023px){.pd-gets-row{display:flex}.pd-get{flex:0 0 92px}}

/* v172: phone tiles: four fit the screen; the delivery block has its own heading; "Описание" label is visible on the phone */
.pd-desc .pd-label{display:block !important}
.pd-del-h{margin:0 0 8px;color:#7b7172;font-size:12px;font-weight:700;letter-spacing:.4px;text-transform:uppercase}
@media(max-width:1023px){
.pd-gets-row{display:grid !important;grid-template-columns:repeat(4,1fr);gap:8px;margin:0;padding:0;overflow:visible}
.pd-get{flex:none}
.pd-get span{font-size:12px}
}

/* v173: "Доставка" and "Описание" are quiet accordion rows (closed by default); the delivery text has no grey box */
.pd-acc{border-top:1px solid var(--line)}
.pd-acc:last-of-type{border-bottom:1px solid var(--line)}
.pd-acc-h{display:flex;align-items:center;justify-content:space-between;width:100%;padding:14px 0;border:0;background:transparent;color:var(--ink);font:inherit;font-size:15px;font-weight:700;text-align:left;cursor:pointer}
.pd-acc-h svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.pd-acc.is-open .pd-acc-h svg{transform:rotate(180deg)}
.pd-acc-b{display:none;padding:0 0 14px}
.pd-acc.is-open .pd-acc-b{display:block}
.pd-acc .pd-perks{margin:0 !important;padding:0 !important;background:none !important;border-radius:0 !important;gap:6px}
.pd-acc .pd-perks li{font-size:14px;color:#5f5557}
.pd-acc .pd-desc{margin:0}
.pd-acc .pd-desc p{display:block !important;-webkit-line-clamp:unset}
.pd-acc .pd-desc-more,.pd-acc .pd-desc .pd-label,.pd-del-h{display:none !important}

/* v174: a visible note under the composition (mix = florist chooses the colours; seasonal changes) */
.pd-note[hidden]{display:none}.pd-note{margin:0 0 18px;color:#7b7172;font-size:13px;line-height:1.45}
.pd-note b{color:#5f5557;font-weight:700}

/* v179: trigger "photo of the finished bouquet before delivery": a line right under the price/photo and the first tile */
.pd-teaser{display:flex;align-items:center;gap:8px;margin:0 0 16px;padding:9px 12px;border-radius:var(--r);background:#fdeff2;color:#8f2a40;font-size:14px;font-weight:600;line-height:1.3}
.pd-teaser svg{flex:none;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pd-get.is-key .pd-get-ph{box-shadow:inset 0 0 0 1.5px #e9aab6;background:#fdeff2}

/* v180: the pink teaser line is removed; the photo-before-delivery tile stays first */
.pd-teaser{display:none !important}

/* v182: compact two-row rating (Yandex Maps / 2GIS) like MATE: small mark, star, score, (count); the Telegram promo strip on the phone can be closed */
.rr2c{display:flex !important;flex-direction:column !important;align-items:flex-start !important;justify-content:center !important;gap:3px !important;height:auto !important;min-height:44px;padding:6px 14px !important;width:max-content !important;text-align:left !important}
.rr2c .rr2-row{display:flex;align-items:center;gap:6px;line-height:1}
.rr2c .rr2-b{flex:none;display:grid;place-items:center;width:17px;height:17px;border-radius:50%;color:#fff;font-style:normal;font-size:11px;font-weight:800;line-height:1}
.rr2c .rr2-b.ya{background:#fc3f1d}
.rr2c .rr2-b.gis{background:#19aa1e;border-radius:5px;font-size:11px}
.rr2c .rr2-star{color:#f5a623;font-style:normal;font-size:14px;line-height:1}
.rr2c .rr2-row b{font-size:15px;font-weight:800;color:var(--ink);letter-spacing:-.2px}
.rr2c .rr2-row em{color:#7b7172;font-style:normal;font-size:12px;font-weight:600}
.mb-rating.rr2c{top:calc(env(safe-area-inset-top,0px) + 24px) !important;padding:6px 12px !important}
.mb-rating.rr2c .rr2-row em{display:none}
.telegram-promo .tg-x{position:absolute;right:8px;top:50%;transform:translateY(-50%);display:none;place-items:center;width:30px;height:30px;border-radius:50%;color:#fff;cursor:pointer}
.telegram-promo .tg-x svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
@media(max-width:1023px){.telegram-promo.shell{position:relative}.telegram-promo .tg-x{display:grid}.telegram-promo.is-closed{display:none !important}}

/* v183: original Yandex Maps pin and 2GIS app icon in the rating plaque */
.rr2c .rr2-b{font-size:0 !important;color:transparent !important;background-color:transparent !important;background-position:center;background-repeat:no-repeat;background-size:contain;border-radius:0 !important}
.rr2c .rr2-b.ya{background-image:url("data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M8%201C4.6862%201%202%203.6862%202%207C2%208.6563%202.6711%2010.156%203.7565%2011.2417C4.8422%2012.328%207.4%2013.9%207.55%2015.55C7.57249%2015.7974%207.7516%2016%208%2016C8.2484%2016%208.42751%2015.7974%208.45%2015.55C8.6%2013.9%2011.1578%2012.328%2012.2435%2011.2417C13.3289%2010.156%2014%208.6563%2014%207C14%203.6862%2011.3138%201%208%201Z%22%20fill%3D%22%23FF4433%22/%3E%3Cpath%20d%3D%22M8.00002%209.10015C9.15982%209.10015%2010.1%208.15994%2010.1%207.00015C10.1%205.84035%209.15982%204.90015%208.00002%204.90015C6.84023%204.90015%205.90002%205.84035%205.90002%207.00015C5.90002%208.15994%206.84023%209.10015%208.00002%209.10015Z%22%20fill%3D%22white%22/%3E%3C/svg%3E%0A");width:17px;height:17px}
.rr2c .rr2-b.gis{background-image:url("../img/ui-fb69aeb9.png");width:17px;height:17px;border-radius:4px !important}

/* v184: official Yandex "Я" in the rating plaque */
.rr2c .rr2-b.ya{background-image:url("../img/ui-2bc85d1e.png") !important;border-radius:50% !important}

.rr2c .rr2-b{background-size:contain !important;background-repeat:no-repeat !important;background-position:center !important}

/* v185: the two-row rating plaque is exactly as tall as the search field (44px) */
.dt-rating.rr2c{height:44px !important;min-height:44px !important;padding:0 13px !important;gap:2px !important;box-sizing:border-box}
.dt-rating.rr2c .rr2-row{gap:5px}
.dt-rating.rr2c .rr2-b{width:16px !important;height:16px !important}
.dt-rating.rr2c .rr2-row b{font-size:14px}
.dt-rating.rr2c .rr2-star{font-size:13px}
.dt-rating.rr2c .rr2-row em{font-size:12px}

/* v186: fix: my rating rule forced display:flex and showed the phone/menu plaques on the desktop and the desktop one on the phone */
@media(min-width:1024px){.mb-rating.rr2c,.menu-rating.rr2c{display:none !important}}
@media(max-width:1023px){.dt-rating.rr2c{display:none !important}}

/* v187: no close cross on the Telegram strip (it broke the symmetry) */
.telegram-promo .tg-x{display:none !important}

/* v188: on the phone the invisible header box covered the rating plaque on the banner and swallowed the taps */
@media(max-width:1023px){
.header-main.shell{pointer-events:none}
.header-main.shell a,.header-main.shell button,.header-main.shell input,.header-main.shell select{pointer-events:auto}
}

/* v190: the three ratings fit the phone screen in one row (no sideways scroll, no grey strip) */
@media(max-width:1023px){
.reviews{overflow-x:clip}
.rv-head{display:grid !important}
.rv-scores{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
a.rv-score,.rv-score{flex-direction:column;align-items:flex-start;gap:4px;padding:10px 12px;min-width:0}
.rv-score b{font-size:24px}
.rv-score span{font-size:12px;line-height:1.25}
}

/* v191: desktop footer: black messenger tiles next to the phone number (as on the phone); the "Написать нам" row is gone */
@media(min-width:1024px){
.footer-contact{display:grid !important;grid-template-columns:auto auto;justify-content:start;align-items:center;column-gap:14px}
.footer-contact>strong{grid-column:1 / 3}
.footer-contact .footer-phone{grid-column:1;grid-row:2;padding:4px 0 !important;font-size:20px;white-space:nowrap}
.footer-contact .fc-icons{display:flex !important;grid-column:2;grid-row:2;gap:8px}
.fc-icons a{display:grid;place-items:center;width:38px;height:38px;border-radius:var(--r);background:var(--ink)}
.fc-icons svg{width:19px;height:19px;fill:#fff;stroke:none}
.fc-icons svg path{stroke:none;fill:#fff}
.footer-contact>p:not(.footer-meta-note){grid-column:1 / 3}
.footer-contact .footer-label,.footer-contact .footer-chats{display:none !important}
}

/* v194: menu: navigation ends with "О магазине", then the ratings, then a "Контакты" heading and the contacts card */
.menu-group--contacts{margin-bottom:0 !important;padding-bottom:0 !important}
.menu-group--contacts small{display:block;margin:6px 0 8px}

/* v195: menu without divider lines; equal spacing above and below the ratings block */
.menu-group a{border-bottom:0 !important;border-top:0 !important;box-shadow:none !important}
.menu-group a+a{border:0 !important}
.menu-drawer .menu-rating{margin:0 0 0 !important}
.menu-drawer nav.menu-group:not(.menu-group--contacts){margin-bottom:10px !important}
.menu-drawer .menu-group--contacts{margin-top:20px !important}

/* v196: in the menu the ratings are one line without a frame (Yandex | 2GIS), the whole line is a link to the reviews */
.menu-drawer .menu-rating.rr2c{flex-direction:row !important;align-items:center !important;gap:22px !important;padding:0 !important;min-height:0 !important;border:0 !important;background:none !important;box-shadow:none !important;border-radius:0 !important;width:max-content !important}
.menu-drawer .menu-rating.rr2c .rr2-row{gap:6px}
.menu-drawer .menu-rating.rr2c .rr2-b{width:20px !important;height:20px !important}
.menu-drawer .menu-rating.rr2c .rr2-row b{font-size:18px}
.menu-drawer .menu-rating.rr2c .rr2-star{font-size:15px}
.menu-drawer .menu-rating.rr2c .rr2-row em{font-size:13px}

.menu-drawer nav.menu-group:not(.menu-group--contacts){margin-bottom:14px !important}
.menu-drawer .menu-group--contacts{margin-top:12px !important}

.menu-drawer .menu-contacts{margin-top:0 !important}
.menu-drawer .menu-group--contacts{margin-top:14px !important}

/* v197: more air around the ratings line */
.menu-drawer nav.menu-group:not(.menu-group--contacts){margin-bottom:26px !important}
.menu-drawer .menu-group--contacts{margin-top:24px !important}

/* v199: on the phone the gifts sheet is one flat list (best sellers first, no headings); on the desktop the two columns with headings stay */
@media(max-width:1023px){
.up-h{display:none !important}
.up-card{order:var(--o,0)}
}

/* v200: the desktop header rating has no frame */
.dt-rating.rr2c{border:0 !important;background:transparent !important;box-shadow:none !important;padding:0 10px !important}
.dt-rating.rr2c:hover{background:transparent !important}
/* v201: checkout window (PIONFLO-style window, DOMROZ checkout content): left blocks, right order summary; phone = one column + sticky bar */
.co-ov{position:fixed;left:0;right:0;top:0;bottom:calc(100dvh - 100lvh);z-index:240;background:rgb(25 14 17 / 52%);opacity:0;visibility:hidden;transition:opacity .2s}
.co{position:fixed;z-index:241;left:0;right:0;bottom:0;height:94dvh;max-width:600px;margin:0 auto;display:flex;flex-direction:column;background:#fff;border-radius:var(--r) var(--r) 0 0;transform:translate3d(0,102%,0);visibility:hidden;transition:transform .3s cubic-bezier(.22,.8,.3,1)}
html.co-open .co-ov{opacity:1;visibility:visible}html.co-open .co{transform:translate3d(0,0,0);visibility:visible}
.co form{display:flex;flex-direction:column;min-height:0;flex:1}
.co-head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 10px}
.co-head h2{margin:0;font-size:22px;font-weight:800}
.co-x{display:grid;place-items:center;width:40px;height:40px;border:0;border-radius:var(--r);background:#f3efed;color:var(--ink);cursor:pointer}
.co-x svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.co-body{flex:1;min-height:0;overflow-y:auto;padding:0 16px 16px;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.co-left,.co-right{display:grid;gap:12px;align-content:start}
.co-right{margin-top:12px}
.co-card{padding:16px;border-radius:var(--r);background:#f8f5f3;display:grid;gap:12px}
.co-card h3{margin:0;font-size:16px;font-weight:800}
.co-card label{display:grid;gap:6px;color:#7b7172;font-size:13px;font-weight:600}
.co-card input[type=text],.co-card input[type=tel],.co-card input[type=date],.co-card input[type=time],.co-card textarea{width:100%;box-sizing:border-box;border:0;border-radius:var(--r);background:#fff;color:var(--ink);font:inherit;font-size:16px;outline:0}
.co-card input[type=text],.co-card input[type=tel],.co-card input[type=date],.co-card input[type=time]{height:46px;padding:0 14px}
.co-card textarea{padding:12px 14px;min-height:76px;resize:none}
.co-card input:focus,.co-card textarea:focus{box-shadow:0 0 0 2px var(--red)}
.co-card .bad,.co-card input.bad,.co-card textarea.bad{box-shadow:0 0 0 2px var(--red) !important}
.co-err{display:none;color:var(--red);font-size:13px;font-weight:600}
.co-err.on{display:block}
.co-lab{color:#7b7172;font-size:13px;font-weight:600}
.co-seg{display:flex;flex-wrap:wrap;gap:6px}
.co-seg.wide{display:grid;grid-auto-flow:column;grid-auto-columns:1fr}
.co-seg label{position:relative;display:block;color:var(--ink)}
.co-seg input,.co-types input,.co-slots input,.co-pay input{position:absolute;opacity:0;width:0;height:0}
.co-seg span{display:grid;place-items:center;min-height:44px;padding:0 18px;border-radius:var(--r);background:#fff;color:var(--ink);font-size:14px;font-weight:700;text-align:center;cursor:pointer}
.co-seg input:checked+span,.co-slots input:checked+span,.co-pay input:checked+span{background:#fdeff2;color:#b5374e;box-shadow:inset 0 0 0 1.5px var(--red)}
.co-types{display:grid;gap:8px}
.co-types label{position:relative;display:block;color:var(--ink)}
.co-types .t{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:12px 14px;border-radius:var(--r);background:#fff;cursor:pointer}
.co-types .t b{font-size:15px;font-weight:700}.co-types .t i{font-style:normal;color:#7b7172;font-size:13px;font-weight:500;grid-column:1}
.co-types .t em{grid-row:1 / 3;grid-column:2;align-self:center;font-style:normal;font-size:14px;font-weight:800}
.co-types input:checked+.t{background:#fdeff2;box-shadow:inset 0 0 0 1.5px var(--red)}
.co-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.co-slots label{position:relative;display:block}.co-slots span{display:grid;place-items:center;min-height:42px;border-radius:var(--r);background:#fff;color:var(--ink);font-size:14px;font-weight:700;cursor:pointer}
.co-slots label.off span{opacity:.35;pointer-events:none}
.co-chk{display:flex !important;align-items:flex-start;gap:10px;color:#5f5557 !important;font-size:13px !important;line-height:1.35}
.co-chk input{position:static !important;opacity:1 !important;width:20px !important;height:20px !important;flex:none;margin:0;accent-color:var(--red)}
.co-chk a{color:var(--red)}
.co-addcm{justify-self:start;padding:0;border:0;background:transparent;color:var(--red);font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.co-help{background:#fdeff2;gap:8px}
.co-help b{font-size:15px}.co-help span{color:#8f6e76;font-size:13px}
.co-chat{height:42px;border:1.5px solid #e9aab6;border-radius:var(--r);background:#fff;color:#b5374e;font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.co-items{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.co-items li{display:flex;gap:10px;align-items:center;font-size:14px}
.co-items .th{flex:none;width:40px;height:52px;border-radius:var(--r);background:#f1edeb center/cover no-repeat}
.co-items .nm{flex:1;min-width:0}.co-items .nm em{font-style:normal;color:#7b7172}
.co-items strong{white-space:nowrap;font-size:14px}
.co-promo{display:flex;gap:8px}
.co-promo input{flex:1;min-width:0}
.co-promo button{flex:none;padding:0 16px;border:0;border-radius:var(--r);background:#f1dfe3;color:#b5374e;font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.co-pm{display:none;font-size:13px;font-weight:600}.co-pm.on{display:block;color:#7b7172}
.co-rows{display:grid;gap:6px;font-size:14px}.co-rows div{display:flex;justify-content:space-between}
.co-rows .t{padding-top:8px;border-top:1px solid var(--line);font-size:18px;font-weight:800}
.co-pay{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.co-pay label{position:relative;display:block}.co-pay label:last-child{grid-column:1 / 3}
.co-pay span{display:grid;place-items:center;min-height:42px;padding:0 8px;border-radius:var(--r);background:#fff;color:var(--ink);font-size:14px;font-weight:700;cursor:pointer;text-align:center}
.co-go{height:50px;border:0;border-radius:var(--r);background:var(--red);color:#fff;font:inherit;font-size:16px;font-weight:800;cursor:pointer}
.co-go:hover{background:#b3001f}
.co-foot{display:none}
.co-done{display:none;padding:0 16px 16px;overflow-y:auto}
.co.is-done .co-body,.co.is-done .co-foot{display:none !important}
.co.is-done .co-done{display:grid;gap:12px;flex:1}
.co[hidden-pick] .co-deliv{display:none}
.co.is-pick .co-deliv,.co.is-pick .co-rec,.co.is-pick .co-who{display:none}
.co:not(.is-pick) .co-pick{display:none}
.co.is-me .co-rec{display:none}
.co-rec{display:grid;gap:12px}
@media(max-width:1023px){
.co-right .co-go{display:none}
.co-foot{display:flex;align-items:center;gap:14px;padding:10px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fff}
.co-foot .tt{display:grid;line-height:1.1}.co-foot .tt small{color:#7b7172;font-size:12px;font-weight:600}.co-foot .tt b{font-size:20px;font-weight:800}
.co-foot .co-go{flex:1}
}
@media(min-width:1024px){
.co-ov{z-index:240}
.co{left:50%;right:auto;bottom:auto;top:50%;width:min(900px,calc(100% - 40px));max-width:none;height:min(780px,calc(100vh - 48px));margin:0;border-radius:var(--r);transform:translate(-50%,-46%);opacity:0}
html.co-open .co{transform:translate(-50%,-50%);opacity:1}
.co-body{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;overflow:hidden;padding:0 20px 20px}
.co-left,.co-right{overflow-y:auto;margin:0;padding-right:2px;min-height:0}
.co-foot{display:none !important}
}

.co-recv{margin:0 0 0}
.co-recv span{min-height:46px;background:#f3efed}
.co-recv input:checked+span{background:var(--red);color:#fff;box-shadow:none}
.co-pn{color:#7b7172;font-size:13px;font-weight:500}
.co-grow{display:flex;gap:10px;overflow-x:auto;margin:0 -16px;padding:0 16px 2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.co-grow::-webkit-scrollbar{display:none}
.co-g{flex:0 0 112px;display:grid;gap:5px;align-content:start}
.co-g .ph{position:relative;aspect-ratio:1;border-radius:var(--r);background:#f1edeb center/cover no-repeat}
.co-g .nm{font-size:13px;line-height:1.25;color:var(--ink);min-height:31px}
.co-g .pr{font-size:14px;font-weight:800}
.co-g .ctl{position:absolute;right:6px;bottom:6px;display:flex;align-items:center;background:rgb(255 255 255 / 94%);border-radius:999px;box-shadow:0 2px 8px rgb(38 22 25 / 18%)}
.co-g .ctl button{width:32px;height:32px;border:0;border-radius:50%;background:transparent;color:var(--red);font:inherit;font-size:20px;font-weight:700;line-height:1;cursor:pointer}
.co-g .ctl span,.co-g .ctl .m{display:none}.co-g .ctl.on span,.co-g .ctl.on .m{display:block}
.co-g .ctl span{min-width:16px;text-align:center;font-weight:800;font-size:14px}

.co [hidden]{display:none !important}

/* v204: red promo button; the order list is read-only with an "Изменить" link back to the cart */
.co-promo button{background:var(--red) !important;color:#fff !important}
.co-promo button:hover{background:#b3001f !important}
.co-sumhead{display:flex;align-items:baseline;justify-content:space-between}
.co-edit{padding:0;border:0;background:transparent;color:var(--red);font:inherit;font-size:14px;font-weight:700;cursor:pointer}

/* v205: pickup has a point card and date + time; "Заказчик"/"Имя"; no gifts block inside the form (gifts come before the window) */
.co-gifts{display:none !important}
.co-ptime{display:none !important}
.co.is-pick .co-ptime{display:grid !important}
.co.is-pick .co-dt,.co.is-pick .co-types,.co.is-pick .co-intv,.co.is-pick .co-exact,.co.is-pick .co-addr-i{display:none !important}
.co.is-pick .co-deliv{display:grid !important}
.co.is-pick .co-who{display:none !important}
.co-point{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:var(--r);background:#fff}
.co-point svg{flex:none;width:24px;height:24px;margin-top:2px;fill:none;stroke:var(--red);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.co-point div{display:grid;gap:2px;font-size:14px}.co-point b{font-size:15px}.co-point span{color:#7b7172;font-size:14px}

/* v206: capsule switch with a sliding thumb, joined promo field, date picker on the "Другая дата" pill, payment logos, one-line consent, free card line, chat button under the main button */
.co-recv{position:relative;display:grid !important;grid-template-columns:1fr 1fr;gap:0 !important;padding:4px;border-radius:999px;background:#f3efed}
.co-recv::before{content:"";position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:999px;background:var(--red);transition:transform .28s cubic-bezier(.22,.8,.3,1)}
.co.is-pick .co-recv::before{transform:translateX(100%)}
.co-recv label{position:relative;z-index:1}
.co-recv span{background:transparent !important;min-height:42px !important;color:var(--ink);box-shadow:none !important}
.co-recv input:checked+span{background:transparent !important;color:#fff !important;box-shadow:none !important}
.co-promo{gap:0 !important;padding:0;border-radius:var(--r);background:#fff;overflow:hidden}
.co-promo input{background:transparent !important;border-radius:0 !important}
.co-promo button{border-radius:0 !important;height:46px;background:var(--red) !important;color:#fff !important}
.co-datelab{position:relative}
.co-datelab input[type=date]{position:absolute !important;inset:0;width:100% !important;height:100% !important;opacity:0;cursor:pointer;padding:0 !important}
.co-pay span{display:flex !important;align-items:center;justify-content:center;gap:8px}
.co-pay .pi{display:block;flex:none;width:22px;height:22px;line-height:0;color:#5b6472}
.co-pay .pi svg{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.co-pay .pi.sbp{background:url("../img/ui-c4124be0.png") center/contain no-repeat}
.co-pay input:checked+span .pi{color:var(--red)}
.co-chk{align-items:center !important;gap:8px !important}
.co-chk input{width:16px !important;height:16px !important}
.co-consent{font-size:12px !important;letter-spacing:-.1px}
.co-items .th.free{background:#fdeff2}
.co-items .th.free::after{content:"✉";display:grid;place-items:center;height:100%;color:#c46a7a;font-size:16px}
.co-chat{display:flex;align-items:center;justify-content:center;gap:8px;height:46px;border:0 !important;border-radius:var(--r) !important;background:#fdeff2 !important;color:#b5374e !important;font:inherit;font-size:15px;font-weight:700;cursor:pointer}
.co-chat svg{width:18px;height:18px;fill:currentColor}

.co-consent{font-size:12px !important;white-space:nowrap;letter-spacing:-.15px}
.co-consent span{white-space:nowrap}

.co-consent{font-size:11px !important;letter-spacing:-.1px;gap:7px !important}
@media(min-width:1024px){.co{width:min(920px,calc(100% - 40px)) !important}.co-body{grid-template-columns:minmax(0,1fr) 340px !important}.co-right .co-card{padding:14px !important}}

.co-card select{width:100%;box-sizing:border-box;height:46px;padding:0 14px;border:0;border-radius:var(--r);background:#fff;color:var(--ink);font:inherit;font-size:16px;outline:0}
.co-card select:focus{box-shadow:0 0 0 2px var(--red)}
.co-point{align-items:center !important}.co-point svg{margin-top:0 !important}

/* v208: PIONFLO-like contrast (grey window, white cards, grey fields), rectangles with the shared radius (no pills), transparent SBP logo, no horizontal scroll */
.co{background:#f3efed}
.co-card{background:#fff}
.co-card input[type=text],.co-card input[type=tel],.co-card input[type=date],.co-card input[type=time],.co-card textarea,.co-card select{background:#f3efed !important}
.co-seg span,.co-slots span,.co-pay span,.co-types .t,.co-point{background:#f3efed}
.co-seg input:checked+span,.co-slots input:checked+span,.co-pay input:checked+span,.co-types input:checked+.t{background:#fdeff2}
.co-promo{background:#f3efed !important}
.co-recv{background:#fff !important;border-radius:var(--r) !important}
.co-recv::before{border-radius:var(--r) !important}
.co-recv span{background:transparent !important}
.co-pay .pi.sbp{background:url("../img/ui-6184b991.png") center/contain no-repeat}
.co-pay span{white-space:nowrap;font-size:14px !important}
.co-pay .pi,.co-pay .pi svg{width:22px;height:22px}
.co-pay label:nth-child(2) span{gap:6px}
.co-chk input{-webkit-appearance:none;appearance:none;flex:none;width:18px !important;height:18px !important;margin:0;border:1.5px solid #c9c0c1;border-radius:5px;background:#fff center/12px no-repeat;cursor:pointer}
.co-chk input:checked{border-color:var(--red);background-color:var(--red);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-6.5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.co-chk{align-items:center !important}
.co-help{display:none}
.co-right,.co-left{overflow-x:hidden !important}
@media(min-width:1024px){.co{width:min(940px,calc(100% - 40px)) !important}.co-body{grid-template-columns:minmax(0,1fr) 360px !important}}

/* v209: promo button is pale until a code is typed; the free card is a "DOMROZ card" line with 0 ₽ */
.co-promo button:disabled{background:#e9a9b4 !important;cursor:default}

/* v210: bright red selected pills for date/interval; desktop: order list + promo scroll, while totals, payment, consent, button and chat button are pinned at the bottom; free card line in the cart */
.co-seg:not(.wide) input:checked+span,.co-slots input:checked+span{background:var(--red) !important;color:#fff !important;box-shadow:none !important}
.cp-item.is-free .cp-thumb{background:#fdeff2 !important;display:grid;place-items:center}
.cp-item.is-free .cp-thumb::after{content:"✉";color:#c46a7a;font-size:18px}
.cp-item.is-free .cp-step{display:none}
@media(min-width:1024px){
.co-right{overflow:hidden !important;margin:0}
.co-right>.co-card{height:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:0}
.co-top{flex:1 1 auto;min-height:0;overflow-y:auto;display:grid;gap:12px;align-content:start;padding-bottom:10px}
.co-bot{flex:none;display:grid;gap:10px;padding-top:10px;border-top:1px solid var(--line)}
}

/* v211: fix: the grid row of the window body was as tall as the left column, so the pinned bottom of the right column went below the window */
@media(min-width:1024px){.co-body{grid-template-rows:minmax(0,1fr) !important}.co-left{height:100%}}

@media(min-width:1024px){.co-right{grid-template-rows:minmax(0,1fr) !important;align-content:stretch !important}.co-right>.co-card{min-height:0 !important;height:100%}.co-top{min-height:0}}

/* v212: address in its own block before "Когда доставить"; options reveal their controls right below; time = select with 30-min intervals; no address comment */
.co.is-pick .co-addrc{display:none !important}
.co-note{color:#7b7172;font-size:13px;line-height:1.35}
.co-types .co-intv,.co-types .co-exact{padding:0 2px 6px}
.co-types .co-exact{display:grid;gap:6px}
.co-types label:has(input:disabled) .t{cursor:not-allowed}

/* v213: compact delivery options: title and hint on one line, price on the right ("0 ₽" instead of "Бесплатно") */
.co-types .t{display:flex !important;align-items:center;flex-wrap:wrap;gap:2px 10px;padding:11px 14px !important}
.co-types .t b{display:inline !important;font-size:15px}
.co-types .t i{display:inline !important;font-size:13px}
.co-types .t em{margin-left:auto;grid-row:auto;font-size:14px}

/* v215: delivery options are a horizontal row of tiles (title + price); the area below changes: description + time/interval controls */
.co-types{display:grid !important;grid-auto-flow:column;grid-auto-columns:minmax(104px,1fr);gap:8px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.co-types::-webkit-scrollbar{display:none}
.co-types .t{display:flex !important;flex-direction:column !important;align-items:flex-start !important;justify-content:space-between;flex-wrap:nowrap !important;gap:6px !important;min-height:74px;padding:10px 12px !important;height:100%;box-sizing:border-box}
.co-types .t b{font-size:14px !important;line-height:1.2}
.co-types .t i{display:none !important}
.co-types .t em{margin-left:0 !important;font-size:14px !important}
.co-dd{display:grid;gap:10px}
.co-desc{color:#5f5557;font-size:14px;line-height:1.4}
.co-dd .co-intv,.co-dd .co-exact{padding:0}

/* v216: exact + night delivery have an exact-time select; "as soon as possible" switches the date to today and shows the estimate */
.co-dd .co-exact,.co-dd .co-night{display:grid;gap:6px;padding:0}
.co-dd .co-exact[hidden],.co-dd .co-night[hidden],.co-dd .co-intv[hidden]{display:none !important}

/* v217: delivery types as tidy tiles: icon, name, price; names in full */
.co-types{grid-auto-columns:minmax(86px,1fr) !important;gap:6px !important}
.co-types .t{align-items:center !important;justify-content:flex-start !important;text-align:center;gap:6px !important;min-height:112px;padding:12px 3px 10px !important}
.co-types .t .ti{flex:none;width:26px;height:26px;fill:none;stroke:var(--red);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.co-types .t b{font-size:12px !important;line-height:1.2;font-weight:700;overflow-wrap:normal;word-break:normal;hyphens:none}
.co-types .t em{margin-top:auto !important;font-size:13px !important;font-weight:800;font-style:normal}
@media(max-width:700px){.co-types{grid-auto-columns:96px !important}}

/* v218: no icons on delivery tiles; exact + night time = native time field (hours, then minutes) */
.co-types .t{min-height:84px !important;padding:12px 4px 10px !important}
.co-types .t b{font-size:13px !important}
.co-card input[type=time]{width:100%;box-sizing:border-box;height:46px;padding:0 14px;border:0;border-radius:var(--r);color:var(--ink);font:inherit;font-size:16px;outline:0;-webkit-appearance:none;appearance:none;text-align:left}
.co-card input[type=time]:focus{box-shadow:0 0 0 2px var(--red)}
.co-card input[type=time].bad{box-shadow:0 0 0 2px var(--red)}

/* v220: tiles keep the same size with 4 or 5 options (5 fit the row; 4 are centered) */
.co-types{display:flex !important;justify-content:center;gap:6px !important;overflow-x:auto}
.co-types>label{flex:0 0 calc((100% - 24px)/5) !important;min-width:0}
@media(max-width:700px){.co-types{justify-content:flex-start}.co-types>label{flex:0 0 96px !important}}

/* v221: four tiles always; urgent + exact time are one tile (on today: switch "как можно скорее" / "к точному времени"); tiles share the row */
.co-types>label{flex:1 1 0 !important;min-width:0}
@media(max-width:700px){.co-types>label{flex:1 1 0 !important}.co-types .t b{font-size:11px !important}}
.co-dd .co-exact{display:grid;gap:10px}
.co-dd .co-exact[hidden]{display:none !important}
.co-xm[hidden],.co-xt[hidden]{display:none !important}
.co-xt{display:grid;gap:6px}

/* v222: compact time fields (label + short field in one row), the whole field opens the picker */
.co-xt,.co-night{display:flex !important;flex-wrap:wrap;align-items:center;gap:6px 12px}
.co-xt[hidden],.co-night[hidden]{display:none !important}
.co-xt input[type=time],.co-night input[type=time]{flex:0 0 150px;width:150px !important;cursor:pointer}
.co-xt small,.co-night small{flex:1 0 100%}
.co-card input[type=time]::-webkit-calendar-picker-indicator{cursor:pointer}

/* v223: "as soon as possible" is a checkbox; time field looks like a select with a placeholder, whole field opens the picker */
.co-tf{position:relative;display:flex !important;align-items:center;justify-content:space-between;gap:10px;height:46px;padding:0 14px;border-radius:var(--r);background:#f3efed;max-width:300px;cursor:pointer;box-sizing:border-box}
.co-tf .v{color:#8b8284;font-size:16px}
.co-tf .v.has{color:var(--ink)}
.co-tf svg{flex:none;width:20px;height:20px;fill:none;stroke:#8b8284;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.co-tf input[type=time]{position:absolute !important;inset:0;width:100% !important;height:100% !important;opacity:0;flex:none !important;cursor:pointer;padding:0}
.co-tf:has(input.bad){box-shadow:0 0 0 2px var(--red)}
.co-xt,.co-night{display:grid !important;gap:6px}
.co-xt[hidden],.co-night[hidden]{display:none !important}
.co-dd .co-chk.co-xm{margin:2px 0}

/* v224: example phone as a pale italic placeholder (no prefilled "+7 ("), name placeholders; payment methods as one row of square tiles */
.co input::placeholder,.co textarea::placeholder{color:#b7adaf !important;font-style:italic;opacity:1}
.co-pay{grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:6px !important}
.co-pay label:last-child{grid-column:auto !important}
.co-pay span{flex-direction:column !important;gap:6px !important;min-height:78px;padding:10px 6px !important;font-size:13px !important;line-height:1.2;white-space:normal !important}
.co-pay .pi.crypto{display:grid !important;place-items:center;font:800 20px/22px Manrope,sans-serif;color:#5b6472}
.co-pay .pi.crypto::before{content:"\20bf"}
.co-pay input:checked+span .pi.crypto{color:var(--red)}

/* v225: no red focus ring (red = error only); "Уточнить адрес у получателя" is hidden when the customer receives the order and fills the field in dark text */
.co-card input:focus,.co-card textarea:focus,.co-card select:focus,.co-tf:has(input:focus){box-shadow:none !important;outline:0 !important}
.co-card input:not([type=checkbox]):not([type=radio]):focus,.co-card textarea:focus,.co-card select:focus{background:#ece6e4 !important}
.co-chk input:focus,.co-chk input:focus-visible{outline:0 !important;box-shadow:none !important}
.co-card input.bad,.co-card textarea.bad,.co-card select.bad,.co-tf:has(input.bad){box-shadow:0 0 0 2px var(--red) !important}
.co.is-me label.co-chk.co-addr-i{display:none !important}
.co-card textarea:disabled{color:var(--ink) !important;-webkit-text-fill-color:var(--ink);opacity:1}

/* v226: "согласовать с получателем" is a checkbox under the delivery time (3 tiles remain); date and time have their own labels */
.co-types[hidden],.co-dd[hidden],.co-th[hidden],.co-agm[hidden]{display:none !important}
.co-types .t{min-height:72px !important}
.co.is-pick .co-dd,.co.is-pick .co-agc,.co.is-pick .co-th,.co.is-pick .co-agm,.co.is-pick .co-types{display:none !important}
.co-dl,.co-th{margin:2px 0 -2px}
.co-agc{margin-top:4px}

/* v227: no "Когда доставить" title; "Дата доставки" and "Время доставки" are bold headings; the "согласовать" checkbox sits right under "Время доставки" and is hidden for "Я сам получу заказ" */
.co-dh{display:none !important}
.co-dl,.co-th{color:var(--ink) !important;font-size:16px !important;font-weight:800 !important;margin:0 !important}
.co-th{margin-top:8px !important}
.co.is-me .co-agc{display:none !important}
.co-agc{margin:0 !important}
.co-agm{margin:0}

/* v228: payment tiles: only SBP has a logo (logo and name in one line); card and crypto are plain two-line text; tiles are low */
.co-pay span{min-height:56px !important;padding:8px 6px !important;gap:8px !important}
.co-pay label:first-child span{flex-direction:row !important}

/* v229: in a short window the promo field keeps its size (it was squeezed to a thin bar); the scrolling part of the summary is the order list area */
.co-top{grid-auto-rows:max-content}
.co-top>*{flex:none;min-height:0}
.co-top .co-promo{min-height:46px !important;flex:none}
.co-top .co-promo input{height:46px !important;min-height:46px !important}

/* v230: address is one line (grows only if the text is long); "Другая дата" accepts the day after tomorrow or later and keeps the chosen date when switching to today/tomorrow */
.co-addrc textarea[name=addr]{height:46px;min-height:46px;resize:none;overflow:hidden;padding:13px 14px;line-height:20px;box-sizing:border-box}

/* v231: the promo field is pinned with the totals (always fully visible); only the order list scrolls; slightly tighter bottom block */
.co-bot{gap:8px !important}
.co-right .co-go{height:46px !important}
.co-right .co-chat{height:40px !important}

/* v233: captions next to the time controls; no thumbnails in the summary; totals = delivery (only for delivery) + "Итого к оплате"; short time fields; neat select arrow; more air in the payment block */
.co-items .th{display:none !important}
.co-items li{gap:8px}
.co-items .nm{font-size:14px}
.co-rows>div:first-child{display:none !important}
.co.is-pick .co-rows>div:nth-child(2){display:none !important}
.co-dd .co-desc{margin-top:2px}
.co-tf{max-width:230px !important}
.co-card select{-webkit-appearance:none !important;appearance:none !important;padding-right:40px !important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237b7172' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-position:right 12px center !important;background-size:18px !important}
.co-ptime select{max-width:230px}
.co-bot{gap:12px !important}
.co-bot .co-lab{margin-top:2px}
.co-bot .co-pn{margin-bottom:2px}
.co-bot .co-consent{margin:4px 0 2px}

/* v234: time field is short ("Выберите время") with its note on the right; interval note is just "Бесплатно от 3 000 ₽"; phone: the order summary gets real spacing */
.co-trow{display:flex;align-items:center;gap:12px}
.co-trow .co-tf{flex:0 0 170px;width:170px;max-width:170px !important}
.co-cap{color:#7b7172;font-size:14px;line-height:1.3}
.co-desc[hidden]{display:none !important}
@media(max-width:1023px){
 .co-top,.co-bot{display:grid !important;gap:14px !important}
 .co-bot{padding-top:14px !important;margin-top:4px}
 .co-bot .co-rows{gap:8px}
 .co-bot .co-pay{margin-top:-4px}
 .co-bot .co-consent{margin:6px 0 2px !important}
 .co-bot .co-chat{display:flex !important;width:100% !important;box-sizing:border-box;justify-content:center;height:46px !important}
 .co-top .co-items{gap:12px}
}

/* v236: own time picker (hours | minutes) limited to the right range: daytime 09:00-21:00 for exact time, night 21:01-08:59 for night delivery */
.co-trow{position:relative}
.co-tp{position:absolute;left:0;top:calc(100% + 6px);z-index:30;display:flex;width:176px;max-height:228px;background:#fff;border-radius:var(--r);box-shadow:0 8px 28px rgba(40,20,25,.22)}
.co-tp[hidden]{display:none !important}
.co-tc{flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:4px;display:grid;align-content:start;gap:2px}
.co-tc+.co-tc{border-left:1px solid var(--line)}
.co-tc button{height:36px;border:0;border-radius:var(--r);background:transparent;font:inherit;font-size:15px;font-weight:600;color:var(--ink);cursor:pointer}
.co-tc button.on{background:var(--red);color:#fff}
.co-tc button:disabled{opacity:.3;cursor:default}
.co-th2{padding:12px 4px;color:#a59b9d;font-size:13px;text-align:center}
.co-tf{outline:0}

/* v237: delivery tiles are narrower (titles wrap into two lines) and the chosen tile is a solid red fill like the date pills */
.co-types{justify-content:flex-start !important}
.co-types>label{flex:0 0 112px !important}
.co-types .t{min-height:84px !important;padding:12px 8px 10px !important;text-align:center}
.co-types .t b{font-size:13px !important;line-height:1.25;max-width:92px;margin:0 auto}
.co-types input:checked+.t{background:var(--red) !important;box-shadow:none !important}
.co-types input:checked+.t,.co-types input:checked+.t *{color:#fff !important}
@media(max-width:700px){.co-types>label{flex:1 1 0 !important}.co-types .t b{font-size:12px !important;max-width:none}}

/* v238: same pattern for every option: grey caption on top ("Выберите интервал" / "Выберите время"), then the control; time field is short with a 00:00 template, note on the right; the "as soon as possible" checkbox sits below */
.co-trow .co-tf{flex:0 0 118px !important;width:118px !important;max-width:118px !important}
.co-tf .v:not(.has){color:#b7adaf;font-style:italic}
.co-xt,.co-night{gap:6px !important}
.co-dd .co-chk.co-xm{margin:6px 0 0}

/* v239: required fields have a red asterisk (customer phone, recipient phone, address unless "уточнить у получателя", time when a time option is chosen, pickup time); name is optional; "Доставить анонимно" hides the name. Time field shows the usual ––:–– template without an icon */
.req{color:var(--red);font-weight:800}
.co.addr-un .req-a{display:none}
.co-nm[hidden]{display:none !important}
.co-trow .co-tf{flex:0 0 104px !important;width:104px !important;max-width:104px !important;justify-content:center}
.co-tf .v{letter-spacing:.04em}

/* v240: time field has the same height as the interval buttons (42px) and the block under the tiles keeps one height when switching */
.co-trow .co-tf{height:42px !important}
.co-dd{min-height:108px}

/* v241: standard (native) time input under the short face: the iPhone wheel / the usual ––:–– field; value outside the allowed range is rejected with a hint; asterisk stays on the label line */
.co-tf input[type=time]{position:absolute !important;inset:0;width:100% !important;height:100% !important;opacity:0;padding:0 !important;cursor:pointer;-webkit-appearance:none;appearance:none}
.co-tf{position:relative;cursor:pointer}
.lt{display:block}

/* v241: the block under the tiles is top-aligned (the night block no longer spreads over the fixed height) */
.co-dd{align-content:start !important}
.co-night,.co-xt{align-content:start}

/* v242: «Доставить анонимно» only when delivering to another person; for pickup only SBP and bank card; comment placeholder is just «Пожелания к заказу» */
.co.is-pick .co-anon,.co.is-me .co-anon{display:none !important}
.co.is-pick .co-pay label:nth-child(3){display:none !important}
.co.is-pick .co-pay{grid-template-columns:repeat(2,minmax(0,1fr)) !important}

/* v244: phone: no fixed bottom bar, the «Оформить заказ» button is the last block of the form; time outside the allowed range snaps to the nearest allowed time instead of an error */
@media(max-width:1023px){
 .co-foot{display:none !important}
 .co-bot .co-go{display:block !important;width:100%;height:50px;margin-top:2px}
}

/* v245: own iOS-style wheel for the time: only allowed hours and minutes exist in it (day 09:00–21:00, night 21:01–08:59), «Готово» confirms */
.co-wp{position:fixed;inset:0;z-index:300;display:none;align-items:flex-end;justify-content:center;background:rgba(30,18,22,.42)}
.co-wp.on{display:flex}
.co-wpc{width:min(100%,420px);background:#fff;border-radius:var(--r) var(--r) 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom));box-sizing:border-box}
@media(min-width:700px){.co-wp{align-items:center}.co-wpc{border-radius:var(--r);padding-bottom:16px}}
.co-wpt{display:flex;color:#8b8284;font-size:13px;font-weight:600;text-align:center}
.co-wpt span{flex:1}
.co-wh{position:relative;display:flex;height:200px;margin:6px 0 14px}
.co-wh::before{content:"";position:absolute;left:0;right:0;top:80px;height:40px;border-radius:var(--r);background:#f3efed}
.co-wc{position:relative;flex:1;overflow-y:scroll;scroll-snap-type:y mandatory;padding:80px 0;scrollbar-width:none;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;text-align:center;-webkit-mask-image:linear-gradient(transparent,#000 30%,#000 70%,transparent);mask-image:linear-gradient(transparent,#000 30%,#000 70%,transparent)}
.co-wc::-webkit-scrollbar{display:none}
.co-wc div{height:40px;line-height:40px;scroll-snap-align:center;font-size:22px;font-weight:600;color:#b9afb1;cursor:pointer}
.co-wc div.on{color:var(--ink)}
.co-wpd{width:100%;height:48px;border:0;border-radius:var(--r);background:var(--red);color:#fff;font:inherit;font-size:16px;font-weight:700;cursor:pointer}
.co-tf .v{color:#b7adaf}
.co-tf .v.has{color:var(--ink)}

/* v246: when «Как можно скорее» is on, the block under the tiles shrinks (no empty gap) */
.co-dd.is-asap{min-height:0 !important}

/* v248: «Как можно скорее | Выбрать время» switch under the date (today only); tiles: «К точному времени» with ±10 минут and the price from 490 ₽, hints under the titles */
.co-when[hidden],.co-asapnote[hidden]{display:none !important}
.co.is-asapw .co-th,.co.is-asapw .co-agc,.co.is-asapw .co-agm,.co.is-asapw .co-types,.co.is-asapw .co-dd{display:none !important}
.co.is-pick .co-when,.co.is-pick .co-asapnote{display:none !important}
.co-types .t i{display:block !important;font-size:12px;line-height:1.2;font-style:normal;opacity:.8;margin:0 auto;max-width:92px}
.co-types .t{min-height:104px !important;justify-content:space-between !important}
@media(max-width:700px){.co-types .t i{max-width:none;font-size:11px}}

/* v249: shorter delivery tiles; «Выбрать время» on the left, «Как можно скорее» with a yellow bolt on the right; the night-tariff note with an asterisk sits right of the time field */
.co-types .t{min-height:0 !important;padding:10px 8px !important;gap:3px !important;justify-content:center !important}
.co-types .t em{margin-top:2px !important}
.co-when span{display:inline-flex !important;align-items:center;justify-content:center;gap:7px}
.co-when .zap{flex:none;width:18px;height:18px;fill:#ffb400;stroke:none;filter:drop-shadow(0 0 .5px rgba(0,0,0,.35))}
.co-cap{max-width:190px}
.co-dd{min-height:96px}

/* v249: the two switch pills share one row */
.co-when{flex-wrap:nowrap !important}
.co-when label{flex:1 1 0;min-width:0}
.co-when span{padding:0 8px !important;font-size:14px !important;white-space:nowrap}

.co-when span{display:flex !important;width:100%;box-sizing:border-box}
.co-when{gap:6px}

/* v250: one three-option switch for the delivery time: «Выбрать время» | «⚡ Как можно скорее» | «Согласовать с получателем» (the last only for another recipient) */
.co-when{flex-wrap:wrap !important;gap:6px !important}
.co-when label{flex:1 1 calc(50% - 3px) !important;min-width:0}
.co-when label:nth-child(3){flex-basis:100% !important}
.co-when.no-asap label{flex-basis:100% !important}
.co-when label[hidden]{display:none !important}
.co.is-asapw .co-th{display:block !important}
.co.is-asapw .co-types,.co.is-asapw .co-dd{display:none !important}

/* v251: date and time-of-delivery are switches like «Доставка | Самовывоз»: one container, a red thumb slides between the options, long names wrap to two lines inside one row */
.co-seg.co-sw{position:relative;display:grid !important;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:0 !important;padding:4px;border-radius:var(--r);background:#f3efed}
.co-seg.co-sw::before{content:"";position:absolute;top:4px;bottom:4px;left:4px;width:calc((100% - 8px)/var(--n,3));border-radius:var(--r);background:var(--red);transform:translateX(calc(var(--i,0)*100%));transition:transform .28s cubic-bezier(.22,.8,.3,1)}
.co-seg.co-sw label{position:relative;z-index:1;min-width:0;flex:none !important}
.co-seg.co-sw label[hidden]{display:none !important}
.co-seg.co-sw span{display:flex !important;align-items:center;justify-content:center;gap:5px;width:100%;box-sizing:border-box;min-height:46px !important;padding:0 6px !important;border-radius:var(--r);background:transparent !important;box-shadow:none !important;color:var(--ink);font-size:14px !important;line-height:1.15;text-align:center;white-space:normal !important}
.co-seg.co-sw input:checked+span{background:transparent !important;color:#fff !important;box-shadow:none !important}
.co-sw .zap{width:16px;height:16px}

/* v251: text a little smaller so each option takes at most two lines */
.co-seg.co-sw span{font-size:13px !important;padding:0 3px !important;gap:4px}
.co-sw .zap{width:14px;height:14px}

/* v252: every option of the time switch has two lines («Выбрать / время», «Как можно / скорее», «Уточнить / у получателя»); the bolt has the text colour; the note with an asterisk keeps its text aligned when wrapped */
.co-sw .zap{width:16px;height:16px;fill:currentColor !important;filter:none !important}
.co-seg.co-sw span{text-align:center}
.co-cap{display:flex;gap:4px;align-items:flex-start}
.co-cap b{flex:none;font-weight:700}

/* v254: when the customer receives the order himself (or pickup) the crypto/PayPal method is not offered: only SBP and bank card */
.co.is-me .co-pay label:nth-child(3){display:none !important}
.co.is-me .co-pay{grid-template-columns:repeat(2,minmax(0,1fr)) !important}

/* v255: «Срочно» with the bolt next to the word and a grey «40–60 минут» line; interval tile shows 0 ₽ instead of «Бесплатно»; the date switch is lower */
.co-seg.co-sw .sw-z{flex-direction:column;gap:2px}
.sw-z b{display:inline-flex;align-items:center;gap:4px;font-weight:inherit}
.sw-z small{font-size:11px;font-weight:500;color:#8b8284}
.co-seg.co-sw input:checked+.sw-z small{color:rgba(255,255,255,.82)}
.co-days span{min-height:38px !important}

.co-seg.co-sw.co-days span{min-height:36px !important}

/* v256: tariff note next to the time field: two short aligned rows with a thin line on the left */
.co-cap{max-width:none !important;padding-left:10px;border-left:1px solid #d9d0d1;align-items:center;font-size:13px;color:#7b7172}
.co-tar{display:grid;gap:3px}
.co-tar i{display:flex;justify-content:space-between;gap:14px;font-style:normal;white-space:nowrap}
.co-tar em{font-style:normal;font-weight:700;color:var(--ink)}

/* v257: a switch with a single option is hidden; the tariff note has no line and no asterisk */
.co-seg.co-sw[hidden]{display:none !important}
.co-cap{padding-left:0 !important;border-left:0 !important}

/* v259: the tariff note next to the time field is plain words in one pale grey italic */
.co-cap{color:#a39a9c !important;font-style:italic;font-weight:400;font-size:13px;line-height:1.35}
.co-tar{display:grid;gap:2px}
.co-tar i{display:block !important;font-style:italic !important;font-weight:400 !important;color:inherit !important;white-space:nowrap}

/* v260: phone search like PIONFLO: lupa opens an overlay with a field and live results (photo, name, price); tapping a result opens the product card, no search page */
.sx{position:fixed;left:0;right:0;top:0;height:100dvh;z-index:400;display:none;background:rgba(40,24,30,.46);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.sx.on{display:block}
.sx-box{position:absolute;left:10px;right:10px;top:calc(env(safe-area-inset-top,0px) + 10px)}
.sx-bar{display:flex;align-items:center;gap:8px;padding:5px;border-radius:999px;background:#fff;box-shadow:0 8px 28px rgba(40,20,25,.22)}
.sx-back,.sx-go{flex:none;width:42px;height:42px;border:0;border-radius:50%;background:#fdeff2;color:var(--red);display:grid;place-items:center;padding:0;cursor:pointer}
.sx-back svg,.sx-go svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sx-in{flex:1;min-width:0;border:0;outline:0;background:transparent;font:inherit;font-size:16px;color:var(--ink,#282424);-webkit-appearance:none;appearance:none}
.sx-in::-webkit-search-cancel-button{display:none}
.sx-list{margin-top:8px;max-height:calc(var(--sxh,100dvh) - 100px);overflow-y:auto;overscroll-behavior:contain;background:#fff;border-radius:var(--r);box-shadow:0 8px 28px rgba(40,20,25,.18)}
.sx-lab{padding:14px 18px 4px;color:#8b8284;font-size:13px;font-weight:600}
.sx-item{display:flex;align-items:center;gap:12px;padding:10px 16px;cursor:pointer;border-bottom:1px solid #f3eeec}
.sx-item:last-child{border-bottom:0}
.sx-item:active{background:#faf6f4}
.sx-th{flex:none;width:48px;height:48px;border-radius:50%;background:#f1edeb center/cover no-repeat}
.sx-nm{flex:1;min-width:0;font-size:15px;line-height:1.25;color:var(--ink,#282424)}
.sx-nm b{font-weight:800}
.sx-pr{flex:none;font-size:14px;font-weight:800;white-space:nowrap}
.sx-empty{padding:20px 18px;color:#7b7172;font-size:15px}
@media(min-width:1024px){.sx{display:none !important}}

/* v261: search field = lupa inside on the left, one cross on the right that collapses the search; results appear while typing */
.sx-ic{flex:none;width:34px;height:42px;display:grid;place-items:center;padding-left:8px;color:#8b8284}
.sx-ic svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.sx-x{flex:none;width:42px;height:42px;border:0;border-radius:50%;background:#f3efed;color:#5b5254;display:grid;place-items:center;padding:0;cursor:pointer}
.sx-x svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}

/* v263: the drawer city is a roomy row with a small «Ваш город» caption and more air around it */
.city-button.menu-city{min-height:58px;margin:18px 0 26px !important;padding:10px 16px !important;border-radius:var(--r)}
.city-button.menu-city span{display:flex;flex-direction:column;align-items:flex-start;line-height:1.25;text-align:left}
.city-button.menu-city span::before{content:"Ваш город";font-size:12px;font-weight:600;color:#8b8284}

/* v264: contacts in the phone menu sit on the white background (no grey box), aligned with the menu items */
.menu-drawer .menu-contacts{padding:0 !important;background:transparent !important;border-radius:0 !important;gap:14px}

/* v265: the city moved to the bottom of the phone menu, above the contacts: plain row «Казань ⌄» under a small «ГОРОД» heading */
.menu-drawer .city-button.menu-city{width:100%;min-height:0;margin:0 !important;padding:12px 0 !important;border-radius:0;background:transparent !important;justify-content:space-between;font-size:18px;font-weight:600}
.menu-drawer .city-button.menu-city span{display:block;line-height:1.2}
.menu-drawer .city-button.menu-city span::before{content:none !important}
.menu-group--city{margin-top:8px}

.menu-drawer .city-button.menu-city{text-align:left}
.menu-drawer .city-button.menu-city span{flex:1;text-align:left}
.menu-group--city{margin-top:24px !important}
.menu-drawer .menu-slogan{margin-bottom:22px !important}

.menu-drawer .menu-group--city{display:block}
.menu-drawer .menu-group--city .city-button.menu-city{display:flex;width:100% !important;box-sizing:border-box;align-self:stretch}
.menu-drawer .menu-rating{margin-bottom:6px}

/* v266: phone menu is tighter: smaller gaps between the catalog items; the city is a short «Казань ⌄» (chevron right next to the name) placed right above the contacts */
.menu-drawer .menu-group a{padding:9px 0 !important}
.menu-drawer .menu-slogan{margin-bottom:14px !important}
.menu-drawer nav.menu-group:not(.menu-group--contacts):not(.menu-group--city){margin-bottom:16px !important}
.menu-drawer .menu-group--city{margin:22px 0 0 !important}
.menu-drawer .menu-group--city small{margin-bottom:0}
.menu-drawer .menu-group--city .city-button.menu-city{width:auto !important;justify-content:flex-start;gap:4px;padding:6px 0 !important;align-self:flex-start}
.menu-drawer .menu-group--city .city-button.menu-city span{flex:none}
.menu-drawer .menu-group--contacts{margin-top:10px !important}
.menu-drawer .menu-group--contacts small{margin:4px 0 6px}
.menu-drawer .menu-contacts{gap:10px}

.menu-drawer .menu-group--city .city-button.menu-city{display:inline-flex !important;margin:0 !important;float:none;text-align:left}
.menu-drawer .menu-group--city .city-button.menu-city::after{margin-left:0 !important}

.menu-drawer .menu-group--city small{display:block;margin-bottom:2px}

/* v267: phone menu order: logo + slogan, then the ratings, then Каталог, Покупателям, Город, Контакты */
.menu-drawer .menu-rating{margin:2px 0 18px !important}
.menu-drawer .menu-slogan{margin-bottom:12px !important}
.menu-drawer nav.menu-group:not(.menu-group--contacts):not(.menu-group--city){margin-bottom:14px !important}

/* v268: more air in the phone menu: the ratings sit in the middle between the logo block and «Каталог» with equal space above and below; more room between groups and items */
.menu-drawer .menu-slogan{margin-bottom:0 !important}
.menu-drawer .menu-rating{margin:24px 0 24px !important}
.menu-drawer .menu-group a{padding:11px 0 !important}
.menu-drawer nav.menu-group:not(.menu-group--contacts):not(.menu-group--city){margin-bottom:24px !important}
.menu-drawer .menu-group--city{margin-top:6px !important}
.menu-drawer .menu-group--contacts{margin-top:22px !important}
.menu-drawer .menu-group small{margin-bottom:6px}
.menu-drawer .menu-contacts{gap:12px}

/* v269: the ratings row is smaller and about as wide as the logo; more air above and below it */
.menu-drawer .menu-rating{zoom:.78;margin:34px 0 34px !important}

/* v270: city picker: the city row has a pin and looks tappable; it opens a small bottom sheet with the cities and a check mark */
.menu-drawer .menu-group--city .city-button.menu-city{gap:8px;padding:8px 0 !important}
.menu-drawer .menu-group--city .city-button.menu-city svg{display:block !important;width:20px;height:20px;color:var(--red);fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cy{position:fixed;inset:0;z-index:520;display:none;align-items:flex-end;justify-content:center;background:rgba(40,24,30,.46)}
.cy.on{display:flex}
.cy-box{width:min(100%,460px);background:#fff;border-radius:var(--r) var(--r) 0 0;padding:18px 18px calc(18px + env(safe-area-inset-bottom,0px));box-sizing:border-box;transform:translateY(100%);transition:transform .28s cubic-bezier(.22,.8,.3,1)}
.cy.on .cy-box{transform:none}
@media(min-width:700px){.cy{align-items:center}.cy-box{border-radius:var(--r);padding-bottom:18px}}
.cy-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.cy-h b{font-size:20px;font-weight:800}
.cy-x{width:36px;height:36px;border:0;border-radius:var(--r);background:#f3efed;display:grid;place-items:center;padding:0;cursor:pointer}
.cy-x svg{width:18px;height:18px;fill:none;stroke:var(--ink,#282424);stroke-width:2;stroke-linecap:round}
.cy-i{display:flex;align-items:center;justify-content:space-between;width:100%;padding:16px 4px;border:0;border-bottom:1px solid #f1ebe9;background:none;font:inherit;font-size:18px;font-weight:600;color:var(--ink,#282424);text-align:left;cursor:pointer}
.cy-i:last-of-type{border-bottom:0}
.cy-i svg{width:22px;height:22px;fill:none;stroke:var(--red);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;visibility:hidden}
.cy-i.on svg{visibility:visible}
.cy-n{margin:8px 4px 0;color:#8b8284;font-size:13px}

/* v271: standalone product page (what a visitor sees when opening a product by its direct link): no home page behind, header, crumbs, the product card as a page, «Похожие букеты», footer; plus the «нет в наличии» variant */
html.pd-page main>section,html.pd-page main>a.telegram-promo,html.pd-page .pd-overlay,html.pd-page .tabbar,html.pd-page .pd-close{display:none !important}
html.pd-page body{overflow:auto !important}
html.pd-page .pd{position:relative !important;left:auto !important;right:auto !important;top:auto !important;bottom:auto !important;transform:none !important;visibility:visible !important;opacity:1 !important;width:auto !important;max-width:720px !important;height:auto !important;max-height:none !important;margin:0 auto !important;border-radius:0 !important;box-shadow:none !important;overflow:visible !important;pointer-events:auto !important;background:#fff}
html.pd-page .pd-body{max-height:none !important;overflow:visible !important}
html.pd-page .pd-bar{position:sticky !important;bottom:0;left:auto;right:auto;width:auto}
.pp-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:calc(env(safe-area-inset-top,0px) + 12px) 16px 10px;font-size:13px;color:#8b8284}
.pp-crumbs a{color:#8b8284;text-decoration:none;font-weight:600}
.pp-crumbs a:first-child{color:var(--ink,#282424)}
.pp-crumbs span{color:#b7adaf}
.pp-crumbs b{font-weight:600;color:var(--ink,#282424);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60vw}
.pp-oos{margin:14px 0 4px;padding:14px;border-radius:var(--r);background:#f3efed}
.pp-oos b{display:block;font-size:18px;font-weight:800;margin-bottom:4px}
.pp-oos p{margin:0 0 12px;color:#5f5557;font-size:14px;line-height:1.4}
.pp-oos div{display:flex;gap:8px;flex-wrap:wrap}
.pp-oos button{flex:1 1 150px;height:46px;border:0;border-radius:var(--r);font:inherit;font-size:15px;font-weight:700;cursor:pointer}
.pp-n{background:var(--red);color:#fff}
.pp-s{background:#fff;color:var(--ink,#282424)}
html.pd-oos .pd-price b{color:#a39a9c}
html.pd-oos .pd-bar{display:none !important}
html.pd-oos .pd-sizes,html.pd-oos .pd-alt{pointer-events:none;opacity:.55}
html.pd-oos .pd-img,html.pd-oos .pd-slide{filter:grayscale(.85);opacity:.85}
.pp-sim{padding:22px 16px 28px;background:#fff}
.pp-sim h3{margin:0 0 12px;font-size:20px;font-weight:800}
.pp-sim .pp-row{display:flex;gap:10px;overflow-x:auto;margin:0 -16px;padding:0 16px 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.pp-sim .pp-row::-webkit-scrollbar{display:none}
.pp-t{flex:0 0 150px;cursor:pointer}
.pp-t i{display:block;aspect-ratio:3/4;border-radius:var(--r);background:#f1edeb center/cover no-repeat}
.pp-t span{display:block;margin-top:8px;font-size:14px;line-height:1.25;color:var(--ink,#282424);min-height:34px}
.pp-t b{display:block;margin-top:2px;font-size:15px;font-weight:800}
@media(min-width:1024px){.pp-sim .pp-row{margin:0;padding:0;flex-wrap:wrap;overflow:visible}.pp-t{flex:0 0 calc(25% - 8px)}}

/* v271 desktop: the product page is two columns (photo | info), crumbs on top, similar below */
@media(min-width:1024px){
 html.pd-page main{display:block !important;min-height:0 !important}
 html.pd-page main .cart-panel{display:none !important}
 html.pd-page .pd{display:grid !important;grid-template-columns:minmax(0,480px) minmax(0,1fr);grid-template-rows:auto auto auto 1fr auto;column-gap:32px;max-width:1120px !important;padding:0 20px 20px;box-sizing:border-box;align-items:start}
 html.pd-page .pd>.pp-crumbs{grid-column:1/-1;grid-row:1;padding-left:0}
 html.pd-page .pd>.pd-media{grid-column:1;grid-row:2/5;position:relative;width:100% !important;height:auto !important;aspect-ratio:3/4;border-radius:var(--r);overflow:hidden}
 html.pd-page .pd>.pd-body{grid-column:2;grid-row:2;padding:0 !important}
 html.pd-page .pd>.pd-bar{grid-column:2;grid-row:3;position:sticky !important;bottom:12px;margin-top:12px;border-radius:var(--r)}
 html.pd-page .pd>.pp-sim{grid-column:1/-1;grid-row:5;padding:28px 0 8px}
 html.pd-page .pp-sim .pp-row{flex-wrap:nowrap;overflow-x:auto}
 html.pd-page .pp-t{flex:0 0 200px}
}

html.pd-page #pd{height:auto !important;min-height:0 !important;max-height:none !important;overflow:visible !important}
@media(min-width:1024px){html.pd-page #pd>.pd-body{height:auto !important;max-height:none !important;overflow:visible !important}}

/* v272: the chat sheet opens above the product page; the photo of an unavailable bouquet is not dimmed; the notice text is clearer */
html.pd-page #pd{z-index:1 !important}
html.pd-oos .pd-img,html.pd-oos .pd-slide{filter:none !important;opacity:1 !important}
html.pd-oos .pd-price b{color:inherit}
html.pd-oos .pd-sizes{pointer-events:none;opacity:1}
html.pd-oos .pd-alt{display:none !important}
html.pd-oos .pd-sizes button{cursor:default}

@media(max-width:1023px){.pp-crumbs{padding:calc(env(safe-area-inset-top,0px) + 30px) 16px 30px 70px;min-height:20px}}

/* v273: the frame around «Оформить / Заказ в чате» exists only while the bar floats over the content; when it reaches its own place it has no frame */
html.pd-page .pd-bar:not(.pp-stuck){background:transparent !important;border-top-color:transparent !important;box-shadow:none !important}
.pp-sen{height:0;overflow:hidden}
@media(min-width:1024px){html.pd-page .pd>.pp-sen{grid-column:2;grid-row:3}}

/* v274: arrows for the «Похожие букеты» row (desktop: not everyone has a trackpad) */
.pp-wrap{position:relative}
.pp-arr{display:none;position:absolute;top:calc(50% - 40px);width:44px;height:44px;border:0;border-radius:50%;background:#fff;box-shadow:0 4px 16px rgba(40,20,25,.25);place-items:center;padding:0;cursor:pointer;z-index:2}
.pp-arr svg{width:22px;height:22px;fill:none;stroke:var(--ink,#282424);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.pp-arr.l{left:-12px}.pp-arr.r{right:-12px}
.pp-arr[hidden]{display:none !important}
@media(min-width:1024px){.pp-arr{display:grid}}

/* v275: on the product page (desktop) the title starts at the level of the photo, like in the card over the home page */
@media(min-width:1024px){html.pd-page .pd>.pd-body{padding-top:22px !important}}

/* v276: catalog section page (Розы, Монобукеты...): same shell as the home page without banners; crumbs, H1, count, sorting, sub-section chips; the same grid is filtered in place */
html.cat-page .banner-carousel,html.cat-page .trust{display:none !important}
html.cat-page .catalog-title{display:none}
html.cat-page .reviews,html.cat-page .seo{display:none !important}
.cat-off{display:none !important}
.sec{display:none}
html.cat-page .sec{display:block;margin:0 0 14px}
.sec-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 10px;font-size:13px;color:#8b8284}
.sec-crumbs a{color:#8b8284;text-decoration:none;font-weight:600}
.sec-crumbs b{font-weight:600;color:var(--ink,#282424)}
.sec-crumbs span{color:#b7adaf}
.sec h1{margin:0 0 12px;font-size:28px;line-height:1.1;font-weight:800;letter-spacing:-.5px}
.sec-subs{display:flex;flex-wrap:wrap;gap:8px;max-height:88px;overflow:hidden;margin-bottom:6px}
.sec-subs.open{max-height:none}
.sec-subs a,.sec-subs button{flex:none;display:inline-flex;align-items:center;height:38px;padding:0 14px;border:0;border-radius:var(--r);background:#f3efed;color:var(--ink,#282424);font:inherit;font-size:14px;font-weight:600;text-decoration:none;white-space:nowrap;cursor:pointer}
.sec-subs a.on{background:var(--red);color:#fff}
.sec-subs button{background:#fff;box-shadow:inset 0 0 0 1.5px #e5dcd9;color:#7b7172}
.sec-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0 0}
.sec-count{color:#7b7172;font-size:14px}
.sec-sort{position:relative;display:flex;align-items:center;gap:6px;height:38px;padding:0 12px 0 14px;border-radius:var(--r);background:#f3efed;font-size:14px;font-weight:600}
.sec-sort select{position:absolute;inset:0;width:100%;height:100%;opacity:0;font-size:16px;cursor:pointer}
.sec-sort svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.sec-empty{display:none;padding:34px 0 20px;color:#7b7172;font-size:15px;text-align:center}
.link-row--categories a.is-cur{color:var(--red)}
@media(max-width:1023px){html.cat-page main{padding-top:66px}html.cat-page .sec{padding-top:0}}
html.cat-gifts .up-hold{display:contents}

/* v277: sub-sections are one row you scroll sideways (arrows on desktop); sorting has a caption */
.sec-sw{position:relative}
.sec-subs,.sec-subs.open{flex-wrap:nowrap !important;max-height:none !important;overflow-x:auto !important;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin:0 -20px 6px;padding:0 20px}
.sec-subs::-webkit-scrollbar{display:none}
.sec-sw .sec-arr{display:none;position:absolute;top:0;width:38px;height:38px;border:0;border-radius:50%;background:#fff;box-shadow:0 4px 14px rgba(40,20,25,.25);place-items:center;padding:0;cursor:pointer;z-index:2}
.sec-sw .sec-arr svg{width:20px;height:20px;fill:none;stroke:var(--ink,#282424);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.sec-sw .sec-arr.l{left:0}.sec-sw .sec-arr.r{right:0}
.sec-sw .sec-arr[hidden]{display:none !important}
@media(min-width:1024px){.sec-sw .sec-arr{display:grid}.sec-subs{margin:0 0 6px;padding:0}}
.sec-sl{color:#7b7172;font-weight:500}

/* v278: information pages (delivery, warranty, about, contacts, privacy, offer, consent, cookies) and the 404 page in the shop template; SEO text block at the bottom of catalog sections */
html.info-page main>section,html.info-page main>a.telegram-promo,html.info-page .tabbar-hide{display:none !important}
.ip{display:none}
html.info-page .ip{display:block;max-width:820px;margin:0 auto;padding:0 20px 56px;box-sizing:border-box;min-height:50vh}
html.info-page .ip .pp-crumbs{padding:calc(env(safe-area-inset-top,0px) + 14px) 0 10px}
html.info-page .ip h1{margin:6px 0 18px;font-size:30px;line-height:1.12;font-weight:800;letter-spacing:-.6px}
.ip-body{font-size:16px;line-height:1.6;color:#3a3436}
.ip-body p{margin:0 0 12px}
.ip-body p:empty{display:none}
.ip-body h2,.ip-body h3{margin:22px 0 8px;font-size:20px;line-height:1.25;font-weight:800;color:var(--ink,#282424)}
.ip-body ul,.ip-body ol{margin:0 0 14px;padding-left:22px}
.ip-body li{margin:0 0 6px}
.ip-body strong,.ip-body b{color:var(--ink,#282424)}
.ip-body table{border-collapse:collapse;width:100%;margin:0 0 14px}
.ip-body td,.ip-body th{padding:8px 10px;border:1px solid #ece6e3;font-size:15px;vertical-align:top}
@media(max-width:1023px){html.info-page main{padding-top:66px}html.info-page .ip{padding-bottom:110px}html.info-page .ip h1{font-size:26px}}
.ip-cards{display:grid;gap:12px;margin:0 0 20px}
@media(min-width:700px){.ip-cards{grid-template-columns:1fr 1fr}}
.ip-card{padding:16px 18px;border-radius:var(--r);background:#f3efed}
.ip-card small{display:block;margin-bottom:4px;color:#8b8284;font-size:13px;font-weight:600}
.ip-card b,.ip-card a{font-size:18px;font-weight:800;color:var(--ink,#282424);text-decoration:none}
.ip-card p{margin:2px 0 0;font-size:15px;color:#5f5557}
.ip-btns{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 24px}
.ip-btns a{display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 22px;border-radius:var(--r);background:var(--red);color:#fff;font-weight:700;font-size:15px;text-decoration:none}
.ip-btns a.alt{background:#f3efed;color:var(--ink,#282424)}
.ip-404{padding:30px 0 10px;text-align:center}
.ip-404 .n{font-size:96px;line-height:1;font-weight:800;letter-spacing:-3px;color:var(--red)}
.ip-404 h1{margin:8px 0 10px}
.ip-404 p{margin:0 auto 22px;max-width:420px;color:#5f5557;font-size:16px}
.ip-404 .ip-btns{justify-content:center}
.sec-seo{display:none;margin:34px 0 0;padding-top:26px;border-top:1px solid #ece6e3;max-width:900px}
html.cat-page .sec-seo{display:block}
.sec-seo .ip-body h2{margin-top:0}
.sec-seo.fold .ip-body{max-height:150px;overflow:hidden;-webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}
.sec-seo .more{display:none;margin-top:10px;height:42px;padding:0 18px;border:0;border-radius:var(--r);background:#f3efed;font:inherit;font-size:15px;font-weight:700;cursor:pointer}
@media(max-width:1023px){.sec-seo.fold .more{display:inline-flex;align-items:center}}



/* v279: the information page sits in the same grid column as the home content (no empty gap under the header on desktop); the SEO text is folded on desktop too */
@media(min-width:1200px){main>.ip{grid-column:1;grid-row:1 / span 7}}
html.info-page .ip{margin:0;max-width:none;width:100%}
html.info-page .ip>*{max-width:820px}
.sec-seo.fold .more{display:inline-flex !important;align-items:center}
.sec-seo.fold .ip-body{max-height:150px}
@media(min-width:1024px){html.info-page .ip .pp-crumbs{padding-top:26px}}

/* v280: no big gap between the end of an information page and the footer on the phone */
@media(max-width:1023px){html.info-page .ip{min-height:0;padding-bottom:0}html.info-page footer.footer{margin-top:28px}}

/* v281: phone top bar on inner pages (menu, logo, search); information pages open as a bottom sheet from links (with a real address); a direct link shows the full page */
.mtop{display:none}
@media(max-width:1023px){
 html.cat-page .mtop,html.info-page .mtop,html.pd-page .mtop{display:flex}
 html.cat-page body,html.info-page body,html.pd-page body{padding-top:calc(56px + env(safe-area-inset-top,0px))}
 html.cat-page .site-header,html.info-page .site-header,html.pd-page .site-header{display:none !important}
 html.cat-page main,html.info-page main{padding-top:0 !important}
 html.cat-page .sec{padding-top:0}
 html.pd-page .pp-crumbs{padding:12px 16px 10px !important}
 html.info-page .ip .pp-crumbs{padding-top:14px}
}
.mtop{position:fixed;left:0;right:0;top:0;z-index:70;align-items:center;justify-content:space-between;gap:10px;height:calc(56px + env(safe-area-inset-top,0px));padding:env(safe-area-inset-top,0px) 12px 0;box-sizing:border-box;background:rgba(255,255,255,.96);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid #f0e9e6}
.mtop button{flex:none;width:42px;height:42px;border:0;border-radius:var(--r);background:#f3efed;color:var(--ink,#282424);display:grid;place-items:center;padding:0;cursor:pointer}
.mtop button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.mtop .mt-logo{display:block;height:36px}
.mtop .mt-logo img{display:block;height:36px;width:auto;border-radius:var(--r)}
.is-ov{position:fixed;inset:0;z-index:500;background:rgba(30,18,22,.46);opacity:0;visibility:hidden;transition:opacity .25s}
.is{position:fixed;left:0;right:0;bottom:0;z-index:501;max-width:760px;margin:0 auto;max-height:92dvh;display:flex;flex-direction:column;background:#fff;border-radius:var(--r) var(--r) 0 0;transform:translateY(102%);visibility:hidden;transition:transform .3s cubic-bezier(.22,.8,.3,1)}
html.is-open .is-ov{opacity:1;visibility:visible}
html.is-open .is{transform:none;visibility:visible}
html.is-open body{overflow:hidden}
.is-h{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:20px 20px 8px}
.is-h h2{margin:0;font-size:24px;line-height:1.15;font-weight:800;letter-spacing:-.4px}
.is-x{flex:none;width:40px;height:40px;border:0;border-radius:var(--r);background:#f3efed;display:grid;place-items:center;padding:0;cursor:pointer}
.is-x svg{width:18px;height:18px;fill:none;stroke:var(--ink,#282424);stroke-width:2.2;stroke-linecap:round}
.is-b{overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:6px 20px calc(24px + env(safe-area-inset-bottom,0px))}
@media(min-width:1024px){.is{top:50%;bottom:auto;left:50%;right:auto;width:min(760px,calc(100% - 40px));max-height:86vh;border-radius:var(--r);transform:translate(-50%,-46%);opacity:0}html.is-open .is{transform:translate(-50%,-50%);opacity:1}}

.ip-card .ip-btns a{height:42px;padding:0 16px;font-size:15px;font-weight:700;color:#fff}
.ip-card .ip-btns a.alt{color:var(--ink,#282424);background:#fff}

/* v283: messenger buttons share one style; thin Telegram strip above the top bar on catalog sections (closable); swipe-down closes the information and city sheets; promo hint in the order window */
.mtop{flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;height:auto !important;padding:0 !important}
.mtop .mt-row{display:flex;align-items:center;justify-content:space-between;gap:10px;height:56px;padding:0 12px;margin-top:env(safe-area-inset-top,0px)}
.mt-tg{display:none;position:relative;align-items:center;justify-content:center;height:30px;padding:env(safe-area-inset-top,0px) 36px 0;box-sizing:content-box;background:var(--red);color:#fff;font-size:13px;font-weight:700;text-decoration:none;text-align:center}
.mt-tg span{display:block;white-space:nowrap}
.mt-tg .mt-tgx{position:absolute;right:4px;top:calc(env(safe-area-inset-top,0px) + 1px);width:28px;height:28px;border:0;border-radius:var(--r);background:transparent;color:#fff;font-size:20px;line-height:1;font-weight:400;display:grid;place-items:center;padding:0}
@media(max-width:1023px){
 html.cat-page:not(.tg-off):not(.tg-sec-off) .mt-tg{display:flex}
 html.cat-page:not(.tg-off):not(.tg-sec-off) .mtop .mt-row{margin-top:0}
 html.cat-page body,html.info-page body,html.pd-page body{padding-top:var(--mtop-h,56px)}
 html.cat-page .telegram-promo{display:none !important}
}
html.cat-page .telegram-promo{display:none !important}
.co-tgp{display:inline-flex;align-items:center;gap:6px;margin:2px 0 0;color:#b5374e;font-size:13px;font-weight:600;text-decoration:none}
.co-tgp:hover{text-decoration:underline}

/* v284: delivery type tiles are wide: title in one line, then a thin hint line, then the price; the urgent note has two lines */
.co-types{flex-wrap:nowrap !important}
.co-types>label{flex:1 1 0 !important;min-width:0 !important}
.co-types .t b{max-width:none !important;white-space:nowrap;font-size:14px !important}
.co-types .t i{max-width:none !important;white-space:nowrap;font-size:13px !important;font-weight:400 !important;letter-spacing:0}
.co-types .t{min-height:0 !important;padding:12px 10px 11px !important;gap:4px !important}
.co-types .t em{font-size:15px !important;font-weight:800;margin-top:2px !important}
.co-asapnote{white-space:pre-line}
@media(max-width:700px){.co-types .t b{font-size:13px !important}.co-types .t i{font-size:11px !important}}

/* v285: phone: «Все букеты» lives only in the menu (Каталог); the category row with the search icon belongs to the home page only, sections have the top bar instead */
@media(max-width:1023px){
 .category-links a[data-route="/catalog/bukety/"]{display:none !important}
 html.cat-page .catalog-navigation,html.info-page .catalog-navigation,html.pd-page .catalog-navigation{display:none !important}
}

/* v286: the category row (with the search icon) is for the home page only, on every screen size */
html.cat-page .catalog-navigation,html.info-page .catalog-navigation,html.pd-page .catalog-navigation{display:none !important}

/* v288: sorting is plain text with a chevron (no block): «Сортировка: Популярные ⌄»; three options: Популярные / Сначала дешёвые / Сначала дорогие */
.sec-sort{height:auto !important;padding:6px 0 6px 10px !important;border-radius:0 !important;background:transparent !important;gap:4px !important;font-size:14px;font-weight:600}
.sec-sort .sec-sl{color:#9a9092;font-weight:500}
.sec-sort .sec-sv{color:var(--ink,#282424)}
.sec-sort svg{width:15px;height:15px;stroke:#7b7172;stroke-width:2}

/* v289: the Telegram discount is a red strip at the very top of the phone home page too (instead of the big red button), a little taller, with the plane icon; closable */
.hbar,.mt-tg{display:none;position:relative;align-items:center;justify-content:center;gap:8px;background:var(--red);color:#fff;font-size:14px;font-weight:700;text-decoration:none;text-align:center}
.hbar{height:38px;padding:0 40px;box-sizing:border-box}
.mt-tg{height:38px !important;padding-left:40px !important;padding-right:40px !important}
.hbar span,.mt-tg span{display:block;white-space:nowrap}
.hbar .tgi,.mt-tg .tgi{flex:none;width:18px;height:18px;fill:#fff}
.hbar .mt-tgx{position:absolute;right:4px;top:5px;width:28px;height:28px;border:0;border-radius:var(--r);background:transparent;color:#fff;font-size:20px;line-height:1;display:grid;place-items:center;padding:0}
@media(max-width:1023px){
 html:not(.cat-page):not(.info-page):not(.pd-page):not(.tg-off) .hbar{display:flex;padding-top:env(safe-area-inset-top,0px);height:calc(38px + env(safe-area-inset-top,0px))}
 html:not(.cat-page):not(.info-page):not(.pd-page) .telegram-promo{display:none !important}
}

/* v290: with the red strip on top of the home page the menu button and the rating plaque stay on one level, as before */
@media(max-width:1023px){html:not(.cat-page):not(.info-page):not(.pd-page):not(.tg-off) .menu-button{position:relative;top:10px}}

/* v291: preview of the strip: ?bar=thin (30px, text only) or ?bar=thick (38px, with the plane); always shown on the home page and on catalog sections, never hidden */
.bar-force .mt-tgx{display:none !important}
@media(max-width:1023px){
 html.bar-force:not(.cat-page):not(.info-page):not(.pd-page) .hbar{display:flex !important}
 html.bar-force.cat-page .hbar{display:none !important}
 html.bar-force.cat-page .mt-tg{display:flex !important}
 html.bar-force.cat-page .mtop .mt-row{margin-top:0 !important}
 html.bar-force:not(.cat-page):not(.info-page):not(.pd-page) .menu-button{position:relative;top:10px}
 html.bar-thin .hbar,html.bar-thin .mt-tg{height:30px !important;font-size:13px}
 html.bar-thin .hbar{height:calc(30px + env(safe-area-inset-top,0px)) !important}
 html.bar-thin .tgi{display:none}
}

/* v292: the thick strip (38px, plane, cross) is the final one; shown on every page load for testing; the home banner is a bit taller */
@media(max-width:699px){.banner{height:400px !important}.banner-carousel{height:400px !important}.banner-carousel .banner-track{height:400px !important}}

/* v293: the strip uses the same plane as the contacts/footer; the cross is centred vertically; the link goes to the discount bot of the main site */
.hbar .mt-tgx,.mt-tg .mt-tgx{top:50% !important;transform:translateY(-50%);right:6px;width:30px;height:30px;font-size:22px;line-height:1;padding:0;display:grid !important;place-items:center}
.mt-tg .mt-tgx{top:calc(50% + env(safe-area-inset-top,0px)/2) !important}
.hbar .tgi,.mt-tg .tgi{width:20px;height:20px;fill:#fff;stroke:none}

/* v295: phone home: a bit more air between the banner and the category row, taken from the gap above «Наши букеты» (the cards do not move) */
@media(max-width:699px){html:not(.cat-page):not(.info-page):not(.pd-page) .catalog-navigation{margin-top:12px}html:not(.cat-page):not(.info-page):not(.pd-page) .showcase{margin-top:0}}

/* v297: the plane in the home «Скидка 10%» tile is the same original Telegram glyph as in the footer and contacts */
.mosaic-tg svg{fill:#fff}

/* v298: the plane in the home tile is drawn like the one in the header: filled, no outline stroke (the outline made it fat), a little smaller */
.mosaic-tg svg{width:26px !important;height:26px !important;fill:#fff !important;stroke:none !important}
.mosaic-tg svg *{stroke:none !important;fill:#fff !important;stroke-width:0 !important}
.telegram-promo .tg-icon,.telegram-promo .tg-icon *{stroke:none !important;stroke-width:0 !important;fill:#fff !important}

/* v299: desktop section pages: a red «Скидка 10% за подписку в Telegram» tile above the right column; closable */
.dtg{display:none}
@media(min-width:1200px){
 html.cat-page:not(.tg-off):not(.tg-sec-off) .dtg{display:block;position:relative;margin:0 0 12px;padding:18px 44px 18px 18px;border-radius:var(--r);background:var(--red);color:#fff;text-decoration:none}
 html.cat-page .dtg svg.p{display:block;width:26px;height:26px;fill:#fff;stroke:none;margin-bottom:12px}
 html.cat-page .dtg strong{display:block;font-size:20px;line-height:1.15;font-weight:800;letter-spacing:-.3px}
 html.cat-page .dtg b{display:inline-flex;align-items:center;margin-top:12px;font-size:14px;font-weight:700}
 html.cat-page .dtg .dtgx{position:absolute;right:8px;top:8px;width:30px;height:30px;border:0;border-radius:var(--r);background:transparent;color:#fff;font-size:22px;line-height:1;display:grid;place-items:center;padding:0;cursor:pointer}
}

/* v301: cookies notice: small bar bottom (phone, above the tab bar) or bottom-left (desktop); shown once, a few seconds after entering */
.ck{position:fixed;z-index:480;left:12px;right:12px;bottom:calc(92px + env(safe-area-inset-bottom,0px));display:flex;align-items:center;gap:12px;padding:12px 12px 12px 16px;border-radius:var(--r);background:#fff;box-shadow:0 8px 30px rgba(40,20,25,.22);transform:translateY(24px);opacity:0;visibility:hidden;transition:transform .3s cubic-bezier(.22,.8,.3,1),opacity .25s,visibility 0s linear .3s}
.ck.on{transform:none;opacity:1;visibility:visible;transition:transform .3s cubic-bezier(.22,.8,.3,1),opacity .25s}
.ck p{flex:1;margin:0;font-size:13px;line-height:1.35;color:#3a3436}
.ck a{color:var(--red);font-weight:600;text-decoration:none}
.ck button{flex:none;height:40px;padding:0 18px;border:0;border-radius:var(--r);background:var(--red);color:#fff;font:inherit;font-size:14px;font-weight:700;cursor:pointer}
@media(min-width:1024px){.ck{left:50%;right:auto;bottom:24px;width:380px;transform:translate(-50%,24px)}.ck.on{transform:translateX(-50%)}}
@media(min-width:1200px){.ck{left:auto;right:max(24px,calc((100vw - 1280px)/2 + 24px));width:320px;flex-wrap:wrap;transform:translateY(24px)}.ck.on{transform:none}.ck p{flex:1 1 100%}.ck button{width:100%}}

/* v304: screens 1024-1199 px: no benefit tiles under the banner; the cart is a drawer from the right; the header is less crowded (short city name, smaller gaps, the search keeps its text); the cookie notice hides while a window is open */
@media(min-width:1024px) and (max-width:1199px){
 .trust{display:none !important}
 .cart-panel{left:auto !important;right:0 !important;top:0 !important;bottom:0 !important;margin:0 !important;max-width:none !important;width:440px !important;height:100dvh !important;max-height:none !important;border-radius:var(--r) 0 0 var(--r) !important;transform:translate3d(105%,0,0) !important;overflow:hidden}
 html.cart-open .cart-panel{transform:translate3d(0,0,0) !important}
 .cart-panel__in{height:100%;max-height:none !important;overflow-y:auto;border-radius:var(--r) 0 0 var(--r)}
 .dt-header__in{gap:14px !important}
 .dt-actions{gap:8px !important}
 .dt-phone{margin-right:2px !important;font-size:15px !important}
 .dt-contact,.dt-cart{padding:0 14px !important}
}
html.cart-open .ck,html.is-open .ck,html.co-open .ck,html.pd-open .ck,html.sheet-open .ck,html.up-open .ck{opacity:0 !important;visibility:hidden !important;pointer-events:none}

/* v305: phone menu: no ratings (they are on the home page); the city row sits right under the logo with generous air above and below, the contacts stay at the bottom */
.menu-drawer .menu-group--city{margin:26px 0 22px !important}
.menu-drawer .menu-group--city small{display:none !important}
.menu-drawer .menu-group--city .city-button.menu-city{min-height:48px;padding:10px 0 !important;font-size:18px}

/* v306: the note under the cart buttons is centred */
.cp-note{text-align:center !important}

/* v307: home banners: Kenya (big), French lace roses (second slide), bouquets up to 3000 (desktop tile); image crops; phone swipes all three banners */
.banner picture{display:block;width:100%;height:100%}.banner picture img{width:100%;height:100%;object-fit:cover}
.banner--azhur>img{object-position:50% 45%}.banner--do3000>img,.mosaic-tile.banner--do3000 img{object-position:50% 38%}

/* v308: Kenya banner: big "Розы от 79 ₽" with a caption under it */
.banner--kenya .banner-copy strong{font-size:46px;line-height:1;letter-spacing:-1.6px}
.banner-sub{margin-top:10px;font-style:normal;font-size:15px;font-weight:700;color:#fff;opacity:.92}
.banner--kenya .banner-copy b{margin-top:14px}
@media(min-width:1024px){.banner--kenya .banner-copy strong{font-size:58px;letter-spacing:-2px}.banner-sub{font-size:17px}}

/* v309: Kenya banner title in one line, smaller */
.banner--kenya .banner-copy strong{font-size:36px;letter-spacing:-1.2px;white-space:nowrap}
@media(min-width:1024px){.banner--kenya .banner-copy strong{font-size:42px;letter-spacing:-1.4px}}
