/* ══════════════════════════════════════════════════════
   Digital India Path — Modern 3D Design System v3
   ══════════════════════════════════════════════════════ */

/* ── Google Fonts ── */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Poppins:wght@400;600;700;800;900&display=swap');

/* ── Design Tokens ── */
:root {
  --primary: #ff6a00;
  --primary-d: #cc5500;
  --primary-l: #fff3ec;
  --primary-glow: rgba(255,106,0,.35);
  --navy: #38bdf8;
  --navy-l: #0ea5e9;
  --navy-2: #0284c7;
  --green: #1a7a1a;
  --white: #ffffff;
  --gray-50: #f8fafc;
  --gray-100: #f1f5f9;
  --gray-200: #e2e8f0;
  --gray-400: #94a3b8;
  --gray-600: #64748b;
  --gray-700: #475569;
  --gray-800: #1e293b;
  --shadow-xs: 0 1px 4px rgba(0,0,0,.06);
  --shadow-sm: 0 2px 12px rgba(0,0,0,.08);
  --shadow-md: 0 4px 24px rgba(0,0,0,.12);
  --shadow-lg: 0 8px 40px rgba(0,0,0,.18);
  --shadow-glow: 0 0 32px var(--primary-glow);
  --radius-sm: 8px;
  --radius: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --transition: all .25s cubic-bezier(.4,0,.2,1);
  --glass: rgba(255,255,255,.08);
  --glass-border: rgba(255,255,255,.12);
  --edge-pad: 14px;
  --section-y: clamp(40px,7vw,72px);
  --hero-h: 520px;
  --compact-gap: 14px;
}

*,*::before,*::after { box-sizing: border-box; margin: 0; padding: 0 }
html { scroll-behavior: smooth; font-size: 15px }
body { font-family: 'Inter', sans-serif; color: var(--gray-800); background: #f0f4f8; line-height: 1.6; overflow-x: hidden }
body, body * { -webkit-user-select:text; -moz-user-select:text; user-select:text; -webkit-touch-callout:default }
button, .btn, .tbl-btn, .slider-btn, .home-search-close, .header-search-toggle, .home-promo-close, .industry-scroll-btn, .home-blog-scroll-btn { -webkit-user-select:none; -moz-user-select:none; user-select:none }
input, textarea, select, option, [contenteditable="true"], .copy-allowed, .copy-allowed * { -webkit-user-select:text; -moz-user-select:text; user-select:text; -webkit-touch-callout:default }
a { color: inherit; text-decoration: none }
img { max-width: 100%; display: block }
ul { list-style: none }
input, select, textarea, button { font-family: inherit; font-size: inherit }
.container { width: 100%; max-width: 1320px; margin: 0 auto; padding: 0 clamp(14px,3vw,48px) }
.main-content { min-height: calc(100vh - 140px) }
.top-bar > .container,
.main-header > .container,
.cat-navbar > .container,
.site-footer .container { max-width:none; width:100%; padding:0 var(--edge-pad) }
.main-header > .container { padding-left:28px }

/* ── TOP BAR ────────────────────────────────────────────── */
.top-bar { background: linear-gradient(135deg,#09122b,#060d1f); border-bottom: 1px solid rgba(255,255,255,.06); overflow:hidden }
.top-bar-inner { display:flex; justify-content:space-between; align-items:center; padding:1px 0; flex-wrap:nowrap; gap:10px; white-space:nowrap; overflow:hidden }
.top-bar-left,.top-bar-right { display:flex; align-items:center; gap:var(--compact-gap); flex-wrap:nowrap; white-space:nowrap; min-width:0 }
.top-bar-left { flex:1 1 auto; overflow:hidden }
.top-bar-right { flex:0 1 auto; justify-content:flex-end; overflow:hidden }
.top-bar-left span,.top-bar-right a { display:flex; align-items:center; gap:5px; font-size:11.5px; color:rgba(255,255,255,.7); white-space:nowrap }
.top-bar-left span { overflow:hidden; text-overflow:ellipsis }
.top-bar-left span:not(.free-badge) { max-width:220px }
.location-badge { max-width:280px; overflow:hidden; text-overflow:ellipsis }
.location-badge .loc-text { overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.top-bar-right a:hover { color:#fff }
.top-bar-sep { width:1px; height:14px; background:rgba(255,255,255,.12) }
.free-badge { background:linear-gradient(90deg,#22c55e,#16a34a); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; font-weight:700 }
.top-bar-cta { background:linear-gradient(135deg,var(--primary),var(--primary-d)) !important; color:#fff !important; padding:2px 12px; border-radius:20px; font-weight:700; font-size:11px; box-shadow:0 2px 8px var(--primary-glow); transition:var(--transition); -webkit-text-fill-color:#fff }
.top-bar-cta:hover { transform:translateY(-1px); box-shadow:var(--shadow-glow) }
.top-logout { color:#f87171 !important }
.top-social { display:flex; gap:6px }
.top-social a { width:24px; height:24px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:10px; color:rgba(255,255,255,.6); transition:var(--transition) }
.top-social a:hover { background:var(--primary); border-color:var(--primary); color:#fff; transform:scale(1.15) }
.currency-switcher,.language-switcher { display:flex; align-items:center; gap:5px; font-size:11px; color:rgba(255,255,255,.65) }
.currency-select,.language-select { background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.15); color:rgba(255,255,255,.9); padding:2px 7px; border-radius:5px; font-size:11px; cursor:pointer; outline:none }
.currency-select option,.language-select option,.language-select optgroup { background:#09122b; color:#fff }
.language-select { width:112px; min-width:96px; max-width:112px }
.google-translate-host { position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden }
.language-switcher .goog-te-gadget { height:22px; color:transparent !important; font-size:0 !important; line-height:1 !important }
.language-switcher .goog-te-combo { margin:0 !important; max-width:132px; height:22px }
.language-switcher span { display:none !important }
.support-chat-btn { display:flex; align-items:center; gap:7px; border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.08); color:rgba(255,255,255,.86); border-radius:999px; padding:2px 10px; font-size:11.5px; font-weight:700; cursor:pointer; transition:var(--transition); white-space:nowrap }
.support-chat-btn i { color:var(--primary) }
.support-chat-btn:hover { background:rgba(255,255,255,.14); color:#fff; transform:translateY(-1px) }
.top-wishlist-link { display:inline-flex; align-items:center; gap:6px; color:rgba(255,255,255,.84); font-size:11.5px; font-weight:800 }
.top-wishlist-link i { color:#fb7185 }
.top-wishlist-link span { min-width:18px; height:18px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; background:rgba(255,255,255,.12); color:#fff; font-size:10px; padding:0 5px }
.top-wishlist-link:hover { color:#fff }
.support-panel-overlay { position:fixed; inset:0; background:rgba(2,6,23,.45); opacity:0; pointer-events:none; transition:var(--transition); z-index:600 }
.support-panel-overlay.open { opacity:1; pointer-events:auto }
.support-panel { position:fixed; top:0; right:0; width:min(410px,100vw); height:100vh; background:#f4f7fb; box-shadow:-16px 0 40px rgba(2,6,23,.22); transform:translateX(100%); transition:transform .28s ease; z-index:610; display:flex; flex-direction:column }
.support-panel.open { transform:translateX(0) }
.support-panel-head { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 20px; background:linear-gradient(135deg,#09122b,#10204d); color:#fff }
.support-panel-title { display:flex; align-items:center; gap:9px; font-weight:800; font-size:16px }
.support-panel-title i { color:var(--primary) }
.support-panel-sub { color:rgba(255,255,255,.65); font-size:12px; margin-top:2px }
.support-panel-sub span { display:inline-block; width:7px; height:7px; margin-right:4px; border-radius:50%; background:#4ade80; box-shadow:0 0 0 3px rgba(74,222,128,.14) }
.support-bot-heading { display:flex; align-items:center; gap:11px }
.support-bot-avatar { position:relative; width:42px; height:42px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; border-radius:14px; background:linear-gradient(135deg,#8b5cf6,#6d28d9); font-size:19px; box-shadow:0 8px 20px rgba(124,58,237,.3) }
.support-bot-online { position:absolute; right:-1px; bottom:-1px; width:11px; height:11px; border:2px solid #10204d; border-radius:50%; background:#4ade80 }
.support-panel-close { width:34px; height:34px; border:none; border-radius:50%; background:rgba(255,255,255,.1); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center }
.support-panel-close:hover { background:rgba(255,255,255,.18) }
.support-chat-body { flex:1; overflow:auto; padding:20px 16px 24px; scroll-behavior:smooth }
.support-chat-day { width:max-content; margin:0 auto 18px; padding:4px 9px; border-radius:999px; background:#e8edf5; color:#64748b; font-size:10px; font-weight:800 }
.support-chat-row { display:flex; align-items:flex-end; gap:8px; margin:9px 0 }
.support-chat-row.user { justify-content:flex-end }
.support-chat-avatar { width:28px; height:28px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; border-radius:10px; background:linear-gradient(135deg,#8b5cf6,#6d28d9); color:#fff; font-size:12px }
.support-chat-bubble { max-width:82%; padding:11px 13px; border-radius:6px 16px 16px 16px; background:#fff; color:#334155; font-size:13px; line-height:1.5; box-shadow:0 4px 14px rgba(15,23,42,.07); white-space:pre-wrap }
.support-chat-row.user .support-chat-bubble { border-radius:16px 6px 16px 16px; background:linear-gradient(135deg,#7c3aed,#9b7cf8); color:#fff }
.support-chat-topics { display:flex; flex-wrap:wrap; gap:7px; margin:14px 0 6px 36px }
.support-chat-topics button { border:1px solid #ddd6fe; border-radius:999px; padding:8px 10px; background:#fff; color:#6d28d9; font-size:11px; font-weight:800; cursor:pointer; transition:var(--transition) }
.support-chat-topics button:hover { color:#fff; border-color:#7c3aed; background:#7c3aed; transform:translateY(-1px) }
.support-chat-typing { display:flex; gap:4px; align-items:center; height:18px }
.support-chat-typing i { width:6px; height:6px; border-radius:50%; background:#94a3b8; animation:supportTyping 1s infinite ease-in-out }
.support-chat-typing i:nth-child(2) { animation-delay:.15s }.support-chat-typing i:nth-child(3) { animation-delay:.3s }
@keyframes supportTyping { 0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-4px);opacity:1} }
.support-chat-composer { position:relative; display:flex; align-items:flex-end; gap:8px; padding:12px 14px 14px; border-top:1px solid #e2e8f0; background:#fff }
.support-chat-composer textarea { flex:1; max-height:110px; min-height:44px; resize:none; overflow:auto; border:1px solid #dbe3ee; border-radius:16px; padding:12px 14px; outline:none; color:#1e293b; font:inherit; font-size:13px }
.support-chat-composer textarea:focus { border-color:#8b5cf6; box-shadow:0 0 0 3px rgba(139,92,246,.1) }
.support-chat-composer .support-send-btn { width:44px; height:44px; flex:0 0 auto; padding:0; border-radius:14px; background:linear-gradient(135deg,#8b5cf6,#7c3aed); box-shadow:0 7px 18px rgba(124,58,237,.25) }
.support-chat-composer .support-panel-status { position:absolute; left:16px; bottom:1px; min-height:0; font-size:10px }
.support-field { width:100%; border:1px solid var(--gray-200); border-radius:8px; padding:11px 12px; outline:none; color:var(--gray-800); background:#fff; transition:var(--transition) }
.support-field:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(255,106,0,.12) }
textarea.support-field { resize:vertical; min-height:120px }
.support-send-btn { border:none; border-radius:8px; background:linear-gradient(135deg,var(--primary),var(--primary-d)); color:#fff; padding:12px 14px; font-weight:800; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px; box-shadow:0 6px 18px var(--primary-glow) }
.support-send-btn:disabled { opacity:.65; cursor:not-allowed; transform:none }
.support-panel-status { min-height:18px; font-size:12px; font-weight:700; color:var(--gray-600) }
.support-panel-status.success { color:#16a34a }
.support-panel-status.error { color:#dc2626 }
.consult-modal-overlay { position:fixed; inset:0; background:rgba(2,6,23,.55); opacity:0; visibility:hidden; pointer-events:none; transition:var(--transition); z-index:620 }
.consult-modal-overlay.open { opacity:1; visibility:visible; pointer-events:auto }
.consult-modal { position:fixed; left:50%; top:50%; width:min(560px,calc(100vw - 28px)); max-height:calc(100vh - 36px); overflow:auto; background:#fff; border-radius:10px; box-shadow:0 28px 90px rgba(2,6,23,.34); transform:translate(-50%,-46%) scale(.96); opacity:0; visibility:hidden; pointer-events:none; transition:var(--transition); z-index:630 }
.consult-modal.open { transform:translate(-50%,-50%) scale(1); opacity:1; visibility:visible; pointer-events:auto }
.consult-modal-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:20px 22px; color:#fff; background:linear-gradient(135deg,var(--primary),var(--navy)) }
.consult-modal-kicker { font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.45px; opacity:.78; margin-bottom:4px }
.consult-modal-head h2 { font-size:1.35rem; font-weight:950; line-height:1.1 }
.consult-modal-close { width:34px; height:34px; border:none; border-radius:50%; background:rgba(255,255,255,.14); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer }
.consult-modal-close:hover { background:rgba(255,255,255,.22) }
.consult-form { padding:20px 22px 22px; display:flex; flex-direction:column; gap:14px }
.consult-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px }
.consult-grid label { color:var(--gray-700); font-size:12px; font-weight:850; display:flex; flex-direction:column; gap:6px }
.consult-grid .span-2 { grid-column:1 / -1 }
.consult-grid textarea.support-field { min-height:104px }

/* ── LOCATION BADGE ─────────────────────────────────────── */
.location-badge { display:flex; align-items:center; gap:4px; font-size:11px; color:rgba(255,255,255,.65); cursor:pointer; transition:var(--transition) }
.location-badge:hover { color:#fff }
.location-badge i { color:#ff6a00 }

/* ── HEADER ─────────────────────────────────────────────── */
.main-header { background:#fff; backdrop-filter:none; border-bottom:1px solid #e5e7eb; border-image:none; position:sticky; top:0; z-index:100; box-shadow:none }
.main-header-inner { display:flex; align-items:center; gap:12px; padding:2px 0; flex-wrap:wrap }
.site-logo { display:flex; align-items:center; gap:8px; flex:0 1 auto; min-width:0 }
.logo-box { display:flex; align-items:center; font-size:16px; font-weight:900; letter-spacing:-.5px; border-radius:8px; overflow:hidden; box-shadow:var(--shadow-sm) }
.logo-d { background:#FF6600; color:#fff; padding:6px 5px 6px 9px }
.logo-i { background:#fff; color:#38bdf8; padding:6px 4px; border-top:3px solid #FF6600; border-bottom:3px solid #138808 }
.logo-p { background:#138808; color:#fff; padding:6px 9px 6px 5px }
.logo-box.sm .logo-d,.logo-box.sm .logo-i,.logo-box.sm .logo-p { font-size:13px; padding:4px 4px }
.logo-box.sm .logo-d { padding-left:7px } .logo-box.sm .logo-p { padding-right:7px }
.logo-text { display:flex; flex-direction:column; min-width:0 }
.logo-name { max-width:170px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:15px; font-weight:800; color:var(--navy); line-height:1.2 }
.logo-tagline { max-width:170px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:9px; color:var(--gray-600); font-weight:500 }
.site-logo img,.site-logo-img { width:var(--site-logo-width,148px); height:var(--site-logo-height,44px); max-width:none; object-fit:fill; flex-shrink:0 }
.header-category-menu { position:relative; flex:0 0 0; width:0; opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-6px); transition:opacity .2s ease, transform .2s ease, visibility .2s ease, width .2s ease, flex-basis .2s ease }
.main-header.search-docked .header-category-menu { flex:0 0 auto; width:auto; opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0) }
.header-category-btn { height:38px; display:flex; align-items:center; gap:8px; border:1.5px solid var(--gray-200); background:#fff; color:var(--gray-800); border-radius:9px; padding:0 14px; font-size:12.5px; font-weight:900; cursor:pointer; box-shadow:0 4px 14px rgba(2,6,23,.06); white-space:nowrap }
.header-category-btn i:first-child { color:var(--primary) }
.header-category-btn:hover { border-color:rgba(255,106,0,.35); color:var(--primary-d) }
.header-category-dropdown { position:absolute; left:0; top:calc(100% + 10px); width:min(980px,calc(100vw - 32px)); height:min(620px,calc(100vh - 130px)); display:grid; grid-template-columns:300px 1fr; gap:0; background:#fff; border:1px solid var(--gray-200); border-radius:14px; box-shadow:0 22px 64px rgba(15,23,42,.22); opacity:0; visibility:hidden; transform:translateY(8px); pointer-events:none; transition:var(--transition); z-index:500; overflow:hidden }
.header-category-menu:hover .header-category-dropdown,.header-category-menu:focus-within .header-category-dropdown { opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto }
.header-category-sidebar { overflow:auto; border-right:1px solid var(--gray-200); background:#fbfcfe; padding:10px }
.header-category-link { display:flex; align-items:center; gap:12px; padding:11px 12px; border-radius:9px; color:var(--gray-800); font-size:13px; font-weight:800; transition:var(--transition) }
.header-category-link i { width:20px; color:#334155; text-align:center }
.header-category-link:hover,.header-category-link.active { background:#fff4ec; color:var(--primary-d); box-shadow:inset 3px 0 0 var(--primary) }
.header-category-link:hover i,.header-category-link.active i { color:var(--primary) }
.header-category-panels { overflow:auto; padding:20px }
.header-category-panel { display:none }
.header-category-panel.active { display:block }
.header-category-panel-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:16px }
.header-category-panel-head h3 { font-size:20px; line-height:1.2; color:var(--gray-800); font-weight:900 }
.header-category-panel-head a { color:var(--primary); display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:900; white-space:nowrap }
.header-subcategory-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px }
.header-subcategory-grid a { display:flex; flex-direction:column; align-items:center; gap:8px; min-height:126px; padding:12px 8px; border:1px solid #edf1f5; border-radius:12px; color:var(--gray-800); background:#fff; text-align:center; font-size:12px; font-weight:800; transition:var(--transition) }
.header-subcategory-grid a:hover { transform:translateY(-3px); border-color:rgba(255,106,0,.28); box-shadow:0 12px 26px rgba(15,23,42,.09); color:var(--primary-d) }
.header-subcategory-grid span { width:72px; height:72px; border-radius:10px; background:#f6f6f7 center/cover no-repeat; display:block }
.header-subcategory-grid i { width:72px; height:72px; border-radius:10px; background:#f8fafc; color:var(--primary); display:flex; align-items:center; justify-content:center; font-size:22px }
.brand-header-search { flex:0 1 0; max-width:0; min-width:0; display:flex; align-items:stretch; height:38px; margin-left:0; border:1.5px solid transparent; border-radius:9px; overflow:hidden; background:linear-gradient(#fff,#fff) padding-box, linear-gradient(135deg,var(--primary),var(--navy)) border-box; box-shadow:0 4px 16px rgba(2,6,23,.08); opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-6px); transition:opacity .2s ease, transform .2s ease, visibility .2s ease, max-width .2s ease, flex-basis .2s ease }
.main-header.search-docked .brand-header-search { flex:1 1 420px; max-width:680px; min-width:260px; margin-left:auto; opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0) }
.brand-header-search select { width:132px; border:none; border-right:1px solid var(--gray-200); background:#f8fafc; color:var(--gray-700); padding:0 10px; outline:none; font-size:12px; cursor:pointer }
.brand-header-search input { min-width:0; flex:1; border:none; outline:none; padding:0 12px; font-size:12.5px; color:var(--gray-800) }
.brand-header-search input::placeholder { color:#a3acba }
.brand-header-search button { border:none; background:linear-gradient(135deg,var(--primary),var(--primary-d)); color:#fff; padding:0 15px; font-size:12px; font-weight:800; display:flex; align-items:center; gap:6px; cursor:pointer; white-space:nowrap }
.brand-header-search button:hover { filter:brightness(1.08) }
.header-greeting { display:flex; align-items:center; gap:6px; color:var(--gray-700); background:#f8fafc; border:1px solid var(--gray-200); border-radius:999px; padding:7px 11px; font-size:12px; font-weight:800; white-space:nowrap; flex-shrink:0 }
.header-greeting i { color:var(--primary); font-size:12px }
.header-actions { display:flex; gap:8px; flex-shrink:0; margin-left:auto }
.main-header.search-docked .header-actions { margin-left:0 }
.ha-consultation,.ha-blog,.ha-why,.ha-post-req,.ha-advertise,.ha-list-free { display:flex; flex-direction:column; align-items:center; gap:1px; padding:4px 10px; border-radius:var(--radius-sm); font-size:10px; font-weight:700; transition:var(--transition); white-space:nowrap; line-height:1.18 }
.ha-consultation { background:linear-gradient(135deg,var(--primary),var(--primary-d)); color:#fff; box-shadow:0 4px 12px rgba(255,106,0,.24) }
.ha-consultation:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(255,106,0,.34); color:#fff }
.ha-blog,.ha-why { background:#fff; color:var(--navy); border:1px solid rgba(0,48,135,.18); box-shadow:0 4px 12px rgba(2,6,23,.06) }
.ha-blog:hover,.ha-why:hover { transform:translateY(-2px); border-color:rgba(0,48,135,.32); box-shadow:0 6px 18px rgba(2,6,23,.1); color:var(--navy) }
.ha-post-req { background:linear-gradient(135deg,var(--navy),var(--navy-l)); color:#fff; box-shadow:0 4px 12px rgba(56,189,248,.25) }
.ha-post-req:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(56,189,248,.35); color:#fff }
.ha-advertise { background:#0f172a; color:#fff; border:1px solid rgba(15,23,42,.12); box-shadow:0 4px 12px rgba(15,23,42,.18) }
.ha-advertise:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(15,23,42,.24); color:#fff }
.ha-list-free { position:relative; display:flex; flex-direction:row; align-items:center; justify-content:center; min-height:28px; margin-top:4px; padding:4px 9px 4px 10px; background:#f8fafc; color:#111827; border:1px solid #e5e7eb; border-radius:3px; box-shadow:none; font-size:12px; font-weight:600; letter-spacing:0 }
.ha-list-free b { position:absolute; left:8px; top:-11px; background:#ef1d2f; color:#fff; padding:2px 5px; border-radius:1px; font-size:10px; line-height:1; font-weight:900; letter-spacing:.2px }
.ha-list-free span { display:flex; align-items:center; gap:6px }
.ha-list-free:hover { transform:translateY(-1px); border-color:#cbd5e1; box-shadow:0 6px 16px rgba(15,23,42,.1); color:#111827 }
.ha-list-free i { color:#111827; font-size:14px }
.ha-consultation i,.ha-blog i,.ha-why i,.ha-post-req i,.ha-advertise i { font-size:14px }
.mob-menu-btn { display:none; background:none; border:2px solid var(--gray-200); padding:8px 10px; border-radius:var(--radius-sm); cursor:pointer; color:var(--gray-700); margin-left:auto; border-radius:var(--radius-sm) }
.mobile-header-support-btn,.mobile-home-consultation-fixed,.mobile-menu-overlay,.mobile-menu-drawer { display:none }

/* ── CAT NAVBAR ──────────────────────────────────────────── */
.cat-navbar { background:linear-gradient(135deg,var(--navy),var(--navy-2)); position:relative; z-index:120; overflow:visible }
.cat-navbar-inner { display:flex; align-items:center; flex-wrap:nowrap; min-height:46px; overflow:visible }
.cat-scroll-viewport { flex:1 1 auto; min-width:0; overflow:visible }
.cat-scroll-track { display:flex; align-items:center; flex-wrap:nowrap; width:auto; min-width:0; overflow:visible }
.cni-item { padding:13px 15px; font-size:12.5px; font-weight:500; color:rgba(255,255,255,.78); transition:var(--transition); display:flex; align-items:center; gap:6px; white-space:nowrap; position:relative }
.cni-item::after { content:''; position:absolute; bottom:0; left:50%; right:50%; height:2px; background:var(--primary); transition:var(--transition); border-radius:2px 2px 0 0 }
.cni-item:hover::after,.cni-item.active::after { left:8px; right:8px }
.cni-item:hover,.cni-item.active { color:#fff }
.cni-fixed { flex:0 0 auto; z-index:2 }
.cni-home { background:linear-gradient(135deg,var(--navy),var(--navy-2)) }
.cni-highlight { background:linear-gradient(135deg,var(--primary),var(--primary-d)) !important; color:#fff !important; font-weight:700; margin-left:auto; border-radius:0 }
.cat-navbar-inner > .cni-highlight { margin-left:0 }
.cat-scroll-track .cni-highlight { margin-left:0 }
.cni-highlight:hover { filter:brightness(1.1) }
.cni-highlight::after { display:none }
.cni-mobile-toggle { display:none; background:none; border:none; color:#fff; font-size:13px; padding:13px 16px; cursor:pointer; margin-left:auto; align-items:center; gap:6px }
.cni-dropdown { position:relative; flex:0 0 auto }
.cni-submenu { position:absolute; left:0; top:100%; width:min(760px,calc(100vw - 48px)); background:#fff; color:#111827; border:1px solid var(--gray-200); border-radius:0 0 14px 14px; box-shadow:0 18px 48px rgba(15,23,42,.18); padding:18px; opacity:0; visibility:hidden; transform:translateY(8px); transition:var(--transition); pointer-events:none; z-index:200 }
.cni-dropdown:hover .cni-submenu,.cni-dropdown:focus-within .cni-submenu { opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto }
.cni-submenu-title { font-size:15px; font-weight:900; margin-bottom:12px; color:var(--gray-800) }
.cni-submenu-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px }
.cni-submenu-grid a { display:flex; align-items:center; gap:10px; min-width:0; padding:9px; border:1px solid #edf1f5; border-radius:10px; color:var(--gray-700); font-size:12px; font-weight:800; transition:var(--transition); background:#fff }
.cni-submenu-grid a:hover { background:var(--primary-l); color:var(--primary-d); border-color:rgba(255,106,0,.25); transform:translateY(-2px) }
.cni-submenu-grid span { width:38px; height:38px; border-radius:50%; background:#f6f6f7 center/cover no-repeat; flex:0 0 auto }
.cni-submenu-grid i { width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#f8fafc; color:var(--primary); flex:0 0 auto }
@keyframes catAutoScroll {
  from { transform:translateX(0) }
  to { transform:translateX(-50%) }
}

/* ── HERO SLIDER ─────────────────────────────────────────── */
.hero-slider { position:relative; overflow:hidden; max-height:var(--hero-h); background:#001248 }
.slider-track { display:flex; transition:transform .7s cubic-bezier(.4,0,.2,1); will-change:transform }
.slide { min-width:100%; position:relative; max-height:var(--hero-h); overflow:hidden }
.slide img { width:100%; height:var(--hero-h); object-fit:cover; object-position:center }
.slide video { width:100%; height:var(--hero-h); object-fit:cover }
.slide-overlay { position:absolute; inset:0; background:linear-gradient(120deg,rgba(0,18,72,.78) 0%,rgba(0,0,0,.2) 60%,transparent 100%); display:flex; align-items:center; padding:48px 72px 120px }
.slide-content { max-width:620px; color:#fff }
.slide-content h2 { font-size:clamp(1.6rem,4.5vw,3rem); font-weight:900; line-height:1.15; margin-bottom:14px; text-shadow:0 4px 20px rgba(0,0,0,.4) }
.slide-content p { font-size:clamp(.9rem,2vw,1.15rem); opacity:.88; margin-bottom:28px; text-shadow:0 2px 8px rgba(0,0,0,.3) }
.slide-btn { display:inline-flex; align-items:center; gap:8px; background:linear-gradient(135deg,var(--primary),var(--primary-d)); color:#fff; padding:14px 32px; border-radius:var(--radius-xl); font-weight:700; font-size:14px; box-shadow:0 4px 20px var(--primary-glow); transition:var(--transition) }
.slide-btn:hover { transform:translateY(-2px) scale(1.02); box-shadow:0 8px 32px var(--primary-glow); color:#fff }
.hero-slider .slide-overlay { padding-bottom:48px; background:linear-gradient(90deg,rgba(241,239,255,.96) 0%,rgba(241,239,255,.82) 36%,rgba(241,239,255,0) 66%) }
.hero-slider .slide-content { max-width:520px; color:#11145d }
.hero-slider .slide-content .slide-kicker { display:block; margin:0 0 8px; color:#5148cc; font-size:clamp(1rem,1.7vw,1.35rem); font-weight:500; opacity:1; text-shadow:none }
.hero-slider .slide-content h2 { max-width:430px; margin:0 0 24px; color:#11145d; font-size:clamp(2rem,3.4vw,3rem); font-weight:500; line-height:1.08; letter-spacing:-.7px; text-shadow:none }
.hero-slider .slide-btn { padding:15px 25px; border-radius:12px; background:#050505; color:#fff; font-size:18px; font-weight:500; box-shadow:none }
.hero-slider .slide-btn:hover { background:#191919; box-shadow:0 10px 24px rgba(0,0,0,.18) }
@media(max-width:768px) {
  .hero-slider .slide-overlay { padding:16px 18px 34px; background:linear-gradient(90deg,rgba(241,239,255,.97),rgba(241,239,255,.8) 58%,rgba(241,239,255,.08)) }
  .hero-slider .slide-content .slide-kicker { display:block; margin-bottom:5px; font-size:12px }
  .hero-slider .slide-content h2 { max-width:220px; margin-bottom:14px; font-size:23px; line-height:1.08 }
  .hero-slider .slide-btn { padding:10px 15px; border-radius:9px; font-size:13px }
}
.hero-search-overlay { position:absolute; left:50%; bottom:52px; width:min(760px,calc(100% - 144px)); transform:translateX(-50%); z-index:12 }
.hero-search-overlay .hero-search-box { width:100%; max-width:none; background:#fff }
.slider-btn { position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.15); backdrop-filter:blur(12px); border:1px solid rgba(255,255,255,.25); color:#fff; width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:var(--transition); z-index:10; font-size:16px }
.slider-btn:hover { background:var(--primary); border-color:var(--primary); transform:translateY(-50%) scale(1.1) }
.slider-btn.prev { left:20px } .slider-btn.next { right:20px }
.slider-dots { position:absolute; bottom:20px; left:50%; transform:translateX(-50%); display:flex; gap:8px; z-index:10 }
.dot { width:10px; height:10px; border-radius:50%; background:rgba(255,255,255,.35); border:2px solid rgba(255,255,255,.5); cursor:pointer; transition:var(--transition) }
.dot.active { background:#fff; transform:scale(1.3); box-shadow:0 0 8px rgba(255,255,255,.6) }
.home-hero-shell { position:relative; overflow:hidden; background:#001248 }
.home-business-cta { padding:18px 0; background:#f8fafc }
.home-business-cta-mobile { display:none }
.home-business-cta-shell { padding:20px; border:1px solid #e2e8f0; border-radius:18px; background:linear-gradient(135deg,#fff,#f8fafc); box-shadow:0 12px 32px rgba(15,23,42,.07) }
.home-business-cta-shell h2 { margin:0 0 16px; display:flex; align-items:center; justify-content:center; gap:10px; color:#0f172a; font-size:clamp(1.15rem,2vw,1.55rem); font-weight:950 }
.home-business-cta-shell h2 i { color:#8b5cf6; font-size:.9em }
.home-business-cta-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px }
.home-business-cta-card { min-width:0; padding:20px; border:1px solid #ddd6fe; border-radius:15px; background:#faf8ff }
.home-business-cta-card.seller { border-color:#a7f3d0; background:#f0fdf9 }
.home-business-cta-card.consultation { border-color:#fdba74; background:linear-gradient(135deg,#fff7ed,#fffbeb); box-shadow:0 10px 25px rgba(234,88,12,.1) }
.home-business-cta-card h3 { margin:0 0 5px; color:#6d28d9; font-size:17px; font-weight:900 }
.home-business-cta-card.seller h3 { color:#047857 }
.home-business-cta-card.consultation h3 { color:#c2410c }
.home-business-cta-card p { margin:0 0 14px; color:#64748b; font-size:13px }
.home-business-cta-card a { min-height:44px; display:flex; align-items:center; justify-content:center; gap:8px; border:1px solid #8b5cf6; border-radius:11px; background:#fff; color:#6d28d9; font-size:13px; font-weight:900; transition:var(--transition) }
.home-business-cta-card.seller a { border-color:#10b981; background:#10b981; color:#fff }
.home-business-cta-card.consultation a { border-color:#f97316; background:linear-gradient(135deg,#f97316,#ea580c); color:#fff; box-shadow:0 7px 18px rgba(234,88,12,.2) }
.home-business-cta-card a:hover { transform:translateY(-2px); box-shadow:0 9px 20px rgba(109,40,217,.14) }
.home-business-cta-card.seller a:hover { background:#059669; border-color:#059669; box-shadow:0 9px 20px rgba(5,150,105,.16) }
.home-business-cta-card.consultation a:hover { box-shadow:0 10px 24px rgba(234,88,12,.28) }
.home-search-band { background:transparent; border-bottom:0; padding:0; position:fixed; left:0; right:0; top:var(--home-search-top,154px); z-index:98; box-shadow:none; pointer-events:none }
.home-search-closed .home-search-band { display:none }
.home-hero-half-scrolled .hero-bottom-nav { display:none }
.home-top-search-wrap { display:flex; align-items:center; justify-content:center; gap:10px; pointer-events:auto }
.home-top-search { max-width:920px; box-shadow:0 10px 30px rgba(15,23,42,.12); border:1px solid rgba(226,232,240,.95); border-radius:12px; flex:1 1 920px }
.home-search-close,
.header-search-toggle { border:0; cursor:pointer; align-items:center; justify-content:center; transition:var(--transition) }
.home-search-close { width:42px; height:42px; border-radius:50%; background:rgba(255,255,255,.94); color:var(--gray-600); border:1px solid rgba(226,232,240,.9); box-shadow:0 8px 22px rgba(15,23,42,.18) }
.home-search-close:hover { color:var(--primary); border-color:rgba(255,106,0,.35); transform:translateY(-1px) }
.header-search-toggle { display:none; width:42px; height:42px; border-radius:12px; background:var(--primary); color:#fff; box-shadow:0 8px 20px rgba(255,106,0,.22); flex-shrink:0 }
.header-search-toggle:hover { background:var(--primary-d); transform:translateY(-1px) }
.home-search-closed .header-search-toggle,
.home-search-scrolled .header-search-toggle { display:flex }
.home-promo-strip { position:fixed; left:0; right:0; bottom:14px; z-index:520; background:transparent; padding:0; border-bottom:0; pointer-events:none; transition:opacity .24s ease, transform .24s ease, visibility .24s ease }
.home-promo-strip.is-hidden { opacity:0; visibility:hidden; transform:translateY(calc(100% + 22px)); pointer-events:none }
.home-below-hero-banners { padding:14px 0 8px; background:#fff }
.home-below-hero-banners .home-promo-row { padding-right:2px }
.home-below-hero-banners .home-promo-card { box-shadow:0 10px 24px rgba(15,23,42,.12); pointer-events:auto }
.home-promo-row { display:grid; grid-template-columns:minmax(300px,1.35fr) repeat(4,minmax(140px,.72fr)); gap:10px; overflow-x:auto; scrollbar-width:none; padding:2px 44px 2px 0; align-items:stretch }
.home-promo-row::-webkit-scrollbar { display:none }
.home-promo-close { position:absolute; right:max(14px,var(--edge-pad)); top:50%; z-index:8; width:30px; height:30px; border:0; border-radius:999px; background:rgba(15,23,42,.9); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; pointer-events:auto; box-shadow:0 8px 24px rgba(2,6,23,.28); transform:translateY(-50%); transition:var(--transition) }
.home-promo-close:hover { background:var(--primary); transform:translateY(-50%) scale(1.06) }
.home-promo-card { position:relative; height:clamp(86px,7.2vw,112px); min-height:0; border-radius:8px; overflow:hidden; background:rgba(226,232,240,.78); box-shadow:0 14px 34px rgba(2,6,23,.26); color:#fff; isolation:isolate; pointer-events:auto }
.home-promo-card:not(.featured) { min-width:158px }
.home-promo-media-stack,.home-promo-media { position:absolute; inset:0; display:block }
.home-promo-media { opacity:0; transition:opacity .45s ease; z-index:0 }
.home-promo-media.active { opacity:1; z-index:1 }
.home-promo-card img,.home-promo-card video,.home-promo-card iframe { width:100%; height:100%; min-height:0; object-fit:cover; display:block; border:0 }
.home-promo-media.youtube-card iframe { position:absolute; inset:-12% -12%; width:124%; height:124%; min-height:0; pointer-events:none }
.home-promo-media.youtube-card::after { content:''; position:absolute; inset:0; z-index:1; pointer-events:none }
.home-promo-gallery-nav { position:absolute; top:50%; transform:translateY(-50%); z-index:4; width:28px; height:38px; border:0; border-radius:999px; background:rgba(15,23,42,.52); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; opacity:.92; transition:var(--transition) }
.home-promo-gallery-nav:hover { background:var(--primary); transform:translateY(-50%) scale(1.04) }
.home-promo-gallery-nav.prev { left:8px }
.home-promo-gallery-nav.next { right:8px }
.home-promo-gallery-dots { position:absolute; left:50%; bottom:8px; transform:translateX(-50%); z-index:4; display:flex; gap:5px; align-items:center; justify-content:center; padding:4px 7px; border-radius:999px; background:rgba(15,23,42,.42) }
.home-promo-gallery-dots i { display:block; width:7px; height:7px; border-radius:999px; background:rgba(255,255,255,.58); transition:var(--transition) }
.home-promo-gallery-dots i.active { width:18px; background:#fff }
.home-promo-copy { position:absolute; inset:0; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; gap:5px; padding:14px 16px; background:linear-gradient(90deg,rgba(2,6,23,.5),rgba(2,6,23,.04) 68%); z-index:1 }
.home-promo-copy strong { font-size:clamp(.92rem,1.55vw,1.35rem); line-height:1.05; font-weight:700; text-shadow:0 3px 12px rgba(0,0,0,.35) }
.home-promo-card:not(.featured) .home-promo-copy strong { font-size:.92rem }
.home-promo-copy small { color:rgba(255,255,255,.94); font-weight:500; font-size:clamp(.72rem,.92vw,.86rem); line-height:1.25; max-width:12rem }
.home-promo-copy em { margin-top:auto; display:inline-flex; background:var(--primary); color:#fff; border-radius:6px; padding:5px 10px; font-style:normal; font-weight:600; font-size:11px }
.home-hero-shell.has-promo .slider-dots { bottom:20px }
.home-custom-banner-section { padding:14px 0; background:#fff }
.home-custom-banner-row { display:flex; gap:12px; align-items:stretch; overflow-x:auto; padding:2px 4px 8px; scrollbar-width:none }
.home-custom-banner-row::-webkit-scrollbar { display:none }
.home-custom-banner { --custom-banner-width:min(100%, 1180px); --custom-banner-height:170px; --custom-banner-mobile-height:120px; position:relative; flex:0 0 var(--custom-banner-width); max-width:100%; height:var(--custom-banner-height); border-radius:8px; overflow:hidden; background:#e2e8f0; color:#fff; text-decoration:none; box-shadow:0 10px 28px rgba(15,23,42,.13); isolation:isolate }
.home-custom-banner.full-bleed { flex-basis:100vw; width:100vw; max-width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); border-radius:0; box-shadow:none }
.home-custom-banner img,.home-custom-banner video,.home-custom-banner iframe { width:100%; height:100%; min-height:0; object-fit:cover; display:block; border:0 }
.home-custom-banner .home-promo-copy { background:linear-gradient(90deg,rgba(2,6,23,.52),rgba(2,6,23,.05) 70%) }

@media (max-width: 768px) {
  .home-promo-strip { bottom:10px }
  .home-promo-row { display:flex; gap:8px; padding-right:40px }
  .home-promo-card { flex:0 0 min(78vw,340px); height:86px }
  .home-promo-card.featured { flex-basis:min(84vw,380px) }
  .home-promo-copy { padding:12px }
  .home-promo-copy em { display:none }
  .home-promo-close { right:10px; top:50%; width:28px; height:28px }
  .home-custom-banner-section { padding:8px 0 }
  .home-custom-banner-row { gap:8px; padding-bottom:4px }
  .home-custom-banner { flex-basis:min(100%, calc(100vw - 24px)); height:var(--custom-banner-mobile-height) }
  .home-custom-banner.full-bleed { flex-basis:100vw; width:100vw; max-width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); border-radius:0 }
}

/* Plans */
.plans-hero { background:linear-gradient(135deg,#0f172a 0%,#0369a1 62%,#ff6a00 100%); color:#fff; padding:clamp(34px,6vw,70px) 0; overflow:hidden }
.plans-hero-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr); gap:28px; align-items:center }
.plans-kicker { display:inline-flex; align-items:center; gap:8px; padding:7px 12px; border:1px solid rgba(255,255,255,.2); border-radius:999px; background:rgba(255,255,255,.08); font-size:12px; font-weight:900; margin-bottom:16px }
.plans-hero h1 { font-size:clamp(1.75rem,4.6vw,3.2rem); line-height:1.08; font-weight:950; max-width:820px; margin-bottom:14px }
.plans-hero p { max-width:700px; color:rgba(255,255,255,.82); font-size:clamp(.95rem,1.8vw,1.12rem) }
.plans-hero-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:22px }
.btn-outline-white { background:rgba(255,255,255,.08); color:#fff; border:1px solid rgba(255,255,255,.32) }
.btn-outline-white:hover { background:rgba(255,255,255,.16); color:#fff }
.plans-hero-points { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px }
.plans-hero-points span { display:inline-flex; align-items:center; gap:7px; color:rgba(255,255,255,.86); background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.16); border-radius:999px; padding:7px 10px; font-size:12px; font-weight:800 }
.plans-hero-panel { display:grid; gap:12px; border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.1); backdrop-filter:blur(12px); border-radius:8px; padding:22px; box-shadow:0 18px 48px rgba(2,6,23,.25) }
.plans-hero-panel p { color:rgba(255,255,255,.78); font-size:13px; margin-top:4px }
.plans-hero-stat { display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid rgba(255,255,255,.14); padding-bottom:11px }
.plans-hero-stat strong { display:block; font-size:30px; line-height:1; font-weight:950 }
.plans-hero-stat span { display:block; color:rgba(255,255,255,.8); font-size:13px; text-align:right }
.plans-section-head { margin-bottom:18px }
.plans-section-head span { display:inline-block; color:var(--primary); font-size:11px; font-weight:950; letter-spacing:.6px; text-transform:uppercase; margin-bottom:6px }
.plans-section-head h2 { color:var(--gray-800); font-size:clamp(1.35rem,2.5vw,2rem); line-height:1.18; font-weight:950 }
.plans-section-head-inline { margin-top:28px }
.plans-section-head.compact h2 { font-size:1.3rem }
.plans-goal-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:24px }
.plans-goal { background:#fff; border:1px solid var(--gray-200); border-radius:8px; padding:18px; box-shadow:var(--shadow-xs) }
.plans-goal i { width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center; background:#ecfeff; color:#0891b2; border-radius:8px; margin-bottom:14px }
.plans-goal strong { display:block; color:var(--gray-800); font-size:16px; margin-bottom:6px }
.plans-goal span { display:block; color:var(--gray-600); font-size:13px; line-height:1.55 }
.plans-business-strip { display:flex; align-items:center; justify-content:space-between; gap:14px; border:1px solid var(--gray-200); background:#fff; border-radius:8px; padding:16px 18px; box-shadow:var(--shadow-xs); margin-bottom:22px }
.plans-business-strip strong { display:block; color:var(--gray-800); font-size:16px }
.plans-business-strip span { display:block; color:var(--gray-600); font-size:13px; margin-top:2px }
.plans-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; align-items:stretch }
.plan-card { position:relative; display:flex; flex-direction:column; min-width:0; background:#fff; border:1px solid var(--gray-200); border-radius:8px; padding:22px; box-shadow:var(--shadow-sm); overflow:hidden }
.plan-card.featured { border-color:rgba(255,106,0,.45); box-shadow:0 16px 38px rgba(255,106,0,.15) }
.plan-ribbon { position:absolute; top:14px; right:14px; background:var(--primary); color:#fff; border-radius:999px; padding:4px 9px; font-size:10px; font-weight:950; text-transform:uppercase }
.plan-icon { width:42px; height:42px; display:flex; align-items:center; justify-content:center; border-radius:8px; background:#eff6ff; color:#0369a1; font-size:18px; margin-bottom:14px }
.plan-card.featured .plan-icon { background:#fff3ec; color:var(--primary) }
.plan-card h2 { font-size:22px; font-weight:950; line-height:1.15; margin-bottom:8px; color:var(--gray-800) }
.plan-card p { color:var(--gray-600); font-size:13px; min-height:42px; margin-bottom:14px }
.plan-price { font-size:28px; font-weight:950; color:#0f172a; line-height:1; margin-bottom:16px }
.plan-price span { font-size:12px; color:var(--gray-500); font-weight:800 }
.plan-card ul { display:flex; flex-direction:column; gap:9px; margin-bottom:18px; flex:1 }
.plan-card li { display:flex; align-items:flex-start; gap:8px; color:var(--gray-700); font-size:13px; line-height:1.35 }
.plan-card li i { color:#16a34a; margin-top:2px }
.plans-note { display:flex; align-items:flex-start; gap:10px; background:#fff7ed; border:1px solid #fed7aa; color:#9a3412; border-radius:8px; padding:13px 15px; margin:18px 0 26px; font-size:13px; line-height:1.45 }
.plans-note i { margin-top:2px }
.plans-detail-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr); gap:18px; margin-top:10px }
.plans-detail-panel { background:#fff; border:1px solid var(--gray-200); border-radius:8px; padding:22px; box-shadow:var(--shadow-xs) }
.plans-steps { display:grid; gap:12px; counter-reset:plan-step }
.plans-steps li { position:relative; list-style:none; padding-left:42px; min-height:32px }
.plans-steps li::before { counter-increment:plan-step; content:counter(plan-step); position:absolute; left:0; top:0; width:28px; height:28px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--navy); color:#fff; font-size:12px; font-weight:900 }
.plans-steps strong { display:block; color:var(--gray-800); font-size:14px }
.plans-steps span { display:block; color:var(--gray-600); font-size:13px; line-height:1.45; margin-top:2px }
.plans-compare { display:grid; gap:10px }
.plans-compare div { border:1px solid var(--gray-200); border-radius:8px; padding:12px 14px; background:#f8fafc }
.plans-compare strong { display:block; color:var(--gray-800); font-size:14px; margin-bottom:3px }
.plans-compare span { display:block; color:var(--gray-600); font-size:13px; line-height:1.45 }
.plans-faq-section { margin-top:28px }
.plans-faq-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px }
.plans-faq-grid details { background:#fff; border:1px solid var(--gray-200); border-radius:8px; padding:14px 16px; box-shadow:var(--shadow-xs) }
.plans-faq-grid summary { cursor:pointer; color:var(--gray-800); font-weight:900; font-size:14px }
.plans-faq-grid p { color:var(--gray-600); font-size:13px; line-height:1.5; margin-top:10px }
.plan-form { display:flex; flex-direction:column; gap:10px }
.dash-plan-panel { border:1px solid var(--gray-200); background:#fff; border-radius:8px; padding:18px; box-shadow:var(--shadow-xs); margin-bottom:28px }
.dash-plan-head { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:14px }
.dash-plan-head h2 { font-size:18px; line-height:1.2; color:var(--gray-800) }
.dash-plan-head p { color:var(--gray-600); font-size:13px }
.dash-plan-list { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px }
.dash-plan-mini { border:1px solid var(--gray-200); border-radius:8px; padding:13px; background:#fbfdff }
.dash-plan-mini strong { display:block; font-size:14px; color:var(--gray-800) }
.dash-plan-mini span { display:block; color:var(--gray-600); font-size:12px; margin-top:2px }

/* Default hero fallback */
.hero-default { background:linear-gradient(135deg,#0369a1,var(--navy-2) 40%,#38bdf8 100%); color:#fff; padding:clamp(48px,9vw,96px) 0; text-align:center; position:relative; overflow:hidden }
.hero-default::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 80% 60% at 50% 50%,rgba(255,106,0,.12),transparent); pointer-events:none }
.hero-default h1 { font-size:clamp(1.8rem,5.5vw,3.4rem); font-weight:900; margin-bottom:16px; line-height:1.1 }
.hero-default p { font-size:clamp(.95rem,2vw,1.25rem); opacity:.82; max-width:640px; margin:0 auto 36px }
.hero-search-box { display:flex; align-items:stretch; border-radius:var(--radius-xl); overflow:hidden; box-shadow:0 10px 30px rgba(15,23,42,.14); max-width:740px; margin:0 auto; background:rgba(255,255,255,.38); border:1px solid rgba(255,255,255,.48); backdrop-filter:blur(10px) }
.hero-search-box select { border:none; padding:0 16px; font-size:14px; background:transparent; cursor:pointer; outline:none; min-width:140px; font-weight:500 }
.hero-search-box input { flex:1; border:none; padding:13px 18px; font-size:15px; outline:none; background:transparent }
.hero-search-box button { background:rgba(168,132,247,.86); color:#fff; border:none; padding:0 26px; font-weight:700; cursor:pointer; font-size:14px; display:flex; align-items:center; gap:8px; transition:var(--transition) }
.hero-search-box button:hover { filter:brightness(1.1) }
.hero-bottom-nav { background:rgba(255,255,255,.72) !important; border-bottom:1px solid rgba(226,232,240,.7); box-shadow:none; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); position:fixed; left:0; right:0; top:var(--home-category-top,100px); z-index:97 }
.hero-bottom-nav > .container { max-width:none; width:100%; padding:0 var(--edge-pad); background:transparent }
.hero-bottom-inner { min-height:36px; display:flex; align-items:center; gap:12px; position:relative }
.hero-all-category { position:relative; flex:0 0 auto }
.hero-all-btn { height:28px; display:flex; align-items:center; gap:8px; border:1px solid rgba(203,213,225,.9); background:#fff !important; color:#111827; border-radius:10px; padding:0 12px; font-size:12.5px; font-weight:500; cursor:pointer; white-space:nowrap; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none }
.hero-all-btn i:first-child { color:var(--primary) }
.hero-all-btn:hover,.hero-all-category.open .hero-all-btn { color:var(--primary-d); border-color:rgba(255,106,0,.35); background:#fff; box-shadow:none }
.hero-category-dropdown { position:absolute; top:100%; left:0; width:min(1040px,calc(100vw - 32px)); height:min(460px,calc(100vh - 190px)); display:grid; grid-template-columns:292px 1fr; background:#fff; border:1px solid rgba(226,232,240,.95); border-radius:14px; overflow:hidden; box-shadow:0 24px 70px rgba(15,23,42,.18); opacity:0; visibility:hidden; transform:translateY(8px); pointer-events:none; transition:var(--transition); z-index:520 }
.hero-all-category:hover .hero-category-dropdown,.hero-all-category.open .hero-category-dropdown { opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto }
.hero-category-sidebar { overflow:auto; background:#f8fafc; border-right:1px solid rgba(226,232,240,.9); padding:10px }
.hero-category-link { display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:10px; color:#0f172a; font-size:13px; font-weight:800; transition:var(--transition) }
.hero-category-link i { width:20px; text-align:center; color:#334155 }
.hero-category-link:hover,.hero-category-link.active { background:#fff4ec; color:var(--primary-d); box-shadow:inset 3px 0 0 var(--primary) }
.hero-category-link:hover i,.hero-category-link.active i { color:var(--primary) }
.hero-category-panels { overflow:auto; padding:18px 20px }
.hero-category-panel { display:none }
.hero-category-panel.active { display:block }
.hero-category-panel-head { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:16px }
.hero-category-panel-head h3 { color:var(--gray-800); font-size:20px; font-weight:900; line-height:1.2 }
.hero-category-panel-head a { color:var(--primary); font-size:12px; font-weight:900; display:inline-flex; align-items:center; gap:6px; white-space:nowrap }
.hero-subcategory-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px }
.hero-subcategory-grid a { min-height:126px; border:1px solid #edf1f5; border-radius:12px; padding:12px 8px; display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; color:var(--gray-800); font-size:12px; font-weight:800; transition:var(--transition) }
.hero-subcategory-grid a:hover { transform:translateY(-3px); border-color:rgba(255,106,0,.28); box-shadow:0 12px 26px rgba(15,23,42,.09); color:var(--primary-d) }
.hero-subcategory-grid span { width:72px; height:72px; border-radius:50%; display:block; background:#f6f6f7 center/cover no-repeat }
.hero-subcategory-grid i { width:72px; height:72px; border-radius:50%; background:#f8fafc; color:var(--primary); display:flex; align-items:center; justify-content:center; font-size:22px }
.hero-popular-line { flex:1; min-width:0; display:flex; align-items:center; gap:8px; overflow:auto; scrollbar-width:none; padding:2px 0 }
.hero-popular-line::-webkit-scrollbar { display:none }
.hero-popular-line > span { flex:0 0 auto; color:#64748b; font-size:11.5px; font-weight:500; text-transform:uppercase; letter-spacing:.35px; margin-right:2px }
.hero-popular-line a { flex:0 0 auto; display:flex; align-items:center; gap:6px; min-height:28px; padding:4px 10px; border-radius:999px; background:#fff !important; color:#475569; border:1px solid rgba(203,213,225,.9); font-size:11.5px; font-weight:400; transition:var(--transition); white-space:nowrap; backdrop-filter:none; -webkit-backdrop-filter:none }
.hero-popular-line a:hover,.hero-popular-line a.active { background:#fff; color:var(--primary-d); border-color:rgba(255,106,0,.28); box-shadow:none }
.hero-consultation-btn {
  flex:0 0 auto;
  min-height:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:5px 16px;
  border-radius:9px;
  background:#fff !important;
  color:#111827;
  border:1px solid rgba(203,213,225,.9);
  font-size:13px;
  font-weight:500;
  text-decoration:none;
  box-shadow:none;
  white-space:nowrap;
  transition:var(--transition);
}
.hero-consultation-btn:hover {
  transform:translateY(-2px);
  box-shadow:none;
  color:var(--primary);
}
.hero-consultation-btn i { font-size:16px }

/* ── STATS BAR ───────────────────────────────────────────── */
.stats-bar { background:linear-gradient(135deg,var(--navy),var(--navy-2)); position:relative; overflow:hidden }
.stats-bar::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 70% 120% at 20% 50%,rgba(255,106,0,.15),transparent); pointer-events:none }
.stats-bar-inner { display:flex; justify-content:space-around; align-items:center; flex-wrap:wrap; gap:0; padding:20px 0 }
.stat-item { text-align:center; color:#fff; padding:8px 24px; position:relative }
.stat-item:not(:last-child)::after { content:''; position:absolute; right:0; top:50%; transform:translateY(-50%); height:36px; width:1px; background:rgba(255,255,255,.12) }
.stat-num { font-size:clamp(1.5rem,3.5vw,2.2rem); font-weight:900; background:linear-gradient(135deg,var(--primary),#ffb347); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; line-height:1 }
.stat-label { font-size:11px; opacity:.65; text-transform:uppercase; letter-spacing:.6px; margin-top:4px }

/* ── 3D CARD HOVER ───────────────────────────────────────── */
.card-3d { transform-style:preserve-3d; transition:transform .15s ease; cursor:pointer }
.card-3d:hover { box-shadow:var(--shadow-lg) !important }

/* ── SECTIONS ────────────────────────────────────────────── */
.section { padding:var(--section-y) 0 }
.section-header { text-align:center; margin-bottom:40px }
.section-title { font-size:clamp(1.4rem,3vw,2.1rem); font-weight:900; color:var(--gray-800); letter-spacing:-.3px }
.section-subtitle { color:var(--gray-600); font-size:.95rem; margin-top:10px }
.section-title-line { width:56px; height:3px; background:linear-gradient(90deg,var(--primary),var(--navy)); border-radius:3px; margin:14px auto 0 }

/* ── CATEGORY GRID ───────────────────────────────────────── */
.cat-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:14px }
.cat-card { background:#fff; border-radius:var(--radius); padding:22px 12px; text-align:center; transition:var(--transition); border:1.5px solid var(--gray-200); cursor:pointer; transform-style:preserve-3d; position:relative; overflow:hidden }
.cat-card::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg,var(--primary),var(--navy)); opacity:0; transition:var(--transition); border-radius:calc(var(--radius) - 1.5px) }
.cat-card:hover::before { opacity:1 }
.cat-card:hover { border-color:transparent; transform:translateY(-6px) rotateX(4deg); box-shadow:var(--shadow-lg), 0 0 0 1px var(--primary) }
.cat-card:hover .cat-icon,.cat-card:hover .cat-name { position:relative; z-index:1; color:#fff }
.cat-icon { width:54px; height:54px; border-radius:50%; background:var(--primary-l); display:flex; align-items:center; justify-content:center; font-size:22px; color:var(--primary); margin:0 auto 12px; transition:var(--transition); position:relative; z-index:1 }
.cat-card:hover .cat-icon { background:rgba(255,255,255,.2) }
.cat-name { font-size:12px; font-weight:700; color:var(--gray-700); transition:var(--transition); position:relative; z-index:1 }
.category-showcase-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:18px }
.category-showcase-card { background:#fff; border:1px solid var(--gray-200); border-radius:14px; overflow:hidden; box-shadow:var(--shadow-sm); transition:var(--transition); display:flex; min-height:230px }
.category-showcase-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:rgba(255,106,0,.35) }
.category-showcase-media { flex:0 0 38%; min-width:128px; background-size:cover; background-position:center; position:relative }
.category-showcase-media::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(2,6,23,0),rgba(2,6,23,.28)); opacity:.7; transition:var(--transition) }
.category-showcase-card:hover .category-showcase-media::after { opacity:.35 }
.category-showcase-body { flex:1; padding:18px; min-width:0; display:flex; flex-direction:column; gap:14px }
.category-showcase-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px }
.category-showcase-head h3 { font-size:17px; line-height:1.25; font-weight:900; color:var(--gray-800); letter-spacing:0 }
.category-showcase-head > a { flex-shrink:0; display:inline-flex; align-items:center; gap:5px; color:var(--primary); font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.3px }
.category-sub-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px }
.category-sub-item { min-height:34px; display:flex; align-items:center; padding:7px 10px; border:1px solid #edf1f5; border-radius:8px; background:#f8fafc; color:var(--gray-700); font-size:12px; font-weight:700; line-height:1.2; transition:var(--transition) }
.category-sub-item:hover { background:var(--primary-l); color:var(--primary-d); border-color:rgba(255,106,0,.25); transform:translateX(2px) }
.alibaba-cat-shell { display:grid; grid-template-columns:310px 1fr; gap:28px; align-items:start; background:#fff; border:1px solid var(--gray-200); border-radius:14px; padding:22px; box-shadow:var(--shadow-sm); height:min(720px,calc(100vh - 170px)); min-height:520px; overflow:hidden }
.alibaba-cat-sidebar { height:100%; overflow:auto; border-right:1px solid var(--gray-200); padding-right:14px }
.alibaba-cat-sidebar-title { display:flex; align-items:center; gap:12px; padding:14px 18px; background:#f7f7f8; border-left:4px solid var(--gray-800); color:#111827; font-size:16px; font-weight:900; margin-bottom:8px }
.alibaba-cat-sidebar-title i { font-size:18px; color:#2f2f2f }
.alibaba-cat-link { display:flex; align-items:center; gap:14px; padding:13px 18px; border-radius:8px; color:#111827; font-size:15px; font-weight:650; transition:var(--transition) }
.alibaba-cat-link i { width:24px; color:#2f2f2f; font-size:18px; text-align:center }
.alibaba-cat-link:hover { background:#fff4ec; color:var(--primary-d); transform:translateX(3px) }
.alibaba-cat-link:hover i { color:var(--primary) }
.alibaba-cat-link.active { background:#fff4ec; color:var(--primary-d); box-shadow:inset 3px 0 0 var(--primary) }
.alibaba-cat-link.active i { color:var(--primary) }
.alibaba-cat-main { min-width:0; height:100%; overflow:auto; display:flex; flex-direction:column; gap:28px; padding-right:8px; scroll-behavior:smooth }
.alibaba-cat-section { scroll-margin-top:118px }
.alibaba-default-section { order:0 }
.alibaba-cat-panel { display:block }
.alibaba-cat-section > h3,.alibaba-section-head h3 { font-size:22px; line-height:1.2; font-weight:900; color:#111827; letter-spacing:0; margin-bottom:20px }
.alibaba-section-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:14px }
.alibaba-section-head p { color:#64748b; font-size:13px; font-weight:600; margin-top:4px }
.alibaba-section-head > a { color:var(--primary); font-size:13px; font-weight:900; display:inline-flex; gap:6px; align-items:center; white-space:nowrap }
.alibaba-for-you-grid { display:grid; grid-template-columns:repeat(7,minmax(86px,1fr)); gap:30px 22px }
.alibaba-for-you-item { position:relative; text-align:center; color:#111827; font-size:14px; font-weight:700; line-height:1.25; min-width:0 }
.alibaba-img-circle { width:104px; height:104px; max-width:100%; border-radius:50%; background-color:#f4f4f5; background-size:cover; background-position:center; display:block; margin:0 auto 12px; transition:var(--transition); box-shadow:inset 0 0 0 1px rgba(15,23,42,.04) }
.alibaba-hot { position:absolute; top:6px; right:calc(50% - 48px); width:24px; height:24px; border-radius:50%; background:#fff1f1; color:#ff4d21; display:flex; align-items:center; justify-content:center; font-size:12px; box-shadow:0 3px 10px rgba(255,77,33,.12); z-index:2 }
.alibaba-for-you-item:hover .alibaba-img-circle { transform:translateY(-4px) scale(1.04); box-shadow:0 12px 28px rgba(15,23,42,.12) }
.alibaba-selection-grid { display:grid; grid-template-columns:repeat(6,minmax(110px,1fr)); gap:16px }
.alibaba-selection-item { display:flex; flex-direction:column; align-items:center; gap:9px; min-height:140px; padding:12px 10px; border:1px solid #edf1f5; border-radius:12px; color:#111827; background:#fff; text-align:center; transition:var(--transition) }
.alibaba-selection-item span { width:82px; height:82px; border-radius:50%; background:#f6f6f7 center/cover no-repeat; display:block }
.alibaba-selection-item strong { font-size:13px; line-height:1.25; font-weight:750 }
.alibaba-selection-item:hover { transform:translateY(-4px); border-color:rgba(255,106,0,.28); box-shadow:0 12px 26px rgba(15,23,42,.09); color:var(--primary-d) }

/* ── BUSINESS CARDS ──────────────────────────────────────── */
.biz-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:22px }
.biz-card { background:#fff; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-sm); transition:var(--transition); border:1px solid var(--gray-200); display:flex; flex-direction:column; transform-style:preserve-3d; position:relative }
.biz-card::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg,rgba(0,48,135,.03),rgba(255,106,0,.03)); opacity:0; transition:var(--transition); z-index:0; border-radius:var(--radius-lg) }
.biz-card:hover { box-shadow:var(--shadow-lg), 0 0 0 2px var(--primary); transform:translateY(-6px) rotateX(2deg); }
.biz-card:hover::before { opacity:1 }
.biz-cover { height:150px; background:linear-gradient(135deg,var(--navy),var(--navy-2)); position:relative; overflow:hidden }
.biz-cover img { width:100%; height:100%; object-fit:cover; transition:transform .4s ease }
.biz-card:hover .biz-cover img { transform:scale(1.06) }
.biz-badge { position:absolute; top:10px; right:10px; background:linear-gradient(135deg,var(--green),#0f5a0f); color:#fff; padding:4px 12px; border-radius:20px; font-size:11px; font-weight:700; box-shadow:0 2px 8px rgba(26,122,26,.3) }
.biz-body { padding:18px; flex:1; display:flex; flex-direction:column; position:relative; z-index:1 }
.biz-logo-wrap { margin:-42px 0 10px }
.biz-logo { width:56px; height:56px; border-radius:50%; border:3px solid #fff; background:var(--gray-100); overflow:hidden; display:flex; align-items:center; justify-content:center; font-size:22px; font-weight:900; color:var(--navy); box-shadow:var(--shadow-md); transition:var(--transition) }
.biz-logo img { width:100%; height:100%; object-fit:cover }
.biz-card:hover .biz-logo { box-shadow:0 0 0 3px var(--primary), var(--shadow-md); transform:scale(1.08) }
.biz-name { font-size:15px; font-weight:800; color:var(--gray-800); margin-bottom:4px; line-height:1.3; letter-spacing:-.2px }
.biz-cat { font-size:11.5px; color:var(--primary); font-weight:700; margin-bottom:6px }
.biz-city { font-size:12px; color:var(--gray-600); display:flex; align-items:center; gap:4px; margin-bottom:10px }
.biz-card-stats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; margin:0 0 10px }
.biz-card-stats span { min-height:34px; border:1px solid #e2e8f0; border-radius:8px; background:#f8fafc; color:#64748b; display:flex; align-items:center; justify-content:center; gap:4px; font-size:11px; font-weight:800 }
.biz-card-stats b { color:#0f172a; font-size:13px; font-weight:950 }
.biz-tags { display:flex; flex-wrap:wrap; gap:4px; margin-bottom:12px }
.biz-tag { background:var(--gray-100); color:var(--gray-600); padding:2px 8px; border-radius:20px; font-size:11px; font-weight:500 }
.biz-stars { color:#f59e0b; font-size:13px; margin-bottom:10px }
.biz-actions { display:flex; gap:8px; margin-top:auto }
.btn-view { flex:1; background:linear-gradient(135deg,var(--navy),var(--navy-l)); color:#fff; padding:10px 0; border-radius:var(--radius-sm); font-size:13px; font-weight:700; text-align:center; transition:var(--transition) }
.btn-view:hover { filter:brightness(1.15); color:#fff }
.biz-upgrade-form { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; margin-top:10px; padding-top:10px; border-top:1px solid var(--gray-100) }
.biz-upgrade-select { min-width:0; width:100%; border:1px solid var(--gray-200); border-radius:8px; background:#fff; color:var(--gray-800); font-size:12px; font-weight:700; padding:9px 10px }
.biz-upgrade-btn { border:0; border-radius:8px; background:#0f172a; color:#fff; padding:9px 12px; font-size:12px; font-weight:900; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:6px; white-space:nowrap; transition:var(--transition) }
.biz-upgrade-btn:hover { background:var(--primary); transform:translateY(-1px) }
.btn-wa { background:linear-gradient(135deg,#25d366,#1da851); color:#fff; padding:10px 14px; border-radius:var(--radius-sm); font-size:16px; display:flex; align-items:center; transition:var(--transition) }
.btn-wa:hover { filter:brightness(1.1); color:#fff; transform:scale(1.05) }

/* ── PRODUCT CARDS ───────────────────────────────────────── */
.service-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:16px }
.service-card { border:1px solid var(--gray-200); border-radius:8px; background:#fff; overflow:hidden; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; min-width:0 }
.service-card-media { height:140px; background:#f8fafc; color:var(--primary); display:flex; align-items:center; justify-content:center; font-size:32px; overflow:hidden }
.service-card-media img { width:100%; height:100%; object-fit:cover }
.service-card-body { padding:15px; display:flex; flex-direction:column; gap:9px; flex:1 }
.service-card-body h3 { color:var(--gray-800); font-size:15px; font-weight:900; line-height:1.3; margin:0 }
.service-card-body p { color:var(--gray-600); font-size:13px; line-height:1.55; margin:0 }
.service-card-meta { display:grid; gap:6px; margin-top:auto }
.service-card-meta span { display:flex; align-items:flex-start; gap:7px; color:#475569; font-size:12px; font-weight:750 }
.service-card-meta i { color:var(--primary); width:14px; margin-top:2px; text-align:center }
.service-gallery-strip { display:flex; gap:7px; overflow-x:auto; scrollbar-width:none; padding-top:4px }
.service-gallery-strip::-webkit-scrollbar { display:none }
.service-gallery-strip a { flex:0 0 58px; width:58px; height:48px; border-radius:7px; overflow:hidden; border:1px solid #e2e8f0 }
.service-gallery-strip img { width:100%; height:100%; object-fit:cover; display:block }
.prod-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:20px }
.prod-card { background:#fff; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-sm); transition:var(--transition); border:1px solid var(--gray-200); transform-style:preserve-3d }
.prod-card[data-product-url] { cursor:pointer }
.prod-card[data-product-url]:focus-visible { outline:3px solid rgba(255,106,0,.35); outline-offset:3px }
.prod-card:hover { box-shadow:var(--shadow-lg), 0 0 0 2px var(--primary); transform:translateY(-5px) rotateX(2deg) }
.prod-img { height:190px; overflow:hidden; background:var(--gray-100); display:flex; align-items:center; justify-content:center; position:relative; cursor:pointer }
a.prod-img { color:inherit; text-decoration:none }
.prod-img-link { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:inherit; text-decoration:none; cursor:pointer; z-index:2 }
.prod-img img { width:100%; height:100%; object-fit:cover; transition:transform .4s ease }
.prod-card:hover .prod-img img { transform:scale(1.08) }
.prod-img .no-img { font-size:3rem; color:var(--gray-400) }
.prod-body { padding:16px }
.prod-name { font-size:14px; font-weight:700; color:var(--gray-800); margin-bottom:4px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden }
.prod-biz { font-size:12px; color:var(--gray-600); margin-bottom:6px; display:flex; align-items:center; gap:4px }
.prod-price { font-size:16px; font-weight:900; background:linear-gradient(135deg,var(--primary),#e05c00); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; margin-bottom:12px }
.prod-price span { font-size:11px; font-weight:400; color:var(--gray-600); -webkit-text-fill-color:var(--gray-600) }
.btn-quote { display:block; background:linear-gradient(135deg,var(--navy),var(--navy-l)); color:#fff; text-align:center; padding:10px; border-radius:var(--radius-sm); font-size:13px; font-weight:700; transition:var(--transition) }
.btn-quote:hover { filter:brightness(1.15); color:#fff; transform:translateY(-1px) }
.dip-latest-products .prod-card .btn-quote,
.dip-top-products .prod-card .btn-quote { display:none!important }
.dip-latest-products .prod-body,
.dip-top-products .prod-body { padding-bottom:11px }
.dip-latest-products .prod-price,
.dip-top-products .prod-price { margin-bottom:0 }
.home-category-product-sections .cat-page-product-wrap { padding-bottom:8px }
.home-category-product-sections .cat-page-products { padding-bottom:0 }
.home-top-product-banners { padding:18px 0 8px; background:#fff }
.home-bottom-promo-banners { position:absolute; left:0; right:0; bottom:12px; z-index:12; padding:0; background:transparent; pointer-events:none }
.home-bottom-promo-banners .container { pointer-events:none }
.home-bottom-promo-banners .home-promo-row { pointer-events:auto }
.home-bottom-promo-banners .home-promo-card { box-shadow:0 14px 34px rgba(2,6,23,.3) }
.home-bottom-promo-banners .promo-phone-enabled { display:block }
.home-mobile-promos-below-hero { display:none!important }
.mobile-bottom-nav { display:none }
.top-consultation-btn { display:none }
.mobile-brand-consultation { display:none }
.home-ranking-slider { position:relative; overflow:hidden; border-radius:12px; background:#f8fafc; box-shadow:0 10px 28px rgba(15,23,42,.09) }
.hero-slider,.home-ranking-slider,.home-promo-card.has-gallery { touch-action:pan-y }
.home-top-product-banner-row { display:flex; width:100%; transition:transform .5s ease }
.home-top-product-banner { flex:0 0 100%; width:100%; height:clamp(240px,28vw,420px); overflow:hidden; background:#f8fafc; display:flex; align-items:center; justify-content:center; position:relative; color:#fff; text-decoration:none }
.home-top-product-banner img,
.home-top-product-banner video,
.home-top-product-banner iframe { width:100%; height:100%; object-fit:cover; display:block; border:0 }
.home-top-product-banner img { object-fit:contain }
.home-top-product-banner-copy { position:absolute; inset:auto 0 0; display:flex; flex-direction:column; gap:3px; padding:14px 16px; background:linear-gradient(0deg,rgba(15,23,42,.72),rgba(15,23,42,0)); color:#fff }
.home-top-product-banner-copy strong { font-size:18px; line-height:1.2; font-weight:600 }
.home-top-product-banner-copy small { color:rgba(255,255,255,.82); font-size:12px; font-weight:400 }
.home-top-product-banner-copy em { color:#fff; font-size:12px; font-style:normal; font-weight:600 }
.home-ranking-slider-arrow { position:absolute; top:50%; z-index:3; width:38px; height:38px; border:0; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(15,23,42,.62); color:#fff; cursor:pointer; transform:translateY(-50%); transition:var(--transition) }
.home-ranking-slider-arrow:hover { background:var(--primary); transform:translateY(-50%) scale(1.06) }
.home-ranking-slider-arrow.prev { left:12px }
.home-ranking-slider-arrow.next { right:12px }
.home-ranking-slider-dots { position:absolute; z-index:3; left:50%; bottom:10px; transform:translateX(-50%); display:flex; gap:6px; padding:5px 8px; border-radius:999px; background:rgba(15,23,42,.42) }
.home-ranking-slider-dots button { width:7px; height:7px; padding:0; border:0; border-radius:999px; background:rgba(255,255,255,.58); cursor:pointer; transition:var(--transition) }
.home-ranking-slider-dots button.active { width:20px; background:#fff }
@media(max-width:768px){ .promo-desktop-only { display:none!important } .home-top-product-banner { height:170px } .home-top-product-banner img { object-fit:cover } .home-ranking-slider-arrow { width:32px;height:32px } .home-top-product-banner-copy { padding:24px 12px 12px } .home-top-product-banner-copy strong { font-size:15px } }
@media(max-width:768px){
  .home-business-cta-desktop { display:none }
  .home-business-cta-mobile { display:block; padding:7px 0; background:#fff }
  .home-business-cta-mobile .container { padding-left:8px; padding-right:8px }
  .home-business-cta-shell { padding:10px; border-radius:13px; box-shadow:0 7px 18px rgba(15,23,42,.06) }
  .home-business-cta-shell h2 { margin-bottom:9px; font-size:13px; gap:6px }
  .home-business-cta-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px }
  .home-business-cta-card.consultation { grid-column:1/-1; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; column-gap:8px; padding:10px 11px }
  .home-business-cta-card.consultation h3 { margin:0; font-size:11px }
  .home-business-cta-card.consultation p { min-height:0; margin:2px 0 0; grid-column:1; font-size:9px }
  .home-business-cta-card.consultation a { grid-column:2; grid-row:1/3; min-width:126px; padding:0 9px }
  .home-business-cta-card { padding:9px; border-radius:10px }
  .home-business-cta-card h3 { margin-bottom:2px; font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
  .home-business-cta-card p { min-height:28px; margin-bottom:7px; font-size:9px; line-height:1.35 }
  .home-business-cta-card a { min-height:32px; padding:0 5px; border-radius:8px; font-size:10px }
  .product-supplier-card { margin:10px 0 14px; min-height:68px; padding:10px; border-radius:10px }
  .product-supplier-info small { font-size:9px }
  .product-supplier-info strong { font-size:13px }
  .product-supplier-info em { font-size:10px }
  body { padding-bottom:calc(68px + env(safe-area-inset-bottom)) }
  .mobile-bottom-nav { position:fixed; left:0; right:0; bottom:0; z-index:900; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); align-items:end; min-height:64px; padding:5px 5px calc(5px + env(safe-area-inset-bottom)); border-top:1px solid #e2e8f0; background:#fff; box-shadow:0 -8px 28px rgba(15,23,42,.12); backdrop-filter:none; -webkit-backdrop-filter:none }
  .mobile-bottom-link { min-width:0; min-height:52px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; color:#64748b; font-size:10px; font-weight:700; text-decoration:none; transition:color .2s ease,transform .2s ease }
  .mobile-bottom-link > i,.mobile-bottom-icon-wrap > i { font-size:19px }
  .mobile-bottom-link.active { color:var(--primary) }
  .mobile-bottom-link:active { transform:scale(.94) }
  .mobile-bottom-primary { position:relative; color:#64748b; overflow:visible }
  .mobile-bottom-primary-icon { width:auto; height:auto; margin:0; border:0; border-radius:0; display:flex; align-items:center; justify-content:center; background:transparent; color:inherit; font-size:19px; box-shadow:none }
  .mobile-bottom-primary.active .mobile-bottom-primary-icon { background:transparent; color:var(--primary) }
  .mobile-bottom-icon-wrap { position:relative; display:inline-flex }
  .mobile-bottom-icon-wrap b { position:absolute; right:-11px; top:-8px; min-width:16px; height:16px; padding:0 4px; border:2px solid #fff; border-radius:999px; display:flex; align-items:center; justify-content:center; background:#ef4444; color:#fff; font-size:8px; line-height:1 }
  .home-promo-strip { bottom:calc(76px + env(safe-area-inset-bottom)) }
  .location-popup { bottom:calc(82px + env(safe-area-inset-bottom)); left:12px; right:12px; max-width:none }
}
.wishlist-btn { position:absolute; top:10px; right:10px; width:38px; height:38px; border:none; border-radius:50%; background:rgba(255,255,255,.94); color:#94a3b8; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:8; box-shadow:0 8px 20px rgba(15,23,42,.2); transition:var(--transition) }
.wishlist-btn:hover { transform:scale(1.08); color:#ef4444; background:#fff }
.wishlist-btn.active { color:#ef233c; background:#fff1f2 }
.wishlist-btn.active i { animation:wishlist-pop .22s ease }
.wishlist-btn-large { width:46px; height:46px; top:14px; right:14px; font-size:18px }
.product-detail-page .wishlist-btn-large { background:transparent; box-shadow:none; color:#ef4444; text-shadow:0 1px 8px rgba(15,23,42,.3) }
.product-detail-page .wishlist-btn-large:hover,
.product-detail-page .wishlist-btn-large.active { background:transparent; box-shadow:none; color:#ef233c }
.product-business-logo { width:48px; height:48px; border-radius:10px; background:#fff; border:1px solid #e2e8f0; display:flex; align-items:center; justify-content:center; font-size:20px; font-weight:900; color:#003087; flex-shrink:0; overflow:hidden }
.product-business-logo img { width:100%; height:100%; object-fit:contain; display:block }
.product-supplier-card { margin:12px 0 16px; min-height:78px; display:flex; align-items:center; gap:13px; padding:13px; border:1px solid #dbe7f3; border-radius:12px; background:linear-gradient(135deg,#fff,#f8fbff); color:#0f172a; box-shadow:0 10px 24px rgba(15,23,42,.07); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease }
.product-supplier-card:hover { transform:translateX(4px); border-color:#ff6a00; box-shadow:0 14px 32px rgba(255,106,0,.14) }
.product-supplier-info { min-width:0; flex:1; display:flex; flex-direction:column; gap:2px }
.product-supplier-info small { color:#64748b; font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.7px }
.product-supplier-info strong { color:#0f172a; font-size:15px; line-height:1.18; font-weight:950; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.product-supplier-info em { color:#64748b; font-style:normal; font-size:12px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.product-supplier-card > i { color:#94a3b8; flex:0 0 auto }
.movie-card .wishlist-btn,.featured-banner .wishlist-btn { color:#94a3b8 }
@keyframes wishlist-pop { 0% { transform:scale(.75) } 70% { transform:scale(1.2) } 100% { transform:scale(1) } }

.wishlist-hero { background:linear-gradient(135deg,#0f172a,#003087 62%,#0f5132); color:#fff; padding:clamp(38px,6vw,72px) 0 }
.wishlist-hero-inner { display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap }
.wishlist-hero h1 { font-size:clamp(2rem,5vw,3.6rem); font-weight:950; line-height:1.05 }
.wishlist-hero p { color:rgba(255,255,255,.78); margin-top:10px; max-width:560px; line-height:1.7 }
.wishlist-empty { text-align:center; padding:70px 20px; background:#fff; border:1px solid var(--gray-200); border-radius:8px; box-shadow:var(--shadow-sm) }
.wishlist-empty > i { font-size:3.2rem; color:#fecdd3; margin-bottom:16px }
.wishlist-empty h2 { color:var(--gray-800); font-size:1.4rem; font-weight:900; margin-bottom:8px }
.wishlist-empty p { color:var(--gray-600); margin-bottom:22px }


/* ── Journey  ───────────────────────────────────────── */
.journey-section{
  position:relative;
  overflow:hidden;
  background:#020e24;
  padding:0;
  min-height:840px;
}

.journey-section::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--journey-bg, url('https://images.alphacoders.com/131/1311454.jpg'));
  background-size:cover;
  background-position:center;
  opacity:.5;
  z-index:0;
}

.journey-section::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 50% 18%,rgba(255,126,42,.22),transparent 34%),linear-gradient(180deg,rgba(2,14,36,.25),rgba(2,14,36,.9));
  z-index:1;
  pointer-events:none;
}

.journey-section canvas{
  position:relative;
  z-index:2;
  display:block;
  width:100%!important;
  pointer-events:none;
}
.journey-desktop-city { display:none!important }
.journey-desktop-city i { position:relative; flex:1 1 34px; max-width:52px; height:var(--city-height); border:1px solid rgba(255,190,108,.46); border-radius:3px 3px 0 0; background:linear-gradient(90deg,rgba(14,91,132,.92),rgba(8,47,89,.95) 48%,rgba(26,130,143,.86)); box-shadow:inset 7px 0 rgba(255,160,50,.18),inset -5px 0 rgba(56,189,248,.14),0 0 18px rgba(56,189,248,.12); transform:rotateY(-7deg); animation:journeyCityRise .7s both; animation-delay:var(--city-delay) }
.journey-desktop-city i:nth-child(3n) { background:linear-gradient(90deg,#163f75,#0d756c); border-color:rgba(74,222,128,.4) }
.journey-desktop-city i:nth-child(4n) { background:linear-gradient(90deg,#194f75,#8b4b16); border-color:rgba(251,146,60,.45) }
.journey-desktop-city i::after { content:""; position:absolute; inset:8px 7px; background:repeating-linear-gradient(180deg,rgba(255,205,128,.68) 0 2px,transparent 2px 13px),repeating-linear-gradient(90deg,transparent 0 8px,rgba(147,197,253,.35) 8px 10px) }
@keyframes journeyCityRise { from { height:8%; opacity:0 } to { height:var(--city-height); opacity:1 } }

.journey-overlay{
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:clamp(20px,4vw,42px);
  padding-bottom:clamp(170px,12vw,220px);
}

.journey-label{
  color:rgba(255,255,255,.78);
  font-size:clamp(.75rem,1.4vw,.95rem);
  font-weight:700;
  letter-spacing:.6px;
  text-transform:uppercase;
}

.journey-title{
  color:#fff;
  font-size:clamp(1.45rem,3.4vw,2.8rem);
  font-weight:950;
  line-height:1.05;
  text-shadow:0 8px 28px rgba(0,0,0,.55);
}

.journey-stats{
  position:absolute;
  right:clamp(18px,4vw,48px);
  top:clamp(20px,4vw,42px);
  width:min(420px,44vw);
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  pointer-events:auto;
}

.journey-stat{
  min-height:70px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:14px;
  padding:12px 14px;
  background:linear-gradient(135deg,rgba(255,255,255,.14),rgba(255,255,255,.04));
  backdrop-filter:blur(14px);
  box-shadow:0 12px 32px rgba(0,0,0,.22);
}

.journey-stat:first-child{grid-column:span 2}

.journey-stat span{
  display:block;
  font-size:clamp(1.35rem,2.4vw,2.1rem);
  line-height:1;
  font-weight:950;
  color:#ffb347;
  text-shadow:0 0 18px rgba(255,106,0,.35);
}

.journey-stat small{
  display:block;
  margin-top:6px;
  font-size:10.5px;
  line-height:1.25;
  color:rgba(255,255,255,.74);
  text-transform:uppercase;
  letter-spacing:.55px;
  font-weight:850;
}

.journey-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:rgba(255,106,0,.86);
  color:#fff;
  padding:9px 18px;
  border-radius:22px;
  font-size:12px;
  font-weight:800;
  box-shadow:0 8px 20px rgba(255,106,0,.18);
  border:1px solid rgba(255,255,255,.16);
  pointer-events:auto;
  text-decoration:none;
  transform:translateY(18px);
}

.journey-industry-panel{
  position:relative;
  z-index:8;
  pointer-events:auto;
  width:100%;
  margin-top:auto;
  transform: translateY(42px);
  padding-bottom: 96px;
}
.journey-industry-panel .container{
  max-width:none;
  width:100%;
  padding-left:0;
  padding-right:0;
}
.journey-industry-panel .section-header{
  text-align:left;
  margin:0 0 8px;
  max-width:520px;
  padding-left:4px;
}
.journey-industry-panel .section-title{
  color:#fff;
  font-size:clamp(1.45rem,3vw,2.35rem);
  text-shadow:0 8px 26px rgba(0,0,0,.5);
}
.journey-industry-panel .section-subtitle{
  color:rgba(255,255,255,.72);
  margin-top:8px;
}
.journey-industry-panel .section-title-line{
  margin:12px 0 0;
}
.journey-industry-panel .industry-actions,
.journey-industry-panel .industry-cat-grid,
.journey-industry-panel .industry-cat-card,
.journey-industry-panel .industry-scroll-btn,
.journey-industry-panel .industry-view-all{
  pointer-events:auto;
}
.journey-industry-panel .industry-actions{
  margin-bottom:10px;
}

.scroll-indicator{
  display:flex;
  align-items:center;
  gap:8px;
  color:rgba(255,255,255,.58);
  font-size:12px;
  animation:bounceY 2s infinite;
  pointer-events:none;
}

@keyframes bounceY{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(8px)}
}

@media(max-width:768px){
  .journey-section{min-height:720px}
  .journey-stats{top:128px;left:18px;right:18px;width:auto}
  .journey-stat{min-height:56px;padding:9px}
  .journey-title{font-size:1.8rem}
}


/* ── FLASH ───────────────────────────────────────────────── */
.flash-wrap { padding:14px 0 0 }
.alert { display:flex; align-items:center; gap:10px; padding:13px 18px; border-radius:var(--radius); margin-bottom:10px; font-size:13.5px; font-weight:500; position:relative; backdrop-filter:blur(8px) }
.alert i { font-size:16px; flex-shrink:0 }
.alert-close { margin-left:auto; background:none; border:none; cursor:pointer; opacity:.55; font-size:18px; line-height:1; padding:0 4px }
.alert-close:hover { opacity:1 }
.alert-success { background:rgba(220,252,231,.9); color:#166534; border:1px solid #bbf7d0; box-shadow:0 0 0 1px rgba(22,163,74,.1) }
.alert-danger { background:rgba(254,226,226,.9); color:#991b1b; border:1px solid #fecaca }
.alert-warning { background:rgba(254,249,195,.9); color:#854d0e; border:1px solid #fde68a }
.alert-info { background:rgba(219,234,254,.9); color:#1e40af; border:1px solid #bfdbfe }
.flash-toast-wrap { position:fixed; top:14px; right:18px; z-index:5000; width:min(430px,calc(100vw - 28px)); pointer-events:none }
.flash-toast-wrap .alert { pointer-events:auto; margin-bottom:10px; box-shadow:0 18px 45px rgba(15,23,42,.18); animation:flashSlideIn .22s ease-out }
@keyframes flashSlideIn { from { opacity:0; transform:translateY(-10px) } to { opacity:1; transform:translateY(0) } }

/* ── FOOTER ──────────────────────────────────────────────── */
.site-footer { background:linear-gradient(180deg,#09122b,#060d1f); color:#94a3b8; margin-top:0 }
.footer-top { padding:var(--section-y) 0 }
.footer-grid { display:grid; grid-template-columns:2.2fr 1fr 1fr 1fr 1fr; gap:40px }
.footer-logo { display:flex; align-items:center; gap:10px; margin-bottom:16px }
.footer-logo-name { font-size:16px; font-weight:800; color:#fff }
.footer-logo-tag { font-size:11px; color:#475569 }
.footer-about { font-size:13px; line-height:1.75; margin-bottom:20px }
.footer-social { display:flex; gap:8px }
.footer-social a { width:36px; height:36px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:13px; color:#94a3b8; transition:var(--transition) }
.footer-social a:hover { background:var(--primary); border-color:var(--primary); color:#fff; transform:scale(1.15) }
.footer-h { color:#fff; font-size:12px; font-weight:800; margin-bottom:16px; text-transform:uppercase; letter-spacing:.8px }
.footer-links li { margin-bottom:9px }
.footer-links a { font-size:13px; color:#64748b; transition:var(--transition); display:flex; align-items:center; gap:6px }
.footer-links a:hover { color:var(--primary); padding-left:4px }
.footer-contact li { display:flex; align-items:flex-start; gap:9px; margin-bottom:9px; font-size:13px }
.footer-contact i { color:var(--primary); margin-top:2px; flex-shrink:0 }
.footer-contact a { color:#64748b; transition:var(--transition); word-break:break-word }
.footer-contact a:hover { color:var(--primary) }
.footer-bottom { border-top:1px solid rgba(255,255,255,.05); padding:18px 0 }
.footer-bottom-inner { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; font-size:12px }
.footer-payment-icons { display:flex; align-items:center; justify-content:center; padding:4px 9px; border-radius:8px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.06) }
.footer-payment-icons img { height:28px; width:auto; max-width:min(360px,72vw); object-fit:contain }

/* ── TRANSLATE SELECTOR ──────────────────────────────────── */
.translate-wrapper { position:relative; display:inline-block }
.translate-selector { background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12); color:#94a3b8; padding:6px 14px; border-radius:var(--radius-sm); font-size:12px; cursor:pointer; outline:none; display:flex; align-items:center; gap:6px }
.top-bar #top_translate_element { display:block !important }
.top-bar #top_translate_element .goog-te-gadget { color:rgba(255,255,255,.82) !important; font-size:0 !important }
.top-bar #top_translate_element .goog-te-gadget-simple { background:rgba(255,255,255,.08) !important; border:1px solid rgba(255,255,255,.15) !important; padding:3px 10px !important; border-radius:5px !important; display:inline-flex !important; align-items:center !important; min-height:28px !important }
.top-bar #top_translate_element .goog-te-menu-value span { color:rgba(255,255,255,.92) !important; border:none !important }
.top-bar #top_translate_element .goog-te-menu-value:hover span { color:#fff !important }
.top-bar #top_translate_element img { display:none !important }
.footer-bottom span[style*="Language"] { display:none !important }
.footer-bottom #google_translate_element,
.footer-bottom #top_translate_element,
.footer-bottom .goog-te-gadget,
.footer-bottom .goog-te-gadget-simple,
.footer-bottom [class*="goog-te"],
.footer-bottom iframe.goog-te-banner-frame { display:none !important }
#google_translate_element { display:inline-block }
.goog-te-gadget-simple { background:rgba(255,255,255,.07) !important; border:1px solid rgba(255,255,255,.12) !important; padding:4px 10px !important; border-radius:6px !important; font-size:12px !important }
.goog-te-menu-value span { color:#94a3b8 !important }
.goog-te-menu-value:hover span { color:#fff !important }
.goog-te-gadget-icon { display:none !important }
body > .skiptranslate { display:none !important }
body { top:0 !important }

/* ── FORMS ───────────────────────────────────────────────── */
.form-group { margin-bottom:20px }
.form-group label { display:block; font-size:13px; font-weight:600; color:var(--gray-700); margin-bottom:7px }
.form-control { width:100%; padding:11px 16px; border:2px solid var(--gray-200); border-radius:var(--radius-sm); font-size:14px; color:var(--gray-800); background:#fff; transition:var(--transition); outline:none }
.form-control:focus { border-color:var(--primary); box-shadow:0 0 0 4px rgba(255,106,0,.1) }
textarea.form-control { resize:vertical; min-height:100px }
select.form-control { cursor:pointer }
.form-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:18px }
.span-2 { grid-column:span 2 }
.form-hint { font-size:11px; color:var(--gray-600); margin-top:5px }

/* Buttons */
.btn { display:inline-flex; align-items:center; gap:8px; padding:11px 22px; border-radius:var(--radius-sm); font-size:14px; font-weight:700; cursor:pointer; border:none; transition:var(--transition); text-align:center; justify-content:center; position:relative; overflow:hidden }
.btn::before { content:''; position:absolute; inset:0; background:rgba(255,255,255,.15); opacity:0; transition:opacity .2s }
.btn:hover::before { opacity:1 }
.btn-primary { background:linear-gradient(135deg,var(--primary),var(--primary-d)); color:#fff; box-shadow:0 4px 16px var(--primary-glow) }
.btn-primary:hover { transform:translateY(-2px); box-shadow:var(--shadow-glow); color:#fff }
.btn-outline { background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.42); box-shadow:none }
.btn-outline:hover { background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.7); transform:translateY(-2px) }
.btn-secondary { background:var(--gray-100); color:var(--gray-700) }
.btn-secondary:hover { background:var(--gray-200) }
.btn-navy { background:linear-gradient(135deg,var(--navy),var(--navy-l)); color:#fff; box-shadow:0 4px 16px rgba(0,48,135,.25) }
.btn-navy:hover { transform:translateY(-2px); color:#fff }
.btn-success { background:linear-gradient(135deg,#16a34a,#15803d); color:#fff }
.btn-danger { background:linear-gradient(135deg,#dc2626,#b91c1c); color:#fff }
.dashboard-inline-form { display:inline-flex; margin:0 }
.dashboard-inline-form .btn { height:100% }
.btn-sm { padding:7px 16px; font-size:12px }
.btn-lg { padding:14px 36px; font-size:16px }

/* ── AUTH ────────────────────────────────────────────────── */
.auth-page { min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#010c22,#001248 40%,#0d2a5e); padding:24px; position:relative; overflow:hidden }
.auth-page::before { content:''; position:absolute; width:600px; height:600px; border-radius:50%; background:radial-gradient(circle,rgba(255,106,0,.15),transparent 70%); top:-200px; right:-200px; pointer-events:none }
.auth-page::after { content:''; position:absolute; width:400px; height:400px; border-radius:50%; background:radial-gradient(circle,rgba(0,48,135,.25),transparent 70%); bottom:-150px; left:-150px; pointer-events:none }
.auth-card { background:rgba(255,255,255,.97); backdrop-filter:blur(20px); border-radius:var(--radius-xl); box-shadow:0 24px 80px rgba(0,0,0,.4); width:100%; max-width:460px; padding:clamp(28px,5vw,48px); position:relative; z-index:1 }
.auth-title { font-size:1.6rem; font-weight:900; color:var(--gray-800); margin-bottom:6px; letter-spacing:-.3px }
.auth-sub { font-size:13.5px; color:var(--gray-600); margin-bottom:28px }
.auth-link { text-align:center; font-size:13px; color:var(--gray-600); margin-top:20px }
.auth-link a { color:var(--primary); font-weight:700 }

/* Phone input with country code */
.phone-input-group { position:relative; display:flex; gap:0; border:2px solid var(--gray-200); border-radius:var(--radius-sm); overflow:visible; transition:var(--transition) }
.phone-input-group:focus-within { border-color:var(--primary); box-shadow:0 0 0 4px rgba(255,106,0,.1) }
.phone-country-code { border:none; border-right:1px solid var(--gray-200); padding:0 12px; background:#f8fafc; font-size:13px; cursor:pointer; outline:none; min-width:90px; font-weight:600; color:var(--gray-700) }
.phone-country-code[data-enhanced="1"] { display:none }
.phone-country-picker { position:relative; flex:0 0 106px; z-index:30 }
.phone-country-trigger { width:100%; height:100%; min-height:44px; padding:0 10px; display:flex; align-items:center; justify-content:space-between; gap:6px; border:0; border-right:1px solid var(--gray-200); border-radius:6px 0 0 6px; background:#f8fafc; color:var(--gray-800); font-size:13px; font-weight:800; cursor:pointer }
.phone-country-trigger i { color:#94a3b8; font-size:9px; transition:transform .18s ease }
.phone-country-picker.open .phone-country-trigger i { transform:rotate(180deg) }
.phone-country-menu { position:absolute; left:-2px; top:calc(100% + 6px); width:min(330px,calc(100vw - 54px)); max-height:280px; padding:6px; display:none; overflow-y:auto; border:1px solid #dbe3ef; border-radius:10px; background:#fff; box-shadow:0 18px 45px rgba(15,23,42,.2); z-index:80 }
.phone-country-picker.open .phone-country-menu { display:block }
.phone-country-option { width:100%; min-height:40px; padding:7px 9px; display:grid; grid-template-columns:24px minmax(0,1fr) auto; align-items:center; gap:8px; border:0; border-radius:7px; background:#fff; color:#1e293b; text-align:left; font:inherit; font-size:12px; cursor:pointer }
.phone-country-option:hover { background:#f5f3ff; color:#4c1d95 }
.phone-country-option-flag { font-size:17px }
.phone-country-option b { color:#64748b; font-size:11px }
.phone-input { flex:1; border:none; outline:none; padding:11px 16px; font-size:14px; background:#fff }
.otp-inputs { display:flex; gap:10px; justify-content:center; margin:16px 0 }
.otp-digit { width:48px; height:56px; border:2px solid var(--gray-200); border-radius:var(--radius-sm); text-align:center; font-size:1.4rem; font-weight:700; outline:none; transition:var(--transition) }
.otp-digit:focus { border-color:var(--primary); box-shadow:0 0 0 4px rgba(255,106,0,.1) }
.social-login { display:flex; flex-direction:column; gap:10px; margin-bottom:20px }
.btn-google { background:#fff; color:#374151; border:2px solid var(--gray-200); font-weight:600 }
.btn-google:hover { border-color:#4285f4; background:#f8fbff }
.btn-google img { width:20px; height:20px }
.btn-social-login { background:#fff; color:#374151; border:2px solid var(--gray-200); font-weight:700; justify-content:center }
.btn-social-login i { color:var(--social-color,#4285f4); font-size:18px }
.google-g-icon { width:19px; height:19px; flex:0 0 19px }
.btn-social-login:hover { border-color:var(--social-color,#4285f4); background:#f8fbff; color:#111827 }
.auth-method-link { width:100%; display:flex; align-items:center; justify-content:center; gap:7px; margin-top:12px; padding:5px; border:0; background:transparent; color:var(--navy); font:inherit; font-size:12px; font-weight:800; cursor:pointer }
.auth-method-link:hover { color:var(--primary) }
.auth-field-heading { min-height:24px; margin-bottom:6px; display:flex; align-items:center; justify-content:space-between; gap:10px }
.auth-field-heading label { margin:0; color:var(--gray-700); font-size:12px; font-weight:700 }
.auth-inline-method { padding:2px 0; border:0; background:transparent; color:var(--navy); font-size:11px; font-weight:800; cursor:pointer }
.auth-inline-method:hover { color:var(--primary) }
.auth-password-toggle { margin-top:16px; border-top:1px solid var(--gray-200); padding-top:15px }
.auth-divider { text-align:center; position:relative; margin:20px 0 }
.auth-divider::before { content:''; position:absolute; top:50%; left:0; right:0; height:1px; background:var(--gray-200) }
.auth-divider span { background:#fff; padding:0 14px; position:relative; font-size:12px; color:var(--gray-400); font-weight:500 }

/* ── UPLOAD ZONE ─────────────────────────────────────────── */
.upload-zone { border:2px dashed var(--gray-300); border-radius:var(--radius); padding:28px; text-align:center; cursor:pointer; transition:var(--transition); background:var(--gray-50) }
.upload-zone:hover,.upload-zone.dragover { border-color:var(--primary); background:var(--primary-l); }
.upload-zone input[type=file] { display:none }
.upload-zone-icon { font-size:2.4rem; color:var(--gray-400); margin-bottom:8px }
.upload-zone p { font-size:13px; color:var(--gray-600); font-weight:500 }
.upload-zone small { font-size:11px; color:var(--gray-400) }

/* ── BADGE ───────────────────────────────────────────────── */
.badge { display:inline-flex; align-items:center; padding:3px 9px; border-radius:20px; font-size:11px; font-weight:700 }
.badge-success { background:#dcfce7; color:#166534 }
.badge-warning { background:#fef9c3; color:#92400e }
.badge-danger { background:#fee2e2; color:#991b1b }
.badge-info { background:#dbeafe; color:#1e40af }
.badge-gray { background:var(--gray-100); color:var(--gray-600) }

/* ── PAGE CARD ───────────────────────────────────────────── */
.page-card { background:#fff; border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); padding:clamp(22px,4vw,38px); margin-bottom:24px; border:1px solid var(--gray-200) }
.page-card-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:24px; flex-wrap:wrap; gap:10px }
.page-card-title { font-size:1.1rem; font-weight:800; color:var(--gray-800) }

/* About */
.about-hero { background:linear-gradient(135deg,#071426 0%,#0b2a55 58%,#0f5132 100%); color:#fff; padding:clamp(48px,7vw,88px) 0; overflow:hidden; position:relative }
.about-hero:before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(255,106,0,.18),transparent 35%), radial-gradient(circle at 85% 18%,rgba(56,189,248,.22),transparent 34%); pointer-events:none }
.about-hero-grid { position:relative; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(280px,.75fr); gap:clamp(26px,5vw,72px); align-items:center }
.about-kicker { display:inline-flex; align-items:center; gap:8px; padding:7px 12px; border:1px solid rgba(255,255,255,.18); border-radius:999px; background:rgba(255,255,255,.08); color:#dbeafe; font-size:12px; font-weight:900; text-transform:uppercase; letter-spacing:.4px; margin-bottom:18px }
.about-hero h1 { font-size:clamp(2rem,5vw,4.25rem); line-height:1.02; font-weight:950; max-width:780px }
.about-hero p { margin-top:18px; max-width:720px; color:rgba(255,255,255,.82); font-size:clamp(.98rem,1.8vw,1.18rem); line-height:1.75 }
.about-hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:26px }
.about-signal-panel { display:grid; gap:12px }
.about-signal-panel div { background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.14); border-radius:8px; padding:18px; backdrop-filter:blur(12px) }
.about-signal-panel h3 { display:block; color:#fff; font-size:1rem; font-weight:900; line-height:1.25; margin-bottom:6px }
.about-signal-panel span { color:rgba(255,255,255,.72); font-size:13px; line-height:1.5 }
.about-metrics-band { background:#fff; border-bottom:1px solid var(--gray-200) }
.about-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:var(--gray-200); border-left:1px solid var(--gray-200); border-right:1px solid var(--gray-200) }
.about-metrics div { background:#fff; padding:24px 18px; text-align:center }
.about-metrics strong { display:block; font-size:clamp(1.6rem,3vw,2.25rem); font-weight:950; color:var(--primary) }
.about-metrics span { color:var(--gray-600); font-size:13px; font-weight:800 }
.about-section { padding:clamp(44px,7vw,82px) 0; background:#f8fafc }
.about-section-head { max-width:760px; margin-bottom:28px }
.about-section-head span { color:var(--primary); font-size:12px; font-weight:950; text-transform:uppercase; letter-spacing:.45px }
.about-section-head h2 { margin-top:8px; font-size:clamp(1.7rem,4vw,3rem); line-height:1.12; color:var(--gray-800); font-weight:950 }
.about-section-head p { margin-top:12px; color:var(--gray-600); line-height:1.7; font-size:1rem }
.why-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px }
.why-grid article { background:#fff; border:1px solid #e8edf4; border-radius:8px; padding:22px; min-height:220px; box-shadow:0 10px 26px rgba(15,23,42,.05); transition:var(--transition) }
.why-grid article:hover { transform:translateY(-4px); box-shadow:0 16px 34px rgba(15,23,42,.1); border-color:rgba(255,106,0,.25) }
.why-grid i { width:46px; height:46px; border-radius:8px; display:flex; align-items:center; justify-content:center; background:#fff4ec; color:var(--primary); font-size:20px; margin-bottom:16px }
.why-grid h3 { color:var(--gray-800); font-size:1rem; font-weight:900; margin-bottom:8px }
.why-grid p { color:var(--gray-600); font-size:13px; line-height:1.65 }

/* ── 3D CONFIGURATOR ─────────────────────────────────────── */
.product-media-card { overflow:visible; position:relative; z-index:25 }
.product-gallery-layout { display:grid; grid-template-columns:86px minmax(0,1fr); gap:14px; align-items:start; margin-bottom:18px }
.product-gallery-main { background:#fff; border:1px solid #e2e8f0; border-radius:18px; box-shadow:0 8px 28px rgba(15,23,42,.08) }
.product-thumb-rail { display:flex; flex-direction:column; gap:10px; max-height:560px; overflow:auto; padding:2px }
.product-thumb { width:76px; height:76px; border:1px solid #e2e8f0; border-radius:10px; background:#fff; padding:4px; cursor:pointer; overflow:hidden; transition:var(--transition) }
.product-thumb img { width:100%; height:100%; object-fit:cover; display:block; border-radius:7px }
.product-thumb.active { border:2px solid var(--primary); box-shadow:0 6px 18px rgba(255,106,0,.18) }
.product-zoom-shell { position:relative; margin:18px; overflow:visible }
.product-zoom-viewer { aspect-ratio:4/3; background-color:#f8fafc; background-position:center; background-size:contain; background-repeat:no-repeat; cursor:zoom-in; position:relative; overflow:hidden; touch-action:none; border-radius:10px }
.product-zoom-viewer:focus-visible { outline:3px solid rgba(255,106,0,.4); outline-offset:3px }
.product-image-open-hint { display:none!important }
.product-zoom-viewer:hover .product-image-open-hint { background:var(--primary); opacity:1 }
.product-zoom-lens { position:absolute; width:120px; height:120px; border:2px solid rgba(255,106,0,.75); background:rgba(255,255,255,.18); box-shadow:0 10px 28px rgba(15,23,42,.2); pointer-events:none; opacity:0; transform:translate(-50%,-50%); border-radius:8px }
.product-zoom-pane { position:absolute; top:0; left:calc(100% + 18px); width:min(420px,42vw); aspect-ratio:1/1; border:1px solid var(--gray-200); border-radius:14px; background-color:#fff; background-repeat:no-repeat; box-shadow:0 18px 48px rgba(15,23,42,.18); opacity:0; pointer-events:none; z-index:120; transition:opacity .12s ease }
.product-zoom-shell.zooming .product-zoom-lens,
.product-zoom-shell.zooming .product-zoom-pane { opacity:1 }
.configurator-wrap { background:linear-gradient(135deg,#0a0f1e,#111827); border-radius:var(--radius-xl); overflow:hidden; margin-bottom:24px; position:relative }
.configurator-canvas-wrap { position:relative; min-height:300px }
.configurator-canvas-wrap canvas { display:block; cursor:grab }
.configurator-canvas-wrap canvas:active { cursor:grabbing }
.configurator-controls { display:flex; flex-wrap:wrap; gap:12px; padding:16px 20px; background:rgba(255,255,255,.04); border-top:1px solid rgba(255,255,255,.08) }
.ctrl-group { display:flex; flex-direction:column; gap:6px; flex:1; min-width:120px }
.ctrl-label { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.7px; color:rgba(255,255,255,.45) }
.color-swatches { display:flex; gap:6px; flex-wrap:wrap }
.color-swatch { width:28px; height:28px; border-radius:50%; cursor:pointer; border:2px solid transparent; transition:var(--transition) }
.color-swatch:hover,.color-swatch.active { border-color:#fff; transform:scale(1.15) }
.mat-btn,.shape-btn { background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); color:rgba(255,255,255,.75); padding:5px 12px; border-radius:20px; font-size:11px; font-weight:600; cursor:pointer; transition:var(--transition) }
.mat-btn:hover,.shape-btn:hover,.mat-btn.active,.shape-btn.active { background:var(--primary); border-color:var(--primary); color:#fff }
.mat-btns,.shape-btns { display:flex; gap:6px; flex-wrap:wrap }
.ar-btn { display:flex; align-items:center; gap:6px; background:linear-gradient(135deg,#7c3aed,#6d28d9); color:#fff; border:none; padding:8px 16px; border-radius:var(--radius-sm); font-size:12px; font-weight:700; cursor:pointer; transition:var(--transition) }
.ar-btn:hover { filter:brightness(1.15); transform:translateY(-1px) }
.confg-hint { position:absolute; top:12px; right:12px; color:rgba(255,255,255,.4); font-size:11px; display:flex; align-items:center; gap:5px; pointer-events:none }

/* ── SEARCH & PAGINATION ─────────────────────────────────── */
.search-hero { background:linear-gradient(135deg,var(--navy),var(--navy-2)); color:#fff; padding:36px 0 }
.filter-bar { background:#fff; border-radius:var(--radius); box-shadow:var(--shadow-sm); padding:18px; display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end; margin-bottom:24px; border:1px solid var(--gray-200) }
.filter-bar .form-group { margin:0; flex:1; min-width:140px }
.pagination { display:flex; gap:6px; justify-content:center; flex-wrap:wrap; margin-top:28px }
.pg-btn { padding:9px 16px; border-radius:var(--radius-sm); background:#fff; border:2px solid var(--gray-200); color:var(--gray-700); font-size:13px; font-weight:700; transition:var(--transition); cursor:pointer }
.pg-btn.active { background:var(--primary); color:#fff; border-color:var(--primary); box-shadow:var(--shadow-glow) }
.pg-btn:hover:not(.active) { border-color:var(--primary); color:var(--primary) }

/* ── DASHBOARD ───────────────────────────────────────────── */
.dashboard-main-section { padding:22px 0 32px }
.dash-stat-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; margin-bottom:18px }
.dash-stat { background:#fff; border-radius:10px; padding:15px 18px; text-align:center; box-shadow:var(--shadow-sm); border:1px solid var(--gray-200); border-top:3px solid var(--primary); transition:var(--transition) }
.dash-stat:hover { transform:translateY(-4px); box-shadow:var(--shadow-md) }
.dash-stat-num { font-size:1.75rem; font-weight:900; background:linear-gradient(135deg,var(--primary),var(--navy)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text }
.dash-stat-label { font-size:12px; color:var(--gray-600); margin-top:4px; font-weight:500 }
.dashboard-hero { background:linear-gradient(135deg,#0f172a,var(--navy-2)); color:#fff; padding:10px 0 }
.dashboard-hero-inner { display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap }
.dashboard-user-card { display:flex; align-items:center; gap:14px; min-width:0 }
.dashboard-avatar { width:58px; height:58px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#fff; color:var(--navy); font-size:24px; font-weight:950; box-shadow:0 14px 34px rgba(0,0,0,.2); flex:0 0 auto }
.dashboard-avatar-trigger { border:0; cursor:pointer; padding:0; font-family:inherit; transition:var(--transition); overflow:hidden }
.dashboard-avatar-trigger:hover,
.dashboard-profile-menu.open .dashboard-avatar-trigger { transform:translateY(-2px); box-shadow:0 20px 46px rgba(0,0,0,.28),0 0 0 4px rgba(255,255,255,.18) }
.dashboard-avatar img { width:100%; height:100%; object-fit:cover; border-radius:50% }
.dashboard-profile-menu { flex:0 0 auto }
.dashboard-profile-panel { left:0; right:auto; top:calc(100% + 12px); color:#0f172a; z-index:1225 }
.dashboard-kicker { color:rgba(255,255,255,.72); font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.7px; margin-bottom:3px }
.dashboard-hero h1 { font-size:clamp(1.25rem,2.4vw,1.7rem); line-height:1.05; font-weight:950; margin:0 0 3px }
.dashboard-hero p { color:rgba(255,255,255,.78); font-size:13px; line-height:1.35; margin:0; max-width:620px }
.dashboard-user-meta { display:grid; grid-template-columns:1fr; gap:8px; margin-top:12px; max-width:900px }
.dashboard-meta-line { display:flex; align-items:baseline; gap:8px; min-width:0 }
.dashboard-user-meta strong { color:rgba(255,255,255,.72); font-size:11px; text-transform:uppercase; letter-spacing:.55px; flex:0 0 auto }
.dashboard-user-meta span { color:#fff; font-size:14px; font-weight:700; min-width:0; word-break:break-word }
.dashboard-hero-actions { display:flex; align-items:center; gap:9px; flex-wrap:wrap }
.dashboard-hero-btn { min-height:38px; display:inline-flex; align-items:center; gap:7px; padding:0 12px; border:1px solid rgba(255,255,255,.18); border-radius:9px; background:rgba(255,255,255,.1); color:#fff; font-size:12px; font-weight:900; backdrop-filter:blur(8px); box-shadow:0 10px 22px rgba(15,23,42,.1); transition:var(--transition); white-space:nowrap }
.dashboard-hero-btn i { color:var(--primary) }
.dashboard-hero-btn:hover { background:#fff; color:var(--navy); transform:translateY(-2px) }
.dashboard-icon-btn { min-width:86px; min-height:58px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; border:1px solid rgba(255,255,255,.18); border-radius:8px; background:rgba(255,255,255,.1); color:#fff; font-size:12px; font-weight:900; backdrop-filter:blur(8px); font-family:inherit; cursor:pointer }
.dashboard-icon-btn:hover { background:#fff; color:var(--navy); transform:translateY(-2px) }
.dashboard-menu-btn { width:46px; height:46px; border:1px solid rgba(255,255,255,.18); border-radius:10px; background:rgba(255,255,255,.1); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:17px; cursor:pointer; backdrop-filter:blur(8px); box-shadow:0 10px 22px rgba(15,23,42,.12); transition:var(--transition) }
.dashboard-menu-btn:hover { background:#fff; color:var(--navy); transform:translateY(-2px) }
.dashboard-quick-actions { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:14px }
.dashboard-field-note { margin-top:6px; color:#64748b; font-size:12px; line-height:1.45 }
.dashboard-verify-row { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:8px; margin-top:10px; align-items:center }
.dashboard-otp-input { min-width:0 }
.dashboard-avatar-manage-row { display:flex; align-items:center; gap:14px; padding:12px 14px; border:1px solid #e2e8f0; border-radius:12px; background:#f8fafc }
.dashboard-avatar-thumb { width:72px; height:72px; border-radius:50%; overflow:hidden; display:flex; align-items:center; justify-content:center; background:#fff; color:var(--navy); font-size:24px; font-weight:900; box-shadow:0 8px 20px rgba(15,23,42,.08); flex:0 0 auto }
.dashboard-avatar-thumb img { width:100%; height:100%; object-fit:cover }
.dashboard-inline-check { display:inline-flex; align-items:center; gap:8px; margin-top:10px; font-size:13px; font-weight:700; color:#0f172a; cursor:pointer }
.dashboard-inline-check input { accent-color:var(--primary) }
.dashboard-panel-overlay { position:fixed; inset:0; background:rgba(15,23,42,.38); opacity:0; visibility:hidden; transition:opacity .22s ease, visibility .22s ease; z-index:1200 }
.dashboard-settings-panel { position:fixed; top:0; right:0; width:min(360px,calc(100vw - 24px)); height:100vh; background:#fff; box-shadow:-24px 0 60px rgba(15,23,42,.18); transform:translateX(105%); transition:transform .24s ease; z-index:1210; display:flex; flex-direction:column }
.dashboard-panel-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 18px 14px; border-bottom:1px solid #e2e8f0; background:linear-gradient(135deg,#fff7ed,#ffffff) }
.dashboard-panel-kicker { font-size:11px; font-weight:900; letter-spacing:.55px; text-transform:uppercase; color:#f97316; margin-bottom:4px }
.dashboard-panel-head strong { display:block; font-size:1.05rem; color:#0f172a }
.dashboard-panel-close { width:38px; height:38px; border:1px solid #e2e8f0; border-radius:50%; background:#fff; color:#0f172a; cursor:pointer; flex:0 0 auto }
.dashboard-panel-menu { padding:16px; overflow:auto }
.dashboard-panel-profile { padding:2px 0 14px; border-bottom:1px solid #f1f5f9; margin-bottom:14px }
.dashboard-panel-profile strong,
.dashboard-panel-profile span { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.dashboard-panel-profile strong { color:#0f172a; font-size:17px; font-weight:950; line-height:1.2 }
.dashboard-panel-profile span { color:#64748b; font-size:13px; margin-top:4px }
.dashboard-panel-account-switch { max-width:none; margin:0 0 14px; box-shadow:none; background:#f8fafc }
.dashboard-panel-account-switch button { min-width:0; font-size:12px; padding:8px }
.dashboard-panel-account-switch button span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.dashboard-panel-business-picker { display:grid; gap:7px; margin:-4px 0 16px; padding:12px; border:1px solid #e2e8f0; border-radius:12px; background:#fff7ed }
.dashboard-panel-business-picker label { color:#334155; font-size:12px; font-weight:900 }
.dashboard-panel-business-picker label i { margin-right:6px; color:var(--primary) }
.dashboard-panel-business-picker select { min-width:0; height:42px }
.dashboard-panel-priority { margin-top:0 !important; padding-top:0 !important; border-top:0 !important; padding-bottom:14px; border-bottom:1px solid #f1f5f9 }
.dashboard-panel-priority a { min-height:50px }
.dashboard-panel-group + .dashboard-panel-group { margin-top:18px; padding-top:18px; border-top:1px solid #f1f5f9 }
.dashboard-panel-label { font-size:12px; font-weight:900; color:#94a3b8; text-transform:uppercase; letter-spacing:.55px; margin-bottom:10px }
.dashboard-panel-menu a { display:flex; align-items:center; gap:10px; min-height:44px; padding:0 14px; border-radius:12px; color:#0f172a; font-size:14px; font-weight:800; transition:var(--transition) }
.dashboard-panel-menu a i { width:18px; text-align:center; color:var(--primary) }
.dashboard-panel-menu a:hover { background:#f8fafc; color:var(--primary); transform:translateX(2px) }
.dashboard-panel-count { margin-left:auto; min-width:26px; height:26px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; background:#f8fafc; color:#0f172a; font-size:12px; font-weight:900; padding:0 8px }
.dashboard-panel-menu a:hover .dashboard-panel-count { background:#fff; color:var(--primary-d) }
.dashboard-panel-menu .dashboard-panel-logout { color:#dc2626; background:#fff1f2 }
.dashboard-panel-menu .dashboard-panel-logout i { color:#dc2626 }
.dashboard-panel-preferences { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px }
.dashboard-panel-preferences .dashboard-panel-label { grid-column:1/-1; margin-bottom:0 }
.dashboard-panel-preferences label { min-width:0; display:grid; gap:6px; color:#334155; font-size:11px; font-weight:850 }
.dashboard-panel-preferences label span { display:flex; align-items:center; gap:6px }
.dashboard-panel-preferences label i { color:var(--primary) }
.dashboard-panel-preferences select { min-width:0; height:38px; padding:0 8px; font-size:11px }
body.dashboard-panel-open { overflow:hidden }
body.dashboard-panel-open .dashboard-panel-overlay { opacity:1; visibility:visible }
body.dashboard-panel-open .dashboard-settings-panel { transform:translateX(0) }
.dashboard-section-nav { position:sticky; top:66px; z-index:20; display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; padding:8px 0 10px; margin-bottom:10px; background:linear-gradient(to bottom,rgba(248,250,252,.98),rgba(248,250,252,.9)) }
.dashboard-account-switch { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; max-width:520px; margin:0 auto 10px; padding:5px; border:1px solid #e2e8f0; border-radius:14px; background:#fff; box-shadow:0 8px 24px rgba(15,23,42,.07) }
.dashboard-account-switch button { min-height:42px; padding:8px 12px; border:0; border-radius:10px; display:flex; align-items:center; justify-content:center; gap:8px; background:transparent; color:#64748b; font-size:13px; font-weight:900; cursor:pointer }
.dashboard-account-switch button.active { background:linear-gradient(135deg,#0f172a,#243b70); color:#fff; box-shadow:0 7px 16px rgba(15,23,42,.2) }
.dashboard-account-switch-compact { flex:0 0 auto; display:inline-grid; grid-template-columns:repeat(2,42px); gap:3px; width:auto; margin:0 0 0 6px; padding:3px; border-color:rgba(255,255,255,.34); border-radius:999px; background:rgba(255,255,255,.94); box-shadow:0 8px 22px rgba(15,23,42,.18) }
.dashboard-account-switch-compact button { width:42px; min-height:42px; padding:0; border-radius:50%; color:#475569; font-size:16px }
.dashboard-account-switch-compact button span { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0 }
.dashboard-account-switch-compact button.active { background:#050b19; color:#fff; box-shadow:none }
.dashboard-mobile-notification { display:none; position:relative; align-items:center; justify-content:center; width:38px; height:38px; border:1px solid #e2e8f0; border-radius:50%; background:#fff; color:#0f172a }
.dashboard-mobile-notification b { position:absolute; top:-5px; right:-5px; min-width:18px; height:18px; padding:0 4px; display:flex; align-items:center; justify-content:center; border-radius:999px; background:#ef4444; color:#fff; font-size:10px; font-weight:900; box-shadow:0 0 0 2px #fff }
.dashboard-account-overview { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:22px }
.dashboard-account-overview-card { min-width:0; display:grid; grid-template-columns:38px minmax(0,1fr) auto; align-items:center; gap:10px; min-height:72px; padding:12px; border:1px solid #e2e8f0; border-radius:14px; background:#f8fafc; color:#0f172a }
.dashboard-account-overview-card > i { width:38px; height:38px; display:flex; align-items:center; justify-content:center; border-radius:11px; background:#ede9fe; color:var(--primary) }
.dashboard-account-overview-card span,.dashboard-account-overview-card strong,.dashboard-account-overview-card small { display:block; min-width:0 }
.dashboard-account-overview-card strong { font-size:13px }
.dashboard-account-overview-card small { margin-top:3px; color:#64748b; font-size:10px }
.dashboard-account-overview-card > b { min-width:25px; height:25px; display:flex; align-items:center; justify-content:center; border-radius:999px; background:#fff; font-size:11px }
.dashboard-account-readonly { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px }
.dashboard-account-readonly.editing { display:none }
.dashboard-account-readonly > div { min-width:0; display:grid; grid-template-columns:28px minmax(0,1fr); align-items:center; gap:9px; padding:9px 4px; border:0; border-bottom:1px solid #eef2f7; border-radius:0; background:transparent }
.dashboard-account-readonly > div > i { width:28px; height:28px; display:flex; align-items:center; justify-content:center; border-radius:0; background:transparent; color:var(--primary) }
.dashboard-account-readonly span,.dashboard-account-readonly small,.dashboard-account-readonly strong { display:block; min-width:0 }
.dashboard-account-readonly small { color:#64748b; font-size:10px }
.dashboard-account-readonly strong { margin-top:2px; overflow:hidden; text-overflow:ellipsis; color:#0f172a; font-size:13px }
.dashboard-account-edit-form:not(.active) { display:none!important }
.dashboard-ticket-section { margin-bottom:28px }
.dashboard-ticket-list { display:grid; gap:10px }
.dashboard-ticket-card { min-width:0; display:grid; grid-template-columns:44px minmax(0,1fr) auto; align-items:center; gap:12px; padding:14px; border:1px solid #e2e8f0; border-radius:14px; background:linear-gradient(180deg,#fff,#f8fafc); color:#0f172a; transition:var(--transition) }
.dashboard-ticket-card:hover { border-color:rgba(255,106,0,.35); box-shadow:0 12px 30px rgba(15,23,42,.09); transform:translateY(-2px) }
.dashboard-ticket-icon { width:44px; height:44px; display:flex; align-items:center; justify-content:center; border-radius:12px; background:#ede9fe; color:var(--primary); font-size:17px }
.dashboard-ticket-main { min-width:0; display:grid; gap:3px }
.dashboard-ticket-main strong { color:var(--primary); font-size:11px; letter-spacing:.35px }
.dashboard-ticket-main b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#0f172a; font-size:14px }
.dashboard-ticket-main small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#64748b; font-size:11px }
.dashboard-ticket-meta { min-width:132px; display:grid; justify-items:end; gap:5px }
.dashboard-ticket-meta small { color:#64748b; font-size:10px }
.dashboard-ticket-meta > b { color:var(--primary); font-size:11px }
.ticket-status { display:inline-flex; padding:5px 9px; border-radius:999px; background:#e0f2fe; color:#0369a1; font-size:10px; font-style:normal; font-weight:900 }
.ticket-status-new { background:#fff7ed; color:#c2410c }
.ticket-status-on_hold { background:#fef3c7; color:#92400e }
.ticket-status-pending_user { background:#ede9fe; color:#6d28d9 }
.ticket-status-resolved,.ticket-status-closed { background:#dcfce7; color:#166534 }
.dashboard-mode-nav { display:none }
.dashboard-mode-nav.active { display:flex }
.dashboard-mobile-profile-nav { display:none!important }
.dashboard-section-nav::-webkit-scrollbar { display:none }
.dashboard-section-nav a { flex:0 0 auto; display:inline-flex; align-items:center; gap:7px; min-height:36px; padding:0 13px; border:1px solid #e2e8f0; border-radius:999px; background:#fff; color:#0f172a; font-size:12px; font-weight:900; box-shadow:0 6px 16px rgba(15,23,42,.06) }
.dashboard-section-nav a.active { background:#0f172a; color:#fff; border-color:#0f172a; box-shadow:0 10px 24px rgba(15,23,42,.16) }
.dashboard-section-nav a:hover { border-color:rgba(255,106,0,.35); color:var(--primary); transform:translateY(-1px) }
.dashboard-section-nav a.active:hover { color:#fff }
.dashboard-tab-count { min-width:22px; height:22px; padding:0 7px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; background:#ef4444; color:#fff; font-size:11px; font-weight:950; line-height:1 }
.dashboard-section-nav a.active .dashboard-tab-count { background:#fff; color:#0f172a }
.dashboard-overview { margin:0 0 18px; background:#fff; border:1px solid #e2e8f0; border-radius:12px; padding:16px; box-shadow:0 12px 30px rgba(15,23,42,.07) }
.dashboard-overview-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px }
.dashboard-overview-head span { display:block; color:var(--primary); font-size:11px; font-weight:950; text-transform:uppercase; letter-spacing:.55px; margin-bottom:2px }
.dashboard-overview-head h2 { color:#0f172a; font-size:1.05rem; line-height:1.15; font-weight:950 }
.dashboard-overview-head a { min-height:34px; display:inline-flex; align-items:center; gap:7px; padding:0 12px; border-radius:8px; background:#0f172a; color:#fff; font-size:12px; font-weight:900; white-space:nowrap }
.dashboard-overview-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px }
.dashboard-overview-card { min-width:0; border:1px solid #e2e8f0; border-radius:10px; background:linear-gradient(180deg,#fff,#f8fafc); padding:12px; display:grid; grid-template-columns:38px minmax(0,1fr); align-items:center; gap:10px; position:relative; overflow:hidden }
.dashboard-overview-card > i { width:38px; height:38px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center; background:#eef2ff; color:var(--primary); font-size:15px }
.dashboard-overview-card strong { display:block; color:#0f172a; font-size:1.45rem; line-height:1; font-weight:950 }
.dashboard-overview-card span { display:block; color:#64748b; font-size:12px; font-weight:800; margin-top:3px }
.dashboard-overview-card em { grid-column:1 / -1; height:5px; border-radius:999px; background:#e2e8f0; overflow:hidden; position:relative; margin-top:2px }
.dashboard-overview-card em::before { content:''; position:absolute; inset:0 auto 0 0; width:var(--bar); border-radius:inherit; background:linear-gradient(90deg,var(--primary),var(--navy)) }
.dashboard-activity-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-top:10px }
.dashboard-activity-strip div { min-width:0; min-height:38px; display:grid; grid-template-columns:24px minmax(0,1fr) auto; align-items:center; gap:8px; padding:0 10px; border-radius:9px; background:#f8fafc; color:#334155; border:1px solid #eef2f7 }
.dashboard-activity-strip i { color:var(--primary); text-align:center }
.dashboard-activity-strip span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:800 }
.dashboard-activity-strip strong { color:#0f172a; font-size:13px; font-weight:950 }
.dashboard-analysis-filter select { min-width:220px; height:38px; font-weight:800; font-size:13px }
.dashboard-business-filter { margin-left:auto }
.dashboard-business-filter select { min-width:220px; height:38px; font-weight:800; font-size:13px }
.dashboard-analysis-split { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; align-items:start }
.dashboard-analysis-card { margin-bottom:28px }
.dashboard-analysis-card .page-card-title { display:flex; align-items:center; gap:8px }
.dashboard-analysis-card .page-card-title i { color:var(--primary) }
.dashboard-analysis-list { display:grid; gap:8px }
.dashboard-analysis-item { display:grid; grid-template-columns:44px minmax(0,1fr) auto; align-items:center; gap:10px; padding:10px; border:1px solid #eef2f7; border-radius:8px; color:#0f172a; background:#fff; transition:var(--transition) }
.dashboard-analysis-item:hover { border-color:rgba(255,106,0,.35); transform:translateY(-1px); box-shadow:0 10px 24px rgba(15,23,42,.08) }
.dashboard-analysis-item > span:nth-child(2) { display:flex; flex-direction:column; min-width:0; gap:2px }
.dashboard-analysis-item strong,
.dashboard-analysis-item small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.dashboard-analysis-item strong { font-size:13px; font-weight:900; color:#0f172a }
.dashboard-analysis-item small { font-size:12px; color:#64748b; font-weight:700 }
.dashboard-analysis-item b { min-width:42px; height:30px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; background:#f8fafc; color:#0f172a; font-size:13px; font-weight:950 }
.dashboard-market-item { grid-template-columns:32px 42px minmax(0,1fr) auto; background:linear-gradient(180deg,#ffffff,#fbfdff) }
.dashboard-market-rank { width:30px; height:30px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center; background:#f8fafc; color:#64748b; font-size:11px; font-weight:950; border:1px solid #eef2f7 }
.dashboard-market-name { display:flex; flex-direction:column; min-width:0; gap:2px }
.dashboard-section-title { display:flex; align-items:center; gap:8px; font-size:1.08rem; font-weight:900; margin:0 0 16px; color:var(--gray-800); scroll-margin-top:130px }
.dashboard-section-title i { color:var(--primary) }
.dashboard-profile-card { scroll-margin-top:130px }
.dashboard-section-toggle,
.dashboard-card-toggle { width:100%; display:flex; align-items:center; justify-content:space-between; gap:12px; border:0; background:transparent; color:inherit; font:inherit; font-weight:900; cursor:pointer; text-align:left; padding:0 }
.dashboard-section-toggle span,
.dashboard-card-toggle { display:flex; align-items:center; gap:8px }
.dashboard-card-toggle-icon,
.dashboard-section-toggle > i:last-child { color:#94a3b8; transition:transform .2s ease }
.dashboard-card-toggle-icon,.dashboard-section-toggle > i:last-child,.dashboard-section-close { display:none!important }
.dashboard-section-toggle,.dashboard-card-toggle { cursor:default }
.dashboard-section-close { margin-left:auto; width:34px; height:34px; border:1px solid #e2e8f0; border-radius:50%; background:#fff; color:#64748b; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; flex:0 0 auto; transition:var(--transition) }
.dashboard-section-close i { color:inherit }
.dashboard-section-close:hover { background:#0f172a; border-color:#0f172a; color:#fff; transform:translateY(-1px) }
.page-card-header .dashboard-section-close { margin-left:auto }
.dashboard-collapsed-section .dashboard-collapse-body { display:none }
.dashboard-collapsed-section .dashboard-card-toggle-icon,
.dashboard-collapsed-section .dashboard-section-toggle > i:last-child { transform:rotate(-90deg) }
.dashboard-tab-hidden { display:none !important }
.dashboard-social-grid { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:18px; margin-bottom:28px }
.dashboard-muted { color:var(--gray-600); font-size:13px; line-height:1.55; margin-bottom:12px }
.dashboard-soft-empty { padding:18px; border:1px dashed #cbd5e1; border-radius:8px; color:#64748b; text-align:center; background:#f8fafc; font-size:13px }
.biz-profile-health { margin:10px 0 12px; padding:10px; border:1px solid #e2e8f0; border-radius:8px; background:#f8fafc }
.biz-profile-health-head { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px }
.biz-profile-health-head span { display:inline-flex; align-items:center; gap:6px; color:#334155; font-size:12px; font-weight:950 }
.biz-profile-health-head strong { font-size:12px; font-weight:950; white-space:nowrap }
.biz-profile-health-head strong.complete { color:#047857 }
.biz-profile-health-head strong.pending { color:#b45309 }
.biz-profile-meter { height:6px; border-radius:999px; background:#e2e8f0; overflow:hidden; margin-bottom:9px }
.biz-profile-meter span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#16a34a,#0f766e) }
.biz-profile-checks { display:flex; flex-wrap:wrap; gap:6px }
.biz-profile-checks span { display:inline-flex; align-items:center; gap:5px; min-height:24px; padding:0 8px; border-radius:999px; font-size:11px; font-weight:900; border:1px solid transparent }
.biz-profile-checks span.ok { color:#047857; background:#ecfdf5; border-color:#bbf7d0 }
.biz-profile-checks span.miss { color:#64748b; background:#fff; border-color:#e2e8f0 }
.biz-profile-checks i { font-size:10px }
.biz-profile-fix { margin-top:9px; min-height:30px; display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:0 10px; border-radius:8px; background:#0f172a; color:#fff; font-size:12px; font-weight:900 }
.biz-profile-fix:hover { color:#fff; transform:translateY(-1px) }
.biz-upgrade-link { display:inline-flex; align-items:center; color:#0f172a; text-decoration:none }
.dashboard-upgrade-card .page-card-title { display:flex; align-items:center; gap:8px }
.dashboard-upgrade-card .page-card-title i { color:var(--primary) }
.dashboard-upgrade-business-select { display:block; width:min(100%,450px); margin:0 0 18px }
.dashboard-upgrade-business-select select { width:100%; max-width:none; min-height:50px; padding:0 44px 0 24px; line-height:1.2; font-weight:850; font-size:15px }
.dashboard-upgrade-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; align-items:stretch }
.dashboard-upgrade-plan { position:relative; border:1px solid var(--gray-200); border-radius:8px; padding:22px; background:#fff; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; gap:10px; min-width:0; overflow:hidden }
.dashboard-upgrade-plan.featured { border-color:rgba(255,106,0,.45); box-shadow:0 16px 38px rgba(255,106,0,.15) }
.dashboard-upgrade-badge { position:absolute; top:14px; right:14px; padding:4px 9px; border-radius:999px; background:var(--primary); color:#fff; font-size:10px; font-weight:950; text-transform:uppercase }
.dashboard-upgrade-icon { width:44px; height:44px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center; background:#fff3ec; color:var(--primary); font-size:18px; margin-bottom:2px }
.dashboard-upgrade-plan h4 { color:#0f172a; font-size:18px; font-weight:950; margin:0 }
.dashboard-upgrade-plan p { color:#64748b; font-size:13px; line-height:1.45; margin:0; min-height:38px }
.dashboard-upgrade-plan > strong { color:#0f172a; font-size:24px; font-weight:950 }
.dashboard-upgrade-plan > strong small { font-size:12px; font-weight:900 }
.dashboard-upgrade-plan ul { list-style:none; padding:0; margin:0; display:grid; gap:7px }
.dashboard-upgrade-plan li { color:#475569; font-size:12px; font-weight:750; display:flex; gap:7px; align-items:flex-start }
.dashboard-upgrade-plan li i { color:#16a34a; margin-top:2px }
.dashboard-upgrade-plan form { margin-top:auto }
.dashboard-upgrade-plan .btn { width:100%; justify-content:center; background:linear-gradient(135deg,var(--primary),var(--primary-d)); color:#fff; box-shadow:0 4px 16px var(--primary-glow) }
.dashboard-upgrade-plan .btn:hover { color:#fff; box-shadow:var(--shadow-glow) }
.dashboard-thread-list { display:grid; gap:12px }
.dashboard-thread-item { border:1px solid #e2e8f0; border-radius:8px; padding:12px; background:#fff }
.dashboard-thread-main { display:grid; grid-template-columns:42px minmax(0,1fr); gap:10px; align-items:start }
.dashboard-thread-head { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:4px }
.dashboard-thread-head strong { color:#0f172a; font-size:13px; font-weight:950 }
.dashboard-thread-head a { color:var(--navy); font-size:13px; font-weight:850; max-width:320px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.dashboard-thread-head small { color:#94a3b8; font-size:12px; margin-left:auto }
.dashboard-thread-main p { color:#475569; font-size:13px; line-height:1.6; margin:0 }
.dashboard-owner-reply,
.owner-reply-box { margin-top:10px; padding:10px 12px; border-left:3px solid #16a34a; border-radius:8px; background:#f0fdf4; color:#166534 }
.dashboard-owner-reply strong,
.owner-reply-box strong { display:block; font-size:12px; font-weight:950; margin-bottom:4px; color:#047857 }
.dashboard-owner-reply span,
.owner-reply-box p { display:block; margin:0; color:#166534; font-size:13px; line-height:1.55 }
.dashboard-reply-form { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:end; margin-top:10px }
.dashboard-reply-form.compact { grid-template-columns:minmax(180px,1fr); min-width:220px; margin-top:0; margin-bottom:8px }
.dashboard-reply-form textarea { resize:vertical; min-height:42px; font-size:13px }
.dashboard-media-cell { display:flex; align-items:center; gap:10px; min-width:190px }
.dashboard-media-cell.compact { min-width:140px }
.dashboard-media-cell > span:last-child { display:flex; flex-direction:column; gap:2px; min-width:0 }
.dashboard-media-cell strong,
.dashboard-media-cell a { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; line-height:1.25 }
.dashboard-media-cell small { color:#64748b; font-size:12px; line-height:1.25; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.dashboard-row-thumb { width:42px; height:42px; flex:0 0 42px; overflow:hidden; display:inline-flex; align-items:center; justify-content:center; background:#eef2ff; color:#0f172a; border:1px solid #e2e8f0; font-size:15px; font-weight:950 }
.dashboard-row-thumb.square { border-radius:8px }
.dashboard-row-thumb.round { border-radius:50% }
.dashboard-row-thumb img { width:100%; height:100%; object-fit:cover }
.dashboard-row-thumb i { color:var(--primary); font-size:16px }
.dashboard-following-list { display:grid; gap:9px; max-height:320px; overflow:auto; padding-right:2px }
.dashboard-following-item { display:grid; grid-template-columns:42px minmax(0,1fr); column-gap:10px; align-items:center; padding:9px; border:1px solid #e2e8f0; border-radius:8px; color:#0f172a; background:#fff; transition:var(--transition) }
.dashboard-following-item:hover { border-color:rgba(255,106,0,.32); transform:translateY(-1px); box-shadow:0 8px 20px rgba(15,23,42,.07) }
.dashboard-following-item span { grid-row:1 / span 2; width:42px; height:42px; border-radius:50%; overflow:hidden; display:flex; align-items:center; justify-content:center; background:#fff7ed; color:var(--primary); font-weight:900 }
.dashboard-following-item img { width:100%; height:100%; object-fit:cover }
.dashboard-following-item strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px }
.dashboard-following-item small { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#64748b; font-size:12px }
.dashboard-interest-list { display:flex; flex-wrap:wrap; gap:8px; max-height:320px; overflow:auto; padding:2px 2px 12px }
.dashboard-interest-pill { cursor:pointer }
.dashboard-interest-pill input { position:absolute; opacity:0; pointer-events:none }
.dashboard-interest-pill span { min-height:32px; display:inline-flex; align-items:center; gap:6px; padding:0 11px; border:1px solid #e2e8f0; border-radius:999px; background:#fff; color:#334155; font-size:12px; font-weight:850; transition:var(--transition) }
.dashboard-interest-pill.sub span { background:#f8fafc; font-weight:750 }
.dashboard-interest-pill input:checked + span { background:#0f172a; color:#fff; border-color:#0f172a; box-shadow:0 8px 18px rgba(15,23,42,.13) }
.interest-feed-section { background:#f8fafc }

/* ── RESPONSIVE ──────────────────────────────────────────── */
@media(min-width:1401px) {
  :root {
    --edge-pad: 36px;
    --section-y: 84px;
    --hero-h: 600px;
    --compact-gap: 18px;
  }
  html { font-size:16px }
  .container { max-width:1560px }
  .ha-consultation,.ha-blog,.ha-why,.ha-post-req { padding:11px 18px; font-size:12px }
  .ha-list-free { padding:8px 14px 8px 15px; font-size:15px }
  .cat-navbar-inner { min-height:54px }
  .cni-item { padding:16px 22px; font-size:14px }
  .biz-grid { grid-template-columns:repeat(auto-fill,minmax(330px,1fr)); gap:30px }
  .biz-cover { height:185px }
  .prod-grid { grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:28px }
  .prod-img { height:238px }
  .footer-grid { gap:56px }
}

@media(max-width:1400px) and (min-width:769px) {
  :root {
    --edge-pad: 18px;
    --section-y: 52px;
    --hero-h: 440px;
    --compact-gap: 10px;
  }
  html { font-size:14px }
  .top-bar-inner { gap:8px }
  .top-bar-left,.top-bar-right { gap:8px }
  .top-bar-left { flex:1 1 auto }
  .top-bar-right { flex:0 1 auto }
  .top-bar-left span,.top-bar-right a { font-size:11px }
  .language-select { width:108px; max-width:108px }
  .top-social a { width:22px; height:22px }
  .main-header-inner { gap:12px; padding:7px 0 }
  .site-logo img { width:var(--site-logo-width,136px); height:var(--site-logo-height,40px); max-width:none }
  .main-header.search-docked .brand-header-search { flex-basis:340px; max-width:520px }
  .brand-header-search select { width:116px }
  .brand-header-search button { padding:0 12px }
  .ha-consultation,.ha-blog,.ha-why,.ha-post-req { padding:7px 10px; font-size:10px }
  .ha-list-free { padding:7px 10px 7px 11px; font-size:13px }
  .cat-navbar-inner { min-height:40px }
  .cni-item { padding:10px 11px; font-size:11.5px }
  .biz-grid { grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:16px }
  .biz-cover { height:130px }
  .prod-grid { grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:16px }
  .prod-img { height:165px }
  .footer-grid { gap:26px }
}

@media(max-width:1124px) and (min-width:769px) {
  :root { --compact-gap: 6px }
  .top-bar > .container { padding:0 14px }
  .main-header > .container { padding-left:28px }
  .top-bar-inner { gap:8px; justify-content:space-between }
  .top-bar-left { display:flex; flex:0 0 auto; overflow:visible }
  .top-bar-right { flex:1 1 auto; min-width:0; gap:6px; justify-content:flex-end; overflow:hidden }
  .free-badge,
  .top-social { display:none }
  .support-chat-btn { padding:4px 10px; font-size:11px }
  .top-bar-right a { font-size:10.5px }
  .top-bar-sep { height:12px }
  .currency-select { max-width:82px }
  .language-select { width:92px; min-width:92px; max-width:92px }
  .main-header.search-docked .brand-header-search { flex-basis:280px; max-width:430px; min-width:220px }
  .brand-header-search { height:36px }
  .brand-header-search select { width:102px; font-size:11px }
  .brand-header-search input { font-size:11.5px; padding:0 10px }
  .brand-header-search button span { display:none }
  .brand-header-search button { padding:0 12px }
  .header-greeting { padding:6px 9px; font-size:11px }
}

@media(max-width:1024px) {
  .top-bar-left { display:flex }
  .top-bar-right { flex:1 1 auto; justify-content:flex-end; flex-wrap:nowrap }
  .plans-goal-grid { grid-template-columns:1fr 1fr }
  .plans-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
  .plans-detail-grid { grid-template-columns:1fr }
  .dash-plan-list { grid-template-columns:repeat(2,minmax(0,1fr)) }
  .footer-grid { grid-template-columns:1fr 1fr 1fr; gap:28px }
  .footer-col-brand { grid-column:span 3 }
}
@media(max-width:768px) {
  .top-bar-left { display:flex }
  .top-bar > .container,
  .main-header > .container,
  .cat-navbar > .container,
  .site-footer .container { padding:0 14px }
  .main-header > .container { padding-left:22px }
  .top-bar-inner { gap:8px; justify-content:space-between }
  .top-bar-right { min-width:0; justify-content:flex-end; flex-wrap:nowrap }
  .free-badge,
  .top-social { display:none }
  .support-chat-btn span { display:none }
  .support-chat-btn { width:30px; height:30px; padding:0; justify-content:center }
  .top-consultation-btn { min-height:30px; padding:5px 9px; border:1px solid rgba(255,255,255,.22); border-radius:8px; display:inline-flex; align-items:center; gap:6px; color:#fff; font-size:10px; font-weight:800; white-space:nowrap }
  .top-consultation-btn i { color:#ffb37d }
  .hero-bottom-nav,.hero-all-category,.hero-popular-line,.hero-consultation-btn { display:none!important }
  .consult-modal { width:calc(100vw - 22px); max-height:calc(100vh - 22px) }
  .consult-modal-head { padding:17px 18px }
  .consult-form { padding:18px }
  .consult-grid { grid-template-columns:1fr }
  .language-select { width:104px; max-width:104px }
  .main-header-inner { padding:4px 0; gap:10px; flex-wrap:wrap }
  .main-header.search-docked .brand-header-search { order:3; flex:0 0 100%; max-width:none; min-width:0; margin-left:0 }
  .brand-header-search { height:38px }
  .brand-header-search select { display:none }
  .brand-header-search button span { display:none }
  .brand-header-search button { padding:0 14px }
  .plans-hero-actions { flex-direction:column; align-items:stretch }
  .plans-hero-actions .btn { justify-content:center }
  .plans-hero-points { flex-direction:column }
  .plans-goal-grid,
  .plans-faq-grid { grid-template-columns:1fr }
  .plans-detail-panel { padding:18px }
  .plans-steps li { padding-left:38px }
  .header-category-menu { order:3; flex:0 0 auto }
  .header-category-btn { height:36px; padding:0 12px; font-size:12px }
  .header-category-dropdown { left:-14px; width:calc(100vw - 28px); height:min(620px,calc(100vh - 118px)); grid-template-columns:150px 1fr }
  .header-category-sidebar { padding:8px }
  .header-category-link { padding:9px 8px; font-size:11px; gap:7px }
  .header-category-link i { width:14px }
  .header-category-panels { padding:12px }
  .header-subcategory-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px }
  .header-subcategory-grid a { min-height:104px; font-size:11px; padding:9px 6px }
  .header-subcategory-grid span,.header-subcategory-grid i { width:56px; height:56px }
  .hero-consultation-btn { min-height:30px; padding:5px 12px; font-size:11px }
  .hero-consultation-btn i { font-size:14px }
  .header-greeting { max-width:130px; overflow:hidden; text-overflow:ellipsis; padding:6px 8px; font-size:11px }
  .header-actions { display:flex; margin-left:auto }
  .header-actions a { display:none }
  .mob-menu-btn { display:none }
  .cat-navbar > .container { padding:0 }
  .cat-navbar-inner { flex-direction:row; max-height:none; min-height:42px; overflow:visible; transition:none; padding:0 }
  .cat-navbar-inner.open { max-height:none; padding:0 }
  .cat-scroll-viewport { flex:1 1 auto; width:auto; min-width:0; overflow:auto }
  .cat-scroll-track { width:max-content; min-width:max-content; flex-direction:row; align-items:center; animation:none }
  .cat-scroll-track [aria-hidden="true"] { display:flex }
  .cni-mobile-toggle { display:none }
  .cni-item { width:auto; padding:11px 12px; border-bottom:0; font-size:11.5px }
  .cni-item::after { display:block }
  .cni-highlight { margin-left:0; width:auto }
  .hero-slider { max-height:300px }
  .slide img,.slide video { height:300px }
  .slide-overlay { padding:22px }
  .slide-content h2 { font-size:1.3rem }
  .slide-content p { display:none }
  .home-search-band { padding:0 }
  .home-top-search-wrap { gap:8px }
  .home-top-search { width:100%; border-radius:10px }
  .home-search-close,.header-search-toggle { width:38px; height:38px; border-radius:10px }
  .home-promo-strip { bottom:10px; padding:0 }
  .home-promo-row { display:flex; gap:8px; padding-right:40px }
  .home-promo-card,.home-promo-card.featured { flex:0 0 min(78vw,340px); height:86px; min-height:0 }
  .home-promo-card img,.home-promo-card video,.home-promo-card iframe { min-height:0 }
  .home-promo-copy { padding:14px }
  .home-hero-shell.has-promo .slider-dots { bottom:20px }
  .hero-search-box input { padding:14px 14px; font-size:13px }
  .hero-search-box button { padding:0 18px }
  .plans-hero-grid { grid-template-columns:1fr; gap:18px }
  .plans-business-strip { align-items:flex-start; flex-direction:column }
  .plans-grid { grid-template-columns:1fr }
  .dash-plan-head { align-items:flex-start; flex-direction:column }
  .dash-plan-list { grid-template-columns:1fr }
  .hero-bottom-inner { gap:8px; min-height:34px }
  .hero-all-btn { height:28px; padding:0 10px; font-size:12px }
  .hero-category-dropdown { left:0; width:calc(100vw - 28px); height:min(420px,calc(100vh - 165px)); grid-template-columns:145px 1fr }
  .hero-category-sidebar { padding:8px }
  .hero-category-link { padding:9px 8px; font-size:11px; gap:7px }
  .hero-category-link i { width:14px }
  .hero-category-panels { padding:12px }
  .hero-subcategory-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px }
  .hero-subcategory-grid a { min-height:104px; font-size:11px; padding:9px 6px }
  .hero-subcategory-grid span,.hero-subcategory-grid i { width:56px; height:56px }
  .hero-popular-line > span { display:none }
  .about-hero-grid { grid-template-columns:1fr }
  .about-signal-panel { grid-template-columns:1fr }
  .about-metrics { grid-template-columns:repeat(2,minmax(0,1fr)) }
  .why-grid { grid-template-columns:1fr }
  .why-grid article { min-height:auto }
  .journey-section { min-height:720px }
  .journey-stats { left:14px; right:14px; top:auto; bottom:66px; width:auto; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px }
  .journey-stat { min-height:58px; padding:10px }
  .journey-stat:first-child { grid-column:auto }
  .journey-stat span { font-size:1.15rem }
  .journey-stat small { font-size:9px }
  .category-showcase-grid { grid-template-columns:1fr; gap:14px }
  .category-showcase-card { min-height:0 }
  .category-showcase-media { flex-basis:34%; min-width:104px }
  .category-showcase-body { padding:14px }
  .category-showcase-head h3 { font-size:15px }
  .category-sub-grid { grid-template-columns:1fr }
  .category-sub-item { min-height:30px; font-size:11.5px }
  .alibaba-cat-shell { display:block; padding:14px; border-radius:12px; height:min(680px,calc(100vh - 120px)); min-height:480px; overflow:hidden }
  .alibaba-cat-sidebar { position:relative; top:auto; height:auto; max-height:92px; display:flex; gap:8px; overflow:auto; border-right:0; border-bottom:1px solid var(--gray-200); padding:0 0 12px; margin-bottom:18px }
  .alibaba-cat-main { height:calc(100% - 110px); overflow:auto; padding-right:0 }
  .alibaba-cat-sidebar-title { flex:0 0 auto; margin:0; padding:10px 12px; font-size:13px; border-left-width:3px }
  .alibaba-cat-link { flex:0 0 auto; padding:10px 12px; font-size:12px; gap:8px; background:#f8fafc; border:1px solid var(--gray-200) }
  .alibaba-cat-link i { width:auto; font-size:14px }
  .alibaba-for-you-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px 10px }
  .alibaba-img-circle { width:82px; height:82px }
  .alibaba-hot { right:calc(50% - 38px); top:4px }
  .alibaba-for-you-item { font-size:12px }
  .alibaba-section-head h3,.alibaba-cat-section > h3 { font-size:18px }
  .alibaba-selection-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px }
  .alibaba-selection-item { min-height:118px; padding:10px 8px }
  .alibaba-selection-item span { width:68px; height:68px }
  .alibaba-selection-item strong { font-size:12px }
  .biz-grid,.prod-grid { grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:14px }
  .form-grid-2 { grid-template-columns:1fr }
  .span-2 { grid-column:auto }
  .footer-grid { grid-template-columns:1fr 1fr; gap:22px }
  .footer-col-brand { grid-column:span 2 }
  .footer-bottom-inner { flex-direction:column; text-align:center }
  .configurator-controls { flex-direction:column }
  .product-zoom-shell { margin:12px }
  .product-media-card { overflow:hidden }
  .product-gallery-layout { grid-template-columns:1fr; gap:10px }
  .product-thumb-rail { order:2; flex-direction:row; max-height:none; overflow-x:auto; padding-bottom:4px }
  .product-thumb { width:70px; height:70px; flex:0 0 auto }
  .business-gallery-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
  .product-zoom-pane,.product-zoom-lens { display:none }
  .product-zoom-shell.zooming .product-zoom-viewer { background-size:220%; cursor:zoom-out }
}
@media(max-width:480px) {
  .cat-grid { grid-template-columns:repeat(3,1fr); gap:10px }
  .biz-grid,.prod-grid { grid-template-columns:1fr 1fr }
  .stats-bar-inner { gap:12px }
  .stat-num { font-size:1.4rem }
  .footer-grid { grid-template-columns:1fr 1fr; gap:24px 18px }
  .footer-col-brand { grid-column:span 2 }
  .footer-col { text-align:center }
  .footer-logo,.footer-social { justify-content:center }
  .footer-links a,.footer-contact li { justify-content:center }
  .footer-contact li { align-items:center }
  .footer-h { font-size:11px }
  .footer-links a,.footer-contact li { font-size:12px }
  .hero-search-box select { display:none }
  .otp-digit { width:40px; height:48px; font-size:1.2rem }
}

/* ── SCROLL ANIMATIONS ───────────────────────────────────── */
.reveal { opacity:0; transform:translateY(24px); transition:opacity .65s cubic-bezier(.4,0,.2,1), transform .65s cubic-bezier(.4,0,.2,1) }
.reveal.revealed { opacity:1; transform:none }
.reveal-left { opacity:0; transform:translateX(-30px); transition:opacity .65s cubic-bezier(.4,0,.2,1), transform .65s cubic-bezier(.4,0,.2,1) }
.reveal-left.revealed { opacity:1; transform:none }
.reveal-right { opacity:0; transform:translateX(30px); transition:opacity .65s cubic-bezier(.4,0,.2,1), transform .65s cubic-bezier(.4,0,.2,1) }
.reveal-right.revealed { opacity:1; transform:none }

/* ── PAGE SPECIFICS ──────────────────────────────────────── */
.page-wrap { max-width:820px; margin:32px auto; padding:0 16px }
.form-section-title { font-size:15px; font-weight:800; color:var(--gray-800); border-bottom:2px solid var(--gray-200); padding-bottom:8px; margin:28px 0 18px }
.img-preview { width:100%; max-height:180px; object-fit:contain; border-radius:var(--radius-sm); border:1px solid var(--gray-200); display:none }
.img-preview.show { display:block; margin-top:8px }
.upload-preview-card { position:relative; display:block; width:90px; height:70px; border:1px solid #e2e8f0; border-radius:8px; overflow:hidden; background:#fff }
.upload-preview-card.square { width:76px; height:76px }
.upload-preview-card img { width:100%; height:100%; object-fit:cover; display:block }
.upload-remove-btn { position:absolute; top:4px; right:4px; z-index:3; width:22px; height:22px; border:0; border-radius:999px; background:#ef4444; color:#fff; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; font-size:11px; box-shadow:0 3px 10px rgba(15,23,42,.2) }
.upload-remove-btn:hover { background:#dc2626 }
.upload-clear-link { margin-top:8px; border:0; background:transparent; color:#ef4444; font-size:13px; font-weight:800; gap:6px; align-items:center; cursor:pointer }
.business-video-frame { aspect-ratio:16/9; width:100%; overflow:hidden; border-radius:8px; background:#0f172a }
.business-video-frame iframe { width:100%; height:100%; display:block; border:0 }
.product-video-frame { aspect-ratio:16/9; width:100%; overflow:hidden; border-radius:12px; background:#0f172a; border:1px solid var(--gray-200) }
.product-video-frame iframe { width:100%; height:100%; display:block; border:0 }
.review-image-grid { display:flex; gap:8px; flex-wrap:wrap; margin-top:10px }
.review-image-thumb { width:88px; height:72px; border-radius:8px; overflow:hidden; border:1px solid var(--gray-200); background:#fff; display:block }
.review-image-thumb img { width:100%; height:100%; object-fit:cover; display:block; transition:var(--transition) }
.review-image-thumb:hover img { transform:scale(1.05) }
.product-enquiry-box summary { list-style:none; cursor:pointer }
.product-enquiry-box summary::-webkit-details-marker { display:none }
.product-enquiry-form { margin-top:10px; padding:14px; border:1px solid var(--gray-200); border-radius:12px; background:#fff }
.product-enquiry-form .form-group { margin-bottom:10px }
.product-enquiry-modal {
  position: fixed;
  inset: 0;
  z-index: 4000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 18px;
}
.product-enquiry-modal.open {
  display: flex;
}
.product-enquiry-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, .58);
  backdrop-filter: blur(2px);
}
.product-enquiry-panel {
  position: relative;
  width: min(560px, 100%);
  max-height: min(90vh, 720px);
  overflow: auto;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 24px 80px rgba(15, 23, 42, .28);
}
.product-enquiry-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 18px 12px;
  border-bottom: 1px solid var(--gray-200);
}
.product-enquiry-head small {
  display: block;
  color: var(--primary);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: 4px;
}
.product-enquiry-head h3 {
  margin: 0;
  color: var(--gray-900);
  font-size: 18px;
  line-height: 1.25;
}
.product-enquiry-head button {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 8px;
  background: var(--gray-100);
  color: var(--gray-700);
  cursor: pointer;
}
.product-enquiry-form-panel {
  margin: 0;
  border: 0;
  border-radius: 0;
  padding: 18px;
}
body.product-enquiry-locked {
  overflow: hidden;
}
.business-profile-layout { display:grid; grid-template-columns:2fr 1fr; gap:24px; align-items:start }
.biz-cover-wrap { height:260px; background:#eef2f7; border-radius:var(--radius-lg) var(--radius-lg) 0 0; overflow:visible; position:relative; display:flex; align-items:center; justify-content:center }
.biz-cover-wrap img { width:100%; height:100%; object-fit:cover; object-position:center; display:block }
.business-gallery-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px }
.business-gallery-item { aspect-ratio:4/3; border:1px solid var(--gray-200); border-radius:8px; padding:0; overflow:hidden; background:#fff; cursor:pointer }
.business-gallery-item img { width:100%; height:100%; object-fit:cover; display:block; transition:var(--transition) }
.business-gallery-item:hover img { transform:scale(1.04) }
@media(max-width:768px){ .business-gallery-grid { grid-template-columns:repeat(2,minmax(0,1fr)) } }
.biz-profile-body { background:#fff; border-radius:0 0 var(--radius-lg) var(--radius-lg); padding:62px clamp(22px,4vw,38px) clamp(22px,4vw,38px) }
.biz-profile-logo { position:absolute; left:32px; bottom:-48px; z-index:2; width:96px; height:96px; border-radius:50%; border:5px solid #fff; box-shadow:var(--shadow-md); overflow:hidden; background:#fff; display:flex; align-items:center; justify-content:center; font-size:2.2rem; font-weight:900; color:var(--navy); margin:0; padding:0 }
.biz-profile-logo img { display:block; width:112%; height:112%; object-fit:cover; background:#fff }
.biz-verified-badge { display:inline-flex; align-items:center; gap:5px; background:linear-gradient(135deg,#dcfce7,#bbf7d0); color:#166534; padding:4px 14px; border-radius:20px; font-size:12px; font-weight:700; margin-bottom:10px; border:1px solid #86efac }
.business-follow-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:0 0 18px }
.business-follow-row form { margin:0 }
.business-follow-btn { min-height:38px; border:0; border-radius:8px; padding:0 15px; display:inline-flex; align-items:center; justify-content:center; gap:8px; background:#0f172a; color:#fff; font-size:13px; font-weight:900; cursor:pointer; box-shadow:0 10px 22px rgba(15,23,42,.14); transition:var(--transition) }
.business-follow-btn:hover { background:var(--primary); color:#fff; transform:translateY(-2px) }
.business-follow-btn.active { background:#dcfce7; color:#166534; box-shadow:none; border:1px solid #86efac }
.business-follow-count { min-height:34px; display:inline-flex; align-items:center; gap:7px; padding:0 12px; border:1px solid var(--gray-200); border-radius:8px; background:#fff; color:var(--gray-600); font-size:12px; font-weight:800 }
.star-rating .fa-star { color:#f59e0b; font-size:16px }
.star-rating .fa-star.empty { color:var(--gray-300) }
@media(max-width:860px){
  .business-profile-layout { grid-template-columns:1fr !important; gap:16px !important }
  .business-profile-sidebar { position:static !important; top:auto !important }
  .biz-cover-wrap { height:auto; min-height:180px; aspect-ratio:3/1; border-radius:12px 12px 0 0 }
  .biz-profile-body { padding:54px 18px 24px }
  .biz-profile-logo { left:18px; bottom:-42px; width:84px; height:84px; font-size:1.8rem; padding:0 }
}

/* ── LOCATION POPUP ─────────────────────────────────────── */
.location-popup { position:fixed; bottom:24px; right:24px; background:#fff; border-radius:var(--radius-lg); box-shadow:var(--shadow-lg), 0 0 0 1px rgba(0,0,0,.06); padding:18px 22px; max-width:320px; z-index:500; animation:slideUp .4s ease; border-left:4px solid var(--primary) }
@keyframes slideUp { from{transform:translateY(20px);opacity:0} to{transform:none;opacity:1} }
.location-popup-title { font-weight:800; font-size:14px; color:var(--gray-800); margin-bottom:6px; display:flex; align-items:center; gap:7px }
.location-popup-title i { color:var(--primary) }
.location-popup-body { font-size:13px; color:var(--gray-600); line-height:1.6 }
.location-popup-close { position:absolute; top:10px; right:12px; background:none; border:none; font-size:18px; cursor:pointer; color:var(--gray-400); line-height:1 }
.location-popup-close:hover { color:var(--gray-700) }

/* ── SEARCH AUTOCOMPLETE ─────────────────────────────────── */
.search-ac-wrap { position:relative; flex:1; min-width:0; display:flex; }
.search-ac-wrap input { width:100%; }
.ac-dropdown { display:none; position:absolute; top:calc(100% + 6px); left:0; right:0; background:#fff; border-radius:12px; box-shadow:0 8px 32px rgba(0,0,0,.18), 0 0 0 1px rgba(0,0,0,.06); z-index:9999; overflow:hidden; max-height:380px; overflow-y:auto; }
.ac-dropdown.ac-open { display:block; animation:acFadeIn .15s ease; }
@keyframes acFadeIn { from{opacity:0;transform:translateY(-6px)} to{opacity:1;transform:none} }
.ac-group-label { font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--gray-400); padding:10px 16px 4px; }
.ac-item { display:flex; align-items:center; gap:11px; padding:10px 16px; cursor:pointer; transition:background .12s; border-bottom:1px solid var(--gray-100); text-decoration:none; }
.ac-item:last-child { border-bottom:none; }
.ac-item:hover, .ac-item.ac-active { background:var(--primary-l); }
.ac-item-icon { width:32px; height:32px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:14px; flex-shrink:0; }
.ac-item-icon.product { background:linear-gradient(135deg,#fff3ec,#ffe4cc); color:var(--primary); }
.ac-item-icon.business { background:linear-gradient(135deg,#e0f2fe,#bae6fd); color:var(--navy-2); }
.ac-item-text { flex:1; min-width:0; }
.ac-item-label { font-size:13.5px; font-weight:600; color:var(--gray-800); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ac-item-label mark { background:none; color:var(--primary); font-weight:800; }
.ac-item-sub { font-size:11.5px; color:var(--gray-400); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ac-item-arrow { color:var(--gray-300); font-size:12px; flex-shrink:0; }
.ac-no-results { padding:18px 16px; text-align:center; color:var(--gray-400); font-size:13px; }
.ac-footer { padding:10px 16px; text-align:center; border-top:1px solid var(--gray-100); }
.ac-footer a { font-size:12.5px; color:var(--primary); font-weight:700; text-decoration:none; }
.ac-footer a:hover { text-decoration:underline; }

/* ══ HEADER REDESIGN — Premium White ══════════════════════════ */
.main-header {
  background: #fff !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-bottom: none !important;
  border-image: none !important;
  box-shadow: none !important;
  position: sticky;
  top: 0;
  z-index: 100;
}
/* Tricolor accent line at very bottom */
.main-header::after { display: none !important; }

/* Logo text */
.main-header .site-logo {
  min-height: 52px;
  padding: 7px 13px 7px 8px;
  border: 1px solid rgba(226,232,240,.88);
  border-radius: 16px;
  background:#fff;
  box-shadow:none;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.main-header .site-logo:hover {
  transform: translateY(-1px);
  border-color: rgba(56,189,248,.36);
  box-shadow: 0 12px 30px rgba(15,23,42,.1);
}
.main-header .logo-box {
  border-radius: 11px;
  box-shadow: 0 10px 22px rgba(255,106,0,.16);
}
.main-header .logo-name { color: var(--navy) !important; font-weight: 500 !important; }
.main-header .logo-tagline { color: var(--gray-400) !important; font-weight: 400 !important; }

/* Header category dropdown stays out of the sticky header. */
.main-header .header-category-menu,
.main-header.search-docked .header-category-menu {
  display: none !important;
  flex: 0 0 0 !important;
  width: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(-6px) !important;
}

/* Category button */
.main-header .header-category-btn {
  background: #fff !important;
  color: var(--gray-800) !important;
  border-color: var(--gray-200) !important;
  box-shadow: 0 2px 8px rgba(15,23,42,.07) !important;
}
.main-header .header-category-btn i:first-child { color: var(--primary) !important; }
.main-header .header-category-btn:hover {
  background: var(--primary-l) !important;
  border-color: rgba(255,106,0,.3) !important;
  color: var(--primary-d) !important;
}

/* Search — always visible */
.brand-header-search {
  flex: 1 1 400px !important;
  max-width: 580px !important;
  min-width: 200px !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
  border-radius: 50px !important;
  overflow: hidden !important;
  height: 42px !important;
  border: 1.5px solid var(--gray-200) !important;
  box-shadow: 0 2px 12px rgba(15,23,42,.07), inset 0 1px 3px rgba(15,23,42,.04) !important;
  background: #fafbfc !important;
}
.brand-header-search:focus-within {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px rgba(255,106,0,.12), 0 2px 12px rgba(15,23,42,.07) !important;
  background: #fff !important;
}
.main-header.search-docked .brand-header-search {
  flex: 1 1 400px !important;
  max-width: 580px !important;
}
.brand-header-search select {
  background: transparent !important;
  border-right: 1px solid var(--gray-200) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  color: var(--gray-700) !important;
}
.brand-header-search input {
  font-size: 13px !important;
  font-weight: 400 !important;
  color: var(--gray-800) !important;
  background: transparent !important;
}
.brand-header-search input::placeholder { color: var(--gray-400) !important; }
.brand-header-search button {
  border-radius: 0 50px 50px 0 !important;
  background: linear-gradient(135deg, var(--primary), var(--primary-d)) !important;
  font-weight: 500 !important;
}

.header-user-greet {
  display: none !important;
}

/* ── Wishlist button in header ──────────────────────────────── */
.header-wishlist-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
  text-decoration: none;
  padding: 7px 13px;
  border-radius: 12px;
  background: #fff;
  border: 1.5px solid var(--gray-200);
  box-shadow: 0 2px 8px rgba(15,23,42,.06);
  transition: background .18s, border-color .18s, transform .18s, box-shadow .18s;
  cursor: pointer;
}
.header-wishlist-btn:hover {
  background: #fff0f2;
  border-color: #fda4af;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(251,113,133,.18);
}
.header-wishlist-icon-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.header-wishlist-icon-wrap .fa-heart {
  font-size: 20px;
  color: #f43f5e;
  filter: drop-shadow(0 1px 4px rgba(244,63,94,.3));
}
.header-wishlist-badge {
  position: absolute;
  top: -7px;
  right: -11px;
  min-width: 18px;
  height: 18px;
  border-radius: 999px;
  background: linear-gradient(135deg, #ff6a00, #cc5500);
  color: #fff;
  font-size: 10px;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  box-shadow: 0 2px 6px rgba(255,106,0,.35);
  border: 1.5px solid #fff;
}
.header-wishlist-label {
  font-size: 10px;
  font-weight: 400;
  color: var(--gray-500);
  white-space: nowrap;
}
.header-wishlist-btn:hover .header-wishlist-label { color: #f43f5e; }

.main-header .header-wishlist-btn {
  margin-left: auto;
}

.main-header .header-actions {
  margin-left: 0 !important;
}

.main-header .site-logo {
  min-height: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.main-header .site-logo:hover {
  transform: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
.main-header .logo-box {
  box-shadow: none !important;
  border-radius: 0 !important;
}
.main-header .header-search-toggle {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 28px;
  min-height: 28px;
  padding: 0;
  background: transparent !important;
  color: rgba(17,24,39,.72);
  border: 0;
  border-radius: 0;
  box-shadow: none !important;
}
.main-header .header-search-toggle:hover {
  background: transparent !important;
  color: #111827;
  transform: none;
  box-shadow: none !important;
}

.main-header .header-wishlist-btn {
  flex-direction: row;
  width: auto;
  min-height: 34px;
  padding: 0 14px 0 0;
  margin-left: auto;
  background: transparent;
  border: 0;
  border-right: 1px solid rgba(15,23,42,.14);
  border-radius: 0;
  box-shadow: none;
}
.main-header .header-wishlist-btn:hover {
  background: transparent;
  border-color: rgba(15,23,42,.14);
  transform: none;
  box-shadow: none;
}
.main-header .header-wishlist-label {
  display: none;
}
.main-header .header-wishlist-icon-wrap .fa-heart {
  color: #111827;
  font-size: 19px;
  filter: none;
}
.main-header .header-wishlist-badge {
  top: -9px;
  right: -10px;
  min-width: 17px;
  height: 17px;
  font-size: 10px;
}
.main-header .header-actions {
  align-items: center;
  gap: 12px;
}
.main-header-inner {
  padding: 2px 0 !important;
  min-height: 42px;
}
.main-header .site-logo img,
.main-header .site-logo-img {
  height: 38px !important;
}
.main-header .header-wishlist-btn,
.main-header .ha-blog,
.main-header .ha-why,
.main-header .ha-post-req,
.main-header .ha-advertise,
.main-header .ha-list-free {
  min-height: 32px;
}
.main-header .ha-blog,
.main-header .ha-why,
.main-header .ha-post-req,
.main-header .ha-advertise,
.main-header .ha-list-free {
  display: flex;
  flex-direction: row;
  min-height: 28px;
  margin: 0;
  gap: 8px;
  border-radius: 8px;
  box-shadow: none;
  font-size: 14px;
  font-weight: 400;
  line-height: 1;
}
.main-header .ha-blog,
.main-header .ha-why {
  background: transparent;
  color: #111827;
  border: 0;
  padding: 0 4px;
}
.main-header .ha-blog:hover,
.main-header .ha-why:hover {
  color: var(--primary);
  border: 0;
  transform: none;
  box-shadow: none;
}
.main-header .ha-post-req {
  background: #d5a514;
  color: #111827;
  border: 1px solid #d5a514;
  padding: 0 18px;
}
.main-header .ha-post-req:hover {
  background: #c79810;
  color: #111827;
  transform: translateY(-1px);
  box-shadow: none;
}
.main-header .ha-advertise {
  background: #fff;
  color: #111827;
  border: 1px solid rgba(15,23,42,.2);
  padding: 0 18px;
}
.main-header .ha-advertise:hover {
  color: #111827;
  border-color: rgba(15,23,42,.32);
  transform: translateY(-1px);
  box-shadow: none;
}
.main-header .ha-list-free {
  background: transparent;
  color: #008a3d;
  border: 0;
  padding: 0;
}
.main-header .ha-list-free b {
  display: none;
}
.main-header .ha-list-free i {
  color: #008a3d;
  font-size: 14px;
}
.main-header .ha-list-free:hover {
  color: #007535;
  border: 0;
  box-shadow: none;
  transform: none;
}

/* ── User Greeting in header ────────────────────────────────── */
.header-user-greet { flex-shrink: 0; }
.hug-link {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 7px 13px;
  border-radius: 12px;
  background: #fff;
  border: 1.5px solid var(--gray-200);
  box-shadow: 0 2px 8px rgba(15,23,42,.06);
  text-decoration: none;
  color: var(--gray-800);
  transition: border-color .18s, box-shadow .18s, transform .18s, background .18s;
  white-space: nowrap;
}
.hug-link:hover {
  border-color: rgba(255,106,0,.35);
  box-shadow: 0 6px 20px rgba(255,106,0,.1);
  transform: translateY(-2px);
  background: var(--primary-l);
  color: var(--primary-d);
}

.main-header .brand-header-search,
.main-header .header-user-greet {
  display: none !important;
}

@media(max-width:768px) {
  .main-header > .container {
    padding-left:14px !important;
    padding-right:14px !important;
  }
  .main-header-inner {
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    padding:2px 0 3px !important;
    flex-wrap:wrap !important;
    overflow:hidden;
  }
  .main-header .site-logo {
    flex:1 1 auto;
    max-width:calc(100% - 104px);
    gap:6px;
  }
  .main-header .site-logo img,
  .main-header .site-logo-img {
    width:var(--site-logo-mobile-width,92px) !important;
    height:var(--site-logo-mobile-height,31px) !important;
    max-width:none !important;
  }
  .main-header .logo-name {
    max-width:112px;
    font-size:12px;
  }
  .main-header .logo-tagline {
    max-width:112px;
    font-size:8px;
  }
  .main-header .header-wishlist-btn {
    order:1;
    min-height:28px;
    padding:0 10px 0 0;
    margin-left:auto !important;
    flex:0 0 auto;
  }
  .main-header .header-search-toggle {
    order:1;
    min-height:28px;
    padding:0 10px;
    flex:0 0 auto;
  }
  .main-header .header-actions {
    order:2;
    flex:0 0 100%;
    width:100%;
    margin-left:0 !important;
    display:flex !important;
    gap:6px;
    align-items:center;
    overflow-x:auto;
    overflow-y:hidden;
    padding:1px 0 2px;
    scrollbar-width:none;
  }
  .main-header .header-actions::-webkit-scrollbar {
    display:none;
  }
  .main-header .header-actions a {
    display:flex !important;
    flex:0 0 auto;
    min-height:27px;
    padding:0 10px;
    border-radius:7px;
    font-size:11px;
    gap:5px;
    white-space:nowrap;
  }
  .main-header .ha-post-req,
  .main-header .ha-advertise {
    padding:0 12px;
  }
  .main-header .ha-list-free {
    padding:0 8px;
  }
  .main-header .ha-list-free span {
    gap:4px;
  }
}
.hug-avatar {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--primary), var(--primary-d));
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 14px;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(255,106,0,.25);
}
.hug-guest .hug-avatar {
  background: linear-gradient(135deg, var(--navy), var(--navy-2));
  box-shadow: 0 2px 8px rgba(56,189,248,.25);
}
.hug-text {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.hug-hi {
  font-size: 10px;
  color: var(--gray-400);
  font-weight: 500;
  line-height: 1;
}
.hug-name {
  font-size: 12px;
  font-weight: 800;
  color: var(--gray-800);
  line-height: 1;
}
.hug-link:hover .hug-name { color: var(--primary-d); }
.hug-link:hover .hug-hi { color: var(--primary); }
.profile-menu { position:relative }
.profile-menu-trigger { cursor:pointer; font:inherit }
.profile-menu-caret { color:var(--gray-400); font-size:10px; margin-left:2px; transition:transform .18s ease }
.profile-menu-panel {
  position:absolute;
  right:0;
  top:calc(100% + 10px);
  width:min(282px,calc(100vw - 28px));
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:8px;
  box-shadow:0 18px 48px rgba(15,23,42,.18);
  padding:10px;
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  pointer-events:none;
  transition:var(--transition);
  z-index:760;
}
.profile-menu:hover .profile-menu-panel,
.profile-menu:focus-within .profile-menu-panel,
.profile-menu.open .profile-menu-panel { opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto }
.profile-menu:hover .profile-menu-caret,
.profile-menu:focus-within .profile-menu-caret,
.profile-menu.open .profile-menu-caret { transform:rotate(180deg) }
.profile-menu-head { padding:8px 10px 10px; border-bottom:1px solid #f1f5f9; margin-bottom:8px; min-width:0 }
.profile-menu-head strong,
.profile-menu-head span { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.profile-menu-head strong { color:#0f172a; font-size:14px; font-weight:900; line-height:1.2 }
.profile-menu-head span { color:#64748b; font-size:12px; margin-top:3px }
.profile-menu-stat { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:44px; padding:0 10px; border-radius:8px; color:#0f172a; font-size:13px; font-weight:850 }
.profile-menu-stat span { display:flex; align-items:center; gap:9px; min-width:0 }
.profile-menu-stat i { color:var(--primary); width:16px; text-align:center }
.profile-menu-stat b { min-width:26px; height:26px; border-radius:999px; background:#f8fafc; color:#0f172a; display:inline-flex; align-items:center; justify-content:center; font-size:12px }
.profile-menu-stat:hover,
.profile-menu-links a:hover { background:#f8fafc; color:var(--primary-d) }
.profile-menu-links { border-top:1px solid #f1f5f9; margin-top:8px; padding-top:8px }
.profile-menu-links a { display:flex; align-items:center; gap:9px; min-height:38px; padding:0 10px; border-radius:8px; color:#334155; font-size:12.5px; font-weight:800 }
.profile-menu-links i { color:#64748b; width:16px; text-align:center }

/* ── INDUSTRY CATEGORY GRID ──────────────────────────────── */
.industry-section { padding-top: 60px; padding-bottom: 24px; }
.industry-section > .container {
  max-width: none;
  width: 100%;
  padding-left: var(--edge-pad);
  padding-right: var(--edge-pad);
}
.industry-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-bottom: 16px;
}
.industry-scroll-controls {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.industry-scroll-btn {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: var(--gray-800);
  box-shadow: var(--shadow-sm);
  cursor: pointer;
  transition: var(--transition);
}
.industry-scroll-btn:hover {
  background: var(--primary);
  color: #fff;
  transform: translateY(-2px);
}
.industry-cat-grid {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 172px;
  grid-template-rows: repeat(2, minmax(132px, auto));
  gap: 14px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 4px 4px 34px;
  scroll-behavior: smooth;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
}
.industry-cat-grid::-webkit-scrollbar { display: none; }
.industry-cat-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 132px;
  padding: 8px;
  background: #fff;
  border: 1px solid rgba(226,232,240,.95);
  border-radius: 8px;
  backdrop-filter: none;
  text-decoration: none;
  color: #334155;
  font-weight: 500;
  font-size: 13px;
  text-align: center;
  transition: var(--transition);
  position: relative;
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(15,23,42,.1);
  scroll-snap-align: start;
}
.industry-cat-card::before {
  display: none;
}
.industry-cat-card:hover {
  transform: translateY(-3px);
  border-color: rgba(255,106,0,.28);
  background: #fff;
  box-shadow: 0 16px 34px rgba(15,23,42,.14);
  color: var(--primary-d);
}
.industry-cat-img {
  width: 118px;
  height: 104px;
  border-radius: 8px;
  background-size: cover;
  background-position: center;
  position: relative;
  z-index: 1;
  box-shadow: var(--shadow-sm);
  transition: transform .3s ease;
  flex-shrink: 0;
}
.industry-cat-card:hover .industry-cat-img { transform: scale(1.1); }
.industry-cat-icon {
  width: 118px;
  height: 104px;
  border-radius: 8px;
  background: linear-gradient(135deg, #fff3ec, #ffe4cc);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  color: var(--primary);
  position: relative;
  z-index: 1;
  box-shadow: 0 4px 16px rgba(255,106,0,.14);
  transition: background .25s, color .25s, transform .3s;
  flex-shrink: 0;
}
.industry-cat-card:hover .industry-cat-icon {
  background: linear-gradient(135deg, #fff3ec, #ffe4cc);
  color: var(--primary);
  transform: scale(1.08);
}
.industry-cat-name {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  width: 100%;
  min-height: 32px;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.35;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}
@media (max-width: 900px) {
  .journey-industry-panel { transform: translateY(34px); }
  .industry-cat-grid { grid-auto-columns: 142px; grid-template-rows: repeat(2, minmax(126px, auto)); gap: 14px; }
  .industry-cat-card { min-height: 126px; }
  .industry-cat-img, .industry-cat-icon { width: 72px; height: 72px; }
}
@media (max-width: 600px) {
  .industry-actions { justify-content: space-between; gap: 8px; }
  .industry-cat-grid { grid-auto-columns: 86px; grid-template-rows: repeat(2, 78px); gap: 8px; padding:2px 2px 10px; }
  .industry-cat-card { min-height:78px; height:78px; padding:0; border:0; background:transparent; font-size:10px; gap:0; box-shadow:0 7px 16px rgba(15,23,42,.18); }
  .industry-cat-img, .industry-cat-icon { position:absolute; inset:0; width:100%; height:100%; border-radius:8px; font-size:22px; }
  .industry-cat-card:hover .industry-cat-img,
  .industry-cat-card:hover .industry-cat-icon { transform:none; }
  .industry-cat-name { position:absolute; left:0; right:0; bottom:0; z-index:2; min-height:0; padding:14px 5px 5px; color:#fff; font-size:9px; line-height:1.15; font-weight:800; text-shadow:0 1px 6px rgba(0,0,0,.55); background:linear-gradient(0deg,rgba(2,6,23,.78),rgba(2,6,23,0)); -webkit-line-clamp:2; }
  .home-category-product-sections.desktop-category-browser { display:block!important; padding:18px 0 }
  .home-category-product-sections .container { padding-left:8px; padding-right:8px }
}

/* ── View All Categories link ─────────────────────────────── */
.industry-view-all {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 700;
  color: var(--primary);
  text-decoration: none;
  padding: 7px 16px;
  border-radius: 8px;
  border: 1.5px solid rgba(255,106,0,.25);
  background: var(--primary-l);
  transition: var(--transition);
}
.industry-view-all:hover {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(255,106,0,.2);
}

/* Blog discovery */
.home-recent-section,
.home-blog-section,
.blogs-list-section {
  background: #f8fafc;
}
.home-recent-section {
  padding-top: 30px;
  padding-bottom: 26px;
}
.home-recent-section .section-header {
  margin-bottom: 18px;
}
.home-recent-section .section-title {
  font-size: clamp(1.25rem,2.4vw,1.75rem);
}
.home-recent-section .section-subtitle {
  margin-top: 6px;
}
.home-recent-section .section-title-line {
  margin-top: 10px;
}
.home-recent-grid {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(260px, 340px);
  gap: 16px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 4px var(--edge-pad) 8px;
  margin-left: calc(var(--edge-pad) * -1);
  margin-right: calc(var(--edge-pad) * -1);
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
}
.home-recent-grid::-webkit-scrollbar {
  display: none;
}
.recent-visit-card {
  scroll-snap-align: start;
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  min-height: 126px;
  padding: 12px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  color: #0f172a;
  box-shadow: 0 10px 28px rgba(15,23,42,.07);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.recent-visit-card:hover {
  transform: translateY(-4px);
  border-color: rgba(255,106,0,.28);
  box-shadow: 0 18px 42px rgba(15,23,42,.12);
}
.recent-visit-media {
  position: relative;
  height: 102px;
  border-radius: 8px;
  overflow: hidden;
  background: linear-gradient(135deg, #0f172a, #0369a1);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
}
.recent-visit-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.recent-visit-media em {
  position: absolute;
  left: 8px;
  top: 8px;
  padding: 4px 7px;
  border-radius: 999px;
  background: rgba(15,23,42,.78);
  color: #fff;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
}
.recent-visit-body {
  min-width: 0;
  display: grid;
  gap: 7px;
}
.recent-visit-body strong {
  color: #0f172a;
  font-size: 14px;
  line-height: 1.28;
  font-weight: 950;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.recent-visit-body small {
  color: #64748b;
  font-size: 12px;
  line-height: 1.35;
}
.recent-visit-body b {
  color: var(--primary);
  font-size: 13px;
  font-weight: 950;
}
.following-feed-section {
  background: #fff;
  padding-top: 38px;
  padding-bottom: 42px;
}
.following-empty-section {
  background: #fff;
  padding: 26px 0;
}
.following-empty-box {
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  padding:16px;
  background:#f8fafc;
  border:1px dashed #cbd5e1;
  border-radius:8px;
  color:#475569;
}
.following-empty-box i { color:var(--primary); font-size:20px }
.following-empty-box strong { color:#0f172a }
.following-empty-box span { flex:1 1 260px; font-size:13px }
.following-business-strip,
.following-blog-row,
.following-product-row {
  display:grid;
  grid-auto-flow:column;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  scrollbar-width:none;
}
.following-business-strip::-webkit-scrollbar,
.following-blog-row::-webkit-scrollbar,
.following-product-row::-webkit-scrollbar { display:none }
.following-business-strip {
  grid-auto-columns:max-content;
  gap:9px;
  margin:-12px 0 18px;
}
.following-business-chip {
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 10px;
  border:1px solid #e2e8f0;
  border-radius:999px;
  background:#f8fafc;
  color:#0f172a;
  font-size:12px;
  font-weight:900;
}
.following-business-chip span {
  width:26px;
  height:26px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#fff7ed;
  color:var(--primary);
}
.following-business-chip img { width:100%; height:100%; object-fit:cover }
.following-feed-head {
  display:flex;
  align-items:center;
  gap:8px;
  margin:18px 0 12px;
  color:#0f172a;
  font-size:14px;
  font-weight:950;
}
.following-feed-head i { color:var(--primary) }
.following-blog-row {
  grid-auto-columns:minmax(260px,340px);
  gap:14px;
  padding:2px 2px 8px;
}
.following-blog-card,
.following-product-card {
  scroll-snap-align:start;
  color:#0f172a;
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:8px;
  overflow:hidden;
  box-shadow:0 10px 28px rgba(15,23,42,.07);
  transition:var(--transition);
}
.following-blog-card:hover,
.following-product-card:hover { transform:translateY(-3px); border-color:rgba(255,106,0,.3); box-shadow:0 18px 38px rgba(15,23,42,.12) }
.following-blog-media,
.following-product-media {
  position:relative;
  height:128px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#f1f5f9;
  color:var(--primary);
  font-size:26px;
}
.following-blog-media img,
.following-product-media img { width:100%; height:100%; object-fit:cover }
.following-blog-media em,
.following-product-media em {
  position:absolute;
  left:10px;
  top:10px;
  padding:4px 8px;
  border-radius:999px;
  background:rgba(15,23,42,.78);
  color:#fff;
  font-size:10px;
  font-style:normal;
  font-weight:900;
}
.following-blog-body,
.following-product-body {
  display:grid;
  gap:7px;
  padding:13px;
}
.following-blog-body small,
.following-product-body small { color:#64748b; font-size:12px; line-height:1.35 }
.following-blog-body strong,
.following-product-body strong { color:#0f172a; font-size:14px; line-height:1.3; font-weight:950; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden }
.following-blog-body span { color:#8b5cf6; display:flex; gap:8px; align-items:center; font-size:12px; font-weight:800 }
.following-product-row {
  grid-auto-columns:minmax(190px,240px);
  gap:14px;
  padding:2px 2px 8px;
}
.following-product-body b { color:var(--primary); font-size:13px; font-weight:950 }
.home-blog-toolbar,
.blogs-result-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 22px;
  flex-wrap: wrap;
}
.home-blog-priority-note {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #475569;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 10px 13px;
  font-size: 13px;
  font-weight: 800;
}
.home-blog-priority-note i {
  color: var(--primary);
}
.home-blog-actions,
.blogs-hero-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.blogs-page-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.home-blog-grid {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(300px, 380px);
  gap: 18px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 4px var(--edge-pad) 16px;
  margin-left: calc(var(--edge-pad) * -1);
  margin-right: calc(var(--edge-pad) * -1);
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
}
.home-blog-grid::-webkit-scrollbar {
  display: none;
}
.home-blog-grid .blog-card {
  scroll-snap-align: start;
}
.home-blog-scroll-controls {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.home-blog-scroll-btn {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e2e8f0;
  border-radius: 50%;
  background: #fff;
  color: #0f172a;
  box-shadow: 0 8px 22px rgba(15,23,42,.08);
  cursor: pointer;
  transition: transform .18s ease, color .18s ease, background .18s ease, border-color .18s ease;
}
.home-blog-scroll-btn:hover {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
  transform: translateY(-2px);
}
.blog-card {
  min-width: 0;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(15,23,42,.07);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.blog-card:hover {
  transform: translateY(-4px);
  border-color: rgba(255,106,0,.28);
  box-shadow: 0 18px 42px rgba(15,23,42,.12);
}
.blog-card-media {
  position: relative;
  display: block;
  height: 178px;
  background: linear-gradient(135deg, #0f172a, #0369a1);
  color: #fff;
  overflow: hidden;
}
.blog-card-large .blog-card-media {
  height: 210px;
}
.blog-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s ease;
}
.blog-card:hover .blog-card-media img {
  transform: scale(1.04);
}
.blog-card-media > span {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 34px;
  color: rgba(255,255,255,.82);
}
.blog-card-media em {
  position: absolute;
  left: 12px;
  top: 12px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 5px 9px;
  background: rgba(15,23,42,.8);
  color: #fff;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  backdrop-filter: blur(8px);
}
.blog-card-body {
  padding: 18px;
}
.blog-author-row {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  margin-bottom: 12px;
}
.blog-author-photo {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  overflow: hidden;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--primary), var(--navy));
  color: #fff;
  font-size: 16px;
  font-weight: 950;
  box-shadow: 0 6px 16px rgba(15,23,42,.14);
}
.blog-author-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.blog-author-row strong {
  display: block;
  max-width: 100%;
  color: #0f172a;
  font-size: 13px;
  line-height: 1.25;
  font-weight: 900;
}
.blog-author-row strong a {
  color: inherit;
}
.blog-author-row small {
  display: block;
  color: #64748b;
  font-size: 12px;
  margin-top: 2px;
}
.blog-card h2,
.blog-card h3 {
  font-size: 1.08rem;
  line-height: 1.25;
  font-weight: 950;
  margin: 0 0 8px;
  color: #0f172a;
}
.blog-card h2 a,
.blog-card h3 a {
  color: inherit;
}
.blog-card h2 a:hover,
.blog-card h3 a:hover {
  color: var(--primary);
}
.blog-card p {
  color: #64748b;
  font-size: 13px;
  line-height: 1.65;
  margin: 0 0 14px;
}
.blog-card-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}
.blog-card-meta i {
  color: var(--primary);
}
.blog-read-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 14px;
  color: var(--primary);
  font-size: 13px;
  font-weight: 900;
}
.blog-empty-state {
  display: grid;
  place-items: center;
  gap: 8px;
  text-align: center;
  min-height: 220px;
  padding: 34px 18px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  color: #64748b;
}
.blog-empty-state i {
  width: 54px;
  height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #fff3ec;
  color: var(--primary);
  font-size: 22px;
}
.blog-empty-state strong {
  color: #0f172a;
  font-size: 18px;
}
.blogs-hero {
  background: linear-gradient(135deg, #0f172a 0%, #0369a1 58%, #ff6a00 100%);
  color: #fff;
  padding: clamp(38px, 7vw, 78px) 0 32px;
}
.blogs-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 26px;
  align-items: end;
}
.blogs-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.18);
  font-size: 12px;
  font-weight: 900;
  margin-bottom: 14px;
}
.blogs-hero h1 {
  max-width: 860px;
  font-size: clamp(2rem, 5vw, 3.5rem);
  line-height: 1.05;
  font-weight: 950;
}
.blogs-hero p {
  max-width: 760px;
  margin-top: 14px;
  color: rgba(255,255,255,.82);
  font-size: 1rem;
  line-height: 1.7;
}
.blogs-search {
  position: relative;
  display: flex;
  align-items: stretch;
  max-width: 860px;
  margin-top: 28px;
  background: #fff;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 16px 38px rgba(2,6,23,.2);
}
.blogs-search > i {
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  pointer-events: none;
}
.blogs-search input[type="search"] {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  padding: 15px 16px 15px 44px;
  color: #0f172a;
  font-size: 14px;
}
.blogs-search button {
  border: 0;
  background: var(--primary);
  color: #fff;
  padding: 0 22px;
  font-weight: 900;
  cursor: pointer;
}
.blogs-tabs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}
.blogs-tabs a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  padding: 8px 12px;
  color: rgba(255,255,255,.86);
  background: rgba(255,255,255,.08);
  font-size: 12px;
  font-weight: 900;
}
.blogs-tabs a.active,
.blogs-tabs a:hover {
  background: #fff;
  color: #0f172a;
}
.blogs-result-head {
  color: #0f172a;
}
.blogs-result-head a {
  color: var(--primary);
  font-weight: 900;
  font-size: 13px;
}
@media (max-width: 980px) {
  .blogs-page-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .blogs-hero-grid {
    grid-template-columns: 1fr;
  }
  .blogs-hero-actions {
    align-items: stretch;
  }
}
@media (max-width: 640px) {
  .blogs-page-grid {
    grid-template-columns: 1fr;
  }
  .home-blog-grid {
    grid-auto-columns: minmax(260px, 82vw);
  }
  .home-blog-actions,
  .blogs-hero-actions,
  .blogs-search {
    width: 100%;
  }
  .home-blog-actions .btn,
  .blogs-hero-actions .btn {
    flex: 1;
    justify-content: center;
  }
  .blogs-search {
    flex-direction: column;
  }
  .blogs-search > i {
    top: 24px;
  }
  .blogs-search button {
    min-height: 44px;
  }
}

/* ── All Categories Page ──────────────────────────────────── */
.cat-page-hero {
  background: linear-gradient(135deg, var(--navy) 0%, #1e3a6e 100%);
  padding: 52px 0 48px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.cat-page-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  pointer-events: none;
}
.cat-page-title {
  color: #fff;
  font-size: clamp(24px, 4vw, 38px);
  font-weight: 900;
  margin-bottom: 8px;
  position: relative;
}
.cat-page-sub {
  color: rgba(255,255,255,.6);
  font-size: 14px;
  margin-bottom: 28px;
  position: relative;
}
.cat-page-search-wrap {
  position: relative;
  max-width: 520px;
  margin: 0 auto;
}
.cat-page-search-icon {
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--gray-400);
  font-size: 15px;
  pointer-events: none;
}
.cat-page-search {
  width: 100%;
  padding: 14px 44px 14px 44px;
  border-radius: 50px;
  border: none;
  font-size: 14px;
  outline: none;
  box-shadow: 0 8px 32px rgba(0,0,0,.25);
  background: #fff;
  color: var(--gray-800);
}
.cat-page-search:focus { box-shadow: 0 8px 32px rgba(0,0,0,.25), 0 0 0 3px rgba(255,106,0,.3); }
.cat-page-search-clear {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  color: var(--gray-400);
  font-size: 13px;
  padding: 4px;
}
.cat-page-search-clear:hover { color: var(--primary); }
.cat-page-search-count {
  margin-top: 12px;
  font-size: 13px;
  color: rgba(255,255,255,.55);
  position: relative;
  min-height: 20px;
}

/* Grid */
.cat-page-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}
.cat-page-card {
  background: #fff;
  border: 1.5px solid var(--gray-200);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--shadow-xs);
  transition: box-shadow .2s, transform .2s;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.cat-page-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
}
.cat-page-card-top {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 13px 16px;
  border-bottom: 1px solid var(--gray-100);
  background: #fffaf5;
  min-width: 0;
}
.cat-page-card-header {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  text-decoration: none;
  color: var(--gray-800);
  border-left: 4px solid var(--primary);
  padding: 5px 0 5px 10px;
  min-width: 0;
  transition: color .18s;
}
.cat-page-card-header:hover { color: var(--primary); }
.cat-page-view-all {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: auto;
  color: var(--primary);
  font-size: 12px;
  font-weight: 900;
  text-decoration: none;
  white-space: nowrap;
  padding: 7px 9px;
  border-radius: 999px;
  transition: background .15s, color .15s;
}
.cat-page-view-all:hover {
  background: var(--primary-l);
  color: var(--primary-d);
}
.cat-page-view-all i {
  font-size: 10px;
}
.cat-page-img {
  width: 64px;
  height: 64px;
  border-radius: 12px;
  background-size: cover;
  background-position: center;
  flex-shrink: 0;
  box-shadow: var(--shadow-sm);
}
.cat-page-img-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--primary-l), #ffe4cc);
  font-size: 22px;
  color: var(--primary);
}
.cat-page-card-name {
  font-weight: 900;
  font-size: 17px;
  line-height: 1.2;
  white-space: nowrap;
}
.cat-page-sub-badge {
  background: var(--primary);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  border-radius: 999px;
  padding: 2px 8px;
  flex-shrink: 0;
}
.cat-page-subs {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
}
.cat-page-category-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.cat-page-subs::-webkit-scrollbar { height: 8px; }
.cat-page-subs::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 999px; }
.cat-page-sub-tile {
  flex: 0 0 auto;
  min-height: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: var(--gray-800);
  background: #fff;
  border: 1px solid var(--gray-200);
  border-radius: 999px;
  padding: 7px 12px;
  text-decoration: none;
  text-align: center;
  scroll-snap-align: start;
  font-size: 12.5px;
  font-weight: 850;
  cursor: pointer;
  transition: background .15s, color .15s, border-color .15s, transform .15s, box-shadow .15s;
}
.cat-page-sub-tile:hover,
.cat-page-sub-tile.active {
  background: var(--primary-l);
  color: var(--primary-d);
  border-color: rgba(255,106,0,.3);
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(15,23,42,.09);
}
.cat-page-sub-tile span {
  display: inline-flex;
  min-width: 18px;
  height: 18px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #ff6a00;
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  padding: 0 5px;
}
.cat-page-sub-photo {
  width: 78px;
  height: 78px;
  border-radius: 14px;
  background: #eef2f7 center/cover no-repeat;
  display: block;
  box-shadow: 0 6px 16px rgba(15,23,42,.08);
  flex-shrink: 0;
}
.cat-page-sub-photo-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
  background: linear-gradient(135deg, #fff7ed, #e0f2fe);
  font-size: 24px;
}
.cat-page-sub-tile strong {
  font-size: 12px;
  line-height: 1.25;
  font-weight: 850;
  overflow-wrap: anywhere;
}
.cat-page-product-wrap {
  position: relative;
  padding: 15px 16px 18px;
}
.cat-page-products {
  display: flex;
  gap: 14px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  padding: 2px 2px 10px;
}
.cat-page-products::-webkit-scrollbar { display: none; }
.cat-page-product-card {
  flex: 0 0 210px;
  scroll-snap-align: start;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
  background: #0f172a;
  color: inherit;
  text-decoration: none;
  box-shadow: 0 4px 20px rgba(0,0,0,.12);
  transition: transform .22s, box-shadow .22s;
}
.cat-page-product-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 42px rgba(15,23,42,.22);
}
.cat-page-product-card img,
.cat-page-product-no-img {
  width: 100%;
  height: 138px;
  object-fit: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg,#1e3a5f,#003087);
  color: rgba(255,255,255,.35);
  font-size: 2rem;
}
.cat-page-product-body {
  padding: 12px 13px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.cat-page-product-body strong {
  color: #fff;
  font-size: 13px;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cat-page-product-body span {
  color: rgba(255,255,255,.52);
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cat-page-product-body span i { color: #ff6a00; font-size: 9px; margin-right: 3px; }
.cat-page-product-body b {
  color: #ff6a00;
  font-size: 14px;
  font-weight: 900;
}
.cat-page-product-body small { color: rgba(255,255,255,.45); font-weight: 500; }
.cat-product-scroll {
  position: absolute;
  top: 45%;
  transform: translateY(-50%);
  z-index: 4;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: #0f172a;
  box-shadow: 0 8px 26px rgba(15,23,42,.18);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: .18s;
}
.cat-product-scroll:hover { background: #ff6a00; color: #fff; }
.cat-product-left { left: 0; }
.cat-product-right { right: 0; }
.mobile-category-browser { display:none }

@media (max-width: 900px) {
  .cat-page-card { flex-direction: column; }
  .cat-page-card-top { align-items: flex-start; flex-direction: column; }
  .cat-page-subs { width: 100%; }
  .cat-page-card-header { flex-basis: auto; }
  .cat-page-view-all { margin-left: 0; }
}

@media (max-width: 600px) {
  .desktop-category-browser { display:none }
  .mobile-category-browser { display:block; background:#fff; min-height:calc(100dvh - 124px) }
  .mobile-category-shell { display:grid; grid-template-columns:34% 66%; min-height:calc(100dvh - 124px); border-top:1px solid #edf1f5; background:#fff }
  .mobile-category-parents { position:sticky; top:64px; align-self:start; height:calc(100dvh - 124px); background:#f4f7fa; border-right:1px solid #e6ebf0; overflow-y:auto; scrollbar-width:none }
  .mobile-category-parents::-webkit-scrollbar { display:none }
  .mobile-category-parent { width:100%; min-height:74px; padding:8px 6px; border:0; border-bottom:1px solid #e5eaf0; border-left:3px solid transparent; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; background:transparent; color:#111827; text-align:center; font-size:10px; font-weight:800; line-height:1.2 }
  .mobile-category-parent i { width:28px; height:28px; flex:0 0 28px; display:flex; align-items:center; justify-content:center; color:#334155; font-size:15px; text-align:center }
  .mobile-category-parent span { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden }
  .mobile-category-parent.active { border-left-color:#0f8793; background:#fff; color:#0f172a }
  .mobile-category-parent.active i { color:#0f8793 }
  .mobile-category-panels { min-width:0; padding:14px 10px 24px; background:#fff }
  .mobile-category-panel { display:none }
  .mobile-category-panel.active { display:block }
  .mobile-category-panel-head { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; margin-bottom:12px }
  .mobile-category-panel-head h2 { color:#0f172a; font-size:19px; line-height:1.04; font-weight:950; letter-spacing:0 }
  .mobile-category-panel-head a { flex-shrink:0; color:#7c3aed; font-size:10px; font-weight:900; padding-top:2px }
  .mobile-category-subgrid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px }
  .mobile-category-subcard { min-width:0; min-height:104px; padding:8px 5px 9px; border:1px solid #e4e9f0; border-radius:11px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; background:#fff; color:#0f172a; text-align:center; box-shadow:0 1px 4px rgba(15,23,42,.04); text-decoration:none }
  .mobile-category-subcard img,.mobile-category-subcard > span { width:58px; height:58px; border-radius:10px; object-fit:cover; display:flex; align-items:center; justify-content:center; background:#f1f5f9; color:#0f8793; font-size:21px }
  .mobile-category-subcard strong { max-width:100%; font-size:9.5px; line-height:1.22; font-weight:900; overflow-wrap:anywhere; color:#0b1220 }
  .cat-page-grid { grid-template-columns: 1fr; }
  .cat-page-hero { padding:8px 10px 9px; background:#fff; border-bottom:1px solid #edf1f5 }
  .cat-page-hero::before,.cat-page-title,.cat-page-sub,.cat-page-search-count { display:none }
  .cat-page-search-wrap { max-width:none; margin:0 }
  .cat-page-search { color:#172033; background:#f8fafc; border:1px solid #e2e8f0; box-shadow:none }
  .cat-page-search:focus { box-shadow:0 0 0 3px rgba(255,106,0,.14) }
  .cat-page-search::placeholder { color:#94a3b8 }
  .cat-page-search-icon { color:#64748b }
  .cat-page-card { min-height:0; border-radius:12px }
  .cat-page-card-top { min-height:58px; padding:9px 12px; flex-direction:row; align-items:center }
  .cat-page-card-header { flex:1; padding:8px 0 8px 8px; max-width:100% }
  .cat-page-img { width: 56px; height: 56px; }
  .cat-page-card-name { font-size:15px; white-space:normal }
  .cat-page-sub-badge { font-size:10px }
  .cat-page-subs,.cat-page-category-body { display:none }
  .cat-page-view-all { width:36px; height:36px; margin:0; padding:0; border-radius:50%; font-size:0; justify-content:center }
  .cat-page-view-all i { margin:0; font-size:12px }
  .cat-page-sub-tile { flex-basis: auto; min-height: 0; padding: 7px 11px; font-size: 12px; }
  .cat-page-sub-photo { width: 66px; height: 66px; }
  .cat-page-product-card { flex-basis: 160px; }
  .cat-page-product-card img,
  .cat-page-product-no-img { height: 112px; }
  .cat-product-left { left: 4px; }
  .cat-product-right { right: 4px; }
  .home-category-product-sections .cat-page-card-top { min-height:52px; padding:7px 10px }
  .home-category-product-sections .cat-page-card-header { padding:7px 0; max-width:none }
  .home-category-product-sections .cat-page-sub-badge,
  .home-category-product-sections .cat-page-subs { display:none!important }
  .home-category-product-sections .cat-page-category-body { display:block!important; padding:6px 0 }
  .home-category-product-sections .cat-page-product-wrap { padding:0 7px 7px; background:#fff }
  .home-category-product-sections .cat-page-products { gap:7px; padding:0; scroll-snap-type:x mandatory }
  .home-category-product-sections .cat-page-product-card { flex:0 0 calc(50% - 4px); min-width:0; scroll-snap-align:start; background:#fff; border:1px solid #e2e8f0; border-radius:10px; box-shadow:0 4px 12px rgba(15,23,42,.08); color:#172033 }
  .home-category-product-sections .cat-page-product-card img,
  .home-category-product-sections .cat-page-product-no-img { height:98px; background:#f8fafc; color:#cbd5e1 }
  .home-category-product-sections .cat-page-product-body { padding:8px 9px 9px; gap:3px; background:#fff }
  .home-category-product-sections .cat-page-product-body strong { color:#172033; font-size:11px; line-height:1.22; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; min-height:27px }
  .home-category-product-sections .cat-page-product-body span { display:none!important }
  .home-category-product-sections .cat-page-product-body b { color:#ff6a00; font-size:12px }
  .home-category-product-sections .cat-page-product-body small { color:#64748b }
  .home-category-product-sections .cat-product-scroll { display:none }
  .home-category-product-sections .home-category-products-empty { width:100%; padding:24px 12px; border-radius:10px; background:#f8fafc; color:#64748b; text-align:center; font-size:12px; font-weight:800 }
}

/* ── OTP Resend Timer ─────────────────────────────────────── */
.otp-resend-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  margin: 4px 0 8px;
  min-height: 36px;
}
.otp-timer-text {
  font-size: 13px;
  font-weight: 600;
  color: var(--primary);
  display: flex;
  align-items: center;
  gap: 5px;
  transition: opacity .3s;
}
.otp-timer-text i { font-size: 11px; opacity: .8; }
.otp-resend-btn {
  background: none;
  border: 1.5px solid var(--gray-200);
  border-radius: 8px;
  color: var(--gray-400);
  cursor: not-allowed;
  font-weight: 700;
  font-size: 12.5px;
  padding: 6px 14px;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: background .18s, color .18s, border-color .18s, transform .18s;
}
.otp-resend-btn.otp-resend-active {
  border-color: #0ea5e9;
  color: #0ea5e9;
  cursor: pointer;
  animation: otp-pulse .5s ease;
}
.otp-resend-btn.otp-resend-active:hover {
  background: #f0f9ff;
  border-color: #0284c7;
  color: #0284c7;
  transform: translateY(-1px);
}
@keyframes otp-pulse {
  0%   { transform: scale(1); }
  50%  { transform: scale(1.06); }
  100% { transform: scale(1); }
}

@media (max-width: 820px) {
  .dashboard-profile-grid {
    grid-template-columns: 1fr !important;
  }
  .dashboard-hero-inner {
    align-items: flex-start;
  }
  .dashboard-avatar {
    width: 58px;
    height: 58px;
    font-size: 23px;
  }
  .dashboard-hero-actions {
    width: 100%;
    justify-content:flex-start;
  }
  .dashboard-menu-btn {
    width:48px;
    height:48px;
  }
  .dashboard-overview-grid,
  .dashboard-activity-strip { grid-template-columns:repeat(2,minmax(0,1fr)) }
  .dashboard-overview-head { align-items:flex-start }
  .dashboard-media-cell { min-width:170px; gap:8px }
  .dashboard-media-cell.compact { min-width:130px }
  .dashboard-row-thumb { width:36px; height:36px; flex-basis:36px; font-size:13px }
  .dashboard-media-cell small { font-size:11px }
  .dashboard-settings-panel {
    width:min(340px,calc(100vw - 18px));
  }
  .dashboard-section-nav {
    top: 84px;
  }
  .dashboard-social-grid {
    grid-template-columns: 1fr;
  }
  .dashboard-analysis-split {
    grid-template-columns:1fr;
  }
  .dashboard-market-item {
    grid-template-columns:30px 40px minmax(0,1fr) auto;
  }
  .dashboard-upgrade-grid {
    grid-template-columns:1fr;
  }
  .dashboard-reply-form {
    grid-template-columns:1fr;
  }
}

@media (max-width: 600px) {
  .journey-section { min-height:640px!important }
  .journey-overlay { padding:16px 12px 18px!important }
  .journey-overlay > div:first-child { width:58%; padding-right:6px }
  .journey-label { font-size:8px!important; letter-spacing:.35px }
  .journey-title { margin-top:3px; font-size:18px!important; line-height:1.04!important }
  .journey-stats { top:14px!important; right:10px!important; bottom:auto!important; left:auto!important; width:39%!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:4px!important }
  .journey-stat,.journey-stat:first-child { grid-column:auto!important; min-height:36px!important; padding:5px 6px!important; border-radius:7px!important; backdrop-filter:none!important }
  .journey-stat:first-child { grid-column:1/-1!important }
  .journey-stat span { font-size:12px!important; line-height:1!important }
  .journey-stat small { margin-top:3px!important; font-size:5.7px!important; line-height:1.08!important; letter-spacing:.12px!important }
  .journey-badge { margin-top:82px; padding:7px 11px; border-radius:16px; font-size:8px; transform:none }
  .journey-desktop-city { display:none!important }
  .journey-industry-panel { transform:translateY(-82px)!important; padding-bottom:0!important; margin-bottom:-74px!important }
  .journey-industry-panel .section-header { margin-bottom:5px!important }
  .journey-industry-panel .section-title { font-size:18px!important }
  .journey-industry-panel .section-subtitle { margin-top:4px!important; font-size:10px!important }
  .journey-industry-panel .section-title-line { margin-top:7px!important }
  .journey-section .scroll-indicator { bottom:24px!important; font-size:10px!important }
  .dip-how { padding:16px 0 18px!important; background:linear-gradient(180deg,#f8f7ff,#eef6ff)!important }
  .dip-how > .container { padding-left:10px!important; padding-right:0!important }
  .dip-how .section-header { margin:0 10px 11px 0!important; text-align:left!important }
  .dip-how .section-title { font-size:18px!important }
  .dip-how .section-subtitle { display:none!important }
  .dip-how .section-title-line { width:38px!important; margin:7px 0 0!important }
  .dip-how-grid { display:flex!important; grid-template-columns:none!important; gap:9px!important; overflow-x:auto!important; overflow-y:hidden!important; padding:2px 22px 7px 0!important; scroll-snap-type:x mandatory; scroll-padding-left:0; scrollbar-width:none; touch-action:pan-x }
  .dip-how-grid::-webkit-scrollbar { display:none }
  .dip-how-card { flex:0 0 calc(100vw - 52px)!important; min-height:112px; display:grid!important; grid-template-columns:48px minmax(0,1fr)!important; grid-template-rows:auto auto 1fr!important; column-gap:11px!important; align-items:center!important; padding:13px 14px!important; border-radius:14px!important; text-align:left!important; scroll-snap-align:start; box-shadow:0 8px 22px rgba(15,23,42,.08)!important }
  .dip-how-card i { grid-column:1; grid-row:1/4; width:46px!important; height:46px!important; margin:0!important; border-radius:12px!important; font-size:18px!important }
  .dip-how-card small { grid-column:2; grid-row:1; font-size:8px!important; letter-spacing:1px!important }
  .dip-how-card h3 { grid-column:2; grid-row:2; margin:2px 0!important; font-size:13px!important; line-height:1.2!important }
  .dip-how-card p { grid-column:2; grid-row:3; margin:0!important; font-size:10px!important; line-height:1.35!important; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden }
  body.page-auth { padding-bottom:0 }
  .page-auth .top-bar,
  .page-auth .cat-navbar,
  .page-auth .home-search-band,
  .page-auth .site-footer { display:none!important }
  body.page-auth { padding-bottom:calc(64px + env(safe-area-inset-bottom)) }
  .page-auth .main-header { display:block!important }
  .page-auth .mobile-bottom-nav { display:grid!important }
  .page-auth .main-content { width:100vw!important; min-height:calc(100dvh - 124px)!important; margin:0!important; padding:0!important; overflow-x:hidden }
  .page-auth .auth-page { display:block!important; width:100vw!important; min-width:100vw!important; max-width:100vw!important; min-height:calc(100dvh - 124px)!important; margin:0!important; padding:0!important; background:#fff!important; overflow:visible!important }
  .page-auth .auth-page::before,
  .page-auth .auth-page::after { display:none!important }
  .page-auth .auth-card { display:block!important; width:100vw!important; min-width:100vw!important; max-width:100vw!important; min-height:100dvh!important; margin:0!important; padding:24px 18px 34px!important; border:0!important; border-radius:0!important; background:#fff!important; box-shadow:none!important; backdrop-filter:none!important }
  .page-auth .auth-card > div:first-child,
  .page-auth .auth-logo { margin-bottom:16px!important }
  .page-auth .auth-title { font-size:22px }
  .page-auth .auth-sub { margin-bottom:22px }
  .consult-modal { top:auto!important; bottom:calc(76px + env(safe-area-inset-bottom))!important; width:calc(100vw - 18px)!important; max-height:calc(100dvh - 96px)!important; border-radius:15px!important; transform:translate(-50%,calc(100% + 100px)) scale(.98)!important }
  .consult-modal.open { transform:translate(-50%,0) scale(1)!important }
  .consult-modal-head { padding:13px 15px!important }
  .consult-modal-head h2 { font-size:17px!important }
  .consult-modal-kicker { font-size:8px!important }
  .consult-form { padding:13px!important }
  html { scroll-behavior:auto }
  .reveal,.reveal-left,.reveal-right { opacity:1!important; transform:none!important; transition:none!important }
  .top-bar { display:none!important }
  .home-search-band { display:none!important }
  .main-header .header-actions { display:none!important }
  .main-header .brand-header-search,.main-header .header-wishlist-btn,.main-header .header-search-toggle { display:none!important }
  .support-panel-overlay { z-index:1200; background:rgba(15,23,42,.52); backdrop-filter:none }
  .support-panel { top:auto; right:8px; bottom:calc(70px + env(safe-area-inset-bottom)); left:8px; width:auto; height:min(70dvh,590px); max-height:calc(100dvh - 92px); border:1px solid rgba(148,163,184,.35); border-radius:18px; overflow:hidden; box-shadow:0 24px 70px rgba(15,23,42,.34); transform:translateY(calc(100% + 90px)); z-index:1201 }
  .support-panel.open { transform:translateY(0) }
  .support-panel-head { padding:12px 14px; flex:0 0 auto }
  .support-bot-avatar { width:36px; height:36px; border-radius:11px; font-size:16px }
  .support-panel-title { font-size:13px }
  .support-panel-sub { font-size:9px }
  .support-panel-close { width:32px; height:32px }
  .support-chat-body { min-height:0; padding:12px 10px 14px }
  .support-chat-row { margin:7px 0 }
  .support-chat-bubble { padding:9px 11px; font-size:11px; line-height:1.4 }
  .support-chat-topics { gap:5px; margin:10px 0 4px 32px }
  .support-chat-topics button { padding:6px 8px; font-size:9px }
  .support-chat-composer { flex:0 0 auto; padding:8px 9px 9px }
  .support-chat-composer textarea { min-height:40px; max-height:76px; padding:10px 12px; border-radius:13px; font-size:11px }
  .support-chat-composer .support-send-btn { width:40px; height:40px; border-radius:12px }
  .support-robot-icon { width:44px; height:44px; border-radius:15px; font-size:20px }
  .support-robot-copy { display:none }
  .dip-latest-products,
  .dip-top-products { padding-left:0; padding-right:0 }
  .dip-latest-products > .container,
  .dip-top-products > .container { padding-left:0; padding-right:0 }
  .dip-latest-products .section-header,
  .dip-top-products .section-header { padding-left:10px; padding-right:10px }
  .dip-latest-products .prod-grid,
  .dip-top-products .prod-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px }
  .dip-latest-products .prod-card,
  .dip-top-products .prod-card { width:100%; border-radius:8px }
  .dip-latest-products .prod-body,
  .dip-top-products .prod-body { padding:10px 9px 8px }
  .home-hero-shell.has-promo { display:flex; flex-direction:column; background:#fff }
  .home-bottom-promo-banners { order:-1; position:relative; left:auto; right:auto; bottom:auto; z-index:2; padding:8px 0 10px; background:#fff; pointer-events:auto }
  .home-bottom-promo-banners .container { padding-left:8px; padding-right:8px; pointer-events:auto }
  .home-bottom-promo-banners .home-promo-row { padding:0; gap:10px; pointer-events:auto }
  .home-bottom-promo-banners .home-promo-card { flex:0 0 100%; width:100%; height:170px; min-height:170px; aspect-ratio:auto; border-radius:10px; background:#eef2f7; box-shadow:0 8px 22px rgba(15,23,42,.16) }
  .home-bottom-promo-banners .home-promo-card img,.home-bottom-promo-banners .home-promo-card video { object-fit:cover; background:#eef2f7 }
  .home-bottom-promo-banners .home-promo-media.youtube-card iframe { inset:0; width:100%; height:100% }
  .home-bottom-promo-banners .home-promo-copy { padding:9px 12px; background:transparent }
  .home-bottom-promo-banners .home-promo-copy strong { font-size:12px }
  .home-bottom-promo-banners .home-promo-copy small { font-size:9px }
  .home-bottom-promo-banners .home-promo-gallery-nav { width:30px; height:30px; border:0; background:transparent; color:#7c3aed; box-shadow:none; opacity:1 }
  .home-bottom-promo-banners .home-promo-gallery-nav:hover { background:transparent; color:#5b21b6; box-shadow:none }
  .product-supplier-card { margin:10px 0 14px; min-height:68px; padding:10px; border-radius:10px }
  .product-supplier-info small { font-size:9px }
  .product-supplier-info strong { font-size:13px }
  .product-supplier-info em { font-size:10px }
  .hero-slider .slider-btn { display:none!important }
  .main-header-inner { flex-wrap:nowrap }
  .main-header .site-logo { min-width:0; max-width:calc(100% - 100px) }
  .mobile-header-support-btn,.mob-menu-btn { display:inline-flex; flex:0 0 38px; width:38px; height:38px; padding:0; align-items:center; justify-content:center; border:1px solid #dbe3ef; border-radius:9px; background:#fff; color:#0f172a; font-size:16px }
  .mobile-header-support-btn { margin-left:auto; color:var(--primary) }
  .mob-menu-btn { margin-left:0 }
  .mobile-menu-overlay { position:fixed; inset:0; z-index:1600; display:block; background:rgba(15,23,42,.42); opacity:0; visibility:hidden; transition:.22s }
  .mobile-menu-overlay.open { opacity:1; visibility:visible }
  .mobile-menu-drawer { position:fixed; inset:0; z-index:1601; display:flex; flex-direction:column; background:#fff; transform:translateX(-102%); transition:transform .25s ease; overflow:hidden }
  .mobile-menu-drawer.open { transform:translateX(0) }
  .mobile-menu-head { min-height:62px; padding:9px 14px; display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid #e2e8f0; background:#fff }
  .mobile-menu-brand { min-width:0; display:flex; align-items:center; gap:9px; color:#0f172a }
  .mobile-menu-brand img { width:86px; height:36px; object-fit:contain }
  .mobile-menu-brand strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px }
  .mobile-menu-head > button { width:38px; height:38px; border:1px solid #e2e8f0; border-radius:50%; background:#f8fafc; color:#0f172a; font-size:15px }
  .mobile-menu-links { flex:1; overflow-y:auto; padding:8px 0 calc(22px + env(safe-area-inset-bottom)); background:#fff }
  .mobile-menu-links a,.mobile-menu-action { width:100%; min-height:48px; padding:0 18px; display:grid; grid-template-columns:24px minmax(0,1fr) auto; align-items:center; gap:10px; border:0; border-bottom:1px solid #f1f5f9; background:#fff; color:#172033; text-align:left; font:inherit; font-size:13px; cursor:pointer }
  .mobile-menu-links i { width:22px; color:#475569; text-align:center; font-size:15px }
  .mobile-menu-links b { padding:2px 5px; border-radius:3px; background:#312eaa; color:#fff; font-size:9px; line-height:1.2 }
  .mobile-menu-label { padding:13px 18px 7px; border-bottom:1px solid #e2e8f0; color:#64748b; font-size:11px; text-transform:uppercase; letter-spacing:.5px }
  .mobile-menu-preferences { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; padding:12px 18px; border-bottom:1px solid #e2e8f0; background:#f8fafc }
  .mobile-menu-preferences label { min-width:0; display:grid; gap:6px; color:#334155; font-size:10px; font-weight:850 }
  .mobile-menu-preferences label span { display:flex; align-items:center; gap:6px }
  .mobile-menu-preferences label i { width:auto; color:var(--primary); font-size:13px }
  .mobile-menu-preferences select { width:100%; min-width:0; height:38px; padding:0 8px; border:1px solid #dbe3ef; border-radius:8px; background:#fff; font-size:11px }
  .mobile-menu-links .mobile-menu-logout,.mobile-menu-links .mobile-menu-logout i { color:#dc2626 }
  .home-recent-section { padding-top:14px; padding-bottom:18px }
  .home-recent-section .section-header { margin-bottom:8px }
  .home-recent-section .section-title { font-size:17px }
  .home-recent-section .section-subtitle,.home-recent-section .section-title-line { display:none }
  .home-recent-grid { grid-auto-columns:112px; gap:8px; padding-top:2px }
  .recent-visit-card { display:block; min-height:0; padding:0; border-radius:8px; overflow:hidden }
  .recent-visit-media { width:100%; height:104px; border-radius:0 }
  .recent-visit-media em,.recent-visit-body { display:none }
  body.mobile-menu-open { overflow:hidden }
  .page-dashboard .top-bar,.page-dashboard .main-header,.page-dashboard .cat-navbar,.page-dashboard .home-search-band { display:none!important }
  .page-dashboard .dashboard-hero { background:#fff; color:#0f172a; border-bottom:1px solid #e2e8f0; box-shadow:0 6px 18px rgba(15,23,42,.06) }
  .page-dashboard .dashboard-hero > .container,
  .page-dashboard .dashboard-main-section > .container { width:100%; max-width:none; padding-left:0; padding-right:0 }
  .page-dashboard .dashboard-hero-inner { padding:7px 9px 8px }
  .page-dashboard .dashboard-main-section { padding-top:10px }
  .page-dashboard .dashboard-kicker { color:var(--primary) }
  .page-dashboard .dashboard-kicker { font-size:8px; letter-spacing:.45px; margin-bottom:1px }
  .page-dashboard .dashboard-user-card h1 { color:#0f172a; font-size:17px; margin-bottom:2px }
  .page-dashboard .dashboard-user-card p { color:#64748b; font-size:10.5px; line-height:1.25 }
  .dashboard-hero-inner { position:relative; display:block }
  .dashboard-user-card { min-height:58px; padding-right:58px }
  .dashboard-mobile-notification { display:inline-flex; margin-left:auto }
  .dashboard-user-card .dashboard-mobile-notification + .dashboard-account-switch-compact { margin-left:4px }
  .dashboard-account-overview { grid-template-columns:1fr; gap:8px; margin-top:16px }
  .dashboard-ticket-card { grid-template-columns:38px minmax(0,1fr); gap:9px; padding:11px }
  .dashboard-ticket-icon { width:38px; height:38px; border-radius:10px }
  .dashboard-ticket-meta { grid-column:2; min-width:0; width:100%; grid-template-columns:auto 1fr; align-items:center; justify-items:start }
  .dashboard-ticket-meta > b { grid-column:1/-1 }
  .dashboard-ticket-main b,.dashboard-ticket-main small { white-space:normal; display:-webkit-box; -webkit-box-orient:vertical; overflow:hidden }
  .dashboard-ticket-main b { -webkit-line-clamp:1 }
  .dashboard-ticket-main small { -webkit-line-clamp:2 }
  .dashboard-profile-card .page-card-header { align-items:center }
  .dashboard-profile-card .dashboard-card-toggle { flex:1; min-width:0 }
  .dashboard-account-readonly { display:grid; grid-template-columns:1fr; gap:0 }
  .dashboard-account-readonly.editing { display:none }
  .dashboard-account-readonly > div { min-width:0; display:grid; grid-template-columns:26px minmax(0,1fr); align-items:center; gap:8px; padding:8px 2px; border:0; border-bottom:1px solid #eef2f7; border-radius:0; background:transparent }
  .dashboard-account-readonly > div > i { width:26px; height:26px; display:flex; align-items:center; justify-content:center; border-radius:0; background:transparent; color:var(--primary) }
  .dashboard-account-readonly span,.dashboard-account-readonly small,.dashboard-account-readonly strong { display:block; min-width:0 }
  .dashboard-account-readonly small { color:#64748b; font-size:10px }
  .dashboard-account-readonly strong { margin-top:2px; overflow:hidden; text-overflow:ellipsis; color:#0f172a; font-size:13px }
  .dashboard-account-edit-form { display:none!important }
  .dashboard-account-edit-form.active { display:grid!important }
  .dashboard-mobile-profile-nav.active { position:relative; top:auto; z-index:1; display:flex!important; width:100%; margin:10px 0 0; padding:7px 0 2px; background:transparent }
  .dashboard-main-section > .container > .dashboard-mode-nav { display:none!important }
  .dashboard-account-switch-compact { grid-template-columns:repeat(2,36px); margin-left:auto }
  .dashboard-account-switch-compact button { width:36px; min-height:36px; font-size:14px }
  .dashboard-hero-actions { width:100%; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; margin-top:8px }
  .dashboard-hero-btn { min-width:0; min-height:32px; padding:0 3px; justify-content:center; gap:3px; border:1px solid #e2e8f0; border-radius:7px; background:#f8fafc; color:#0f172a; box-shadow:none; font-size:8.5px }
  .dashboard-hero-btn i { font-size:9px }
  .dashboard-menu-btn { position:absolute; right:0; top:5px; width:44px; height:44px; margin:0; border-color:#e2e8f0; background:#f8fafc; color:#0f172a; box-shadow:none }
  .dashboard-settings-panel { top:0; left:0; right:0; bottom:0; width:100%; height:100dvh; max-height:none; border-radius:0; box-shadow:-24px 0 60px rgba(15,23,42,.24); transform:translateX(105%); padding-bottom:env(safe-area-inset-bottom) }
  body.dashboard-panel-open .dashboard-settings-panel { transform:translateX(0) }
  .dashboard-panel-head { padding:14px 16px 11px; border-radius:0 }
  .dashboard-panel-menu { flex:1; padding:12px 14px 18px; overflow-y:auto }
  .dashboard-panel-menu a { min-height:42px; font-size:13px }
}

@media (max-width: 600px) {
  .product-detail-page { width:100%; max-width:100%; padding:14px 12px 28px!important; overflow:hidden }
  .product-detail-page > nav { margin-bottom:12px!important; overflow:hidden; white-space:nowrap; flex-wrap:nowrap!important }
  .product-detail-page > nav span { overflow:hidden; text-overflow:ellipsis }
  .product-detail-grid { display:grid!important; grid-template-columns:minmax(0,1fr)!important; gap:16px!important; width:100%; min-width:0 }
  .product-media-column,.product-info-column { width:100%; min-width:0 }
  .product-gallery-layout { grid-template-columns:minmax(0,1fr)!important; gap:8px }
  .product-gallery-main { width:100%; min-width:0; border-radius:14px }
  .product-zoom-viewer { min-height:260px; background-size:contain }
  .product-thumb-rail { order:2; width:100%; flex-direction:row; overflow-x:auto; padding:2px 0 4px }
  .product-thumb { flex:0 0 58px; width:58px; height:58px }
  .product-info-column h1 { font-size:1.3rem!important }
  .product-price-card,.product-shipping-card { width:100%; padding:14px!important; margin-bottom:12px!important; box-sizing:border-box }
  .product-price-card > div:first-child { font-size:1.55rem!important }
  .product-shipping-grid { grid-template-columns:minmax(0,1fr)!important; gap:9px!important }
  .product-shipping-grid > div { min-width:0; overflow-wrap:anywhere }
  .product-detail-actions { gap:8px!important }
  .product-detail-actions .btn { min-height:44px; width:100%; justify-content:center }
  .product-detail-page .page-card { width:100%; padding:16px; margin-top:18px!important; border-radius:12px; overflow:hidden }
  .product-detail-page .tab-btn { flex:1; min-width:0; padding:10px 6px!important; font-size:12px!important }
  .product-detail-page table { display:block; width:100%; overflow-x:auto }
  .product-enquiry-panel { width:calc(100vw - 20px); max-height:calc(100vh - 90px) }
}

@media (max-width: 600px) {
  .business-profile-page { padding:12px 0 26px }
  .business-profile-page > .container { width:100%; max-width:100%; padding:0 12px }
  .business-profile-layout { width:100%; min-width:0; gap:12px!important }
  .business-profile-main,.business-profile-sidebar { width:100%; min-width:0 }
  .biz-cover-wrap { min-height:132px; aspect-ratio:2.45/1; border-radius:12px 12px 0 0 }
  .biz-profile-logo { left:14px; bottom:-34px; width:70px; height:70px; border-width:4px; font-size:1.45rem }
  .biz-profile-body { padding:44px 12px 16px }
  .biz-profile-body h1 { font-size:1.25rem!important }
  .biz-profile-body > p { font-size:13px; line-height:1.55!important; margin-bottom:14px!important }
  .business-follow-row { gap:7px; margin-bottom:12px }
  .business-follow-btn { min-height:36px; padding:0 11px; font-size:11px }
  .business-follow-count { min-height:32px; padding:0 9px; font-size:10px }
  .business-profile-owner-actions { display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px!important; margin-bottom:14px!important }
  .business-profile-owner-actions .btn { min-width:0; min-height:38px; padding:7px 6px; justify-content:center; text-align:center; font-size:10px }
  .business-profile-info-grid { gap:8px!important; margin-bottom:12px!important }
  .business-profile-info-grid > div { min-width:0; padding:10px!important; overflow-wrap:anywhere }
  .business-profile-stat-grid { grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:6px!important }
  .business-profile-stat-grid > a { min-width:0; padding:9px 3px!important }
  .business-profile-stat-grid > a span { font-size:10px!important }
  .business-profile-page .page-card { width:100%; min-width:0; margin-top:12px!important; padding:14px; border-radius:12px }
  .business-profile-page .page-card-header { align-items:flex-start; margin-bottom:12px }
  .business-profile-page .page-card-header .btn { font-size:10px; padding:7px 9px }
  .business-profile-page .service-grid { grid-template-columns:minmax(0,1fr); gap:10px }
  .business-profile-page .service-card-media { height:150px }
  .business-profile-page .prod-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px }
  .business-profile-page .prod-img { height:120px }
  .business-profile-page .prod-body { padding:10px }
  .business-profile-page .prod-name { font-size:12px }
  .business-profile-page .business-gallery-grid { gap:7px }
}

@media (max-width: 560px) {
  .dashboard-address-grid {
    grid-template-columns: 1fr !important;
  }
  .dashboard-avatar-manage-row {
    align-items:flex-start;
    flex-direction:column;
  }
  .dashboard-verify-row {
    grid-template-columns:1fr;
  }
  .dashboard-quick-actions .btn {
    width:100%;
    justify-content:center;
  }
  .dashboard-overview { padding:12px }
  .dashboard-overview-grid,
  .dashboard-activity-strip { grid-template-columns:1fr }
  .dashboard-overview-head { flex-direction:column }
  .dashboard-overview-head a,
  .dashboard-analysis-filter,
  .dashboard-analysis-filter select { width:100% }
  .dashboard-market-item {
    grid-template-columns:28px minmax(0,1fr) auto;
  }
  .dashboard-market-rank {
    width:28px;
  }
  .dashboard-market-item .dashboard-row-thumb {
    display:none;
  }
  .dashboard-upgrade-business-select select {
    max-width:none;
    width:100%;
  }
  .dashboard-thread-main {
    grid-template-columns:1fr;
  }
  .dashboard-thread-head small {
    margin-left:0;
    width:100%;
  }
  .biz-upgrade-form {
    grid-template-columns: 1fr;
  }
  .biz-upgrade-btn {
    width: 100%;
  }
}
