/*
Theme Name: Leiting Clean
Description: Leiting Home 自建主题 —— 无页面构建器、无外部字体、单一 CSS，商品卡与商品页结构完全自定义。
Author: Leiting Home
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: leiting-clean
Tags: e-commerce, custom-colors, custom-menu, translation-ready
*/

/* ==========================================================================
   0. 设计令牌 —— 全部照旧站实测值（2026-09 从 leitinghome.com 量的）
      旧站 = 用户改了多轮才满意的样子，新站必须长得一样
   ========================================================================== */
:root{
  --wood:#8c5a3c;          /* 木色：旧站实测 rgb(140,90,60) —— 只用在 Buy Now、滑块 */
  --wood-dark:#6f452c;
  --ink:#1e293b;           /* 标题色：旧站实测 rgb(30,41,59) */
  --body:#334155;          /* 正文色：旧站实测 rgb(51,65,85) */
  --muted:#6b625b;         /* 次级文字：rgb(107,98,91) */
  --muted-2:#8b8178;       /* VAT 小字/面包屑：rgb(139,129,120) */
  --bg:#ffffff;            /* 旧站页面底色是纯白 */
  --surface:#faf7f3;       /* 步进器按钮底色 rgb(250,247,243) */
  --line:#e6dfd6;          /* 描边：旧站实测 rgb(230,223,214) */
  --success:#2e7d32;
  --r-card:16px;           /* 侧栏圆角 16px（旧站实测）*/
  --r-btn:10px;            /* 按钮圆角 10px（旧站实测，不是药丸）*/
  --wrap:1240px;           /* 旧站容器 1240（内 1200）*/
  --pad:20px;              /* 旧站左右内距 20px */
  --sec:clamp(36px,5vw,64px);
  --gap:16px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",Roboto,Helvetica,Arial,sans-serif;
  --serif:Georgia,"Times New Roman",serif;   /* 旧站的栏目标题用衬线 */
  --shadow-s:0 1px 3px rgba(36,31,27,.06);
  --shadow-m:0 14px 30px rgba(36,31,27,.10);
}

/* ==========================================================================
   1. 基础
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box}
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth }
body{
  margin:0; background:var(--bg); color:var(--body);
  font-family:var(--font); font-size:16px; line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
a:hover{color:var(--wood)}
/* 标题：颜色和字号照旧站（h1 页面标题 36px、商品标题 20px；h2/h3 用衬线 Georgia ✓ 旧站实测）*/
h1,h2,h3,h4{margin:0 0 10px;line-height:1.25;letter-spacing:-.005em;font-weight:700;color:var(--ink)}
h2,h3,.serif{font-family:var(--serif);font-weight:600}
h1{font-size:36px;font-weight:600}
h2{font-size:25px}
h3{font-size:16.32px}
p{margin:0 0 12px}
ul{margin:0;padding:0;list-style:none}
.container{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}
.section{padding:var(--sec) 0}
.section--alt{background:var(--surface)}
.eyebrow{font-size:12.48px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-2);font-weight:600;margin:0 0 10px;font-family:var(--serif)}
.muted{color:var(--muted)}
/* 无障碍隐藏文字（国际通用写法：1px 裁切，不是凑像素定位）
   这一条同时覆盖 WordPress 自带的 .screen-reader-text，避免重复定义 ✓ */
.sr-only,.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ==========================================================================
   2. 按钮
   ========================================================================== */
/* 按钮照旧站实测：圆角 10px、1px 描边、白底墨字；Buy Now 是木色实心 ✓ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:44px;padding:0 24px;border-radius:var(--r-btn);
  font-size:15.2px;font-weight:600;line-height:1;cursor:pointer;
  border:1px solid var(--ink);transition:background .18s,color .18s,border-color .18s;
  white-space:nowrap;background:#fff;color:var(--ink);
}
.btn:hover{background:var(--ink);color:#fff}
.btn--solid{background:var(--wood);border-color:var(--wood);color:#fff}
.btn--solid:hover{background:var(--wood-dark);border-color:var(--wood-dark);color:#fff}
.btn--ghost{background:#fff;border-color:var(--ink);color:var(--ink)}
.btn--ghost:hover{background:var(--ink);color:#fff}
.btn--block{width:100%}
.btn--sm{min-height:38px;padding:9px 14px;font-size:14px}

/* ==========================================================================
   3. 顶栏 / 页脚
   ========================================================================== */
/* 页眉固定：position:sticky + top:0，高度写死靠内容撑住；transition:none 保证滚动时绝对不动、不缩、不藏。
   全站没有任何 scroll 监听（已实测 0 处），页眉不参与任何滚动交互。 */
.site-header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50;transition:none}
/* 登录 WordPress 后台时，顶部会被压一条 32px（手机 782px 以下 46px）的管理条，
   它盖在页眉上面 → 必须把 sticky 的 top 让开，否则页眉上半截被挡（看起来像"隐藏了"）*/
.admin-bar .site-header{top:32px}
@media screen and (max-width:782px){.admin-bar .site-header{top:46px}}
/* 页眉内层容器维持全站统一的 1240px 居中容器（不再铺满整条页眉）。
   用户要求：Logo 回到它原来的位置（左 120px），Sign in 保持原有右边距
   （右边缘 1320px = 容器右内距 20px），绝对不要把 Sign in 怼到屏幕最右边缘。 */
.site-header__inner{display:flex;align-items:center;gap:0;min-height:100px}
/* 早期遗留规则：原来这里还有 gap:20px 和下面的 .nav 打架（虽然被覆盖，但留着容易看错）→ 已删掉 gap */
.site-header__nav ul{display:flex;font-size:15px}
.site-header__cart{margin-left:auto;display:flex;align-items:center;gap:6px;font-weight:600}
.site-footer{background:var(--ink);color:rgba(255,255,255,.88);font-size:15px;padding:clamp(30px,4vw,52px) 0 0;margin-top:0}
.site-footer a{color:rgba(255,255,255,.88)}
.site-footer a:hover{color:#fff;text-decoration:underline}
.site-footer__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:26px;padding-bottom:28px}
.site-footer__name{color:#fff;font-weight:700;font-size:17px;margin:0 0 8px}
.site-footer__h{margin:0 0 10px;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:#fff}
.site-footer__col ul{display:flex;flex-direction:column;gap:9px}
.site-footer__bar{border-top:1px solid rgba(255,255,255,.2);padding:16px 0}
.site-footer__bar .container{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.site-footer__bar p{margin:0;font-size:13px;color:rgba(255,255,255,.8)}

/* ==========================================================================
   4. 商品卡（关键组件 · 结构由本主题决定）
   ========================================================================== */
/* 商品卡：照旧站实测 —— 完全素卡（无边框、无底色、无圆角、无内距），4 列 206px 上下排 */
ul.products{display:grid;grid-template-columns:repeat(4,1fr);gap:22px 16px;margin:0;padding:0;list-style:none}
ul.products li.product{
  display:flex;flex-direction:column;gap:8px;
  background:transparent;border:0;border-radius:0;padding:0;position:relative;
}
.card__media{position:relative;border-radius:0;overflow:hidden;background:transparent;aspect-ratio:1/1}
.card__media img{width:100%;height:100%;object-fit:cover}
.card__title{font-size:16px;font-weight:600;line-height:1.3;color:var(--ink);margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em}
.card__rating{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.stars{color:#fda256;letter-spacing:.5px;font-size:15px}
.card__price{margin:0;font-size:16px;font-weight:700;color:var(--body);display:flex;flex-wrap:wrap;align-items:baseline;gap:0 6px}
.card__vat{font-size:10px;font-weight:400;color:var(--wood);line-height:1.2}
.card__row{display:flex;align-items:center;gap:8px;margin-top:auto}
.card__qty{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.card__qty select{
  height:34px;min-width:102px;padding:0 6px;border:1px solid var(--line);border-radius:8px;
  background:#fff;color:var(--ink);font-size:14.08px;cursor:pointer
}
.card__actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.card__actions .btn--sm{min-height:32px;padding:0 6px;font-size:14px;border-radius:var(--r-btn)}
/* 列表/分类页的紧凑卡 */
ul.products.is-compact li.product{gap:6px}
@media (max-width:921px){
  ul.products{grid-template-columns:repeat(2,1fr);gap:10px}
  ul.products li.product{padding:9px;gap:6px}
  .card__title{font-size:14px}
  .card__price{font-size:15px}
  .card__qty{display:none}          /* 手机上卡片不放下拉，进商品页再选数量 */
  .card__actions{grid-template-columns:1fr;gap:6px}
  .site-footer__grid{grid-template-columns:1fr 1fr;gap:20px}
  .site-footer__name{grid-column:1 / -1}
  .site-header__nav{display:none}
}
@media (max-width:600px){ ul.products{grid-template-columns:repeat(2,1fr)} }

/* ==========================================================================
   5. 商品页
   ========================================================================== */
.pdp{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(20px,3vw,44px)}
.pdp__gallery{border-radius:var(--r-card);overflow:hidden;background:var(--surface)}
.pdp__thumbs{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.pdp__thumbs img{width:64px;height:64px;object-fit:cover;border-radius:10px;border:1.5px solid var(--line);cursor:pointer}
/* 商品页：照旧站实测 —— 标题 20px/600、价格 24px/700、VAT 小字 18.72px、按钮 52px 高 */
.pdp__title{font-size:20px;font-weight:600;line-height:1.25;margin:0 0 4px}
.pdp__price{font-size:24px;font-weight:700;color:var(--body);margin:0 0 2px}
.pdp__vat{font-size:18.72px;color:var(--wood);display:block;margin-bottom:12px}
.pdp__promise{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:13.5px;color:var(--muted);margin:10px 0 16px}
/* 勾号改成背景图（不用 position:absolute ✓） */
.pdp__promise li{padding-left:22px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'><path d='M1 5l3 3 7-7' fill='none' stroke='%238c5a3c' stroke-width='2'/></svg>") left 5px/12px 10px no-repeat}
.pdp__buy{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0 18px}
.pdp__buy .btn{min-height:52px;padding:0 26px;font-size:16px}
.pdp__buy .quantity{display:flex;align-items:center;background:#fff;border:1px solid var(--line);border-radius:10px;height:52px;overflow:hidden}
.pdp__buy .qty{height:52px;width:72px;border:0;border-left:1px solid var(--line);border-right:1px solid var(--line);text-align:center;font-size:16px;font-weight:600;color:#475569}
.pdp__buy .lh-sp-qty-btn{width:52px;height:52px;border:0;background:var(--surface);color:var(--ink);font-size:21px;line-height:1;cursor:pointer}
.pdp__buy .lh-sp-qty-btn:hover{background:var(--line)}
.spec-table{width:100%;border-collapse:collapse;font-size:14.5px;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.spec-table th,.spec-table td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line)}
.spec-table th{background:var(--surface);font-weight:600;width:42%}
.spec-table tr:last-child th,.spec-table tr:last-child td{border-bottom:0}
@media (max-width:921px){
  .pdp{grid-template-columns:1fr}
  .pdp__buy{grid-template-columns:1fr}
}

/* ==========================================================================
   6. 信任条 / 分类卡 / FAQ
   ========================================================================== */
.trust{background:var(--ink);color:#fff;padding:16px 0}
.trust ul{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.trust li{display:flex;flex-direction:column;font-size:13.5px}
.trust span{color:rgba(255,255,255,.72);font-size:12.5px}
.cats{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.cat{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;display:flex;flex-direction:column;transition:transform .18s,box-shadow .18s}
.cat:hover{transform:translateY(-2px);box-shadow:var(--shadow-m)}
.cat img{width:100%;height:230px;object-fit:cover}
.cat__body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:4px}
.cat__go{color:var(--wood);font-weight:600;font-size:14px;margin-top:8px}
.faq details{border:1px solid var(--line);border-radius:12px;background:#fff;padding:14px 16px;margin-bottom:10px}
.faq summary{font-weight:600;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq details[open] summary{margin-bottom:8px}
.reviews__row{display:flex;gap:10px;align-items:baseline;border-top:1px solid var(--line);padding:14px 0}
@media (max-width:921px){
  .trust ul{grid-template-columns:1fr 1fr;gap:12px}
  .cats{grid-template-columns:1fr}
  .cat img{height:200px}
}

/* ==========================================================================
   7. 杂项（提示条 / 面包屑 / 分页 / 表格）
   ========================================================================== */
.breadcrumb{font-size:13px;color:var(--muted);padding:14px 0}
.notice{border:1px solid var(--line);border-left:4px solid var(--wood);background:var(--surface);border-radius:12px;padding:12px 16px;margin:0 0 18px;font-size:14.5px}
.pagination{display:flex;gap:8px;justify-content:center;padding:24px 0}
.pagination a,.pagination span{min-width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:10px;background:#fff}
.pagination .current{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ==========================================================================
   8. 模板用到的新部件（站头、主视觉、内容页排版、表单、提示）
   ========================================================================== */

/* --- 跳转链接（无障碍，键盘用户第一下 Tab 就能跳到主内容） --- */
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:#fff;padding:10px 16px;z-index:100}
.skip:focus{left:8px;top:8px}

/* --- 站头：Flexbox 布局（左侧 Logo，右侧菜单+搜索+购物车+Sign in 一起靠右）
       间距照旧站实测：菜单↔搜索 7px、搜索表单↔购物车 20px、购物车↔账户 10px --- */
.site-header__inner{display:flex;align-items:center;gap:0;min-height:100px}
.site-header__brand{display:flex;align-items:center}
.site-header__brand img{width:98px;height:84px;object-fit:contain}
.site-header__name{font-weight:700;font-size:26px;color:var(--body)}
/* 右侧整块：菜单 / 搜索框 / 购物车 / 金额 / Sign in 全部靠右对齐（margin-left:auto + flex-end），
   中间不留空档，且整块与 Logo 一起垂直居中。
   注：下面各元素之间的 margin 已按用户要求整体减半（原 20px → 10px、金额 2px → 1px）；
   Logo 与菜单之间的间距不在此列，保持原样。 */
.site-header__right{display:flex;align-items:center;justify-content:flex-end;margin-left:auto}
/* 整排（菜单 / 搜索框 / 购物车+金额 / Sign in）统一用 15px 间距。
   菜单里每一对词之间的缝：原来靠 <a> 的 padding:10px 13.25px 撑出来（每对词 26.5px），
   现在把 <a> 的左右 padding 去掉，改成 nav 上【唯一一个 gap】——
   菜单内部和搜索框/购物车/Sign in 之间用同一个数值，全排一致。
   每个菜单项仍然 height:100px，可点区域高度不变。 */
.site-header__nav .nav{display:flex;gap:15px;align-items:stretch;height:100px}
.site-header__nav .nav li{display:flex;align-items:center}
.site-header__nav .nav a{display:flex;align-items:center;height:100px;padding:10px 0;font-size:15.2px;font-weight:700;color:var(--ink);white-space:nowrap}
.site-header__nav .nav a:hover{color:var(--wood)}
.site-header__nav .nav .current-menu-item > a{color:var(--wood)}
.site-header__nav .sub-menu{display:none}
/* 搜索框：旧站实测 228×42、底色 rgb(247,244,239)、1px 描边、圆角 999；按钮 32×32 深棕圆形放大镜 */
/* 间距照旧站：Contact 右边缘 → 搜索框 20px；logo 右边缘 → Home 左边缘 134px（靠菜单项内距 13.25px 凑出 504px 总跨度） */
.site-header__search{display:flex;align-items:center;margin-left:15px;width:228px;height:42px;padding:0 5px 0 16px;border:1px solid var(--line);border-radius:999px;background:#f7f4ef;flex:0 0 auto}
.site-header__search input[type=search]{flex:0 0 170px;width:170px;height:40px;border:0;background:transparent;font-size:16px;color:#3b342e;padding:0}
.site-header__search input[type=search]::placeholder{color:#8b8178}
.site-header__search input[type=search]:focus{outline:none}
.site-header__search button{flex:0 0 auto;width:32px;height:32px;padding:0;border:0;border-radius:50%;background:var(--wood);color:#fff;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.site-header__search button:hover{background:var(--wood-dark)}
.site-header__search button svg{display:block;width:15px;height:15px}
/* 购物车：旧站实测 66×62，图标 49×49（用旧站原始 SVG），间距 20px */
.site-header__cart{position:relative;display:flex;align-items:center;justify-content:center;width:66px;height:62px;margin-left:20px;color:#241f1b}
.site-header__cart:hover{color:var(--wood)}
.site-header__cart svg{display:block;width:49px;height:49px;fill:currentColor}
/* 角标样式统一在下面「12. 迷你购物车」一节定义（此处不再重复写 ✓） */
/* Sign in：旧站实测 账户区 120×42（链接 110×42、左间距 10px）、浅底、人像图标 16×16 */
.site-header__signin{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:110px;height:42px;margin-left:15px;padding:0;border:0;border-radius:999px;background:#f7f4ef;color:var(--ink);font-size:15px;font-weight:600;white-space:nowrap}
.site-header__signin:hover{background:#efe9e1;color:var(--ink)}
.site-header__account-icon{display:block;width:16px;height:16px}
.site-header__burger{display:none;background:none;border:0;font-size:22px;line-height:1;cursor:pointer;color:var(--ink)}

/* 桌面端页眉改用 Flexbox（见上面站头规则），此处不再使用绝对定位 */

/* ==========================================================================
   12. 迷你购物车 / 页眉总金额 / 数字角标 / 飞入动画（全部照旧站实测值）
   ========================================================================== */
/* 购物车图标 + 金额：绑成同一个整体（.site-header__cartgroup）。
   gap:1px 把两者间距固定死，永远是 1px，不会散开；落地放大动画也加在这一层，
   所以"图标 + 金额"是一起 1.0 → 1.2 → 1.0 的。
   注意：迷你购物车浮层 .site-header__mini 故意放在这个整体【外面】，
   否则它会被一起缩放。 */
.site-header__cartgroup{display:flex;align-items:center;gap:1px}
.site-header__cart-wrap{position:relative;display:flex;align-items:center;margin-left:15px}
/* 数字角标：用 Grid 把图标和角标叠在同一格（不用 position:absolute ✓），木色圆形、11px 白字 */
/* 购物车图标盒子：宽度从 66px 收到 49px，正好等于图标宽度。
   原来 66px 的盒子 + 居中的 49px 图标 = 图标左右各有 8.5px "看不见的空地"，
   会把"搜索框 → 图标"的视觉缝从 15px 撑到 23.5px。收到 49px 后盒子紧贴图标，
   视觉缝就等于真实的 15px。高度仍 62px（图标的垂直位置和角标位置都不变）。 */
.site-header__cart{position:relative;display:grid;place-items:center;width:49px;height:62px;margin-left:0;color:#241f1b}
.site-header__cart svg{grid-area:1 / 1;display:block;width:49px;height:49px;fill:currentColor}
/* 数量角标：以【篮子(basket)路径的真实边缘】为基准，不是以容器边缘为基准。
   实测（1440 屏，购物车盒子 1093→1142，宽 49）：
     svg viewBox = "826 837.5 140 121"，preserveAspectRatio 默认 xMidYMid meet
     → 缩放 0.35，path 用户坐标 bbox = x 828→960
     → 篮子真实屏幕范围 left=1093.7 right=1139.9 top=30.43 bottom=69.52（宽只有 46.2px！）
     即：篮子右边缘比 svg 盒子右边缘【靠内 2.1px】，顶边比 svg 顶边靠内 4.93px。
   所以贴"容器右边"是错的，必须贴"篮子右边"。
   取值 margin:-7px -14px 0 0（justify-self:end 锚右边缘），实测结果：
     角标左边缘 − 篮子右边缘 = +0.10px   → 两者在同一条垂直线上 ✓
     篮子顶边 − 角标底边     = 2.43px    → 只在篮子上方 2~3px，没有悬空 ✓
   角标大小 16px、木色底、白字 11px、圆角 99px 保持不变。 */
.site-header__count{grid-area:1 / 1;align-self:start;justify-self:end;margin:-7px -14px 0 0;display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 4px;border-radius:99px;background:#8c5a3c;color:#fff;font-size:11px;font-weight:700;line-height:1}
/* 总金额：14.4px 墨色、无气泡 */
/* 页眉总金额：固定 60px 的格子 + flex-shrink:0。
   否则金额变宽会撑开右侧区（margin-left:auto 靠右），把左边菜单/搜索/购物车整排往左挤
   （实测：金额从 £39.99 涨到 £1,234.56 时导航会摆动 61px）。
   左对齐 → 金额紧贴购物车图标（不留空隙）；格子宽度固定 → 左边任何元素都不会移动。
   格子 60px 是"够放最大金额 + 不留多余空档"的取法：£79.98 文字宽 43px，
   所以金额文字到 Sign in 的视觉空隙 = 60-43+10 = 约 27px（75px 时是 42px）。
   tabular-nums 让数字等宽，金额跳动时字符也不会左右晃。 */
/* 页眉总金额：固定 52px 的格子（用户选定的方案 B）。
   取舍：盒子固定 → 金额位数变化时【整排零平移】；
   但文字左对齐、盒子比文字宽，多出来的那点空地会落在右边，
   所以"金额文字 → Sign in"的视觉缝 = 15px + (52 − 文字宽)：
     £39.99/£79.98（43.5px）→ 约 23.5px   ← 用户已明确接受
     £199.99（51.5px）      → 约 15.5px
   52px 能完整放进 £999.99（约 51.5px），不会撞到 Sign in。
   超过约 £999.99（文字 >52px）时文字会略微溢出到右边距里，但依然不会推动任何元素。
   tabular-nums 让数字等宽。 */
.site-header__total{margin-left:0;font-size:14.4px;color:#241f1b;white-space:nowrap;flex:0 0 52px;width:52px;text-align:left;font-variant-numeric:tabular-nums}
.site-header__total .amount{color:#241f1b;font-weight:600}
/* ==========================================================================
   购物车抽屉：从屏幕右侧滑出（380px 宽、100dvh 高、白底、左侧 1px 描边）。
   · 只由【点击】触发；已删除全部 :hover / mouseenter 展开逻辑
   · 结构全部由 site.js 生成（header.php 不动）：
       .site-header__mini.lh-drawer
         ├─ .lh-drawer__head  flex-shrink:0          "Your Basket" + X
         ├─ .lh-drawer__body  flex:1 1 auto; overflow-y:auto   商品列表（内部滚动）
         └─ .lh-drawer__foot  flex-shrink:0          永远钉在抽屉最底部
   ========================================================================== */
/* 左侧灰色遮罩（点击关闭） */
.lh-drawer-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(36,31,27,.45);opacity:0;visibility:hidden;transition:opacity .3s ease-out,visibility 0s linear .3s;z-index:9998}
.lh-drawer-overlay.is-open{opacity:1;visibility:visible;transition:opacity .3s ease-out,visibility 0s linear 0s}

/* 抽屉本体：高度随内容自动变化，最高只到一屏（内容超高时列表内部滚动、底栏钉底） */
.site-header__mini{
  position:fixed;top:0;right:0;left:auto;
  width:380px;max-width:100vw;
  height:auto;max-height:100vh;max-height:100dvh;
  display:flex;flex-direction:column;
  padding:0;margin:0;
  background:#fff;
  border:0;border-left:1px solid rgb(209,213,219);border-radius:12px;box-shadow:none;
  overflow:hidden;
  z-index:9999;
  transform:translateX(100%);visibility:hidden;
  transition:transform .3s ease-out,visibility 0s linear .3s;
}
.site-header__mini.is-open{transform:translateX(0);visibility:visible;transition:transform .3s ease-out,visibility 0s linear 0s}

/* 1) 顶部标题栏：上方留大余地（字母不被挤）；下方紧贴第一条分界线。
   align-items:flex-end 让「Your Basket」和关闭按钮的底边贴在同一条线上，
   两者到分界线的距离完全一样。 */
.lh-drawer__head{flex:0 0 auto;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:28px 20px 3px;border-bottom:1px solid var(--line);background:#fff}
.lh-drawer__title{font-size:1.05rem;font-weight:700;color:#241f1b;line-height:1.15}
.lh-drawer__close{flex:0 0 auto;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;padding:0;background:#fff;border:1.5px solid rgb(230,223,214);border-radius:8px;color:#241f1b;font-size:20px;line-height:1;cursor:pointer}
.lh-drawer__close:hover{background:#f7f4ef}

/* 2) 中间商品列表：flex:1 1 auto → 内容不高时抽屉自然撑开；内容超高时内部滚动
   （min-height:0 是 flex 子项能真正滚动的关键） */
.lh-drawer__body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:16px 20px}
.lh-drawer__list{list-style:none;margin:0;padding:0}
.lh-drawer__item{display:grid;grid-template-columns:64px 1fr;gap:12px;align-items:start;padding:16px 0;border-top:1px solid var(--line)}
.lh-drawer__item:first-child{border-top:0;padding-top:0}
.lh-drawer__thumb{display:block;line-height:0}
/* 缩略图严格限制尺寸：图片一进 DOM 就是 64×64，绝不会先按原图尺寸撑破布局 */
.site-header__mini img{width:64px;height:64px;object-fit:cover;display:block;aspect-ratio:1 / 1;border:1px solid rgb(239,234,227);border-radius:7px}

/* 商品行：第 1 行 名称 + 垃圾桶；第 2 行 单价 × 数量 = Subtotal 金额；第 3 行 VAT */
.lh-drawer__top{display:flex;align-items:flex-start;gap:8px}
.lh-drawer__name{flex:1 1 auto;font-size:.9rem;font-weight:600;color:#241f1b;text-decoration:none;line-height:1.35}
.lh-drawer__name:hover{color:var(--wood)}
.lh-drawer__trash{flex:0 0 auto;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;padding:0;background:#fff;border:1.5px solid rgb(230,223,214);border-radius:8px;color:#241f1b;cursor:pointer}
.lh-drawer__trash:hover{background:#f7f4ef;border-color:rgb(209,213,219)}
.lh-drawer__trash svg{width:15px;height:15px;display:block;fill:currentColor}
.lh-drawer__empty{color:var(--muted);font-size:.95rem;padding:12px 0;margin:0}

/* 第 2 行：单价 × [− 数字 +] = Subtotal 金额  （× 和 = 都显式写出来） */
/* 商品行第 2 / 3 行，用 grid 两列排：
     左列：单价 × [− 数量 +] =
     右列：Subtotal: 金额
           (VAT included £x.xx)
   → 右列两行天然左对齐，所以 "(" 和 "Subtotal" 的 S 永远在同一个 x 上（不需要任何魔法数字）。
   整块靠左对齐（右对齐会因为单价长短不一而参差不齐）。
   左列固定 152px：单价最长约 £1,199.70 也放得下，且保证每行的右列起点一致，行与行之间也对齐。 */
.lh-drawer__calc{display:grid;grid-template-columns:152px 1fr;column-gap:6px;align-items:start;margin-top:8px;font-size:11.5px;color:#241f1b}
.lh-drawer__calc-left{display:inline-flex;align-items:center;gap:3px;white-space:nowrap}
.lh-drawer__calc-right{display:flex;flex-direction:column;gap:2px;white-space:nowrap;min-width:0}
.lh-drawer__unit{color:#241f1b;font-variant-numeric:tabular-nums}
.lh-drawer__sign{color:#241f1b;line-height:1}
.lh-drawer__sub{font-size:11px;color:#241f1b}
.lh-drawer__line{font-size:12px;font-weight:700;color:#241f1b;font-variant-numeric:tabular-nums;margin-left:2px}
/* 第 3 行：(VAT included £x.xx) —— 棕色（= 页眉当前菜单项用的木色 var(--wood)） */
.lh-drawer__linevat{font-size:11px;color:var(--wood);font-variant-numeric:tabular-nums}

/* 数量加减框（数字可直接改，实时更新金额）
   ❗flex:0 0 auto 很关键：以前 .lh-qty / 输入框会被 flex 压缩，
   数量变成两位数时数字被裁掉，看起来像"被白色盖住"。 */
.lh-qty{flex:0 0 auto;display:inline-flex;align-items:center;height:28px;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#fff}
.lh-qty__btn{flex:0 0 auto;width:20px;height:26px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:#f7f4ef;color:#241f1b;font-size:14px;line-height:1;cursor:pointer}
.lh-qty__btn:hover{background:#efe9e1}
/* ❗选择器必须带 .lh-drawer：全站有一条
   input[type=number]{font-size:15px;padding:10px 12px;border-radius:10px}
   它的优先级 (0,1,1) 比 .lh-qty__input (0,1,0) 高，
   会把输入框左右各塞 12px 内距 → 可用宽度只剩 22px → 两位数就被裁掉（看起来像被白色盖住）。
   加上 .lh-drawer 前缀后优先级 (0,2,0) 稳压它。 */
.lh-drawer .lh-qty__input{flex:0 0 40px;width:40px;height:26px;padding:0 2px;border:0;border-left:1px solid var(--line);border-right:1px solid var(--line);border-radius:0;background:#fff;color:#241f1b;font-family:inherit;font-size:12px;text-align:center;font-variant-numeric:tabular-nums;-webkit-appearance:none;appearance:none;-moz-appearance:textfield}
.lh-drawer .lh-qty__input::-webkit-outer-spin-button,.lh-drawer .lh-qty__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* 3) 底部结算区：flex-shrink:0，永远贴在抽屉最底部 */
.lh-drawer__foot{flex:0 0 auto;padding:16px 20px 20px;border-top:1px solid var(--line);background:#fff}
/* 底部两行：grid 两列 —— 左列标签（宽度自动取最宽的那个），右列金额。
   金额紧跟在标签右边（不再用 space-between 把金额甩到最右边），且两行的金额天然左对齐。 */
.lh-drawer__sums{display:grid;grid-template-columns:auto 1fr;column-gap:8px;row-gap:4px;align-items:baseline;justify-items:start}
.lh-drawer__lbl{font-size:.95rem;color:#241f1b}
.lh-drawer__amt{font-size:.95rem;font-weight:700;color:#241f1b;font-variant-numeric:tabular-nums}
/* VAT 行：全站统一用棕色（var(--wood) = rgb(140,90,60)） */
.lh-drawer__lbl--vat{font-size:.85rem;color:var(--wood)}
.lh-drawer__amt--vat{font-size:.85rem;font-weight:600;color:var(--wood)}
.lh-drawer__buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.lh-drawer__buttons a{display:flex;align-items:center;justify-content:center;width:100%;height:48px;padding:0 12px;border:1.5px solid transparent;border-radius:10px;font-size:.88rem;font-weight:600;text-decoration:none}
/* ❗下面两条必须带 .lh-drawer__buttons 前缀：
   上面那条 .lh-drawer__buttons a 的优先级是 (0,1,1)，比 .lh-drawer__btn--view (0,1,0) 高，
   会把 border 一直压成 transparent → View Basket 根本没有黑边框。
   加前缀后变成 (0,2,0)，稳压它。 */
.lh-drawer__buttons .lh-drawer__btn--view{background:#fff;border:1.5px solid #241f1b;color:#241f1b}
.lh-drawer__buttons .lh-drawer__btn--view:hover{background:#241f1b;color:#fff}
.lh-drawer__buttons .lh-drawer__btn--checkout{background:#8c5a3c;border:1.5px solid #8c5a3c;color:#fff}
.lh-drawer__buttons .lh-drawer__btn--checkout:hover{background:var(--wood-dark);border-color:var(--wood-dark)}
/* 飞入动画的飞行体：48×48 圆形缩略图 */
.lh-fly{position:fixed;z-index:99999;border-radius:50%;object-fit:cover;pointer-events:none;box-shadow:0 6px 18px rgba(0,0,0,.18)}
/* 飞入落地后：购物车图标放大一下（0% 1.0 → 50% 1.2 → 100% 1.0，300ms）
   class 由 site.js 在落地时加上、300ms 后摘掉，防止重复触发 */
.cart-bounce{animation:cart-bounce .3s ease-out}
@keyframes cart-bounce{0%{transform:scale(1)}50%{transform:scale(1.2)}100%{transform:scale(1)}}
@media (max-width:921px){
  .site-header__burger{display:block;margin-left:auto}
  .site-header__search{display:none}
  /* 手机菜单：改成「右侧区打散 + 菜单占满一行」的行内展开（不用 position:absolute ✓） */
  .site-header__right{display:contents}
  .site-header__nav{order:9;flex-basis:100%;display:none;background:#fff;border-top:1px solid var(--line);padding:8px 20px 14px}
  .site-header__nav.is-open{display:block}
  .site-header__nav .nav{flex-direction:column;align-items:flex-start;gap:4px;height:auto}
  .site-header__nav .nav a{height:auto;padding:8px 0}
  .site-header__signin{display:none}
}
.lang select{height:36px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:13.5px;padding:0 8px;margin-left:10px}

/* --- 首页主视觉 --- */
.hero{background:var(--surface);border-bottom:1px solid var(--line)}
.hero__inner{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(20px,3vw,44px);align-items:center;padding:clamp(26px,4vw,54px) var(--pad)}
.hero__lead{font-size:17px;color:var(--muted);max-width:56ch}
.hero__cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.hero__media img{width:100%;height:auto;border-radius:var(--r-card);box-shadow:var(--shadow-m)}
.hero__media:empty{display:none}
@media (max-width:921px){ .hero__inner{grid-template-columns:1fr} }

.cols3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:14px}
@media (max-width:921px){ .cols3{grid-template-columns:1fr;gap:16px} }

/* --- 商品卡：促销角标 --- */
/* 促销角标已删除（旧站商品卡本来就没有这个角标 ✓ 顺带去掉一处 position:absolute ✓） */

/* --- 商店页工具条 --- */
.shop-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:6px 0 14px;font-size:14px}
.shop-bar p{margin:0}

/* --- 商品页补充 --- */
.pdp__gallery img{width:100%;height:auto}
.pdp__thumbs img.is-active{border-color:var(--wood)}
.pdp__excerpt{font-size:15px;color:var(--muted);margin:0 0 4px}
.pdp-sku{font-size:13px;margin-top:6px}
.pdp__info{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px);align-items:start}
.pdp__info h2{font-size:clamp(19px,2vw,24px)}
@media (max-width:921px){ .pdp__info{grid-template-columns:1fr} }

/* --- 内容页排版（配送/退换、隐私、条款这些文字页必须能读） --- */
.page__head{margin-bottom:8px}
.entry{font-size:16px;max-width:78ch}
.entry h2{font-size:clamp(20px,2.2vw,26px);margin:26px 0 10px}
.entry h3{font-size:17px;margin:20px 0 8px}
.entry ul,.entry ol{margin:0 0 14px;padding-left:22px;list-style:disc}
.entry ol{list-style:decimal}
.entry li{margin:5px 0}
.entry table{width:100%;border-collapse:collapse;margin:14px 0;font-size:15px}
.entry th,.entry td{border-bottom:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top}
.entry th{background:var(--surface);font-weight:600;width:34%}
.entry a{color:var(--wood);text-decoration:underline}
.entry blockquote{border-left:4px solid var(--wood);background:var(--surface);margin:16px 0;padding:10px 16px}

/* --- 博客列表 --- */
.post-list{display:grid;gap:26px;margin-top:18px}
.post-item{display:grid;grid-template-columns:280px 1fr;gap:20px;align-items:start}
.post-item__img img{border-radius:var(--r-card);width:100%;height:auto}
.post-item__title{font-size:20px;margin:0 0 4px}
@media (max-width:921px){ .post-item{grid-template-columns:1fr} }

/* --- 评价 --- */
.reviews__list{list-style:none;padding:0;margin:0}
.reviews__list .comment{border-top:1px solid var(--line);padding:16px 0}
.reviews__list .comment .children{list-style:none;padding-left:20px;margin:10px 0 0}
.reviews__list .avatar{border-radius:50%;float:left;margin-right:10px}
.reviews__list .comment-content{clear:none;margin-top:6px}
.reviews__list .star-rating{display:inline-block;color:#f5a623;font-size:15px}
.reviews__list .comment-metadata{font-size:12.5px;color:var(--muted)}

/* --- 表单（评论/结账/搜索都用得上；WC 自带样式已卸载，这里补上） --- */
input[type=text],input[type=email],input[type=tel],input[type=number],input[type=url],input[type=password],input[type=search],textarea,select{
  font-family:inherit;font-size:15px;color:var(--ink);background:#fff;border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;max-width:100%
}
input:focus,textarea:focus,select:focus{outline:2px solid rgba(140,90,60,.35);outline-offset:1px;border-color:var(--wood)}
textarea{width:100%;min-height:120px}
label{font-size:14px;font-weight:500}
.comment-form p{margin:0 0 12px}
.comment-form label{display:block;margin-bottom:4px}
.comment-form input[type=text],.comment-form input[type=email],.comment-form input[type=url]{width:100%;max-width:520px}
.comment-form .submit{display:inline-flex}

/* --- WooCommerce 提示条与经典表格（自带样式已卸载） --- */
.woocommerce-message,.woocommerce-info,.woocommerce-error,.woocommerce-noreviews{
  border:1px solid var(--line);border-left:4px solid var(--success);background:#fff;border-radius:12px;padding:12px 16px;margin:0 0 16px;font-size:15px;list-style:none
}
.woocommerce-info{border-left-color:var(--wood)}
.woocommerce-error{border-left-color:#c0392b}
.woocommerce-message .button,.woocommerce-info .button{float:right;margin-left:10px}
.shop_table{width:100%;border-collapse:collapse;font-size:15px;margin:0 0 20px}
.shop_table th,.shop_table td{border-bottom:1px solid var(--line);padding:12px 10px;text-align:left}
.shop_table thead th{background:var(--surface)}
.woocommerce-cart .cart-collaterals{margin-top:10px}
.woocommerce-cart .cart_totals{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);padding:18px}
.quantity input.qty{width:84px;text-align:center}
.screen-reader-text{ /* 样式已合并到上面 .sr-only 一行，此处不再重复定义 ✓ */ }

/* ==========================================================================
   9. 商店页两栏 + 左栏筛选（值全部照旧站实测：侧栏 280px / 圆角 16px / 1px 描边）
   ========================================================================== */
.lh-shop__wrap{display:grid;grid-template-columns:280px 1fr;gap:24px;align-items:start;margin-top:16px}
.lh-shop__main{min-width:0}

.lh-shop-side{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 18px}
.lh-shop-side__title{font-family:var(--serif);font-size:16.32px;font-weight:600;color:var(--ink);margin:0;padding:0 0 12px;border-bottom:1px solid var(--line)}
.lh-cat-tree{margin:12px 0 0}
.lh-cat-tree li{margin:0 0 2px}
.lh-cat-tree a{display:block;font-size:14.88px;color:#3b342e;border-radius:8px;padding:8px 10px}
.lh-cat-tree a:hover,.lh-cat-tree a.is-current{background:var(--surface);color:var(--ink)}

.lh-filter-section{border-top:2px solid var(--line);padding:20px 0 0;margin:22px 0 0}
.lh-filter-section__title{font-family:var(--serif);font-size:12.48px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted-2);margin:0 0 16px}
.lh-filter-group{margin:0 0 20px}
.lh-filter-title{font-family:var(--serif);font-size:15.2px;font-weight:600;color:var(--ink);margin:0 0 8px}
.lh-facet ul{display:grid;grid-template-columns:1fr 1fr;gap:2px 6px}
.lh-facet--color ul{grid-template-columns:repeat(3,1fr)}
.lh-facet li{font-size:14.08px}
.lh-facet a{display:flex;align-items:center;gap:6px;font-size:14.08px;color:var(--body);padding:3px 0}
.lh-facet a:hover{color:var(--wood)}
.lh-facet__box{width:13px;height:13px;border:1px solid var(--line);border-radius:3px;background:#fff;flex:0 0 auto}
.lh-facet a.is-on .lh-facet__box{background:var(--wood);border-color:var(--wood);box-shadow:inset 0 0 0 2px #fff}

/* 价格滑块：改用原生 input[type=range] + accent-color（不用 position:absolute ✓） */
.lh-price__slider{height:22px;margin:0}
.lh-price__input{display:block;width:100%;height:22px;margin:0;accent-color:var(--wood);cursor:pointer}
.lh-price__head{display:flex;justify-content:space-between;align-items:center;margin:8px 0 0;font-size:14.08px;color:var(--muted)}
.lh-price__amount{font-weight:600;color:var(--ink)}
.lh-clear{font-size:13px;color:var(--wood);text-decoration:underline}

.lh-shop-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 18px;flex-wrap:wrap}
.woocommerce-result-count{margin:0;font-size:14.08px;color:var(--muted)}
.woocommerce-ordering{margin:0}
.woocommerce-ordering select{height:38px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:#fff;font-size:14.08px;color:var(--ink)}
@media (max-width:921px){
  .lh-shop__wrap{grid-template-columns:1fr}
  .lh-shop-side{padding:16px 14px}
}

/* ==========================================================================
   10. 旧站复刻：页脚 / 首页区块 / 手机页眉（数值全部来自旧站实测，不自己发挥）
   ========================================================================== */

/* 页脚：深色 rgb(36,31,27)、内容宽 1140、桌面 4 栏 342+228+228+228、底部版权条左右两段 */
.site-footer{background:#241f1b;color:rgba(255,255,255,.88);font-size:15px;padding:52px 0 0;margin:0}
.site-footer__wrap{max-width:1140px;margin:0 auto;padding:0 18px 28px}
.site-footer__grid{display:grid;grid-template-columns:342px 228px 228px 228px;justify-content:space-between}
.site-footer__brand p{margin:0 0 6px}
.site-footer__name{color:#fff;font-weight:700;font-size:17px;margin:0 0 8px}
.site-footer__col .site-footer__h{margin:0 0 10px;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#fff;font-family:var(--font)}
.site-footer__col ul{margin:0;padding:0;list-style:none}
.site-footer__col li{margin:0 0 6px}
.site-footer a{color:rgba(255,255,255,.88)}
.site-footer a:hover{color:#fff;text-decoration:underline}
.site-footer__bar{border-top:1px solid rgba(255,255,255,.2);padding:16px 0}
.site-footer__bar .site-footer__wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-bottom:0}
.site-footer__bar p{margin:0;font-size:13px;color:rgba(255,255,255,.8)}

/* 首页：主视觉 + 信任条 */
.lh-hero__inner{display:grid;grid-template-columns:1fr 498px;gap:40px;align-items:center;padding:56px 20px 40px}
.lh-hero h1{font-size:52px;font-weight:700;line-height:1.08;margin:0 0 14px;color:var(--ink);font-family:var(--font)}
.lh-hero p{font-size:17px;color:var(--muted);max-width:52ch}
.lh-hero__btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.lh-hero__media img{width:100%;height:auto;display:block}
.lh-trust{background:var(--ink);color:#fff;padding:16px 0}
.lh-trust ul{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.lh-trust li{display:flex;flex-direction:column;font-size:13.5px}
.lh-trust span{color:rgba(255,255,255,.72);font-size:12.5px}

/* 首页区块：Most popular / Shop by need / Why they fit / CTA */
.lh-sec{padding:64px 0}
.lh-sec--alt{background:#faf8f5}
.lh-eyebrow{font-size:12.48px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted-2);font-weight:600;margin:0 0 8px;font-family:var(--serif)}
.lh-sec h2{font-size:32px;font-weight:700;margin:0 0 10px;color:var(--ink);font-family:var(--font)}
.lh-lead{font-size:16px;color:var(--muted);margin:0 0 26px;max-width:70ch}
.lh-products{margin-bottom:26px}
.lh-cats{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.lh-cat{display:block;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.lh-cat img{width:100%;height:230px;object-fit:cover;display:block}
.lh-cat__body{display:flex;flex-direction:column;gap:4px;padding:16px 18px 18px}
.lh-cat__body strong{font-size:17px;color:var(--ink)}
.lh-cat__sub{font-size:15px;color:var(--muted)}
.lh-cat__go{color:var(--wood);font-weight:600;font-size:15px;margin-top:6px}
.lh-fit{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.lh-fit h3{font-size:17px;font-weight:600;margin:0 0 8px;color:var(--ink)}
.lh-fit p{font-size:15px;color:var(--muted)}
.lh-cta{padding:56px 0 64px;text-align:center}
.lh-cta h2{font-size:32px;font-weight:700;margin:0 0 10px}
.lh-cta p{font-size:16px;color:var(--muted);margin:0 0 18px}

/* 手机端：页脚 2 栏 + 首页字号缩小 + 页眉 80px（logo 67×58、购物车 49×49、汉堡 44×44、左右 20px） */
@media (max-width:921px){
  .site-footer{padding:26px 0 0}
  .site-footer__grid{grid-template-columns:1fr 1fr;gap:18px 12px}
  .site-footer__brand{grid-column:1 / -1}
  .site-footer__bar .site-footer__wrap{flex-direction:column;gap:6px}
  .lh-hero__inner{grid-template-columns:1fr;gap:22px;padding:36px 18px 26px}
  .lh-hero h1{font-size:30px}
  .lh-sec{padding:36px 0}
  .lh-sec h2,.lh-cta h2{font-size:22px}
  .lh-cats{grid-template-columns:1fr}
  .lh-fit{grid-template-columns:1fr;gap:18px}
  .lh-trust ul{grid-template-columns:1fr 1fr}
  .site-header__inner{min-height:80px;gap:12px;padding:0 20px}
  .site-header__brand img{width:67px;height:58px}
  .site-header__cart{margin-left:auto}
  .site-header__cart-icon{width:49px;height:49px}
  .site-header__count{min-width:16px;height:16px;font-size:10px;padding:0 4px}
  .site-header__burger{width:44px;height:44px;margin-left:8px;display:flex;align-items:center;justify-content:center}
  .site-header__nav{top:80px}
}

/* ==========================================================================
   本轮改动：页眉 hover 放大 / 商品卡排版 / 筛选器 / 工具栏分界线 / 面包屑与标题
   （放在文件最后，同优先级时覆盖前面的规则）
   ========================================================================== */

/* ① 页眉：菜单项 和 Sign in ——— 鼠标放上去放大 + 变棕 */
.site-header__nav .nav > li > a,
.site-header__signin{transition:transform .16s ease-out,color .16s ease-out}
.site-header__nav .nav > li > a:hover,
.site-header__signin:hover{transform:scale(1.08);color:var(--wood)}

/* ② 购物车 + 金额 是一个整体：hover 时一起变棕、一起放大 */
.site-header__cartgroup{transition:transform .16s ease-out}
.site-header__cartgroup:hover{transform:scale(1.08)}
.site-header__cartgroup:hover .site-header__cart,
.site-header__cartgroup:hover .site-header__total,
.site-header__cartgroup:hover .site-header__total .amount{color:var(--wood)}

/* ③ 加购成功后不再显示 "View basket" 链接（有飞入动画就够，不需要这行字） */
.added_to_cart{display:none}

/* ④ 工具栏（Showing … results + 排序框）下面加一条分界线 —— 全站。
   结果条和排序框【底部对齐】，两者底边与分界线顶边的间距正好 4px（内部 margin 全部清零，不留额外空隙） */
.lh-shop-bar{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;padding-bottom:4px;margin:0 0 18px;border-bottom:1px solid var(--line)}
.lh-shop-bar .woocommerce-result-count{margin:0}
.lh-shop-bar .woocommerce-ordering{margin:0}
.lh-shop-bar .woocommerce-ordering select{margin:0;vertical-align:bottom}

/* ⑤ 商品卡排版：
      图 → 标题 → 星级
      →（左：单价 上 / (includes VAT) 下  ｜ 右：数量下拉）
      →（左：Add to Basket            ｜ 右：Buy Now）
   用 grid + display:contents，把 <form> 里的节点提到卡片网格里，和价格排进同一网格 */
ul.products li.product{display:grid;grid-template-columns:1fr 1fr;column-gap:8px;row-gap:6px;align-items:start}
ul.products li.product .card__media,
ul.products li.product .card__title,
ul.products li.product .card__rating{grid-column:1 / -1}
/* 第三行：左半栏 = 单价 / (VAT includes £xx) 两行，在该栏（= Add to Basket 的宽度）里居中；
            右半栏 = 数量选择器，在该栏（= Buy Now 的宽度）里居中 */
ul.products li.product .card__price{grid-column:1;grid-row:4;display:flex;flex-direction:column;align-items:center;text-align:center;gap:0}
ul.products li.product .card__price .card__vat{display:block}
ul.products li.product .card__buy,
ul.products li.product .card__row,
ul.products li.product .card__actions{display:contents}
ul.products li.product .card__qty{grid-column:2;grid-row:4;justify-self:center;align-self:center}
ul.products li.product .card__actions .add_to_cart_button{grid-column:1;grid-row:5}
ul.products li.product .card__actions .lh-buy-now{grid-column:2;grid-row:5}
ul.products li.product .card__actions .btn{width:100%;margin:0}
/* 数量选择器：自建下拉（原生 <select> 的下拉高度浏览器不给 CSS 控制，
   只有自建才能保证"任何浏览器都只显示 5 行 + 内部滚动"）。
   原生 select 保留在 DOM 里（display:none，仍随表单提交），自建下拉把值写回它。
   浮层列表用 position:absolute —— 与已批准的迷你购物车浮层同一性质（本质要盖在内容之上），
   布局本身仍然是 grid，没有用绝对定位去凑像素。 */
ul.products li.product .card__qty select{display:none}
.lh-dd{position:relative;display:inline-block}
.lh-dd__btn{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;height:30px;min-width:56px;padding:0 8px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);font-size:13px;font-family:inherit;cursor:pointer}
.lh-dd__btn:hover{border-color:rgb(209,213,219)}
.lh-dd__btn::after{content:"";width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid var(--muted-2)}
.lh-dd__menu{position:absolute;top:calc(100% + 4px);left:0;z-index:20;min-width:100%;max-height:calc(5 * 28px + 2px);overflow-y:auto;padding:0;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,.14)}
.lh-dd__menu[hidden]{display:none}
.lh-dd__opt{height:28px;line-height:28px;padding:0 10px;font-size:13px;color:var(--ink);cursor:pointer;white-space:nowrap}
.lh-dd__opt:hover{background:#f7f4ef}
.lh-dd__opt[aria-selected="true"]{color:var(--wood);font-weight:600}

/* ⑦ 左侧筛选栏的三个分组标题：文字下方加一条浅灰下划线，更像区块标题 */
.lh-shop-side .lh-filter-title{border-bottom:1px solid var(--line);padding-bottom:6px}

/* ⑥ shop / 分类页：去掉面包屑下面那个大标题，内容紧贴面包屑（4px）
   注意还要清掉 .lh-shop__wrap 自带的 margin-top:16px，否则间距会是 20px */
.post-type-archive-product .lh-shop > .container > h1,
.tax-product_cat .lh-shop > .container > h1{display:none}
.post-type-archive-product .lh-shop,
.tax-product_cat .lh-shop{padding-top:4px}
.post-type-archive-product .lh-shop__wrap,
.tax-product_cat .lh-shop__wrap{margin-top:0}

