/* ================================================================
   萬年堂 商店型首頁樣式（home.css）
   仿官方商店版面：白底 + 棕主色 #624D4A + 金/紅傳統點綴
   僅供 index.html 使用，不影響 styles.css（結帳/會員/後台）
   ================================================================ */
:root{
  --brown:#624d4a; --brown-d:#4a3a37; --brown-l:#806663;
  --gold:#b8893b; --gold-2:#d4a857; --gold-3:#efd9a3;
  --seal:#b3201a; --seal-d:#8a1612;
  --ink:#3a322f; --muted:#8a7f7a; --line:#ececec;
  --cream:#faf6ef; --bg:#fff;
  --star:#f5b800;
  --shadow:0 10px 30px rgba(60,40,35,.12);
  --shadow-sm:0 4px 14px rgba(60,40,35,.08);
  --wrap:1200px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color:var(--ink);background:var(--bg);line-height:1.7;-webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}

/* 共用按鈕 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--brown);color:#fff;font-weight:700;font-size:1rem;
  padding:13px 30px;border-radius:6px;border:none;cursor:pointer;
  transition:background .15s,transform .15s}
.btn:hover{background:var(--brown-d);transform:translateY(-1px)}
.btn-gold{background:linear-gradient(135deg,var(--gold-2),var(--gold));color:#3a2a10}
.btn-gold:hover{filter:brightness(1.05);background:linear-gradient(135deg,var(--gold-2),var(--gold))}
.btn-lg{font-size:1.15rem;padding:16px 44px}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}

/* ============ 頁首 ============ */
.site-header{position:sticky;top:0;z-index:60;background:#fff;border-bottom:1px solid var(--line)}
.hdr-top{position:relative;display:flex;align-items:center;justify-content:center;
  height:78px;max-width:var(--wrap);margin:0 auto;padding:0 20px}
.hdr-logo{display:flex;align-items:center;gap:8px}
.hdr-logo img{height:46px;width:auto}
.hdr-logo .seal{display:inline-flex;align-items:center;justify-content:center;
  background:var(--seal);color:#f6e3b0;font-weight:900;font-size:1.15rem;letter-spacing:2px;
  padding:6px 12px;border-radius:5px;box-shadow:inset 0 0 0 2px rgba(255,255,255,.25)}
.hdr-logo .sub{font-family:"Songti TC","STKaiti","KaiTi",serif;color:var(--seal);
  font-size:1.4rem;font-weight:700;margin-left:2px}
.hdr-icons{position:absolute;right:20px;top:50%;transform:translateY(-50%);
  display:flex;align-items:center;gap:20px}
.hdr-icons a{position:relative;color:var(--ink);line-height:1;display:inline-flex;align-items:center}
.hdr-icons svg.ic{display:block;width:auto;height:26px;fill:#333;transition:fill .15s}
.hdr-icons a:hover svg.ic{fill:var(--brown)}
.hdr-icons .cart-count{position:absolute;top:-7px;right:-9px;background:var(--seal);color:#fff;
  font-size:.66rem;font-weight:700;min-width:18px;height:18px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;padding:0 3px;border:1.5px solid #fff;line-height:1}
.hdr-nav{border-top:1px solid var(--line)}
.hdr-nav ul{display:flex;justify-content:center;gap:38px;flex-wrap:wrap;padding:0 20px}
.hdr-nav a{display:block;padding:15px 2px;font-size:1rem;font-weight:500;color:var(--ink);
  border-bottom:2px solid transparent;transition:color .15s,border-color .15s}
.hdr-nav a:hover,.hdr-nav a.active{color:var(--brown);border-color:var(--brown)}
/* 漢堡（行動版） */
.hdr-burger{display:none;position:absolute;left:20px;top:50%;transform:translateY(-50%);
  background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--ink)}

/* ============ HERO 主視覺 ============ */
.hero{position:relative;background:
   radial-gradient(60% 80% at 18% 30%,#fff 0%,transparent 60%),
   repeating-radial-gradient(circle at 50% 40%,#f3ead7 0 1px,transparent 1px 26px),
   linear-gradient(160deg,#faf3e4,#f1e2c6);
   overflow:hidden}
.hero-inner{max-width:var(--wrap);margin:0 auto;padding:30px 20px 0;
  display:grid;grid-template-columns:1fr 1.05fr;gap:10px;align-items:center;min-height:430px}
.hero-figure{position:relative;align-self:end}
.hero-figure img{width:100%;max-width:480px;margin:0 auto;filter:drop-shadow(0 18px 24px rgba(60,40,35,.25))}
.hero-copy{padding:18px 0 40px}
.hero-banner-tag{display:inline-block;background:var(--seal);color:#f6e3b0;font-weight:700;
  font-size:.9rem;padding:5px 16px;border-radius:50px;margin-bottom:14px}
.hero h1{font-family:"Songti TC","STKaiti","KaiTi",serif;font-weight:900;line-height:1.12;
  color:var(--brown-d);margin-bottom:6px}
.hero h1 .up{display:inline-block;font-size:2.1rem;color:var(--seal);
  -webkit-text-stroke:.5px var(--gold);margin-bottom:6px}
.hero h1 .big{display:block;font-size:4rem;
  background:linear-gradient(180deg,#8a5a16,#d9a843 55%,#8a5a16);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  text-shadow:0 2px 0 rgba(255,255,255,.4)}
.hero h1 .raw{display:inline-block;background:var(--seal);color:#fff;font-size:1.5rem;
  padding:2px 14px;border-radius:8px;margin-top:8px;writing-mode:vertical-rl;letter-spacing:2px}
.hero .badges{display:flex;gap:14px;margin:22px 0}
.hero .badge{width:84px;height:84px;border-radius:50%;
  background:radial-gradient(circle at 50% 35%,var(--gold-2),var(--gold));
  color:#3a2a08;font-weight:900;display:flex;flex-direction:column;align-items:center;
  justify-content:center;text-align:center;line-height:1.1;font-size:.95rem;
  box-shadow:0 6px 14px rgba(120,80,20,.35);border:2px solid #fff}
.hero .badge small{display:block;font-size:.62rem;font-weight:700;opacity:.85}
.hero .endorse{display:flex;align-items:center;gap:10px;color:var(--brown-d);font-size:.95rem;font-weight:600}
.hero .endorse b{color:var(--seal);font-size:1.05rem}
.hero-phone{margin-top:auto}
.hero-phonebar{background:linear-gradient(90deg,#5a3a1c,#7a5226);color:#fff;
  display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;
  padding:14px 20px;font-weight:800}
.hero-phonebar .free{background:var(--seal);border-radius:6px;padding:3px 10px;font-size:.85rem}
.hero-phonebar .num{font-size:1.9rem;letter-spacing:1px;color:#ffe9a8}

/* 滿額送 角標 */
.hero-gift{position:absolute;right:18px;top:24px;width:150px;text-align:center;color:#fff;
  background:radial-gradient(circle at 50% 30%,var(--seal),var(--seal-d));border-radius:14px;
  padding:14px 8px;box-shadow:var(--shadow);transform:rotate(3deg);font-weight:800;line-height:1.2}
.hero-gift .big{font-size:1.3rem;color:#ffe08a;display:block}

/* ============ 三套組卡 ============ */
.combo{padding:42px 0 8px}
.combo-row{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.combo-card{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;
  box-shadow:var(--shadow-sm);display:flex;flex-direction:column;transition:transform .15s,box-shadow .15s}
.combo-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.combo-pic{position:relative;background:linear-gradient(160deg,#f7efe0,#efe0c6);padding:18px}
.combo-pic img{width:100%;aspect-ratio:16/10;object-fit:contain}
.combo-pic .ribbon{position:absolute;top:12px;right:0;background:linear-gradient(90deg,var(--gold),var(--gold-2));
  color:#fff;font-weight:800;font-size:.92rem;padding:5px 14px 5px 12px;border-radius:50px 0 0 50px;
  box-shadow:0 3px 8px rgba(120,80,20,.3)}
.combo-pic .ribbon b{font-size:1.15rem;margin:0 2px}
.combo-pic .free{position:absolute;bottom:12px;right:12px;width:54px;height:54px;border-radius:50%;
  background:var(--seal);color:#fff;font-weight:900;font-size:.95rem;display:flex;flex-direction:column;
  align-items:center;justify-content:center;line-height:1;box-shadow:0 4px 10px rgba(150,20,20,.35);
  transform:rotate(-8deg)}
.combo-pic .free small{font-size:.6rem;font-weight:700}
.combo-body{padding:18px 20px 22px;display:flex;flex-direction:column;flex:1}
.combo-body h3{font-size:1.3rem;color:var(--brown-d);margin-bottom:6px}
.combo-body .desc{font-size:.88rem;color:var(--muted);margin-bottom:14px;flex:1}
.combo-price{display:flex;align-items:baseline;gap:10px;margin-bottom:14px}
.combo-price .was{color:var(--muted);text-decoration:line-through;font-size:.95rem}
.combo-price .now{color:var(--seal);font-weight:900;font-size:1.9rem}
.combo-price .now small{font-size:1rem;font-weight:700;margin-right:2px}
.combo-body .btn{width:100%}

/* ============ 區塊標題（分頁式） ============ */
.block{padding:46px 0}
.block-head{display:flex;align-items:flex-end;justify-content:space-between;
  border-bottom:1px solid var(--line);margin-bottom:30px;flex-wrap:wrap;gap:8px}
.block-tabs{display:flex;gap:26px}
.block-tabs button{background:none;border:none;cursor:pointer;font-size:1.3rem;font-weight:700;
  color:var(--muted);padding:0 2px 12px;border-bottom:3px solid transparent;margin-bottom:-1px;transition:.15s}
.block-tabs button.active{color:var(--brown-d);border-color:var(--brown)}
.block-more{display:flex;align-items:center;gap:14px;padding-bottom:10px;color:var(--muted);font-size:.95rem}
.block-more .en{letter-spacing:1px}
.block-more a{border:1px solid var(--line);border-radius:50px;padding:5px 16px;font-size:.85rem;color:var(--brown);font-weight:600}
.block-more a:hover{background:var(--brown);color:#fff;border-color:var(--brown)}

/* 商品方格 */
.prod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.prod-card{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;
  box-shadow:var(--shadow-sm);transition:transform .15s,box-shadow .15s}
.prod-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.prod-card .pic{background:var(--cream);padding:16px}
.prod-card .pic img{width:100%;aspect-ratio:1/1;object-fit:contain}
.prod-card .b{padding:16px;text-align:center}
.prod-card h4{font-size:1.02rem;color:var(--brown-d);margin-bottom:6px}
.prod-card .p{color:var(--seal);font-weight:900;font-size:1.15rem}
.prod-card .p s{color:var(--muted);font-weight:400;font-size:.85rem;margin-right:6px}
/* 動態商品卡（#allproducts 由 index.html 依 /api/config 產生）*/
/* 區塊標題：與 .block-tabs button.active 視覺一致，但不是按鈕（見 index.html 該處註解）*/
.block-title{font-size:1.3rem;font-weight:700;color:var(--brown-d);
  padding:0 2px 12px;border-bottom:3px solid var(--brown);margin-bottom:-1px}
.prod-card{position:relative}
.prod-card > a{display:block;color:inherit;text-decoration:none}
/* 整卡是連結，鍵盤 focus 的外框會被卡片的 overflow:hidden 裁掉，改用 focus-within 畫在卡片上 */
.prod-card:focus-within{outline:3px solid var(--gold);outline-offset:2px}
.prod-card > a:focus-visible{outline:none}
/* 深金色而非 --gold(#b8893b)：後者在白底只有 3.14:1，未達 WCAG AA 的 4.5:1 */
.prod-card .low{margin-top:6px;font-size:.8rem;color:#8a5a12;font-weight:700}
.prod-card .soldout{position:absolute;top:10px;left:10px;z-index:2;background:var(--muted);color:#fff;
  font-size:.78rem;font-weight:700;padding:4px 12px;border-radius:50px;letter-spacing:1px}
/* 售完不褪色（老闆指定）：只用「售完」徽章標示，商品照與文字維持正常對比 */
.prod-card.sold{cursor:not-allowed}
.prod-card.sold:hover{transform:none;box-shadow:var(--shadow-sm)}

/* ============ 促銷大圖帶 ============ */
.promo-band{position:relative;color:#fff;text-align:center;padding:64px 20px;overflow:hidden}
.promo-band.a{background:linear-gradient(120deg,#3a2417,#6e4a24);}
.promo-band.b{background:linear-gradient(120deg,#5a1714,#9a2c22)}
.promo-band::before{content:"";position:absolute;inset:0;
  background:repeating-radial-gradient(circle at 80% 20%,rgba(255,255,255,.05) 0 1px,transparent 1px 22px);opacity:.6}
.promo-band .inner{position:relative;max-width:880px;margin:0 auto}
.promo-band h2{font-family:"Songti TC","STKaiti","KaiTi",serif;font-size:2.6rem;line-height:1.25;margin-bottom:14px;
  text-shadow:0 2px 8px rgba(0,0,0,.3)}
.promo-band h2 em{font-style:normal;color:var(--gold-3)}
.promo-band p{font-size:1.1rem;opacity:.92;max-width:640px;margin:0 auto 8px}
.promo-band .certs{display:flex;justify-content:center;gap:22px;flex-wrap:wrap;margin-top:22px;font-weight:700}
.promo-band .certs span{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);
  border-radius:50px;padding:8px 20px;font-size:.95rem}
.promo-band .certs span::before{content:"✔ ";color:var(--gold-3)}
.promo-perks{display:flex;justify-content:center;gap:36px;flex-wrap:wrap;margin-top:26px}
.promo-perks .perk{background:rgba(0,0,0,.18);border:2px solid var(--gold-2);border-radius:18px;
  padding:18px 30px;text-align:center}
.promo-perks .perk .t{color:var(--gold-3);font-weight:800;font-size:1.05rem}
.promo-perks .perk .v{font-size:1.5rem;font-weight:900;margin-top:4px}

/* ============ 網友推薦 ============ */
.reviews{position:relative;background:var(--bg);padding:60px 0;overflow:hidden}
.reviews .rv-title{text-align:center;margin-bottom:40px}
.reviews .rv-title h2{font-family:"Songti TC","STKaiti","KaiTi",serif;font-size:3rem;color:var(--brown-d);
  display:inline-flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center}
.reviews .rv-stars{color:var(--star);font-size:2rem;letter-spacing:3px}
.rv-list{max-width:760px;margin:0 auto;display:grid;gap:20px;position:relative;z-index:2}
.rv-card{display:flex;align-items:center;gap:16px}
.rv-av{flex:0 0 64px;width:64px;height:64px;border-radius:50%;overflow:hidden;
  background:linear-gradient(135deg,var(--gold-2),var(--brown-l));color:#fff;font-weight:800;font-size:1.5rem;
  display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm)}
.rv-bubble{position:relative;background:#fff;border:1px solid var(--line);border-radius:16px;
  padding:14px 20px;box-shadow:var(--shadow-sm);flex:1}
.rv-bubble::before{content:"";position:absolute;left:-9px;top:24px;width:16px;height:16px;background:#fff;
  border-left:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)}
.rv-bubble .top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rv-bubble .stars{color:var(--star);letter-spacing:1px}
.rv-bubble .who{color:var(--muted);font-size:.9rem}
.rv-bubble p{color:var(--ink);margin-top:4px}
.rv-float{position:absolute;font-size:2.2rem;opacity:.9;z-index:1;animation:bob 4s ease-in-out infinite}
.rv-float.f1{top:60px;right:8%}.rv-float.f2{top:170px;right:3%}
.rv-float.f3{top:300px;right:11%}.rv-float.f4{top:120px;left:4%}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.hashtags{display:flex;justify-content:center;gap:30px;flex-wrap:wrap;margin-top:40px}
.hashtags span{font-size:1.4rem;font-weight:800;color:var(--brown);display:inline-flex;align-items:center;gap:8px}
.hashtags span i{font-style:normal;font-size:1.6rem}

/* ============ 好評推薦 / 影片 分頁 ============ */
.testi-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:start}
.life-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px 10px}
.life-cell{text-align:center}
.life-cell .circ{width:100%;aspect-ratio:1/1;border-radius:50%;margin:0 auto 10px;max-width:150px;
  background:radial-gradient(circle at 50% 35%,var(--cream),#ecdcc2);border:3px solid #fff;
  box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:center;font-size:2.6rem}
.life-cell .cap{font-weight:700;color:var(--brown-d);font-size:1rem}
.video-wrap{position:relative;border-radius:14px;overflow:hidden;box-shadow:var(--shadow);
  background:#000;aspect-ratio:16/9}
.video-wrap img{width:100%;height:100%;object-fit:cover;opacity:.85}
.video-wrap .play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.video-wrap .play span{width:74px;height:74px;border-radius:50%;background:rgba(180,20,20,.92);
  color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.8rem;padding-left:6px;
  box-shadow:0 6px 18px rgba(0,0,0,.4);transition:transform .15s}
.video-wrap:hover .play span{transform:scale(1.08)}
.video-cap{position:absolute;left:0;right:0;bottom:0;padding:14px 16px;color:#fff;font-weight:700;
  background:linear-gradient(0deg,rgba(0,0,0,.7),transparent)}
.tab-panel{display:none}.tab-panel.active{display:block}

/* ============ 客服 CTA 帶 ============ */
.cs-band{background:linear-gradient(90deg,#4a2f17,#7a5226);color:#fff;text-align:center;padding:40px 20px}
.cs-band h3{font-size:1.6rem;margin-bottom:6px}
.cs-band .num{font-size:2.6rem;font-weight:900;color:#ffe9a8;letter-spacing:1px}
.cs-band p{opacity:.9;margin-top:4px}

/* ============ 經銷品牌 ============ */
.brands{padding:50px 0 60px}
.brands .grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin-top:26px}
.brands .chip{background:#fff;border:1px solid var(--line);border-radius:12px;padding:22px 10px;
  text-align:center;font-weight:800;color:var(--brown);box-shadow:var(--shadow-sm);font-size:1.05rem}

/* ============ 頁尾 ============ */
.site-footer{background:#2c211d;color:#cabfb8;padding:50px 0 0;margin-top:10px}
.ft-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:36px}
.site-footer h4{color:#fff;font-size:1.05rem;margin-bottom:16px;letter-spacing:1px}
.ft-about .logo{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.ft-about .logo .seal{background:var(--seal);color:#f6e3b0;font-weight:900;padding:5px 10px;border-radius:5px;letter-spacing:2px}
.ft-about p,.site-footer li{font-size:.92rem;line-height:2}
.site-footer a:hover{color:var(--gold-2)}
.ft-contact li{display:flex;gap:8px}
.ft-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:36px;padding:18px 0;
  text-align:center;font-size:.82rem;color:#8d8078;line-height:1.8}
.disclaimer{background:#211814;color:#8d8078;font-size:.8rem;text-align:center;padding:14px 20px;line-height:1.7}

/* 回到頂端 */
.to-top{position:fixed;right:18px;bottom:22px;width:46px;height:46px;border-radius:50%;
  background:var(--brown);color:#fff;border:none;cursor:pointer;font-size:1.3rem;z-index:55;
  box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:opacity .2s}
.to-top.show{opacity:.92;pointer-events:auto}
.to-top:hover{background:var(--brown-d)}

/* ============ 真實圖檔版位（mirror blkcare） ============ */
.hero-slider{position:relative;width:100%;overflow:hidden;background:#f3e6cf}
.hero-slider .slides{display:flex;transition:transform .5s ease;will-change:transform}
.hero-slider .slide{min-width:100%}
.hero-slider .slide a,.hero-slider .slide picture{display:block;width:100%}
.hero-slider .slide img{width:100%;height:auto;display:block}
.hero-slider .dots{position:absolute;bottom:16px;left:0;right:0;display:flex;justify-content:center;gap:10px;z-index:3}
.hero-slider .dots button{width:12px;height:12px;border-radius:50%;border:none;background:rgba(255,255,255,.65);cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.25);padding:0}
.hero-slider .dots button.active{background:var(--brown)}
.hero-slider .arrow{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.22);color:#fff;border:none;width:46px;height:46px;border-radius:50%;font-size:1.5rem;line-height:1;cursor:pointer;z-index:3;transition:background .15s}
.hero-slider .arrow.prev{left:16px}.hero-slider .arrow.next{right:16px}
.hero-slider .arrow:hover{background:rgba(0,0,0,.45)}

.blocks3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1140px;margin:0 auto;padding:38px 16px 14px}
.blocks3 a{display:block;border-radius:10px;overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .15s,box-shadow .15s}
.blocks3 a:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.blocks3 img{width:100%;display:block}

.banners-stack{max-width:1040px;margin:0 auto;padding:18px 16px;display:grid;gap:26px}
.banners-stack a{display:block;border-radius:14px;overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .15s,box-shadow .15s}
.banners-stack a:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.banners-stack img{width:100%;display:block}

.testi-real{max-width:1140px;margin:0 auto;padding:0 16px;display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:center}
.testi-real img{width:100%;border-radius:14px;display:block}
.testi-real .vid{position:relative;border-radius:14px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:16/9;background:#000}
.testi-real .vid iframe{width:100%;height:100%;border:0;display:block}

.cs-full{padding:0;background:#3a2417}
.cs-full a,.cs-full img{display:block;width:100%}

.squares{max-width:1040px;margin:0 auto;padding:34px 16px 8px;display:grid;gap:16px}
.squares .row{display:grid;grid-template-columns:2fr 1fr 1fr;gap:16px}
/* 這兩區是純資訊圖（檢驗報告／見證），沒有連結；圓角陰影要掛在 img 上才不會掉樣式 */
.squares a,.squares>.row>img{display:block;border-radius:10px;overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .15s}
.squares a:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.squares img{width:100%;height:100%;display:block;object-fit:cover}

.brands2{max-width:1040px;margin:0 auto;padding:18px 16px 54px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.brands2 a,.brands2>img{display:block;border-radius:12px;overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .15s}
.brands2 a:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.brands2 img{width:100%;display:block}

@media(max-width:780px){
  .blocks3{grid-template-columns:1fr;gap:16px}
  .testi-real{grid-template-columns:1fr}
  .squares .row{grid-template-columns:1fr}
  .brands2{grid-template-columns:1fr}
  .hero-slider .arrow{width:38px;height:38px;font-size:1.2rem}
}

/* ============ RWD ============ */
@media(max-width:980px){
  .prod-grid{grid-template-columns:repeat(2,1fr)}
  .brands .grid{grid-template-columns:repeat(3,1fr)}
  .testi-grid{grid-template-columns:1fr}
}
@media(max-width:780px){
  .hdr-top{height:62px}
  .hdr-logo img{height:38px}
  .hdr-burger{display:block}
  .hdr-nav{position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--line);
    display:none;box-shadow:var(--shadow)}
  .hdr-nav.open{display:block}
  .hdr-nav ul{flex-direction:column;gap:0;padding:6px 0}
  .hdr-nav a{padding:13px 24px;border-bottom:1px solid var(--line);border-left:3px solid transparent}
  .hdr-nav a:hover,.hdr-nav a.active{border-bottom-color:var(--line);border-left-color:var(--brown)}
  .hero-inner{grid-template-columns:1fr;text-align:center;padding-top:18px;min-height:0}
  .hero-figure{max-width:320px;margin:0 auto;order:-1}
  .hero .badges,.hero .endorse{justify-content:center}
  .hero h1 .big{font-size:2.8rem}
  .hero-gift{width:110px;right:6px;top:10px;font-size:.85rem}
  .combo-row{grid-template-columns:1fr;gap:18px}
  .block-tabs button{font-size:1.1rem}
  .reviews .rv-title h2{font-size:2.1rem}
  .reviews .rv-stars{font-size:1.5rem}
  .rv-float{display:none}
  .hashtags{gap:18px}.hashtags span{font-size:1.1rem}
  .life-cell .circ{font-size:2rem}
  .ft-grid{grid-template-columns:1fr;gap:26px}
  .promo-band h2{font-size:1.9rem}
}
@media(max-width:480px){
  .prod-grid{grid-template-columns:1fr 1fr}
  .brands .grid{grid-template-columns:1fr 1fr}
  .hero-phonebar .num{font-size:1.5rem}
}