/*
  Nàng Cosmetics Premium V6 - Luxe Motion
  Giao diện giữ tinh thần gọn/sang của V4-V5 nhưng nâng cấp mạnh hơn về độ hoàn thiện và hiệu ứng.
*/
:root{
  --bg:#fffaf8;
  --bg-soft:#fff4f1;
  --bg-card:rgba(255,255,255,.84);
  --bg-card-strong:#ffffff;
  --line:rgba(123,72,69,.12);
  --line-strong:rgba(123,72,69,.18);
  --text:#2b1d1b;
  --text-soft:#6d5b58;
  --primary:#9a1831;
  --primary-2:#c14457;
  --accent:#f4d9cf;
  --accent-2:#ffe9e2;
  --shadow:0 18px 40px rgba(96,54,51,.10);
  --shadow-lg:0 24px 60px rgba(104,57,54,.14);
  --radius-xs:14px;
  --radius-sm:18px;
  --radius-md:24px;
  --radius-lg:32px;
  --container:min(1180px, calc(100% - 32px));
  --header-h:84px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(255,221,226,.82), transparent 25%),
    radial-gradient(circle at bottom right, rgba(245,214,205,.72), transparent 30%),
    linear-gradient(180deg, #fffdfc 0%, #fff8f5 35%, #fffdfc 100%);
  font: 500 16px/1.65 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body.no-scroll{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img{max-width:100%;display:block}
svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.container{width:var(--container);margin:0 auto}
.section-compact{padding:28px 0}
.page-orb{position:fixed;z-index:-3;border-radius:999px;filter:blur(24px);opacity:.5;pointer-events:none;animation:floatOrb 14s ease-in-out infinite}
.orb-1{width:260px;height:260px;left:-80px;top:120px;background:rgba(243,196,205,.55)}
.orb-2{width:320px;height:320px;right:-100px;top:320px;background:rgba(250,223,205,.6);animation-delay:-6s}
.page-grid{position:fixed;inset:0;z-index:-4;background-image:linear-gradient(rgba(128,86,85,.035) 1px, transparent 1px),linear-gradient(90deg, rgba(128,86,85,.035) 1px, transparent 1px);background-size:38px 38px;mask-image:linear-gradient(180deg, rgba(0,0,0,.1), transparent 80%);pointer-events:none}

.preloader{position:fixed;inset:0;background:rgba(255,250,247,.96);backdrop-filter:blur(12px);display:grid;place-items:center;z-index:120;transition:.45s ease}
.preloader.hide{opacity:0;visibility:hidden}
.preloader__card{min-width:220px;padding:28px;border-radius:26px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);display:grid;justify-items:center;gap:10px}
.preloader__card img{width:46px;height:46px}
.preloader__card b{font-size:1.05rem}
.preloader__card span{font-size:.95rem;color:var(--text-soft)}

.topbar{height:42px;background:linear-gradient(90deg,#8f102d,#c64257,#8f102d);color:#fff;display:flex;align-items:center;overflow:hidden;position:relative}
.topbar::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent);transform:translateX(-100%);animation:shine 8s linear infinite}
.topbar__track{display:flex;min-width:100%}
.topbar__inner{display:flex;gap:28px;white-space:nowrap;min-width:max-content;padding-inline:18px;animation:marquee 28s linear infinite;font-size:.92rem;font-weight:700;letter-spacing:.02em}
.topbar__inner span{position:relative;display:flex;align-items:center;gap:8px}
.topbar__inner span:not(:last-child)::after{content:"";width:5px;height:5px;border-radius:999px;background:rgba(255,255,255,.65);margin-left:10px}

.header{position:sticky;top:0;z-index:50;padding:14px 0 0;background:linear-gradient(180deg, rgba(255,250,248,.92), rgba(255,250,248,.52));backdrop-filter:blur(10px)}
.header__inner{height:70px;padding:0 16px;border:1px solid transparent;border-radius:24px;display:flex;align-items:center;justify-content:space-between;gap:16px;transition:.25s ease}
.header.scrolled .header__inner{background:rgba(255,255,255,.74);border-color:var(--line);box-shadow:var(--shadow)}
.brand img{height:42px}
.nav{display:flex;align-items:center;gap:28px}
.nav a{font-size:.97rem;font-weight:700;color:#5a4744;position:relative;padding:8px 0}
.nav a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;border-radius:999px;background:linear-gradient(90deg,var(--primary),#d05d73);transform:scaleX(0);transform-origin:left;transition:.25s ease}
.nav a:hover::after{transform:scaleX(1)}
.header__actions{display:flex;align-items:center;gap:10px}
.icon-btn,.cart-button,.menu-btn,.hotline{height:48px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.8);box-shadow:0 8px 24px rgba(96,54,51,.06)}
.icon-btn{width:48px;display:grid;place-items:center;color:var(--text)}
.icon-btn svg,.cart-button svg{width:20px;height:20px}
.hotline{display:flex;align-items:center;gap:12px;padding:0 14px;color:var(--text)}
.hotline span{font-size:.78rem;color:var(--text-soft);display:block}
.hotline b{font-size:.95rem}
.cart-button{display:flex;align-items:center;gap:10px;padding:0 14px;color:var(--text)}
.cart-button b{min-width:28px;height:28px;border-radius:999px;background:linear-gradient(135deg,var(--primary),var(--primary-2));display:grid;place-items:center;color:#fff;font-size:.85rem}
.menu-btn{display:none;width:48px;padding:0 12px;gap:4px;flex-direction:column;justify-content:center;background:rgba(255,255,255,.82)}
.menu-btn span{height:2px;background:var(--text);border-radius:999px}

.flash-shell,.hero-shell,.guide-shell{position:relative;border:1px solid var(--line);background:linear-gradient(180deg, rgba(255,255,255,.80), rgba(255,255,255,.92));box-shadow:var(--shadow);border-radius:32px;padding:28px;overflow:hidden}
.flash-shell::before,.hero-shell::before,.guide-shell::before{content:"";position:absolute;inset:-1px;background:linear-gradient(135deg, rgba(255,255,255,.7), rgba(255,255,255,0), rgba(255,255,255,.6));border-radius:inherit;pointer-events:none}
.flash-shell::after,.hero-shell::after{content:"";position:absolute;width:180px;height:180px;border-radius:999px;right:-70px;top:-70px;background:radial-gradient(circle, rgba(244,207,197,.55), transparent 70%);pointer-events:none}

.flash__head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:16px;position:relative;z-index:1}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;background:rgba(154,24,49,.08);color:var(--primary);font-weight:800;font-size:.83rem;letter-spacing:.04em;text-transform:uppercase}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:999px;background:linear-gradient(135deg,var(--primary),#ee8b9c)}
h1,h2,h3,p{margin:0}
.flash__head h1,.hero__copy h2,.section-title h2,.guide__copy h2,.order__summary h2{font-size:clamp(1.85rem, 3vw, 3rem);line-height:1.15;letter-spacing:-.03em;margin-top:12px}
.flash__head p,.hero__copy p,.guide__copy p,.order__summary p{max-width:620px;margin-top:12px;color:var(--text-soft);font-size:1rem}
.countdown{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.countdown span{min-width:88px;padding:14px 16px;border-radius:20px;border:1px solid rgba(154,24,49,.12);background:linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,239,240,.92));box-shadow:inset 0 1px 0 rgba(255,255,255,.8), 0 10px 24px rgba(154,24,49,.08);text-align:center;position:relative;overflow:hidden}
.countdown span::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg, transparent 30%, rgba(255,255,255,.5), transparent 70%);transform:translateX(-100%);animation:shine 4.5s ease-in-out infinite}
.countdown b{display:block;font-size:1.75rem;line-height:1;font-weight:800}
.countdown small{display:block;margin-top:8px;color:var(--text-soft);font-size:.82rem;text-transform:uppercase;letter-spacing:.05em}
.flash-badges{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px;position:relative;z-index:1}
.flash-badges span,.hero__badges span,.tag-row span,.quick-meta span,.benefit-grid article,.guide-list article,.mood-card,.result-pill{border:1px solid var(--line);background:rgba(255,255,255,.76);box-shadow:0 10px 24px rgba(102,57,54,.05)}
.flash-badges span{padding:10px 14px;border-radius:999px;font-weight:700;color:#634e4b;font-size:.93rem}
.feature-row{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;position:relative;z-index:1}
.feature-card{position:relative;padding:18px;border-radius:26px;border:1px solid rgba(255,255,255,.55);background:linear-gradient(180deg, rgba(255,255,255,.86), rgba(255,255,255,.95));box-shadow:0 16px 34px rgba(105,55,53,.1);display:grid;grid-template-columns:110px 1fr;gap:16px;overflow:hidden;transform:translateY(0);transition:transform .28s ease, box-shadow .28s ease}
.feature-card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg, var(--bg1), var(--bg2));opacity:.58;z-index:0}
.feature-card::after{content:"";position:absolute;inset:auto -40px -50px auto;width:140px;height:140px;border-radius:999px;background:radial-gradient(circle, rgba(255,255,255,.65), transparent 70%)}
.feature-card > *{position:relative;z-index:1}
.feature-card:hover{transform:translateY(-8px);box-shadow:0 22px 44px rgba(105,55,53,.16)}
.feature-card img{width:110px;height:132px;object-fit:cover;border-radius:20px;border:1px solid rgba(255,255,255,.6);background:rgba(255,255,255,.6)}
.sale-badge{position:absolute;top:14px;left:14px;padding:6px 10px;border-radius:999px;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;font-size:.82rem;font-weight:800;box-shadow:0 12px 24px rgba(154,24,49,.28)}
.feature-card h3{font-size:1.08rem;line-height:1.32;margin-bottom:6px}
.feature-card p{color:var(--text-soft);font-size:.95rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:14px}
.price, .price-line{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.price b,.price-line b{font-size:1.18rem;color:var(--primary);font-weight:800}
.price del,.price-line del{font-size:.94rem;color:#987f7a}
.feature-actions{display:flex;gap:10px;margin-top:14px}
.mini-buy,.mini-view,.small-btn,.add-btn{height:42px;border-radius:14px;border:1px solid transparent;font-weight:800;transition:.25s ease}
.mini-buy,.add-btn,.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;box-shadow:0 14px 26px rgba(154,24,49,.20)}
.mini-buy,.mini-view{padding:0 16px}
.mini-view,.small-btn,.btn-light{background:rgba(255,255,255,.9);border-color:var(--line);color:var(--text)}
.mini-buy:hover,.add-btn:hover,.btn-primary:hover,.mini-view:hover,.small-btn:hover,.btn-light:hover{transform:translateY(-2px)}

.hero__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center;position:relative;z-index:1}
.hero__copy{padding-right:8px}
.hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 18px}
.btn{height:50px;padding:0 22px;border:none;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;position:relative;overflow:hidden}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg, transparent 35%, rgba(255,255,255,.25), transparent 65%);transform:translateX(-100%);transition:transform .6s ease}
.btn:hover::after{transform:translateX(100%)}
.hero__badges{display:flex;flex-wrap:wrap;gap:10px}
.hero__badges span{padding:10px 14px;border-radius:999px;font-size:.92rem;font-weight:700;color:#5d4946}
.hero__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}
.hero__stats article{padding:16px 14px;border-radius:20px;background:linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,248,246,.92));border:1px solid var(--line);box-shadow:0 12px 24px rgba(106,58,54,.06)}
.hero__stats b{display:block;font-size:1.28rem;line-height:1.1;color:var(--primary)}
.hero__stats span{display:block;color:var(--text-soft);font-size:.9rem;margin-top:6px}
.hero__visual{display:flex;justify-content:flex-end}
.hero-stack{position:relative;max-width:480px;width:100%;padding-top:26px;will-change:transform;transform-style:preserve-3d}
.hero-stack__label{position:absolute;top:0;left:18px;padding:9px 14px;border-radius:999px;background:linear-gradient(135deg,#fff,#ffeceb);color:var(--primary);font-weight:800;border:1px solid var(--line);box-shadow:var(--shadow);z-index:3}
.hero-product{position:relative;padding:24px;border-radius:30px;background:linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.96));border:1px solid var(--line);box-shadow:var(--shadow-lg);overflow:hidden}
.hero-product__glow{position:absolute;inset:auto auto 14% -10%;width:180px;height:180px;border-radius:999px;background:radial-gradient(circle, rgba(212,80,105,.2), transparent 72%);pointer-events:none}
.hero-product__image{position:relative;padding:16px;border-radius:26px;background:linear-gradient(180deg,#fff9f6,#ffeceb);border:1px solid rgba(255,255,255,.8);box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}
.hero-product__image::after{content:"";position:absolute;inset:16px;border-radius:20px;background:linear-gradient(180deg, transparent 0%, rgba(255,255,255,.4) 100%);pointer-events:none}
.hero-product__image img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:20px;animation:floatItem 6s ease-in-out infinite}
.hero-product__info{padding-top:18px}
.hero-product__info span{color:var(--text-soft);font-size:.92rem}
.hero-product__info h3{font-size:1.55rem;line-height:1.15;margin:8px 0 12px}
.hero-swatches{display:flex;gap:8px;margin-top:16px}
.hero-swatches i{width:18px;height:18px;border-radius:999px;background:var(--sw);display:block;border:2px solid rgba(255,255,255,.9);box-shadow:0 6px 12px rgba(0,0,0,.08)}
.hero-float{position:absolute;padding:11px 14px;border-radius:18px;background:rgba(255,255,255,.88);border:1px solid var(--line);box-shadow:0 16px 32px rgba(105,55,53,.12);font-size:.9rem;font-weight:800;color:#654d4a;backdrop-filter:blur(10px);animation:floatTag 6.5s ease-in-out infinite}
.hero-float--one{right:-14px;top:64px}
.hero-float--two{left:-14px;bottom:34px;animation-delay:-2.5s}

.benefit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.benefit-grid article{padding:18px 20px;border-radius:24px;display:flex;align-items:center;gap:16px}
.benefit-grid b{min-width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;display:grid;place-items:center;font-size:1rem}
.benefit-grid span{color:#5f4a47;font-weight:700}

.section-title{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px}
.section-title a{font-weight:800;color:var(--primary)}
.mood-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.mood-card{padding:16px 14px;border-radius:22px;text-align:left;transition:.25s ease;display:grid;gap:8px;color:#5c4845}
.mood-card:hover,.mood-card.active{transform:translateY(-4px);border-color:rgba(154,24,49,.18);box-shadow:0 18px 30px rgba(106,58,54,.1)}
.mood-card.active{background:linear-gradient(180deg, #fffefe, #fff2f0)}
.mood-card__art{width:42px;height:42px;border-radius:16px;background:var(--tone, linear-gradient(135deg,#f3d0ca,#f7efea));box-shadow:inset 0 6px 10px rgba(255,255,255,.5), 0 10px 18px rgba(0,0,0,.05)}
.mood-card__art.all{background:linear-gradient(135deg,#f7d6db,#ffd8c7,#dd8ea5)}
.mood-card b{font-size:1rem}
.mood-card small{font-size:.86rem;color:#8a726d}

.products-head{margin-bottom:14px}
.result-pill{padding:10px 14px;border-radius:999px;font-weight:800;color:var(--primary)}
.filter-panel{display:grid;grid-template-columns:1.6fr repeat(3,.7fr);gap:12px;padding:14px;border-radius:24px;background:rgba(255,255,255,.78);border:1px solid var(--line);box-shadow:var(--shadow);position:sticky;top:96px;z-index:8;margin-bottom:18px;backdrop-filter:blur(12px)}
.search-field,select,input,textarea{width:100%}
.search-field{display:flex;align-items:center;gap:10px;padding:0 14px;height:50px;border-radius:16px;background:#fff;border:1px solid var(--line)}
.search-field svg{width:18px;height:18px;color:#a08682}
.search-field input,select,textarea,input{border:none;outline:none;background:transparent;color:var(--text)}
select{height:50px;padding:0 14px;border-radius:16px;background:#fff;border:1px solid var(--line);color:var(--text)}
textarea,input{padding:14px 16px;border-radius:16px;background:#fff;border:1px solid var(--line)}
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.product-card{position:relative;border-radius:28px;overflow:hidden;background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.98));border:1px solid rgba(255,255,255,.72);box-shadow:var(--shadow);transition:transform .28s ease, box-shadow .28s ease;will-change:transform}
.product-card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg, var(--bg1), var(--bg2));opacity:.42;pointer-events:none}
.product-card::after{content:"";position:absolute;top:-10%;left:-120%;width:70%;height:130%;background:linear-gradient(120deg, transparent 25%, rgba(255,255,255,.6), transparent 70%);transform:skewX(-18deg);transition:transform .9s ease}
.product-card:hover{transform:translateY(-10px);box-shadow:0 24px 48px rgba(105,55,53,.16)}
.product-card:hover::after{transform:translateX(330%) skewX(-18deg)}
.product-media,.product-info{position:relative;z-index:1}
.product-media{padding:16px 16px 0}
.product-media img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:22px;background:rgba(255,255,255,.76);transition:transform .35s ease}
.product-card:hover .product-media img{transform:scale(1.035)}
.product-badges{position:absolute;left:28px;right:28px;top:28px;display:flex;justify-content:space-between;gap:10px;pointer-events:none}
.product-badges span{padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.92);backdrop-filter:blur(6px);font-size:.78rem;font-weight:800;box-shadow:0 8px 18px rgba(0,0,0,.06)}
.wish-btn{position:absolute;right:28px;bottom:16px;width:40px;height:40px;border:none;border-radius:999px;background:rgba(255,255,255,.92);box-shadow:0 12px 20px rgba(0,0,0,.07);font-size:1rem;color:#927b76}
.wish-btn.active{color:var(--primary);background:#fff0f2}
.product-info{padding:18px 18px 20px}
.product-topline{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:.85rem;color:#7c6763;font-weight:800;margin-bottom:8px}
.product-info h3{font-size:1.08rem;line-height:1.38;min-height:2.76em}
.shade{display:block;color:var(--primary);font-weight:800;margin:6px 0 10px}
.desc{color:var(--text-soft);font-size:.94rem;min-height:4.7em;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tag-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.tag-row span{padding:8px 11px;border-radius:999px;font-size:.78rem;font-weight:800;color:#654d4a}
.product-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;margin-top:16px}
.card-actions{display:flex;gap:8px}
.small-btn{width:42px}
.add-btn{padding:0 14px}

.guide__grid{display:grid;grid-template-columns:1fr .95fr;gap:24px;align-items:center;position:relative;z-index:1}
.guide-list{display:grid;gap:14px}
.guide-list article{padding:18px 20px;border-radius:22px;display:grid;gap:6px}
.guide-list b{font-size:1rem}
.guide-list span{color:var(--text-soft)}

.order__grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:18px}
.order__summary,.order-form{padding:24px;border-radius:28px;background:linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.94));border:1px solid var(--line);box-shadow:var(--shadow)}
.order-box{display:grid;gap:12px;margin-top:18px;min-height:220px}
.order-box article{display:grid;grid-template-columns:56px 1fr auto;gap:14px;align-items:center;padding:12px;border-radius:18px;background:#fff;border:1px solid var(--line)}
.order-box img{width:56px;height:56px;border-radius:14px;object-fit:cover}
.order-box b{display:block;font-size:.95rem}
.order-box span{color:var(--text-soft);font-size:.88rem}
.order-total{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}
.order-total span{color:var(--text-soft)}
.order-total b{font-size:1.3rem;color:var(--primary)}
.order-form{display:grid;gap:14px}
.order-form label{display:grid;gap:8px;font-weight:800;font-size:.95rem;color:#4b3936}
.form-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:4px}

.footer{padding:22px 0 92px}
.footer__grid{padding:24px 26px;border-radius:28px;background:rgba(255,255,255,.88);border:1px solid var(--line);box-shadow:var(--shadow);display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:24px}
.footer img{height:40px;margin-bottom:12px}
.footer p,.footer span,.footer a{color:var(--text-soft)}
.footer b{display:block;margin-bottom:10px}
.footer div{display:grid;align-content:start;gap:10px}

.cart-overlay,.mobile-menu,.quick-modal,.search-modal{position:fixed;inset:0;background:rgba(37,22,21,.42);backdrop-filter:blur(6px);opacity:0;visibility:hidden;transition:.25s ease;z-index:80}
.cart-overlay.show,.mobile-menu.show,.quick-modal.show,.search-modal.show{opacity:1;visibility:visible}
.cart-drawer{position:fixed;top:0;right:0;width:min(420px, 100%);height:100vh;background:#fff;padding:22px;transform:translateX(100%);transition:.28s ease;z-index:90;display:grid;grid-template-rows:auto 1fr auto;box-shadow:-16px 0 50px rgba(31,18,18,.18)}
.cart-drawer.show{transform:none}
.cart-drawer__head,.cart-drawer__foot,.cart-total,.cart-item__bottom,.qty{display:flex;align-items:center;justify-content:space-between;gap:12px}
.cart-drawer__head{padding-bottom:14px;border-bottom:1px solid var(--line)}
.cart-drawer__head span{display:block;color:var(--text-soft);font-size:.92rem}
.cart-drawer__head b{font-size:1.15rem}
.cart-drawer__head button,.modal-close,#closeMenu,#closeCart{width:42px;height:42px;border:none;border-radius:14px;background:#f7f0ed;color:var(--text);font-size:1.4rem}
.cart-list{display:grid;gap:12px;padding:16px 2px;overflow:auto}
.cart-item{display:grid;grid-template-columns:72px 1fr;gap:12px;padding:12px;border-radius:18px;background:#fff8f6;border:1px solid var(--line)}
.cart-item img{width:72px;height:72px;border-radius:16px;object-fit:cover}
.cart-item h4{font-size:1rem;margin:0 0 4px}
.cart-item small{color:var(--text-soft)}
.qty{justify-content:flex-start}
.qty button,.remove-btn{height:34px;padding:0 12px;border:none;border-radius:12px;background:#fff;border:1px solid var(--line)}
.remove-btn{color:var(--primary);font-weight:800}
.cart-drawer__foot{padding-top:14px;border-top:1px solid var(--line)}
.cart-total span{display:block;color:var(--text-soft)}
.cart-total b{font-size:1.2rem;color:var(--primary)}
.empty-state{padding:22px;border-radius:20px;background:#fff8f5;border:1px dashed rgba(154,24,49,.18)}
.empty-state h3{font-size:1.05rem;margin-bottom:8px}
.empty-state p{color:var(--text-soft)}

.quick-modal__card,.search-modal__card,.mobile-menu__panel{position:relative;width:min(980px, calc(100% - 24px));margin:5vh auto;background:#fff;border-radius:30px;border:1px solid var(--line);box-shadow:var(--shadow-lg);padding:24px}
.quick-modal__card{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-height:86vh;overflow:auto}
.quick-gallery{display:grid;gap:12px}
.quick-main{padding:16px;border-radius:24px;background:#fff7f4;border:1px solid var(--line)}
.quick-main img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:18px}
.quick-thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.quick-thumbs button{padding:8px;border-radius:16px;border:1px solid var(--line);background:#fff}
.quick-thumbs button.active{border-color:rgba(154,24,49,.28);box-shadow:0 10px 22px rgba(154,24,49,.1)}
.quick-thumbs img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:12px}
.quick-info h3{font-size:1.55rem;line-height:1.2;margin:10px 0 8px}
.quick-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}
.quick-meta span{padding:14px 12px;border-radius:18px;font-size:.9rem;color:var(--text-soft)}
.quick-meta b{display:block;color:var(--text);font-size:.98rem;margin-top:4px}
.quick-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.modal-close{position:fixed;right:18px;top:18px;z-index:2}

.search-modal__card{max-width:720px;margin:14vh auto;padding:30px;text-align:center}
.search-large{display:flex;align-items:center;gap:12px;height:58px;padding:0 18px;border-radius:20px;background:#fff7f5;border:1px solid var(--line);margin-top:18px}
.search-large input{padding:0;border:none;background:transparent}
.search-large svg{width:20px;height:20px;color:#9f8882}
.keyword-row{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:18px}
.keyword-row button{height:42px;padding:0 16px;border:none;border-radius:999px;background:#fff5f3;border:1px solid var(--line);font-weight:800;color:#694f4b}

.mobile-menu__panel{max-width:360px;margin:0 0 0 auto;height:100vh;border-radius:30px 0 0 30px;padding:26px;display:grid;align-content:start;gap:14px;transform:translateX(100%);transition:.25s ease}
.mobile-menu.show .mobile-menu__panel{transform:none}
.mobile-menu__panel img{height:38px;margin-bottom:6px}
.mobile-menu__panel a{padding:14px 16px;border-radius:16px;background:#fff7f5;border:1px solid var(--line);font-weight:800;color:#5a4845}
.mobile-zalo{background:linear-gradient(135deg,var(--primary),var(--primary-2))!important;color:#fff!important}

.toast{position:fixed;left:50%;bottom:100px;transform:translate(-50%, 18px);padding:14px 18px;border-radius:16px;background:#251918;color:#fff;opacity:0;visibility:hidden;transition:.25s ease;z-index:100;box-shadow:0 18px 28px rgba(0,0,0,.22);font-weight:700}
.toast.show{opacity:1;visibility:visible;transform:translate(-50%,0)}
.mobile-bottom{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);width:min(440px, calc(100% - 24px));padding:10px;border-radius:24px;background:rgba(255,255,255,.88);border:1px solid var(--line);backdrop-filter:blur(14px);box-shadow:var(--shadow-lg);display:none;grid-template-columns:repeat(4,1fr);gap:6px;z-index:60}
.mobile-bottom a,.mobile-bottom button{min-height:58px;border:none;background:transparent;border-radius:18px;display:grid;place-items:center;gap:2px;color:#5e4a47;font-weight:800;position:relative}
.mobile-bottom span{font-size:1.05rem}
.mobile-bottom i{position:absolute;top:6px;right:12px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;font-style:normal;font-size:.74rem;display:grid;place-items:center}
.floating-zalo{position:fixed;right:20px;bottom:26px;height:58px;padding:0 18px;border-radius:999px;background:linear-gradient(135deg,#00b4ff,#1ca1ff);color:#fff;display:flex;align-items:center;gap:10px;font-weight:800;box-shadow:0 18px 30px rgba(20,123,255,.28);z-index:59;animation:pulseSoft 3.2s ease-in-out infinite}
.floating-zalo span{font-size:1.2rem}

.reveal{opacity:0;transform:translateY(20px);transition:opacity .55s ease, transform .55s ease}
.reveal.delay-1{transition-delay:.1s}
.reveal.show{opacity:1;transform:none}

@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes shine{to{transform:translateX(200%)}}
@keyframes floatItem{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes floatTag{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes floatOrb{0%,100%{transform:translateY(0)}50%{transform:translateY(18px)}}
@keyframes pulseSoft{0%,100%{box-shadow:0 18px 30px rgba(20,123,255,.28)}50%{box-shadow:0 22px 36px rgba(20,123,255,.38)}}

@media (max-width: 1080px){
  .nav,.hotline{display:none}
  .menu-btn{display:flex}
  .feature-row,.product-grid{grid-template-columns:repeat(2,1fr)}
  .hero__grid,.guide__grid,.order__grid{grid-template-columns:1fr}
  .hero__visual{justify-content:center}
  .mood-grid{grid-template-columns:repeat(3,1fr)}
  .benefit-grid,.footer__grid{grid-template-columns:1fr}
}
@media (max-width: 820px){
  .section-compact{padding:22px 0}
  .flash-shell,.hero-shell,.guide-shell,.order__summary,.order-form,.footer__grid{padding:20px}
  .filter-panel{grid-template-columns:1fr 1fr;top:84px}
  .search-field{grid-column:1 / -1}
  .feature-row,.product-grid{grid-template-columns:1fr}
  .countdown{justify-content:flex-start}
  .countdown span{min-width:82px}
  .hero__stats{grid-template-columns:1fr}
  .mood-grid{grid-template-columns:repeat(2,1fr)}
  .quick-modal__card{grid-template-columns:1fr;margin:8vh auto;padding:18px}
  .floating-zalo{display:none}
  .mobile-bottom{display:grid}
}
@media (max-width: 560px){
  .container{width:min(100% - 20px, 100%)}
  .topbar{height:38px}
  .topbar__inner{gap:20px;font-size:.84rem}
  .header{padding-top:10px}
  .header__inner{height:62px;padding:0 12px;border-radius:20px}
  .brand img{height:36px}
  .cart-button{padding:0 10px}
  .cart-button span{display:none}
  .flash__head{align-items:flex-start}
  .flash__head,.section-title{flex-direction:column}
  .feature-card{grid-template-columns:1fr}
  .feature-card img{width:100%;height:auto;aspect-ratio:1/1}
  .mood-grid{grid-template-columns:1fr 1fr;gap:10px}
  .filter-panel{grid-template-columns:1fr}
  .product-foot{flex-direction:column;align-items:stretch}
  .card-actions{width:100%}
  .small-btn,.add-btn{flex:1}
  .quick-meta{grid-template-columns:1fr}
  .search-modal__card{padding:22px;margin-top:11vh}
  .mobile-menu__panel{width:min(100%, 360px)}
  .footer{padding-bottom:92px}
}


/* =========================
   Premium V8 - Slogan Luxe Upgrade
   ========================= */
:root{
  --primary:#8f1430;
  --primary-2:#c33d55;
  --champagne:#f8e9df;
  --rose-shadow:rgba(142,35,55,.16);
}

.hero-shell{
  padding:34px;
  background:
    radial-gradient(circle at 76% 18%, rgba(255,231,222,.95), transparent 34%),
    radial-gradient(circle at 12% 82%, rgba(255,218,225,.58), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.92), rgba(255,246,242,.96));
  border-color:rgba(143,20,48,.13);
}

.hero-shell::after{
  width:260px;
  height:260px;
  right:-96px;
  top:-96px;
  background:
    radial-gradient(circle, rgba(195,61,85,.15) 0 30%, rgba(255,228,218,.58) 31% 62%, transparent 70%);
}

.hero__copy h2{
  max-width:690px;
  font-size:clamp(2.15rem, 4.1vw, 4.65rem);
  line-height:1.04;
  letter-spacing:-.055em;
  text-wrap:balance;
}

.hero__copy h2::after{
  content:"";
  display:block;
  width:min(190px, 45%);
  height:7px;
  margin-top:18px;
  border-radius:999px;
  background:linear-gradient(90deg, var(--primary), #e29aaa, rgba(255,255,255,0));
  box-shadow:0 10px 22px rgba(143,20,48,.14);
}

.hero__copy p{
  max-width:640px;
  font-size:1.08rem;
  line-height:1.78;
  color:#594643;
}

.hero-promo{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}

.hero-promo span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:11px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.82);
  border:1px solid rgba(143,20,48,.11);
  box-shadow:0 12px 26px rgba(102,55,52,.07);
  font-size:.94rem;
  font-weight:800;
  color:#5b4643;
}

.hero__actions{
  margin-top:26px;
}

.btn{
  min-width:150px;
  letter-spacing:-.01em;
}

.btn-primary{
  background:
    linear-gradient(135deg, rgba(255,255,255,.18), rgba(255,255,255,0) 36%),
    linear-gradient(135deg, #84112c, #c73e57 55%, #dd7184);
  box-shadow:0 18px 34px rgba(143,20,48,.24);
}

.btn-primary:hover{
  box-shadow:0 22px 42px rgba(143,20,48,.31);
}

.hero-stack{
  filter:drop-shadow(0 28px 44px rgba(111,54,51,.15));
}

.hero-product{
  border-radius:34px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,250,247,.98));
}

.hero-product__image{
  background:
    radial-gradient(circle at 50% 18%, rgba(255,255,255,.92), transparent 31%),
    linear-gradient(160deg, #fff9f6, #ffe6e2 52%, #fff8f4);
}

.hero-product__image img{
  filter:drop-shadow(0 22px 28px rgba(119,54,50,.13));
}

.hero-float{
  border-color:rgba(143,20,48,.13);
  box-shadow:0 18px 36px rgba(93,44,42,.14);
}

.hero__stats article{
  position:relative;
  overflow:hidden;
}

.hero__stats article::after{
  content:"";
  position:absolute;
  inset:auto -30px -42px auto;
  width:110px;
  height:110px;
  border-radius:999px;
  background:radial-gradient(circle, rgba(195,61,85,.10), transparent 70%);
}

.flash-shell{
  background:
    linear-gradient(135deg, rgba(255,255,255,.9), rgba(255,246,243,.96)),
    radial-gradient(circle at 95% 10%, rgba(195,61,85,.12), transparent 35%);
}

.flash__head h1{
  font-size:clamp(2rem, 3.5vw, 3.45rem);
}

.feature-card{
  border-radius:28px;
}

.feature-card:hover{
  transform:translateY(-8px) scale(1.01);
}

.mood-card,
.product-card,
.order__summary,
.order-form,
.guide-shell,
.benefit-grid article{
  border-color:rgba(143,20,48,.10);
}

.product-card{
  border-radius:30px;
}

.product-info h3{
  letter-spacing:-.015em;
}

.product-foot .price b{
  font-size:1.22rem;
}

.add-btn{
  min-width:74px;
}

.filter-panel{
  border-color:rgba(143,20,48,.12);
  box-shadow:0 18px 34px rgba(105,55,53,.10);
}

.search-field:focus-within,
select:focus,
input:focus,
textarea:focus{
  border-color:rgba(143,20,48,.30);
  box-shadow:0 0 0 4px rgba(143,20,48,.08);
}

.floating-zalo{
  bottom:30px;
}

@media (max-width: 820px){
  .hero-shell{
    padding:24px;
  }

  .hero__copy h2{
    font-size:clamp(2.05rem, 9vw, 3.35rem);
  }

  .hero-promo{
    gap:8px;
  }

  .hero-promo span{
    padding:10px 12px;
    font-size:.9rem;
  }
}

@media (max-width: 560px){
  .hero__copy h2::after{
    width:140px;
    height:6px;
  }

  .hero-promo{
    display:grid;
    grid-template-columns:1fr;
  }

  .hero__actions .btn{
    width:100%;
  }
}


/* =========================
   Premium V9 - Professional Shop Upgrade
   ========================= */
:root{
  --ink:#251917;
  --muted:#6b5855;
  --panel:rgba(255,255,255,.88);
  --panel-solid:#ffffff;
  --gold:#d8ad73;
  --gold-soft:#fbefe0;
}

body{
  background:
    radial-gradient(circle at 8% 4%, rgba(255,226,231,.72), transparent 24%),
    radial-gradient(circle at 92% 14%, rgba(255,233,217,.72), transparent 26%),
    linear-gradient(180deg, #fffdfb 0%, #fff8f5 45%, #fffdfc 100%);
}

.header.scrolled .header__inner{
  background:rgba(255,255,255,.88);
  border-color:rgba(143,20,48,.14);
  box-shadow:0 16px 42px rgba(75,38,35,.10);
}

.nav a{
  font-size:.94rem;
}

.hero-shell{
  padding:36px;
  border-radius:34px;
  box-shadow:0 28px 70px rgba(94,48,45,.13);
}

.hero-shell::before{
  background:
    linear-gradient(135deg, rgba(255,255,255,.92), rgba(255,255,255,0) 36%),
    linear-gradient(315deg, rgba(216,173,115,.13), rgba(255,255,255,0) 42%);
}

.hero__copy h2{
  color:var(--ink);
}

.hero__copy p{
  color:#5f4b48;
}

.hero-promo span{
  background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,247,244,.92));
  border-color:rgba(143,20,48,.12);
}

.hero-trustline{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
  padding-top:16px;
  border-top:1px solid rgba(143,20,48,.10);
}

.hero-trustline span{
  position:relative;
  padding-left:18px;
  color:#6a5552;
  font-size:.93rem;
  font-weight:800;
}

.hero-trustline span::before{
  content:"";
  position:absolute;
  left:0;
  top:.62em;
  width:7px;
  height:7px;
  border-radius:999px;
  background:linear-gradient(135deg, var(--primary), var(--gold));
  box-shadow:0 0 0 4px rgba(143,20,48,.08);
}

.hero__stats article{
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,249,246,.96));
  border-color:rgba(143,20,48,.11);
}

.hero__stats b{
  color:#8f1430;
}

.hero-product{
  border:1px solid rgba(143,20,48,.12);
  box-shadow:0 26px 64px rgba(96,48,45,.16);
}

.hero-stack__label{
  background:
    linear-gradient(135deg, #fff, var(--gold-soft));
  border-color:rgba(216,173,115,.28);
}

.hero-float{
  background:rgba(255,255,255,.92);
}

.flash-shell{
  border-radius:32px;
  box-shadow:0 22px 56px rgba(96,48,45,.10);
}

.countdown span{
  border-color:rgba(143,20,48,.16);
}

.pro-strip__grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:16px;
}

.pro-strip__grid article{
  position:relative;
  padding:22px;
  min-height:150px;
  border-radius:28px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,249,246,.96));
  border:1px solid rgba(143,20,48,.10);
  box-shadow:0 18px 38px rgba(96,48,45,.08);
  overflow:hidden;
}

.pro-strip__grid article::after{
  content:"";
  position:absolute;
  width:120px;
  height:120px;
  right:-44px;
  bottom:-54px;
  border-radius:999px;
  background:radial-gradient(circle, rgba(216,173,115,.20), transparent 68%);
}

.pro-strip__grid span{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  margin-bottom:14px;
  border-radius:16px;
  color:#fff;
  font-weight:900;
  background:linear-gradient(135deg, var(--primary), var(--primary-2));
  box-shadow:0 14px 24px rgba(143,20,48,.18);
}

.pro-strip__grid b{
  display:block;
  font-size:1.08rem;
  letter-spacing:-.015em;
  margin-bottom:8px;
}

.pro-strip__grid p{
  color:var(--muted);
  font-size:.95rem;
  line-height:1.62;
}

.section-title h2{
  letter-spacing:-.04em;
}

.mood-card{
  min-height:136px;
  background:linear-gradient(180deg, rgba(255,255,255,.84), rgba(255,250,248,.94));
}

.mood-card:hover,
.mood-card.active{
  border-color:rgba(143,20,48,.18);
  box-shadow:0 20px 44px rgba(93,44,42,.12);
}

.filter-panel{
  padding:16px;
  border-radius:26px;
  background:rgba(255,255,255,.86);
}

.product-grid{
  gap:20px;
}

.product-card{
  background:linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.99));
  border-color:rgba(143,20,48,.09);
}

.product-media{
  padding:14px 14px 0;
}

.product-media img{
  border-radius:24px;
}

.product-info{
  padding:18px 18px 22px;
}

.product-topline span{
  color:#8f1430;
}

.product-info h3{
  color:#2a1b19;
  font-size:1.06rem;
  font-weight:850;
}

.shade{
  color:#9d243b;
}

.tag-row span{
  background:rgba(255,255,255,.82);
  border-color:rgba(143,20,48,.10);
}

.price b,
.price-line b{
  color:#8f1430;
}

.small-btn,
.add-btn{
  box-shadow:none;
}

.add-btn{
  border-radius:15px;
}

.guide-shell{
  background:
    radial-gradient(circle at 95% 5%, rgba(216,173,115,.16), transparent 32%),
    linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,249,246,.96));
}

.guide-list article{
  background:rgba(255,255,255,.82);
}

.order__summary,
.order-form{
  border-radius:30px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.90), rgba(255,250,248,.98));
}

.form-head{
  display:grid;
  gap:4px;
  padding:16px;
  border-radius:20px;
  background:linear-gradient(135deg, rgba(143,20,48,.06), rgba(216,173,115,.10));
  border:1px solid rgba(143,20,48,.09);
}

.form-head b{
  font-size:1.05rem;
  color:#2b1d1b;
}

.form-head span{
  color:#6d5b58;
  font-size:.92rem;
}

.order-form input,
.order-form textarea{
  background:rgba(255,255,255,.92);
}

.cart-drawer{
  border-left:1px solid rgba(143,20,48,.12);
}

.quick-modal__card,
.search-modal__card{
  border-color:rgba(143,20,48,.12);
}

.footer__grid{
  background:rgba(255,255,255,.90);
  border-color:rgba(143,20,48,.10);
}

@media (max-width: 1080px){
  .pro-strip__grid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 820px){
  .hero-shell{
    padding:24px 20px;
  }

  .hero-trustline{
    display:grid;
    grid-template-columns:1fr;
  }

  .pro-strip__grid article{
    min-height:auto;
  }
}

@media (max-width: 560px){
  .hero-shell,
  .flash-shell,
  .guide-shell{
    border-radius:26px;
  }

  .hero__stats article{
    padding:14px;
  }

  .pro-strip__grid article{
    padding:18px;
    border-radius:24px;
  }

  .product-grid{
    gap:16px;
  }
}


.tap{
  animation:tapPulse .32s ease;
}

@keyframes tapPulse{
  0%{transform:scale(1)}
  50%{transform:scale(.985)}
  100%{transform:scale(1)}
}


/* =========================
   Premium V10 - Executive UI Upgrade
   ========================= */
:root{
  --executive-shadow:0 30px 72px rgba(88,44,41,.14);
  --executive-line:rgba(143,20,48,.12);
}
body{
  background:
    radial-gradient(circle at 0% 0%, rgba(255,224,230,.55), transparent 22%),
    radial-gradient(circle at 100% 12%, rgba(250,232,217,.75), transparent 28%),
    linear-gradient(180deg, #fffdfb 0%, #fff8f4 42%, #fffdfc 100%);
}
.header__inner{
  backdrop-filter:blur(14px);
}
.header.scrolled .header__inner{
  box-shadow:0 20px 54px rgba(88,44,41,.11);
}
.nav a{
  padding:9px 12px;
  border-radius:999px;
  transition:.22s ease;
}
.nav a:hover,
.nav a.active{
  background:rgba(143,20,48,.07);
  color:#8f1430;
}
.nav a::after{display:none}
.hero-shell,
.flash-shell,
.guide-shell,
.footer__grid,
.order__summary,
.order-form{
  box-shadow:var(--executive-shadow);
}
.hero-shell{overflow:visible}
.hero__copy{position:relative;z-index:2}
.hero__copy h2{max-width:760px}
.hero__copy p{max-width:670px}
.hero-service-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:18px;
}
.hero-service-grid article{
  padding:16px 16px 15px;
  border-radius:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,249,246,.96));
  border:1px solid var(--executive-line);
  box-shadow:0 18px 36px rgba(97,49,45,.08);
}
.hero-service-grid b{
  display:block;
  font-size:.96rem;
  margin-bottom:6px;
  letter-spacing:-.01em;
}
.hero-service-grid span{
  display:block;
  color:#6b5855;
  font-size:.88rem;
  line-height:1.56;
}
.hero-product{
  position:relative;
}
.hero-product::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(135deg, rgba(143,20,48,.18), rgba(216,173,115,.18), rgba(255,255,255,.5));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;
  pointer-events:none;
}
.section-copy{
  max-width:620px;
  margin-top:10px;
  color:#6d5a57;
  font-size:.98rem;
  line-height:1.68;
}
.filter-panel{
  box-shadow:0 20px 40px rgba(92,48,44,.10);
}
.product-card{
  position:relative;
}
.product-card::before{
  opacity:.34;
}
.product-card:hover{
  box-shadow:0 30px 54px rgba(95,48,45,.16);
}
.product-card .product-info{
  border-top:1px solid rgba(143,20,48,.06);
}
.product-badges span{
  border:1px solid rgba(143,20,48,.08);
}
.consult-banner{
  margin-top:24px;
  padding:26px 28px;
  border-radius:28px;
  background:
    radial-gradient(circle at 100% 10%, rgba(216,173,115,.20), transparent 25%),
    linear-gradient(135deg, rgba(255,255,255,.92), rgba(255,246,241,.96));
  border:1px solid var(--executive-line);
  box-shadow:0 22px 48px rgba(96,48,45,.10);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}
.consult-banner h3{
  font-size:1.55rem;
  line-height:1.12;
  letter-spacing:-.03em;
  margin-top:12px;
}
.consult-banner p{
  margin-top:10px;
  max-width:560px;
  color:#685552;
}
.consult-banner__actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.pro-strip__grid article,
.benefit-grid article,
.guide-list article,
.mood-card{
  box-shadow:0 16px 36px rgba(96,48,45,.07);
}
.order-box article{
  background:linear-gradient(180deg, #fff, #fff9f7);
}
.order-total{
  border-top:1px dashed rgba(143,20,48,.16);
}
.footer{padding-top:10px}
.footer-seal{
  margin-bottom:16px;
  padding:14px 18px;
  border-radius:20px;
  background:linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,247,243,.95));
  border:1px solid var(--executive-line);
  box-shadow:0 16px 34px rgba(96,48,45,.08);
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}
.footer-seal span{
  position:relative;
  padding-left:18px;
  font-size:.92rem;
  font-weight:800;
  color:#66514d;
}
.footer-seal span::before{
  content:"";
  position:absolute;
  left:0;
  top:.55em;
  width:7px;
  height:7px;
  border-radius:999px;
  background:linear-gradient(135deg, #8f1430, #d8ad73);
}
.quick-modal__card{box-shadow:var(--executive-shadow)}
.search-modal__card{box-shadow:var(--executive-shadow)}
.floating-zalo{box-shadow:0 20px 34px rgba(20,123,255,.26)}
@media (max-width:1080px){
  .hero-service-grid{grid-template-columns:1fr}
  .footer-seal{grid-template-columns:1fr 1fr}
}
@media (max-width:820px){
  .consult-banner{flex-direction:column;align-items:flex-start;padding:22px}
  .consult-banner__actions{justify-content:flex-start}
}
@media (max-width:560px){
  .section-copy{font-size:.94rem}
  .consult-banner h3{font-size:1.28rem}
  .footer-seal{grid-template-columns:1fr;padding:14px}
}


/* =========================
   Premium V11 - Luxury Boutique Upgrade
   ========================= */
:root{
  --lux-gold:#d6aa70;
  --lux-gold-soft:#f7ebde;
  --lux-rose:#8f1430;
  --lux-panel:rgba(255,255,255,.93);
  --lux-shadow:0 34px 84px rgba(83,40,38,.14);
}
body{
  background:
    radial-gradient(circle at 8% 0%, rgba(255,233,235,.68), transparent 24%),
    radial-gradient(circle at 100% 10%, rgba(248,233,218,.78), transparent 28%),
    linear-gradient(180deg, #fffefd 0%, #fff8f4 48%, #fffefd 100%);
}
.topbar{
  background:linear-gradient(90deg,#7c1028,#bb4660,#caa06c,#7c1028);
}
.topbar__inner{
  font-weight:800;
  letter-spacing:.03em;
}
.header{background:linear-gradient(180deg, rgba(255,251,249,.95), rgba(255,251,249,.56))}
.header__inner{
  border:1px solid rgba(214,170,112,.12);
}
.header.scrolled .header__inner{
  background:rgba(255,255,255,.9);
  border-color:rgba(214,170,112,.22);
  box-shadow:0 20px 60px rgba(83,40,38,.12);
}
.brand img{height:44px}
.hotline,.cart-button,.icon-btn,.menu-btn{
  border-color:rgba(214,170,112,.16);
}
.hero-shell{
  background:
    radial-gradient(circle at 84% 14%, rgba(214,170,112,.17), transparent 28%),
    radial-gradient(circle at 16% 85%, rgba(216,117,143,.11), transparent 22%),
    linear-gradient(145deg, rgba(255,255,255,.95), rgba(255,248,244,.98));
  box-shadow:var(--lux-shadow);
}
.hero-shell::before{
  background:
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,255,255,0) 38%),
    linear-gradient(315deg, rgba(214,170,112,.14), rgba(255,255,255,0) 44%);
}
.hero__copy h2{
  font-size:clamp(2.3rem, 4.4vw, 4.9rem);
  line-height:1.01;
  letter-spacing:-.06em;
}
.hero__copy h2::after{
  background:linear-gradient(90deg, var(--lux-rose), var(--lux-gold), rgba(255,255,255,0));
  box-shadow:0 12px 24px rgba(143,20,48,.12);
}
.hero__copy p{
  font-size:1.07rem;
  line-height:1.8;
}
.hero-editorial{
  display:grid;
  gap:6px;
  margin-top:20px;
  margin-bottom:4px;
  padding:16px 18px;
  max-width:520px;
  border-radius:22px;
  background:linear-gradient(135deg, rgba(255,255,255,.90), rgba(247,235,222,.72));
  border:1px solid rgba(214,170,112,.22);
  box-shadow:0 16px 36px rgba(92,45,43,.08);
}
.hero-editorial span{
  color:var(--lux-rose);
  font-size:.8rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.11em;
}
.hero-editorial b{
  font-size:1.02rem;
  letter-spacing:-.01em;
}
.hero-promo span,
.hero-service-grid article,
.hero__stats article,
.hero-trustline,
.feature-card,
.pro-strip__grid article,
.mood-card,
.guide-list article,
.order__summary,
.order-form,
.footer-seal,
.footer__grid,
.consult-banner{
  box-shadow:0 18px 42px rgba(92,45,43,.08);
}
.hero-promo span{
  border-color:rgba(214,170,112,.20);
  background:linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,249,245,.96));
}
.hero-service-grid article{
  background:linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,249,245,.98));
  border-color:rgba(214,170,112,.18);
}
.hero-service-grid b,.section-title h2,.consult-banner h3{color:#241715}
.hero-stack__label{
  color:#6f2030;
  background:linear-gradient(135deg, #fff, #fcf1e3);
  border-color:rgba(214,170,112,.32);
}
.hero-product{
  background:linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,250,247,.99));
  box-shadow:0 32px 70px rgba(89,43,40,.18);
}
.hero-product__image{
  background:
    radial-gradient(circle at 50% 18%, rgba(255,255,255,.96), transparent 34%),
    linear-gradient(160deg, #fffaf7, #fde8e1 50%, #fff9f5);
}
.hero-float{
  border-color:rgba(214,170,112,.18);
}
.flash-shell,
.guide-shell,
.footer__grid,
.order__summary,
.order-form,
.consult-banner,
.footer-seal{
  border-color:rgba(214,170,112,.18);
}
.flash-badges span{
  border-color:rgba(214,170,112,.16);
}
.countdown span{
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,244,240,.96));
  border-color:rgba(214,170,112,.2);
}
.feature-card{
  border-color:rgba(214,170,112,.14);
  background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,251,248,.98));
}
.feature-card:hover,
.product-card:hover,
.mood-card:hover,
.mood-card.active{
  box-shadow:0 28px 56px rgba(92,45,43,.13);
}
.luxury-collections__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.luxury-collections__grid article{
  position:relative;
  min-height:210px;
  padding:24px;
  border-radius:30px;
  overflow:hidden;
  background:
    radial-gradient(circle at 100% 0%, rgba(214,170,112,.22), transparent 26%),
    linear-gradient(145deg, rgba(255,255,255,.95), rgba(255,247,243,.98));
  border:1px solid rgba(214,170,112,.18);
  box-shadow:0 24px 56px rgba(92,45,43,.09);
}
.luxury-collections__grid article::after{
  content:"";
  position:absolute;
  inset:auto -28px -38px auto;
  width:130px;
  height:130px;
  border-radius:999px;
  background:radial-gradient(circle, rgba(143,20,48,.10), transparent 70%);
}
.luxury-collections__grid span{
  display:inline-flex;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(214,170,112,.18);
  color:#7f2133;
  font-size:.8rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.luxury-collections__grid b{
  display:block;
  margin-top:16px;
  font-size:1.38rem;
  line-height:1.18;
  letter-spacing:-.03em;
}
.luxury-collections__grid p{
  margin-top:10px;
  max-width:280px;
  color:#685552;
  line-height:1.7;
}
.filter-panel{
  background:rgba(255,255,255,.9);
  border-color:rgba(214,170,112,.18);
  box-shadow:0 20px 46px rgba(92,45,43,.10);
}
.search-field,select,input,textarea{
  border-color:rgba(214,170,112,.18);
}
.search-field input, select{color:#312220}
.product-card{
  border-color:rgba(214,170,112,.14);
  box-shadow:0 18px 42px rgba(92,45,43,.08);
}
.product-card::after{
  width:58%;
}
.product-badges span,
.tag-row span,
.result-pill{
  border-color:rgba(214,170,112,.14);
}
.product-info h3{
  font-size:1.08rem;
}
.add-btn,.btn-primary{
  background:
    linear-gradient(135deg, rgba(255,255,255,.14), rgba(255,255,255,0) 34%),
    linear-gradient(135deg, #801128, #b33950 52%, #d6aa70);
}
.btn-light,.mini-view,.small-btn{
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,248,244,.98));
}
.consult-banner{
  background:
    radial-gradient(circle at 100% 10%, rgba(214,170,112,.20), transparent 26%),
    linear-gradient(145deg, rgba(255,255,255,.95), rgba(255,248,243,.98));
}
.guide-shell{
  background:
    radial-gradient(circle at 95% 5%, rgba(214,170,112,.18), transparent 32%),
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,249,246,.98));
}
.form-head{
  background:linear-gradient(135deg, rgba(143,20,48,.05), rgba(214,170,112,.14));
  border-color:rgba(214,170,112,.16);
}
.order-box article{
  border-color:rgba(214,170,112,.14);
}
.footer-seal span,
.footer p,.footer a,.footer span{color:#64504d}
.floating-zalo{
  background:linear-gradient(135deg,#0d95ff,#22a8ff);
}
@media (max-width:1080px){
  .luxury-collections__grid{grid-template-columns:1fr}
}
@media (max-width:820px){
  .hero-editorial{max-width:none}
}
@media (max-width:560px){
  .hero-editorial{padding:14px 15px}
  .luxury-collections__grid article{min-height:auto;padding:20px;border-radius:24px}
}


/* Fix alignment for product action buttons */
.product-grid{
  align-items:stretch;
}
.product-card{
  display:flex;
  flex-direction:column;
  height:100%;
}
.product-info{
  display:flex;
  flex-direction:column;
  flex:1;
}
.product-topline{
  min-height:20px;
}
.product-info h3{
  min-height:2.8em;
}
.shade{
  min-height:1.5em;
}
.desc{
  min-height:4.9em;
}
.tag-row{
  min-height:74px;
  align-content:flex-start;
}
.product-foot{
  margin-top:auto;
  align-items:flex-end;
}
.product-foot .price{
  min-height:56px;
  align-content:flex-end;
}
.card-actions{
  margin-left:auto;
  align-items:flex-end;
}
.small-btn,
.add-btn{
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.add-btn{
  min-width:74px;
}
@media (max-width:560px){
  .tag-row{
    min-height:auto;
  }
  .product-foot .price{
    min-height:auto;
  }
}


/* Premium V11.2 - Uniform product cards */
.product-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:20px;
  align-items:stretch;
}
.product-card{
  display:grid;
  grid-template-rows:auto 1fr;
  height:100%;
  min-height:100%;
}
.product-media{
  padding:14px 14px 0;
}
.product-media img{
  width:100%;
  aspect-ratio:1 / 1;
  object-fit:cover;
}
.product-info{
  display:flex;
  flex-direction:column;
  gap:0;
  padding:18px 18px 22px;
  min-height:100%;
}
.product-topline{
  min-height:22px;
  margin-bottom:8px;
}
.product-info h3{
  min-height:2.9em;
  max-height:2.9em;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.shade{
  min-height:24px;
  margin:8px 0 10px;
}
.desc{
  min-height:4.9em;
  max-height:4.9em;
  margin:0;
}
.tag-row{
  display:flex;
  flex-wrap:wrap;
  align-content:flex-start;
  gap:8px;
  min-height:76px;
  max-height:76px;
  overflow:hidden;
  margin-top:14px;
}
.tag-row span{
  height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
}
.product-foot{
  margin-top:auto;
  padding-top:16px;
  align-items:flex-end;
}
.product-foot .price{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-end;
  gap:8px;
  min-height:60px;
}
.product-foot .price b,
.product-foot .price del{
  display:block;
  line-height:1;
}
.card-actions{
  display:flex;
  gap:8px;
  align-items:flex-end;
  flex-shrink:0;
  margin-left:auto;
}
.small-btn,
.add-btn{
  height:42px;
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.small-btn{
  width:42px;
  min-width:42px;
}
.add-btn{
  min-width:74px;
  padding:0 16px;
}

@media (max-width: 1080px){
  .product-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px){
  .product-grid{
    grid-template-columns:1fr;
    gap:16px;
  }
  .product-info h3,
  .desc,
  .tag-row,
  .product-foot .price{
    min-height:auto;
    max-height:none;
  }
  .tag-row{
    overflow:visible;
  }
}


/* Premium V11.3 - Structured Hero */
.hero__copy{
  display:flex;
  flex-direction:column;
}
.hero__copy p{
  margin-top:14px;
}
.hero-promo{
  margin-top:18px;
}
.hero-editorial{
  margin-top:18px;
}
.hero__actions{
  margin-top:20px;
}
.hero-trustline{
  margin-top:16px;
  padding-top:14px;
}
.hero-overview{
  padding-top:8px;
}
.hero-overview__wrap{
  padding:28px;
  border-radius:30px;
  background:linear-gradient(145deg, rgba(255,255,255,.94), rgba(255,249,246,.98));
  border:1px solid rgba(214,170,112,.16);
  box-shadow:0 22px 54px rgba(92,45,43,.08);
}
.hero-overview__head{
  margin-bottom:18px;
}
.hero-overview__head h2{
  margin-top:12px;
  font-size:clamp(1.5rem, 2.6vw, 2.3rem);
  line-height:1.15;
  letter-spacing:-.03em;
}
.hero-overview__head p{
  margin-top:10px;
  max-width:720px;
  color:#67534f;
}
.hero-overview__grid{
  display:grid;
  grid-template-columns:.92fr 1.08fr;
  gap:18px;
  align-items:start;
}
.hero-metrics .hero__stats{
  margin-top:0;
  height:100%;
}
.hero-reasons .hero-service-grid{
  margin-top:0;
}
.hero-metrics .hero__stats,
.hero-reasons .hero-service-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:12px;
}
.hero-metrics .hero__stats article,
.hero-reasons .hero-service-grid article{
  height:100%;
}
.hero-metrics .hero__stats article{
  min-height:112px;
}
.hero-reasons .hero-service-grid article{
  min-height:112px;
}
.hero-service-grid article span{
  display:block;
}
@media (max-width:1080px){
  .hero-overview__grid{
    grid-template-columns:1fr;
  }
}
@media (max-width:820px){
  .hero-overview__wrap{
    padding:22px 20px;
  }
  .hero-metrics .hero__stats,
  .hero-reasons .hero-service-grid{
    grid-template-columns:1fr;
  }
}
@media (max-width:560px){
  .hero-overview{
    padding-top:0;
  }
  .hero-overview__wrap{
    padding:18px;
    border-radius:24px;
  }
  .hero-overview__head h2{
    font-size:1.35rem;
  }
}


/* =========================
   Premium V12 - Luxury Refined Boutique
   ========================= */
:root{
  --section-space: 38px;
  --section-space-mobile: 24px;
}
.section-compact{padding:var(--section-space) 0}
.hero.section-compact{padding-top:26px;padding-bottom:22px}
.hero-overview.section-compact,
.flash-sale.section-compact,
.professional-strip.section-compact,
.luxury-collections.section-compact,
.collection.section-compact,
.products.section-compact,
.guide.section-compact,
.order.section-compact{padding-top:26px;padding-bottom:26px}
.section-title{margin-bottom:20px}
.products-head{margin-bottom:16px}
.hero-shell{padding:30px 32px;border-radius:34px}
.hero__grid{grid-template-columns:1.05fr .95fr;gap:24px;align-items:center}
.hero__copy h2{font-size:clamp(2.2rem, 4.2vw, 4.8rem);max-width:620px;line-height:1.02;margin-top:10px}
.hero__copy p{max-width:560px;font-size:1.02rem;line-height:1.75;margin-top:12px}
.hero-promo{gap:8px;margin-top:16px}
.hero-promo span{padding:10px 13px;font-size:.9rem}
.hero__actions{margin-top:18px;gap:10px}
.hero__actions .btn{height:48px;padding:0 20px;min-width:146px}
.hero-trustline{margin-top:16px;padding-top:14px;gap:16px}
.hero-trustline span{font-size:.9rem}
.hero-stack{max-width:440px;margin-left:auto}
.hero-product{padding:20px;border-radius:30px}
.hero-product__image{padding:14px;border-radius:24px}
.hero-product__info{padding-top:14px}
.hero-product__info h3{font-size:1.45rem}
.hero-float{font-size:.86rem;padding:10px 13px;border-radius:16px}
.hero-overview{padding-top:10px}
.hero-overview__wrap{padding:22px 24px;border-radius:28px}
.hero-overview__head{margin-bottom:14px}
.hero-overview__head h2{font-size:clamp(1.35rem,2.2vw,1.9rem);margin-top:10px}
.hero-overview__grid{gap:14px;grid-template-columns:.88fr 1.12fr}
.hero-metrics .hero__stats,
.hero-reasons .hero-service-grid{gap:10px}
.hero-metrics .hero__stats article,
.hero-reasons .hero-service-grid article{padding:16px 15px;border-radius:20px;min-height:98px}
.flash-shell,.guide-shell{padding:24px 26px}
.feature-row{gap:16px}
.pro-strip__grid,.luxury-collections__grid,.mood-grid,.benefit-grid{gap:16px}
.filter-panel{padding:14px 16px;margin-bottom:20px;top:94px;border-radius:22px}
.search-field,select{height:48px}
.product-grid{gap:22px;align-items:stretch}
.product-card--premium{border-radius:24px;background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,253,251,.99));border:1px solid rgba(214,170,112,.14);box-shadow:0 18px 40px rgba(92,45,43,.08)}
.product-card--premium::before{opacity:.16}
.product-card--premium::after{display:none}
.product-card--premium:hover{transform:translateY(-8px);box-shadow:0 24px 50px rgba(92,45,43,.12)}
.product-card--premium .product-media{padding:14px}
.product-card--premium .product-media img{border-radius:18px;aspect-ratio:1 / 1;background:#fcf8f6}
.product-card--premium .product-badges{top:26px;left:26px;right:26px}
.product-card--premium .product-badges span{padding:7px 11px;border:1px solid rgba(214,170,112,.12);background:rgba(255,255,255,.96);font-size:.76rem;letter-spacing:.01em}
.product-card--premium .wish-btn{right:26px;bottom:18px;width:38px;height:38px}
.product-card--premium .product-info{padding:8px 18px 18px}
.product-card--premium .product-topline{margin-bottom:8px;padding-top:2px}
.product-card--premium .product-topline span{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:#8c6b62;font-weight:900}
.product-card--premium .product-topline b{font-size:.88rem;color:#8f1430}
.product-card--premium h3{font-size:1.04rem;line-height:1.38;min-height:2.76em;max-height:2.76em}
.product-card--premium .shade{margin:6px 0 8px;color:#9f243d;font-weight:800;font-size:.95rem}
.product-card--premium .desc{font-size:.92rem;line-height:1.65;min-height:3.3em;max-height:3.3em;-webkit-line-clamp:2}
.product-card--premium .tag-row{margin-top:12px;min-height:32px;max-height:32px;gap:7px}
.product-card--premium .tag-row span{height:28px;padding:0 10px;font-size:.76rem;border-radius:999px;background:#fffaf7;border:1px solid rgba(214,170,112,.12);color:#6b5350}
.product-card--premium .product-foot{margin-top:auto;padding-top:16px;border-top:1px solid rgba(214,170,112,.10)}
.product-card--premium .price{gap:6px;min-height:auto}
.product-card--premium .price b{font-size:1.18rem;color:#8f1430}
.product-card--premium .price del{font-size:.9rem;color:#9e8b86}
.product-card--premium .card-actions{gap:8px}
.product-card--premium .small-btn,
.product-card--premium .add-btn{height:40px;border-radius:13px}
.product-card--premium .small-btn{background:#fff8f4;border:1px solid rgba(214,170,112,.14)}
.product-card--premium .add-btn{padding:0 16px;min-width:104px;font-size:.92rem;box-shadow:none}
.consult-banner{margin-top:26px;padding:24px 26px;border-radius:24px}
.consult-banner h3{font-size:1.42rem}
.order__grid{gap:20px}
.order__summary,.order-form{padding:22px;border-radius:28px}
.footer{padding-top:8px;padding-bottom:92px}
.footer-seal{margin-bottom:18px}
.footer__grid{padding:22px 24px;border-radius:26px}
@media (max-width:1080px){
  :root{--section-space:32px}
  .hero__grid{grid-template-columns:1fr}
  .hero__copy h2{max-width:700px}
  .hero-stack{margin:0 auto}
}
@media (max-width:820px){
  .section-compact{padding:var(--section-space-mobile) 0}
  .hero.section-compact,.hero-overview.section-compact,.flash-sale.section-compact,.professional-strip.section-compact,.luxury-collections.section-compact,.collection.section-compact,.products.section-compact,.guide.section-compact,.order.section-compact{padding-top:22px;padding-bottom:22px}
  .hero-shell,.flash-shell,.guide-shell,.hero-overview__wrap,.order__summary,.order-form,.footer__grid{padding:20px}
  .hero__copy h2{font-size:clamp(2rem, 9vw, 3.4rem)}
  .hero__copy p{font-size:.98rem;max-width:none}
  .hero-promo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-trustline{display:grid;grid-template-columns:1fr;gap:8px}
  .hero-overview__grid{grid-template-columns:1fr}
  .product-grid{gap:18px}
  .product-card--premium .product-info{padding:8px 16px 16px}
  .product-card--premium .card-actions{width:auto}
}
@media (max-width:560px){
  .hero-shell{padding:22px 18px;border-radius:28px}
  .hero__copy h2{font-size:clamp(1.9rem, 11vw, 3rem)}
  .hero-promo{grid-template-columns:1fr}
  .hero__actions{flex-direction:row;flex-wrap:wrap}
  .hero__actions .btn{width:auto;flex:1}
  .product-grid{grid-template-columns:1fr;gap:16px}
  .product-card--premium .product-badges{top:24px;left:24px;right:24px}
  .product-card--premium .tag-row{max-height:none;min-height:auto;flex-wrap:wrap}
  .product-card--premium .desc{min-height:auto;max-height:none;-webkit-line-clamp:unset}
  .consult-banner{padding:20px}
}


/* =========================
   Premium V13 - Luxury Minimal Boutique
   ========================= */
:root{
  --section-gap-desktop: 30px;
  --section-gap-mobile: 22px;
  --card-gap: 24px;
}
.section-compact{
  padding:var(--section-gap-desktop) 0;
}
.hero.section-compact,
.flash-sale.section-compact,
.professional-strip.section-compact,
.luxury-collections.section-compact,
.collection.section-compact,
.products.section-compact,
.guide.section-compact,
.order.section-compact{
  padding-top:var(--section-gap-desktop);
  padding-bottom:var(--section-gap-desktop);
}
.container{width:min(1180px, calc(100% - 36px));}
.hero-shell{padding:28px 30px;border-radius:32px}
.hero__grid{grid-template-columns:1fr .92fr;gap:20px;align-items:center}
.hero__copy{max-width:560px}
.hero__copy h2{max-width:520px;font-size:clamp(2.15rem,4vw,4.55rem);line-height:1.02;letter-spacing:-.065em;margin-top:8px}
.hero__copy p{max-width:500px;margin-top:12px;font-size:1rem;line-height:1.72;color:#63514d}
.hero-promo{gap:8px;margin-top:14px}
.hero-promo span{padding:9px 12px;font-size:.86rem;box-shadow:0 10px 24px rgba(92,45,43,.06)}
.hero__actions{margin-top:18px;gap:10px}
.hero__actions .btn{height:47px;padding:0 19px;min-width:138px;border-radius:15px}
.hero-trustline{margin-top:14px;padding-top:12px;gap:14px}
.hero-trustline span{font-size:.88rem;font-weight:700}
.hero-stack{max-width:410px}
.hero-stack__label{left:14px;padding:8px 12px;font-size:.84rem}
.hero-product{padding:18px;border-radius:28px;box-shadow:0 26px 62px rgba(89,43,40,.14)}
.hero-product__image{padding:12px;border-radius:22px}
.hero-product__info span{font-size:.88rem}
.hero-product__info h3{font-size:1.34rem;margin:6px 0 10px}
.hero-float{display:none}
.flash-shell,.guide-shell,.order__summary,.order-form,.footer__grid{padding:24px;border-radius:28px}
.flash__head,.section-title{margin-bottom:18px}
.flash__head h1,.section-title h2,.guide__copy h2,.order__summary h2{font-size:clamp(1.8rem,3vw,2.8rem)}
.flash__head p,.section-copy,.guide__copy p,.order__summary p{font-size:.98rem;line-height:1.68}
.pro-strip__grid,.luxury-collections__grid,.mood-grid,.benefit-grid,.feature-row{gap:16px}
.filter-panel{padding:14px 16px;border-radius:20px;top:92px;margin-bottom:22px}
.search-field,select{height:48px;border-radius:14px}
.products-head{margin-bottom:18px}
.section-title{align-items:flex-end}
.section-copy{max-width:620px;margin-top:10px;color:#6b5753}
.result-pill{padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.88);border:1px solid rgba(214,170,112,.14)}
.product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--card-gap);align-items:stretch}
.product-card--premium{display:flex;flex-direction:column;min-height:100%;border-radius:22px;border:1px solid rgba(214,170,112,.12);background:#fff;box-shadow:0 14px 34px rgba(92,45,43,.06);overflow:hidden}
.product-card--premium::before,
.product-card--premium::after{display:none}
.product-card--premium:hover{transform:translateY(-6px);box-shadow:0 22px 46px rgba(92,45,43,.11)}
.product-card--premium .product-media{padding:14px 14px 0;position:relative}
.product-card--premium .product-media::after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:1px;background:rgba(214,170,112,.10)}
.product-card--premium .product-media img{aspect-ratio:1/1;border-radius:16px;background:linear-gradient(180deg,#fffaf7,#f8efea);object-fit:cover}
.product-card--premium .product-badges{top:24px;left:24px;right:24px}
.product-card--premium .product-badges span{padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.97);border:1px solid rgba(214,170,112,.12);font-size:.74rem;font-weight:800;box-shadow:none}
.product-card--premium .wish-btn{right:24px;bottom:14px;width:36px;height:36px;background:rgba(255,255,255,.96);box-shadow:0 10px 18px rgba(0,0,0,.06)}
.product-card--premium .product-info{display:flex;flex-direction:column;flex:1;padding:16px 18px 18px}
.product-card--premium .product-topline{min-height:auto;margin-bottom:8px}
.product-card--premium .product-topline span{font-size:.76rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:#846760}
.product-card--premium .product-topline b{font-size:.84rem;color:#9d2440}
.product-card--premium h3{font-size:1rem;line-height:1.38;min-height:2.76em;max-height:2.76em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;color:#2b1c1a}
.product-card--premium .shade{display:block;margin:6px 0 8px;font-size:.93rem;font-weight:800;color:#9d2440;min-height:1.45em}
.product-card--premium .desc{margin:0;min-height:3.2em;max-height:3.2em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:.9rem;line-height:1.6;color:#6c5955}
.product-card--premium .tag-row{margin-top:12px;min-height:28px;max-height:28px;gap:6px;overflow:hidden}
.product-card--premium .tag-row span{display:inline-flex;align-items:center;height:28px;padding:0 10px;border-radius:999px;background:#fffaf6;border:1px solid rgba(214,170,112,.10);font-size:.74rem;font-weight:700;color:#6c5854;white-space:nowrap}
.product-card--premium .product-foot{margin-top:auto;padding-top:16px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;border-top:1px solid rgba(214,170,112,.10)}
.product-card--premium .price{display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-height:auto}
.product-card--premium .price b{font-size:1.14rem;line-height:1;color:#8f1430}
.product-card--premium .price del{font-size:.88rem;line-height:1;color:#9b8a85}
.product-card--premium .card-actions{display:flex;align-items:center;gap:8px;margin-left:auto}
.product-card--premium .small-btn,
.product-card--premium .add-btn{height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px}
.product-card--premium .small-btn{width:40px;min-width:40px;background:#fff8f4;border:1px solid rgba(214,170,112,.12);box-shadow:none}
.product-card--premium .add-btn{min-width:110px;padding:0 16px;font-size:.9rem;box-shadow:none}
.consult-banner{margin-top:24px;padding:24px 26px;border-radius:24px}
.guide-shell{background:linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,249,246,.98))}
.order__grid{gap:22px}
.footer{padding-top:4px;padding-bottom:92px}
.footer-seal{margin-bottom:16px;padding:14px 16px;border-radius:18px}
.footer__grid{padding:22px 24px;border-radius:24px}
@media (max-width:1080px){
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero__grid{grid-template-columns:1fr}
  .hero__copy{max-width:none}
  .hero__copy h2,.hero__copy p{max-width:none}
  .hero-stack{margin:0 auto}
}
@media (max-width:820px){
  .section-compact,
  .hero.section-compact,
  .flash-sale.section-compact,
  .professional-strip.section-compact,
  .luxury-collections.section-compact,
  .collection.section-compact,
  .products.section-compact,
  .guide.section-compact,
  .order.section-compact{padding:var(--section-gap-mobile) 0}
  .hero-shell,.flash-shell,.guide-shell,.order__summary,.order-form,.footer__grid{padding:20px}
  .hero__copy h2{font-size:clamp(2rem,9vw,3.35rem)}
  .hero-promo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-trustline{display:grid;grid-template-columns:1fr;gap:8px}
  .product-grid{gap:18px}
  .filter-panel{grid-template-columns:1fr 1fr;top:84px}
  .search-field{grid-column:1 / -1}
}
@media (max-width:560px){
  .container{width:min(100% - 20px, 100%)}
  .hero-shell{padding:20px 18px;border-radius:26px}
  .hero__copy h2{font-size:clamp(1.9rem,11vw,2.9rem)}
  .hero-promo{grid-template-columns:1fr}
  .hero__actions .btn{flex:1;min-width:0}
  .product-grid{grid-template-columns:1fr;gap:16px}
  .product-card--premium .desc,
  .product-card--premium .tag-row{min-height:auto;max-height:none}
  .consult-banner{padding:20px}
}


/* V13.1 - keep action buttons on one line */
.product-card--premium .card-actions{
  flex-wrap:nowrap;
}
.product-card--premium .small-btn,
.product-card--premium .add-btn{
  white-space:nowrap;
  word-break:keep-all;
  line-height:1;
}
.product-card--premium .small-btn{
  min-width:96px;
  width:auto;
  padding:0 14px;
  font-size:.9rem;
}
.product-card--premium .add-btn{
  min-width:96px;
  padding:0 14px;
  font-size:.9rem;
}
@media (max-width:560px){
  .product-card--premium .card-actions{
    width:auto;
  }
  .product-card--premium .small-btn,
  .product-card--premium .add-btn{
    min-width:92px;
    font-size:.88rem;
  }
}


/* V13.2 - fix Flash Sale buttons and all action buttons to stay one line */
.feature-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  width:100%;
  align-items:center;
}

.feature-actions .mini-buy,
.feature-actions .mini-view,
.mini-buy,
.mini-view,
.product-card--premium .small-btn,
.product-card--premium .add-btn{
  white-space:nowrap !important;
  word-break:keep-all !important;
  overflow:hidden;
  text-overflow:ellipsis;
  line-height:1 !important;
  min-height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.feature-actions .mini-buy,
.feature-actions .mini-view{
  width:100%;
  min-width:0;
  height:42px;
  padding:0 8px;
  font-size:.86rem;
  border-radius:14px;
}

/* Flash sale cards: make the content area a bit cleaner so buttons fit */
.feature-card{
  grid-template-columns:104px minmax(0, 1fr);
  gap:14px;
}

.feature-card img{
  width:104px;
  height:128px;
}

.feature-card h3{
  font-size:1rem;
}

.feature-card p{
  font-size:.9rem;
  margin-bottom:12px;
}

.feature-card .price b{
  font-size:1.08rem;
}

.feature-card .price del{
  font-size:.86rem;
}

@media (max-width:1080px){
  .feature-card{
    grid-template-columns:112px minmax(0, 1fr);
  }

  .feature-card img{
    width:112px;
    height:132px;
  }

  .feature-actions .mini-buy,
  .feature-actions .mini-view{
    font-size:.88rem;
  }
}

@media (max-width:560px){
  .feature-card{
    grid-template-columns:1fr;
  }

  .feature-card img{
    width:100%;
    height:auto;
  }

  .feature-actions{
    grid-template-columns:1fr 1fr;
  }

  .feature-actions .mini-buy,
  .feature-actions .mini-view{
    font-size:.86rem;
    padding:0 6px;
  }
}


/* V13.8 - Correct hero slogan + bigger logo + nav one line */

/* Header: logo Nàng to hơn, menu không xuống dòng */
.header .container{
  width:min(1280px, calc(100% - 24px));
}

.header__inner{
  min-height:82px;
  gap:18px;
}

.brand{
  display:flex;
  align-items:center;
  flex:0 0 auto;
}

.brand img{
  height:66px;
  max-width:270px;
  object-fit:contain;
}

.nav{
  flex:1 1 auto;
  justify-content:center;
  gap:24px;
  min-width:0;
}

.nav a{
  white-space:nowrap !important;
  word-break:keep-all !important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:max-content;
  line-height:1 !important;
  padding:10px 8px;
}

.header__actions{
  flex:0 0 auto;
  gap:10px;
}

.header.scrolled .brand img{
  height:62px;
}

/* Hero slogan cách điệu */
.hero-title-stylized{
  display:grid;
  gap:4px;
  max-width:560px;
}

.hero-title-stylized .hero-title-line{
  display:block;
  color:#261816;
  letter-spacing:-.065em;
}

.hero-title-stylized .hero-title-accent{
  display:block;
  line-height:1.02;
  letter-spacing:-.065em;
  color:#8f1430;
  position:relative;
  width:max-content;
  max-width:100%;
}

.hero-title-stylized .hero-title-accent::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-10px;
  width:100%;
  height:10px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(143,20,48,.20), rgba(214,170,112,.30), rgba(255,255,255,0));
  z-index:-1;
}

.hero__copy p{
  max-width:540px;
}

@media (max-width:1180px){
  .nav{
    gap:16px;
  }

  .nav a{
    font-size:.9rem;
    padding-inline:6px;
  }

  .brand img{
    height:60px;
    max-width:240px;
  }

  .hotline{
    padding-inline:12px;
  }
}

@media (max-width:1080px){
  .nav{
    display:none;
  }

  .brand img{
    height:58px;
    max-width:220px;
  }
}

@media (max-width:820px){
  .hero-title-stylized .hero-title-accent::after{
    bottom:-8px;
    height:8px;
  }
}

@media (max-width:560px){
  .brand img{
    height:48px;
    max-width:180px;
  }

  .header__inner{
    min-height:68px;
  }

  .hero-title-stylized{
    gap:2px;
  }
}


/* V15 - giữ header gọn: logo to, menu gần logo, menu 1 dòng */
.header__inner{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
  min-height:86px;
}

.brand{
  flex:0 0 auto !important;
  margin-right:4px !important;
}

.brand img{
  height:78px !important;
  max-width:320px !important;
  object-fit:contain;
}

.nav{
  flex:0 0 auto !important;
  min-width:0 !important;
  margin-left:4px !important;
  justify-content:flex-start !important;
  gap:18px !important;
}

.nav a{
  padding:8px 4px !important;
  margin:0 !important;
  white-space:nowrap !important;
  line-height:1 !important;
}

.header__actions{
  margin-left:auto !important;
}

.header.scrolled .brand img{
  height:72px !important;
}

@media (max-width:1180px){
  .header__inner{gap:8px !important;}
  .brand img{height:70px !important;max-width:280px !important;}
  .nav{margin-left:2px !important;gap:14px !important;}
  .nav a{font-size:.9rem !important;padding:8px 3px !important;}
}

@media (max-width:1080px){
  .nav{display:none !important;}
  .brand img{height:60px !important;max-width:235px !important;}
}

@media (max-width:560px){
  .header__inner{min-height:72px !important;}
  .brand img{height:52px !important;max-width:195px !important;}
}


/* V17 - Clean removed info sections + contact actions */
.footer-contact-info a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  width:max-content;
  max-width:100%;
  padding:8px 0;
  color:#5c4542;
  font-weight:800;
}
.footer-contact-info a:hover{
  color:var(--primary);
}

.floating-zalo{display:none !important;}
.floating-contact{
  position:fixed;
  right:20px;
  bottom:26px;
  display:grid;
  gap:10px;
  z-index:59;
}
.floating-contact__item{
  min-height:54px;
  padding:0 16px;
  border-radius:999px;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  font-weight:900;
  box-shadow:0 18px 30px rgba(40,40,40,.16);
  transition:transform .22s ease, box-shadow .22s ease;
  white-space:nowrap;
}
.floating-contact__item:hover{
  transform:translateY(-3px);
  box-shadow:0 22px 36px rgba(40,40,40,.22);
}
.floating-contact__item span{
  font-size:1.08rem;
}
.floating-contact__zalo{
  background:linear-gradient(135deg,#00b4ff,#1ca1ff);
}
.floating-contact__messenger{
  background:linear-gradient(135deg,#7b2cff,#1d8bff);
}
.floating-contact__call{
  background:linear-gradient(135deg,#8f1430,#c23a55);
}
.mobile-bottom{
  grid-template-columns:repeat(5,1fr) !important;
}
.mobile-bottom a,.mobile-bottom button{
  min-height:56px;
}
.mobile-bottom b{
  font-size:.74rem;
}
@media (max-width:820px){
  .floating-contact{
    right:14px;
    bottom:88px;
    gap:8px;
  }
  .floating-contact__item{
    min-height:48px;
    padding:0 13px;
    font-size:.88rem;
  }
}
@media (max-width:560px){
  .floating-contact{
    right:10px;
    bottom:92px;
  }
  .floating-contact__item b{
    display:none;
  }
  .floating-contact__item{
    width:48px;
    height:48px;
    min-height:48px;
    padding:0;
  }
}


/* V18 - Card actions: Thông tin / Mua ngay + sale tính theo giá */
.product-foot--stack{
  align-items:stretch;
}
.card-actions--dual,
.feature-actions--dual{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.small-btn--wide,
.add-btn--wide,
.feature-actions--dual .mini-view,
.feature-actions--dual .mini-buy{
  width:100%;
  min-width:0;
  padding:0 14px;
}
.small-btn--wide{
  width:auto;
  background:rgba(255,255,255,.94);
  border:1px solid var(--line);
  color:var(--text);
  font-weight:800;
}
.add-btn--wide{
  min-width:0;
}
.product-card--premium .card-actions{
  width:100%;
  gap:10px;
}
.product-card--premium .small-btn,
.product-card--premium .add-btn{
  height:44px;
  border-radius:14px;
}
.product-card--premium .add-btn{
  font-size:.95rem;
}
.feature-actions--dual .mini-view,
.feature-actions--dual .mini-buy{
  justify-content:center;
}
.quick-headline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:8px;
}
.quick-sale-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:34px;
  padding:0 12px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  color:#fff;
  font-weight:800;
  box-shadow:0 12px 24px rgba(154,24,49,.22);
}
@media (max-width:760px){
  .card-actions--dual,
  .feature-actions--dual{
    grid-template-columns:1fr;
  }
}


/* V18.1 - Force product grid actions visible directly under tags */
.product-card--premium{
  min-height:auto !important;
}

.product-card--premium .product-info{
  display:flex !important;
  flex-direction:column !important;
  padding-bottom:18px !important;
}

.product-card--premium .desc{
  min-height:3.2em !important;
  max-height:3.2em !important;
  margin-bottom:0 !important;
}

.product-card--premium .tag-row{
  min-height:30px !important;
  max-height:34px !important;
  margin-top:12px !important;
  margin-bottom:0 !important;
}

.product-card--premium .product-foot,
.product-card--premium .product-foot.product-foot--stack{
  margin-top:14px !important;
  padding-top:14px !important;
  border-top:1px solid rgba(214,170,112,.10) !important;
  display:grid !important;
  gap:12px !important;
  align-items:stretch !important;
}

.product-card--premium .product-foot .price{
  min-height:auto !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  gap:10px !important;
}

.product-card--premium .product-foot .price b{
  font-size:1.12rem !important;
}

.product-card--premium .product-foot .price del{
  font-size:.88rem !important;
}

.product-card--premium .card-actions,
.product-card--premium .card-actions.card-actions--dual{
  width:100% !important;
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:10px !important;
  margin-left:0 !important;
}

.product-card--premium .small-btn.small-btn--wide,
.product-card--premium .add-btn.add-btn--wide{
  width:100% !important;
  min-width:0 !important;
  height:42px !important;
  padding:0 10px !important;
  border-radius:13px !important;
  white-space:nowrap !important;
  line-height:1 !important;
}

.product-card--premium .small-btn.small-btn--wide{
  background:#fff8f4 !important;
  border:1px solid rgba(214,170,112,.18) !important;
  color:var(--text) !important;
}

.product-card--premium .add-btn.add-btn--wide{
  background:linear-gradient(135deg,var(--primary),var(--primary-2)) !important;
  color:#fff !important;
}

@media (max-width:560px){
  .product-card--premium .card-actions,
  .product-card--premium .card-actions.card-actions--dual{
    grid-template-columns:1fr 1fr !important;
  }
}


/* V19 - Brand filter for product section */
.brand-filter{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:0 0 24px;
  padding:14px;
  border-radius:24px;
  background:rgba(255,255,255,.76);
  border:1px solid var(--line);
  box-shadow:0 16px 34px rgba(92,45,43,.06);
}
.brand-chip{
  height:42px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid rgba(214,170,112,.16);
  background:#fffaf7;
  color:#5e4743;
  font-weight:900;
  display:inline-flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
  transition:.22s ease;
}
.brand-chip small{
  min-width:24px;
  height:24px;
  padding:0 7px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(143,20,48,.08);
  color:#8f1430;
  font-size:.78rem;
}
.brand-chip.active,
.brand-chip:hover{
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  color:#fff;
  transform:translateY(-2px);
  box-shadow:0 14px 26px rgba(154,24,49,.18);
}
.brand-chip.active small,
.brand-chip:hover small{
  background:rgba(255,255,255,.22);
  color:#fff;
}
@media (max-width:560px){
  .brand-filter{
    overflow:auto;
    flex-wrap:nowrap;
    padding:12px;
    margin-bottom:18px;
  }
  .brand-chip{
    flex:0 0 auto;
  }
}


/* V21 - Mobile optimized */
@media (max-width: 820px){
  html{
    scroll-padding-top:78px;
  }

  body{
    font-size:15px;
    padding-bottom:78px;
  }

  .container{
    width:min(100% - 24px, var(--container));
  }

  .section-compact{
    padding-top:24px !important;
    padding-bottom:24px !important;
  }

  .header{
    backdrop-filter:blur(16px);
  }

  .header__inner{
    min-height:66px !important;
    gap:8px !important;
  }

  .brand img{
    height:48px !important;
    max-width:178px !important;
  }

  .header__actions{
    gap:6px !important;
  }

  .icon-btn{
    width:40px !important;
    height:40px !important;
    border-radius:13px !important;
  }

  .search-pill{
    display:none !important;
  }

  .hero{
    padding-top:82px !important;
  }

  .hero__grid{
    gap:18px !important;
  }

  .hero__copy{
    padding-right:0 !important;
  }

  .hero-title-stylized,
  .hero__copy h2{
    font-size:clamp(2.05rem, 10vw, 3.15rem) !important;
    line-height:1.02 !important;
    letter-spacing:-.04em !important;
  }

  .hero__copy p{
    font-size:.98rem !important;
    max-width:100% !important;
  }

  .hero__actions{
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:10px !important;
    margin:18px 0 14px !important;
  }

  .hero__actions .btn{
    width:100%;
    height:48px;
    padding:0 12px;
    font-size:.92rem;
    white-space:nowrap;
  }

  .hero-trustline{
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:8px !important;
  }

  .hero-trustline span{
    width:100%;
    justify-content:center;
    text-align:center;
    padding:9px 10px !important;
    font-size:.84rem !important;
  }

  .hero-stack{
    width:100% !important;
    max-width:390px !important;
    margin:0 auto !important;
    padding:14px !important;
    border-radius:26px !important;
  }

  .hero-product{
    grid-template-columns:1fr !important;
    text-align:center;
    gap:12px !important;
  }

  .hero-product__image img{
    max-height:230px !important;
    object-fit:contain !important;
  }

  .hero-product__meta{
    align-items:center !important;
  }

  .hero-overview__grid,
  .guide__grid,
  .order__grid{
    grid-template-columns:1fr !important;
    gap:16px !important;
  }

  .flash__head{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:14px !important;
  }

  .flash__head h1,
  .section-title h2,
  .order__summary h2{
    font-size:clamp(1.75rem, 7vw, 2.35rem) !important;
    line-height:1.08 !important;
  }

  .flash__head p,
  .section-copy,
  .consult-banner p{
    font-size:.96rem !important;
  }

  .countdown{
    width:100%;
    justify-content:space-between;
  }

  .countdown span{
    flex:1;
    min-width:0;
  }

  .flash-badges{
    display:flex;
    overflow-x:auto;
    flex-wrap:nowrap;
    gap:8px;
    padding-bottom:4px;
    scrollbar-width:none;
  }

  .flash-badges::-webkit-scrollbar{
    display:none;
  }

  .flash-badges span{
    flex:0 0 auto;
    white-space:nowrap;
  }

  .feature-row{
    grid-template-columns:1fr !important;
    gap:14px !important;
  }

  .feature-card{
    grid-template-columns:96px 1fr !important;
    gap:12px !important;
    padding:14px !important;
    border-radius:22px !important;
  }

  .feature-card img{
    width:96px !important;
    height:120px !important;
    border-radius:18px !important;
  }

  .feature-card h3{
    font-size:1rem !important;
  }

  .feature-card p{
    font-size:.9rem !important;
    margin-bottom:10px !important;
  }

  .feature-actions--dual,
  .feature-actions{
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
  }

  .feature-actions--dual .mini-view,
  .feature-actions--dual .mini-buy,
  .mini-buy,
  .mini-view{
    height:38px !important;
    padding:0 10px !important;
    font-size:.86rem !important;
    border-radius:12px !important;
    white-space:nowrap;
  }

  .luxury-collections__grid,
  .mood-grid{
    display:flex !important;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    gap:12px !important;
    padding-bottom:6px;
    scrollbar-width:none;
  }

  .luxury-collections__grid::-webkit-scrollbar,
  .mood-grid::-webkit-scrollbar{
    display:none;
  }

  .luxury-collections__grid article,
  .mood-card{
    flex:0 0 78%;
    scroll-snap-align:start;
  }

  .section-title,
  .products-head{
    align-items:flex-start !important;
    gap:12px !important;
  }

  .products-head{
    display:grid !important;
    grid-template-columns:1fr auto;
  }

  .result-pill{
    align-self:start;
    white-space:nowrap;
    font-size:.82rem !important;
    padding:8px 10px !important;
  }

  .filter-panel{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding:12px !important;
    border-radius:22px !important;
  }

  .filter-panel select,
  .search-field{
    width:100% !important;
    height:48px !important;
    border-radius:16px !important;
  }

  .brand-filter{
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    gap:8px !important;
    padding:10px !important;
    margin-bottom:16px !important;
    border-radius:20px !important;
    scrollbar-width:none;
  }

  .brand-filter::-webkit-scrollbar{
    display:none;
  }

  .brand-chip{
    flex:0 0 auto !important;
    height:38px !important;
    padding:0 12px !important;
    font-size:.88rem !important;
  }

  .product-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:12px !important;
  }

  .product-card--premium{
    border-radius:20px !important;
    overflow:hidden;
  }

  .product-card--premium .product-media{
    padding:8px !important;
  }

  .product-card--premium .product-media img{
    border-radius:15px !important;
  }

  .product-card--premium .product-badges{
    top:14px !important;
    left:14px !important;
    right:14px !important;
    gap:5px !important;
  }

  .product-card--premium .product-badges span{
    padding:5px 7px !important;
    font-size:.66rem !important;
  }

  .product-card--premium .wish-btn{
    right:14px !important;
    bottom:12px !important;
    width:34px !important;
    height:34px !important;
  }

  .product-card--premium .product-info{
    padding:6px 10px 12px !important;
  }

  .product-card--premium .product-topline{
    min-height:auto !important;
    margin-bottom:5px !important;
  }

  .product-card--premium .product-topline span{
    font-size:.68rem !important;
  }

  .product-card--premium .product-topline b{
    font-size:.75rem !important;
  }

  .product-card--premium h3{
    min-height:2.6em !important;
    max-height:2.6em !important;
    font-size:.94rem !important;
    line-height:1.3 !important;
    margin:0 !important;
  }

  .product-card--premium .shade{
    min-height:auto !important;
    margin:6px 0 !important;
    font-size:.82rem !important;
  }

  .product-card--premium .desc{
    display:none !important;
  }

  .product-card--premium .tag-row{
    min-height:28px !important;
    max-height:28px !important;
    margin-top:8px !important;
    gap:5px !important;
    overflow:hidden !important;
  }

  .product-card--premium .tag-row span{
    height:26px !important;
    padding:0 8px !important;
    font-size:.68rem !important;
  }

  .product-card--premium .product-foot,
  .product-card--premium .product-foot.product-foot--stack{
    margin-top:10px !important;
    padding-top:10px !important;
    gap:9px !important;
  }

  .product-card--premium .product-foot .price{
    display:grid !important;
    gap:2px !important;
  }

  .product-card--premium .product-foot .price b{
    font-size:.98rem !important;
  }

  .product-card--premium .product-foot .price del{
    font-size:.76rem !important;
  }

  .product-card--premium .card-actions,
  .product-card--premium .card-actions.card-actions--dual{
    grid-template-columns:1fr !important;
    gap:7px !important;
  }

  .product-card--premium .small-btn.small-btn--wide,
  .product-card--premium .add-btn.add-btn--wide{
    height:38px !important;
    font-size:.83rem !important;
    border-radius:12px !important;
  }

  .consult-banner{
    display:grid !important;
    grid-template-columns:1fr !important;
    padding:20px !important;
    border-radius:22px !important;
    gap:14px !important;
  }

  .consult-banner__actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  .consult-banner__actions .btn{
    width:100%;
  }

  .order__summary,
  .order-form{
    padding:18px !important;
    border-radius:22px !important;
  }

  .order-box{
    min-height:auto !important;
    gap:10px !important;
  }

  .order-box article{
    grid-template-columns:50px 1fr !important;
    gap:10px !important;
  }

  .order-box article strong{
    grid-column:2;
    justify-self:start;
  }

  .order-form label{
    gap:7px !important;
    font-size:.9rem !important;
  }

  .order-form input,
  .order-form textarea{
    font-size:16px !important;
  }

  .form-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  .form-actions .btn{
    width:100%;
  }

  .footer{
    padding-bottom:86px !important;
  }

  .footer__grid{
    grid-template-columns:1fr !important;
    gap:16px !important;
  }

  .floating-contact{
    display:none !important;
  }

  .mobile-bottom{
    display:grid !important;
    grid-template-columns:repeat(5, 1fr);
    gap:4px;
    left:8px !important;
    right:8px !important;
    bottom:8px !important;
    padding:7px !important;
    border-radius:22px !important;
  }

  .mobile-bottom a,
  .mobile-bottom button{
    min-width:0;
    padding:6px 3px !important;
    border-radius:16px !important;
  }

  .mobile-bottom span{
    font-size:1.08rem !important;
  }

  .mobile-bottom b{
    font-size:.68rem !important;
    white-space:nowrap;
  }

  .mobile-bottom i{
    top:2px !important;
    right:4px !important;
  }

  .quick-modal{
    padding:10px !important;
  }

  .quick-modal__card{
    width:100% !important;
    max-height:92vh !important;
    overflow:auto !important;
    grid-template-columns:1fr !important;
    border-radius:24px !important;
  }

  .quick-gallery,
  .quick-info{
    padding:16px !important;
  }

  .quick-main img{
    max-height:280px !important;
  }

  .quick-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
  }

  .cart-drawer{
    width:min(100vw, 420px) !important;
    border-radius:22px 0 0 22px !important;
  }
}

@media (max-width: 390px){
  .container{
    width:min(100% - 18px, var(--container));
  }

  .brand img{
    height:44px !important;
    max-width:158px !important;
  }

  .hero__actions{
    grid-template-columns:1fr !important;
  }

  .hero-trustline{
    grid-template-columns:1fr !important;
  }

  .product-grid{
    grid-template-columns:1fr !important;
  }

  .product-card--premium .card-actions,
  .product-card--premium .card-actions.card-actions--dual{
    grid-template-columns:1fr 1fr !important;
  }

  .mobile-bottom b{
    font-size:.62rem !important;
  }
}

/* Reduce heavy animation on mobile for smoother scrolling */
@media (max-width:820px), (prefers-reduced-motion: reduce){
  .reveal,
  .reveal.show,
  .product-card,
  .feature-card,
  .btn,
  .brand-chip{
    transition-duration:.16s !important;
  }
}


/* V21.2 - Mobile balance fix */
@media (max-width:820px){
  body{
    padding-bottom:92px !important;
    overflow-x:hidden !important;
  }

  main,
  section,
  .container{
    max-width:100vw !important;
    overflow-x:hidden;
  }

  /* Chống các section tạo cảm giác lệch do card kéo ngang */
  .luxury-collections__grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
    overflow:visible !important;
    scroll-snap-type:none !important;
    padding-bottom:0 !important;
  }

  .luxury-collections__grid article{
    width:100% !important;
    max-width:100% !important;
    flex:none !important;
    scroll-snap-align:unset !important;
    min-height:auto !important;
    padding:18px 20px !important;
    border-radius:22px !important;
  }

  .luxury-collections__grid article span{
    font-size:.72rem !important;
  }

  .luxury-collections__grid article b{
    font-size:1rem !important;
    line-height:1.28 !important;
  }

  .luxury-collections__grid article p{
    font-size:.88rem !important;
    line-height:1.55 !important;
    margin-top:6px !important;
  }

  /* Tone son vẫn cho kéo ngang nhưng căn lại đẹp hơn */
  .mood-grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    overflow:visible !important;
    scroll-snap-type:none !important;
    gap:10px !important;
    padding-bottom:0 !important;
  }

  .mood-card{
    width:100% !important;
    max-width:100% !important;
    flex:none !important;
    min-height:120px !important;
    padding:14px !important;
  }

  .mood-card b{
    font-size:.95rem !important;
  }

  .mood-card small{
    font-size:.78rem !important;
  }

  /* Thanh dưới gọn hơn và không che nội dung */
  .mobile-bottom{
    left:10px !important;
    right:10px !important;
    bottom:10px !important;
    width:auto !important;
    max-width:calc(100vw - 20px) !important;
    grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
    padding:6px !important;
    gap:3px !important;
    border-radius:20px !important;
  }

  .mobile-bottom a,
  .mobile-bottom button{
    min-width:0 !important;
    width:100% !important;
    padding:6px 2px !important;
    border-radius:15px !important;
  }

  .mobile-bottom span{
    font-size:1rem !important;
    line-height:1 !important;
  }

  .mobile-bottom b{
    font-size:.64rem !important;
    line-height:1.1 !important;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  /* Card sản phẩm không quá dài trên mobile */
  .product-card--premium{
    min-height:auto !important;
  }

  .product-card--premium .product-info{
    min-height:auto !important;
  }

  .product-card--premium .product-foot{
    margin-top:9px !important;
  }

  /* Flash sale tránh lệch ngang */
  .flash-shell,
  .flash-sale .container{
    overflow:hidden !important;
  }
}

@media (max-width:430px){
  .container{
    width:calc(100% - 22px) !important;
  }

  .section-title,
  .products-head{
    grid-template-columns:1fr !important;
  }

  .result-pill{
    justify-self:start !important;
  }
}

@media (max-width:360px){
  .mood-grid{
    grid-template-columns:1fr !important;
  }

  .mobile-bottom b{
    font-size:.58rem !important;
  }
}
