:root {
  --primary: #8a35dd;
  --primary-dark: #5a18ad;
  --primary-deep: #25004d;
  --primary-soft: #f5eeff;
  --primary-line: #e8dcff;
  --primary-glow: #e66cf0;
  --accent: #ff65d4;
  --accent-soft: #fff2fd;
  --ink: #161823;
  --ink-soft: #485161;
  --muted: #7a8598;
  --line: #e7eaf1;
  --surface: #ffffff;
  --surface-soft: #f6f8fc;
  --success: #2eaa67;
  --shadow: 0 18px 48px rgba(26, 16, 64, .12);
  --radius: 18px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; font-family:"Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size:15px; line-height:1.5; color:var(--ink); background:#fff; font-synthesis:none; }
body.locked { overflow:hidden; }
a { text-decoration:none; color:inherit; }
button, input, textarea { font:inherit; }
button { cursor:pointer; }
img { display:block; max-width:100%; }
.container { width:min(1280px, calc(100% - 48px)); margin-inline:auto; }
.icon-inline { width:1.1rem; text-align:center; }
.site-header { position:sticky; top:0; z-index:80; background:rgba(255,255,255,.96); backdrop-filter:blur(12px); border-top:4px solid var(--primary-deep); border-bottom:1px solid var(--line); }
.header-inner { min-height:88px; display:grid; grid-template-columns:auto auto auto minmax(260px,1fr) auto auto auto; gap:16px; align-items:center; }
.brand { display:flex; align-items:center; min-width:180px; }
.brand img { width:215px; height:auto; }
.square-btn,.nav-catalog,.language-btn,.cart-btn,.search-filter,.search-submit,.mini-action,.primary-btn,.ghost-btn { border:0; display:inline-flex; align-items:center; justify-content:center; }
.square-btn { width:58px; height:54px; flex-direction:column; gap:2px; border-radius:9px; background:#f0f1f4; color:#1b1f27; font-weight:700; font-size:12px; line-height:1; }
.square-btn i { font-size:18px; }
.nav-catalog { height:48px; padding:0 18px; gap:10px; border-radius:12px; color:#fff; font-weight:800; background:linear-gradient(135deg,var(--primary) 0%, var(--accent) 100%); box-shadow:0 12px 26px rgba(138,53,221,.22); }
.nav-catalog:hover,.primary-btn:hover { filter:brightness(.98); transform:translateY(-1px); }
.search-box { height:48px; display:flex; align-items:center; background:var(--surface-soft); border-radius:12px; padding-left:18px; min-width:0; }
.search-box input { width:100%; min-width:0; background:transparent; border:0; outline:0; padding:0 12px; color:var(--ink); }
.search-box input::placeholder { color:#7a8291; }
.search-filter { width:42px; height:42px; border-radius:10px; background:transparent; color:#353a45; }
.search-submit { width:44px; height:44px; background:transparent; color:#21252f; }
.phone-nav { min-width:172px; text-align:center; line-height:1.16; }
.phone-nav strong { display:block; font-size:17px; }
.phone-nav span { display:block; font-size:12px; color:var(--muted); margin-top:3px; }
.language-wrap { position:relative; }
.language-btn { min-width:60px; height:40px; padding:0 11px; gap:7px; background:var(--surface-soft); border-radius:11px; font-weight:700; }
.language-menu { position:absolute; top:47px; right:0; display:none; min-width:145px; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); padding:6px; }
.language-wrap.open .language-menu { display:block; }
.language-menu button { width:100%; text-align:left; border:0; background:transparent; border-radius:8px; padding:8px 10px; }
.language-menu button:hover { background:var(--surface-soft); }
.cart-btn { position:relative; flex-direction:column; gap:2px; font-size:12px; font-weight:700; color:#171a22; background:transparent; }
.cart-count { position:absolute; top:-8px; right:-6px; width:20px; height:20px; border-radius:50%; display:grid; place-items:center; background:#e6436f; color:#fff; font-size:11px; font-weight:800; }
.catalog-overlay-wrap { position:relative; }
.catalog-overlay { display:none; position:absolute; top:100%; left:0; right:0; padding:12px 0 0; z-index:75; }
.catalog-overlay.open { display:block; }
.hero-section { padding:28px 0 26px; }
.hero-grid { display:grid; grid-template-columns: 615px minmax(0,1fr); gap:22px; align-items:start; }
.hero-banner { min-height:392px; border:1px solid var(--line); border-radius:18px; background:linear-gradient(135deg,#fff 8%, #f9f4ff 70%, #f3eeff 100%); padding:34px; overflow:hidden; position:relative; }
.hero-banner::before { content:""; position:absolute; width:380px; height:380px; border-radius:50%; right:-140px; top:-120px; background:radial-gradient(circle at center, rgba(230,108,240,.22), rgba(138,53,221,.08) 46%, transparent 70%); }
.hero-banner::after { content:""; position:absolute; inset:auto auto 12px 55%; width:180px; height:10px; border-radius:999px; background:linear-gradient(90deg,#efe7ff,rgba(255,255,255,.85)); }
.hero-flex { position:relative; z-index:1; display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:22px; min-height:324px; }
.hero-visual { display:flex; justify-content:center; align-items:center; }
.hero-visual .logo-card { width:min(100%, 430px); filter: drop-shadow(0 24px 34px rgba(80, 28, 132, .18)); }
.hero-copy h1 { margin:0; font-size:34px; line-height:1.16; letter-spacing:-1.1px; }
.hero-copy p { margin:18px 0 24px; max-width:430px; color:var(--ink-soft); font-size:17px; }
.primary-btn { min-height:50px; padding:14px 24px; border-radius:12px; font-weight:800; color:#fff; background:linear-gradient(135deg,var(--primary) 0%,var(--accent) 100%); box-shadow:0 14px 30px rgba(138,53,221,.23); transition:.18s ease; }
.hero-chips { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.hero-chip { display:inline-flex; align-items:center; gap:8px; padding:10px 14px; border-radius:999px; background:#fff; border:1px solid var(--primary-line); color:var(--primary-dark); font-size:13px; font-weight:800; }
.hero-pager { position:absolute; left:50%; bottom:16px; transform:translateX(-50%); display:flex; gap:8px; }
.hero-pager i { width:20px; height:5px; border-radius:99px; background:#ebeef5; display:block; }
.hero-pager i.active { background:var(--primary); }
.mega-catalog { border:1px solid #dfe4ee; border-radius:16px; background:#fff; overflow:hidden; box-shadow:0 12px 28px rgba(15,18,35,.06); display:grid; grid-template-columns: 308px 1fr 1fr; }
.mega-catalog.full-height { min-height:392px; }
.mega-col { min-height:392px; max-height:392px; overflow:auto; background:#fff; }
.mega-col:not(:last-child) { border-right:1px solid #e7ebf3; }
.mega-col::-webkit-scrollbar { width:7px; }
.mega-col::-webkit-scrollbar-thumb { background:#daddE7; border-radius:99px; }
.mega-item { width:100%; border:0; background:#fff; color:inherit; font:inherit; text-align:left; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 14px; border-bottom:1px dashed #e8ebf2; transition:.18s ease; }
.mega-item:focus-visible { outline:2px solid var(--primary); outline-offset:-2px; }
.mega-item:last-child { border-bottom:0; }
.mega-item .item-left { display:flex; align-items:center; gap:12px; min-width:0; }
.mega-item .item-left span:last-child { white-space:normal; }
.mega-item i:first-child { width:20px; text-align:center; color:#404758; }
.mega-item:hover { background:#faf8ff; color:var(--primary-dark); }
.mega-item.active { background:#f4f1fb; }
.mega-item.active .arrow { color:var(--primary); }
.mega-placeholder { padding:18px; color:var(--muted); font-size:14px; }
.benefits { padding:6px 0 34px; }
.benefit-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.benefit-card { min-height:160px; padding:27px 28px; border:1px solid var(--line); border-radius:16px; display:flex; align-items:flex-start; gap:18px; }
.benefit-icon { width:56px; height:56px; border-radius:50%; display:grid; place-items:center; flex:0 0 56px; background:#fbf9ff; color:var(--primary); font-size:22px; }
.benefit-card h3 { margin:2px 0 10px; font-size:18px; }
.benefit-card p { margin:0; color:var(--ink-soft); }
.section { padding: 8px 0 60px; }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:18px; margin-bottom:18px; }
.section-head h2 { margin:0; font-size:28px; letter-spacing:-.8px; }
.section-head p { margin:0; color:var(--muted); }
.empty-state { border:1px solid var(--line); border-radius:18px; min-height:330px; display:grid; place-items:center; text-align:center; padding:35px; background:linear-gradient(180deg,#fff 0%,#fcfcfe 100%); }
.empty-graphic { width:96px; height:96px; border-radius:50%; display:grid; place-items:center; margin:0 auto 18px; background:var(--primary-soft); color:var(--primary); font-size:38px; }
.empty-state h3 { margin:0 0 8px; font-size:22px; }
.empty-state p { margin:0 auto 20px; color:var(--ink-soft); max-width:480px; }
.ghost-btn { background:#fff; border:1px solid var(--line); color:#2f3642; padding:11px 16px; border-radius:12px; font-weight:800; gap:9px; }
.ghost-btn:hover { border-color:var(--primary-line); color:var(--primary); }
.info-strip { background:#f6f7fb; border-top:1px solid #eef1f6; border-bottom:1px solid #eef1f6; }
.info-strip .container { display:grid; grid-template-columns: 1.1fr auto; gap:16px; align-items:center; padding:28px 0; }
.info-strip h2 { margin:0 0 6px; font-size:21px; }
.info-strip p { margin:0; color:var(--ink-soft); }
.page { min-height:60vh; }
.breadcrumb { padding-top:18px; color:#657086; font-size:14px; }
.breadcrumb a:hover { color:var(--primary); }
.page-title { margin:16px 0 22px; font-size:31px; letter-spacing:-1px; }
.content-card { border:1px solid var(--line); border-radius:18px; padding:30px; margin-bottom:26px; background:#fff; }
.content-card h2 { margin:0 0 16px; font-size:23px; }
.content-card p, .content-card li { color:var(--ink-soft); }
.content-card ul { margin:0; padding-left:18px; display:grid; gap:10px; }
.contact-layout { display:grid; grid-template-columns: 1fr 1.1fr; gap:22px; }
.contact-list { display:grid; gap:16px; }
.contact-item { display:flex; align-items:flex-start; gap:14px; }
.contact-item .mini-round { width:42px; height:42px; flex:0 0 42px; border-radius:50%; display:grid; place-items:center; background:var(--primary-soft); color:var(--primary); }
.contact-item b { display:block; margin-bottom:2px; }
.contact-item p { margin:0; }
.form-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.form-field { display:grid; gap:7px; }
.form-field.full { grid-column:1/-1; }
.form-field input,.form-field textarea { width:100%; padding:12px 13px; border:1px solid #dfe5ef; border-radius:11px; outline:0; resize:vertical; }
.form-field input:focus,.form-field textarea:focus { border-color:#c480f3; box-shadow:0 0 0 3px #f6edff; }
.form-success { display:none; margin-top:12px; color:var(--success); font-weight:800; }
.form-success.show { display:block; }
.site-footer { margin-top:10px; background:#f5f6fa; }
.footer-main { display:grid; grid-template-columns: 1.05fr 1fr 1fr 1.25fr; gap:34px; padding:44px 0 36px; }
.footer-brand-pill { display:inline-flex; align-items:center; gap:10px; padding:10px 16px; border-radius:8px 8px 16px 8px; background:linear-gradient(135deg,var(--primary) 0%,var(--accent) 100%); color:#fff; font-weight:800; margin-bottom:18px; }
.footer-brand-pill img { width:28px; height:28px; object-fit:contain; }
.footer-col h3 { margin:0 0 14px; font-size:17px; }
.footer-links { list-style:none; padding:0; margin:0; display:grid; gap:9px; color:#596273; }
.footer-links a:hover { color:var(--primary); }
.contact-lines { display:grid; gap:10px; color:#5d6676; }
.contact-lines strong { color:#171a22; }
.contact-lines .accent { color:var(--success); font-weight:800; }
.socials { display:flex; gap:10px; margin-top:16px; }
.socials a { width:40px; height:40px; border-radius:12px; display:grid; place-items:center; background:#fff; border:1px solid #edf0f5; color:#30394a; }
.socials a:hover { color:var(--primary); border-color:var(--primary-line); }
.footer-bottom { min-height:74px; border-top:1px solid #e6e8ef; display:flex; align-items:center; justify-content:space-between; gap:18px; color:#5f6878; }
.payment-marks { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.payment-marks img { height:32px; width:auto; }
.floating-whatsapp,.scroll-top { position:fixed; z-index:72; display:grid; place-items:center; box-shadow:0 16px 30px rgba(15,21,32,.18); }
.floating-whatsapp { left:18px; bottom:18px; width:66px; height:66px; border-radius:50%; background:#25d366; color:#fff; border:7px solid rgba(37,211,102,.18); background-clip:padding-box; font-size:28px; }
.scroll-top { right:22px; bottom:28px; width:48px; height:48px; border-radius:14px; background:#e3e7ef; color:#1b2230; border:0; opacity:0; pointer-events:none; transform:translateY(10px); transition:.2s; }
.scroll-top.show { opacity:1; pointer-events:auto; transform:translateY(0); }
.drawer-backdrop { position:fixed; inset:0; background:rgba(16,18,26,.38); opacity:0; visibility:hidden; transition:.22s; z-index:88; }
.drawer-backdrop.show { opacity:1; visibility:visible; }
.catalog-drawer { position:fixed; top:0; left:0; width:min(420px, 92vw); height:100dvh; background:#fff; z-index:89; transform:translateX(-104%); transition:.26s ease; box-shadow:20px 0 46px rgba(10,13,20,.14); display:flex; flex-direction:column; }
.catalog-drawer.open { transform:translateX(0); }
.drawer-head { display:flex; align-items:center; justify-content:space-between; padding:18px; border-bottom:1px solid var(--line); }
.drawer-head strong { font-size:20px; }
.drawer-close { width:40px; height:40px; border:0; border-radius:10px; background:#f3f5fa; }
.drawer-body { padding:10px 18px 18px; overflow:auto; }
.drawer-level { display:grid; gap:8px; }
.drawer-node { border-bottom:1px solid #eef1f5; }
.drawer-toggle { width:100%; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 0; background:transparent; border:0; text-align:left; font-weight:700; }
.drawer-toggle .item-left { display:flex; align-items:center; gap:12px; }
.drawer-children { display:none; padding:0 0 10px 12px; }
.drawer-node.open > .drawer-children { display:block; }
.drawer-children .drawer-toggle { padding:10px 0; font-weight:600; color:#394254; }
.toast { position:fixed; left:50%; bottom:26px; transform:translate(-50%, 20px); min-width:260px; max-width:calc(100% - 32px); padding:13px 16px; border-radius:12px; background:#202636; color:#fff; opacity:0; pointer-events:none; transition:.22s; z-index:100; text-align:center; }
.toast.show { opacity:1; transform:translate(-50%,0); }
@media (max-width:1200px) {
  .header-inner { grid-template-columns:auto auto auto minmax(220px,1fr) auto auto; gap:12px; }
  .phone-nav { display:none; }
  .hero-grid { grid-template-columns: 1fr; }
  .hero-banner { min-height:auto; }
  .benefit-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .footer-main { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width:900px) {
  .container { width:min(100% - 32px, 760px); }
  .header-inner { grid-template-columns:auto 1fr auto auto; gap:10px; min-height:74px; padding-bottom:8px; }
  .brand img { width:148px; }
  .nav-catalog { display:none; }
  .search-box { order:5; grid-column:1/-1; }
  .language-wrap { display:none; }
  .catalog-overlay { display:none !important; }
  .mega-catalog { grid-template-columns:1fr; }
  .mega-catalog .mega-col:nth-child(2),.mega-catalog .mega-col:nth-child(3) { display:none; }
  .hero-flex { grid-template-columns:1fr; text-align:center; }
  .hero-copy { display:flex; flex-direction:column; align-items:center; }
  .hero-copy p { max-width:560px; }
  .benefit-grid { grid-template-columns:1fr; }
  .contact-layout,.form-grid,.info-strip .container { grid-template-columns:1fr; }
  .footer-main { grid-template-columns:1fr; gap:24px; }
  .footer-bottom { flex-direction:column; justify-content:center; padding:14px 0; text-align:center; }
}
@media (max-width:560px) {
  body { font-size:14px; }
  .container { width:calc(100% - 24px); }
  .brand img { width:128px; }
  .square-btn { width:46px; height:46px; font-size:10px; }
  .cart-btn { font-size:10px; }
  .hero-section { padding-top:16px; }
  .hero-banner { padding:24px 18px 42px; }
  .hero-copy h1 { font-size:27px; }
  .hero-copy p { font-size:15px; }
  .page-title { font-size:27px; }
  .content-card { padding:22px 18px; }
}


/* --- Desktop hover mega menu: ibay-style interaction --- */
.catalog-overlay-wrap { position:static; }
.catalog-overlay {
  display:none;
  position:fixed;
  z-index:75;
  top:92px;
  left:0;
  right:0;
  bottom:0;
  padding:28px 0 0;
  background:rgba(19, 20, 25, .58);
  backdrop-filter:blur(1px);
}
.catalog-overlay.open { display:block; }
.catalog-overlay .container { height:100%; }
.hero-grid { display:block; }
.hero-banner { min-height:392px; }
.catalog-overlay .mega-catalog,
.mega-catalog {
  display:flex;
  align-items:stretch;
  width:304px;
  min-height:392px;
  max-height:392px;
  max-width:calc(100vw - 48px);
  overflow:hidden;
  border:1px solid #e3e6ee;
  border-radius:12px;
  background:#fff;
  box-shadow:0 16px 35px rgba(9, 13, 23, .18);
  transition:width .16s ease;
}
.catalog-overlay .mega-catalog.has-second,
.mega-catalog.has-second { width:608px; }
.catalog-overlay .mega-catalog.has-third,
.mega-catalog.has-third { width:912px; }
.mega-col {
  display:none;
  flex:0 0 304px;
  min-width:304px;
  min-height:392px;
  max-height:392px;
  overflow-y:auto;
  background:#fff;
}
.mega-col.level-1 { display:block; }
.mega-catalog.has-second .mega-col.level-2 { display:block; }
.mega-catalog.has-third .mega-col.level-3 { display:block; }
.mega-col:not(:last-child) { border-right:1px solid #e8ebf2; }
.mega-col::-webkit-scrollbar { width:6px; }
.mega-col::-webkit-scrollbar-track { background:#f6f7fb; }
.mega-col::-webkit-scrollbar-thumb { border-radius:99px; background:#d6dbe6; }
.mega-item {
  width:100%;
  min-height:49px;
  padding:12px 14px;
  border:0;
  border-bottom:1px dashed #e5e8ef;
  border-radius:0;
  background:#fff;
  color:#303644;
  font:inherit;
  font-size:15px;
  line-height:1.28;
  text-align:left;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  box-shadow:none;
}
.mega-item .item-left { gap:12px; }
.mega-item i:first-child { color:#333a48; }
.mega-item:hover,
.mega-item.active { color:#191e29; background:#f5f6fa; }
.mega-item:hover .arrow,
.mega-item.active .arrow { color:var(--primary-dark); }
.mega-placeholder { padding:20px; color:#727c8f; line-height:1.55; }
@media (max-width:1050px) and (min-width:901px) {
  .catalog-overlay .mega-catalog.has-third,
  .mega-catalog.has-third { width:870px; }
  .mega-col { flex-basis:290px; min-width:290px; }
  .catalog-overlay .mega-catalog.has-second,
  .mega-catalog.has-second { width:580px; }
  .catalog-overlay .mega-catalog { width:290px; }
}
@media (max-width:900px) {
  .catalog-overlay { display:none !important; }
  .hero-grid { display:block; }
}


/* --- Permanent left category panel (desktop) --- */
.header-inner {
  grid-template-columns: auto minmax(300px, 1fr) auto auto auto;
  gap: 22px;
}
.hero-section { padding-top: 28px; }
.hero-grid {
  display: grid;
  grid-template-columns: 304px minmax(0, 1fr);
  align-items: start;
  gap: 22px;
  position: relative;
}
.hero-mega-catalog {
  grid-column: 1;
  grid-row: 1;
  position: relative;
  z-index: 12;
  margin: 0;
}
.hero-grid .hero-banner {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
}
.hero-mega-catalog.mega-catalog {
  width: 304px;
  max-width: none;
  min-height: 392px;
  max-height: 392px;
  display: flex;
  overflow: hidden;
  border: 1px solid #dfe4ee;
  border-radius: 14px;
  background: #fff;
  box-shadow: none;
  transition: width .16s ease;
}
.hero-mega-catalog.mega-catalog.has-second { width: 608px; }
.hero-mega-catalog.mega-catalog.has-third { width: 912px; }
.hero-mega-catalog .mega-col {
  flex: 0 0 304px;
  min-width: 304px;
  min-height: 392px;
  max-height: 392px;
  overflow-y: auto;
  background: #fff;
}
.hero-mega-catalog .mega-col.level-1 { display: block; }
.hero-mega-catalog.has-second .mega-col.level-2 { display:block; }
.hero-mega-catalog.has-third .mega-col.level-3 { display:block; }
.hero-mega-catalog.is-loading .mega-col { visibility:hidden; }
.hero-mega-catalog.is-loading::before {
  content:"";
  position:absolute;
  inset:16px;
  z-index:2;
  border-radius:10px;
  background:repeating-linear-gradient(to bottom,#eef1f6 0 14px,transparent 14px 48px);
  opacity:.85;
}
.hero-mega-catalog .mega-item { min-height: 48px; padding: 12px 16px; }
.hero-mega-catalog .mega-item:hover,
.hero-mega-catalog .mega-item.active { background: #f6f4fb; color: #1d2230; }
.hero-mega-catalog .mega-item.active .arrow { color: var(--primary); }
.hero-mega-catalog .mega-item i:first-child { color:#272d39; }
/* Header no longer contains Menu or Catalog controls. */
.square-btn, .nav-catalog { display:none !important; }

@media (max-width: 1200px) {
  .header-inner { grid-template-columns:auto minmax(240px, 1fr) auto auto; gap:14px; }
  .hero-grid { grid-template-columns: 304px minmax(0,1fr); }
  .hero-copy h1 { font-size:30px; }
  .hero-flex { grid-template-columns: .9fr 1.1fr; }
}
@media (max-width: 900px) {
  .header-inner { grid-template-columns:auto 1fr auto auto; gap:10px; }
  .hero-grid { grid-template-columns:1fr; }
  .hero-mega-catalog { grid-column:1; grid-row:auto; }
  .hero-grid .hero-banner { grid-column:1; grid-row:auto; }
  .hero-mega-catalog.mega-catalog,
  .hero-mega-catalog.mega-catalog.has-second,
  .hero-mega-catalog.mega-catalog.has-third { width:100%; max-width:100%; }
  .hero-mega-catalog .mega-col { flex-basis:100%; min-width:100%; }
  .hero-mega-catalog .mega-col.level-2,
  .hero-mega-catalog .mega-col.level-3 { display:none !important; }
  .hero-mega-catalog { min-height: auto; max-height: 390px; }
  .hero-mega-catalog .mega-col { min-height:auto; max-height:390px; }
}


/* Search kateqoriya seçimi */
.search-box { position:relative; z-index:95; }
.search-category-wrap { position:relative; display:flex; align-items:center; }
.search-filter { position:relative; z-index:2; }
.search-category-menu {
  position:absolute;
  top:48px;
  right:-4px;
  width:188px;
  display:none;
  padding:7px 12px 8px;
  background:#fff;
  border:1px solid #edf0f4;
  border-radius:0 0 12px 12px;
  box-shadow:0 14px 28px rgba(30,34,48,.13);
  overflow:hidden;
  z-index:120;
}
.search-category-wrap.open .search-category-menu { display:block; }
.search-category-option {
  width:100%;
  min-height:33px;
  padding:7px 7px;
  display:flex;
  align-items:center;
  gap:7px;
  text-align:left;
  color:#424955;
  font-size:14px;
  border:0;
  border-bottom:1px dashed #eceef3;
  background:transparent;
}
.search-category-option:last-child { border-bottom:0; }
.search-category-option:hover { color:var(--primary-dark); background:#faf8ff; }
.search-category-option i { color:#17b66a; font-size:13px; flex:0 0 13px; }
.search-category-option:not(.active) i { display:none; }
.search-category-option:not(.active) span { margin-left:20px; }
.search-category-option.active { color:#2c313b; }
.search-category-wrap.open .search-filter { color:var(--primary-dark); }
@media (max-width:900px) {
  .search-category-menu { right:-4px; top:45px; width:205px; max-height:calc(100vh - 125px); overflow-y:auto; }
}


/* --- Mobile header / layout refresh based on provided reference --- */
.mobile-utility-bar { display:none; }
.mobile-phone-more { display:none; }
.mobile-search { display:none; }

@media (max-width: 560px) {
  .site-header {
    border-top-width: 0;
    border-bottom: 1px solid #eceff4;
    position: sticky;
    top: 0;
    z-index: 90;
  }
  .mobile-utility-bar {
    display: grid;
    grid-template-columns: 48px 48px minmax(0, 1fr);
    gap: 8px;
    align-items: stretch;
    padding: 6px 0 8px;
    border-bottom: 1px solid #f0f2f6;
  }
  .mobile-quick {
    height: 48px;
    border-radius: 12px;
    background: #f7f8fb;
    color: #202633;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.05;
    border: 1px solid #edf0f4;
  }
  .mobile-quick i { font-size: 18px; }
  .mobile-quick.home {
    color: #eb7087;
    background: #fff7f9;
    border-color: #f4cfd8;
  }
  .mobile-search {
    display: flex;
    height: 48px;
    margin: 0;
    padding-left: 12px;
    border-radius: 12px;
    background: #f7f8fb;
  }
  .mobile-search input { font-size: 14px; }
  .mobile-search .search-filter,
  .mobile-search .search-submit {
    width: 40px;
    height: 40px;
  }
  .header-inner {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    min-height: auto;
    padding: 10px 0 12px;
  }
  .header-inner > .search-box { display: none !important; }
  .brand { min-width: 0; }
  .brand img { width: 136px; }
  .phone-nav {
    display: block;
    min-width: 0;
    text-align: right;
  }
  .phone-nav strong { font-size: 16px; letter-spacing: 0; }
  .phone-nav span { font-size: 11px; margin-top: 2px; }
  .mobile-phone-more {
    display: grid;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 50%;
    background: #f4f6fa;
    color: #424955;
  }
  .language-wrap,
  .cart-btn { display: none !important; }

  .hero-section { padding-top: 10px; }
  .hero-grid { display: block; }
  .hero-mega-catalog { display: none !important; }
  .hero-grid .hero-banner {
    width: 100%;
    min-height: auto;
    border-radius: 14px;
    padding: 12px 12px 28px;
  }
  .hero-banner::before { width: 220px; height: 220px; top: -110px; right: -110px; }
  .hero-banner::after { left: 20px; right: 20px; width: auto; bottom: 10px; }
  .hero-flex {
    grid-template-columns: 108px minmax(0, 1fr);
    gap: 12px;
    min-height: 0;
    text-align: left;
    align-items: center;
  }
  .hero-visual {
    justify-content: center;
    align-items: center;
  }
  .hero-visual .logo-card {
    width: 96px;
    max-width: 96px;
  }
  .hero-copy { align-items: flex-start; display: block; }
  .hero-copy h1 {
    font-size: 15px;
    line-height: 1.25;
    letter-spacing: -.2px;
    margin-bottom: 8px;
  }
  .hero-copy p {
    margin: 0 0 12px;
    font-size: 12px;
    line-height: 1.45;
    max-width: none;
  }
  .hero-copy .primary-btn {
    min-height: 36px;
    padding: 9px 14px;
    font-size: 13px;
    border-radius: 10px;
  }
  .hero-chips { display: none; }
  .hero-pager {
    left: 50%;
    bottom: 6px;
    gap: 7px;
  }
  .hero-pager i {
    width: 16px;
    height: 4px;
  }

  .benefits { padding: 12px 0 26px; }
  .benefits .container {
    overflow-x: auto;
    scrollbar-width: none;
  }
  .benefits .container::-webkit-scrollbar { display: none; }
  .benefit-grid {
    display: flex;
    gap: 12px;
    width: max-content;
    min-width: 100%;
  }
  .benefit-card {
    min-width: 290px;
    width: 290px;
    min-height: 108px;
    padding: 16px;
    gap: 14px;
    border-radius: 14px;
  }
  .benefit-icon {
    width: 46px;
    height: 46px;
    flex-basis: 46px;
    font-size: 20px;
  }
  .benefit-card h3 { font-size: 14px; margin: 2px 0 8px; }
  .benefit-card p { font-size: 12px; }

  .section { padding-bottom: 34px; }
  .section-head { margin-bottom: 14px; }
  .section-head h2 { font-size: 20px; }
  .section-head p { display: none; }
  .empty-state {
    min-height: 220px;
    padding: 22px 16px;
    border-radius: 14px;
  }
  .empty-graphic {
    width: 74px;
    height: 74px;
    margin-bottom: 14px;
    font-size: 28px;
  }
  .empty-state h3 { font-size: 18px; }
  .empty-state p { font-size: 13px; }

  .info-strip .container { padding: 18px 0; }
  .info-strip h2 { font-size: 18px; }

  .footer-main {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 28px 0 24px;
  }
  .footer-brand-pill { margin-bottom: 12px; }
  .footer-col h3 { font-size: 16px; }
  .footer-links { gap: 8px; font-size: 14px; }
  .footer-bottom {
    flex-direction: column;
    gap: 12px;
    padding: 12px 0 20px;
    text-align: center;
  }
  .payment-marks {
    justify-content: center;
    gap: 12px;
  }
  .payment-marks img {
    height: 26px;
    max-width: 84px;
    object-fit: contain;
  }
  .payment-marks img[alt="Birbank"] {
    height: 34px;
    max-width: 42px;
  }

  .floating-whatsapp {
    width: 58px;
    height: 58px;
    left: 16px;
    bottom: 16px;
    font-size: 24px;
  }
  .scroll-top {
    width: 44px;
    height: 44px;
    right: 16px;
    bottom: 86px;
  }
  .search-category-menu {
    top: 44px;
    right: -2px;
    width: 190px;
    max-height: calc(100vh - 110px);
  }
}


/* --- Final mobile alignment: match the requested two-row header and compact promo composition --- */
@media (max-width: 560px) {
  /* Stop the older tablet rule from pushing the mobile search to its own line. */
  .mobile-utility-bar .mobile-search {
    display: flex !important;
    order: 0 !important;
    grid-column: auto !important;
    min-width: 0 !important;
    width: 100% !important;
  }
  .mobile-utility-bar {
    grid-template-columns: 46px 46px minmax(0, 1fr) !important;
    min-height: 58px;
    gap: 7px;
    padding: 6px 0 7px;
    align-items: stretch;
  }
  .mobile-quick { width: 46px; height: 46px; min-width: 46px; }
  .mobile-search.search-box {
    height: 46px !important;
    min-height: 46px;
    align-self: stretch;
  }
  .mobile-search .search-filter,
  .mobile-search .search-submit { width: 36px; height: 40px; flex: 0 0 36px; }
  .mobile-search input { padding: 0 5px; font-size: 14px; }
  .mobile-search .search-category-wrap { flex: 0 0 36px; }

  /* Second header row exactly carries logo and phone; no extra blank space. */
  .header-inner {
    grid-template-columns: 138px minmax(0, 1fr) 30px !important;
    min-height: 86px !important;
    height: 86px !important;
    padding: 8px 0 !important;
    gap: 6px !important;
  }
  .brand img {
    width: 136px !important;
    max-height: 64px;
    object-fit: contain;
    object-position: left center;
  }
  .phone-nav { align-self: center; }
  .phone-nav strong { font-size: 15.5px !important; line-height: 1.1; white-space: nowrap; }
  .phone-nav span { font-size: 10.5px !important; white-space: nowrap; }
  .mobile-phone-more { width: 28px; height: 28px; }

  /* Compact white slider card with an image-left/text-right balance like the reference. */
  .hero-section { padding: 10px 0 22px !important; }
  .hero-grid { display: block !important; }
  .hero-grid .hero-banner {
    display: block !important;
    min-height: 202px !important;
    height: 202px;
    padding: 12px 13px 25px !important;
    overflow: hidden;
    border-radius: 12px !important;
    background: #fff !important;
    border-color: #e1e6ef !important;
    box-shadow: none !important;
  }
  .hero-banner::before { display: none !important; }
  .hero-banner::after {
    left: 15px !important;
    right: 15px !important;
    width: auto !important;
    height: 7px !important;
    bottom: 9px !important;
    background: linear-gradient(90deg,#f4f6fa 0%,#f4f6fa 74%,rgba(138,53,221,.22) 74%,rgba(138,53,221,.22) 100%) !important;
  }
  .hero-flex {
    display: grid !important;
    grid-template-columns: 52% 48% !important;
    height: 160px !important;
    min-height: 160px !important;
    align-items: center !important;
    gap: 0 !important;
    text-align: left !important;
  }
  .hero-visual { height: 160px; justify-content: center !important; align-items: center !important; }
  .hero-visual .logo-card {
    width: 116px !important;
    max-width: 116px !important;
    max-height: 138px;
    object-fit: contain;
    filter: drop-shadow(0 10px 12px rgba(74, 24, 132, .15));
  }
  .hero-copy {
    display: block !important;
    align-items: initial !important;
    padding: 0 2px 0 0;
  }
  .hero-copy h1 {
    margin: 0 0 10px !important;
    font-size: 13.5px !important;
    font-weight: 800;
    line-height: 1.24 !important;
    letter-spacing: -.12px !important;
    max-height: 51px;
    overflow: hidden;
  }
  .hero-copy p {
    margin: 0 0 13px !important;
    font-size: 10.5px !important;
    line-height: 1.42 !important;
    color: #596273 !important;
    max-height: 45px;
    overflow: hidden;
  }
  .hero-copy .primary-btn {
    min-height: 33px !important;
    min-width: 86px;
    padding: 7px 12px !important;
    border-radius: 8px !important;
    font-size: 10.5px !important;
    box-shadow: none !important;
  }
  .hero-pager { bottom: 8px !important; gap: 8px !important; }
  .hero-pager i { width: 18px !important; height: 4px !important; background:#f1f3f7 !important; }
  .hero-pager i.active { background: var(--primary) !important; }

  /* Keep the benefit strip in the same horizontal-card rhythm as the sample. */
  .benefits { padding: 0 0 28px !important; }
  .benefit-grid { gap: 12px !important; }
  .benefit-card {
    min-width: 292px !important;
    width: 292px !important;
    min-height: 106px !important;
    padding: 16px !important;
    border-radius: 12px !important;
  }
  .benefit-icon { background: #fff !important; color: #171a20 !important; }
  .benefit-card h3 { font-size: 14px !important; }
  .benefit-card p { font-size: 12px !important; }

  .payment-marks img[alt="Mastercard"] { height: 28px !important; width: 62px; }
  .payment-marks img[alt="VISA"] { height: 24px !important; width: 66px; }
  .payment-marks img[alt="Birbank"] { height: 30px !important; width: 30px; object-fit: contain; }

  /* Mobile featured-products slider should be a mini version of desktop, not a broken stacked block. */
  .hero-grid .product-hero-banner {
    min-height: auto !important;
    height: auto !important;
    padding: 12px 12px 14px !important;
    border-radius: 14px !important;
  }
  .product-hero-banner .hero-slider-head {
    margin-bottom: 8px !important;
    gap: 10px;
  }
  .product-hero-banner .hero-slider-title {
    font-size: 13px !important;
    line-height: 1.2;
  }
  .product-hero-banner .hero-nav-btn {
    width: 32px;
    height: 32px;
    border-radius: 10px;
  }
  .product-hero-banner .hero-slider-stage,
  .product-hero-banner .hero-slider-track {
    min-height: 210px !important;
  }
  .product-hero-banner .hero-product-slide,
  .product-hero-banner .hero-product-slide.media-right {
    grid-template-columns: minmax(112px, 42%) minmax(0, 58%) !important;
    gap: 12px !important;
    align-items: center !important;
  }
  .product-hero-banner .hero-product-slide.media-right .hero-slide-media,
  .product-hero-banner .hero-product-slide.media-left .hero-slide-media {
    order: 1 !important;
    justify-content: center !important;
  }
  .product-hero-banner .hero-product-slide.media-right .hero-slide-copy,
  .product-hero-banner .hero-product-slide.media-left .hero-slide-copy {
    order: 2 !important;
    padding: 8px 0 0 !important;
    max-width: 100% !important;
    align-self: start !important;
  }
  .product-hero-banner .hero-image-shell {
    min-height: 150px !important;
    padding: 8px !important;
    border-radius: 18px !important;
  }
  .product-hero-banner .hero-product-image {
    max-height: 138px !important;
    max-width: 100% !important;
  }
  .product-hero-banner .hero-slide-meta {
    gap: 6px;
    margin-bottom: 8px;
  }
  .product-hero-banner .hero-mini-tag {
    min-height: 23px;
    padding: 0 8px;
    font-size: 9.5px;
    gap: 5px;
  }
  .product-hero-banner .hero-slide-copy h2 {
    font-size: 14px !important;
    line-height: 1.22 !important;
    letter-spacing: -.15px !important;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .product-hero-banner .hero-slide-copy p {
    margin-top: 10px !important;
    font-size: 11px !important;
    line-height: 1.38 !important;
    max-width: 100% !important;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .product-hero-banner .hero-slide-price-wrap {
    margin-top: 12px !important;
    gap: 8px !important;
    align-items: center;
  }
  .product-hero-banner .hero-price-badge {
    min-width: 92px !important;
    min-height: 40px !important;
    padding: 0 14px !important;
    border-radius: 12px !important;
    font-size: 15px !important;
    box-shadow: 0 10px 16px rgba(138,53,221,.18) !important;
  }
  .product-hero-banner .hero-price-old {
    font-size: 11px !important;
  }
  .product-hero-banner .hero-slide-link {
    gap: 6px;
    font-size: 12px !important;
    white-space: nowrap;
  }
  .product-hero-banner .hero-slider-footer {
    gap: 6px;
    margin-top: 8px;
  }
  .product-hero-banner .hero-slider-dot {
    width: 18px;
    height: 5px;
  }
  .product-hero-banner .hero-slider-dot.is-active {
    width: 14px;
  }
  .product-hero-banner .hero-slider-status {
    font-size: 11px;
  }
}


/* Inline mobile shortcut icons */
.mobile-svg-icon {
  width: 18px;
  height: 18px;
  display: block;
  flex: 0 0 18px;
}
.mobile-quick.home .mobile-svg-icon {
  color: #ef768d;
}
.mobile-quick.menu-shortcut .mobile-svg-icon {
  color: #1f2430;
}
@media (max-width: 560px) {
  .mobile-quick {
    gap: 4px;
  }
  .mobile-quick .mobile-svg-icon {
    width: 18px;
    height: 18px;
  }
  .mobile-quick.home {
    color: #ef768d;
  }
  .mobile-quick.menu-shortcut {
    color: #252a35;
  }
}


/* Mobile icon refinement + contact dropdown panel */
.mobile-contact-panel { display:none; }
@media (max-width: 560px) {
  .mobile-quick {
    border-radius: 14px;
    border: 1px solid #e8eaf0;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
  }
  .mobile-quick.home {
    background: #fff5f7;
    border-color: #efc6cf;
    color: #eb758c;
  }
  .mobile-quick.menu-shortcut {
    background: #f8f9fb;
    color: #252a35;
  }
  .mobile-quick span {
    font-size: 9.5px;
    font-weight: 700;
    line-height: 1.05;
  }
  .mobile-svg-icon { width: 17px; height: 17px; }
  .mobile-phone-more {
    position: relative;
    transition: transform .18s ease;
  }
  .mobile-phone-more.open i { transform: rotate(180deg); }

  .mobile-contact-panel {
    position: fixed;
    top: 108px;
    right: 0;
    width: min(220px, calc(100vw - 6px));
    z-index: 85;
    display: none;
  }
  .mobile-contact-panel.open { display:block; }
  .mobile-contact-card {
    background: rgba(255,255,255,.98);
    border-left: 1px solid #eceff4;
    border-top: 1px solid #eceff4;
    border-bottom: 1px solid #eceff4;
    border-radius: 0 0 0 0;
    box-shadow: 0 12px 26px rgba(14,22,34,.10);
    overflow: hidden;
  }
  .mobile-contact-topline {
    padding: 14px 16px 10px;
    font-size: 12px;
    line-height: 1.45;
    color: #333a47;
    border-bottom: 1px dashed #e9ecf3;
  }
  .mobile-contact-line {
    display: block;
    padding: 9px 16px;
    color: #2b313b;
    border-bottom: 1px dashed #e9ecf3;
    font-size: 14px;
  }
  .mobile-contact-action {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    padding: 0 16px;
    color: #303744;
    border-bottom: 1px dashed #e9ecf3;
    background: #fff;
  }
  .mobile-contact-action:last-child { border-bottom: 0; }
  .mobile-contact-icon {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    font-size: 14px;
    flex: 0 0 28px;
  }
  .mobile-contact-icon.call { color: #f4a33a; }
  .mobile-contact-icon.whatsapp { color: #25d366; }
  .mobile-contact-icon.telegram { color: #29a8eb; }
  .mobile-contact-icon.tiktok { color: #111; }
  .mobile-contact-icon.instagram {
    color: #d83e8d;
  }
}


/* Final mobile header matching: two compact action tiles + contact drawer */
@media (max-width:560px) {
  .mobile-utility-bar {
    grid-template-columns: 48px 48px minmax(0,1fr) !important;
    gap: 7px !important;
    padding: 6px 0 7px !important;
  }
  .mobile-quick {
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    padding: 4px 2px !important;
    border-radius: 12px !important;
    justify-content: center !important;
  }
  .mobile-quick.home {
    background: #fff7f9 !important;
    border: 1px solid #f4cad3 !important;
  }
  .mobile-quick.menu-shortcut {
    background: #f7f8fb !important;
    border: 1px solid #e7eaf0 !important;
  }
  .mobile-quick .mobile-svg-icon {
    width: 18px !important;
    height: 18px !important;
  }
  .mobile-quick.home .mobile-svg-icon { color:#ec7188 !important; }
  .mobile-quick.menu-shortcut .mobile-svg-icon { color:#242934 !important; }
  .mobile-quick span {
    text-align:center;
    font-size:8.5px !important;
    line-height:1.05 !important;
    letter-spacing:-.1px;
  }
  .mobile-phone-more {
    width: 30px !important;
    height: 30px !important;
    border-radius: 50% !important;
    background:#f3f5f9 !important;
  }
  .mobile-phone-more i { transition:transform .18s ease; }
  .mobile-phone-more.open i { transform:rotate(180deg); }
  .mobile-contact-panel {
    top: 126px !important;
    right: 0 !important;
    width: 220px !important;
    z-index: 150 !important;
  }
  .mobile-contact-card {
    border-left:1px solid #e9edf4 !important;
    border-top:1px solid #e9edf4 !important;
    border-bottom:1px solid #e9edf4 !important;
    border-radius: 0 !important;
    box-shadow: -12px 13px 28px rgba(25,31,42,.10) !important;
  }
  .mobile-contact-topline {
    padding: 14px 16px 9px !important;
    font-size: 12px !important;
    line-height:1.5 !important;
  }
  .mobile-contact-line { min-height: 35px; padding: 8px 16px !important; font-size: 14px !important; }
  .mobile-contact-action { min-height: 40px !important; padding: 0 16px !important; font-size: 15px !important; }
  .mobile-contact-icon { width: 27px !important; height: 27px !important; font-size: 21px !important; }
}


/* Mobile horizontal-scroll containment: only benefit cards may slide sideways. */
@media (max-width: 560px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  .site-header,
  .page,
  .site-footer {
    width: 100%;
    max-width: 100vw;
    overflow-x: clip;
  }

  .benefits {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
  }

  .benefits .container {
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
    margin-inline: auto !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-x: contain;
    touch-action: pan-x;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .benefits .container::-webkit-scrollbar {
    display: none;
  }

  .benefit-grid {
    width: max-content !important;
    min-width: max-content !important;
    padding-right: 12px;
    scroll-snap-type: x mandatory;
  }

  .benefit-card {
    flex: 0 0 292px !important;
    scroll-snap-align: start;
  }
}


/* Final mobile contact-button and dropdown behaviour */
.mobile-phone-more { display:none; }
.contact-chevron { width:17px; height:17px; display:block; transition:transform .18s ease; }
@media (max-width:560px) {
  .mobile-phone-more {
    display:grid !important;
    place-items:center;
    width:30px !important;
    height:30px !important;
    flex:0 0 30px;
    margin:0;
    padding:0;
    border:1px solid #edf0f4 !important;
    border-radius:50% !important;
    background:#f5f7fb !important;
    color:#313946 !important;
    box-shadow:none !important;
    line-height:1;
  }
  .mobile-phone-more:hover { background:#eef1f6 !important; }
  .mobile-phone-more.open .contact-chevron { transform:rotate(180deg); }

  .mobile-contact-panel {
    position:fixed !important;
    top:auto !important;
    right:0 !important;
    width:min(220px, calc(100vw - 4px)) !important;
    max-height:calc(100dvh - 12px);
    z-index:999 !important;
    display:block !important;
    visibility:hidden;
    opacity:0;
    pointer-events:none;
    transform:translateX(12px) translateY(-4px);
    transition:opacity .18s ease, transform .18s ease, visibility .18s ease;
  }
  .mobile-contact-panel.open {
    visibility:visible !important;
    opacity:1;
    pointer-events:auto;
    transform:translateX(0) translateY(0);
  }
  .mobile-contact-card {
    max-height:calc(100dvh - 12px);
    overflow-y:auto;
    overscroll-behavior:contain;
    border:1px solid #e8ecf3 !important;
    border-right:0 !important;
    border-radius:12px 0 0 12px !important;
    background:#fff !important;
    box-shadow:-14px 16px 34px rgba(18,25,37,.16) !important;
  }
  .mobile-contact-topline {
    padding:13px 15px 10px !important;
    color:#3d4552 !important;
    background:#fff;
  }
  .mobile-contact-line {
    min-height:34px;
    padding:8px 15px !important;
    font-size:13.5px !important;
  }
  .mobile-contact-action {
    min-height:40px !important;
    padding:0 14px !important;
    gap:9px !important;
    font-size:14.5px !important;
  }
  .mobile-contact-icon { width:28px !important; height:28px !important; font-size:20px !important; }
}


/* Benefits mobile carousel: the scrollable layer is separated from the card track. */
.benefits-viewport { width:100%; }
@media (max-width:560px) {
  .benefits {
    width:100% !important;
    max-width:100% !important;
    overflow:visible !important;
  }
  .benefits-viewport {
    width:100vw !important;
    max-width:100vw !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-x !important;
    scrollbar-width:none;
    scroll-snap-type:x mandatory;
    padding-left:12px;
    padding-right:0;
  }
  .benefits-viewport::-webkit-scrollbar { display:none; }
  .benefits .benefits-viewport > .container.benefit-grid {
    display:flex !important;
    flex-wrap:nowrap !important;
    width:max-content !important;
    min-width:max-content !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 12px 0 0 !important;
    gap:12px !important;
    overflow:visible !important;
    scroll-snap-type:none !important;
  }
  .benefits .benefits-viewport .benefit-card {
    flex:0 0 calc(100vw - 86px) !important;
    width:calc(100vw - 86px) !important;
    min-width:calc(100vw - 86px) !important;
    scroll-snap-align:start;
    scroll-snap-stop:always;
  }
}


/* Mobile top shortcut icons enlarged and replaced with real icon-font icons */
.mobile-fa-icon { display:none; }
@media (max-width: 560px) {
  .mobile-svg-icon { display:none !important; }
  .mobile-fa-icon {
    display:block;
    font-size: 20px;
    line-height: 1;
    width: 20px;
    height: 20px;
    text-align: center;
  }
  .mobile-utility-bar {
    grid-template-columns: 54px 54px minmax(0, 1fr);
    gap: 10px;
  }
  .mobile-quick {
    height: 54px;
    min-width: 54px;
    padding: 5px 2px 4px;
    gap: 4px;
    border-radius: 14px;
  }
  .mobile-quick span {
    font-size: 9.5px !important;
    line-height: 1.08;
    letter-spacing: 0;
  }
  .mobile-quick.home .mobile-fa-icon { color:#ea7089 !important; }
  .mobile-quick.menu-shortcut .mobile-fa-icon { color:#232833 !important; font-size:18px; }
}


/* Exact mobile shortcut icons to match reference */
.mobile-ref-icon { display:none; }
@media (max-width: 560px) {
  .mobile-fa-icon, .mobile-svg-icon { display:none !important; }
  .mobile-ref-icon {
    display:block;
    width:20px;
    height:20px;
    flex:0 0 20px;
  }
  .mobile-quick {
    justify-content:center;
    align-items:center;
    gap:4px;
    padding-top:6px;
    padding-bottom:5px;
  }
  .mobile-quick.home {
    color:#ef758c;
    background:#fff7f8;
    border-color:#efcbd2;
  }
  .mobile-quick.menu-shortcut {
    color:#272c37;
    background:#f4f5f8;
    border-color:#e5e8ef;
  }
  .mobile-quick.home .mobile-ref-icon {
    width:19px;
    height:19px;
    color:#ef758c;
  }
  .mobile-quick.menu-shortcut .mobile-ref-icon {
    width:18px;
    height:18px;
    color:#2b303b;
  }
  .mobile-quick span {
    font-size:9.5px !important;
    font-weight:700;
    line-height:1.04;
  }
}


/* Final mobile drawer matching left-side reference and purple theme */
.drawer-tool { width:40px; height:40px; border:0; border-radius:10px; background:#f4f6fb; color:#353b47; }
.drawer-head-tools { display:flex; align-items:center; gap:10px; }
.drawer-lang-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-bottom:18px; }
.drawer-lang-pill { border:0; border-radius:10px; background:#f6f7fb; padding:10px 12px 8px; text-align:center; color:#394253; }
.drawer-lang-top { display:inline-flex; align-items:center; gap:8px; font-weight:700; }
.drawer-lang-pill small { display:block; margin-top:4px; font-size:10px; color:#8b94a6; font-weight:700; }
.drawer-shortcuts { border-top:1px dashed #e8ecf3; }
.drawer-shortcut { border-bottom:1px dashed #e8ecf3; }
.drawer-section-btn { width:100%; border:0; background:transparent; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 0; color:#272d39; font-size:14px; font-weight:700; text-align:left; }
.drawer-section-left { display:flex; align-items:center; gap:12px; min-width:0; }
.drawer-section-icon { width:36px; height:36px; border-radius:10px; display:grid; place-items:center; background:var(--primary-soft); color:var(--primary); box-shadow: inset 0 0 0 1px var(--primary-line); flex:0 0 36px; font-size:16px; }
.drawer-section-icon.primary { background:linear-gradient(135deg,var(--primary) 0%, var(--accent) 100%); color:#fff; box-shadow:none; }
.drawer-section-panel { display:none; padding:0 0 14px 6px; }
.drawer-shortcut.open .drawer-section-panel { display:block; }
.drawer-inline-contact { display:grid; gap:10px; padding-left:44px; }
.drawer-inline-contact a { color:#555f71; }
.drawer-inline-contact strong { color:#1a1d24; }
.drawer-info-block { padding:20px 0 8px; }
.drawer-info-block h4 { margin:0 0 10px; font-size:16px; }
.drawer-info-block p { margin:0; color:#677285; font-size:14px; line-height:1.55; }
.drawer-info-block ul { list-style:none; padding:0; margin:0; display:grid; gap:8px; }
.drawer-info-block li { color:#303848; font-size:14px; }
.drawer-info-block li span { color:var(--primary); margin-right:6px; }
.drawer-body .drawer-node { border-bottom:1px dashed #edf0f5; }
.drawer-body .drawer-toggle { padding:12px 0; font-size:14px; }
.drawer-body .drawer-toggle .item-left { gap:10px; }
.drawer-body .drawer-children { padding:0 0 8px 8px; }

@media (max-width:560px) {
  .mobile-quick.home {
    background:#f7f1ff !important;
    border-color:#dac4fb !important;
    color:var(--primary) !important;
  }
  .mobile-quick.home .mobile-ref-icon { color:var(--primary) !important; }
  .mobile-quick.menu-shortcut {
    background:#f5f6fa !important;
    border-color:#dde2ec !important;
    color:#272c37 !important;
  }
  .drawer-backdrop { z-index:96; }
  .catalog-drawer { z-index:97; width:min(303px, 78vw); box-shadow:14px 0 30px rgba(12,17,28,.16); }
  .drawer-head { padding:16px 18px; }
  .drawer-head strong { font-size:18px; }
  .drawer-close { width:38px; height:38px; border-radius:9px; background:#f6f7fb; color:#373d49; }
  .drawer-body { padding:12px 18px 24px; }
  .drawer-section-btn { padding:18px 0; font-size:15px; }
  .drawer-section-icon { width:34px; height:34px; border-radius:9px; font-size:15px; }
}


/* Final mobile shortcut icon cleanup */
@media (max-width:560px) {
  .mobile-utility-bar {
    grid-template-columns: 56px 56px minmax(0, 1fr) !important;
    gap: 10px !important;
    padding: 6px 0 10px !important;
  }
  .mobile-quick {
    height: 56px !important;
    min-width: 56px !important;
    padding: 6px 3px 5px !important;
    gap: 5px !important;
    border-radius: 14px !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.82);
  }
  .mobile-ref-icon {
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    flex: 0 0 22px !important;
  }
  .mobile-quick.home {
    background:#f7f1ff !important;
    border-color:#dac4fb !important;
    color:var(--primary) !important;
  }
  .mobile-quick.menu-shortcut {
    background:#f5f6fa !important;
    border-color:#dde2ec !important;
    color:#272c37 !important;
  }
  .mobile-quick.home .mobile-ref-icon { color:var(--primary) !important; }
  .mobile-quick.menu-shortcut .mobile-ref-icon { color:#242a35 !important; }
  .mobile-quick span {
    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 1.08 !important;
    letter-spacing: -.01em;
  }
  .mobile-quick.home span { color:var(--primary) !important; }
  .mobile-quick.menu-shortcut span { color:#242a35 !important; }
}


/* Inline SVG icon system for the category menus */
.category-menu-icon {
  width:20px;
  height:20px;
  min-width:20px;
  flex:0 0 20px;
  color:#313947;
  display:block;
  stroke-width:1.85;
}
.menu-chevron {
  width:17px;
  height:17px;
  min-width:17px;
  flex:0 0 17px;
  color:#3b4251;
  display:block;
}
.mega-item:hover .category-menu-icon,
.mega-item.active .category-menu-icon,
.mega-item:hover .menu-chevron,
.mega-item.active .menu-chevron {
  color:inherit;
}
.drawer-toggle .category-menu-icon { color:#333a48; }
.drawer-toggle .menu-chevron { color:#394253; }

/* Home page: keep the banner exactly level with the fixed category panel. */
@media (min-width: 901px) {
  .hero-grid {
    --home-panel-height: 392px;
  }

  /* Only the right banner is constrained; the left category panel keeps its existing height. */
  .hero-grid .hero-banner {
    height: var(--home-panel-height);
    min-height: var(--home-panel-height);
    max-height: var(--home-panel-height);
    padding: 24px 28px 30px;
  }

  .hero-grid .hero-flex {
    height: calc(var(--home-panel-height) - 54px);
    min-height: 0;
    grid-template-columns: .85fr 1.15fr;
    gap: 18px;
  }

  .hero-grid .hero-visual {
    min-height: 0;
  }

  .hero-grid .hero-visual .logo-card {
    width: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
  }

  .hero-grid .hero-copy h1 {
    font-size: 30px;
    line-height: 1.12;
  }

  .hero-grid .hero-copy p {
    margin: 11px 0 14px;
    font-size: 15px;
  }

  .hero-grid .primary-btn {
    min-height: 44px;
    padding: 11px 18px;
  }

  .hero-grid .hero-chips {
    gap: 8px;
    margin-top: 12px;
  }

  .hero-grid .hero-chip {
    padding: 8px 11px;
    font-size: 12px;
  }
}

/* Homepage service benefits — icon-first, borderless layout */
.benefits {
  padding: 24px 0 38px !important;
}

.benefit-grid {
  gap: 26px !important;
}

.benefit-card {
  min-height: 0 !important;
  padding: 10px 12px 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 12px !important;
  text-align: center !important;
}

/* The icon circle remains the same size; only the SVG/font icon itself grows. */
.benefit-icon {
  width: 56px !important;
  height: 56px !important;
  flex: 0 0 56px !important;
  border-radius: 50% !important;
  font-size: 26px !important;
}

.benefit-card > div:last-child {
  width: 100%;
  max-width: 210px;
}

.benefit-card h3 {
  margin: 0 0 6px !important;
  font-size: 16px !important;
  line-height: 1.28 !important;
}

.benefit-card p {
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.48 !important;
}

@media (max-width: 560px) {
  .benefits {
    padding: 18px 0 28px !important;
    overflow: visible !important;
  }

  .benefits-viewport {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    padding: 0 12px !important;
  }

  .benefits .benefits-viewport > .container.benefit-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 auto !important;
    padding: 0 !important;
    gap: 22px 10px !important;
    overflow: visible !important;
  }

  .benefits .benefits-viewport .benefit-card {
    width: auto !important;
    min-width: 0 !important;
    flex: initial !important;
    padding: 4px 4px 8px !important;
    gap: 10px !important;
  }

  .benefits .benefits-viewport .benefit-card:last-child {
    grid-column: 1 / -1;
    width: calc(50% - 5px) !important;
    justify-self: center;
  }

  /* Hide only the trust-guarantee benefit on phone-sized screens. */
  .benefits .benefits-viewport .mobile-hidden-benefit {
    display: none !important;
  }

  .benefit-icon {
    width: 52px !important;
    height: 52px !important;
    flex-basis: 52px !important;
    font-size: 24px !important;
  }

  .benefit-card h3 {
    font-size: 13px !important;
    line-height: 1.3 !important;
  }

  .benefit-card p {
    font-size: 11.5px !important;
    line-height: 1.42 !important;
  }
}

/* === Dynamic catalogue, product page and protected admin panel (2026-06-25) === */
.section-link { display:inline-flex; align-items:center; gap:8px; color:var(--primary-dark); font-weight:800; padding:10px 0; }
.section-link:hover { color:var(--primary); }
.product-grid { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:18px; }
.product-card { min-width:0; min-height:100%; border:1px solid #e3e8f1; border-radius:16px; background:#fff; overflow:hidden; display:flex; flex-direction:column; transition:.2s ease; }
.product-card:hover { box-shadow:0 16px 34px rgba(22,30,45,.10); transform:translateY(-2px); border-color:#d8ddee; }
.product-image-wrap { position:relative; height:214px; display:block; background:#fff; padding:12px; overflow:hidden; }
.product-image-wrap img { width:100%; height:100%; object-fit:contain; transition:.25s ease; }
.product-card:hover .product-image-wrap img { transform:scale(1.04); }
.product-badges { position:absolute; z-index:2; left:11px; top:11px; display:grid; justify-items:start; gap:6px; }
.product-badge { display:inline-flex; min-height:22px; align-items:center; padding:3px 9px; border-radius:4px; color:#fff; font-size:9px; font-weight:800; letter-spacing:.12px; }
.product-badge.new { background:#5279c4; }.product-badge.popular { background:#42ad79; }.product-badge.sale { background:#e04e64; }
.product-card-body { display:flex; flex-direction:column; flex:1; padding:5px 16px 16px; }
.product-stock { display:block; min-height:25px; font-size:12px; font-weight:600; }.product-stock.in { color:#35aa67; }.product-stock.out { color:#c85c63; }.product-stock i { font-size:9px; margin-right:4px; }
.product-card-title { display:block; color:#252a34; font-size:14px; line-height:1.45; font-weight:600; min-height:61px; }.product-card-title:hover { color:var(--primary); }
.product-card-bottom { display:flex; align-items:flex-end; justify-content:space-between; gap:10px; margin-top:auto; padding-top:16px; }
.product-price { display:block; font-size:18px; line-height:1.1; }.product-old-price { display:block; font-size:15px; color:#8791a2; text-decoration:line-through; margin-top:4px; line-height:1.2; }
.product-cart-mini { width:38px; height:38px; border:0; flex:0 0 38px; border-radius:10px; background:var(--primary-soft); color:var(--primary-dark); }.product-cart-mini:hover { background:var(--primary); color:#fff; }.product-cart-mini:disabled { cursor:not-allowed; opacity:.4; }
.catalog-loading { grid-column:1/-1; min-height:210px; display:grid; place-items:center; color:#697488; font-weight:600; }.catalog-loading i { margin-right:8px; color:var(--primary); }
.dynamic-empty { grid-column:1/-1; min-height:270px; }.storefront-products-section { padding-top:12px; }
.catalog-page { padding-bottom:54px; }.catalog-page-head { display:flex; justify-content:space-between; gap:20px; align-items:end; }.catalog-page-head .page-title { margin-bottom:6px; }.catalog-active-filter { margin:0; color:var(--primary-dark); font-weight:700; min-height:23px; }
.catalog-page-search { display:flex; align-items:center; height:46px; border:1px solid #dde3ee; border-radius:12px; overflow:hidden; min-width:min(100%, 410px); background:#fff; }.catalog-page-search i { padding-left:15px; color:#7b8494; }.catalog-page-search input { height:100%; min-width:0; flex:1; border:0; outline:0; padding:0 10px; }.catalog-page-search button { height:100%; padding:0 17px; border:0; background:var(--primary); color:#fff; font-weight:700; }
.catalog-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:22px 0 14px; }.catalog-toolbar h2 { font-size:20px; margin:0; }.catalog-admin-link { color:#737f94; font-size:13px; font-weight:700; }.catalog-admin-link:hover { color:var(--primary); }
.product-page { padding-bottom:20px; }.product-breadcrumb { padding-top:22px; }.product-breadcrumb span { margin:0 5px; color:#8490a3; }.product-page-title { font-size:25px; line-height:1.3; font-weight:600; margin:16px 0 18px; letter-spacing:-.45px; }
.product-section-tabs { position:sticky; top:88px; z-index:25; display:flex; align-items:center; gap:4px; min-height:58px; padding:7px 12px; margin-bottom:14px; border:1px solid #edf0f5; border-radius:10px; background:rgba(247,248,252,.97); box-shadow:0 5px 13px rgba(27,35,50,.04); }.product-section-tabs a { padding:12px 16px; border-radius:8px; color:#262d39; font-size:13px; font-weight:600; }.product-section-tabs a.active,.product-section-tabs a:hover { background:#fff; box-shadow:0 4px 12px rgba(22,30,45,.08); color:var(--primary-dark); }.product-section-tabs sup { font-size:9px; }
.product-detail-card { border:1px solid #e2e7f0; border-radius:12px; background:#fff; overflow:hidden; }.product-detail-grid { display:grid; grid-template-columns:1.02fr .98fr; min-height:500px; }.product-detail-grid>div+div { border-left:1px solid #e8ecf2; }
.product-gallery { height:100%; min-height:500px; display:grid; grid-template-columns:126px 1fr; }.product-thumbs { padding:26px 13px; display:grid; align-content:start; gap:12px; border-right:1px solid #eef1f5; max-height:500px; overflow:auto; }.product-thumb { border:1px solid transparent; background:#fff; height:72px; padding:5px; border-radius:9px; opacity:.76; }.product-thumb.active,.product-thumb:hover { border-color:var(--primary); opacity:1; }.product-thumb img { width:100%; height:100%; object-fit:contain; }.product-main-media { min-width:0; min-height:500px; padding:28px; display:grid; place-items:center; background:#fff; }.product-main-media img { width:100%; height:100%; max-height:450px; object-fit:contain; }
.product-buy-panel { padding:34px 28px 24px; }.product-topline { display:flex; justify-content:space-between; gap:16px; padding-bottom:13px; color:#586477; font-size:13px; border-bottom:1px solid #e8ecf3; }.product-topline strong { color:#232a35; }.brand-accent { color:var(--primary) !important; }.product-stock-line { display:inline-flex; align-items:center; gap:7px; padding:8px 12px; margin:15px 0 25px; border-radius:5px; font-size:13px; font-weight:600; }.product-stock-line.in { color:#28995a; background:#effaf3; }.product-stock-line.out { color:#bf5353; background:#fff1f1; }.product-price-row { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-bottom:25px; border-bottom:1px solid #e8ecf3; }.price-caption { display:block; color:#697587; font-size:13px; margin-bottom:2px; }.product-detail-price { display:block; font-size:27px; line-height:1.15; }.product-price-row del { display:block; margin-top:6px; color:#929cac; font-size:13px; }.quantity-control { display:flex; flex-direction:column; align-items:center; overflow:hidden; border:1px solid #dfe5ee; border-radius:9px; }.quantity-control button { width:34px; height:25px; border:0; background:#fff; color:#394250; font-size:18px; line-height:1; }.quantity-control button:hover { background:#f6f2fb; color:var(--primary); }.quantity-control strong { padding:2px 11px; font-size:13px; }
.product-buy-actions { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:23px; }
.product-secondary-actions { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:16px; }
.add-to-cart-btn,.product-call-btn,.product-whatsapp-btn,.product-credit-btn { min-height:49px; border-radius:9px; display:flex; align-items:center; justify-content:center; gap:9px; font-size:14px; font-weight:800; }.add-to-cart-btn { border:0; background:var(--primary); color:#fff; }.add-to-cart-btn:hover { filter:brightness(.96); }.add-to-cart-btn:disabled { opacity:.45; cursor:not-allowed; }.product-call-btn { border:1px solid #edf0f5; background:#fbfbfd; color:#252c38; }.product-call-btn:hover { border-color:var(--primary-line); color:var(--primary); }.product-whatsapp-btn { background:#25d366; color:#fff; }.product-whatsapp-btn:hover { filter:brightness(.96); }
.product-credit-btn { color:#fff; background:linear-gradient(135deg,#ee4b5d 0%, #cf3649 100%); box-shadow:0 12px 24px rgba(207,54,73,.22); }
.product-credit-btn:hover { filter:brightness(.97); }
.product-benefits { display:grid; gap:20px; padding-top:25px; margin-top:25px; border-top:1px solid #e8ecf3; }.product-benefits>div { display:flex; align-items:center; gap:13px; }.product-benefits>div>span { width:45px; height:45px; flex:0 0 45px; display:grid; place-items:center; border-radius:50%; background:#f6f8fc; color:#222b38; font-size:18px; }.product-benefits p { margin:0; display:grid; gap:2px; }.product-benefits strong { font-size:14px; }.product-benefits small { color:#7b8698; font-size:12px; }
.product-content-box { padding:28px; margin-top:28px; border:1px solid #e2e7f0; border-radius:12px; background:#fff; }.product-content-box h2 { font-size:20px; margin:0 0 17px; }.product-rich-text { color:#3e4858; line-height:1.75; }.product-muted { margin:0; color:#778397; }.feature-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px 26px; padding:0; margin:0; list-style:none; }.feature-list li { display:flex; gap:9px; color:#3f4a59; }.feature-list i { color:#36a567; padding-top:4px; font-size:12px; }.related-section { padding-top:22px; }.product-page-loading { min-height:550px; }


/* Keep only the active admin screen visible.
   The HTML `hidden` attribute must override the layout display rules below. */
.admin-login-shell[hidden],
.admin-app[hidden] {
  display: none !important;
}

.admin-body { min-height:100vh; background:#f5f7fb; color:#1f2937; font-size:14px; }.admin-body * { box-sizing:border-box; }.admin-body button,.admin-body input,.admin-body textarea,.admin-body select { font:inherit; }.admin-login-shell { min-height:100vh; display:grid; place-items:center; padding:28px; background:radial-gradient(circle at 12% 18%,#f0e6ff 0,transparent 34%),radial-gradient(circle at 88% 80%,#ffe3f5 0,transparent 36%),#f7f8fc; }.admin-login-card { width:min(100%,470px); padding:42px; border:1px solid #eaedf3; border-radius:22px; background:rgba(255,255,255,.94); box-shadow:0 22px 60px rgba(38,27,73,.12); }.admin-login-brand { display:block; width:180px; margin-bottom:34px; }.admin-login-brand img,.admin-logo img { width:100%; height:auto; }.admin-eyebrow { display:inline-flex; align-items:center; gap:7px; color:var(--primary-dark); background:var(--primary-soft); padding:6px 9px; border-radius:7px; font-size:11px; font-weight:800; letter-spacing:.3px; text-transform:uppercase; }.admin-login-card h1 { margin:15px 0 9px; font-size:30px; letter-spacing:-1px; }.admin-login-card>p { margin:0; color:#667184; line-height:1.65; }.admin-login-form { display:grid; gap:9px; margin-top:28px; }.admin-login-form label,.admin-field>span { color:#3e4859; font-size:13px; font-weight:700; }.admin-field>span b { color:#d34e5d; }.admin-password-input { display:flex; align-items:center; gap:10px; height:50px; border:1px solid #dde3ed; border-radius:10px; padding:0 14px; background:#fff; }.admin-password-input:focus-within { border-color:#b86aee; box-shadow:0 0 0 3px #f5ebff; }.admin-password-input i { color:#8490a2; }.admin-password-input input { width:100%; border:0; outline:0; }.admin-primary-btn,.admin-secondary-btn { min-height:44px; border-radius:10px; border:0; display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:0 16px; font-weight:800; }.admin-primary-btn { background:linear-gradient(135deg,var(--primary),#bf4bd6); color:#fff; box-shadow:0 10px 20px rgba(138,53,221,.18); }.admin-primary-btn:hover { filter:brightness(.98); }.admin-primary-btn:disabled { cursor:not-allowed; opacity:.65; }.admin-secondary-btn { background:#f1f3f8; color:#465164; }.admin-form-error { min-height:19px; margin:0; color:#c74e5b; font-size:12px; font-weight:600; }.admin-back-link { display:inline-flex; align-items:center; gap:8px; margin-top:24px; color:#6d788a; font-weight:600; }.admin-back-link:hover { color:var(--primary); }
.admin-app { min-height:100vh; display:grid; grid-template-columns:254px minmax(0,1fr); }.admin-sidebar { position:sticky; top:0; height:100vh; display:flex; flex-direction:column; padding:26px 16px 18px; background:#fff; border-right:1px solid #e4e8f0; }.admin-logo { display:block; width:155px; margin:0 10px 40px; }.admin-nav-label { margin:0 12px 10px; color:#9aa4b3; font-size:10px; font-weight:800; letter-spacing:.8px; }.admin-nav { display:grid; gap:5px; }.admin-nav-item { height:46px; width:100%; border:0; border-radius:10px; background:transparent; color:#596477; display:flex; align-items:center; gap:12px; padding:0 13px; text-align:left; font-weight:700; }.admin-nav-item i { width:20px; font-size:16px; }.admin-nav-item b { margin-left:auto; min-width:22px; padding:2px 6px; border-radius:999px; text-align:center; color:#7f8999; background:#f1f3f7; font-size:11px; }.admin-nav-item:hover,.admin-nav-item.active { background:var(--primary-soft); color:var(--primary-dark); }.admin-nav-item.active b { background:#fff; color:var(--primary); }.admin-sidebar-bottom { display:grid; gap:9px; margin-top:auto; padding:16px 9px 0; border-top:1px solid #edf0f4; }.admin-store-link,.admin-logout { display:inline-flex; align-items:center; gap:10px; border:0; background:transparent; padding:7px 0; color:#667284; font-weight:600; text-align:left; }.admin-store-link:hover { color:var(--primary); }.admin-logout { color:#bc5961; }.admin-content { min-width:0; padding:0 32px 40px; }.admin-topbar { min-height:106px; display:flex; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid #e2e7ef; }.admin-topbar-kicker { margin:0 0 3px; color:#8994a4; font-size:12px; font-weight:700; }.admin-topbar h1 { margin:0; font-size:27px; letter-spacing:-.8px; }.admin-topbar-actions { display:flex; align-items:center; gap:13px; }.admin-icon-btn { width:40px; height:40px; border:1px solid #e0e5ed; border-radius:10px; background:#fff; color:#535f71; }.admin-icon-btn:hover,.admin-icon-btn.loading { color:var(--primary); }.admin-icon-btn.loading i { animation:adminspin .8s linear infinite; }.admin-status { display:inline-flex; align-items:center; gap:7px; color:#37a969; font-size:12px; font-weight:700; }.admin-status i { font-size:8px; }.admin-summary-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; padding:28px 0; }.admin-summary-grid article { padding:18px 20px; background:#fff; border:1px solid #e6eaf1; border-radius:14px; }.admin-summary-grid span { display:block; color:#7b8697; font-size:12px; font-weight:600; }.admin-summary-grid strong { display:block; margin-top:5px; font-size:25px; letter-spacing:-.5px; }.admin-panel { border:1px solid #e3e8f0; border-radius:15px; background:#fff; overflow:hidden; }.admin-panel-head { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:23px; border-bottom:1px solid #edf0f4; }.admin-panel-head h2 { margin:0; font-size:19px; }.admin-panel-head p { margin:4px 0 0; color:#7b8594; font-size:12px; }.admin-table-tools { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 23px; border-bottom:1px solid #edf0f4; }.admin-search { width:min(100%,360px); height:40px; display:flex; align-items:center; gap:9px; padding:0 12px; border:1px solid #e0e5ed; border-radius:9px; color:#8994a4; }.admin-search:focus-within { border-color:#c68aef; box-shadow:0 0 0 3px #f7effe; }.admin-search input { width:100%; border:0; outline:0; }.admin-table-note { color:#8792a3; font-size:12px; }.admin-table-wrap { overflow:auto; }.admin-table { width:100%; min-width:760px; border-collapse:collapse; }.admin-table th { padding:13px 16px; background:#fafbfc; color:#8390a0; font-size:10px; font-weight:800; letter-spacing:.35px; text-align:left; text-transform:uppercase; }.admin-table td { padding:14px 16px; border-top:1px solid #edf0f5; color:#566172; vertical-align:middle; }.admin-table td strong { color:#2b3442; }.admin-product-cell { display:flex; align-items:center; gap:12px; min-width:210px; }.admin-product-cell img { width:48px; height:48px; flex:0 0 48px; padding:4px; object-fit:contain; border:1px solid #edf0f4; border-radius:8px; }.admin-product-cell strong,.admin-product-cell small { display:block; }.admin-product-cell strong { max-width:245px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.admin-product-cell small,.admin-old-price { margin-top:3px; color:#9aa4b2; font-size:11px; }.admin-old-price { display:block; text-decoration:line-through; }.admin-stock,.admin-status-pill { display:inline-flex; align-items:center; min-height:25px; padding:3px 8px; border-radius:999px; font-size:11px; font-weight:700; }.admin-stock.in,.admin-status-pill.published { background:#edfaf1; color:#2b9f5f; }.admin-stock.out,.admin-status-pill.draft { background:#f5f6f8; color:#788395; }.admin-row-actions { display:flex; justify-content:flex-end; gap:6px; }.admin-row-actions button,.admin-category-meta button { width:32px; height:32px; border:1px solid #e6eaf0; border-radius:8px; background:#fff; color:#647083; }.admin-row-actions button:hover,.admin-category-meta button:hover { color:var(--primary); border-color:#d9baef; }.admin-row-actions button.danger:hover,.admin-category-meta button.danger:hover { color:#d05662; border-color:#f1c8cd; }.admin-empty { display:grid; justify-items:center; gap:7px; padding:58px 28px; text-align:center; }.admin-empty>i { font-size:34px; color:#b56aea; }.admin-empty h3 { margin:4px 0 0; font-size:18px; }.admin-empty p { max-width:440px; margin:0; color:#7a8697; line-height:1.6; }.admin-category-tree { padding:14px 20px 22px; }.admin-category-node { --depth:0; }.admin-category-row { min-height:62px; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:9px 0 9px calc(var(--depth) * 28px); border-bottom:1px solid #eef1f5; }.admin-category-name { display:flex; align-items:center; gap:11px; min-width:0; }.admin-category-name>i { color:#b06be5; }.admin-category-name strong,.admin-category-name small { display:block; }.admin-category-name small { margin-top:2px; color:#9aa3b1; font-size:11px; }.admin-category-meta { display:flex; align-items:center; gap:7px; }.admin-category-meta>span { margin-right:8px; color:#8490a0; font-size:11px; }.admin-modal-open { overflow:hidden; }.admin-modal { position:fixed; inset:0; z-index:400; display:none; padding:22px; background:rgba(16,22,35,.48); overflow:auto; }.admin-modal.open { display:grid; place-items:center; }.admin-modal-card { width:min(100%,700px); max-height:calc(100dvh - 44px); overflow:auto; border-radius:17px; background:#fff; box-shadow:0 24px 70px rgba(17,22,35,.25); }.admin-product-editor-card { width:min(100%,960px); }.admin-modal-head { position:sticky; top:0; z-index:2; display:flex; align-items:center; justify-content:space-between; padding:20px 24px; border-bottom:1px solid #edf0f5; background:#fff; }.admin-modal-head h2 { margin:5px 0 0; font-size:21px; }.admin-modal-close { width:38px; height:38px; border:0; border-radius:9px; background:#f4f6fa; color:#5b6678; }.admin-modal-close:hover { background:#f7ecfd; color:var(--primary); }.admin-product-form,.admin-category-form { padding:22px 24px 0; }.admin-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }.admin-field { display:grid; gap:7px; }.admin-field.full { grid-column:1/-1; }.admin-field input,.admin-field select,.admin-field textarea { width:100%; border:1px solid #dfe5ed; border-radius:9px; outline:0; padding:11px 12px; color:#2d3745; background:#fff; resize:vertical; }.admin-field input:focus,.admin-field select:focus,.admin-field textarea:focus { border-color:#bd79e9; box-shadow:0 0 0 3px #f7edff; }.admin-field small { color:#8892a0; font-size:11px; line-height:1.45; }.admin-fieldset { border:1px solid #e5e9f0; border-radius:11px; margin:22px 0; padding:15px 16px; }.admin-fieldset legend { padding:0 6px; color:#435064; font-size:12px; font-weight:800; }.admin-toggle-grid { display:flex; flex-wrap:wrap; gap:8px; }.admin-check { display:inline-flex; align-items:center; gap:7px; min-height:34px; padding:0 10px; border:1px solid #e0e5ec; border-radius:8px; color:#536073; font-size:12px; font-weight:700; cursor:pointer; }.admin-check:has(input:checked) { border-color:#d3acef; color:var(--primary-dark); background:#fbf6ff; }.admin-check input { accent-color:var(--primary); }.status-field { width:220px; margin-top:16px; }.admin-image-section { padding:2px 0 22px; }.admin-image-section h3 { margin:0; font-size:15px; }.admin-image-section p { margin:4px 0 14px; color:#8892a0; font-size:12px; }.admin-upload-area { min-height:114px; display:grid; justify-items:center; align-content:center; gap:4px; border:1.5px dashed #cfafeb; border-radius:11px; background:#fcf9ff; color:#785492; cursor:pointer; }.admin-upload-area:hover,.admin-upload-area.dragging { background:#f6edff; border-color:#a758df; }.admin-upload-area input { position:absolute; width:1px; height:1px; opacity:0; }.admin-upload-area i { font-size:22px; color:var(--primary); }.admin-upload-area strong { font-size:13px; }.admin-upload-area span { color:#8c7997; font-size:11px; }.admin-image-preview { display:flex; flex-wrap:wrap; gap:10px; padding-top:13px; }.admin-preview-image { position:relative; width:94px; height:94px; padding:4px; border:1px solid #e2e7ee; border-radius:9px; background:#fff; }.admin-preview-image img { width:100%; height:100%; object-fit:contain; }.admin-preview-image button { position:absolute; top:-7px; right:-7px; width:23px; height:23px; border:0; border-radius:50%; background:#d55462; color:#fff; font-size:11px; }.admin-preview-image span { position:absolute; bottom:4px; left:4px; right:4px; padding:3px; color:#fff; background:rgba(32,39,50,.7); font-size:9px; text-align:center; border-radius:4px; }.admin-image-empty { margin:12px 0 0; color:#9aa4b2; font-size:12px; }.category-active-check { margin-top:16px; }.admin-modal-foot { position:sticky; bottom:0; z-index:2; display:flex; justify-content:flex-end; gap:10px; margin:22px -24px 0; padding:15px 24px; border-top:1px solid #edf0f5; background:#fff; }.admin-category-form .admin-modal-foot { margin-top:22px; }.admin-toast { position:fixed; right:22px; bottom:22px; z-index:500; max-width:min(420px,calc(100% - 44px)); padding:13px 16px; border-radius:10px; background:#2caa69; color:#fff; box-shadow:0 15px 35px rgba(21,44,33,.22); opacity:0; transform:translateY(12px); pointer-events:none; transition:.2s; font-size:13px; font-weight:700; }.admin-toast.show { opacity:1; transform:translateY(0); }.admin-toast.error { background:#d15762; }@keyframes adminspin { to { transform:rotate(360deg); } }
@media (max-width:1050px) { .product-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.admin-content { padding:0 22px 32px; }.admin-app { grid-template-columns:215px minmax(0,1fr); }.admin-summary-grid { grid-template-columns:repeat(2,1fr); }.product-detail-grid { grid-template-columns:1fr; }.product-detail-grid>div+div { border-left:0; border-top:1px solid #e8ecf2; } }
@media (max-width:720px) { .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.product-image-wrap { height:166px; }.product-card-body { padding:4px 11px 12px; }.product-card-title { font-size:12px; min-height:54px; }.product-price { font-size:15px; }.catalog-page-head,.catalog-toolbar { align-items:flex-start; flex-direction:column; }.catalog-page-search { width:100%; }.product-page-title { font-size:20px; }.product-section-tabs { top:73px; overflow:auto; padding:6px; }.product-section-tabs a { padding:10px 12px; white-space:nowrap; }.product-gallery { min-height:350px; grid-template-columns:82px 1fr; }.product-thumbs { padding:15px 8px; }.product-thumb { height:57px; }.product-main-media { min-height:350px; padding:16px; }.product-buy-panel { padding:21px 16px; }.product-topline { flex-direction:column; gap:5px; }.product-buy-actions,.product-secondary-actions { grid-template-columns:1fr; }.product-content-box { padding:20px 16px; margin-top:18px; }.feature-list { grid-template-columns:1fr; }.admin-app { grid-template-columns:1fr; }.admin-sidebar { position:static; height:auto; padding:14px 16px; border-right:0; border-bottom:1px solid #e4e8f0; }.admin-logo { width:120px; margin:0 0 14px; }.admin-nav-label,.admin-sidebar-bottom { display:none; }.admin-nav { display:flex; }.admin-nav-item { flex:1; height:42px; justify-content:center; padding:0 8px; }.admin-nav-item span { font-size:12px; }.admin-nav-item b { display:none; }.admin-content { padding:0 14px 28px; }.admin-topbar { min-height:75px; }.admin-topbar h1 { font-size:21px; }.admin-status { display:none; }.admin-summary-grid { gap:10px; padding:14px 0; }.admin-summary-grid article { padding:13px; }.admin-summary-grid strong { font-size:20px; }.admin-panel-head,.admin-table-tools { padding:16px; }.admin-panel-head { align-items:flex-start; flex-direction:column; }.admin-table-tools { align-items:stretch; flex-direction:column; }.admin-search { width:100%; }.admin-category-tree { padding:10px 13px 18px; }.admin-category-row { padding-left:calc(var(--depth) * 16px); }.admin-category-meta>span { display:none; }.admin-category-meta button { width:28px; height:28px; }.admin-modal { padding:10px; }.admin-modal-card { max-height:calc(100dvh - 20px); }.admin-modal-head,.admin-product-form,.admin-category-form { padding-left:16px; padding-right:16px; }.admin-form-grid { grid-template-columns:1fr; gap:13px; }.admin-field.full { grid-column:auto; }.admin-modal-foot { margin-left:-16px; margin-right:-16px; padding-left:16px; padding-right:16px; }.admin-login-shell { padding:16px; }.admin-login-card { padding:28px 22px; }.admin-login-card h1 { font-size:26px; }.admin-login-brand { width:150px; margin-bottom:25px; } }
@media (max-width:430px) { .product-grid { grid-template-columns:1fr 1fr; }.product-image-wrap { height:142px; }.product-badge { font-size:8px; padding:3px 6px; }.product-stock { font-size:10px; }.product-card-title { font-size:11px; }.product-cart-mini { width:33px; height:33px; flex-basis:33px; }.admin-nav-item i { display:none; }.admin-nav-item { font-size:12px; }.admin-summary-grid { grid-template-columns:1fr 1fr; }.admin-panel-head .admin-primary-btn { width:100%; } }

/* Admin login and dashboard are deliberately isolated pages. */
.admin-login-page { min-height:100vh; overflow:hidden; }
.admin-panel-page { min-height:100vh; background:#f5f7fb; }
.admin-panel-page #adminApp[hidden] { display:none !important; }

/* ================================================================
   Functional cart: right-side drawer + full shopping cart page
   ================================================================ */
body.cart-open { overflow:hidden; }
.cart-backdrop { position:fixed; inset:0; z-index:110; background:rgba(18,20,32,.48); opacity:0; visibility:hidden; transition:opacity .22s ease, visibility .22s ease; }
.cart-backdrop.show { opacity:1; visibility:visible; }
.cart-drawer { position:fixed; inset:0 0 0 auto; z-index:111; width:min(430px,100vw); height:100dvh; display:flex; flex-direction:column; background:#fff; box-shadow:-20px 0 48px rgba(24,16,52,.18); transform:translateX(103%); transition:transform .28s cubic-bezier(.2,.8,.2,1); }
.cart-drawer.open { transform:translateX(0); }
.cart-drawer-head { min-height:76px; padding:0 20px 0 28px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); background:linear-gradient(90deg,#fff 0%,#fcfaff 100%); }
.cart-drawer-head strong { font-size:20px; letter-spacing:-.25px; color:var(--ink); }
.cart-drawer-close { width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--line); border-radius:9px; color:#363d4a; background:#fff; transition:.18s ease; }
.cart-drawer-close:hover { color:var(--primary); border-color:var(--primary-line); background:var(--primary-soft); }
.cart-drawer-body { min-height:0; height:100%; display:flex; flex-direction:column; }
.cart-drawer-scroll { padding:4px 18px 22px; overflow:auto; }
.cart-drawer-item { position:relative; display:grid; grid-template-columns:66px minmax(0,1fr); gap:14px; padding:20px 26px 20px 4px; border-bottom:1px dashed #e7eaf1; }
.cart-remove-btn { position:absolute; left:0; top:22px; width:20px; height:28px; display:grid; place-items:center; border:0; color:#596275; background:transparent; font-size:14px; }
.cart-remove-btn:hover { color:#c23d5d; }
.cart-item-image { width:66px; height:66px; display:grid; place-items:center; border-radius:10px; overflow:hidden; background:#f8f9fc; }
.cart-item-image img { width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }
.cart-item-copy { min-width:0; display:grid; gap:5px; }
.cart-item-name { color:var(--ink); font-size:14px; font-weight:800; line-height:1.34; padding-right:4px; }
.cart-item-name:hover,.cart-page-name:hover { color:var(--primary); }
.cart-item-sku,.cart-page-copy > span { color:#7b869a; font-size:11px; }
.cart-item-bottom { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:5px; }
.cart-item-bottom strong { color:var(--ink); white-space:nowrap; font-size:14px; }
.cart-quantity { display:inline-grid; grid-template-columns:28px 26px 28px; align-items:center; min-height:32px; border:1px solid #e4e8f0; border-radius:8px; overflow:hidden; background:#fff; }
.cart-quantity button { min-height:30px; padding:0; border:0; color:#344051; background:#f9fafc; font-size:10px; }
.cart-quantity button:hover { color:var(--primary); background:var(--primary-soft); }
.cart-quantity span { text-align:center; font-weight:800; font-size:13px; color:var(--ink); }
.cart-drawer-footer { margin-top:auto; padding:18px; border-top:1px solid var(--line); background:#fff; box-shadow:0 -12px 28px rgba(27,31,45,.04); }
.cart-drawer-footer p { margin:0 0 16px; color:#545f73; text-align:right; font-size:13px; }
.cart-drawer-footer p strong { color:var(--ink); }
.cart-drawer-actions { display:grid; grid-template-columns:1.15fr .85fr; gap:12px; }
.cart-primary-action,.cart-secondary-action { min-height:49px; padding:0 15px; display:inline-flex; align-items:center; justify-content:center; gap:8px; border-radius:9px; font-weight:800; font-size:14px; text-align:center; transition:.18s ease; }
.cart-primary-action { border:0; color:#fff; background:linear-gradient(135deg,var(--primary) 0%,var(--accent) 100%); box-shadow:0 12px 24px rgba(138,53,221,.22); }
.cart-primary-action:hover { filter:brightness(.98); transform:translateY(-1px); }
.cart-secondary-action { color:var(--primary-dark); border:1px solid var(--primary-line); background:var(--primary-soft); }
.cart-secondary-action:hover { color:#fff; background:var(--primary); border-color:var(--primary); }
.cart-drawer-empty { min-height:100%; display:grid; place-items:center; align-content:center; gap:10px; padding:60px 36px; text-align:center; }
.cart-empty-art { width:128px; height:128px; margin:0 auto 10px; border-radius:50%; display:grid; place-items:center; color:var(--primary); background:radial-gradient(circle at 35% 28%,#fff 0 13%,transparent 14%), linear-gradient(135deg,var(--primary-soft),var(--accent-soft)); box-shadow:inset 0 0 0 1px var(--primary-line); font-size:47px; }
.cart-drawer-empty h3 { margin:0; font-size:19px; color:var(--ink); }
.cart-drawer-empty p { margin:0; color:var(--muted); }
.cart-empty-link { margin-top:10px; padding:12px 18px; border-radius:9px; color:var(--primary-dark); border:1px solid var(--primary-line); background:var(--primary-soft); font-weight:800; }
.cart-empty-link:hover { color:#fff; border-color:var(--primary); background:var(--primary); }

.cart-page { padding-bottom:58px; }
.cart-page-grid { display:grid; grid-template-columns:minmax(0,1fr) 318px; gap:24px; align-items:start; }
.cart-page-list { display:grid; gap:14px; }
.cart-page-item { position:relative; min-height:140px; display:grid; grid-template-columns:84px minmax(200px,1fr) auto minmax(145px,auto) 38px; align-items:center; gap:20px; padding:20px 18px 20px 24px; border:1px solid var(--line); border-radius:13px; background:#fff; box-shadow:0 7px 18px rgba(24,31,47,.025); }
.cart-page-image { width:84px; height:84px; padding:6px; display:grid; place-items:center; border-radius:10px; background:#fafbfe; }
.cart-page-image img { width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }
.cart-page-copy { min-width:0; display:grid; gap:9px; }
.cart-page-name { color:var(--ink); font-size:14px; font-weight:800; line-height:1.4; }
.cart-page-quantity { justify-self:center; }
.cart-page-price { display:grid; gap:5px; justify-items:end; text-align:right; }
.cart-page-price span { color:#5f6a7e; font-size:12px; }
.cart-page-price strong { font-size:16px; color:var(--ink); }
.cart-page-delete { align-self:start; justify-self:end; width:34px; height:34px; display:grid; place-items:center; border:0; border-radius:8px; background:#fafbfe; color:#5d6677; }
.cart-page-delete:hover { color:#c23d5d; background:#fff2f4; }
.cart-summary-card { position:sticky; top:106px; padding:18px; border:1px solid var(--line); border-radius:13px; background:#fff; box-shadow:0 12px 28px rgba(25,31,52,.045); }
.cart-next-label { display:block; margin-bottom:10px; color:#465165; font-size:14px; }
.cart-next-select { width:100%; height:42px; padding:0 13px; border:1px solid #e8ebf1; outline:0; border-radius:8px; color:#263044; background:#fbfcfe; }
.cart-next-select:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(138,53,221,.1); }
.cart-summary-line { display:flex; justify-content:space-between; gap:14px; padding:16px 0 11px; color:#596376; font-size:14px; }
.cart-summary-line strong { color:var(--ink); }
.cart-summary-line.total { padding:12px 0 18px; border-top:1px solid var(--line); color:var(--ink); font-weight:800; }
.cart-summary-line.total strong { font-size:16px; }
.cart-checkout-page { width:100%; }
.cart-clear-action { width:100%; min-height:40px; margin-top:9px; border:0; border-radius:9px; color:#687386; background:transparent; font-size:13px; font-weight:700; }
.cart-clear-action:hover { color:#c23d5d; background:#fff2f4; }
.cart-summary-note { margin:13px 0 0; color:#8892a4; font-size:11px; line-height:1.5; text-align:center; }
.cart-page-empty { min-height:380px; padding:56px 24px; display:grid; justify-items:center; align-content:center; text-align:center; border:1px solid var(--line); border-radius:16px; background:#fff; }
.cart-page-empty h2 { margin:0; font-size:24px; }
.cart-page-empty p { margin:10px 0 22px; color:var(--muted); }

@media (max-width:900px) {
  .cart-page-grid { grid-template-columns:1fr; }
  .cart-summary-card { position:static; }
}
@media (max-width:650px) {
  .cart-drawer-head { min-height:64px; padding:0 14px 0 18px; }
  .cart-drawer-head strong { font-size:18px; }
  .cart-drawer-item { grid-template-columns:58px minmax(0,1fr); gap:11px; padding-right:18px; }
  .cart-item-image { width:58px; height:58px; }
  .cart-drawer-actions { grid-template-columns:1fr; }
  .cart-page { padding-bottom:34px; }
  .cart-page-item { grid-template-columns:66px minmax(0,1fr) 34px; align-items:start; gap:13px; padding:16px; }
  .cart-page-image { width:66px; height:66px; }
  .cart-page-quantity { grid-column:2; grid-row:2; justify-self:start; }
  .cart-page-price { grid-column:2 / 4; grid-row:3; justify-items:start; text-align:left; padding-top:5px; }
  .cart-page-delete { grid-column:3; grid-row:1; }
  .cart-summary-card { padding:16px; }
}


/* Birmarket catalogue sync controls */
.admin-panel-head-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}.birmarket-sync-btn{border-color:#d9baef!important;color:var(--primary-dark)!important;background:#fbf6ff!important}.birmarket-sync-btn:hover{background:#f5eafe!important;border-color:#bf82e9!important}.birmarket-sync-status{margin:8px 0 0!important;color:#7a8697!important;font-size:12px!important;line-height:1.5}.admin-secondary-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 15px;border:1px solid #dfe5ed;border-radius:9px;background:#fff;color:#526074;font-size:12px;font-weight:800;cursor:pointer}.admin-secondary-btn:hover{border-color:#d1a8ee;color:var(--primary-dark);background:#fcf8ff}.admin-secondary-btn:disabled{opacity:.72;cursor:wait}@media (max-width:720px){.admin-panel-head-actions{width:100%;justify-content:stretch}.admin-panel-head-actions .admin-primary-btn,.admin-panel-head-actions .admin-secondary-btn{flex:1;min-width:0;padding:0 10px}}@media (max-width:430px){.admin-panel-head-actions{display:grid;grid-template-columns:1fr}.admin-panel-head-actions .admin-primary-btn,.admin-panel-head-actions .admin-secondary-btn{width:100%}}


/* Full Birmarket catalogue pager */
.catalog-pagination { min-height:52px; margin:28px 0 8px; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 0; color:#667085; font-size:14px; font-weight:650; }
.catalog-pagination-actions { display:flex; align-items:center; gap:10px; }
.catalog-page-button { min-height:38px; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:0 13px; border:1px solid #d8deea; border-radius:10px; color:#273246; background:#fff; font-weight:800; transition:.18s ease; }
.catalog-page-button:hover { border-color:var(--primary); color:var(--primary); transform:translateY(-1px); }
.catalog-page-button.disabled { opacity:.45; pointer-events:none; }
.catalog-page-current { min-width:68px; text-align:center; color:#273246; font-weight:850; }
@media (max-width:620px) { .catalog-pagination { align-items:flex-start; flex-direction:column; gap:12px; }.catalog-pagination-actions { width:100%; justify-content:space-between; }.catalog-page-button { flex:1; padding:0 9px; }.catalog-page-current { min-width:56px; } }


/* Birmarket transfer panel — CompGarage-style preview/import flow */
.birmarket-import-panel { max-width: 1280px; }
.birmarket-source-chip { display:inline-flex; align-items:center; gap:.5rem; padding:.55rem .8rem; border:1px solid #e0e7f0; background:#f7f9fc; color:#243b53; border-radius:999px; font-size:.84rem; font-weight:700; white-space:nowrap; }
.birmarket-import-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:8px 0 16px; }
.birmarket-import-card { display:grid; grid-template-columns:auto 1fr auto; gap:14px; align-items:center; border:1px solid #e5ebf3; background:#fff; border-radius:14px; padding:16px; }
.birmarket-missing-card { grid-column:1 / -1; }
.birmarket-import-card > i { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; color:#245bd6; background:#edf3ff; font-size:1.12rem; }
.birmarket-import-card strong,.birmarket-preview-product strong { display:block; color:#1d2d3f; font-size:.94rem; }
.birmarket-import-card span { display:block; margin-top:4px; color:#718096; font-size:.82rem; line-height:1.4; }
.birmarket-import-status { display:flex; align-items:flex-start; gap:9px; color:#425466; background:#f7f9fc; border:1px solid #e7edf5; border-radius:12px; padding:13px 15px; font-size:.9rem; line-height:1.45; }
.birmarket-import-status > i { color:#2f64d6; margin-top:2px; }
.birmarket-preview { margin-top:16px; border-top:1px solid #edf1f5; padding-top:16px; }
.birmarket-preview-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:14px; }
.birmarket-preview-summary article { background:#f8fafc; border:1px solid #e7edf5; border-radius:12px; padding:13px; }
.birmarket-preview-summary strong { display:block; color:#172b4d; font-size:1.35rem; font-weight:800; }
.birmarket-preview-summary span { color:#718096; font-size:.78rem; }
.birmarket-preview-products { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.birmarket-preview-product { min-width:0; border:1px solid #e7edf5; border-radius:12px; overflow:hidden; background:#fff; }
.birmarket-preview-product img { width:100%; aspect-ratio:1/1; object-fit:contain; padding:8px; background:#fff; display:block; }
.birmarket-preview-product div { border-top:1px solid #eef2f6; padding:9px; }
.birmarket-preview-product strong { min-height:34px; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; font-size:.77rem; line-height:1.35; }
.birmarket-preview-product span { display:block; color:#1658c0; font-size:.8rem; font-weight:700; margin-top:5px; }
.birmarket-preview-product s { color:#8a97a8; font-weight:500; }
.birmarket-import-note { display:flex; align-items:flex-start; gap:8px; margin:16px 0 0; color:#718096; font-size:.8rem; line-height:1.45; }
.birmarket-import-note i { color:#2f64d6; margin-top:2px; }
@media (max-width: 980px) { .birmarket-preview-products { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width: 700px) { .birmarket-import-grid { grid-template-columns:1fr; } .birmarket-import-card { grid-template-columns:auto 1fr; } .birmarket-import-card button { grid-column:1 / -1; width:100%; } .birmarket-preview-summary { grid-template-columns:1fr; } .birmarket-preview-products { grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* Direct Birmarket catalogue source field */
.birmarket-source-field { margin:4px 0 16px; padding:14px 16px; border:1px solid #e5ebf3; border-radius:14px; background:#fbfcff; }
.birmarket-source-field input { width:100%; min-height:44px; border:1px solid #dbe3ef; border-radius:10px; padding:0 12px; color:#25364d; background:#fff; font:600 .9rem/1.2 Inter,Arial,sans-serif; }
.birmarket-source-field input:focus { outline:0; border-color:#aa65e8; box-shadow:0 0 0 3px #f2e8ff; }
.birmarket-source-field small { color:#718096; font-size:.78rem; line-height:1.45; }
.birmarket-source-field code { color:#4e2a8a; font-weight:700; }

/* Birmarketdən oxunan real xüsusiyyətlərin məhsul səhifəsində cədvəl görnüşü */
.product-feature-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 22px; }
.product-feature-row { display:grid; grid-template-columns:minmax(120px,.95fr) minmax(0,1.05fr); gap:14px; align-items:start; padding:13px 15px; border-radius:10px; background:#f7f8fc; color:#475569; font-size:.94rem; line-height:1.45; }
.product-feature-row span { color:#62708a; }
.product-feature-row strong { color:#24324a; font-weight:600; }
.birmarket-details-card > i { color:#9a39df; background:#f7edff; }
@media (max-width:700px) { .product-feature-grid { grid-template-columns:1fr; gap:8px; } .product-feature-row { grid-template-columns:1fr; gap:4px; } }

/* AI ilə məhsul mətni yaradılması üçün import kartı */
.birmarket-ai-copy-card > i { color:#7b2fd4; background:#f3eaff; }
.birmarket-ai-copy-card .admin-primary-btn { white-space:nowrap; }


/* Explicit Birmarket clean-reset action */
.birmarket-reset-card { border-color:#f3d2d7; background:#fffafb; }
.birmarket-reset-card > i { color:#c43b53; background:#fff0f2; }
.admin-danger-btn { border:1px solid #d6445f; background:#d6445f; color:#fff; box-shadow:0 8px 18px rgba(214,68,95,.18); }
.admin-danger-btn:hover { background:#ba314a; border-color:#ba314a; }
.admin-danger-btn:disabled { opacity:.62; cursor:not-allowed; }

/* Catalogue category sidebar like the reference market layout */
.catalog-layout {
  display: grid;
  grid-template-columns: 290px minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}
.catalog-main-panel { min-width: 0; }
.catalog-side-nav {
  position: sticky;
  top: 96px;
  z-index: 2;
}
.catalog-side-card {
  width: 100%;
  padding: 12px 10px;
  border: 1px solid #e5eaf3;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 26px rgba(22, 30, 45, .04);
}
.catalog-side-card-loading { min-height: 96px; display: grid; align-items: center; }
.catalog-side-loading {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 10px;
  color: #697386;
  font-size: 13px;
  font-weight: 700;
}
.catalog-side-all,
.catalog-side-link,
.catalog-side-summary {
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  padding: 9px 12px;
  border-radius: 9px;
  color: #151a24;
  font-size: 13px;
  line-height: 1.25;
  font-weight: 600;
  text-decoration: none;
  transition: background .16s ease, color .16s ease, box-shadow .16s ease;
}
.catalog-side-all { margin-bottom: 5px; background: #f5f6fa; }
.catalog-side-all span { display: inline-flex; align-items: center; gap: 8px; }
.catalog-side-label {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex: 1;
}
.catalog-side-icon {
  width: 18px;
  height: 18px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 18px;
  color: #677184;
  font-size: 13px;
}
.catalog-side-text {
  min-width: 0;
  overflow-wrap: anywhere;
}
.catalog-side-list { display: grid; gap: 3px; }
.catalog-side-item { display: block; }
.catalog-side-item details,
.catalog-side-item summary { list-style: none; }
.catalog-side-item summary::-webkit-details-marker { display: none; }
.catalog-side-item.level-1 > .catalog-side-link,
.catalog-side-item.level-1 > .catalog-side-summary {
  background: #f5f6fa;
  font-weight: 650;
}
.catalog-side-item.level-2 > .catalog-side-link,
.catalog-side-item.level-2 > .catalog-side-summary {
  min-height: 33px;
  padding: 7px 10px 7px 12px;
  color: #242b38;
  font-size: 12.5px;
  font-weight: 550;
  background: transparent;
}
.catalog-side-item.level-3 > .catalog-side-link,
.catalog-side-item.level-3 > .catalog-side-summary {
  min-height: 31px;
  padding: 6px 10px 6px 14px;
  color: #4d5868;
  font-size: 12px;
  font-weight: 500;
  background: transparent;
}
.catalog-side-summary { cursor: pointer; }
.catalog-side-summary a {
  min-width: 0;
  flex: 1;
  color: inherit;
  text-decoration: none;
}
.catalog-side-link,
.catalog-side-summary a {
  min-width: 0;
}
.catalog-side-link span,
.catalog-side-summary a {
  overflow-wrap: anywhere;
}
.catalog-side-chevron {
  width: 18px;
  height: 18px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 18px;
  color: #677184;
  font-size: 11px;
  transition: transform .16s ease, color .16s ease;
}
.catalog-side-item[open] > .catalog-side-summary .catalog-side-chevron { transform: rotate(180deg); }
.catalog-side-children {
  display: grid;
  gap: 1px;
  padding: 5px 0 6px 10px;
}
.catalog-side-item.level-2 > .catalog-side-children { padding-left: 12px; }
.catalog-side-all:hover,
.catalog-side-link:hover,
.catalog-side-summary:hover {
  background: #f0f2f7;
  color: var(--primary);
}
.catalog-side-all.active,
.catalog-side-item.active > .catalog-side-link,
.catalog-side-item.active > .catalog-side-summary {
  background: #f5efff;
  color: var(--primary-dark);
  box-shadow: inset 3px 0 0 var(--primary);
}
.catalog-side-item.active > .catalog-side-link .catalog-side-icon,
.catalog-side-item.active > .catalog-side-summary .catalog-side-icon {
  color: var(--primary-dark);
}
.catalog-side-item[open].level-1 > .catalog-side-summary {
  background: #f5f6fa;
  color: #151a24;
}
.catalog-side-item.active[open].level-1 > .catalog-side-summary {
  background: #f5efff;
  color: var(--primary-dark);
}
.catalog-layout .catalog-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

@media (min-width: 1380px) {
  .catalog-layout .catalog-product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 1050px) {
  .catalog-layout {
    grid-template-columns: 250px minmax(0, 1fr);
    gap: 20px;
  }
  .catalog-layout .catalog-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .catalog-layout { grid-template-columns: 1fr; }
  .catalog-side-nav {
    position: static;
    top: auto;
  }
  .catalog-side-card {
    max-height: 330px;
    overflow: auto;
  }
  .catalog-layout .catalog-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Mobile footer alignment: keep every footer section centered on narrow screens. */
@media (max-width: 560px) {
  .site-footer .footer-main {
    text-align: center;
  }

  .site-footer .footer-col {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .site-footer .footer-brand-pill {
    margin-left: auto;
    margin-right: auto;
  }

  .site-footer .footer-links,
  .site-footer .contact-lines {
    width: 100%;
    justify-items: center;
    text-align: center;
  }

  .site-footer .socials {
    width: 100%;
    justify-content: center;
  }
}


/* === Alternating animated product hero slider === */
.product-hero-banner {
  position: relative;
  min-height: 392px;
  padding: 14px 18px 18px;
  overflow: hidden;
  background: #fff;
  border: 1px solid #dbe2ec;
  border-radius: 22px;
  box-shadow: 0 10px 24px rgba(26, 32, 44, .05);
}
.product-hero-banner::before {
  content: none !important;
  display: none !important;
}
.product-hero-banner .hero-slider-head,
.product-hero-banner .hero-slider-stage,
.product-hero-banner .hero-slider-footer {
  position: relative;
  z-index: 1;
}
.product-hero-banner .hero-slider-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 8px;
}
.hero-slider-kicker {
  display: none;
  
  align-items: center;
  gap: 8px;
  color: #596579;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .7px;
}
.hero-slider-kicker::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #d94d5d;
  box-shadow: 0 0 0 4px rgba(217,77,93,.12);
}
.hero-slider-title {
  display: block;
  margin-top: 3px;
  color: #1d2430;
  font-size: 17px;
  font-weight: 900;
}
.hero-slider-nav { display: inline-flex; gap: 10px; }
.hero-nav-btn {
  width: 38px;
  height: 38px;
  border: 1px solid #dde4ed;
  border-radius: 12px;
  background: #fff;
  color: #5f6979;
  transition: transform .25s ease, box-shadow .25s ease, color .25s ease;
}
.hero-nav-btn:hover {
  transform: translateY(-1px);
  color: #d94d5d;
  box-shadow: 0 8px 18px rgba(22, 27, 35, .08);
}
.hero-slider-stage,
.hero-slider-track {
  position: relative;
  min-height: 300px;
}
.hero-product-slide {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: minmax(280px, 48%) minmax(0, 52%);
  align-items: center;
  gap: 18px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(18px);
  transition: opacity .55s ease, transform .55s ease, visibility .55s ease;
  pointer-events: none;
}
.hero-product-slide.is-active {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}
.hero-product-slide.media-right {
  grid-template-columns: minmax(0, 42%) minmax(320px, 58%);
}
.hero-product-slide.media-right .hero-slide-media { order: 2; justify-content: flex-end; }
.hero-product-slide.media-right .hero-slide-copy { order: 1; padding: 30px 0 0 18px; }
.hero-product-slide.media-left .hero-slide-copy { padding: 30px 16px 0 0; }
.hero-slide-media {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-width: 0;
}
.hero-image-shell {
  position: relative;
  width: 100%;
  min-height: 255px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px;
  border-radius: 30px;
  overflow: hidden;
  background: #ffffff;
}
.hero-image-shell::after {
  content: none;
}
.hero-image-shell > a {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 100%;
}
.hero-product-image {
  display: block;
  max-width: min(100%, 450px);
  max-height: 280px;
  width: auto;
  height: auto;
  object-fit: contain;
  background: transparent;
  mix-blend-mode: multiply;
  -webkit-mask-image: radial-gradient(ellipse at center, rgba(0,0,0,1) 60%, rgba(0,0,0,.98) 72%, rgba(0,0,0,.88) 82%, rgba(0,0,0,.56) 90%, rgba(0,0,0,.12) 96%, transparent 100%);
  mask-image: radial-gradient(ellipse at center, rgba(0,0,0,1) 60%, rgba(0,0,0,.98) 72%, rgba(0,0,0,.88) 82%, rgba(0,0,0,.56) 90%, rgba(0,0,0,.12) 96%, transparent 100%);
  filter: drop-shadow(0 22px 20px rgba(0, 0, 0, .10));
}
.hero-product-slide.is-active.media-left .hero-slide-media {
  animation: dropToLeft .72s cubic-bezier(.2, .92, .28, 1);
}
.hero-product-slide.is-active.media-right .hero-slide-media {
  animation: dropToRight .72s cubic-bezier(.2, .92, .28, 1);
}
.hero-product-slide.is-active .hero-slide-copy > * {
  animation: copyFadeUp .65s cubic-bezier(.22,1,.36,1);
}
@keyframes dropToLeft {
  from { opacity: 0; transform: translate(-40px, -90px) scale(.92) rotate(-6deg); }
  to { opacity: 1; transform: translate(0,0) scale(1) rotate(0deg); }
}
@keyframes dropToRight {
  from { opacity: 0; transform: translate(40px, -90px) scale(.92) rotate(6deg); }
  to { opacity: 1; transform: translate(0,0) scale(1) rotate(0deg); }
}
@keyframes copyFadeUp {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}
.hero-slide-copy {
  min-width: 0;
  max-width: 520px;
  align-self: start;
  padding-top: 30px;
}
.hero-slide-copy h2 {
  margin: 0;
  color: #161c28;
  font-size: 23px;
  line-height: 1.28;
  font-weight: 800;
  letter-spacing: -.3px;
}
.hero-slide-copy h2 a { color: inherit; text-decoration: none; }
.hero-slide-copy p {
  margin: 18px 0 0;
  color: #4f5662;
  font-size: 16px;
  line-height: 1.5;
  max-width: 430px;
}
.hero-slide-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 14px;
}
.hero-mini-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid #e3e7ef;
  background: #fff;
  color: #6d7685;
  font-size: 11px;
  font-weight: 800;
}
.hero-mini-tag.in { color: #1f9655; background: #f0fbf4; border-color: #d6f1e0; }
.hero-mini-tag.out { color: #bf5160; background: #fdf1f3; border-color: #f4d6dc; }
.hero-slide-price-wrap {
  margin-top: 26px;
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.hero-price-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 128px;
  min-height: 56px;
  padding: 0 20px;
  border-radius: 14px;
  background: linear-gradient(135deg,var(--primary) 0%,var(--accent) 100%);
  color: #fff;
  font-size: 19px;
  font-weight: 900;
  box-shadow: 0 16px 24px rgba(138,53,221,.22);
  transform: rotate(2deg);
}
.media-right .hero-price-badge { transform: rotate(-2deg); }
.hero-price-badge:hover { color: #fff; }
.hero-price-old {
  color: #a2a9b5;
  font-size: 14px;
  text-decoration: line-through;
  font-weight: 700;
}
.hero-slide-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #2b3442;
  font-size: 14px;
  font-weight: 800;
}
.hero-slide-link i { color: var(--primary); }
.hero-slider-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
}
.hero-slider-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
}
.hero-slider-dot {
  width: 28px;
  height: 6px;
  border: 0;
  padding: 0;
  border-radius: 999px;
  background: #eff2f6;
  transition: width .25s ease, background .25s ease;
}
.hero-slider-dot.is-active {
  width: 18px;
  background: #d94d5d;
  box-shadow: 0 0 0 3px rgba(217,77,93,.12);
}
.hero-slider-status {
  color: #8d95a2;
  font-size: 12px;
  font-weight: 700;
}
.hero-slide-loading {
  position: absolute;
  inset: 0;
  opacity: 1;
  visibility: visible;
}
.hero-slide-loading .hero-slide-media,
.hero-slide-loading .hero-slide-copy { animation: none !important; }
.skeleton-box,
.skeleton-line {
  display: block;
  background: linear-gradient(90deg, rgba(236,239,245,1) 0%, rgba(248,249,252,1) 50%, rgba(236,239,245,1) 100%);
  background-size: 220% 100%;
  animation: yobooSkeleton 1.3s linear infinite;
}
@keyframes yobooSkeleton { from { background-position: 200% 0; } to { background-position: -200% 0; } }
.hero-slide-loading .hero-image-shell.skeleton-box,
.hero-slide-loading .hero-image-shell { width: 92%; min-height: 250px; border-radius: 20px; }
.hero-slide-loading .hero-slide-copy .skeleton-line { border-radius: 999px; margin-bottom: 12px; height: 14px; }
.hero-slide-loading .hero-slide-copy .skeleton-line.long { width: 86%; height: 32px; border-radius: 14px; }
.hero-slide-loading .hero-slide-copy .skeleton-line.medium { width: 74%; }
.hero-slide-loading .hero-slide-copy .skeleton-line.short { width: 55%; }
.hero-slide-loading .hero-slide-copy .skeleton-line.tiny { width: 30%; }
.hero-slide-loading .hero-product-label { width: 92px; height: 28px; border-radius: 999px; }
.hero-slide-loading .hero-price-stack strong.skeleton-line { width: 130px; height: 42px; border-radius: 14px; }
.hero-slide-loading .hero-action-skeleton { width: 118px; height: 56px; border-radius: 14px; }
@media (max-width: 1180px) {
  .hero-product-slide,
  .hero-product-slide.media-right { grid-template-columns: minmax(250px, 45%) minmax(0, 55%); }
  .hero-slide-copy h2 { font-size: 21px; }
  .hero-product-image { max-height: 250px; }
}
@media (max-width: 991px) {
  .product-hero-banner { min-height: 510px; }
  .hero-slider-stage,
  .hero-slider-track { min-height: 418px; }
  .hero-product-slide,
  .hero-product-slide.media-right {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .hero-product-slide.media-right .hero-slide-media,
  .hero-product-slide.media-left .hero-slide-media { order: 1; justify-content: center; }
  .hero-product-slide.media-right .hero-slide-copy,
  .hero-product-slide.media-left .hero-slide-copy { order: 2; padding: 8px 0 0; max-width: 100%; align-self: start; }
  .hero-image-shell { min-height: 210px; }
  .hero-product-image { max-height: 220px; }
  .hero-slide-copy h2 { font-size: 22px; }
  .hero-slide-copy p { max-width: 100%; font-size: 15px; }
  .hero-slide-price-wrap { margin-top: 18px; }
}
@media (max-width: 640px) {
  .product-hero-banner { padding: 12px 12px 16px; border-radius: 18px; min-height: 490px; }
  .product-hero-banner .hero-slider-head { margin-bottom: 4px; }
  .hero-slider-title { font-size: 15px; }
  .hero-nav-btn { width: 34px; height: 34px; }
  .hero-slider-stage,
  .hero-slider-track { min-height: 402px; }
  .hero-slide-copy h2 { font-size: 19px; }
  .hero-slide-copy p { font-size: 14px; margin-top: 14px; }
  .hero-slide-price-wrap { gap: 10px; }
  .hero-price-badge { min-width: 116px; min-height: 52px; font-size: 18px; }
}



/* Functional AZ / EN / RU language selector */
.language-menu button.active {
  background: var(--surface-soft);
  color: var(--primary, #4f46e5);
  font-weight: 800;
}
.drawer-lang-row {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.drawer-lang-pill {
  border: 1px solid transparent;
  cursor: pointer;
}
.drawer-lang-pill.active {
  background: #fff;
  border-color: var(--primary, #4f46e5);
  color: var(--primary, #4f46e5);
  box-shadow: 0 6px 18px rgba(17, 24, 39, .08);
}
.drawer-lang-pill.active small {
  color: inherit;
}