/* ==========================================================================
   AITAKHFID — STORE DESIGN SYSTEM
   Rules:  black = header & footer   |   white = every shopping area
           orange = ONE job: the buttons that move a customer toward buying
   To re-brand, change the variables below.
   ========================================================================== */
:root {
  --orange: #f26b1d;          /* signature: buttons, active states, small accents */
  --orange-hover: #d95a10;
  --on-orange: #1a0e06;       /* text on orange buttons (dark = best contrast) */
  --orange-soft: #fff1e7;     /* very light tint for highlights */
  --black: #101012;           /* header / footer */
  --black-2: #1b1b1f;         /* nav row */
  --text: #17171a;
  --muted: #62666d;
  --line: #e7e7ea;
  --bg: #ffffff;              /* shopping areas */
  --band: #f5f5f6;           /* subtle alternate band behind white cards */
  --sale: #c62828;            /* discount badge */
  --save: #12703f;            /* "you save" text, in-stock */
  --wa: #1fa855;
  --radius: 12px;
  --shadow: 0 6px 22px rgba(16,16,18,.09);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; font-family: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, Helvetica, Arial, sans-serif; color: var(--text); background: var(--bg); line-height: 1.5; -webkit-font-smoothing: antialiased; }
html[dir="rtl"] body, html[dir="rtl"] button, html[dir="rtl"] input, html[dir="rtl"] select, html[dir="rtl"] textarea { font-family: "Cairo", "Tajawal", "Segoe UI", Tahoma, sans-serif; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; }
:focus-visible { outline: 3px solid var(--orange); outline-offset: 2px; border-radius: 6px; }
.container { max-width: 1280px; margin: 0 auto; padding: 0 20px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: var(--orange); color: var(--on-orange); border: 0; border-radius: 10px; padding: 13px 24px; font-weight: 800; font-size: 15px; cursor: pointer; text-align: center; transition: background .15s, transform .1s; line-height: 1.2; }
.btn:hover { background: var(--orange-hover); }
.btn:active { transform: translateY(1px); }
.btn[disabled], .btn.is-disabled { background: #d9d9dc; color: #7a7a80; cursor: not-allowed; }
.btn-block { width: 100%; }
.btn-lg { padding: 16px 28px; font-size: 16.5px; border-radius: 12px; }
.btn-sm { padding: 9px 14px; font-size: 13.5px; border-radius: 8px; }
.btn-dark { background: var(--black); color: #fff; }
.btn-dark:hover { background: #2a2a30; }
.btn-outline { background: #fff; color: var(--text); border: 2px solid var(--text); }
.btn-outline:hover { background: var(--text); color: #fff; }
.btn-ghost-light { background: transparent; color: #fff; border: 2px solid rgba(255,255,255,.75); }
.btn-ghost-light:hover { background: #fff; color: var(--black); }
.btn-wa { background: var(--wa); color: #fff; }
.btn-wa:hover { background: #17924a; }

/* ---------- Top strip + header (BLACK) ---------- */
.promo-strip { background: #000; color: #e5e5e8; font-size: 12.5px; padding: 7px 20px; display: flex; justify-content: center; align-items: center; gap: 14px; flex-wrap: wrap; text-align: center; }
.promo-strip a { color: var(--orange); font-weight: 700; }
.lang-btn { background: transparent; color: #fff; border: 1px solid #55555c; border-radius: 999px; padding: 3px 14px; font-weight: 700; font-size: 12.5px; cursor: pointer; }
.lang-btn:hover { border-color: var(--orange); color: var(--orange); }

.site-header { background: var(--black); color: #fff; padding: 12px 20px; display: flex; align-items: center; gap: 18px; position: sticky; top: 0; z-index: 900; }
.site-header .logo { display: flex; align-items: center; gap: 10px; font-weight: 800; font-size: 23px; letter-spacing: -.01em; color: #fff; white-space: nowrap; }
.site-header .logo b { color: var(--orange); font-weight: 800; }
.logo-img { height: 50px; width: auto; border-radius: 8px; }
.deliver-to { display: flex; flex-direction: column; line-height: 1.25; white-space: nowrap; color: #fff; }
.deliver-to .lbl { font-size: 11.5px; color: #a9a9b1; }
.deliver-to .val { font-size: 13.5px; font-weight: 700; }
.search-form { flex: 1; display: flex; background: #fff; border-radius: 10px; overflow: hidden; min-width: 200px; border: 2px solid #fff; }
.search-form:focus-within { border-color: var(--orange); }
.search-form input { flex: 1; border: 0; outline: 0; padding: 11px 14px; font-size: 15px; color: var(--text); min-width: 0; background: #fff; }
.search-form button { background: var(--orange); color: var(--on-orange); border: 0; padding: 0 20px; cursor: pointer; font-weight: 800; font-size: 15px; }
.search-form button:hover { background: var(--orange-hover); }
.header-actions { display: flex; align-items: center; gap: 6px; }
.h-link { display: flex; flex-direction: column; line-height: 1.25; padding: 6px 10px; border-radius: 8px; color: #fff; white-space: nowrap; }
.h-link:hover { background: #26262b; }
.h-link .t { font-size: 11.5px; color: #a9a9b1; }
.h-link .b { font-size: 13.5px; font-weight: 700; }
.cart-link { display: flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 10px; background: #26262b; color: #fff; font-weight: 800; }
.cart-link:hover { background: #33333a; }
.cart-link .ico { position: relative; font-size: 22px; line-height: 1; }
.cart-bubble[hidden] { display: none; }
.cart-bubble { position: absolute; top: -9px; inset-inline-end: -11px; background: var(--orange); color: var(--on-orange); min-width: 19px; height: 19px; border-radius: 99px; font-size: 11px; font-weight: 800; display: grid; place-items: center; padding: 0 4px; }

.site-nav { background: var(--black-2); border-top: 1px solid #2a2a30; }
.site-nav .container { display: flex; align-items: center; gap: 2px; overflow-x: auto; scrollbar-width: none; }
.site-nav .container::-webkit-scrollbar { display: none; }
.site-nav a { color: #e9e9ec; font-size: 13.5px; font-weight: 600; padding: 11px 14px; white-space: nowrap; border-bottom: 3px solid transparent; }
.site-nav a:hover { color: #fff; border-bottom-color: var(--orange); }
.site-nav a.is-active { border-bottom-color: var(--orange); color: #fff; }
.site-nav .nav-all { font-weight: 800; color: #fff; }
.site-nav .nav-deals { color: #ffb27f; font-weight: 800; margin-inline-start: auto; }

/* ---------- Add-to-cart toast ---------- */
.toast { position: fixed; z-index: 1200; top: 16px; inset-inline-end: 16px; background: var(--black); color: #fff; border-radius: 12px; padding: 14px 16px; box-shadow: 0 12px 34px rgba(0,0,0,.35); display: flex; gap: 12px; align-items: center; max-width: 380px; transform: translateY(-20px); opacity: 0; pointer-events: none; transition: .25s; }
.toast.show { transform: none; opacity: 1; pointer-events: auto; }
.toast .tick { background: var(--orange); color: var(--on-orange); width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-weight: 900; flex: none; }
.toast .msg { font-size: 14px; font-weight: 600; }
.toast .msg small { display: block; color: #bdbdc4; font-weight: 500; }
.toast a { margin-inline-start: auto; }

/* ---------- Section scaffolding ---------- */
.section { padding: 36px 0; }
.section.band { background: var(--band); }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; margin-bottom: 18px; }
.section-head h2, .section-title { margin: 0; font-size: clamp(21px, 2.6vw, 28px); font-weight: 800; letter-spacing: -.01em; }
.section-head p { margin: 4px 0 0; color: var(--muted); font-size: 14.5px; }
.see-all { font-weight: 700; font-size: 14px; white-space: nowrap; border-bottom: 2px solid var(--orange); padding-bottom: 1px; }
.see-all:hover { color: var(--orange-hover); }
.page-wrap { padding: 26px 20px 50px; max-width: 1280px; margin: 0 auto; }
.breadcrumb { font-size: 13px; color: var(--muted); padding: 16px 0 4px; }
.breadcrumb a { color: var(--text); font-weight: 600; }
.breadcrumb a:hover { text-decoration: underline; }
.breadcrumb .sep { margin: 0 6px; color: #b4b4ba; }

/* ---------- Hero (black, with photo) ---------- */
.hero { position: relative; background: var(--black); color: #fff; }
.hero-track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; direction: ltr; }
.hero-track::-webkit-scrollbar { display: none; }
.hero-slide { flex: 0 0 100%; scroll-snap-align: start; position: relative; min-height: 470px; display: flex; align-items: center; background: #1b1b1f center/cover no-repeat; overflow: hidden; }
.hero-slide::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,10,12,.92) 0%, rgba(10,10,12,.7) 48%, rgba(10,10,12,.2) 100%); }
html[dir="rtl"] .hero-slide::before { background: linear-gradient(-90deg, rgba(10,10,12,.92) 0%, rgba(10,10,12,.7) 48%, rgba(10,10,12,.2) 100%); }
.hero-inner { position: relative; width: 100%; max-width: 1280px; margin: 0 auto; padding: 48px 20px 150px; direction: inherit; }
html[dir="rtl"] .hero-inner { direction: rtl; }
.hero-kicker { display: inline-block; border: 1px solid rgba(255,255,255,.4); border-radius: 999px; padding: 5px 14px; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; font-weight: 700; margin-bottom: 16px; color: #ffd6bd; }
.hero h1 { font-size: clamp(32px, 5.2vw, 58px); line-height: 1.04; margin: 0 0 14px; font-weight: 800; letter-spacing: -.02em; max-width: 720px; }
.hero h1 em { font-style: normal; color: var(--orange); }
.hero .lead { font-size: clamp(15px, 1.5vw, 18.5px); color: #e4e4e8; max-width: 580px; margin: 0 0 26px; }
.hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-dots { position: absolute; bottom: 168px; inset-inline: 0; display: flex; justify-content: center; gap: 8px; z-index: 2; }
.hero-dots button { width: 9px; height: 9px; border-radius: 99px; border: 0; background: rgba(255,255,255,.45); padding: 0; cursor: pointer; transition: .25s; }
.hero-dots button.on { width: 28px; background: var(--orange); }
.hero-brands { position: absolute; inset-inline: 0; bottom: 0; background: rgba(10,10,12,.78); backdrop-filter: blur(4px); padding: 12px 0 56px; z-index: 1; }
.hero-brands-label { font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; color: #cfcfd6; font-weight: 700; margin: 0 20px 8px; max-width: 1240px; }
@media (min-width: 1320px) { .hero-brands-label { margin-inline: auto; padding: 0 20px; } }
.brand-marquee { overflow: hidden; direction: ltr; -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); }
.brand-track { display: flex; gap: 10px; width: max-content; animation: brandScroll 80s linear infinite; }
.brand-marquee:hover .brand-track { animation-play-state: paused; }
.brand-chip { background: #fff; border-radius: 9px; height: 54px; min-width: 100px; padding: 6px 14px; display: grid; place-items: center; flex: none; font-weight: 800; color: #111; font-size: 13px; }
.brand-chip img { max-height: 40px; max-width: 130px; width: auto; object-fit: contain; }
@keyframes brandScroll { to { transform: translateX(-50%); } }

/* ---------- Value bar (low prices / quotes / delivery / easy ordering) ---------- */
.value-bar { max-width: 1280px; margin: -38px auto 0; padding: 0 20px; position: relative; z-index: 3; }
.value-grid { display: grid; grid-template-columns: repeat(4, 1fr); background: #fff; border-radius: 14px; box-shadow: 0 14px 40px rgba(16,16,18,.18); overflow: hidden; border: 1px solid var(--line); }
.value-item { display: flex; gap: 14px; align-items: center; padding: 20px 22px; border-inline-end: 1px solid var(--line); }
.value-item:last-child { border-inline-end: 0; }
.value-ico { font-size: 26px; width: 50px; height: 50px; display: grid; place-items: center; background: var(--orange-soft); border-radius: 12px; flex: none; }
.value-item strong { display: block; font-size: 15px; line-height: 1.25; }
.value-item span { font-size: 13px; color: var(--muted); }

/* ---------- Category tiles ---------- */
.cat-scroll { display: grid; grid-auto-flow: column; grid-auto-columns: 150px; gap: 12px; overflow-x: auto; padding: 4px 2px 12px; scrollbar-width: thin; scroll-snap-type: x proximity; }
.cat-card { scroll-snap-align: start; border: 1px solid var(--line); background: #fff; border-radius: var(--radius); padding: 16px 10px 14px; text-align: center; transition: border-color .15s, box-shadow .15s, transform .15s; }
.cat-card:hover { border-color: var(--text); box-shadow: var(--shadow); transform: translateY(-3px); }
.cat-card img { width: 84px; height: 84px; object-fit: cover; border-radius: 50%; margin: 0 auto 10px; background: var(--band); }
.cat-card span { display: block; font-weight: 700; font-size: 13.5px; line-height: 1.3; }
.cat-card small { color: var(--muted); font-size: 12px; }

/* ---------- Product grid + card (white, comparison-first) ---------- */
.product-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 16px; }
.product-card { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; transition: box-shadow .18s, border-color .18s; }
.product-card:hover { box-shadow: var(--shadow); border-color: #cfcfd4; }
.product-card .pc-img { display: block; aspect-ratio: 1/1; background: #fff; padding: 14px; }
.product-card .pc-img img { width: 100%; height: 100%; object-fit: contain; }
.product-card .badge { position: absolute; top: 10px; inset-inline-start: 10px; background: var(--sale); color: #fff; font-size: 12.5px; font-weight: 800; padding: 4px 9px; border-radius: 7px; z-index: 1; }
.pc-body { padding: 4px 14px 14px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.pc-cat { font-size: 11.5px; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; font-weight: 600; }
.pc-name { font-size: 14.5px; font-weight: 600; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 39px; }
.pc-name:hover { text-decoration: underline; }
.pc-foot { margin-top: auto; display: flex; flex-direction: column; gap: 6px; min-height: 84px; justify-content: flex-end; }
.pc-price { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; padding-top: 4px; }
.price { font-size: 20px; font-weight: 800; color: var(--text); letter-spacing: -.01em; }
.price small { font-size: 12.5px; font-weight: 700; margin-inline-end: 3px; }
.price-compare { text-decoration: line-through; color: var(--muted); font-size: 13.5px; }
.pc-save { font-size: 12.5px; font-weight: 700; color: var(--save); }
.pc-stock { font-size: 12.5px; font-weight: 600; color: var(--muted); }
.pc-stock.low { color: #b45309; }
.pc-stock.out { color: var(--sale); }
.pc-form { margin-top: 8px; }
.pc-form .btn { width: 100%; padding: 11px 10px; font-size: 14.5px; }

/* ---------- Collection page ---------- */
.shop-layout { display: grid; grid-template-columns: 250px 1fr; gap: 26px; align-items: start; }
.filters { position: sticky; top: 140px; border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; background: #fff; }
.filters h3 { font-size: 14px; margin: 0 0 8px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.filters ul { list-style: none; margin: 0 0 18px; padding: 0; }
.filters li a { display: flex; justify-content: space-between; gap: 8px; padding: 7px 8px; border-radius: 8px; font-size: 14px; font-weight: 600; }
.filters li a:hover { background: var(--band); }
.filters li a.active { background: var(--black); color: #fff; }
.filters li a small { opacity: .65; font-weight: 500; }
.filter-row { display: flex; gap: 8px; margin-bottom: 10px; }
.filter-row input { width: 100%; padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; font-size: 14px; min-width: 0; }
.check { display: flex; gap: 8px; align-items: center; font-size: 14px; font-weight: 600; margin-bottom: 12px; cursor: pointer; }
.shop-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.shop-toolbar h1 { margin: 0; font-size: clamp(22px, 2.8vw, 30px); font-weight: 800; }
.shop-toolbar .count { color: var(--muted); font-size: 14px; }
.select { padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; font-size: 14px; font-weight: 600; }
.chip-row { display: none; gap: 8px; overflow-x: auto; padding-bottom: 8px; margin-bottom: 8px; scrollbar-width: none; }
.chip { flex: none; padding: 8px 14px; border: 1px solid var(--line); border-radius: 999px; font-size: 13.5px; font-weight: 600; background: #fff; }
.chip.active { background: var(--black); color: #fff; border-color: var(--black); }
.pagination { display: flex; justify-content: center; gap: 6px; flex-wrap: wrap; margin-top: 28px; }
.pagination a, .pagination span { min-width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 10px; font-weight: 700; font-size: 14px; padding: 0 10px; }
.pagination a:hover { border-color: var(--text); }
.pagination .cur { background: var(--black); color: #fff; border-color: var(--black); }
.empty-state { text-align: center; padding: 60px 20px; color: var(--muted); }
.empty-state .btn { margin-top: 14px; }

/* ---------- Product page ---------- */
.pdp { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 40px; padding: 10px 0 30px; }
.pdp-gallery .main { border: 1px solid var(--line); border-radius: var(--radius); background: #fff; aspect-ratio: 1/1; display: grid; place-items: center; padding: 18px; }
.pdp-gallery .main img { max-height: 100%; width: 100%; height: 100%; object-fit: contain; }
.thumbs { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.thumbs button { width: 70px; height: 70px; border: 2px solid var(--line); border-radius: 10px; background: #fff; padding: 4px; cursor: pointer; }
.thumbs button.on, .thumbs button:hover { border-color: var(--orange); }
.thumbs img { width: 100%; height: 100%; object-fit: contain; }
.pdp h1 { font-size: clamp(22px, 2.6vw, 30px); line-height: 1.2; margin: 0 0 6px; font-weight: 800; }
.pdp .meta { font-size: 13px; color: var(--muted); margin-bottom: 14px; }
.pdp .meta a { color: var(--text); font-weight: 600; text-decoration: underline; }
.pdp-price { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin: 6px 0 4px; }
.pdp-price .price { font-size: 36px; }
.pdp-price .price-compare { font-size: 17px; }
.pdp-price .badge-inline { background: var(--sale); color: #fff; font-weight: 800; font-size: 13px; padding: 4px 9px; border-radius: 7px; }
.vat-note { font-size: 12.5px; color: var(--muted); margin-bottom: 12px; }
.stock-ok { color: var(--save); font-weight: 700; font-size: 14px; }
.stock-low { color: #b45309; font-weight: 700; font-size: 14px; }
.stock-out { color: var(--sale); font-weight: 700; font-size: 14px; }
.buy-box { border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; margin-top: 14px; background: #fff; box-shadow: 0 2px 0 rgba(16,16,18,.03); }
.buy-row { display: flex; gap: 12px; align-items: stretch; flex-wrap: wrap; }
.qty { display: inline-flex; border: 2px solid var(--line); border-radius: 10px; overflow: hidden; background: #fff; }
.qty button { width: 42px; border: 0; background: var(--band); cursor: pointer; font-size: 20px; font-weight: 700; }
.qty button:hover { background: #e9e9ec; }
.qty input { width: 56px; text-align: center; border: 0; font-weight: 700; font-size: 16px; -moz-appearance: textfield; }
.qty input::-webkit-outer-spin-button, .qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.buy-row .btn { flex: 1; min-width: 180px; }
.buy-sub { display: flex; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
.buy-sub .btn { flex: 1; min-width: 160px; }
.perks { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 10px; }
.perks li { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; }
.perks .pi { width: 34px; height: 34px; border-radius: 9px; background: var(--orange-soft); display: grid; place-items: center; flex: none; font-size: 17px; }
.perks b { display: block; font-size: 14px; }
.perks span { color: var(--muted); font-size: 13px; }
.pdp-desc { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--line); }
.pdp-desc h3 { margin: 0 0 8px; font-size: 18px; }
.sticky-buy { display: none; }

/* ---------- Cart & checkout ---------- */
.cart-layout, .checkout-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 28px; align-items: start; }
.cart-line { display: grid; grid-template-columns: 92px 1fr auto; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--line); align-items: center; }
.cart-line:first-child { padding-top: 0; }
.cart-line img { width: 92px; height: 92px; object-fit: contain; border: 1px solid var(--line); border-radius: 10px; padding: 6px; background: #fff; }
.cart-line .nm { font-weight: 700; font-size: 15px; line-height: 1.35; }
.cart-line .nm:hover { text-decoration: underline; }
.cart-line .unit { color: var(--muted); font-size: 13px; margin-top: 2px; }
.cart-line .ctrl { display: flex; gap: 14px; align-items: center; margin-top: 8px; flex-wrap: wrap; }
.cart-line .qty button { width: 34px; height: 34px; font-size: 18px; }
.cart-line .qty input { width: 44px; height: 34px; font-size: 14.5px; }
.cart-line .lt { font-weight: 800; font-size: 17px; text-align: end; white-space: nowrap; }
.link-btn { background: none; border: 0; padding: 0; color: var(--muted); text-decoration: underline; cursor: pointer; font-size: 13px; font-weight: 600; }
.link-btn:hover { color: var(--sale); }
.summary { border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; background: #fff; position: sticky; top: 140px; box-shadow: var(--shadow); }
.summary h3 { margin: 0 0 14px; font-size: 18px; }
.summary .row { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 10px; font-size: 14.5px; }
.summary .row.total { font-size: 20px; font-weight: 800; border-top: 1px solid var(--line); padding-top: 14px; margin-top: 6px; }
.summary .free { color: var(--save); font-weight: 800; }
.summary .items-mini { max-height: 220px; overflow: auto; margin-bottom: 8px; padding-bottom: 6px; border-bottom: 1px solid var(--line); }
.summary .mini { display: flex; justify-content: space-between; gap: 10px; font-size: 13.5px; margin-bottom: 8px; color: var(--muted); }
.summary .mini b { color: var(--text); white-space: nowrap; }
.ship-progress { background: var(--band); border-radius: 10px; padding: 12px 14px; margin-bottom: 16px; font-size: 13.5px; font-weight: 600; }
.ship-progress .bar { height: 7px; background: #dcdce0; border-radius: 99px; margin-top: 8px; overflow: hidden; }
.ship-progress .bar i { display: block; height: 100%; background: var(--save); border-radius: 99px; transition: width .4s; }
.ship-progress.done { background: #e7f6ee; color: var(--save); }
.trust-mini { display: grid; gap: 8px; margin-top: 14px; font-size: 13px; color: var(--muted); }
.trust-mini div { display: flex; gap: 8px; align-items: center; }

.card { border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; background: #fff; margin-bottom: 18px; }
.card h3 { margin: 0 0 16px; font-size: 18px; display: flex; align-items: center; gap: 10px; }
.card h3 .num { background: var(--black); color: #fff; width: 26px; height: 26px; border-radius: 50%; font-size: 13px; display: grid; place-items: center; }
.form-row { display: flex; gap: 14px; }
.form-row > * { flex: 1; min-width: 0; }
.form-group { margin-bottom: 16px; }
.form-group label { display: block; font-weight: 700; font-size: 13.5px; margin-bottom: 6px; }
.form-group .hint { font-size: 12px; color: var(--muted); margin-top: 4px; }
.form-group input, .form-group textarea, .form-group select, .field { width: 100%; padding: 12px 13px; border: 1.5px solid #d3d3d8; border-radius: 10px; font-size: 15px; background: #fff; color: var(--text); }
.form-group input:focus, .form-group textarea:focus, .form-group select:focus, .field:focus { outline: 0; border-color: var(--orange); box-shadow: 0 0 0 3px rgba(242,107,29,.18); }
.pay-opt { display: flex; gap: 12px; align-items: flex-start; border: 2px solid var(--line); border-radius: 12px; padding: 14px; margin-bottom: 10px; cursor: pointer; }
.pay-opt:has(input:checked) { border-color: var(--orange); background: var(--orange-soft); }
.pay-opt input { margin-top: 4px; accent-color: var(--orange); width: 18px; height: 18px; }
.pay-opt b { display: block; }
.pay-opt span { font-size: 13px; color: var(--muted); }
.form-card { max-width: 460px; margin: 40px auto; border: 1px solid var(--line); border-radius: 14px; padding: 30px; background: #fff; box-shadow: var(--shadow); }
.form-card h2 { margin-top: 0; }
.alert { padding: 12px 16px; border-radius: 10px; font-size: 14px; margin-bottom: 16px; }
.alert-error { background: #fdecea; color: #a1231b; border: 1px solid #f5b5b0; }
.alert-success { background: #e8f6ec; color: #17653a; border: 1px solid #b6e2bd; }
.alert-info { background: var(--orange-soft); color: #7a3406; border: 1px solid #ffd2b2; }

/* order success */
.success-hero { text-align: center; padding: 10px 0 24px; }
.success-hero .tick { width: 76px; height: 76px; border-radius: 50%; background: #e7f6ee; color: var(--save); font-size: 40px; display: grid; place-items: center; margin: 0 auto 14px; }
.success-hero h1 { margin: 0 0 6px; font-size: clamp(24px, 3vw, 32px); }
.order-no { display: inline-block; background: var(--band); border-radius: 10px; padding: 8px 16px; font-weight: 800; letter-spacing: .04em; margin-top: 8px; }
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 18px 0; }
.steps div { background: var(--band); border-radius: 12px; padding: 14px; font-size: 13.5px; }
.steps b { display: block; font-size: 14.5px; margin-bottom: 2px; }

/* tables (account, legacy pages) */
table.data-table { width: 100%; border-collapse: collapse; background: #fff; }
table.data-table th, table.data-table td { padding: 12px; border-bottom: 1px solid var(--line); text-align: start; font-size: 14px; }
table.data-table th { background: var(--band); font-size: 12.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.empty-cart { text-align: center; padding: 60px 20px; }
.empty-cart .big { font-size: 56px; }

/* ---------- Quote band & forms ---------- */
.quote-band { background: var(--black); color: #fff; border-radius: 18px; padding: 34px 38px; display: grid; grid-template-columns: 1.3fr 1fr; gap: 28px; align-items: center; }
.quote-band h2 { margin: 0 0 8px; font-size: clamp(22px, 3vw, 32px); line-height: 1.15; }
.quote-band p { margin: 0 0 18px; color: #d4d4da; }
.quote-points { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.quote-points div { background: #1d1d22; border: 1px solid #2c2c33; border-radius: 12px; padding: 14px; font-size: 13.5px; color: #cfcfd6; }
.quote-points b { display: block; color: #fff; font-size: 15px; margin-bottom: 2px; }

/* delivery */
.delivery-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 24px; align-items: stretch; }
.emirate-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; }
.emirate { display: flex; justify-content: space-between; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; font-weight: 700; font-size: 14px; background: #fff; }
.emirate small { color: var(--save); font-weight: 700; font-size: 12px; }
.fee-box { border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; background: #fff; }
.fee-box .big { font-size: 30px; font-weight: 800; }
.fee-box .small { color: var(--muted); font-size: 13.5px; margin-bottom: 14px; }

.newsletter { border: 1px solid var(--line); border-radius: 18px; padding: 34px 20px; text-align: center; background: var(--band); }
.newsletter h2 { margin: 0 0 6px; }
.newsletter p { margin: 0 auto 16px; color: var(--muted); }
.newsletter form { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.newsletter input[type=email] { padding: 13px 16px; border: 1.5px solid #d3d3d8; border-radius: 10px; min-width: 260px; font-size: 15px; }

/* ---------- Blog / pages / misc ---------- */
.blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.blog-card { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: #fff; }
.blog-card:hover { box-shadow: var(--shadow); }
.blog-card img { aspect-ratio: 16/9; object-fit: cover; width: 100%; }
.blog-card .body { padding: 16px; }
.blog-card h3 { margin: 0 0 8px; font-size: 17px; }
.blog-card p { color: var(--muted); font-size: 14px; margin: 0; }
.prose { max-width: 820px; margin: 0 auto; line-height: 1.75; font-size: 16px; }
.prose h1, .prose h2, .prose h3 { line-height: 1.25; }
.prose img { border-radius: 12px; margin: 14px 0; }

/* ---------- Footer (BLACK) ---------- */
.back-to-top { display: block; background: #26262b; color: #fff; text-align: center; padding: 14px; font-size: 13px; font-weight: 600; }
.back-to-top:hover { background: #33333a; }
.site-footer { background: var(--black); color: #c9c9d0; padding: 44px 0 20px; }
.footer-grid { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: 28px; }
.footer-grid h4 { color: #fff; font-size: 14.5px; margin: 0 0 12px; }
.footer-grid a { display: block; color: #b3b3bb; font-size: 14px; margin-bottom: 8px; }
.footer-grid a:hover { color: var(--orange); }
.footer-brand .logo-img { height: 64px; margin-bottom: 12px; }
.footer-brand p { font-size: 13.5px; color: #a9a9b1; max-width: 300px; margin: 0 0 12px; }
.social-row { display: flex; gap: 10px; margin-top: 10px; }
.social-row a { background: #26262b; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; margin: 0; color: #fff; font-weight: 800; }
.social-row a:hover { background: var(--orange); color: var(--on-orange); }
.pay-badges { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.pay-badges span { border: 1px solid #3a3a42; border-radius: 6px; padding: 4px 10px; font-size: 12px; color: #d6d6dc; font-weight: 600; }
.footer-bottom { border-top: 1px solid #2a2a30; margin-top: 28px; padding-top: 18px; font-size: 12px; color: #8d8d96; text-align: center; line-height: 1.7; }
.footer-bottom a { color: #b3b3bb; text-decoration: underline; }

.wa-float { position: fixed; inset-inline-end: 18px; bottom: 22px; z-index: 950; background: var(--wa); color: #fff; font-weight: 800; font-size: 14px; padding: 12px 18px; border-radius: 999px; box-shadow: 0 10px 26px rgba(31,168,85,.45); display: flex; align-items: center; gap: 8px; transition: transform .15s; }
.wa-float:hover { transform: translateY(-3px); }

/* mobile bottom nav */
.tk-bottom-nav { display: none; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .deliver-to { display: none; }
  .footer-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 980px) {
  .value-grid { grid-template-columns: repeat(2, 1fr); }
  .value-item:nth-child(2) { border-inline-end: 0; }
  .value-item:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .shop-layout { grid-template-columns: 1fr; }
  .filters { display: none; }
  .chip-row { display: flex; }
  .pdp { grid-template-columns: 1fr; gap: 20px; }
  .cart-layout, .checkout-grid { grid-template-columns: 1fr; }
  .summary { position: static; }
  .quote-band, .delivery-grid { grid-template-columns: 1fr; }
  .quote-band { padding: 26px 22px; }
}
@media (max-width: 768px) {
  .site-header { flex-wrap: wrap; position: static; padding: 10px 12px; gap: 10px; }
  .site-header .logo { font-size: 19px; }
  .logo-img { height: 42px; }
  .search-form { order: 5; flex-basis: 100%; }
  .header-actions { margin-inline-start: auto; }
  .h-link.hide-m, .h-signin.hide-m, .h-logout.hide-m { display: none; }
  .cart-link span.lbl-t { display: none; }
  .site-nav { position: sticky; top: 0; z-index: 890; }
  .hero-slide { min-height: 440px; }
  .hero-inner { padding: 34px 16px 140px; }
  .hero-brands { padding-bottom: 46px; }
  .hero h1 { font-size: 31px; }
  .hero-ctas .btn { padding: 12px 18px; font-size: 14px; }
  .hero-dots { bottom: 150px; }
  .promo-strip { font-size: 11.5px; padding: 6px 12px; gap: 8px; flex-wrap: nowrap; justify-content: space-between; }
  .promo-strip > span:first-child, .promo-strip > a { display: none; }
  .promo-strip > span:nth-child(2) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; text-align: start; }
  .brand-chip { height: 46px; min-width: 84px; }
  .brand-chip img { max-height: 32px; max-width: 100px; }
  .value-bar { padding: 0 12px; margin-top: -30px; }
  .value-item { padding: 12px; gap: 10px; }
  .value-ico { width: 38px; height: 38px; font-size: 19px; }
  .value-item strong { font-size: 13px; }
  .value-item span { font-size: 11.5px; }
  .container, .page-wrap { padding-inline: 14px; }
  .section { padding: 26px 0; }
  .product-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .product-card .pc-img { padding: 8px; }
  .pc-body { padding: 2px 10px 10px; }
  .pc-name { font-size: 13.5px; min-height: 36px; }
  .price { font-size: 17px; }
  .cart-line { grid-template-columns: 72px 1fr; }
  .cart-line img { width: 72px; height: 72px; }
  .cart-line .lt { grid-column: 2; text-align: start; }
  .form-row { flex-direction: column; gap: 0; }
  .steps { grid-template-columns: 1fr; }
  .quote-points { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .wa-float { bottom: 76px; padding: 11px 14px; }
  .wa-float .wa-txt { display: none; }
  .tk-bottom-nav { display: flex; position: fixed; bottom: 0; inset-inline: 0; z-index: 960; background: #fff; border-top: 1px solid var(--line); box-shadow: 0 -4px 18px rgba(0,0,0,.08); }
  .tk-bottom-nav a { flex: 1; text-align: center; font-size: 11px; font-weight: 700; color: var(--muted); padding: 7px 2px 8px; }
  .tk-bottom-nav a.tk-bn-active { color: var(--text); }
  .tk-bottom-nav a.tk-bn-active .tk-bn-ico { background: var(--orange); }
  .tk-bn-ico { display: grid; place-items: center; width: 36px; height: 26px; border-radius: 99px; margin: 0 auto 2px; font-size: 17px; position: relative; }
  .tk-bn-badge { position: absolute; top: -4px; inset-inline-end: -2px; background: var(--orange); color: var(--on-orange); font-size: 10px; border-radius: 99px; min-width: 16px; height: 16px; display: grid; place-items: center; font-weight: 800; }
  body { padding-bottom: 60px; }
  .sticky-buy { display: flex; position: fixed; inset-inline: 0; bottom: 56px; z-index: 955; background: #fff; border-top: 1px solid var(--line); padding: 10px 12px; gap: 12px; align-items: center; box-shadow: 0 -6px 20px rgba(0,0,0,.1); }
  .sticky-buy .p { font-size: 19px; font-weight: 800; line-height: 1.1; }
  .sticky-buy .p small { display: block; font-size: 11.5px; color: var(--muted); font-weight: 600; text-decoration: line-through; }
  .sticky-buy .btn { flex: 1; }
  .toast { inset-inline: 12px; max-width: none; top: 10px; }
}
@media (prefers-reduced-motion: reduce) { .brand-track { animation: none; } .brand-marquee { overflow-x: auto; } html { scroll-behavior: auto; } }

/* ---------- RTL touch-ups ---------- */
html[dir="rtl"] .hero-brands-label { text-align: start; }
html[dir="rtl"] .cat-scroll { direction: rtl; }

/* ---- AI shopping assistant ---- */
.aichat-btn{position:fixed;inset-inline-start:18px;bottom:22px;z-index:955;display:flex;align-items:center;gap:8px;background:#101012;color:#fff;border:2px solid var(--orange);border-radius:999px;padding:11px 16px;font-weight:800;font-size:14px;cursor:pointer;box-shadow:0 10px 26px rgba(0,0,0,.35);font-family:inherit}
.aichat-btn .ai-ic{font-size:17px}.aichat-btn:hover{background:#1c1c20}
.aichat{position:fixed;inset-inline-start:18px;bottom:78px;z-index:990;width:380px;max-width:calc(100vw - 24px);height:min(600px,calc(100vh - 110px));background:#fff;border-radius:16px;box-shadow:0 18px 60px rgba(0,0,0,.35);display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line)}
.aichat[hidden]{display:none}
.aichat header{background:#101012;color:#fff;padding:12px 14px;display:flex;justify-content:space-between;align-items:center;border-bottom:3px solid var(--orange)}
.aichat header b{display:block;font-size:15px}.aichat header small{color:#bbb;font-size:12px}
.aichat .ai-x{background:none;border:0;color:#fff;font-size:18px;cursor:pointer;padding:4px 8px}
.ai-msgs{flex:1;overflow-y:auto;padding:12px;background:#f7f7f8;display:flex;flex-direction:column;gap:8px}
.ai-m{max-width:88%;padding:9px 12px;border-radius:14px;font-size:14px;line-height:1.5;word-wrap:break-word}
.ai-m.bot{background:#fff;border:1px solid var(--line);align-self:flex-start;border-end-start-radius:4px}
.ai-m.me{background:var(--orange);color:var(--on-orange,#1a0e06);align-self:flex-end;font-weight:600;border-end-end-radius:4px}
.ai-m.typing{color:#888;font-style:italic}
.ai-cards{display:flex;flex-direction:column;gap:8px}
.ai-card{display:flex;gap:10px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px}
.ai-card .im{flex:0 0 74px}.ai-card img{width:74px;height:74px;object-fit:contain;border-radius:8px;background:#fff}
.ai-card .bd{flex:1;min-width:0}.ai-card .nm{display:block;font-size:13px;font-weight:700;line-height:1.3;color:var(--ink,#111);max-height:2.6em;overflow:hidden}
.ai-card .pr{margin:3px 0}.ai-card .pr b{font-size:15px}.ai-card .pr s{color:#888;font-size:12px}.ai-card .pr em{font-style:normal;color:var(--save,#12703f);font-size:11px;font-weight:700}
.ai-card .st{font-size:11px;color:#b45309;min-height:14px}.ai-card .st .o{color:var(--sale,#c62828);font-weight:700}
.ai-card .ac{display:flex;gap:8px;align-items:center}
.ai-card .add{background:var(--orange);color:var(--on-orange,#1a0e06);border:0;border-radius:8px;padding:7px 12px;font-weight:800;font-size:13px;cursor:pointer;font-family:inherit}
.ai-card .add.done{background:#e6f4ea;color:#12703f}.ai-card .add:disabled{opacity:.7}.ai-card .vw{font-size:12px;text-decoration:underline;color:#444}
.ai-links{display:flex;flex-wrap:wrap;gap:6px}.ai-links a{background:#fff;border:1px solid #cfcfd6;border-radius:999px;padding:7px 12px;font-size:13px;font-weight:700;color:#111}
.ai-links a.pri{background:var(--orange);border-color:var(--orange);color:var(--on-orange,#1a0e06)}
.ai-chips{display:flex;gap:6px;flex-wrap:wrap;padding:8px 10px 0;background:#fff;border-top:1px solid var(--line);max-height:96px;overflow-y:auto}.ai-chips:empty{display:none}
.ai-chips button{background:#fff;border:1px solid var(--orange);color:#111;border-radius:999px;padding:6px 11px;font-size:12.5px;font-weight:700;cursor:pointer;font-family:inherit}.ai-chips button:hover{background:#fff1e8}
.ai-form{display:flex;gap:8px;padding:10px;background:#fff}.ai-form input{flex:1;border:1px solid #cfcfd6;border-radius:999px;padding:10px 14px;font-size:14px;font-family:inherit;min-width:0}
.ai-form button{background:#101012;color:#fff;border:0;border-radius:999px;padding:0 16px;font-weight:800;cursor:pointer;font-family:inherit}
@media(max-width:760px){.aichat-btn{bottom:76px;padding:11px 13px}.aichat-btn .ai-tx{display:none}.aichat{inset-inline:8px;width:auto;bottom:70px;height:calc(100vh - 90px)}html.ai-open .wa-float{display:none}}
@media print{.aichat,.aichat-btn{display:none!important}}

/* ---- AI agent: hero card + shared chat bits ---- */
.hero-agent{position:absolute;z-index:3;inset-inline-end:max(20px,calc((100vw - 1240px)/2));top:30px;width:392px;max-width:calc(100% - 32px);background:rgba(16,16,18,.82);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.16);border-radius:18px;box-shadow:0 18px 50px rgba(0,0,0,.45);color:#fff;display:flex;flex-direction:column;overflow:hidden;direction:ltr}
html[dir="rtl"] .hero-agent{direction:rtl}
.hero-agent header{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:3px solid var(--orange);background:rgba(0,0,0,.35)}
.hero-agent header img{width:46px;height:46px;border-radius:50%;object-fit:cover;object-position:60% 30%;border:2px solid var(--orange);flex:0 0 46px}
.hero-agent header>div{flex:1;min-width:0}.hero-agent header b{display:block;font-size:15px}.hero-agent header small{color:#cfd3da;font-size:12px}
.hero-agent .dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#2ecc71;box-shadow:0 0 0 3px rgba(46,204,113,.25)}
.hero-agent header button,.aichat header .ai-spk{background:rgba(255,255,255,.1);border:0;color:#fff;border-radius:8px;width:32px;height:32px;cursor:pointer;font-size:15px}
.hero-agent .ai-msgs{height:250px;background:transparent;padding:12px}
.hero-agent .ai-m.bot{background:rgba(255,255,255,.96);color:#14141a;border:0}
.hero-agent .ai-card,.hero-agent .ai-links a{color:#14141a}
.hero-agent .ai-foot{background:#fff;color:#111}
.hero-agent.min .ai-msgs,.hero-agent.min .ai-foot{display:none}
.ai-foot .ai-chips{border-top:0}
.ai-form .ai-mic{background:var(--orange);color:var(--on-orange,#1a0e06);border:0;border-radius:50%;width:42px;height:42px;flex:0 0 42px;font-size:18px;cursor:pointer;padding:0}
.ai-form .ai-mic.on{background:#c62828;color:#fff;animation:aimic 1s infinite}
@keyframes aimic{0%{box-shadow:0 0 0 0 rgba(198,40,40,.55)}100%{box-shadow:0 0 0 14px rgba(198,40,40,0)}}
.aichat header img{width:38px;height:38px;border-radius:50%;object-fit:cover;object-position:60% 30%;border:2px solid var(--orange);margin-inline-end:10px}
.aichat header>div{flex:1}.aichat header .ai-spk{margin-inline-end:6px}
.ai-lead{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid var(--orange);border-radius:12px;padding:10px;position:relative}
.ai-lead input{border:1px solid #cfcfd6;border-radius:8px;padding:9px 10px;font:inherit;font-size:14px}.ai-lead button{background:var(--orange);color:var(--on-orange,#1a0e06);border:0;border-radius:8px;padding:10px;font-weight:800;cursor:pointer;font-family:inherit}
@media (max-width:1100px){.hero-agent{width:350px}}
@media (max-width:900px){
  .hero{display:flex;flex-direction:column}
  .hero-agent{position:static;order:2;width:auto;max-width:none;margin:0 12px 16px;inset:auto}
  .hero-brands{position:static;order:3;padding-bottom:14px}
  .hero-dots{bottom:auto!important;position:relative;order:1;justify-content:center;padding:8px 0}
  .hero-inner{padding-bottom:28px}
  .hero-agent .ai-msgs{height:230px}
}

@media (min-width:901px) and (max-width:1180px){.hero-inner h1,.hero-inner .lead{max-width:calc(100% - 380px)}}
@media (min-width:901px){
  .hero-slide{min-height:580px}
  .hero-agent{top:22px;bottom:158px;height:auto}
  .hero-agent .ai-msgs{flex:1;height:auto;min-height:0}
}
.hero-agent .ai-foot .ai-chips{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;max-height:none;padding-bottom:6px;scrollbar-width:thin}
.hero-agent .ai-foot .ai-chips button{white-space:nowrap;flex:0 0 auto}
.aichat-btn.hide{display:none}
.ai-av{width:46px;height:46px;flex:0 0 46px;border-radius:50%;background:#1d1d22;border:2px solid var(--orange);display:grid;place-items:center;font-size:24px}
.aichat header .ai-av{width:38px;height:38px;flex-basis:38px;font-size:20px;margin-inline-end:10px}

/* ---- project tools: calculators, BOQ, project list, compare ---- */
.tool-nav{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.tool-nav a{padding:8px 14px;border:1px solid var(--line);border-radius:999px;font-size:14px;font-weight:700;background:#fff}
.tool-nav a.on{background:var(--black);color:#fff;border-color:var(--black)}.tool-nav a i{font-style:normal;background:var(--orange);color:var(--on-orange,#1a0e06);border-radius:999px;padding:0 7px;font-size:12px;margin-inline-start:4px}
.lead-muted{color:var(--muted);max-width:820px;margin:0 0 16px}
.alert-warn{background:#fff7e6;color:#7a4b00;border:1px solid #f3d9a3;padding:11px 14px;border-radius:10px;margin-bottom:16px;font-size:14px}
.calc-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:8px;margin-bottom:14px;scrollbar-width:thin}
.calc-tabs button{flex:none;padding:9px 15px;border:1px solid var(--line);border-radius:999px;background:#fff;font-weight:700;font-size:14px;cursor:pointer;font-family:inherit}
.calc-tabs button.on{background:var(--orange);border-color:var(--orange);color:var(--on-orange,#1a0e06)}
.calc-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:18px;align-items:start}
.calc-in .form-group input{max-width:100%}
.res-row{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);font-size:15px}.res-row b{font-size:18px}
.formula{margin-top:8px;padding:12px;background:#f5f5f6;border-radius:10px;font-size:13.5px;color:#444;line-height:1.55}
details summary{cursor:pointer;font-weight:700;margin:14px 0 4px}
.match-head{margin:18px 0 8px;font-weight:800}.match-box{border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:10px}.mb-t{font-weight:700;margin-bottom:6px}
.mb-p{display:flex;gap:10px;align-items:center;padding:8px 0;border-top:1px solid #eee}.mb-p img{width:52px;height:52px;object-fit:contain}.mb-p>div{flex:1;min-width:0}.mb-p a{font-weight:700;font-size:14px;display:block}.mb-p small{color:var(--muted)}
.btn-s{padding:8px 12px;font-size:13px;background:#eee;color:#111;border-radius:8px;border:0;font-weight:700;cursor:pointer;font-family:inherit}
.tool-two{display:grid;grid-template-columns:1.2fr 1fr;gap:18px;align-items:start}.how{padding-inline-start:20px;line-height:1.7}
.tool-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px}.tool-summary div{border:1px solid var(--line);border-radius:12px;padding:12px;background:#fff}.tool-summary b{display:block;font-size:26px}.tool-summary span{font-size:13px;color:var(--muted)}
.tool-summary .ok b{color:var(--save,#12703f)}.tool-summary .mid b{color:#b45309}.tool-summary .bad b{color:var(--sale,#c62828)}
.tool-table-wrap{overflow-x:auto;margin-bottom:12px}.tool-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;font-size:14px}
.tool-table th{background:#f5f5f6;text-align:start;padding:10px;font-size:12.5px;text-transform:uppercase;letter-spacing:.04em;color:#555}.tool-table td{padding:10px;border-top:1px solid var(--line);vertical-align:top}
.tool-table select{max-width:420px;width:100%;padding:8px;border:1px solid #cfcfd6;border-radius:8px;font:inherit;font-size:13.5px}.tq{width:90px;padding:7px;border:1px solid #cfcfd6;border-radius:8px}
.tool-table .why{display:block;color:var(--muted);margin-top:4px;font-size:12px}.m-possible td:first-child{border-inline-start:4px solid #f0a000}.m-exact td:first-child{border-inline-start:4px solid var(--save,#12703f)}.m-weak td:first-child{border-inline-start:4px solid var(--sale,#c62828)}
.warn{color:var(--sale,#c62828);font-weight:700}.ok-t{color:var(--save,#12703f);font-weight:700}.muted{color:var(--muted);font-size:13.5px}.big{font-size:20px}
.link-btn{background:none;border:0;color:#b3261e;cursor:pointer;font-size:16px;font-family:inherit}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.cmp td,.cmp th{min-width:170px}.cmp th{width:130px}.cmp-img{width:110px;height:110px;object-fit:contain}.tag-best{background:var(--save,#12703f);color:#fff;border-radius:6px;padding:2px 7px;font-size:11.5px;font-weight:800}.save{color:var(--save,#12703f);font-weight:800}
.pc-cmp{display:block;text-align:center;font-size:12.5px;color:#555;margin-top:6px;font-weight:600}.pc-cmp:hover{color:var(--orange)}
@media(max-width:900px){.calc-grid,.tool-two{grid-template-columns:1fr}.tool-summary{grid-template-columns:1fr 1fr}.grid2{grid-template-columns:1fr}}
.sg-box{position:absolute;inset-inline:0;top:calc(100% + 6px);background:#fff;color:#111;border-radius:12px;box-shadow:0 14px 40px rgba(0,0,0,.28);z-index:1200;overflow:hidden;text-align:start}
.sg-box[hidden]{display:none}.sg-box a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-bottom:1px solid #f0f0f2;font-size:14px;color:#111}.sg-box a:hover{background:#fff1e8}
.sg-p img{width:38px;height:38px;object-fit:contain}.sg-p span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sg-cat{font-weight:800;background:#fafafa}.sg-all{justify-content:center;font-weight:800;color:var(--orange)!important}.sg-none{padding:12px;color:#666;font-size:14px}

/* header AI assistant button */
.h-ai { display: inline-flex; align-items: center; gap: 8px; background: transparent; color: #fff; border: 1.5px solid var(--orange, #f26a0f); border-radius: 10px; padding: 5px 12px; cursor: pointer; font: inherit; text-align: start; line-height: 1.2; }
.h-ai:hover { background: rgba(242,106,15,.16); }
.h-ai-i { font-size: 20px; }
.h-ai-t { display: flex; flex-direction: column; }
.h-ai-t .t { font-size: 11px; opacity: .75; }
.h-ai-t .b { font-size: 13px; font-weight: 700; white-space: nowrap; }
@media (max-width: 900px) { .h-ai-t .t { display: none; } .h-ai-t .b { font-size: 12px; } }
@media (max-width: 560px) { .h-ai { padding: 6px 9px; } .h-ai-t { display: none; } }

/* wallet / rewards */
.rw-box { margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--line, #ddd); display: flex; flex-direction: column; gap: 12px; }
.rw-promo label { font-weight: 700; font-size: 13.5px; display: block; margin-bottom: 6px; }
.rw-line { display: flex; gap: 8px; }
.rw-line input { flex: 1; min-width: 0; text-transform: uppercase; }
.rw-line .btn { white-space: nowrap; padding-inline: 14px; }
.rw-msg { font-size: 13px; margin-top: 6px; font-weight: 600; }
.rw-msg.ok { color: #1f7a3d; } .rw-msg.bad { color: #b3261e; }
.rw-wallet { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; cursor: pointer; }
.rw-wallet input { margin-top: 4px; }
.rw-earn { background: #fff4ea; border: 1px solid #f9c9a2; color: #7a3b0a; padding: 10px 12px; border-radius: 8px; font-size: 13.5px; }
.wl-hero { background: #111; color: #fff; border-radius: 14px; padding: 22px; display: grid; gap: 6px; margin-bottom: 20px; }
.wl-hero .amt { font-size: 38px; font-weight: 800; color: var(--orange, #f26b1d); line-height: 1.1; }
.wl-hero small { color: #cfc6bd; }
.wl-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 16px; margin-bottom: 22px; }
.wl-card { border: 1px solid var(--line, #e5e0da); border-radius: 12px; padding: 16px; display: grid; gap: 8px; align-content: start; }
.wl-card h3 { margin: 0; font-size: 17px; }
.wl-ref { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.wl-ref code { background: #f6f1eb; padding: 8px 12px; border-radius: 8px; font-size: 18px; font-weight: 800; letter-spacing: .08em; }
.wl-pos { color: #1f7a3d; font-weight: 700; } .wl-neg { color: #b3261e; font-weight: 700; }

/* coins */
.tc-bal { background: #111; color: #fff; border-radius: 12px; padding: 14px 18px; margin-bottom: 14px; font-size: 16px; }
.tc-bal b { color: var(--orange, #f26b1d); font-size: 26px; }
.tc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.tc-card { position: relative; display: grid; gap: 4px; justify-items: center; text-align: center; border: 1.5px solid var(--line, #e5e0da); background: #f8f8f8; border-radius: 12px; padding: 18px 8px 14px; cursor: pointer; }
.tc-card input[type=radio] { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.tc-card:has(input[type=radio]:checked) { border-color: var(--orange, #f26b1d); background: #fff1e6; }
.tc-card:focus-within { outline: 2px solid var(--orange, #f26b1d); outline-offset: 2px; }
.tc-coins { font-size: 22px; } .tc-coins b { font-size: 26px; }
.tc-price { color: #6b6258; font-weight: 700; } .tc-price input { width: 90px; text-align: center; position: relative; z-index: 2; }
.tc-bonus { background: #e5f4ea; color: #1f7a3d; font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 99px; }
.pc-coins, .pdp-coins { font-size: 12.5px; color: #7a5a14; font-weight: 700; }
.pc-coins { margin: 2px 0 4px; } .pdp-coins { margin: 6px 0 10px; font-size: 14px; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.coin-price { background: #fff6dc; border: 1px solid #f0d58a; border-radius: 99px; padding: 2px 9px; white-space: nowrap; }

/* ---- SEO text blocks / popular searches ---- */
.seo-box{margin:34px 0 10px;padding:22px;border:1px solid #e7e7ea;border-radius:14px;background:#fff;line-height:1.7;color:#333}
.seo-box h2{margin:0 0 10px;font-size:1.2rem;color:#101012}
.seo-box p{margin:0 0 10px}
.seo-tags{display:flex;flex-wrap:wrap;gap:8px}
.seo-tags a{padding:5px 12px;border-radius:99px;background:#fff4ea;color:#c2530a;font-size:.85rem;text-decoration:none;border:1px solid #ffd9b8}
.footer-popular{padding:18px 0;border-top:1px solid rgba(255,255,255,.12);margin-top:18px}
.footer-popular h4{margin:0 0 10px}
.footer-popular div{display:flex;flex-wrap:wrap;gap:6px 16px}
.footer-popular a{font-size:.85rem;opacity:.85}
.area-hero{padding:34px 0 10px}.area-hero h1{margin:0 0 8px}
.area-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin:18px 0}
.area-cats a{display:block;padding:14px 16px;border:1px solid #e7e7ea;border-radius:12px;background:#fff;color:#101012;text-decoration:none;font-weight:600}
.area-cats a small{display:block;font-weight:400;color:#777}
.area-faq details{border:1px solid #e7e7ea;border-radius:10px;padding:12px 14px;margin:8px 0;background:#fff}
.area-faq summary{cursor:pointer;font-weight:600}

/* ---- floating AI button: same family as the WhatsApp button, always visible, right side above it ---- */
.aichat-btn{inset-inline-start:auto;inset-inline-end:18px;bottom:80px;background:linear-gradient(135deg,#ff8a2b,#ff6a00);color:#1a0e06;border:0;padding:13px 20px;font-size:14.5px;box-shadow:0 10px 26px rgba(255,106,0,.5);animation:aiPulse 2.4s infinite;white-space:nowrap}
.aichat-btn:hover{background:linear-gradient(135deg,#ff9a45,#ff7414);transform:translateY(-3px)}
.aichat-btn.on{animation:none}
.aichat-btn.hide{display:flex}
.aichat-btn .ai-ic{font-size:19px}
@keyframes aiPulse{0%{box-shadow:0 10px 26px rgba(255,106,0,.5),0 0 0 0 rgba(255,106,0,.55)}70%{box-shadow:0 10px 26px rgba(255,106,0,.5),0 0 0 16px rgba(255,106,0,0)}100%{box-shadow:0 10px 26px rgba(255,106,0,.5),0 0 0 0 rgba(255,106,0,0)}}
@media(prefers-reduced-motion:reduce){.aichat-btn{animation:none}}
.aichat{inset-inline-start:auto;inset-inline-end:18px;bottom:138px;height:min(600px,calc(100vh - 170px))}
@media(max-width:760px){
  .aichat-btn{bottom:132px;padding:11px 15px;font-size:13px}
  .aichat-btn .ai-tx{display:inline;max-width:62vw;overflow:hidden;text-overflow:ellipsis}
  .aichat-btn .ai-ic{display:none}
  .aichat{inset-inline:8px;width:auto;bottom:70px;height:calc(100vh - 90px)}
  html.ai-open .aichat-btn{display:none}
}

/* ---- A–Z catalogue ---- */
.az-bar{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 18px;position:sticky;top:0;background:#fff;padding:8px 0;z-index:5}
.az-bar a{padding:6px 11px;border:1px solid #e1e1e6;border-radius:8px;font-weight:700;color:#101012;text-decoration:none;font-size:.9rem}
.az-bar a small{color:#888;font-weight:500;font-size:.72rem}
.az-bar a.on,.az-bar a:hover{background:#ff6a00;border-color:#ff6a00;color:#1a0e06}.az-bar a.on small{color:#1a0e06}
.az-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:10px}
.az-item{display:flex;gap:12px;align-items:center;padding:10px;border:1px solid #e7e7ea;border-radius:12px;background:#fff;color:inherit;text-decoration:none}
.az-item:hover{border-color:#ff6a00;box-shadow:0 4px 14px rgba(0,0,0,.08)}
.az-item img{width:64px;height:64px;object-fit:contain;border-radius:8px;background:#f6f6f8;flex:0 0 64px}
.az-item .t{display:flex;flex-direction:column;min-width:0;gap:2px}.az-item b{font-size:.88rem;line-height:1.3;max-height:2.6em;overflow:hidden}
.az-item small{color:#888;font-size:.74rem}.az-item em{font-style:normal;font-weight:800;color:#c2530a;font-size:.9rem}.az-item em i{font-style:normal;color:#b00020;font-weight:600}

/* ---- AI BuildMate ---- */
.bm-hero{margin:16px 0 8px;padding:34px 28px;border-radius:18px;background:linear-gradient(135deg,#101012 0%,#26262c 100%);color:#fff}
.bm-hero h1{margin:10px 0;font-size:clamp(1.6rem,4vw,2.4rem)}.bm-hero p{max-width:640px;color:#d8d8de;line-height:1.7}
.bm-pill{display:inline-block;padding:5px 12px;border-radius:99px;background:rgba(255,106,0,.18);color:#ffb273;font-weight:700;font-size:.82rem}
.bm-hero .btn-s{background:#fff;color:#101012}
.bm-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin:12px 0}
.bm-tile{display:flex;flex-direction:column;gap:4px;padding:16px;border:1px solid #e7e7ea;border-radius:14px;background:#fff;color:#101012;text-decoration:none}
.bm-tile:hover{border-color:#ff6a00;box-shadow:0 6px 18px rgba(0,0,0,.08)}.bm-tile i{font-style:normal;font-size:1.6rem}.bm-tile small{color:#666}.bm-tile em{font-style:normal;color:#c2530a;font-weight:700;font-size:.82rem}
.bm-filter{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 16px}.bm-filter select,.bm-filter input{padding:9px 12px;border:1px solid #d6d6dc;border-radius:10px;font-family:inherit}
.bm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.bm-card{border:1px solid #e7e7ea;border-radius:14px;background:#fff;overflow:hidden;display:flex;flex-direction:column}.bm-ph img{width:100%;height:160px;object-fit:cover;display:block}
.bm-b{padding:14px;display:flex;flex-direction:column;gap:6px;flex:1}.bm-b h3{margin:0;font-size:1.02rem;line-height:1.35}.bm-b h3 a{color:#101012;text-decoration:none}.bm-b p{margin:0;color:#555;font-size:.9rem;line-height:1.5}.bm-b small{color:#777}
.bm-k{font-size:.78rem;font-weight:700;color:#c2530a}.bm-f{display:flex;justify-content:space-between;margin-top:auto;padding-top:8px;border-top:1px solid #f0f0f2;font-size:.8rem;color:#666}
.bm-empty{padding:30px;text-align:center;border:1px dashed #cfcfd6;border-radius:14px;color:#666}
.bm-rules{margin:30px 0 6px;padding:16px 20px;border-radius:14px;background:#f7f7f9;font-size:.9rem;color:#444}.bm-rules h3{margin:0 0 6px}.bm-rules li{margin:4px 0}
.bm-kindpick{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.bm-kindpick a{padding:6px 12px;border:1px solid #d6d6dc;border-radius:99px;color:#101012;text-decoration:none;font-size:.88rem}.bm-kindpick a.on{background:#ff6a00;border-color:#ff6a00;color:#1a0e06;font-weight:700}
.bm-detail{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:26px;margin-top:10px}@media(max-width:860px){.bm-detail,.bm-two{grid-template-columns:1fr!important}}
.bm-gal{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.bm-gal img{height:150px;border-radius:10px;object-fit:cover}.bm-body{line-height:1.8;margin:12px 0;white-space:normal;overflow-wrap:anywhere}
.bm-actions{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.bm-facts{display:grid;gap:10px;padding:14px;border:1px solid #e7e7ea;border-radius:14px;background:#fff}.bm-facts small{display:block;color:#777}
.bm-quote,.bm-offers,.bm-box{margin-top:14px;padding:14px;border:1px solid #ffd9b8;border-radius:14px;background:#fff8f2}.bm-box{background:#fff;border-color:#e7e7ea}
.bm-offer{margin-top:8px;padding-top:8px;border-top:1px dashed #e0c6ae}
.bm-comments{margin-top:26px}.bm-cm{padding:10px 0;border-bottom:1px solid #eee}.bm-cm p{margin:4px 0}
.bm-two{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px}.bm-row{display:flex;justify-content:space-between;gap:10px;padding:12px;border:1px solid #e7e7ea;border-radius:12px;margin:8px 0;background:#fff}
.bm-co{display:flex;gap:16px;align-items:center;margin:14px 0}.bm-co img{width:84px;height:84px;object-fit:contain;border:1px solid #e7e7ea;border-radius:12px;background:#fff}
.bm-hero .btn-s{padding:15px 24px;font-size:1rem;border-radius:12px}
.bm-offer b{display:block;font-size:1.05rem;margin:2px 0}

/* ==========================================================================
   HOME PAGE: dark "AI platform" look (only when <body class="home-dark">)
   ========================================================================== */
.home-dark{--hd-bg:#060a12;--hd-panel:#0b1322;--hd-panel2:#0e1830;--hd-line:rgba(88,160,255,.28);--hd-glow:#4cc3ff;--hd-text:#e8eefc;--hd-muted:#9db0cf;background:var(--hd-bg);color:var(--hd-text)}
.home-dark main,.home-dark .container{color:var(--hd-text)}
.home-dark .section{padding:30px 0}.home-dark .section.band{background:transparent}
.hx-gap{margin-top:22px}
.home-dark .section-head h2{color:#fff}.home-dark .section-head p{color:var(--hd-muted)}
.home-dark .see-all{color:var(--hd-glow);font-weight:700}
/* hero */
.hx{position:relative;background:#050914;color:#fff;overflow:hidden}
.hx .hero-track{min-height:650px}
.hx-slide{flex:0 0 100%;scroll-snap-align:start;position:relative;min-height:650px;display:flex;align-items:flex-start;background:transparent}
.hx-slide::before{display:none}
.hx-art{position:absolute;inset:0;background:#050914 url('../images/home/hero-skyline.svg') right center/cover no-repeat}
.hx-art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,9,20,.94) 0%,rgba(5,9,20,.72) 38%,rgba(5,9,20,.12) 70%,rgba(5,9,20,.2) 100%),linear-gradient(0deg,rgba(6,10,18,1) 0%,rgba(6,10,18,0) 30%)}
.hx-inner{position:relative;width:100%;max-width:1280px;margin:0 auto;padding:62px 20px 0}
.hx-copy{max-width:600px}
.hx-kicker{display:block;font-size:12px;letter-spacing:.2em;color:#9dc4ff;font-weight:700;margin-bottom:14px}
.hx h1{font-size:clamp(34px,5vw,56px);line-height:1.06;margin:0 0 14px;font-weight:800;letter-spacing:-.02em;color:#fff}
.hx .lead{color:#c9d6f2;font-size:clamp(15px,1.4vw,18px);max-width:520px;margin:0 0 22px;line-height:1.6}
.hx-ctas{display:flex;gap:12px;flex-wrap:wrap}
.hx-dots{bottom:150px}
.hx-ask-wrap{position:absolute;left:0;right:0;bottom:30px;max-width:1280px;margin:0 auto;padding:0 20px;pointer-events:none;z-index:4}
.hx-ask{pointer-events:auto;max-width:640px;background:rgba(7,14,32,.82);backdrop-filter:blur(10px);border:1.5px solid var(--hd-glow);border-radius:20px;padding:14px 16px;box-shadow:0 0 28px rgba(76,195,255,.28),inset 0 0 18px rgba(76,195,255,.08)}
.hx-ask-row{display:flex;align-items:center;gap:12px}
.hx-ai{flex:0 0 46px;height:46px;border-radius:50%;display:grid;place-items:center;font-weight:900;color:#fff;border:2px solid var(--hd-glow);background:radial-gradient(circle,#1d4ed8,#0b1a45);box-shadow:0 0 14px rgba(76,195,255,.6)}
.hx-ask-field{flex:1;min-width:0}.hx-ask-field label{display:block;font-weight:700;font-size:16px;color:#fff}
.hx-ask-field input{width:100%;background:transparent;border:0;border-bottom:1px solid rgba(157,196,255,.35);color:#cfe0ff;padding:6px 0;font-size:13.5px;font-family:inherit;outline:0}
.hx-ask-field input:focus{border-bottom-color:var(--hd-glow)}.hx-ask-field input::placeholder{color:#8aa0c8}
.hx-ic{flex:0 0 44px;height:44px;border-radius:12px;border:1px solid var(--hd-line);background:rgba(20,40,90,.55);color:#fff;font-size:18px;display:grid;place-items:center;cursor:pointer;text-decoration:none}
.hx-mic{background:#1d4ed8;border-color:#4c8dff}.hx-ic:hover{border-color:var(--hd-glow)}
.hx-go{background:var(--orange);color:var(--on-orange);border:0;border-radius:12px;font-weight:800;padding:0 18px;height:44px;cursor:pointer;font-family:inherit}
.hx-chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:12px;padding-top:12px;border-top:1px solid rgba(157,196,255,.22);font-size:12.5px;color:var(--hd-muted)}
.hx-chips button{background:rgba(20,40,90,.55);border:1px solid var(--hd-line);color:#e8eefc;border-radius:12px;padding:9px 14px;font-weight:600;cursor:pointer;font-family:inherit;font-size:13px}.hx-chips button:hover{border-color:var(--hd-glow)}
.hx-side{position:absolute;right:max(20px,calc((100vw - 1240px)/2));top:46px;width:310px;display:flex;flex-direction:column;gap:20px;z-index:4}
.hx-rail{background:rgba(7,14,32,.55);backdrop-filter:blur(8px);border:1px solid var(--hd-line);border-radius:16px;padding:14px;display:grid;gap:8px}
.hx-rail b{font-size:12.5px;letter-spacing:.14em;color:#fff;margin-bottom:4px}
.hx-rail a{display:flex;align-items:center;gap:12px;padding:8px 10px;border:1px solid var(--hd-line);border-radius:12px;background:rgba(20,40,90,.4);color:#fff;text-decoration:none;font-weight:600}.hx-rail a i{font-style:normal;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:rgba(76,195,255,.15)}
.hx-rail a:hover{border-color:var(--hd-glow)}
.hx-est{display:flex;gap:12px;background:rgba(7,14,32,.78);backdrop-filter:blur(8px);border:1.5px solid var(--hd-line);border-radius:16px;padding:16px;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.hx-est>i{font-style:normal;font-size:26px}.hx-est b{display:block;color:#fff;font-size:15.5px}.hx-est small{display:block;color:#c0cde8;margin:4px 0 10px;line-height:1.45}
.hx-brands{background:#050914;border-bottom:1px solid var(--hd-line);padding:12px 0 14px}
.hx-brands .hero-brands-label{margin:0 0 8px;max-width:none;color:#9db0cf}
/* categories */
.hx-arrows{display:flex;align-items:center;gap:8px}.hx-arrows button{width:36px;height:36px;border-radius:50%;border:1px solid var(--hd-line);background:var(--hd-panel);color:#fff;font-size:20px;cursor:pointer}.hx-arrows button:hover{border-color:var(--hd-glow)}.hx-arrows .see-all{margin-inline-start:8px}
.hx-cats{grid-auto-columns:158px}
.home-dark .cat-card{background:linear-gradient(180deg,var(--hd-panel2),var(--hd-panel));border:1px solid var(--hd-line);color:#fff;padding:12px 10px 14px;border-radius:14px}
.home-dark .cat-card:hover{border-color:var(--hd-glow);box-shadow:0 0 20px rgba(76,195,255,.25);transform:translateY(-3px)}
.home-dark .cat-card img{width:100%;height:96px;border-radius:10px;background:#fff;object-fit:contain;padding:6px;margin-bottom:10px}
.home-dark .cat-card span{color:#fff}.home-dark .cat-card small{color:var(--hd-muted)}
/* coupon / coins banner */
.hx-gift{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;align-items:center;padding:26px 30px;border-radius:20px;border:1.5px solid rgba(255,196,102,.55);background:radial-gradient(circle at 85% 50%,rgba(255,190,90,.22),transparent 55%),linear-gradient(120deg,#0b1020,#16100a);box-shadow:0 0 30px rgba(255,170,60,.12)}
.hx-gk{font-size:12px;letter-spacing:.16em;color:#ffc466;font-weight:800}.hx-gift h2{margin:6px 0 8px;font-size:clamp(22px,3vw,32px);color:#fff}.hx-gift p{margin:0 0 12px;color:#e6dcc8}
.hx-count{display:flex;gap:10px}.hx-count div{min-width:62px;text-align:center;padding:8px 6px;border-radius:10px;border:1px solid rgba(255,196,102,.45);background:rgba(0,0,0,.35)}.hx-count b{display:block;font-size:22px;color:#fff}.hx-count small{color:#c9b790;font-size:11px}
.hx-gift-r{text-align:center;padding:16px;border:1.5px dashed rgba(255,196,102,.6);border-radius:16px;background:rgba(0,0,0,.28);display:grid;gap:8px;justify-items:center}
.hx-gift-r small{color:#d7c9a8}.hx-code{background:linear-gradient(180deg,#e6b45c,#b9822a);color:#1a0e06;border:0;border-radius:10px;padding:12px 22px;font-size:22px;font-weight:900;letter-spacing:.08em;cursor:pointer;font-family:inherit}
.hx-how{color:#ffc466;font-weight:700;text-decoration:underline}
/* contractor command center */
.hx-cc{display:grid;grid-template-columns:300px 1fr;gap:18px;padding:18px;border-radius:20px;border:1px solid var(--hd-line);background:linear-gradient(135deg,#0b1428,#07101f)}
.hx-cc-t{padding:14px 10px}.hx-cc-t span{letter-spacing:.14em;font-weight:700;color:#9dc4ff;font-size:13px}.hx-cc-t h2{margin:4px 0 8px;font-size:30px;color:#fff;line-height:1.05}.hx-cc-t p{color:var(--hd-muted);margin:0}
.hx-cc-g{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.hx-cc-g a{display:flex;flex-direction:column;gap:6px;padding:16px;border-radius:14px;border:1px solid var(--hd-line);background:rgba(20,40,90,.35);color:#fff;text-decoration:none}
.hx-cc-g a:hover{border-color:var(--hd-glow);box-shadow:0 0 18px rgba(76,195,255,.22)}.hx-cc-g i{font-style:normal;font-size:24px}.hx-cc-g b{font-size:14.5px}.hx-cc-g small{color:var(--hd-muted);font-size:12.5px;line-height:1.4}
/* three panels */
.hx-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.hx-panel{display:flex;flex-direction:column;gap:6px;padding:20px;border-radius:20px;border:1px solid var(--hd-line);background:linear-gradient(160deg,#0c1730,#070f1f);min-width:0}
.hx-pk{font-size:12px;letter-spacing:.16em;color:#9dc4ff;font-weight:700}.hx-panel h3{margin:2px 0;font-size:24px;color:#fff}.hx-panel p{margin:0;color:var(--hd-muted);font-size:14px}
.hx-map,.hx-bmimg{width:100%;height:auto;margin:6px 0}.hx-pills{display:flex;flex-wrap:wrap;gap:8px}.hx-pills span{padding:7px 12px;border:1px solid var(--hd-line);border-radius:99px;font-size:12.5px;color:#dbe6ff;background:rgba(20,40,90,.4)}
.hx-note{color:var(--hd-muted)}
.hx-tools{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:8px}
.hx-tools a,.hx-tools button{display:flex;flex-direction:column;gap:3px;text-align:start;padding:13px;border-radius:12px;border:1px solid var(--hd-line);background:rgba(20,40,90,.4);color:#fff;text-decoration:none;cursor:pointer;font-family:inherit}
.hx-tools a:hover,.hx-tools button:hover{border-color:var(--hd-glow)}.hx-tools i{font-style:normal;font-size:20px}.hx-tools b{font-size:13.5px}.hx-tools small{color:var(--hd-muted);font-size:12px}
/* product cards on dark */
.home-dark .product-card{background:linear-gradient(180deg,#0d1730,#08101f);border:1px solid var(--hd-line);color:#fff}
.home-dark .product-card:hover{border-color:var(--hd-glow);box-shadow:0 0 22px rgba(76,195,255,.2)}
.home-dark .product-card .pc-img{background:#fff;border-radius:12px 12px 0 0}
.home-dark .pc-name{color:#fff}.home-dark .price{color:#fff}.home-dark .price-compare{color:#8aa0c8}.home-dark .pc-save{color:#5ee08e}.home-dark .pc-stock{color:#9db0cf}.home-dark .pc-stock.low{color:#ffb454}.home-dark .pc-stock.out{color:#ff7b7b}
.home-dark .pc-coins{color:#ffd27a}.home-dark .pc-cmp{color:#9db0cf}.home-dark .pc-cmp:hover{color:#fff}
/* trust strip, quote band, newsletter */
.hx-trust{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;padding:18px;border-radius:18px;border:1px solid var(--hd-line);background:#08101f}
.hx-trust>*{display:flex;flex-direction:column;gap:3px;color:#fff;text-decoration:none}.hx-trust i{font-style:normal;font-size:22px}.hx-trust b{font-size:14px}.hx-trust small{color:var(--hd-muted);font-size:12.5px}
.home-dark .quote-band{background:linear-gradient(135deg,#0b1428,#101a33);border:1px solid var(--hd-line)}
.home-dark .newsletter{background:#08101f;border-color:var(--hd-line)}.home-dark .newsletter h2{color:#fff}.home-dark .newsletter p{color:var(--hd-muted)}
.home-dark .newsletter input[type=email]{background:#0b1322;border-color:var(--hd-line);color:#fff}
/* responsive */
@media(max-width:1100px){.hx-3{grid-template-columns:1fr 1fr}.hx-cc{grid-template-columns:1fr}.hx-cc-g{grid-template-columns:repeat(3,1fr)}.hx-trust{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){
  .hx .hero-track,.hx-slide{min-height:0}.hx-inner{padding:34px 18px 20px}.hx-ask-wrap{position:relative;bottom:auto;padding:0 14px 14px}.hx-ask{max-width:none}
  .hx-side{position:relative;right:auto;top:auto;width:auto;margin:0 14px 18px}.hx-dots{bottom:auto;top:14px}
  .hx-gift{grid-template-columns:1fr}
}
@media(max-width:640px){.hx-3{grid-template-columns:1fr}.hx-cc-g{grid-template-columns:1fr 1fr}.hx-trust{grid-template-columns:1fr 1fr}.hx-ask-row{flex-wrap:wrap}.hx-ask-field{flex:1 1 calc(100% - 60px)}.hx-go{flex:1}.hx-cats{grid-auto-columns:140px}}

/* RFQ (AI BuildMate) */
.rfq-2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.rfq-row{display:grid;grid-template-columns:1.6fr 1.6fr 90px 90px 36px;gap:8px;margin:8px 0}.rfq-row input,.rfq-row select{min-width:0}
.rfq-x{border:1px solid #d6d6dc;background:#fff;border-radius:8px;cursor:pointer;font-size:18px}
.rfq-sug{position:absolute;z-index:20;left:0;right:0;background:#fff;border:1px solid #d6d6dc;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.12);max-height:260px;overflow:auto}.rfq-sug button{display:block;width:100%;text-align:start;padding:10px 12px;border:0;background:none;cursor:pointer}.rfq-sug button:hover{background:#fff4e8}
.rfq-btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.rfq-head h1{font-size:1.5rem}.rfq-actions{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}
.rfq-sum{background:#fff8ef;border:1px solid #ffd9b0;border-radius:12px;padding:12px 14px;margin:12px 0}.rfq-sum ul{margin:6px 0 0;padding-inline-start:20px}
.rfq-gap{margin-top:8px;color:#8a5a00}
.rfq-inv{border:1px solid #e3e3e8;border-radius:12px;padding:12px 14px;margin:10px 0;background:#fff}.rfq-inv-h{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.rfq-f{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-start;margin:6px 0}.rfq-f textarea{flex:1 1 280px}
.rfq-msg{background:#f4f5f7;border-radius:10px;padding:8px 12px;margin:6px 0}.rfq-msg.info{background:#fff4e0}
.rfq-box{border:1px solid #e3e3e8;border-radius:12px;padding:10px 14px;margin:10px 0;background:#fff}.rfq-box summary{cursor:pointer}
.rfq-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px}
.rfq-total{background:#111;color:#fff;border-radius:10px;padding:12px 14px;margin:12px 0}
.rfq-sup{display:grid;gap:10px}.rfq-supc{display:flex;gap:12px;align-items:flex-start;border:1px solid #e3e3e8;border-radius:12px;padding:12px;background:#fff;cursor:pointer}.rfq-supc:has(input:checked){border-color:#ff6a00;background:#fff8ef}
.rfq-why{margin:4px 0 0;padding-inline-start:18px;color:#555;font-size:.85rem}.rfq-ver{color:#12703f;font-size:.8rem;font-weight:700}
.rfq-metrics{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0}.rfq-m{background:#f4f5f7;border-radius:10px;padding:10px 14px;min-width:120px}.rfq-m b{display:block;font-size:1.25rem}.rfq-m span{font-size:.78rem;color:#666}
.rfq-perf{margin:8px 0 18px}.rfq-notes{list-style:none;padding:0}.rfq-notes li{padding:8px 0;border-bottom:1px solid #eee}.rfq-notes li.new{font-weight:700}
.rfq-sub td{background:#fafafa}.table-scroll{overflow-x:auto}
@media(max-width:700px){.rfq-2{grid-template-columns:1fr}.rfq-row{grid-template-columns:1fr 1fr 80px 80px 36px}.rfq-row input[name="item_name[]"],.rfq-row input[name="item_spec[]"]{grid-column:span 2}}

/* Resume checker / careers */
.rc{max-width:900px}.rc-hero{text-align:center;padding:24px 0 8px}.rc-hero h1{font-size:clamp(1.6rem,4vw,2.4rem);margin:0 0 10px}.rc-hero>p{max-width:640px;margin:0 auto 18px;color:#555}
.rc-form{max-width:640px;margin:0 auto;text-align:start}
.rc-drop{display:flex;flex-direction:column;gap:6px;align-items:center;justify-content:center;text-align:center;border:2px dashed #ff6a00;border-radius:16px;background:#fff8ef;padding:34px 16px;cursor:pointer}.rc-drop.on{background:#ffe9d2}.rc-drop input{position:absolute;opacity:0;width:1px;height:1px}.rc-drop span{color:#666;font-size:.9rem}.rc-drop em{font-style:normal;color:#12703f;font-weight:700}
.rc-opt{margin:14px 0;border:1px solid #e3e3e8;border-radius:12px;padding:10px 14px;background:#fff}.rc-opt summary{cursor:pointer;font-weight:700}
.rc-form .btn-lg{width:100%}
.rc-info{margin:34px 0}.rc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin:12px 0}.rc-card{border:1px solid #e3e3e8;border-radius:12px;padding:14px;background:#fff}.rc-card p{margin:6px 0 0;color:#666;font-size:.9rem}
.rc-top{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin:16px 0}.rc-ring{position:relative;width:150px;height:150px;flex:0 0 150px}.rc-num{position:absolute;inset:0;display:grid;place-content:center;text-align:center}.rc-num b{font-size:2.4rem;line-height:1}.rc-num span{color:#777;font-size:.85rem}
.rc-sum{flex:1;min-width:260px}.rc-tiers{display:grid;gap:8px}.rc-tiers>div{display:grid;grid-template-columns:1fr 50px;gap:2px 10px;align-items:center}.rc-tiers small{grid-column:1/-1;color:#555}.rc-bar{height:10px;background:#eceef2;border-radius:99px;overflow:hidden}.rc-bar i{display:block;height:100%;background:#ff6a00}
.rc-btns{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0 18px}
.rc-tasks{background:#fff8ef;border:1px solid #ffd9b0;border-radius:14px;padding:14px 18px;margin:12px 0}.rc-tasks ol{padding-inline-start:20px;margin:8px 0 0}.rc-tasks li{margin:10px 0}
.rc-kw{border:1px solid #e3e3e8;border-radius:14px;padding:14px 18px;margin:12px 0;background:#fff}.rc-chip{display:inline-block;padding:3px 10px;margin:3px;border-radius:99px;font-size:.85rem}.rc-chip.ok{background:#e6f4ea;color:#12703f}.rc-chip.miss{background:#fde8e8;color:#a02020}
.rc-cat{margin:22px 0}.rc-row{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid #eee}.rc-row p{margin:4px 0 0;color:#444}.rc-ic{flex:0 0 28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:900}.rc-ex{margin:6px 0 2px;padding-inline-start:18px;color:#555;font-size:.88rem}
@media print{header,footer,.aichat-btn,.wa-float,.rc-btns,.top-strip,nav{display:none!important}.rc-row{break-inside:avoid}}
.rc-promo{display:flex;gap:14px;align-items:center;border:1.5px solid #ff6a00;background:#fff8ef;border-radius:14px;padding:14px 16px;margin:0 0 18px;color:#111;text-decoration:none}.rc-promo>span{font-size:2rem}.rc-promo div{flex:1}.rc-promo b{display:block}.rc-promo small{color:#555}.rc-promo i{font-style:normal;font-weight:800;color:#ff6a00;white-space:nowrap}
.job-list{display:grid;gap:12px}.job-card{border:1px solid #e3e3e8;border-radius:14px;padding:14px 16px;background:#fff}.job-card h3{margin:0 0 4px}.job-card details{margin:8px 0}.job-card summary{cursor:pointer;font-weight:700}
@media(max-width:560px){.rc-promo{flex-wrap:wrap}.rc-promo i{width:100%}}

/* ---- BuildMate composer, video (v19) ---- */
.bmq{margin:18px 0 6px;padding:14px;border:1px solid #e7e7ea;border-radius:16px;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.bmq-row{display:flex;gap:10px;align-items:flex-start}.bmq-av{flex:0 0 42px;height:42px;border-radius:50%;background:#ff6a00;color:#101012;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.1rem}
.bmq textarea{flex:1;border:0;background:#f2f3f5;border-radius:22px;padding:11px 16px;font:inherit;resize:none;min-height:42px;outline:none}.bmq textarea:focus{background:#ececf0}
.bmq-ph{flex:1;background:#f2f3f5;border-radius:22px;padding:11px 16px;color:#65676b;text-decoration:none}.bmq-ph:hover{background:#e8e9ec}
.bmq-more{margin-top:10px;padding-top:8px;border-top:1px solid #eee}.bmq-foot{display:none;justify-content:space-between;align-items:center;gap:10px;margin-top:10px}.bmq-f.open .bmq-foot{display:flex}
.bmc{border-radius:12px;position:relative}.bmc.drag{outline:2px dashed #ff6a00;outline-offset:4px;background:#fff8f2}
.bmc-add{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.bmc-btn{display:inline-flex;gap:6px;align-items:center;border:0;background:#f7f8fa;border-radius:10px;padding:9px 14px;font:inherit;font-weight:700;color:#444;cursor:pointer}.bmc-btn:hover{background:#eceef2}.bmc-ic{font-size:1.25rem}
.bmc-hint{font-size:.78rem;color:#888;flex:1 1 220px}.bmc-note{font-size:.86rem;margin-top:6px;color:#555;min-height:1px}.bmc-note.bad{color:#b00020;font-weight:600}
.bmc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px;margin-bottom:8px}.bmc-grid:empty{display:none}
.bmc-t{position:relative;border:1px solid #e1e1e6;border-radius:12px;overflow:hidden;background:#fafafa}.bmc-t.vid{grid-column:span 2}
.bmc-th{aspect-ratio:1/1;background:#111;display:flex;align-items:center;justify-content:center;overflow:hidden}.bmc-t.vid .bmc-th{aspect-ratio:16/9}.bmc-th img,.bmc-th video{width:100%;height:100%;object-fit:cover;display:block}
.bmc-play{position:absolute;inset:0 0 34px 0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.8rem;text-shadow:0 2px 8px rgba(0,0,0,.6);pointer-events:none}
.bmc-x{position:absolute;top:4px;inset-inline-end:4px;width:26px;height:26px;border:0;border-radius:50%;background:rgba(0,0,0,.65);color:#fff;cursor:pointer;font-size:.8rem;line-height:1}
.bmc-bar{height:4px;background:#e9e9ee}.bmc-bar i{display:block;height:100%;width:0;background:#ff6a00;transition:width .2s}.bmc-t.ok .bmc-bar i{background:#2f9e5b}.bmc-t.bad .bmc-bar i{background:#d33}
.bmc-s{display:block;padding:4px 8px;font-size:.72rem;color:#666;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bmc-t.bad .bmc-s{color:#b00020;white-space:normal}
button[data-wait="1"]{opacity:.55;cursor:wait}
.bm-vph,.bm-ph{position:relative;display:block}.bm-vblank{display:block;height:160px;background:#1a1a1f}.bm-vph img{width:100%;height:160px;object-fit:cover;display:block}
.bm-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.2rem;padding-inline-start:3px}
.bm-more{position:absolute;right:8px;bottom:8px;background:rgba(0,0,0,.65);color:#fff;border-radius:99px;padding:2px 9px;font-size:.78rem;font-weight:700}
.bm-vwrap{margin:12px 0;border-radius:14px;overflow:hidden;background:#000}.bm-video{width:100%;max-height:70vh;display:block;background:#000}
.bm-adm-media{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0;align-items:flex-start}.bm-adm-media img{height:90px;border-radius:8px}
.bm-lbox{position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px}.bm-lbox[hidden]{display:none}.bm-lbox img{max-width:100%;max-height:100%;border-radius:8px}.bm-lbox button{position:absolute;top:14px;inset-inline-end:14px;border:0;background:#fff;border-radius:50%;width:38px;height:38px;font-size:1rem;cursor:pointer}
.bm-mypend{margin:10px 0 18px;padding:12px;border:1px dashed #ff6a00;border-radius:14px;background:#fff8f2}.bm-mypend>b{display:block;margin-bottom:10px;color:#8a5a00}
.bmq-em{display:flex;gap:10px;align-items:center;margin:8px 0 0 52px;flex-wrap:wrap}.bmq-em select{padding:7px 10px;border:1px solid #d6d6dc;border-radius:10px;font:inherit}@media(max-width:600px){.bmq-em{margin-left:0}}
.bmq-em{display:flex;gap:10px;align-items:center;margin:8px 0 0 52px;flex-wrap:wrap}.bmq-em select{padding:7px 10px;border:1px solid #d6d6dc;border-radius:10px;font:inherit}@media(max-width:600px){.bmq-em{margin-left:0}}

/* ---- price on request (v19) ---- */
.por{display:inline-block;font-weight:800;color:#c2530a;font-size:.98rem}
.pc-por{display:block;text-align:center;margin-top:8px;padding:9px 10px;font-size:.88rem}
.por-box{margin:10px 0 14px;padding:14px;border:1px solid #ffd9b8;border-radius:14px;background:#fff8f2}.por-t{font-size:1.35rem;font-weight:800;color:#c2530a}.por-box p{margin:6px 0 10px}
.por-det{list-style:none;margin:0;padding:0;display:grid;gap:6px}.por-det li{display:flex;justify-content:space-between;gap:10px;border-top:1px dashed #f0cfb0;padding-top:6px;font-size:.92rem}.por-det span{color:#777}

/* ===== Treasure Maze (home) ===== */
.mz{background:radial-gradient(1200px 500px at 50% 0,#14203a 0,#060a12 70%);border-bottom:1px solid var(--hd-line);padding:34px 0 28px}
.mz-head{display:flex;gap:20px;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;margin-bottom:18px}
.mz-head h2{font-size:clamp(1.4rem,3vw,2.1rem);margin:6px 0;color:#fff}.mz-head p{color:var(--hd-muted);max-width:620px;margin:0}
.mz-actions{display:flex;gap:10px;flex-wrap:wrap}
.mz-stage{position:relative;aspect-ratio:966/506;background:#070b14;border:1px solid rgba(255,122,0,.35);border-radius:16px;box-shadow:0 0 40px rgba(255,122,0,.12) inset;margin:30px 50px 34px;border-radius:16px}.mz-stage svg{border-radius:16px}
.mz-stage svg{position:absolute;inset:0;width:100%;height:100%}
.mz-w{fill:none;stroke:#ff7a00;stroke-opacity:.38;stroke-width:3;stroke-linecap:round;filter:drop-shadow(0 0 3px rgba(255,122,0,.6))}
.mz-p{fill:none;stroke:#ffb24d;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:3 14;opacity:.85;filter:drop-shadow(0 0 5px #ff7a00);animation:mzflow 2.4s linear infinite}
@keyframes mzflow{to{stroke-dashoffset:-34}}
.mz-chest{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:clamp(46px,7vw,84px);aspect-ratio:1;border-radius:14px;background:linear-gradient(145deg,#ffb24d,#ff6a00);display:grid;place-items:center;color:#1a0d00;font-weight:900;font-size:clamp(1rem,2.4vw,1.7rem);box-shadow:0 0 30px 6px rgba(255,122,0,.65);z-index:2}
.mz-n{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:1px;min-width:92px;padding:6px 10px;border-radius:12px;background:rgba(8,12,22,.92);border:1px solid #ff7a00;color:#fff;text-decoration:none;text-align:center;font-size:clamp(.62rem,1.1vw,.82rem);line-height:1.2;box-shadow:0 0 14px rgba(255,122,0,.45);z-index:3;transition:transform .15s,box-shadow .15s}
.mz-n i{font-style:normal;font-size:1.25em}.mz-n b{font-weight:800}.mz-n small{color:#ffb24d;font-size:.85em}
.mz-n:hover,.mz-n:focus-visible{transform:translate(-50%,-50%) scale(1.1);box-shadow:0 0 26px rgba(255,122,0,.95);outline:2px solid #fff;outline-offset:2px}
.mz-q{border-style:dashed;border-color:#8a96b0}.mz-q small{color:#9db0cf}
.mz-tiles{display:none}
.mz-note{color:var(--hd-muted);font-size:.8rem;margin:10px 0 0}
@media (max-width:760px){
  .mz-stage{display:none}
  .mz-tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
  .mz-t{display:flex;flex-direction:column;align-items:center;gap:2px;padding:14px 8px;border-radius:12px;background:#0b1322;border:1px solid #ff7a00;color:#fff;text-decoration:none;text-align:center}
  .mz-t i{font-style:normal;font-size:1.6rem}.mz-t small{color:#ffb24d}.mz-t.mz-q{border-style:dashed;border-color:#8a96b0}.mz-t.mz-q small{color:#9db0cf}
  .mz-actions .btn{width:100%;text-align:center}
}
@media (prefers-reduced-motion:reduce){.mz-p{animation:none}.mz-n{transition:none}}

/* ===== Home v2: layout after the design mock-up ===== */
.nav-dd{position:relative}.nav-dd>a{display:block}
.nav-dd-menu{display:none;position:absolute;top:100%;inset-inline-start:0;z-index:60;width:min(640px,92vw);background:#fff;border-radius:0 0 14px 14px;box-shadow:0 18px 40px rgba(0,0,0,.35);padding:10px;grid-template-columns:repeat(3,1fr);gap:2px}
.nav-dd:hover .nav-dd-menu,.nav-dd:focus-within .nav-dd-menu{display:grid}
.nav-dd-menu a{color:#1b1b1f!important;border:0!important;padding:8px 10px!important;border-radius:8px;font-weight:600;white-space:normal!important}
.nav-dd-menu a:hover{background:#fff1e6;color:var(--orange)!important}.nav-dd-all{grid-column:1/-1;border-top:1px solid #eee!important;margin-top:4px}
.site-nav .container{overflow:visible}
@media(max-width:860px){.site-nav .container{overflow-x:auto}.nav-dd-menu{display:none!important}}

.hx2{min-height:560px;padding-bottom:70px}
.hx2 .hx-art{background:#050914 center/cover no-repeat;background-position:right center;background-size:auto 100%}
.hx2 .hx-art::after{background:linear-gradient(90deg,#050914 0%,#050914 34%,rgba(5,9,20,.55) 56%,rgba(5,9,20,.05) 100%),linear-gradient(0deg,#050914 0%,rgba(5,9,20,0) 22%)}
.hx2 .hx-inner{padding-top:56px}.hx2 .hx-copy{max-width:640px}
.hx2 h1{font-size:clamp(34px,5.4vw,62px)}.hx2 h1 em{font-style:normal;color:var(--orange)}
.hx-search{display:flex;align-items:center;gap:6px;background:#fff;border-radius:999px;padding:6px 6px 6px 18px;max-width:600px;box-shadow:0 0 0 2px var(--orange),0 0 26px rgba(255,106,0,.45);position:relative}
.hx-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:15px;padding:10px 4px;color:#111;font-family:inherit}
.hx-s-ic{opacity:.5}.hx-s-mic{border:0;background:transparent;font-size:18px;cursor:pointer;padding:6px}
.hx-search button[type=submit]{border:0;background:var(--orange);color:#fff;width:44px;height:44px;border-radius:50%;font-size:18px;cursor:pointer}
.hx-search .sg-box{top:calc(100% + 6px);color:#111;text-align:start}
.hx-chips2{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 22px}
.hx-chips2 a,.hx-chips2 button{border:1px solid rgba(255,255,255,.28);background:rgba(8,12,22,.6);color:#fff;border-radius:999px;padding:7px 14px;font-size:13px;text-decoration:none;cursor:pointer;font-family:inherit}
.hx-chips2 a:hover,.hx-chips2 button:hover{border-color:var(--orange);color:#ffb24d}
.hx-acts{display:flex;gap:12px;flex-wrap:wrap}
.hx-acts a{display:flex;gap:12px;align-items:center;padding:12px 16px;border-radius:14px;background:rgba(8,12,22,.72);border:1px solid rgba(255,255,255,.18);color:#fff;text-decoration:none;backdrop-filter:blur(6px)}
.hx-acts a:first-child{background:var(--orange);border-color:var(--orange);color:#fff}
.hx-acts a:first-child small{color:#ffe2c8}
.hx-acts i{font-style:normal;font-size:24px}.hx-acts b{display:block;font-size:14.5px}.hx-acts small{display:block;color:#aab6d0;font-size:12px}
.hx-acts a:hover{border-color:var(--orange)}

/* light area below the hero */
.hx-light{--hd-bg:#f3f5f9;--hd-panel:#fff;--hd-panel2:#fff;--hd-line:#e2e6ee;--hd-glow:#ff6a00;--hd-text:#111827;--hd-muted:#5b6475;background:#f3f5f9;color:#111827;padding-bottom:26px}
.hx-light .section-head h2{color:#111827}.hx-light .section-head p{color:#5b6475}.hx-light .see-all{color:var(--orange)}
.hx-light .mz,.hx-light .hx-brands,.hx-light .hx-cc,.hx-light .hx-panel,.hx-light .hx-trust,.hx-light .hx-gift,.hx-light .quote-band,.hx-light .newsletter,.hx-light .hx-bn{--hd-bg:#060a12;--hd-panel:#0b1322;--hd-panel2:#0e1830;--hd-line:rgba(88,160,255,.28);--hd-glow:#4cc3ff;--hd-text:#e8eefc;--hd-muted:#9db0cf;color:#e8eefc}
.hx-light .mz .container,.hx-light .hx-cc .container{color:#e8eefc}
.hx-catstrip{position:relative;z-index:3;margin-top:-34px}
.hx-cs-wrap{position:relative;background:#fff;border-radius:20px;box-shadow:0 10px 30px rgba(10,20,40,.18);padding:14px 16px}
.hx-cs-wrap .hx-cats{grid-auto-columns:116px;gap:10px}
.hx-light .cat-card{background:transparent;border:0;box-shadow:none;padding:0;color:#111827;text-align:center}
.hx-light .cat-card img{width:100%;height:92px;object-fit:cover;border-radius:12px;padding:0;background:#eef0f4;margin-bottom:8px}
.hx-light .cat-card span{color:#111827;font-size:13px;font-weight:700}.hx-light .cat-card:hover{box-shadow:none;transform:translateY(-3px)}.hx-light .cat-card:hover span{color:var(--orange)}
.hx-cs-next{position:absolute;inset-inline-end:10px;top:38%;width:38px;height:38px;border-radius:50%;border:0;background:#111;color:#fff;font-size:22px;cursor:pointer;box-shadow:0 4px 12px rgba(0,0,0,.3)}
.hx-light .mz{margin-top:22px;border-radius:0}
.hx-banners{display:grid;grid-template-columns:1.1fr 1.1fr .9fr;gap:14px}
.hx-bn{display:flex;gap:10px;justify-content:space-between;align-items:center;padding:22px;border-radius:18px;background:linear-gradient(135deg,#0a0f1c 0%,#151d33 100%);border:1px solid rgba(255,106,0,.35);position:relative;overflow:hidden;min-height:210px}
.hx-bn::after{content:"";position:absolute;inset-inline-end:-40px;top:-40px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(255,106,0,.35),transparent 70%)}
.hx-bn>*{position:relative;z-index:1}.hx-bn h3{margin:0 0 4px;font-size:clamp(20px,2.2vw,28px);color:#fff}.hx-bn b{color:#ffb24d;display:block;margin-bottom:8px}
.hx-bn p{color:#c9d3ea;font-size:13.5px;margin:0 0 14px}.hx-bn ul{margin:0 0 14px;padding:0;list-style:none;color:#dbe4f7;font-size:13.5px}.hx-bn li:before{content:"✔ ";color:var(--orange)}
.hx-bn img{width:150px;height:auto;flex:0 0 auto;opacity:.95}.hx-bn .btn{margin-inline-end:6px;margin-top:2px}
/* product cards on light */
.hx-light .product-card{background:#fff;border:1px solid #e3e7ef;color:#111827}.hx-light .product-card:hover{border-color:var(--orange);box-shadow:0 8px 22px rgba(255,106,0,.18)}
.hx-light .product-card .pc-img{background:#fff}.hx-light .pc-name,.hx-light .price{color:#111827}.hx-light .price-compare{color:#8a93a5}.hx-light .pc-save{color:#118a47}.hx-light .pc-stock{color:#5b6475}.hx-light .pc-coins{color:#a35f00}.hx-light .pc-cmp{color:#5b6475}.hx-light .pc-cmp:hover{color:#111}
.hx-light .section.hx-sec{padding:26px 0 8px}
@media(max-width:900px){.hx-banners{grid-template-columns:1fr}.hx2{min-height:0;padding-bottom:60px}.hx2 .hx-art::after{background:linear-gradient(0deg,#050914 0%,rgba(5,9,20,.82) 60%,rgba(5,9,20,.55) 100%)}.hx-acts a{flex:1 1 100%}.hx-bn img{width:110px}}
.hx-search .hx-s-mic{background:transparent!important;color:#333;width:auto;height:auto;padding:6px 8px;border:0;border-radius:8px}
.site-nav .nav-deals{margin-inline-start:0!important}
.hx-cs-wrap .hx-cats{padding-bottom:4px;margin-bottom:0}.hx-cs-wrap .cat-card{height:auto}

/* ===== Materials showroom (categories) ===== */
.shw{background:radial-gradient(900px 400px at 50% 0,#10265a 0,transparent 70%),linear-gradient(180deg,#050914,#071433 60%,#050914);padding:34px 0 30px;border-bottom:1px solid rgba(88,160,255,.25)}
.shw-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.shw-head h2{margin:6px 0 4px;font-size:clamp(1.4rem,3vw,2.1rem);color:#fff}.shw-head p{margin:0;color:#9db0cf}
.shw .hx-arrows button{width:40px;height:40px;border-radius:50%;border:1px solid rgba(88,160,255,.4);background:#0b1730;color:#fff;font-size:22px;cursor:pointer}
.shw .hx-arrows button:hover{border-color:var(--orange)}
.shw-wall{position:relative;padding:8px 0 26px;background:linear-gradient(180deg,transparent 70%,rgba(0,0,0,.45)),repeating-linear-gradient(90deg,rgba(88,160,255,.07) 0 1px,transparent 1px 46px),repeating-linear-gradient(0deg,rgba(88,160,255,.07) 0 1px,transparent 1px 46px)}
.shw-wall::after{content:"";position:absolute;left:4%;right:4%;bottom:0;height:34px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(255,106,0,.35),transparent 70%);pointer-events:none}
.shw-track{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding:10px max(20px,calc((100vw - 1240px)/2)) 18px;scrollbar-width:none;grid-auto-flow:unset}
.shw-track::-webkit-scrollbar{display:none}
.shw-b{flex:0 0 270px;scroll-snap-align:start;display:flex;flex-direction:column;text-decoration:none;color:#fff;transition:transform .2s}
.shw-b:hover{transform:translateY(-6px)}
.shw-back{position:relative;height:230px;border-radius:14px 14px 0 0;display:grid;place-items:center;overflow:hidden;box-shadow:inset 0 -30px 40px rgba(0,0,0,.25)}
.t-gold .shw-back{background:linear-gradient(160deg,#f2c14e,#d9962b)}.t-grey .shw-back{background:linear-gradient(160deg,#aeb4bd,#7f8793)}
.t-blue .shw-back{background:linear-gradient(160deg,#4bb4ea,#1f7fc4)}.t-steel .shw-back{background:linear-gradient(160deg,#6c7b95,#3e4b66)}.t-teal .shw-back{background:linear-gradient(160deg,#37c2b1,#1c8a86)}
.shw-item{position:relative;z-index:2;width:150px;height:150px;margin-top:-18px;background:#fff;border-radius:12px;padding:8px;box-shadow:0 18px 26px rgba(0,0,0,.35)}
.shw-item img{width:100%;height:100%;object-fit:contain;display:block}
.shw-slab{position:absolute;z-index:1;left:12%;right:12%;bottom:14px;height:46px;background:linear-gradient(180deg,#f4f5f7,#c9ced6);transform:perspective(300px) rotateX(58deg);border-radius:6px;box-shadow:0 14px 24px rgba(0,0,0,.4)}
.shw-info{display:flex;gap:10px;justify-content:space-between;align-items:stretch;padding:12px;background:rgba(10,24,56,.92);border:1px solid rgba(88,160,255,.45);border-top:2px solid var(--orange);border-radius:0 0 14px 14px;box-shadow:0 0 18px rgba(60,130,255,.18)}
.shw-txt{display:flex;flex-direction:column;gap:3px;min-width:0}.shw-txt b{font-size:15px;line-height:1.25}.shw-txt small{color:#9db0cf}.shw-txt em{font-style:normal;color:#ffb24d;font-size:12.5px;font-weight:700;margin-top:auto}
.shw-th{display:flex;gap:6px}.shw-th img{width:54px;height:62px;object-fit:contain;background:#fff;border-radius:8px;padding:3px}
.shw-b:hover .shw-info{border-color:var(--orange)}
@media(max-width:700px){.shw-b{flex-basis:230px}.shw-back{height:200px}.shw-th img{width:46px;height:54px}}
@media(prefers-reduced-motion:reduce){.shw-b{transition:none}}

/* ===== Category showroom wall + Delivered today ===== */
.cw{position:relative;background:radial-gradient(1000px 420px at 50% 0,#12306b 0,#0a1a3d 55%,#060d22 100%);padding:26px 0 30px;margin-top:-34px;z-index:3;border-radius:26px 26px 0 0;overflow:hidden}
.cw::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(76,195,255,.08) 1px,transparent 1px) 0 0/100% 38px,linear-gradient(90deg,rgba(76,195,255,.08) 1px,transparent 1px) 0 0/38px 100%;opacity:.7;pointer-events:none}
.cw-tag{position:relative;text-align:center;margin-bottom:6px}.cw-tag span{display:inline-block;padding:9px 34px;color:#e8f2ff;font-weight:800;letter-spacing:.04em;border:1px solid rgba(76,195,255,.55);background:rgba(9,30,72,.85);clip-path:polygon(6% 0,94% 0,100% 100%,0 100%);box-shadow:0 0 18px rgba(76,195,255,.35)}
.cw-track{position:relative;display:flex;gap:22px;overflow-x:auto;perspective:1100px;padding:24px max(24px,calc((100vw - 1240px)/2)) 34px;scroll-snap-type:x proximity;scrollbar-width:none}
.cw-track::-webkit-scrollbar{display:none}
.cw-item{flex:0 0 250px;scroll-snap-align:center;color:#fff;text-decoration:none;transform:rotateY(var(--ry,0deg));transform-style:preserve-3d;transition:transform .12s linear}
.cw-stage{position:relative;height:200px;display:grid;place-items:center}
.cw-stage img{position:relative;z-index:2;max-width:78%;max-height:170px;object-fit:contain;background:#fff;border-radius:12px;padding:8px;box-shadow:0 14px 30px rgba(0,0,0,.45)}
.cw-plat{position:absolute;left:4%;right:4%;bottom:2px;height:56px;border-radius:50%;background:radial-gradient(ellipse at 50% 40%,#e9eef7 0,#aeb8c9 55%,#6b7691 100%);box-shadow:0 18px 26px rgba(0,0,0,.5);transform:rotateX(62deg)}
.cw-panel{position:relative;margin-top:8px;padding:12px;border-radius:14px;border:1px solid rgba(76,195,255,.55);background:linear-gradient(160deg,rgba(14,48,110,.9),rgba(7,22,56,.92));box-shadow:0 0 18px rgba(76,195,255,.25);display:grid;grid-template-columns:1fr 54px 54px;gap:8px;align-items:center;min-height:86px}
.cw-pt{display:flex;flex-direction:column;gap:2px;min-width:0}.cw-pt b{font-size:15px;line-height:1.2}.cw-pt small{color:#9fc2ee}.cw-go{margin-top:6px;align-self:flex-start;font-size:12px;font-weight:800;color:#fff;background:var(--orange);padding:3px 10px;border-radius:99px}
.cw-panel img{width:54px;height:54px;object-fit:cover;border-radius:8px;background:#fff;border:1px solid rgba(255,255,255,.3)}
.cw-item:hover .cw-panel,.cw-item:focus-visible .cw-panel{border-color:#fff;box-shadow:0 0 26px rgba(76,195,255,.6)}
.cw-floor{position:relative;display:flex;gap:10px;justify-content:center;flex-wrap:wrap;padding:6px 16px 0}
.dv{padding:34px 0 8px}.dv-head{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.dv-head h2{margin:4px 0;font-size:clamp(1.5rem,3vw,2.2rem);color:#111827}.dv-head p{margin:0;color:#5b6475}
.dv-live{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:800;letter-spacing:.14em;color:#c2410c}.dv-live i{width:10px;height:10px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 0 rgba(34,197,94,.7);animation:dvp 1.6s infinite}
@keyframes dvp{70%{box-shadow:0 0 0 10px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
.dv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.dv-card{background:#fff;border:1px solid #e3e7ef;border-radius:16px;overflow:hidden;color:#111827;box-shadow:0 4px 14px rgba(10,20,40,.06)}
.dv-ph{position:relative;display:block;aspect-ratio:4/3;background:#eef0f4}.dv-ph img{width:100%;height:100%;object-fit:cover;display:block}
.dv-ok{position:absolute;inset-inline-start:10px;top:10px;background:#16a34a;color:#fff;font-size:12px;font-weight:800;padding:4px 10px;border-radius:99px}
.dv-b{padding:12px 14px 14px}.dv-b b{display:block;font-size:15px}.dv-loc{color:#5b6475;font-size:12.5px;margin:4px 0 6px}.dv-b ul{margin:0;padding-inline-start:18px;color:#374151;font-size:13px}
@media(prefers-reduced-motion:reduce){.dv-live i{animation:none}.cw-item{transition:none}}
@media(max-width:760px){.cw{margin-top:-20px}.cw-item{flex-basis:78vw;transform:none}.cw-track{perspective:none;padding:18px 16px 28px}}
.cw-stage{border-radius:12px 12px 0 0;margin-top:4px}
.cw-item.t0 .cw-stage{background:linear-gradient(180deg,#f0c04a,#c99a2c)}.cw-item.t1 .cw-stage{background:linear-gradient(180deg,#b9bdc8,#7d8497)}
.cw-item.t2 .cw-stage{background:linear-gradient(180deg,#4db0ee,#2a7fc4)}.cw-item.t3 .cw-stage{background:linear-gradient(180deg,#8892aa,#566079)}.cw-item.t4 .cw-stage{background:linear-gradient(180deg,#3fc0ae,#1f8f86)}
.cw-stage{overflow:hidden;height:190px}.cw-plat{bottom:-6px;opacity:.95}
.dv-th{display:flex;gap:6px;padding:8px 14px 0}.dv-th button{width:52px;height:40px;padding:0;border:2px solid transparent;border-radius:8px;overflow:hidden;cursor:pointer;background:#eef0f4;opacity:.75}
.dv-th button.on{border-color:var(--orange);opacity:1}.dv-th img{width:100%;height:100%;object-fit:cover;display:block}

/* ===== Home slideshow ===== */
.ss{padding:30px 0 6px}.ss-head{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.ss-head h2{margin:4px 0 0;font-size:clamp(1.5rem,3vw,2.2rem);color:#111827}
.ss-stage{position:relative;height:clamp(300px,46vw,520px);border-radius:20px;overflow:hidden;background:#0a0f1c;box-shadow:0 12px 34px rgba(10,20,40,.22);outline-offset:3px}
.ss-slide{position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;transform:scale(1.04);transition:opacity .7s ease,transform 1.2s ease,visibility 0s .7s}
.ss-slide.on{opacity:1;visibility:visible;transform:none;transition:opacity .7s ease,transform 5.5s ease,visibility 0s}
.ss-bg{position:absolute;inset:-30px;background:center/cover;filter:blur(28px) brightness(.55) saturate(1.2)}
.ss-slide>img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;display:block}
.ss-slide figcaption{position:absolute;z-index:2;inset-inline:0;bottom:0;padding:54px 22px 54px;color:#fff;background:linear-gradient(0deg,rgba(5,9,20,.88) 0%,rgba(5,9,20,.55) 55%,transparent 100%);display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.ss-slide figcaption b{font-size:clamp(18px,2.6vw,28px);line-height:1.15}.ss-slide figcaption>span{color:#d6def0;font-size:clamp(13px,1.5vw,16px);max-width:640px}
.ss-btns{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.ss-nav{position:absolute;z-index:3;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:#111;font-size:26px;line-height:1;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.35)}
.ss-prev{inset-inline-start:12px}.ss-next{inset-inline-end:12px}
[dir=rtl] .ss-nav{transform:translateY(-50%) scaleX(-1)}
.ss-nav:hover{background:var(--orange);color:#fff}
.ss-pp{position:absolute;z-index:3;top:12px;inset-inline-end:12px;width:34px;height:34px;border-radius:50%;border:0;background:rgba(5,9,20,.6);color:#fff;font-size:12px;cursor:pointer}
.ss-bar{position:absolute;z-index:3;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.18)}.ss-bar i{display:block;height:100%;width:0;background:var(--orange)}
.ss-dots{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:12px}
.ss-dots button{width:10px;height:10px;border-radius:99px;border:0;background:#c3c9d6;cursor:pointer;padding:0;transition:width .25s,background .25s}.ss-dots button.on{width:28px;background:var(--orange)}
@media(max-width:700px){.ss-stage{height:clamp(340px,92vw,460px);border-radius:16px}.ss-slide figcaption{padding:40px 14px 44px}.ss-nav{width:38px;height:38px;font-size:22px}}
@media(prefers-reduced-motion:reduce){.ss-slide,.ss-slide.on{transition:none;transform:none}.ss-bar i{transition:none!important}}
.ss-slide figcaption{padding-inline:62px}
@media(max-width:700px){.ss-slide figcaption{padding-inline:50px}.ss-nav{top:42%}}

/* ===== Hero v3: sliding product catalogue ===== */
.hx3 .hx-art{background:radial-gradient(900px 520px at 82% 40%,rgba(255,106,0,.28),transparent 60%),radial-gradient(700px 400px at 10% 0%,rgba(255,255,255,.06),transparent 60%),#07090f}
.hx3 .hx-art::after{display:none}
.hx3{min-height:0;padding-bottom:56px}
.hx3 .hx-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,560px);gap:36px;align-items:start;padding-top:40px}
.hx3 .hx-copy{max-width:none}
.hc{min-width:0}
.hc-card{background:#fff;border-radius:22px;padding:0 0 12px;box-shadow:0 0 0 3px var(--orange),0 24px 60px rgba(0,0,0,.55);overflow:hidden;color:#111}
.hc-top{display:flex;justify-content:space-between;align-items:center;background:#0b0f1a;color:#fff;padding:11px 18px;border-bottom:3px solid var(--orange)}
.hc-brand{font-weight:900;letter-spacing:.06em;font-size:14px}.hc-brand small{font-size:10.5px;letter-spacing:.16em;color:var(--orange);margin-inline-start:8px;font-weight:700}
.hc-count{font-weight:800;font-size:13px;color:#ffb24d;font-variant-numeric:tabular-nums}
.hc-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.hc-track::-webkit-scrollbar{display:none}
.hc-page{flex:0 0 100%;scroll-snap-align:start;padding:12px 14px 4px}
.hc-title{display:flex;justify-content:space-between;align-items:baseline;margin:0 2px 10px}
.hc-title b{font-size:19px;color:#0b0f1a;border-inline-start:5px solid var(--orange);padding-inline-start:9px}
.hc-title a{font-size:13px;font-weight:700;color:#c2500a;text-decoration:none}
.hc-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}
.hc-tile{display:flex;flex-direction:column;align-items:center;gap:6px;padding:7px 5px 8px;border:1.5px solid #d7dcef;border-radius:13px;background:#fafbff;text-decoration:none;color:#14182a;transition:transform .15s,border-color .15s,box-shadow .15s}
.hc-tile:hover{transform:translateY(-3px);border-color:var(--orange);box-shadow:0 8px 18px rgba(255,106,0,.22)}
.hc-img{display:block;width:100%;aspect-ratio:1;border-radius:9px;background:#fff;overflow:hidden}
.hc-img img{width:100%;height:100%;object-fit:contain;display:block}
.hc-nm{font-size:11.5px;font-weight:700;line-height:1.25;text-align:center;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.5em}
.hc-foot{display:flex;align-items:center;justify-content:center;gap:12px;padding-top:8px}
.hc-arrow{width:32px;height:32px;border-radius:50%;border:1.5px solid #cfd5ea;background:#fff;color:#111;font-size:20px;line-height:1;cursor:pointer}.hc-arrow:hover{border-color:var(--orange);color:var(--orange)}
.hc-dots{display:flex;gap:7px}.hc-dots button{width:9px;height:9px;border-radius:50%;border:0;background:#cfd5ea;padding:0;cursor:pointer;transition:.2s}.hc-dots button.on{width:26px;border-radius:6px;background:var(--orange)}
@media(max-width:1000px){.hx3 .hx-inner{grid-template-columns:minmax(0,1fr);gap:26px;padding-top:34px}.hc{max-width:620px}}
@media(max-width:560px){.hc-grid{grid-template-columns:repeat(3,1fr)}.hc-tile:nth-child(n+16){display:none}.hc-nm{font-size:11px}.hc-brand small{display:none}}

/* ===== Catalogue page ===== */
.cat-hero{background:radial-gradient(800px 420px at 85% 20%,rgba(255,106,0,.35),transparent 60%),#07090f;color:#fff;padding:42px 0 30px}
.cat-k{letter-spacing:.24em;font-size:12px;color:#ff8a2a;font-weight:800}.cat-hero h1{font-size:clamp(28px,4.4vw,48px);margin:8px 0 10px}.cat-hero p{color:#cdd5ea;margin:0 0 18px}
.cat-acts{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px}
.cat-jump{display:flex;gap:8px;flex-wrap:wrap}.cat-jump a{border:1px solid rgba(255,255,255,.25);color:#fff;border-radius:999px;padding:6px 13px;font-size:13px;text-decoration:none;background:rgba(255,255,255,.06)}.cat-jump a:hover{border-color:var(--orange);color:#ffb24d}.cat-jump small{color:#ff8a2a;font-weight:800;margin-inline-start:3px}
.cat-wrap{padding-top:28px;padding-bottom:40px}.cat-sec{background:#fff;border:2px solid #e3e7f4;border-radius:18px;margin-bottom:24px;overflow:hidden;scroll-margin-top:90px}
.cat-bar{display:flex;align-items:center;gap:14px;background:#0b0f1a;color:#fff;padding:12px 18px;border-bottom:3px solid var(--orange)}.cat-bar b{font-size:18px}.cat-bar span{color:#ffb24d;font-size:13px;font-weight:700;margin-inline-start:auto}.cat-bar a{color:#fff;font-weight:700;text-decoration:none;font-size:13px;background:var(--orange);padding:6px 12px;border-radius:999px}
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;padding:14px}
.cat-t{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 7px 9px;border:1.5px solid #d7dcef;border-radius:13px;background:#fafbff;text-decoration:none;color:#14182a;transition:transform .15s,border-color .15s}.cat-t:hover{transform:translateY(-3px);border-color:var(--orange)}
.cat-i{display:block;width:100%;aspect-ratio:1;border-radius:9px;background:#fff;overflow:hidden}.cat-i img{width:100%;height:100%;object-fit:contain;display:block}
.cat-n{font-size:12.5px;font-weight:700;text-align:center;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em}.cat-p{font-size:11.5px;font-weight:800;color:#c2500a}
@media(max-width:560px){.cat-grid{grid-template-columns:repeat(3,1fr);gap:7px;padding:10px}.cat-n{font-size:11px}}

.hc-cta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center;padding:10px 12px 2px;font-size:12.5px;font-weight:800;color:#c2500a}
.hc-cta a{text-decoration:none;font-weight:800;border-radius:999px;padding:8px 14px;font-size:13px}.hc-full{background:#0b0f1a;color:#fff}.hc-pdf{background:var(--orange);color:#fff}
.hc-tile{padding:5px 4px 6px}.hc-nm{font-size:11px}

/* ---- install-app bar ---- */
#pwa-bar{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:9999;max-width:460px;margin:0 auto;display:flex;align-items:center;gap:12px;background:#101012;color:#fff;border:1px solid #ff6a00;border-radius:16px;padding:10px 12px;box-shadow:0 12px 36px rgba(0,0,0,.35);transform:translateY(140%);transition:transform .35s ease}
#pwa-bar.in{transform:none}
#pwa-bar img{border-radius:10px;flex:none}
#pwa-bar .pb-t{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.3}
#pwa-bar .pb-t b{font-size:14px}#pwa-bar .pb-t small{font-size:12px;color:#cfd3dc}
#pwa-bar .pb-go{background:#ff6a00;color:#fff;border:0;border-radius:999px;padding:10px 18px;font-weight:800;cursor:pointer;flex:none}
#pwa-bar .pb-x{background:none;border:0;color:#9aa0ad;font-size:24px;line-height:1;cursor:pointer;padding:0 4px;flex:none}
@media(min-width:900px){#pwa-bar{left:auto;right:20px;margin:0}}

/* never let anything push the page wider than the phone screen (RTL included) */
html,body{overflow-x:clip;max-width:100%}

/* blog cover when a post has no real photo */
.blog-cover{aspect-ratio:16/9;display:flex;align-items:flex-end;padding:18px;border-radius:10px;color:#fff;font-weight:800;font-size:18px;line-height:1.25;background:linear-gradient(135deg,#101012 0%,#1d1d22 60%,#2a1a0c 100%);border-bottom:4px solid #ff6a00;overflow:hidden}
.blog-cover-lg{font-size:clamp(20px,4vw,30px);padding:28px}
.blog-card .blog-cover{border-radius:0}
.form-card > h1{font-size:1.5em;margin:.83em 0}
h1.section-title{margin:0 0 16px}

/* mobile: the AI helper is a small round button (no text bubble over product names); chat window readable */
@media(max-width:760px){
  .aichat-btn{inset-inline-start:auto;inset-inline-end:14px;bottom:132px;width:50px;height:50px;padding:0;justify-content:center;animation:none}
  .aichat-btn .ai-tx{display:none!important}
  .aichat-btn .ai-ic{font-size:22px}
  .wa-float{inset-inline-end:14px;bottom:76px;width:50px;height:50px;padding:0;justify-content:center}
}

/* AI chat: bubble text must always be dark on white, whatever colour the page or the phone's dark mode inherits */
.aichat .ai-m.bot,.aichat .ai-m.bot *:not(a):not(button):not(.ai-pill){color:#14141a !important}
.aichat .ai-m.bot a{color:#c2510a !important;text-decoration:underline}
.aichat .ai-m.me,.aichat .ai-m.me *{color:#1a0e06 !important}
.aichat .ai-m.typing{color:#555 !important}
.aichat .ai-msgs{color:#14141a}
.aichat-btn .ai-ic{display:inline-block !important;line-height:1}

.nav-dd-menu .nav-dd-rent{color:#ff6a00 !important;font-weight:800;border-bottom:1px solid rgba(255,255,255,.12);margin-bottom:4px}
.chip.chip-rent{border-color:#ff6a00;color:#c2510a;font-weight:800}

/* ---- mobile app-style menu drawer ---- */
.mnav-btn,.tk-bn-btn{display:none}
.mnav,.mnav-ov{display:none}
@media (max-width:768px){
  .site-nav{display:none}
  .mnav-btn{display:inline-flex;flex-direction:column;justify-content:center;gap:4px;width:42px;height:42px;padding:0 10px;border:0;border-radius:10px;background:#1b1b20;cursor:pointer;flex:0 0 auto}
  .mnav-btn span{display:block;height:2px;background:#fff;border-radius:2px}
  .tk-bn-btn{display:block;flex:1;text-align:center;font:inherit;font-size:11px;font-weight:700;color:var(--muted);background:none;border:0;padding:7px 2px 8px;cursor:pointer}
  .mnav-ov{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:1190}.mnav-ov:not([hidden]){display:block}
  .mnav{display:flex;flex-direction:column;position:fixed;top:0;bottom:0;inset-inline-start:0;width:min(84vw,340px);background:#fff;z-index:1200;transform:translateX(-105%);transition:transform .25s;box-shadow:6px 0 30px rgba(0,0,0,.35)}
  [dir=rtl] .mnav{transform:translateX(105%)}
  .mnav.open,[dir=rtl] .mnav.open{transform:none}
  .mnav-h{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:#0b0b0d;color:#fff;font-size:20px}.mnav-h i{font-style:normal;color:var(--orange)}
  .mnav-x{background:none;border:0;color:#fff;font-size:22px;cursor:pointer;padding:4px 8px}
  .mnav-b{overflow-y:auto;padding:6px 0 28px;flex:1;overscroll-behavior:contain}
  .mnav-b a{display:block;padding:13px 18px;font-weight:700;color:#14141a;border-bottom:1px solid #eef0f4;font-size:15px}
  .mnav-b a.mnav-rent{color:#c2510a}
  .mnav-b h3{margin:0;padding:14px 18px 6px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#6b7280;background:#f6f7fa}
  .mnav-lang{margin:16px 18px 0;padding:11px 20px;border-radius:999px;border:1.5px solid var(--orange);background:#fff;font-weight:800;cursor:pointer}
  html.mnav-lock{overflow:hidden}
}

/* ---- AI Engineers ---- */
.eg-promo{background:linear-gradient(120deg,#101012 0%,#1d1308 100%);color:#fff;padding:26px 0;border-block:3px solid #ff6a00}
.eg-promo-in{display:flex;gap:24px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.eg-promo-t{flex:1 1 380px;min-width:0}.eg-promo h2{margin:6px 0 6px;font-size:1.5rem;line-height:1.3;color:#fff}.eg-promo p{margin:0 0 14px;color:#d9d9de;max-width:560px;line-height:1.6}
.eg-new{background:#ff6a00;color:#1a0e06;font-weight:800;font-size:.72rem;letter-spacing:.06em;padding:3px 10px;border-radius:99px}
.eg-promo-b{display:flex;gap:10px;flex-wrap:wrap}.eg-promo .btn-ghost{background:transparent;border:2px solid #fff;color:#fff}
.eg-promo-n{display:block;margin-top:12px;color:#ffb27a}
.eg-promo-c{flex:1 1 280px;display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.eg-promo-c a{background:#ffffff14;border:1px solid #ffffff30;color:#fff;border-radius:99px;padding:8px 14px;font-weight:700;font-size:.9rem;text-decoration:none}.eg-promo-c a:hover{background:#ff6a00;color:#1a0e06}
.eg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.eg-card{border:1px solid #e7e7ea;border-radius:14px;background:#fff;padding:14px;display:flex;flex-direction:column;gap:8px}
.eg-top{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;text-decoration:none;color:#101012}
.eg-ph{width:84px;height:84px;border-radius:50%;object-fit:cover;background:#ff6a00;display:block}.eg-ini{display:flex;align-items:center;justify-content:center;color:#1a0e06;font-weight:800;font-size:1.6rem}.eg-big{width:120px;height:120px;font-size:2.2rem;flex:none}
.eg-nm{font-weight:800}.eg-dc{color:#c2530a;font-weight:700;font-size:.9rem}.eg-ver{background:#12703f;color:#fff;border-radius:50%;display:inline-block;width:18px;height:18px;line-height:18px;font-size:.7rem;text-align:center}.eg-ver-t{color:#12703f;font-weight:700}
.eg-meta{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;font-size:.82rem;color:#555}
.eg-av{text-align:center;font-weight:700;font-size:.85rem;color:#888;padding:5px;border-radius:99px;background:#f3f3f5}.eg-av.on{color:#12703f;background:#e6f4ea}
.eg-now{display:flex;align-items:center;gap:6px;font-weight:700}
.eg-prof{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-bottom:12px}.eg-prof h1{margin:0 0 4px}.eg-cta{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px}
.eg-switch{border:1px solid #e7e7ea;border-radius:14px;padding:14px;margin:12px 0;display:flex;flex-direction:column;gap:8px;align-items:flex-start}.eg-switch.on{background:#e6f4ea;border-color:#b9e0c6}
@media (max-width:700px){.eg-promo h2{font-size:1.2rem}.eg-promo-c{justify-content:flex-start}.eg-promo-c a{padding:7px 11px;font-size:.82rem}.eg-grid{grid-template-columns:repeat(2,1fr)}}
/* engineers chat */
.tool-nav a i{font-style:normal}
.ec-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;flex-wrap:wrap;margin-bottom:8px}.ec-rep summary{cursor:pointer;color:#888;font-size:.85rem}.ec-rep form{display:flex;gap:6px;margin-top:6px}.ec-rep input{padding:6px 8px;border:1px solid #d6d6dc;border-radius:8px}
.ec-box{border:1px solid #e7e7ea;border-radius:14px;background:#f7f7f9;padding:12px;height:min(55vh,460px);overflow-y:auto;display:flex;flex-direction:column;gap:8px}
.ec-m{max-width:78%;padding:8px 12px;border-radius:14px;background:#fff;border:1px solid #e7e7ea;align-self:flex-start}.ec-m.mine{align-self:flex-end;background:#fff1e6;border-color:#ffd2b0}
.ec-m p{margin:0 0 3px;white-space:pre-line;word-break:break-word}.ec-m small{color:#888;font-size:.72rem;display:block}.ec-m img{max-width:100%;max-height:260px;border-radius:10px;display:block;margin-bottom:4px}.ec-pdf{font-weight:700}
.ec-form{display:flex;gap:8px;align-items:flex-end;margin-top:10px}.ec-form textarea{flex:1;padding:10px;border:1px solid #d6d6dc;border-radius:12px;font-family:inherit;resize:vertical}
.ec-att{cursor:pointer;font-size:1.4rem;padding:8px 10px;border:1px solid #d6d6dc;border-radius:12px;background:#fff}.ec-att.on{background:#ff6a00}
.ec-list{display:flex;flex-direction:column;gap:8px}.ec-row{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:12px 14px;border:1px solid #e7e7ea;border-radius:12px;background:#fff;text-decoration:none;color:#101012}.ec-row span{color:#666;font-size:.9rem;grid-column:1}.ec-row small{grid-row:1/3;grid-column:2;color:#888;text-align:end}.ec-row.new{border-color:#ff6a00;background:#fff8f2}.ec-row i,.tool-nav a i{background:#ff6a00;color:#1a0e06;border-radius:99px;padding:0 7px;font-style:normal;font-size:.75rem;font-weight:800}
.btn-ghost-d{background:#fff;border:2px solid #101012;color:#101012}
/* engineers phase 3 */
.rq-list{display:flex;flex-direction:column;gap:12px}.rq-card{border:1px solid #e7e7ea;border-radius:14px;background:#fff;padding:14px;display:flex;flex-direction:column;gap:8px}.rq-card p{margin:0;color:#333;line-height:1.55}
.rq-top{display:flex;flex-direction:column;gap:2px}.rq-top small{color:#777}.rq-card textarea{width:100%;padding:8px;border:1px solid #d6d6dc;border-radius:10px;font-family:inherit;margin-bottom:6px}
.rq-resp{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.rq-resp a{background:#fff1e6;border:1px solid #ffd2b0;border-radius:99px;padding:5px 12px;color:#101012;text-decoration:none;font-weight:700;font-size:.88rem}
.eg-stars{color:#f5a300;letter-spacing:1px}.eg-stars i{color:#d9d9de;font-style:normal}.eg-rt{text-align:center;font-size:.85rem;margin:0}
.ec-pick{margin-top:10px;border:1px solid #e7e7ea;border-radius:12px;padding:8px 12px;background:#fff}.ec-pick summary{cursor:pointer;font-weight:700}.ec-pick input[type=search],.ec-rate input,.ec-rate select{padding:8px 10px;border:1px solid #d6d6dc;border-radius:10px;font-family:inherit;margin-top:8px}.ec-pick input[type=search]{width:100%}
.ec-rate{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.ec-rate input{flex:1;min-width:160px}
.ec-pr{display:flex;gap:10px;align-items:center;width:100%;text-align:start;background:#fafafa;border:1px solid #eee;border-radius:10px;padding:6px;margin-top:6px;cursor:pointer;font-family:inherit}.ec-pr img{width:44px;height:44px;object-fit:cover;border-radius:8px}
.ec-prod{display:flex;gap:10px;align-items:center;background:#fff;border:1px solid #e7e7ea;border-radius:12px;padding:8px;margin-bottom:4px}.ec-prod img{width:64px;height:64px;object-fit:cover;border-radius:8px;display:block}.ec-pn{font-weight:700;color:#101012;text-decoration:none;display:block}.ec-prod.gone{color:#888}.ec-out{color:#a02020}

.h-msg{font-style:normal;background:#ff6a00;color:#1a0e06;border-radius:99px;padding:0 7px;font-size:.72rem;font-weight:800}
/* engineer chat in the assistant's look */
.ecw{display:flex;flex-direction:column;background:#fff;border-radius:16px;border:1px solid var(--line);box-shadow:0 10px 36px rgba(0,0,0,.14);overflow:hidden;max-width:560px;margin:0 auto 18px;height:min(660px,calc(100vh - 150px))}
.ecw.embed{max-width:none;margin:0;height:100vh;border:0;border-radius:0;box-shadow:none}.ecw-embed{margin:0;background:#fff}
.ecw-h{background:#101012;color:#fff;padding:11px 12px;display:flex;align-items:center;gap:10px;border-bottom:3px solid var(--orange)}.ecw-h>div{flex:1;min-width:0}.ecw-h b{display:block;font-size:15px}.ecw-h small{color:#bbb;font-size:12px}
.ecw-h img,.ecw-ini{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid var(--orange);flex:none}.ecw-ini{background:var(--orange);color:#1a0e06;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:.9rem}
.ecw-on{color:#6fe3a0}.ecw-pf{color:#fff;font-size:12px;text-decoration:underline}.ecw-x{background:rgba(255,255,255,.1);border:0;color:#fff;border-radius:8px;width:32px;height:32px;cursor:pointer;font-size:15px}
.ecw-msgs{flex:1;min-height:0}.ecw .ai-m{max-width:86%}.ecw .ai-m p{margin:0;white-space:pre-line;word-break:break-word}.ecw .ai-m img{max-width:100%;max-height:240px;border-radius:10px;display:block;margin-bottom:4px}
.ec-t{display:block;font-size:.7rem;opacity:.65;margin-top:2px}.ec-tick{color:#0a58ca;font-weight:800;opacity:1}.ai-m.me .ec-tick{color:#1a0e06}
.ecw-chips{flex-wrap:nowrap;overflow-x:auto;max-height:none;padding-bottom:6px}.ecw-chips button{white-space:nowrap;flex:0 0 auto}.ecw-chips button.on{background:var(--orange)}.ecw-q{border-style:dashed!important;font-weight:600!important}
.ecw-pan{padding:8px 10px;background:#fafafa;border-top:1px solid var(--line);max-height:180px;overflow-y:auto}.ecw-pan[hidden]{display:none}.ecw-pan input[type=search],.ecw-pan .ec-rate input,.ecw-pan .ec-rate select{padding:8px 10px;border:1px solid #cfcfd6;border-radius:10px;font-family:inherit}.ecw-pan input[type=search]{width:100%}
.ecw-form{align-items:flex-end;border-top:1px solid var(--line)}.ecw-form textarea{flex:1;border:1px solid #cfcfd6;border-radius:18px;padding:10px 14px;font-size:14px;font-family:inherit;resize:none;max-height:90px;min-width:0}
.ecw-note{margin:0;padding:4px 12px 8px;font-size:.7rem;color:#888;text-align:center;background:#fff}
.ecw-pop{position:fixed;inset-inline-end:18px;bottom:78px;z-index:995;width:390px;max-width:calc(100vw - 24px);height:min(620px,calc(100vh - 110px));border-radius:16px;overflow:hidden;box-shadow:0 18px 60px rgba(0,0,0,.4);border:1px solid var(--line);background:#fff}.ecw-pop[hidden]{display:none}.ecw-pop iframe{width:100%;height:100%;border:0;display:block}
@media(max-width:760px){.ecw-pop{inset-inline:8px;width:auto;bottom:70px;height:calc(100vh - 90px)}.ecw{height:calc(100vh - 210px)}}
.ecw .ai-m.me{border-color:var(--orange)}.ecw .ai-m.me .ec-t{opacity:.8}
.ecw .ai-m.me .ec-t{color:#1a0e06;opacity:.75}.ecw .ai-m.bot .ec-t{color:#777}
.ecw-gate{padding:22px 18px;display:flex;flex-direction:column;gap:10px;background:#f7f7f8;flex:1}.ecw-gate p{margin:0 0 6px;line-height:1.6}
.ecw-bk{color:#fff;font-size:26px;line-height:1;text-decoration:none;padding:0 6px 3px;flex:none}.ecw-list{flex:1;overflow-y:auto;background:#f7f7f8;padding:10px;display:flex;flex-direction:column;gap:8px}.ecw-list .bm-empty{background:#fff}
/* messenger (WhatsApp-Web style) */
.ms-wrap{max-width:1200px}.ms{display:grid;grid-template-columns:380px 1fr;height:calc(100vh - 190px);min-height:520px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 6px 26px rgba(0,0,0,.08)}
.ms-l{display:flex;flex-direction:column;border-inline-end:1px solid var(--line);min-height:0;background:#fff}.ms-top{display:flex;justify-content:space-between;align-items:center;padding:12px 14px 4px}.ms-top h2{margin:0;font-size:1.35rem;color:#ff6a00}
.ms-hide{font-size:.75rem;color:#666;display:flex;align-items:center;gap:4px;cursor:pointer}.ms-search{padding:6px 12px}.ms-search input{width:100%;padding:10px 14px;border:0;border-radius:999px;background:#f0f2f5;font-family:inherit;font-size:.9rem}
.ms-pills{display:flex;gap:6px;padding:4px 12px 8px;flex-wrap:wrap}.ms-pills button{border:1px solid #d6d6dc;background:#fff;border-radius:999px;padding:5px 12px;font-weight:700;font-size:.82rem;cursor:pointer;font-family:inherit}.ms-pills button.on{background:#ffe8d6;border-color:#ff6a00;color:#a34100}.ms-pills i{font-style:normal;color:#ff6a00;margin-inline-start:2px}
.ms-scroll{flex:1;overflow-y:auto;min-height:0}.ms-sec{padding:10px 14px 4px;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#888}.ms-none{padding:18px 14px;color:#777;font-size:.9rem}.ms-scroll>.btn{margin:0 14px 14px}
.ms-row{display:flex;gap:12px;align-items:center;width:100%;text-align:start;padding:10px 14px;border:0;border-bottom:1px solid #f1f1f3;background:#fff;cursor:pointer;font-family:inherit}.ms-row:hover{background:#f7f7f8}.ms-row.act{background:#fff1e6}
.ms-av{position:relative;flex:none;width:48px;height:48px;border-radius:50%;background:#ff6a00;color:#1a0e06;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:.95rem}.ms-av img{width:100%;height:100%;border-radius:50%;object-fit:cover}.ms-dot{position:absolute;inset-inline-end:0;bottom:1px;width:13px;height:13px;border-radius:50%;background:#25d366;border:2px solid #fff}
.ms-b{flex:1;min-width:0}.ms-t1{display:flex;justify-content:space-between;gap:6px}.ms-t1 b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ms-t1 small{color:#888;font-size:.72rem;flex:none}
.ms-t2{display:flex;justify-content:space-between;gap:6px;color:#666;font-size:.85rem;align-items:center}.ms-t2 span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ms-t2 i{background:#25d366;color:#fff;border-radius:999px;padding:0 7px;font-style:normal;font-size:.72rem;font-weight:800;flex:none}.ms-t2 em{font-style:normal;color:#12703f;font-size:.72rem;font-weight:700;flex:none}.ms-t2 em.av{color:#a34100}.ms-t3{font-size:.72rem;color:#999}.ms-row.new .ms-t1 b{color:#000}
.ms-r{position:relative;background:#f5f4f2;min-width:0;display:flex}.ms-empty{margin:auto;text-align:center;max-width:420px;padding:24px;background:#fff;border-radius:22px;box-shadow:0 2px 10px rgba(0,0,0,.05)}.ms-ill{font-size:4rem}.ms-empty h3{margin:6px 0}.ms-empty p{color:#666;line-height:1.6}.ms-btns{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:12px}
.ms-frame{flex:1;display:flex;flex-direction:column;min-width:0}.ms-frame[hidden]{display:none}.ms-frame iframe{flex:1;width:100%;border:0;background:#fff}.ms-back{display:none;background:#101012;color:#fff;border:0;padding:10px 14px;text-align:start;font-weight:800;cursor:pointer;font-family:inherit}
@media(max-width:800px){.ms{grid-template-columns:1fr;height:calc(100vh - 170px)}.ms-r{display:none}.ms.open .ms-l{display:none}.ms.open .ms-r{display:flex}.ms-back{display:block}}
.ms-page .aichat-btn,.ms-page .wa-float{display:none!important}

/* close chat + message alerts */
.ecw-close{margin:0}.ecw-close button{background:rgba(255,255,255,.12);border:0;color:#fff;border-radius:8px;padding:6px 9px;font-size:12px;font-weight:700;cursor:pointer;font-family:inherit}.ecw-close button:hover{background:rgba(255,255,255,.22)}
.ms-ctl{display:flex;gap:4px}.ms-ic{background:#f0f2f5;border:0;border-radius:50%;width:32px;height:32px;cursor:pointer;font-size:15px}.ms-hide{padding:0 14px 4px;display:flex}.ms-arch{width:100%;text-align:start;border:0;background:none;cursor:pointer;font-family:inherit}
.ecn-box{position:fixed;top:12px;inset-inline-end:12px;z-index:9999;display:flex;flex-direction:column;gap:8px;width:min(340px,calc(100vw - 24px));pointer-events:none}
.ecn{pointer-events:auto;display:flex;gap:10px;align-items:center;background:#101012;color:#fff;border-radius:14px;padding:10px 12px;border-inline-start:5px solid #ff6a00;box-shadow:0 12px 34px rgba(0,0,0,.4);text-decoration:none;transform:translateX(120%);opacity:0;transition:transform .35s cubic-bezier(.2,1.3,.4,1),opacity .25s}[dir=rtl] .ecn{transform:translateX(-120%)}.ecn.in{transform:none;opacity:1}
.ecn-av{flex:none;width:42px;height:42px;border-radius:50%;background:#ff6a00;color:#1a0e06;font-weight:800;display:flex;align-items:center;justify-content:center;overflow:hidden;animation:ecnpulse 1.2s ease 2}.ecn-av img{width:100%;height:100%;object-fit:cover}
.ecn-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.ecn-b b{font-size:.92rem}.ecn-b span{color:#cfcfd6;font-size:.84rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ecn-x{background:none;border:0;color:#999;cursor:pointer;font-size:14px;flex:none}
@keyframes ecnpulse{0%,100%{box-shadow:0 0 0 0 rgba(255,106,0,.7)}50%{box-shadow:0 0 0 9px rgba(255,106,0,0)}}
@media (prefers-reduced-motion:reduce){.ecn{transition:none}.ecn-av{animation:none}}

.eg-cta-h{margin:0 0 0 auto;margin-inline-start:auto;flex-direction:column;align-items:flex-start;max-width:260px}@media(max-width:700px){.eg-cta-h{margin-inline-start:0;max-width:none;width:100%}}

.eg-chatrow{margin:10px 0 0}.eg-cta-h{display:none}

.eg-chatrow{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.eg-chatrow .btn{width:auto;display:inline-flex;margin:0}.eg-chatrow{flex-direction:row}

.eg-chatbtn{display:flex;justify-content:center;margin-top:10px;width:100%}

.wa-float.wa-chat{background:#ff6a00;color:#1a0e06;box-shadow:0 8px 24px rgba(255,106,0,.45)}.wa-chat .wa-n{background:#101012;color:#fff;border-radius:99px;font-style:normal;font-size:.75rem;font-weight:800;padding:1px 7px;margin-inline-start:6px}.wa-chat .wa-n[hidden]{display:none}


.ecw-guest{background:#fff4ea;border-bottom:1px solid #ffd9b8;color:#5a3000;font-size:.82rem;padding:7px 12px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}.ecw-guest a{font-weight:800;color:#c2530a}
.gc-wrap{max-width:520px;margin:30px auto;padding:0 16px}.gc-card{background:#fff;border-radius:16px;box-shadow:0 8px 28px rgba(0,0,0,.1);padding:22px}.gc-card h1{margin:0 0 6px;font-size:1.4rem}.gc-card label{display:block;margin:12px 0 4px;font-weight:700}.gc-card input,.gc-card textarea{width:100%;padding:11px;border:1px solid #d6d6dc;border-radius:10px;font:inherit;box-sizing:border-box}.gc-hp{position:absolute;left:-9999px}.gc-to{background:#f6f7f9;border-radius:12px;padding:10px 12px;display:flex;gap:10px;align-items:center;margin:10px 0}

.h-signin{background:#ff6a00;color:#1a0e06!important;font-weight:800;border-radius:999px;padding:9px 16px;white-space:nowrap;text-decoration:none;font-size:.9rem}.h-signin:hover{filter:brightness(1.08)}
.h-logout{color:#cfcfd6!important;font-size:.78rem;text-decoration:underline;white-space:nowrap}.h-logout:hover{color:#fff!important}
.mnav-signin{background:#ff6a00!important;color:#1a0e06!important;font-weight:800}
.btn-google{display:flex;align-items:center;justify-content:center;gap:10px;background:#fff;color:#1f1f1f;border:1px solid #dadce0;border-radius:10px;padding:11px;font-weight:700;text-decoration:none;margin:6px 0}.btn-google:hover{background:#f8f9fa}
.g-or{display:flex;align-items:center;gap:10px;color:#777;font-size:.82rem;margin:12px 0}.g-or:before,.g-or:after{content:"";flex:1;height:1px;background:#e1e1e6}
.login-perks{list-style:none;margin:8px 0 12px;padding:10px 12px;background:#fff4ea;border-radius:10px;font-size:.86rem;line-height:1.7}

.h-logout{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.1);text-decoration:none!important;font-size:16px;flex:none}.h-logout:hover{background:rgba(255,255,255,.22)}
@media(max-width:1340px){.deliver-to{display:none}}

/* account menu (avatar dropdown / phone sheet) */
.acct{position:relative;display:flex;align-items:center}.acct-btn{background:none;border:0;padding:0;cursor:pointer;position:relative;display:flex;border-radius:50%}
.cav{border-radius:50%;object-fit:cover;display:block;background:#ff6a00}.cav-i{display:flex;align-items:center;justify-content:center;color:#1a0e06;font-weight:800;line-height:1}
.acct-chev{position:absolute;inset-inline-end:-3px;bottom:-2px;background:#e4e6eb;color:#1c1e21;border-radius:50%;width:15px;height:15px;font-size:9px;display:flex;align-items:center;justify-content:center;border:1.5px solid #101012}
.acct-menu{position:absolute;top:calc(100% + 10px);inset-inline-end:0;width:340px;max-width:92vw;background:#fff;color:#1c1e21;border-radius:12px;box-shadow:0 12px 40px rgba(0,0,0,.35);padding:10px;z-index:9000;text-align:start}.acct-menu[hidden]{display:none}
.am-card{background:#fff;border-radius:10px;box-shadow:0 1px 6px rgba(0,0,0,.18);padding:8px;margin-bottom:8px}.am-me{display:flex;gap:12px;align-items:center;padding:8px;border-radius:8px;text-decoration:none;color:inherit;border-bottom:1px solid #e4e6eb}.am-me:hover{background:#f2f3f5}.am-me b{display:block;font-size:1rem}.am-me small{color:#65676b;word-break:break-all}
.am-all{display:flex;gap:8px;align-items:center;justify-content:center;background:#e4e6eb;border-radius:8px;padding:9px;margin-top:8px;font-weight:700;text-decoration:none;color:#1c1e21}.am-all:hover{background:#d8dadf}
.am-i{display:flex;gap:12px;align-items:center;width:100%;padding:8px;border:0;background:none;border-radius:8px;text-decoration:none;color:#1c1e21;font:inherit;font-weight:600;cursor:pointer;text-align:start}.am-i:hover{background:#f2f3f5}
.am-ic{flex:none;width:36px;height:36px;border-radius:50%;background:#e4e6eb;display:flex;align-items:center;justify-content:center;font-size:17px}.am-t{flex:1}.am-i .h-msg{background:#e41e3f;color:#fff;border-radius:99px;padding:1px 7px;font-size:.75rem;font-style:normal}.am-out .am-ic{background:#ffe8e8}
@media(max-width:900px){.acct-open:after{content:"";position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:8999}}
@media(max-width:900px){.acct-menu{position:fixed;inset-inline:0;bottom:0;top:auto;width:auto;max-width:none;border-radius:18px 18px 0 0;max-height:82vh;overflow:auto;padding-bottom:calc(14px + env(safe-area-inset-bottom));z-index:9001}.acct{display:none}body.acct-open .acct{display:flex}body.acct-open .acct-btn{display:none}}
.pf-wrap{max-width:760px;margin:24px auto;padding:0 16px}.pf-card{background:#fff;border-radius:14px;box-shadow:0 4px 18px rgba(0,0,0,.08);padding:20px;margin-bottom:16px}.pf-head{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.pf-card label{display:block;margin:12px 0 4px;font-weight:700}.pf-card input[type=text],.pf-card input[type=password],.pf-card input[type=email],.pf-card input[type=tel]{width:100%;padding:10px;border:1px solid #d6d6dc;border-radius:10px;box-sizing:border-box}.pf-tag{display:inline-block;background:#e8f5ec;color:#136c34;border-radius:99px;padding:2px 10px;font-size:.8rem;font-weight:700}
@media(max-width:900px){body.acct-open .site-header{position:relative;z-index:9002}body.acct-open .header-actions{position:static}}

/* ===== Community feed ===== */
.cm-wrap{color:#111;max-width:1180px;margin:18px auto 40px;padding:0 14px;display:grid;grid-template-columns:240px minmax(0,1fr) 290px;gap:18px;align-items:start}
.cm-left,.cm-right{position:sticky;top:78px;display:flex;flex-direction:column;gap:4px}
.cm-lnk{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;color:#111;text-decoration:none;font-weight:600;font-size:.95rem}
.cm-lnk i{font-style:normal;width:34px;height:34px;border-radius:50%;background:#eef0f3;display:grid;place-items:center}
.cm-lnk:hover,.cm-lnk.on{background:rgba(255,106,0,.14)}.cm-lnk.on i{background:#ff6a00;color:#fff}
.cm-box *{color:inherit}.cm-box,.cm-compose,.cm-post,.cm-empty{background:#fff;border:1px solid #e4e6eb;border-radius:14px;padding:14px;color:#111}
.cm-box h3{margin:0 0 8px;font-size:1rem}.cm-box .btn{margin-top:8px}
.cm-eng{display:flex;align-items:center;gap:10px;padding:7px 4px;border-radius:10px;text-decoration:none;color:inherit}.cm-eng:hover{background:#f2f3f5}
.cm-eng b{display:block;font-size:.92rem}.cm-eng small{opacity:.65;font-size:.78rem}.cm-eng em{margin-inline-start:auto;font-style:normal}
.cm-ev{position:relative;display:inline-block}.cm-ev i{position:absolute;bottom:0;inset-inline-end:0;width:11px;height:11px;border-radius:50%;background:#31c45a;border:2px solid #fff}
.cm-all{display:block;margin-top:6px;font-weight:700;color:#ff8a33;text-decoration:none;font-size:.9rem}
.cm-main{display:flex;flex-direction:column;gap:14px;min-width:0}
.cm-cr{display:flex;align-items:center;gap:10px}.cm-open{flex:1;text-align:start;background:#eef0f3;border:0;border-radius:24px;padding:11px 16px;color:inherit;opacity:.85;font:inherit;cursor:pointer}
.cm-ico{font-size:1.5rem;cursor:pointer}.cm-cx textarea{width:100%;margin-top:10px;background:transparent;color:inherit;border:1px solid #d0d3d9;border-radius:10px;padding:10px;font:inherit;resize:vertical}
.cm-cbar{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}.cm-cbar select{background:#fff;color:#111;border:1px solid #d0d3d9;border-radius:8px;padding:8px;margin-inline-end:auto}
.cm-cancel{background:none;border:0;color:inherit;opacity:.7;cursor:pointer}.cm-prev{display:flex;gap:6px;margin-top:8px}.cm-prev img{width:72px;height:72px;object-fit:cover;border-radius:8px}
.cm-note{font-size:.78rem;margin:8px 0 0}.cm-err{color:#ff8b8b;margin:8px 0 0}.cm-login{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}.cm-login p{margin:0;flex:1 1 220px}
.cm-stories{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.cm-st{position:relative;flex:0 0 112px;height:190px;border-radius:14px;border:0;background:#222 center/cover;color:#fff;cursor:pointer;display:flex;align-items:flex-end;padding:8px;text-align:start;overflow:hidden;font:inherit}
.cm-st:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(0,0,0,.75))}.cm-st b{position:relative;z-index:1;font-size:.82rem;text-shadow:0 1px 3px #000}
.cm-st-ring{position:absolute;top:8px;inset-inline-start:8px;z-index:1;border:3px solid #ff6a00;border-radius:50%;line-height:0}
.cm-st-new{flex-direction:column;justify-content:flex-end;align-items:center;background:#f2f3f5;text-align:center;padding-bottom:10px}.cm-st-new:after{display:none}
.cm-st-top{position:absolute;top:0;left:0;right:0;height:130px;display:grid;place-items:center;background:#f2f3f5}
.cm-plus{position:absolute;top:112px;left:50%;transform:translateX(-50%);width:34px;height:34px;border-radius:50%;background:#ff6a00;border:3px solid #f2f3f5;display:grid;place-items:center;font-size:1.3rem;font-weight:700;z-index:2}
.cm-st-new b{text-shadow:none;color:#111}.cm-st-new:after{display:none}.cm-nost{align-self:center;margin:0}
.cm-filter{display:flex;gap:6px;overflow-x:auto}.cm-filter a{white-space:nowrap;padding:6px 12px;border-radius:20px;background:#eef0f3;color:inherit;text-decoration:none;font-size:.85rem}.cm-filter a.on{background:#ff6a00;color:#000;font-weight:700}
.cm-post{padding:12px 14px 8px}.cm-ph{display:flex;gap:10px;align-items:center}.cm-pm{flex:1;min-width:0}.cm-pm b{display:block}.cm-pm b a{color:inherit;text-decoration:none}.cm-pm>span{font-size:.78rem;opacity:.65}
.cm-more{position:relative}.cm-more summary{cursor:pointer;list-style:none;font-size:1.3rem;padding:0 8px}.cm-more summary::-webkit-details-marker{display:none}.cm-more div{position:absolute;inset-inline-end:0;top:28px;background:#fff;border:1px solid #d0d3d9;border-radius:10px;padding:4px;z-index:5;min-width:120px}.cm-more button{display:block;width:100%;background:none;border:0;color:inherit;text-align:start;padding:8px;cursor:pointer;font:inherit}
.cm-pin{font-size:.78rem;color:#ff8a33;margin-top:6px}.cm-body{margin:10px 0;line-height:1.55;white-space:normal;word-break:break-word}
.cm-ph-grid{display:grid;gap:3px;border-radius:10px;overflow:hidden;margin:6px 0}.cm-ph-grid img{width:100%;height:100%;object-fit:cover;display:block;max-height:420px}.cm-ph-grid.n2,.cm-ph-grid.n4{grid-template-columns:1fr 1fr}.cm-ph-grid.n3{grid-template-columns:1fr 1fr}.cm-ph-grid.n3 a:first-child{grid-column:1/-1}
.cm-stats{display:flex;justify-content:space-between;font-size:.82rem;opacity:.75;padding:4px 2px;min-height:20px}
.cm-actions{display:flex;border-top:1px solid #e4e6eb;border-bottom:1px solid #e4e6eb;margin-top:4px}.cm-actions button,.cm-actions a{flex:1;background:none;border:0;color:inherit;padding:9px 4px;cursor:pointer;font:inherit;font-weight:600;text-align:center;text-decoration:none;font-size:.9rem;border-radius:8px}.cm-actions button:hover,.cm-actions a:hover{background:#eef0f3}.cm-like.on{color:#ff8a33}
.cm-c{display:flex;gap:8px;margin-top:8px}.cm-cb{background:#eef0f3;border-radius:16px;padding:7px 12px;font-size:.9rem;min-width:0}.cm-cb b{display:block;font-size:.8rem}.cm-cb span{word-break:break-word}
.cm-cform{display:flex;gap:8px;align-items:center;margin:10px 0 4px}.cm-cform input{flex:1;background:#eef0f3;border:0;border-radius:20px;padding:9px 14px;color:inherit;font:inherit;min-width:0}.cm-cform button{background:none;border:0;color:#ff8a33;font-size:1.2rem;cursor:pointer}
.cm-morep{text-align:center}.cm-empty{text-align:center}
.cm-sv{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:99999;display:grid;place-items:center}.cm-sv[hidden]{display:none}
.cm-sv-in{position:relative;width:min(420px,100vw);height:min(760px,100vh);background:#000;border-radius:14px;overflow:hidden}.cm-sv-in img{width:100%;height:100%;object-fit:contain}
.cm-sv-bars{position:absolute;top:8px;left:8px;right:8px;display:flex;gap:4px;z-index:3}.cm-sv-bars i{flex:1;height:3px;background:rgba(255,255,255,.35);border-radius:2px}.cm-sv-bars i.d{background:#fff}.cm-sv-bars i.a{background:linear-gradient(90deg,#fff,#fff);animation:cmbar 5s linear}
@keyframes cmbar{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.cm-sv-top{position:absolute;top:18px;left:10px;right:10px;display:flex;gap:6px;align-items:center;color:#fff;z-index:3;font-weight:700}.cm-sv-top span{flex:1;text-shadow:0 1px 3px #000}.cm-sv-top button{background:rgba(0,0,0,.5);border:0;color:#fff;width:34px;height:34px;border-radius:50%;cursor:pointer}
#cmSvCap{position:absolute;bottom:0;left:0;right:0;margin:0;padding:40px 16px 20px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.8));z-index:2}
.cm-sv-p,.cm-sv-n{position:absolute;top:60px;bottom:80px;width:40%;background:none;border:0;color:transparent;z-index:2;cursor:pointer}.cm-sv-p{left:0}.cm-sv-n{right:0}
@media(max-width:1000px){.cm-wrap{grid-template-columns:minmax(0,1fr) 260px}.cm-left{display:none}}
@media(max-width:760px){.cm-wrap{grid-template-columns:1fr;padding:0 10px;margin-top:10px}.cm-right{position:static;order:2}.cm-st{flex-basis:98px;height:165px}}
.cm-actions .cm-msg small{opacity:.6;font-weight:500;font-size:.72rem}
/* account menu: always fits the window, Log out stays visible */
.acct-menu{max-height:calc(100vh - 128px);max-height:calc(100dvh - 128px);overflow-y:auto;overscroll-behavior:contain}
.acct-menu .am-out{position:sticky;bottom:-10px;background:#fff;border-top:1px solid #e4e6eb;margin-top:4px;border-radius:0 0 8px 8px;z-index:2}
@media(max-width:900px){.acct-menu{max-height:min(82vh,calc(100dvh - 70px))}}
@media(max-height:760px){.am-i{padding:4px 8px}.am-ic{width:30px;height:30px;font-size:15px}.am-card{margin-bottom:4px}.am-all{padding:6px;margin-top:4px}.am-me{padding:4px 8px}}
.acct-menu{z-index:100000}.acct{position:relative;z-index:100000}@media(max-width:900px){.acct-menu{z-index:100001}}
body.acct-open .site-header{position:relative;z-index:100000}
/* homepage community teaser */
.cmh{background:#fff;padding:26px 0;border-bottom:1px solid #eee}
.cmh-top{display:flex;gap:20px;justify-content:space-between;align-items:center;flex-wrap:wrap}.cmh-top>div:first-child{flex:1 1 420px;min-width:0}
.cmh h2{margin:6px 0;font-size:1.45rem;line-height:1.3;color:#111}.cmh p{margin:0;color:#444;max-width:640px;line-height:1.6}
.cmh-b{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.cmh-b .btn-ghost{color:#111;border:1px solid #ccc;background:#fff}.cmh-link{color:#c24e00;font-weight:700;text-decoration:none}
.cmh-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin-top:18px}
.cmh-c{background:#faf7f3;border:1px solid #f0e3d6;border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:6px}.cmh-c small{color:#c24e00;font-weight:700}.cmh-c h3{margin:0;font-size:1.05rem;color:#111;line-height:1.35}.cmh-c p{font-size:.9rem;color:#444;flex:1}.cmh-c a{color:#c24e00;font-weight:700;text-decoration:none}
.cmh-n{margin-top:12px!important;font-size:.9rem}.cmh-n a{color:#111;font-weight:700}
/* hub tiles, connect strip, customer map */
.hub{padding:22px 0 8px;background:#fff}.hub h2{margin:0 0 12px;font-size:1.3rem;color:#111}
.hub-g{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.hub-c{display:flex;flex-direction:column;gap:4px;padding:14px;border:1px solid #eee;border-radius:14px;background:#faf7f3;text-decoration:none;color:#111;transition:.15s}.hub-c:hover{border-color:#ff6a00;transform:translateY(-2px)}
.hub-c i{font-style:normal;font-size:1.7rem}.hub-c b{font-size:.98rem}.hub-c span{font-size:.8rem;color:#555;line-height:1.4}
@media(max-width:1000px){.hub-g{grid-template-columns:repeat(3,1fr)}}@media(max-width:560px){.hub-g{grid-template-columns:repeat(2,1fr);gap:8px}.hub-c{padding:11px}}
.cstrip{background:#fff7f0;border-block:1px solid #f3dcc6;padding:10px 0;margin-top:24px}.cstrip .pr-wrap{display:flex;gap:10px 16px;align-items:center;flex-wrap:wrap;font-size:.92rem}.cstrip a{color:#c24e00;font-weight:700;text-decoration:none}.cstrip>.pr-wrap>span:first-child{color:#444}
.cmap h1{margin-bottom:4px}.cmap-flow{list-style:none;display:grid;grid-template-columns:repeat(6,1fr);gap:0;margin:20px 0;padding:0}
.cmap-flow li{position:relative;background:#faf7f3;border:1px solid #f0e3d6;padding:14px 12px;display:flex;flex-direction:column;gap:3px;text-align:center;align-items:center}
.cmap-flow li:first-child{border-radius:14px 0 0 14px}.cmap-flow li:last-child{border-radius:0 14px 14px 0}
.cmap-flow li:not(:last-child):after{content:"›";position:absolute;inset-inline-end:-9px;top:50%;transform:translateY(-50%);width:18px;height:18px;border-radius:50%;background:#ff6a00;color:#fff;font-weight:800;line-height:17px;z-index:2}
.cmap-flow i{font-style:normal;font-size:1.6rem}.cmap-flow b{font-size:1rem}.cmap-flow span{font-size:.78rem;color:#555;line-height:1.35}
[dir=rtl] .cmap-flow li:not(:last-child):after{content:"‹"}
@media(max-width:800px){.cmap-flow{grid-template-columns:repeat(2,1fr);gap:8px}.cmap-flow li,.cmap-flow li:first-child,.cmap-flow li:last-child{border-radius:12px}.cmap-flow li:after{display:none}}
.cmap-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}.cmap-c{border:1px solid #eee;border-radius:14px;padding:14px 16px;background:#fff}.cmap-c h2{font-size:1.05rem;margin:0 0 8px}
.cmap-c a{display:block;padding:6px 0;color:#222;text-decoration:none;border-bottom:1px solid #f3f3f3}.cmap-c a:hover{color:#c24e00}.cmap-c a:last-child{border:0}
.cmap-help{margin-top:22px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
/* community teaser: compact */
.cmh{padding:12px 0}
.cmh h2{font-size:1.1rem;margin:4px 0 2px}
.cmh p{font-size:.85rem;line-height:1.45}
.cmh-top{gap:10px}
.cmh-b .btn,.cmh-b a.btn{padding:7px 14px;font-size:.85rem}
.cmh-link{font-size:.85rem}
.cmh-g{gap:8px;margin-top:10px}
.cmh-c{padding:9px 12px;gap:3px;border-radius:10px}
.cmh-c small{font-size:.75rem}
.cmh-c h3{font-size:.9rem;line-height:1.3}
.cmh-c p{font-size:.8rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex:0}
.cmh-c a{font-size:.8rem}
@media(max-width:700px){.cmh-g{grid-template-columns:1fr}.cmh-c:nth-child(n+3){display:none}}
/* hub tiles: slim */
.hub{padding:10px 0 4px}
.hub h2{font-size:1rem;margin:0 0 8px}
.hub-g{gap:8px}
.hub-c{flex-direction:row;align-items:center;gap:8px;padding:8px 10px;border-radius:10px}
.hub-c i{font-size:1.3rem}.hub-c b{font-size:.85rem;line-height:1.2}.hub-c span{display:none}
.cmh-g{align-items:start}
.cmh-n{margin-top:6px!important;font-size:.8rem}
@media(max-width:560px){.hub-c{padding:7px 8px}}
/* slim catalogue bar */
.pcs{background:#faf7f3;border-top:1px solid #eee;border-bottom:1px solid #eee;padding:12px 0}
.pcs-in{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.pcs-t{display:flex;flex-direction:column;gap:2px;min-width:0}.pcs-t b{font-size:1rem;color:#111}.pcs-t span{font-size:.85rem;color:#555}
.pcs-b{display:flex;gap:8px;flex-wrap:wrap}.pcs-b .btn{padding:8px 16px;font-size:.85rem}.pcs-b .btn-ghost{color:#111;border:1px solid #ccc;background:#fff}
/* services page header */
.svc-h{background:#fff;padding:22px 0 8px}.svc-h h1{margin:0 0 6px;font-size:1.6rem;color:#111}.svc-h p{margin:0 0 12px;color:#555;max-width:640px}
.svc-l{display:flex;gap:8px;flex-wrap:wrap}.svc-l a{padding:7px 14px;border:1px solid #ddd;border-radius:999px;color:#111;text-decoration:none;font-weight:700;font-size:.85rem;background:#faf7f3}.svc-l a:hover{border-color:#ff6a00}
/* jobs & workers board */
.jbh{background:#fff;padding:14px 0;border-bottom:1px solid #eee}.jbh-top{display:flex;gap:14px;justify-content:space-between;align-items:center;flex-wrap:wrap}.jbh-top>div:first-child{flex:1 1 420px;min-width:0}
.jbh-k{display:inline-block;background:#ff6a00;color:#fff;font-weight:800;font-size:.7rem;letter-spacing:.1em;padding:3px 10px;border-radius:999px}
.jbh h2{margin:4px 0 2px;font-size:1.1rem;line-height:1.3;color:#111}.jbh p{margin:0;font-size:.85rem;color:#444}.jbh-b{display:flex;gap:8px;flex-wrap:wrap}.jbh-b .btn{padding:8px 14px;font-size:.85rem}.jbh-b .btn-ghost{color:#111;border:1px solid #ccc;background:#fff}
.jbh-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:8px;margin-top:10px}.jbh-c{display:flex;flex-direction:column;gap:2px;background:#faf7f3;border:1px solid #f0e3d6;border-radius:10px;padding:9px 12px;text-decoration:none;color:#111}.jbh-c small{color:#c24e00;font-weight:800;font-size:.7rem}.jbh-c b{font-size:.9rem}.jbh-c span{font-size:.8rem;color:#555}
.jb h1{margin:0 0 6px}.jb-go{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin:14px 0}.jb-g{position:relative;display:flex;flex-direction:column;gap:3px;padding:14px;border:1px solid #eee;border-radius:14px;background:#faf7f3;text-decoration:none;color:#111}.jb-g:hover{border-color:#ff6a00}.jb-g i{font-style:normal;font-size:1.6rem}.jb-g span{font-size:.85rem;color:#555}.jb-g small{position:absolute;top:12px;inset-inline-end:14px;background:#ff6a00;color:#fff;border-radius:999px;padding:1px 9px;font-weight:800}
.jb-post{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.jb-post .btn-ghost,.jb-b .btn-ghost{color:#111;border:1px solid #ccc;background:#fff}
.jb-tabs{display:flex;gap:6px;border-bottom:2px solid #eee;margin-bottom:10px}.jb-tabs a{padding:8px 14px;text-decoration:none;color:#555;font-weight:700;border-bottom:3px solid transparent;margin-bottom:-2px}.jb-tabs a.on{color:#111;border-color:#ff6a00}
.jb-f{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.jb-f select,.jb-f input{padding:9px 10px;border:1px solid #ccc;border-radius:10px;min-width:0;flex:1 1 150px}
.jb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}.jb-c{background:#fff;border:1px solid #e8e8e8;border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:6px}.jb-c h3{margin:0;font-size:1.02rem}.jb-c p{margin:0;font-size:.9rem;color:#333;word-break:break-word}
.jb-t{display:flex;justify-content:space-between;align-items:center}.jb-k{font-size:.7rem;font-weight:800;padding:2px 9px;border-radius:999px;background:#111;color:#fff}.jb-k.jb-worker{background:#ff6a00}.jb-ago{font-size:.75rem;color:#777}.jb-m{font-size:.82rem;color:#555}
.jb-b{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:4px}.jb-b .btn{padding:8px 12px;font-size:.85rem}.jb-rp{margin-inline-start:auto}.jb-link{background:none;border:0;color:#777;cursor:pointer;font-size:.8rem}
.jb-empty{background:#faf7f3;border:1px dashed #ddd;border-radius:14px;padding:24px;text-align:center}.jb-safe{margin-top:16px;font-size:.82rem;color:#7a4b00;background:#fff7e6;border:1px solid #f3dfb4;border-radius:10px;padding:10px 12px}
.jb-form{display:flex;flex-direction:column;gap:6px}.jb-form label{font-weight:700;margin-top:6px;font-size:.9rem}.jb-form input,.jb-form select,.jb-form textarea{padding:10px;border:1px solid #ccc;border-radius:10px;width:100%;font:inherit}.jb-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}.jb-form .btn{margin-top:10px;align-self:flex-start}

/* mega-category menu: 4 columns */
.nav-dd-menu{width:min(980px,96vw)!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:6px 10px!important}
.nav-dd-menu .nav-dd-rent,.nav-dd-menu .nav-dd-all{grid-column:1/-1}
.nav-mega{display:flex;flex-direction:column;gap:1px;min-width:0}.nav-mega-h{display:block;font-size:.78rem;line-height:1.3;color:#c24e00;font-weight:800;padding:6px 10px 4px;border-bottom:2px solid #ff6a00;margin-bottom:4px}
.mnav-mega{border-bottom:1px solid rgba(255,255,255,.08)}.mnav-mega summary{padding:12px 4px;font-weight:800;cursor:pointer;list-style:none}.mnav-mega summary::-webkit-details-marker{display:none}.mnav-mega a{display:block;padding:8px 14px!important}
.footer-popular details{margin:0}.footer-popular summary{cursor:pointer;font-weight:800;list-style:none;display:inline-block;padding:6px 0}.footer-popular summary::-webkit-details-marker{display:none}.footer-popular summary:after{content:" ▾"}.footer-popular details[open] summary:after{content:" ▴"}
/* hero value-props band */
.hv{background:#0b0f1a;color:#fff;padding:12px 0;border-bottom:3px solid #ff6a00}
.hv-in{display:flex;gap:14px;justify-content:space-between;align-items:center;flex-wrap:wrap}
.hv-p{display:flex;gap:8px 18px;flex-wrap:wrap;list-style:none;margin:0;padding:0;font-weight:700;font-size:.92rem}
.hv-b{display:flex;gap:10px;flex-wrap:wrap}.hv-b .btn{padding:11px 22px;font-size:.95rem;font-weight:800;border-radius:999px}
.hv-1{background:#ff6a00;color:#fff;border:2px solid #ff6a00}.hv-2{background:#fff;color:#0b0f1a;border:2px solid #fff}.hv-1:hover{filter:brightness(1.08)}.hv-2:hover{background:#ffe9d9}
/* choose your trade */
.tg{background:#fff;padding:18px 0 6px}.tg h2{margin:0 0 10px;font-size:1.15rem;color:#111}
.tg-g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.tg-c{display:flex;flex-direction:column;gap:3px;padding:16px;border:2px solid #eee;border-radius:14px;background:#faf7f3;text-decoration:none;color:#111;transition:.15s}.tg-c:hover{border-color:#ff6a00;transform:translateY(-2px);box-shadow:0 8px 20px rgba(255,106,0,.15)}
.tg-c i{font-style:normal;font-size:1.9rem}.tg-c b{font-size:1.02rem}.tg-c span{font-size:.82rem;color:#555;line-height:1.35}
/* smarter ordering tools: one row */
.tw{background:#fff;padding:8px 0 14px}.tw-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;background:#0b0f1a;border-radius:14px;overflow:hidden}
.tw-c{display:flex;gap:10px;align-items:center;padding:12px 16px;color:#fff;text-decoration:none;border-inline-end:1px solid rgba(255,255,255,.12)}.tw-c:last-child{border:0}.tw-c:hover{background:#1a2133}
.tw-c i{font-style:normal;font-size:1.5rem}.tw-c b{display:block;font-size:.95rem}.tw-c span{display:block;font-size:.78rem;color:#aab3c8}
/* carousels */
.car{padding:14px 0 6px}.car-h{display:flex;justify-content:space-between;align-items:flex-end;gap:10px;margin-bottom:8px}.car-h h2{margin:0;font-size:1.25rem}.car-h p{margin:2px 0 0;font-size:.85rem;color:#555}
.car-box{position:relative}.car-track{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:2px 2px 10px}.car-track::-webkit-scrollbar{display:none}
.car-track>.product-card{flex:0 0 200px;scroll-snap-align:start;margin:0}.car-track>.dv-card{flex:0 0 300px;scroll-snap-align:start;margin:0}
.car-b{position:absolute;top:42%;z-index:3;width:38px;height:38px;border-radius:50%;border:1px solid #ddd;background:#fff;box-shadow:0 4px 12px rgba(0,0,0,.18);font-size:22px;line-height:1;cursor:pointer}.car-prev{inset-inline-start:-12px}.car-next{inset-inline-end:-12px}.car-b:hover{border-color:#ff6a00;color:#ff6a00}
@media(max-width:900px){.tg-g{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.car-b{display:none}.car-track>.product-card{flex-basis:42vw;max-width:170px}.car-track>.dv-card{flex-basis:78vw;max-width:300px}.hv-in{gap:10px}.hv-b{width:100%}.hv-b .btn{flex:1 1 0;text-align:center;padding:11px 8px;font-size:.88rem}.hv-p{font-size:.82rem;gap:4px 12px}
  .tw-g{grid-template-columns:1fr}.tw-c{border-inline-end:0;border-bottom:1px solid rgba(255,255,255,.12);padding:10px 14px}.tw-c:last-child{border:0}.tg-c{padding:12px}.tg-c i{font-size:1.5rem}}

/* Prayer times widget (optional) */
#prayerW{position:fixed;inset-inline-start:12px;bottom:84px;z-index:900;font:600 .8rem/1.2 system-ui,sans-serif}
#prBtn{display:flex;align-items:center;gap:6px;background:#111;color:#fff;border:2px solid #f60;border-radius:999px;padding:7px 12px;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.25)}
#prBtn .pr-i{font-size:1rem}
#prPop{position:absolute;inset-inline-start:0;bottom:44px;width:260px;max-width:calc(100vw - 24px);background:#fff;color:#111;border:2px solid #111;border-radius:14px;padding:12px;box-shadow:0 10px 30px rgba(0,0,0,.3)}
#prPop[hidden]{display:none}
#prPop .pr-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
#prPop .pr-h button{background:none;border:0;font-size:1.3rem;cursor:pointer}
#prPop select{width:100%;margin-bottom:8px;padding:6px}
#prPop ul{list-style:none;margin:0 0 8px;padding:0}
#prPop li{display:flex;justify-content:space-between;padding:5px 8px;border-radius:8px}
#prPop li.on{background:#f60;color:#fff}
#prPop .pr-o{display:block;margin:6px 0;font-weight:500}
#prPop small{display:block;color:#666;font-weight:400;margin-top:6px}
#prPop .pr-s{margin-top:8px;width:100%;padding:7px;border-radius:8px;border:0;background:#111;color:#fff;cursor:pointer}
.pr-toast{position:fixed;left:50%;transform:translateX(-50%);top:16px;z-index:2000;background:#111;color:#fff;border:2px solid #f60;border-radius:12px;padding:12px 18px;font-weight:700;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.35)}
.pt-tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;margin-bottom:12px}
.pt-tabs a{white-space:nowrap;padding:7px 14px;border:2px solid #111;border-radius:999px;color:#111;font-weight:700;text-decoration:none;background:#fff}
.pt-tabs a.on{background:#f60;border-color:#f60;color:#fff}
.pt-today{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;margin-bottom:16px}
.pt-today div{background:#111;color:#fff;border-radius:12px;padding:10px;text-align:center}
.pt-today small{display:block;color:#f60;font-weight:700}.pt-today b{font-size:1.05rem}
.pt-ctl{display:flex;align-items:center;justify-content:center;gap:14px;margin:8px 0}
.pt-wrap{overflow-x:auto}.pt-tbl{width:100%;border-collapse:collapse;font-size:.9rem;min-width:520px}
.pt-tbl th{background:#111;color:#fff;padding:8px;text-align:center}.pt-tbl td{padding:7px 8px;text-align:center;border-bottom:1px solid #ddd}
.pt-tbl td:first-child{text-align:start;font-weight:700}.pt-tbl tr.on td{background:#fff1e6;font-weight:700}
#prPop .pr-l{display:block;margin-top:8px;color:#f60;font-weight:700;text-decoration:none}

/* Game banner on the home page */
.gmh{margin:14px 0}.gmh-in{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:18px 24px;border-radius:18px;border:1.5px solid #f60;background:linear-gradient(120deg,#0b0f1a,#1a2438);color:#fff}
.gmh-k{font-size:12px;letter-spacing:.14em;color:#ffc466;font-weight:800}.gmh h2{margin:4px 0 4px;font-size:clamp(20px,2.6vw,28px);color:#fff}.gmh p{margin:0;color:#d5dbe8;max-width:640px;font-size:.95rem}

@media(max-width:760px){#prayerW{bottom:76px;inset-inline-start:10px}#prBtn{padding:0;width:44px;height:44px;justify-content:center;border-width:2px}#prBtn #prTxt{display:none}#prBtn .pr-i{font-size:1.3rem}#prPop{bottom:54px}}
html[dir=rtl] #prayerW{inset-inline-start:auto;left:auto;right:12px}html[dir=rtl] #prPop{inset-inline-start:auto;left:auto;right:0}
@media(max-width:760px){html[dir=rtl] #prayerW{right:10px}}