@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');
:root { --gold:#efa93c; --ink:#222; --muted:#686868; --line:#ededed; font:14px Poppins,Arial,sans-serif; color:var(--ink); }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
body { margin:0; background:#fff; }
a { text-decoration:none; color:inherit; }
button,input,textarea { font:inherit; }
button { cursor:pointer; color:inherit; }
img { display:block; width:100%; height:auto; }
h2,h3,p { margin:0; }
button:focus-visible,a:focus-visible,input:focus-visible { outline:2px solid #ac6400; outline-offset:3px; }
.wrap { width:min(1110px, calc(100% - 48px)); margin-inline:auto; }
.skip { position:fixed; top:-80px; left:15px; z-index:10; padding:12px; background:white; }
.skip:focus { top:12px; }
.top { background:#222; color:white; text-align:center; padding:12px; min-height:45px; }
.mast { display:grid; grid-template-columns:1fr minmax(250px,370px) 1fr; align-items:center; gap:28px; min-height:90px; }
.logo { display:inline-block; width:122px; }
.search { display:flex; border:1px solid #e5e5e5; border-radius:24px; height:41px; }
.search input { border:0; background:none; padding:0 15px; flex:1; min-width:0; }
.search button { background:#222; border:0; color:white; width:41px; border-radius:50%; font-size:23px; }
.head-actions { display:flex; justify-content:flex-end; gap:21px; align-items:center; }
.head-actions button { display:flex; align-items:center; background:none; border:0; position:relative; gap:7px; padding:0; text-align:left; }
.head-actions button>span:first-child { font:34px Arial,sans-serif; }
.head-actions small,.account-copy { display:block; white-space:nowrap; font-size:11px; }
.account-copy b { font-size:13px; }
.head-actions sup { position:absolute; right:-7px; top:1px; background:var(--gold); color:white; border-radius:50%; width:18px; height:18px; text-align:center; line-height:18px; font-size:10px; }
.nav { border-top:1px solid var(--line); display:flex; align-items:center; min-height:52px; position:relative; z-index:2; }
.nav>a,.nav>details { padding:0 19px; border-right:1px solid var(--line); white-space:nowrap; font-weight:500; }
.nav>a:first-child { padding-left:0; }
.nav summary { list-style:none; cursor:pointer; }
.nav details { position:relative; }
.dropdown { position:absolute; top:100%; left:0; min-width:200px; padding:12px; background:white; box-shadow:0 8px 20px #0002; }
.dropdown button { display:block; width:100%; border:0; background:white; text-align:left; padding:8px; }
.dropdown button:hover,.nav a:hover { color:#a36b13; }
.theme-link { position:relative; }
.theme-link small { position:absolute; top:-15px; right:0; background:#b23737; color:white; font-size:8px; padding:1px 4px; }
.hotline { margin-left:auto; border:0; background:none; display:flex; gap:10px; align-items:center; text-align:left; font-size:25px; }
.hotline span { font-size:12px; }
.hero { position:relative; background:#f3f3f3; }
.slide { height:clamp(390px,40.15vw,660px); position:relative; }
.slide picture,.slide picture img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.slide-inner { position:relative; display:flex; align-items:center; height:100%; }
.slide-inner>div { width:49%; }
.reverse .slide-inner { justify-content:flex-end; text-align:right; }
.slide p { font-size:clamp(15px,1.6vw,24px); font-weight:600; margin-bottom:11px; }
.slide h2 { font-size:clamp(32px,4vw,66px); line-height:1.16; margin:0 0 32px; font-weight:700; }
.gold { display:inline-block; border:1px solid var(--gold); border-radius:28px; padding:11px 29px; background:var(--gold); color:#fff; font-weight:600; }
.gold:hover { background:#222; border-color:#222; }
.hero-arrow { position:absolute; top:50%; translate:0 -50%; border:0; border-radius:50%; width:39px; height:39px; background:var(--gold); color:white; font-size:20px; }
.prev { left:2.3%; }.next { right:2.3%; }
.dots { position:absolute; bottom:28px; left:50%; translate:-50%; display:flex; gap:8px; }
.dots button { width:8px; height:8px; border:0; padding:0; border-radius:50%; background:var(--gold); }
.dots button[aria-pressed=true] { background:#222; }
.promo-pair { display:grid; grid-template-columns:1fr 1fr; gap:25px; padding-block:50px 0; }
.promo-pair article { position:relative; display:grid; align-items:center; min-height:190px; background:#f6f6f6; }
.promo-pair img { height:100%; object-fit:cover; position:absolute; inset:0; }
.promo-pair article>div { position:relative; padding:24px; }
.promo-pair h2 { font-size:clamp(16px,1.8vw,25px); margin-bottom:15px; }
.promo-pair .gold { padding:7px 20px; font-size:12px; }
.section { padding-block:53px 10px; }
.section h2,.newsletter h2 { text-align:center; font-size:clamp(25px,2.4vw,35px); line-height:1.3; font-weight:700; margin-bottom:23px; }
.track { display:grid; grid-auto-flow:column; gap:22px; overflow:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }
.track::-webkit-scrollbar { display:none; }
.track>* { scroll-snap-align:start; min-width:0; }
.categories { grid-auto-columns:calc((100% - 110px)/6); }
.category { text-align:center; border:0; padding:0 0 8px; background:white; }
.category img { aspect-ratio:1; object-fit:cover; border-radius:50%; margin-bottom:11px; }
.category strong,.category small { display:block; }
.category small { color:var(--muted); }
.arrows { display:flex; justify-content:flex-end; gap:6px; margin:-8px 0 12px; }
.arrows button { border:1px solid var(--line); background:white; border-radius:50%; width:30px; height:30px; font-size:19px; line-height:1; }
.arrows button:hover { background:var(--gold); color:white; }
.product-track { grid-auto-columns:calc((100% - 88px)/5); }
.product { position:relative; border:1px solid var(--line); background:white; padding-bottom:15px; text-align:center; }
.product img { aspect-ratio:1; object-fit:contain; }
.product-photo,.product-name { display:block; width:100%; background:white; border:0; padding:0; }
.product-name { font-weight:500; padding:8px 6px 2px; }
.sale { position:absolute; left:9px; top:9px; background:var(--gold); color:white; padding:2px 6px; font-size:11px; }
.cost { font-weight:600; }
.cost s { color:#777; font-weight:400; font-size:12px; margin-left:6px; }
.stars { color:#ec9b24; letter-spacing:2px; }
.card-actions { display:flex; justify-content:center; gap:8px; margin-top:9px; }
.card-actions button { border:1px solid var(--line); background:white; border-radius:50%; width:32px; height:32px; }
.card-actions button:hover,.card-actions button[aria-pressed=true] { background:var(--gold); color:white; }
.deal,.newsletter,#welcome { background:#f7f5ef var(--cover) center/cover no-repeat; }
.deal { margin-top:50px; }
.deal-inner { min-height:340px; display:flex; align-items:center; justify-content:flex-end; text-align:center; }
.deal-inner>div { width:52%; }
.deal h2 { font-size:clamp(27px,4vw,49px); margin:8px 0; }
#timer { display:flex; justify-content:center; gap:8px; margin:18px 0; }
#timer b { padding:7px 10px; background:#fff; border-radius:6px; font-size:21px; }
#timer small { display:block; font-size:9px; }
.tabs { display:flex; justify-content:center; flex-wrap:wrap; gap:8px; }
.tabs button { border:1px solid var(--line); background:white; border-radius:22px; padding:9px 16px; font-size:12px; font-weight:600; }
.tabs button[aria-pressed=true] { background:var(--gold); color:white; border-color:var(--gold); }
#filter-label { text-align:center; margin:15px 0; }
.testimonials { background:#f7f7f7; margin-top:50px; padding-bottom:50px; }
.review-track,.blog-track { grid-auto-columns:calc((100% - 44px)/3); }
.review-track article { padding:26px; text-align:center; background:white; border:1px solid #eee; }
.review-track b { color:var(--gold); font-size:32px; }
.review-track p { margin:10px 0; }
.review-track small,.blog-track small,.blog-track p { color:var(--muted); }
.blog-track article { border:1px solid var(--line); }
.blog-track img { aspect-ratio:1.7; object-fit:cover; }
.blog-track article>div { padding:16px; }
.blog-track h3 { margin:8px 0; font-size:17px; }
.text-button { border:0; padding:0; background:none; margin-top:10px; color:#8a580d; }
.center { text-align:center; margin-top:25px; }
.newsletter { margin-top:45px; text-align:center; padding:65px 20px; }
.newsletter h2 { margin-bottom:8px; }
.subscribe { display:flex; gap:8px; max-width:490px; margin:23px auto 0; }
.subscribe input { flex:1; min-width:0; border:1px solid #dedede; background:white; padding:10px 16px; border-radius:25px; }
.form-status { min-height:1.2em; color:#645b49; font-size:12px; margin-top:8px; }
.partners { padding-block:30px; }
.brand-track { grid-auto-columns:calc((100% - 110px)/6); align-items:center; }
.brand-track img { max-height:86px; object-fit:contain; }
footer { background:#f7f7f7; }
.benefits,.contacts,.footer-columns { display:grid; gap:24px; padding-block:32px; border-bottom:1px solid #e8e8e8; }
.benefits,.footer-columns { grid-template-columns:repeat(4,1fr); }
.benefits button { border:0; background:none; display:flex; align-items:center; gap:10px; text-align:left; }
.benefits span { font-size:27px; color:#a26610; }
.contacts { grid-template-columns:1.3fr 1fr 1fr; }
.contacts p { color:var(--muted); margin-top:6px; }
.footer-columns h3 { margin-bottom:12px; }
.footer-columns a,.footer-columns button { display:block; border:0; background:none; padding:4px 0; text-align:left; color:var(--muted); }
.bottom { background:#222; color:white; }
.bottom-inner { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:15px; padding-block:18px; font-size:12px; }
.social { display:flex; gap:12px; }
.mobile-bar { display:none; }
dialog { border:0; width:min(620px,94vw); max-height:90vh; padding:30px; color:var(--ink); }
dialog::backdrop { background:#0008; }
.close { position:absolute; right:10px; top:8px; border:0; background:white; font-size:23px; line-height:1; padding:4px; }
#welcome { width:min(500px,92vw); padding:58px 55px 42px; text-align:center; }
#welcome .subscribe { flex-direction:column; align-items:center; }
#welcome .subscribe input { width:100%; }
#welcome h2 { margin-bottom:8px; }
#welcome>p { color:var(--muted); }
.line { display:flex; align-items:center; gap:10px; border-bottom:1px solid var(--line); padding:10px 0; }
.line img { width:54px; height:54px; object-fit:contain; }
.line span { flex:1; }
.line button { background:white; border:1px solid var(--line); }
.detail-image { max-height:220px; object-fit:contain; }
.checkout label { display:block; margin:10px 0; }
.checkout input,.checkout textarea { display:block; width:100%; padding:8px; border:1px solid #ddd; }
#panel-body>p { margin:10px 0; }
@media(max-width:900px) {
  .mast { grid-template-columns:auto 1fr auto; gap:15px; }
  .account-copy,.hotline { display:none!important; }
  .categories,.brand-track { grid-auto-columns:calc((100% - 66px)/4); }
  .product-track { grid-auto-columns:calc((100% - 66px)/4); }
}
@media(max-width:640px) {
  .wrap { width:calc(100% - 28px); }
  .top { min-height:0; font-size:11px; padding:8px; }
  .mast { padding-block:12px; min-height:0; grid-template-columns:1fr auto; }
  .mast .logo { width:100px; }
  .search { grid-row:2; grid-column:1/-1; }
  .nav { overflow:auto; min-height:43px; }
  .nav>a,.nav>details { padding-inline:10px; font-size:12px; }
  .nav details { position:static; }
  .nav .dropdown { position:fixed; top:150px; left:14px; max-height:55vh; overflow:auto; }
  .slide { height:430px; }
  .slide picture img { object-position:center bottom; }
  .slide-inner,.reverse .slide-inner { align-items:flex-start; justify-content:center; text-align:center; padding:28px 25px; }
  .slide-inner>div { width:100%; }
  .slide h2 { font-size:32px; margin-bottom:15px; }
  .slide p { font-size:13px; }
  .hero-arrow { width:30px; height:30px; }
  .promo-pair { grid-template-columns:1fr; gap:12px; padding-top:24px; }
  .promo-pair article { min-height:175px; }
  .section { padding-top:34px; }
  .track { gap:12px; }
  .categories,.brand-track { grid-auto-columns:calc((100% - 24px)/3); }
  .product-track,.review-track,.blog-track { grid-auto-columns:calc((100% - 12px)/2); }
  .deal-inner { min-height:280px; justify-content:center; }
  .deal-inner>div { width:100%; background:#ffffffbb; padding:14px; }
  .newsletter { padding-block:38px; }
  .subscribe { max-width:360px; }
  .subscribe .gold { padding-inline:15px; }
  .benefits,.footer-columns,.contacts { grid-template-columns:1fr 1fr; gap:16px; }
  .footer-columns h3 { font-size:14px; }
  .bottom { padding-bottom:48px; }
  .mobile-bar { display:flex; position:fixed; inset:auto 0 0; background:white; box-shadow:0 -3px 16px #0002; justify-content:space-evenly; z-index:3; padding:11px 3px; font-size:11px; }
  .mobile-bar button { border:0; background:none; padding:0; }
}
