:root {
  --blue: #229ed9;
  --blue-dark: #168ac2;
  --ink: #182533;
  --muted: #728294;
  --bg: #f3f8fc;
  --card: #fff;
  --line: #e5edf4;
  --green: #1da878;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

button,
input,
textarea,
select {
  font: inherit;
}

.top {
  min-height: 76px;
  padding: 12px max(22px, calc((100% - 1160px) / 2));
  background: #fff;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.brand {
  display: flex;
  align-items: center;
  gap: 12px;
}

.brand strong {
  display: block;
  font-size: 17px;
}

.brand small {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-top: 3px;
}

.logo {
  width: 42px;
  height: 42px;
  flex-shrink: 0;
  border-radius: 14px;
  background: linear-gradient(135deg, #2aabee, #1686c2);
  display: grid;
  place-items: center;
  color: white;
  font-size: 25px;
  transform: rotate(-5deg);
  object-fit: cover;
}

.language {
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--muted);
  font-size: 13px;
}

.language select {
  border: 1px solid var(--line);
  background: #f8fbfd;
  padding: 10px 12px;
  border-radius: 12px;
  color: var(--ink);
  max-width: 180px;
}

main {
  max-width: 1160px;
  margin: auto;
  padding: 28px 22px 70px;
}

.hero {
  border-radius: 28px;
  background: linear-gradient(115deg, #dff3ff 0%, #eaf6ff 55%, #d4eefe 100%);
  padding: 52px 58px;
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  align-items: center;
  overflow: hidden;
  min-height: 350px;
}

.eyebrow {
  font-size: 10px;
  letter-spacing: 1.8px;
  color: var(--blue-dark);
  font-weight: 800;
}

.hero h1 {
  font-size: clamp(32px, 4.3vw, 52px);
  line-height: 1.07;
  letter-spacing: -1.7px;
  margin: 17px 0 14px;
  max-width: 520px;
}

.hero p {
  max-width: 470px;
  color: #5d7488;
  line-height: 1.7;
  font-size: 15px;
  margin: 0 0 27px;
}

.primary {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  background: var(--blue);
  color: white;
  border: 0;
  text-decoration: none;
  border-radius: 13px;
  padding: 14px 19px;
  font-weight: 750;
  cursor: pointer;
  box-shadow: 0 7px 16px #229ed92c;
  transition: 0.18s;
}

.primary:hover {
  background: var(--blue-dark);
  transform: translateY(-1px);
}

.hero-art {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 250px;
}

.phone {
  width: 210px;
  background: #fff;
  border: 7px solid #fff;
  border-radius: 29px;
  box-shadow: 0 20px 50px #1886ba26;
  transform: rotate(5deg);
  padding: 12px;
}

.phone-head {
  background: #e8f6ff;
  border-radius: 10px;
  padding: 10px;
  color: var(--blue);
  font-size: 9px;
}

.phone-head span {
  float: right;
  font-weight: 800;
}

.phone-card {
  margin-top: 10px;
  padding: 17px 12px;
  border-radius: 12px;
  background: #f2f8fc;
  font-size: 17px;
}

.phone-card b,
.phone-card small {
  display: block;
}

.phone-card b {
  font-size: 11px;
  margin-top: 8px;
}

.phone-card small {
  font-size: 9px;
  color: var(--muted);
  margin-top: 3px;
}

.phone-button {
  margin-top: 11px;
  text-align: center;
  background: var(--blue);
  color: white;
  border-radius: 9px;
  padding: 10px;
  font-size: 10px;
  font-weight: 800;
}

.bubble {
  position: absolute;
  border-radius: 20px;
  display: grid;
  place-items: center;
  box-shadow: 0 12px 30px #137ab328;
}

.bubble-one {
  font-size: 32px;
  background: #fff;
  width: 76px;
  height: 76px;
  left: 2%;
  top: 15%;
  transform: rotate(-12deg);
}

.bubble-two {
  font-size: 25px;
  background: var(--blue);
  color: white;
  width: 58px;
  height: 58px;
  right: 0;
  bottom: 14%;
  transform: rotate(10deg);
}

.section-head,
.checkout-title {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 20px;
  margin: 48px 0 20px;
}

.section-head h2,
.checkout-title h2 {
  font-size: 27px;
  letter-spacing: -0.7px;
  margin: 8px 0 0;
}

.search {
  display: flex;
  align-items: center;
  gap: 8px;
  background: white;
  border: 1px solid var(--line);
  padding: 0 13px;
  border-radius: 13px;
  width: min(300px, 100%);
  height: 46px;
  color: var(--muted);
}

.search input {
  border: 0;
  outline: 0;
  width: 100%;
  background: transparent;
  color: var(--ink);
}

.products {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.product {
  min-width: 0;
  display: flex;
  flex-direction: column;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 19px;
  overflow: hidden;
  transition: 0.2s;
}

.product:hover {
  transform: translateY(-3px);
  box-shadow: 0 15px 35px #1c45620d;
}

/* Изображение товара: увеличенная область и фотография целиком */
.product-image {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 280px;
  width: 100%;
  height: 280px;
  min-height: 280px;
  overflow: hidden;
  background: #fff;
  font-size: 57px;
}

.product-image img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
  padding: 8px;
  background: #fff;
}

.product-image.no-photo::after {
  content: "🛍️";
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 48px;
  pointer-events: none;
}

.product-image.no-photo img {
  display: none;
}

.stock {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 1;
  background: #ffffffdf;
  padding: 6px 9px;
  border-radius: 8px;
  font-size: 10px;
  font-weight: 750;
}

.product-body {
  display: block;
  flex: 1;
  min-width: 0;
  padding: 17px;
  background: #fff;
  color: var(--ink);
}

.product h3 {
  margin: 0 0 8px;
  font-size: 17px;
  overflow-wrap: anywhere;
}

.product p {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.6;
  min-height: 38px;
  margin: 0 0 17px;
  overflow-wrap: anywhere;
}

.product-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
}

.price {
  font-size: 19px;
  font-weight: 850;
  white-space: nowrap;
}

.add {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border: 0;
  background: #e8f6ff;
  color: #1489c1;
  border-radius: 11px;
  padding: 11px 13px;
  font-weight: 800;
  cursor: pointer;
  pointer-events: auto;
}

.add:hover {
  background: #d5efff;
}

.add:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.loading,
.empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 50px 20px;
  color: var(--muted);
  background: #fff;
  border: 1px dashed #cfdeea;
  border-radius: 18px;
}

.notice {
  padding: 13px 16px;
  margin: 15px 0;
  border-radius: 12px;
  background: #e4f8ee;
  color: #16764f;
  font-size: 14px;
}

.notice.error {
  background: #fff0ed;
  color: #b43c2c;
}

.checkout-title {
  margin-top: 58px;
}

.cart-count {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  background: #dff3ff;
  color: #168ac2;
  font-weight: 800;
}

.cart-items {
  display: grid;
  gap: 10px;
}

.cart-row {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 13px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.cart-emoji {
  width: 42px;
  height: 42px;
  flex-shrink: 0;
  border-radius: 12px;
  background: #edf8ff;
  display: grid;
  place-items: center;
  font-size: 21px;
}

.cart-info {
  flex: 1;
  min-width: 0;
}

.cart-info b {
  display: block;
  font-size: 14px;
}

.cart-info small {
  color: var(--muted);
  display: block;
  margin-top: 4px;
}

.quantity {
  display: flex;
  align-items: center;
  gap: 10px;
}

.quantity button {
  border: 0;
  background: #edf7fd;
  color: #188ec4;
  width: 30px;
  height: 30px;
  border-radius: 9px;
  cursor: pointer;
  font-weight: 800;
}

.checkout-grid {
  display: grid;
  grid-template-columns: 1.3fr 0.7fr;
  gap: 18px;
  margin-top: 18px;
}

.form-card,
.summary {
  min-width: 0;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 19px;
  padding: 24px;
}

.form-card h3,
.summary h3 {
  margin: 0 0 21px;
  font-size: 18px;
}

.form-card label {
  display: block;
  font-size: 12px;
  color: #536779;
  font-weight: 700;
  margin: 15px 0;
}

.form-card input,
.form-card textarea {
  display: block;
  width: 100%;
  min-height: 46px;
  margin-top: 8px;
  padding: 13px 14px;
  border: 1px solid #dfe9f0;
  border-radius: 11px;
  outline: none;
  background: #fbfdff;
  color: var(--ink);
}

.form-card input:focus,
.form-card textarea:focus {
  border-color: #79c7ed;
  box-shadow: 0 0 0 3px #229ed91c;
}

.form-card textarea {
  resize: vertical;
  min-height: 85px;
}

#orderForm label {
  display: block !important;
}

#orderForm input[name="name"],
#orderForm input[name="contact"],
#orderForm textarea[name="delivery"] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100% !important;
  min-height: 46px;
  margin-top: 8px;
  padding: 13px 14px;
  border: 1px solid #dfe9f0;
  border-radius: 11px;
  background: #fbfdff;
  color: var(--ink);
  position: relative;
  z-index: 1;
}

#orderForm textarea[name="delivery"] {
  min-height: 85px;
}

.full {
  width: 100%;
  margin-top: 4px;
}

.fine {
  font-size: 11px;
  color: var(--muted);
  line-height: 1.5;
}

.summary-line {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 0;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
  color: var(--muted);
}

.summary-line b {
  color: var(--ink);
}

.summary-line.total {
  border-bottom: 0;
  font-size: 15px;
  color: var(--ink);
  padding-top: 20px;
}

.summary-line.total b {
  font-size: 22px;
  color: var(--blue-dark);
}

#paymentNote {
  font-size: 12px;
  line-height: 1.6;
  color: var(--muted);
}

.secure {
  margin-top: 18px;
  background: #effaf5;
  color: #21825c;
  padding: 12px;
  border-radius: 10px;
  font-size: 11px;
  line-height: 1.5;
}

footer {
  background: #fff;
  border-top: 1px solid var(--line);
  padding: 25px max(22px, calc((100% - 1160px) / 2));
  display: flex;
  align-items: center;
  gap: 22px;
  color: var(--muted);
  font-size: 12px;
}

.footer-brand {
  font-weight: 850;
  color: var(--ink);
}

.footer-status {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 7px;
}

.footer-status i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #1eb980;
}

.hidden {
  display: none !important;
}

.photo-placeholder {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  font-size: 54px;
  background: linear-gradient(135deg, #e9f6ff, #f6fbff);
}

/* Планшеты и телефоны */
@media (max-width: 760px) {
  .top {
    min-height: 68px;
    padding: 10px 16px;
  }

  .brand small {
    display: none;
  }

  .language {
    font-size: 0;
  }

  .language select {
    font-size: 12px;
    max-width: 145px;
  }

  main {
    padding: 16px 14px 45px;
  }

  .hero {
    padding: 30px 25px;
    grid-template-columns: 1fr;
    min-height: 0;
    border-radius: 22px;
  }

  .hero h1 {
    font-size: 37px;
  }

  .hero-art {
    min-height: 240px;
    margin-top: 20px;
  }

  .phone {
    width: 185px;
  }

  .bubble-one {
    left: 8%;
  }

  .bubble-two {
    right: 7%;
  }

  .section-head {
    align-items: stretch;
    flex-direction: column;
    margin-top: 36px;
  }

  .section-head h2,
  .checkout-title h2 {
    font-size: 24px;
  }

  .search {
    width: 100%;
  }

  .products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .product-image {
    flex-basis: 220px;
    height: 220px;
    min-height: 220px;
    font-size: 44px;
  }

  .product-body {
    padding: 12px;
  }

  .product h3 {
    font-size: 15px;
  }

  .product p {
    font-size: 11px;
    min-height: 52px;
  }

  .product-bottom {
    flex-direction: column;
    align-items: stretch;
  }

  .price {
    font-size: 18px;
  }

  .add {
    width: 100%;
    padding: 10px;
  }

  .checkout-grid {
    grid-template-columns: 1fr;
  }

  .form-card,
  .summary {
    padding: 18px;
  }

  .checkout-title {
    margin-top: 42px;
  }

  footer {
    padding: 20px 15px;
    flex-wrap: wrap;
    gap: 10px;
  }

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

@media (max-width: 390px) {
  .products {
    grid-template-columns: 1fr;
  }

  .product-image {
    flex-basis: 260px;
    height: 260px;
    min-height: 260px;
  }

  .product-bottom {
    flex-direction: row;
    align-items: center;
  }

  .add {
    width: auto;
  }
}


/* Дополнение: избранное, метки подборок и плавающая Telegram-кнопка */
.catalog-tools{display:flex;justify-content:flex-end;min-width:min(300px,100%)}
.shop-filters{display:flex;flex-wrap:wrap;gap:9px;margin:0 0 18px}
.shop-filter{border:1px solid var(--line);background:#fff;color:var(--ink);padding:10px 14px;border-radius:999px;font-weight:750;font-size:13px;cursor:pointer;transition:background .18s,border-color .18s,color .18s}
.shop-filter:hover,.shop-filter.active{background:#e5f5ff;border-color:#b7e4fa;color:#087db5}
.shop-filter span{display:inline-grid;place-items:center;min-width:19px;height:19px;padding:0 5px;margin-left:3px;border-radius:99px;background:#fff;font-size:11px}
.product-image{isolation:isolate}
.product-badges{position:absolute;z-index:2;left:12px;bottom:12px;display:flex;flex-wrap:wrap;gap:6px;max-width:calc(100% - 70px);pointer-events:none}
.product-badge{display:inline-flex;align-items:center;border-radius:8px;padding:6px 8px;font-size:10px;line-height:1.1;font-weight:850;box-shadow:0 3px 10px #18364d12}
.badge-new{background:#e3f8ee;color:#11754f}.badge-popular{background:#fff0d8;color:#965b00}
.favorite-toggle{position:absolute;z-index:3;top:10px;right:10px;width:38px;height:38px;display:grid;place-items:center;border:1px solid #e3edf4;border-radius:50%;background:#ffffffed;color:#526678;font-size:25px;line-height:1;cursor:pointer;box-shadow:0 4px 14px #17354b16;transition:transform .16s,color .16s,background .16s}
.favorite-toggle:hover{transform:scale(1.06)}.favorite-toggle.is-favorite{color:#e34d72;background:#fff3f6;border-color:#ffd5df}
.telegram-float{position:fixed;z-index:50;right:22px;bottom:22px;display:flex;align-items:center;gap:10px;padding:12px 17px;border-radius:999px;background:#229ed9;color:#fff;text-decoration:none;font-size:13px;font-weight:800;box-shadow:0 10px 28px #087db54a;transition:transform .18s,background .18s}
.telegram-float:hover{background:#168ac2;transform:translateY(-2px)}.telegram-float-icon{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#ffffff26;font-size:17px}
@media(max-width:760px){.catalog-tools{width:100%;min-width:0}.shop-filters{gap:7px;margin-bottom:14px}.shop-filter{padding:9px 11px;font-size:12px}.telegram-float{right:13px;bottom:13px;padding:11px 14px;box-shadow:0 7px 20px #087db54a}.telegram-float span:last-child{font-size:12px}.product-badges{left:8px;bottom:8px;max-width:calc(100% - 58px)}.product-badge{font-size:9px;padding:5px 6px}.favorite-toggle{width:34px;height:34px;top:8px;right:8px}}
@media(max-width:390px){.shop-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.shop-filter{width:100%}.telegram-float{right:10px;bottom:10px}}


/* Дополнение: сортировка, быстрый просмотр, поиск, FAQ и мобильная навигация */
.catalog-tools{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;min-width:min(300px,100%)}
.search-main{position:relative;flex:1;min-width:220px}
.search-clear{border:0;background:transparent;color:var(--muted);font-size:22px;cursor:pointer;padding:3px 0 3px 6px;line-height:1}
.sort-control,.stock-only{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px;font-weight:700;white-space:nowrap}
.sort-control select{max-width:190px;border:1px solid var(--line);border-radius:11px;background:#fff;color:var(--ink);padding:10px 11px;min-height:42px}
.stock-only{background:#fff;border:1px solid var(--line);padding:10px 12px;border-radius:11px;min-height:42px;cursor:pointer}.stock-only input{accent-color:var(--blue);width:16px;height:16px}
.quick-view-link{display:block;width:100%;padding:0;border:0;background:transparent;color:var(--ink);text-align:left;font-weight:800;font-size:17px;line-height:1.35;cursor:pointer;overflow-wrap:anywhere}.quick-view-link:hover,.details-link:hover{color:var(--blue-dark)}
.details-link{border:0;background:transparent;padding:0;margin:-8px 0 14px;color:var(--blue-dark);font-size:12px;font-weight:800;cursor:pointer}
.quick-view{width:min(760px,calc(100% - 28px));max-width:760px;max-height:min(88vh,800px);padding:0;border:0;border-radius:22px;background:#fff;color:var(--ink);box-shadow:0 24px 80px #142b3b45;overflow:auto}
.quick-view::backdrop{background:#0e2537a6;backdrop-filter:blur(4px)}.modal-close{position:sticky;top:10px;float:right;margin:10px 10px -48px 0;z-index:4;width:38px;height:38px;border:1px solid var(--line);border-radius:50%;background:#ffffffed;font-size:25px;cursor:pointer}
.quick-view-content{display:grid;grid-template-columns:1fr 1fr}.quick-view-image{min-height:280px;display:grid;place-items:center;background:#f7fbfe;padding:26px;font-size:60px}.quick-view-image img{width:100%;height:100%;max-height:420px;object-fit:contain}.quick-view-info{padding:36px 28px 28px}.quick-view-info h2{font-size:26px;line-height:1.2;margin:15px 0 10px;overflow-wrap:anywhere}.quick-view-info p{color:var(--muted);font-size:14px;line-height:1.7}.quick-stock{display:inline-flex;padding:6px 9px;border-radius:8px;background:#e3f8ee;color:#11754f;font-size:11px;font-weight:800}.quick-stock.is-out{background:#fff0ed;color:#b43c2c}.quick-price{display:block;font-size:25px;margin:20px 0}
.notice.toast-pop{position:fixed;z-index:80;right:18px;bottom:88px;max-width:min(420px,calc(100% - 36px));box-shadow:0 12px 34px #16344b24;animation:noticeIn .22s ease-out}.notice.notice-hide{opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s}.cart-bump{animation:cartBump .36s ease}.added-pulse{animation:addPulse .4s ease}@keyframes noticeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes cartBump{50%{transform:scale(1.18)}}@keyframes addPulse{50%{transform:scale(.96)}}
.info-section,.faq-section{margin-top:58px}.info-heading{max-width:650px;margin-bottom:20px}.info-heading h2{font-size:27px;letter-spacing:-.7px;margin:8px 0}.info-heading p{color:var(--muted);line-height:1.65;font-size:14px}.info-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.info-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px}.info-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#e8f6ff;font-size:21px}.info-card h3{font-size:15px;margin:14px 0 8px}.info-card p,.faq-list p{font-size:13px;line-height:1.7;color:var(--muted);margin:0}.faq-list{display:grid;gap:10px}.faq-list details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:0 17px}.faq-list summary{padding:16px 24px 16px 0;cursor:pointer;font-size:14px;font-weight:800;position:relative;list-style:none}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary::after{content:'+';position:absolute;right:0;top:12px;color:var(--blue);font-size:22px}.faq-list details[open] summary::after{content:'−'}.faq-list details p{padding:0 0 17px}
.mobile-nav{display:none}
@media(max-width:760px){.catalog-tools{display:grid;grid-template-columns:1fr 1fr;gap:8px}.search-main{grid-column:1/-1;width:100%;min-width:0}.sort-control{grid-column:1/-1;justify-content:space-between}.sort-control select{flex:1;max-width:none}.stock-only{justify-content:center}.quick-view{max-height:85vh}.quick-view-content{display:block}.quick-view-image{min-height:220px;height:260px;padding:18px}.quick-view-image img{max-height:225px}.quick-view-info{padding:22px}.quick-view-info h2{font-size:22px}.info-cards{grid-template-columns:1fr}.info-section,.faq-section{margin-top:40px}.info-heading h2{font-size:24px}.mobile-nav{position:fixed;z-index:45;left:10px;right:10px;bottom:10px;display:grid;grid-template-columns:repeat(4,1fr);gap:2px;padding:7px;background:#fffffff2;border:1px solid #dfeaf2;border-radius:18px;box-shadow:0 8px 28px #16344b24;backdrop-filter:blur(12px)}.mobile-nav a{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;min-height:48px;text-decoration:none;color:var(--muted);font-size:11px;font-weight:750;border-radius:12px}.mobile-nav a:active,.mobile-nav a:hover{background:#e8f6ff;color:var(--blue-dark)}.mobile-nav a>span{position:relative;font-size:19px;line-height:1.1}.mobile-nav small{font-size:10px}.mobile-nav b{position:absolute;top:-6px;right:-12px;min-width:16px;height:16px;display:grid;place-items:center;border-radius:99px;background:var(--blue);color:#fff;font-size:9px;padding:0 4px}body{padding-bottom:78px}.telegram-float{bottom:82px;right:12px}.notice.toast-pop{bottom:145px}.checkout-section{scroll-margin-top:18px}footer{padding-bottom:95px}}
@media(max-width:390px){.catalog-tools{grid-template-columns:1fr}.search-main,.sort-control,.stock-only{grid-column:1}.stock-only{justify-content:flex-start}.quick-view-image{height:220px}.quick-view-info{padding:18px}.mobile-nav{left:6px;right:6px;bottom:6px}.mobile-nav a{min-height:44px}body{padding-bottom:70px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}

/* LiquidEmpire brand + mandatory city selection */
.city-chip{display:inline-flex;align-items:center;gap:6px;max-width:230px;padding:9px 12px;border:1px solid var(--line);border-radius:12px;background:#f8fbfd;color:var(--ink);font-size:12px;font-weight:800;cursor:pointer}
.city-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.city-chip b{color:var(--blue-dark)}
.city-gate[hidden]{display:none!important}.city-gate{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:20px;background:rgba(5,4,15,.88);backdrop-filter:blur(12px);overflow:auto}
.city-gate-card{width:min(480px,100%);padding:30px;border:1px solid #6330a6;border-radius:26px;background:linear-gradient(155deg,#171020,#09070d 70%);color:#fff;box-shadow:0 24px 90px #7d16ff45;text-align:center}
.city-gate-logo{width:112px;height:112px;object-fit:cover;border-radius:50%;border:2px solid #b42dff;box-shadow:0 0 30px #9b21ff66;margin:0 auto 16px;display:block}
.city-gate-eyebrow{font-size:10px;font-weight:900;letter-spacing:3px;color:#d18bff}.city-gate-card h1{font-size:clamp(24px,5vw,32px);line-height:1.12;margin:12px 0}.city-gate-card p{font-size:14px;line-height:1.6;color:#c8bfd2;margin:0 0 22px}.city-gate-card label{display:block;text-align:left;font-size:12px;font-weight:800;margin-bottom:8px;color:#e4d7f2}.city-gate-card select{width:100%;min-height:48px;padding:12px;border:1px solid #50365e;border-radius:12px;background:#201729;color:#fff;font:inherit;margin-bottom:12px}.city-gate-card .primary{background:linear-gradient(90deg,#8d22ef,#c026ff);box-shadow:0 8px 25px #a21cff38}.city-gate-card .primary:disabled{opacity:.45;cursor:not-allowed}.city-gate-card>small{display:block;color:#a99caf;font-size:11px;line-height:1.5;margin-top:14px}
@media(max-width:760px){.top{flex-wrap:wrap}.city-chip{order:3;width:100%;max-width:none;justify-content:center}.city-gate-card{padding:24px 20px;border-radius:22px}.city-gate-logo{width:94px;height:94px}}