/* ============================================================
   LoveyDovey · 效果图对齐补丁 v1（2026-11-06）
   作者：段式明（前端排版）
   依据：老板提供 PC 效果图 1440 画板 + 移动效果图 390 画板
   覆盖：公告条 / 页头（导航胶囊、工具胶囊、搜索）/ 桌面 Hero / 移动 Hero
   加载：header.php 内 wp_head() 之后，必须最后加载
   回滚：删除 header.php 里对应的 <link> 一行即可，无其它文件依赖
   ============================================================ */

:root{
  --ldf-wine:#2b0612;
  --ldf-wine-deep:#1b0705;
  --ldf-gold:#d8b56c;
  --ldf-gold-lt:#f0d9a8;
  --ldf-cream:#f7efe6;
  --ldf-line:rgba(216,181,108,.38);
}

/* ── 1. 公告条 ─────────────────────────────────────────────
   原样式：粉紫渐变 + 顶部花纹 SVG，与酒红主色不搭
   新样式：效果图的深酒红平底、单行居中、价格金色       */
html body .notice{
  background:var(--ldf-wine-deep)!important;
  background-image:none!important;
  height:40px!important;min-height:40px!important;
  padding:0 24px!important;
  border-bottom:1px solid rgba(216,181,108,.16)!important;
  color:#efe0cd!important;
  font-size:13px!important;
  letter-spacing:.02em!important;
  justify-content:center!important;
}
html body .notice .notice-copy{gap:12px!important;white-space:nowrap!important}
html body .notice .notice-gift,
html body .notice .notice-divider{display:none!important}
html body .notice .notice-shipping strong{color:var(--ldf-gold)!important;font-weight:600!important}
html body .notice .notice-truck{width:20px!important;height:20px!important;flex:0 0 20px!important}

/* ── 2. 页头（≥1101px） ────────────────────────────────────
   原样式：118/104px 高、导航 11px 下划线激活、右上 38px 无字圆形图标
   新样式：92px 高、导航 15px 金色实心胶囊激活、工具组带文字描边胶囊 */
@media (min-width:1024px){
  html body .head{
    background-image:linear-gradient(180deg,#33070f 0%,#26030c 100%)!important;
    background-color:#2b0612!important;
    /* 旧版 .head 有 min-height:132px，而 .headrow 已收到 92px（+公告条 40px = 132px）。
       两者不匹配导致页头底部空出 40px 无内容的死带（效果图里页头紧贴 Hero）。
       这里让 .head 完全由 .headrow 撑开，高度自动等于 92px。 */
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    padding-bottom:0!important;
  }
  html body .head .headrow.headrow{
    height:92px!important;min-height:92px!important;
    grid-template-columns:minmax(170px,205px) max-content minmax(150px,1fr) auto!important;
    grid-template-rows:92px!important;grid-template-areas:none!important;
    grid-auto-rows:0!important;
    gap:12px!important;padding:0 24px!important;align-items:center!important;
  }
  /* 旧规则把搜索框固定在「第 2 行第 2 列」，导致四件套换行；这里全部显式定位回单行 */
  html body .head .headrow.headrow > .brand{grid-column:1!important;grid-row:1!important}
  html body .head .headrow.headrow > .nav{grid-column:2!important;grid-row:1!important}
  html body .head .headrow.headrow > .head-search{grid-column:3!important;grid-row:1!important}
  html body .head .headrow.headrow > .actions{grid-column:4!important;grid-row:1!important;flex-wrap:nowrap!important}
  html body .head .brand{height:74px!important;display:flex!important;align-items:center!important}
  html body .head .brand img{max-height:74px!important;width:auto!important}

  /* 导航：效果图是「图标在上、文字在下」的两行竖排，只有 Shop 带红渐变圆角框 */
  html body .head .nav{gap:2px!important;align-items:center!important}
  html body .head .nav a{
    display:flex!important;flex-direction:column!important;
    align-items:center!important;justify-content:center!important;
    gap:5px!important;
    height:60px!important;min-height:60px!important;
    padding:0 13px!important;
    font-size:15px!important;font-weight:500!important;line-height:1!important;
    letter-spacing:.01em!important;text-transform:none!important;
    color:var(--ldf-cream)!important;
    border:1px solid transparent!important;border-radius:13px!important;
    background:transparent!important;box-shadow:none!important;text-shadow:none!important;
    transform:none!important;
  }
  html body .head .nav a img{width:21px!important;height:21px!important;flex:0 0 21px!important}
  /* 旧设计在导航项上留了一个 7×7 金色装饰块（::after），会压住文字，隐藏 */
  html body .head .nav a::after{display:none!important}
  html body .head .nav a:hover,
  html body .head .nav a:focus-visible{
    background:rgba(216,181,108,.09)!important;
    border-color:var(--ldf-line)!important;
    color:#fff!important;box-shadow:none!important;transform:none!important;
  }
  /* 激活项（Shop）：红渐变圆角框 + 金描边 + 白字，图标保持金色 */
  html body .head .nav a.is-active,
  html body .head .nav a[aria-current="page"]{
    background:linear-gradient(180deg,#b22346 0%,#8c1734 50%,#620f25 100%)!important;
    border:1px solid rgba(226,192,120,.6)!important;
    border-radius:13px!important;
    color:#fff!important;-webkit-text-fill-color:#fff!important;
    padding:0 22px!important;
    text-shadow:none!important;
    box-shadow:0 6px 18px rgba(150,20,50,.42),inset 0 1px 0 rgba(255,255,255,.14)!important;
  }
  html body .head .nav a.is-active img,
  html body .head .nav a[aria-current="page"] img{filter:none!important}

  /* 工具组：圆形图标 → 带文字描边胶囊（Email us / Log in / English / Bag (0)）
     旧样式把 .actions 锁在 max-width:168px，四枚胶囊于是挤成一团、最右侧被切出屏幕 */
  html body .head .actions{
    gap:8px!important;
    max-width:none!important;width:max-content!important;flex-wrap:nowrap!important;
  }
  html body .head .header-pill,
  html body .head .header-lang{
    display:inline-flex!important;align-items:center!important;justify-content:center!important;
    gap:7px!important;width:auto!important;
    height:44px!important;min-height:44px!important;
    padding:0 15px!important;
    border:1px solid var(--ldf-line)!important;border-radius:999px!important;
    background:rgba(255,255,255,.02)!important;
    color:var(--ldf-cream)!important;
    font-size:13px!important;letter-spacing:.01em!important;
    text-transform:none!important;white-space:nowrap!important;
  }
  html body .head .header-pill span,
  html body .head .header-lang span{display:inline!important;font-size:13px!important}
  /* 三个图标按钮被 ld-theme 的 .header-pill.header-* 定死成 38/42/48px 圆形，这里按同等权重改回带字胶囊 */
  html body .head .header-pill.header-email,
  html body .head .header-pill.header-login,
  html body .head .header-pill.header-bag{
    width:auto!important;height:44px!important;min-height:44px!important;
    padding:0 15px!important;border-radius:999px!important;
    display:inline-flex!important;place-items:center!important;position:relative!important;
  }
  html body .head .header-pill svg,
  html body .head .header-lang svg{
    width:17px!important;height:17px!important;flex:0 0 17px!important;color:var(--ldf-gold)!important;
  }
  html body .head .header-lang i{font-style:normal!important;color:var(--ldf-gold)!important;font-size:12px!important}
  /* 购物袋：数量文字原先被裁成 19px 宽，只露出图标；恢复 "Bag 0" 全称 */
  html body .head .header-bag span{
    display:inline!important;width:auto!important;max-width:none!important;
    position:static!important;left:auto!important;right:auto!important;
    overflow:visible!important;font-size:13px!important;white-space:nowrap!important;
    color:var(--ldf-cream)!important;-webkit-text-fill-color:var(--ldf-cream)!important;
  }
  html body .head .header-bag span b{
    display:inline!important;position:static!important;inset:auto!important;
    width:auto!important;height:auto!important;min-width:0!important;
    background:none!important;box-shadow:none!important;
    color:var(--ldf-cream)!important;-webkit-text-fill-color:var(--ldf-cream)!important;
    font-size:13px!important;font-weight:600!important;line-height:1.2!important;
    letter-spacing:0!important;margin:0!important;padding:0!important;
  }
  html body .head .header-pill.header-bag{min-width:112px!important;white-space:nowrap!important}
  html body .head .header-bag b{font-variant-numeric:tabular-nums;font-weight:600}

  /* 搜索：44px 高胶囊，宽度交给 1fr，不再固定占掉半行 */
  html body .head .head-search{
    height:44px!important;min-height:44px!important;
    max-width:440px!important;justify-self:center!important;
    border-radius:999px!important;
  }
  html body .head .head-search input{font-size:14px!important;min-width:0!important}
  html body .head .head-search button{width:30px!important;height:30px!important}
}

/* 1024–1199：窄屏笔记本 —— 四枚带字胶囊 + 全量导航已用尽 976px 横向预算，
   搜索框在这一档收起（≥1200px 恢复），改为三列单行，杜绝右侧被切 */
@media (min-width:1024px) and (max-width:1199px){
  html body .head .headrow.headrow{
    grid-template-columns:minmax(140px,175px) max-content 1fr!important;
  }
  html body .head .headrow.headrow > .head-search{display:none!important}
  html body .head .headrow.headrow > .actions{
    grid-column:3!important;grid-row:1!important;justify-self:end!important;flex-wrap:nowrap!important;
  }
  html body .head .nav a{font-size:12.5px!important;padding:0 9px!important;height:56px!important;min-height:56px!important}
  html body .head .nav a img{width:17px!important;height:17px!important;flex:0 0 17px!important}
  html body .head .nav a.is-active,
  html body .head .nav a[aria-current="page"]{padding:0 13px!important}
  html body .head .header-pill.header-email,
  html body .head .header-pill.header-login,
  html body .head .header-pill.header-bag,
  html body .head .header-lang{
    height:40px!important;min-height:40px!important;padding:0 12px!important;gap:6px!important;
  }
  html body .head .header-pill span,
  html body .head .header-bag span,
  html body .head .header-bag span b,
  html body .head .header-lang span{font-size:12px!important}
  html body .head .header-pill svg,
  html body .head .header-lang svg{width:15px!important;height:15px!important;flex:0 0 15px!important}
  html body .head .header-pill.header-bag{min-width:104px!important;white-space:nowrap!important}
}

/* 1200–1365：搜索框回归，但导航与工具组各降一档，保证 1fr 搜索仍有 ≥170px */
@media (min-width:1200px) and (max-width:1365px){
  html body .head .headrow.headrow{
    grid-template-columns:minmax(160px,190px) max-content minmax(150px,1fr) max-content!important;
  }
  html body .head .nav a{font-size:13px!important;padding:0 11px!important}
  html body .head .nav a img{width:18px!important;height:18px!important;flex:0 0 18px!important}
  html body .head .nav a.is-active,
  html body .head .nav a[aria-current="page"]{padding:0 15px!important}
  /* Email us 收成图标圆钮，把宽度让给搜索 */
  html body .head .header-pill.header-email{width:44px!important;padding:0!important}
  html body .head .header-pill.header-email span{display:none!important}
  html body .head .header-pill.header-login,
  html body .head .header-pill.header-bag,
  html body .head .header-lang{height:42px!important;min-height:42px!important;padding:0 12px!important;gap:6px!important}
  html body .head .header-pill span,
  html body .head .header-bag span,
  html body .head .header-bag span b,
  html body .head .header-lang span{font-size:12px!important}
  html body .head .header-pill svg,
  html body .head .header-lang svg{width:16px!important;height:16px!important;flex:0 0 16px!important}
}

/* ── 3. 桌面 Hero（≥1101px） ───────────────────────────────
   原样式：112px 巨标题、粉色渐变 "yourself."、CTA 68px 高、
           信任行与收尾标语被 mobile-final.css 的 !important 隐藏
   新样式：80px 标题、象牙白斜体 + 心形花饰、52px CTA、
           信任行回到文案列内、收尾标语回到 Hero 底部居中      */
@media (min-width:1024px){
  /* 前景人物图 hero-fg-clean5.webp 是「左半边空白 + 右侧人物」的整幅构图。
     旧样式 object-position:left center 等于只显示空白那半幅；而且 cover 会按
     Hero 高度放大 1.14 倍，人物占到 73% 宽、压住文案。
     这里：右对齐 + 等比缩到 0.78 并锚定右下 —— 人物约占 45% 宽，与效果图一致。 */
  html body .ld-pc-hero .ld-woman{
    object-position:100% 50%!important;
    transform:scale(.78)!important;
    transform-origin:100% 100%!important;
  }
  html body .ld-pc-hero .ld-bed{object-position:50% 50%!important}

  /* 视口越窄，文案列占比越大：人物再往下缩档，避免正文压在人物身上 */
  @media (max-width:1279px){
    html body .ld-pc-hero .ld-woman{transform:scale(.72)!important}
  }
  @media (max-width:1099px){
    html body .ld-pc-hero .ld-woman{transform:scale(.64)!important}
  }
  html body .ld-pc-hero{
    height:clamp(600px,calc(100vh - 132px),820px)!important;
    min-height:600px!important;
  }
  html body .ld-pc-copy{
    left:14.5%!important;top:8%!important;
    width:min(700px,58%)!important;
    z-index:4!important;
  }
  html body .ld-pc-copy .ld-eyebrow{
    font-size:14px!important;letter-spacing:.24em!important;color:var(--ldf-gold)!important;
  }
  /* 标题字号整体上调一档：1440 下 83.5px → 109px，文案块高度 409 → 约 510，
     正好填满 Hero 左侧栏，底边与收尾标语（bottom:72px）仍留 60px 呼吸 */
  html body .ld-pc-copy h1{
    margin:22px 0 20px!important;
    font-size:clamp(72px,7.6vw,128px)!important;
    line-height:1.02!important;letter-spacing:-.022em!important;
    background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;
    -webkit-text-fill-color:#f7efe6!important;color:#f7efe6!important;
    max-width:680px!important;
  }
  /* "yourself."：效果图是象牙白斜体，不是玫粉渐变 */
  html body .ld-pc-copy h1 em{
    display:block!important;
    font-style:italic!important;font-weight:400!important;
    font-size:1.02em!important;line-height:.95!important;
    background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;
    -webkit-text-fill-color:#f3e2cb!important;color:#f3e2cb!important;
  }
  /* 句尾金色心形花饰（效果图 "yourself." 后的小爱心） */
  html body .ld-pc-copy h1 em::after{
    content:"";display:inline-block;
    width:.62em;height:.34em;margin-left:.12em;
    vertical-align:baseline;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 28' fill='none' stroke='%23d8b56c' stroke-width='1.7'%3E%3Cpath d='M24 24C14 17 8 13.5 8 8.8A6.2 6.2 0 0 1 24 6.6 6.2 6.2 0 0 1 40 8.8c0 4.7-6 8.2-16 15.2Z'/%3E%3C/svg%3E") no-repeat center/contain;
  }
  html body .ld-pc-copy>p{
    font-size:19px!important;line-height:1.66!important;
    max-width:580px!important;color:#efe0cd!important;
  }
  /* 效果图的首句独占一行，正文从下一行开始 */
  html body .ld-pc-copy>p strong{display:block!important;font-weight:600!important;color:#fff4df!important;margin-bottom:2px!important}
  html body .ld-pc-actions{margin-top:28px!important;gap:16px!important}
  html body .ld-btn{
    min-height:62px!important;padding:0 32px!important;
    font-size:17px!important;gap:11px!important;
  }
  html body .ld-btn b{font-size:21px!important}

  /* 信任行：跟随文案列（效果图在双 CTA 正下方）
     字号只放大到 13.5px —— 再大第三项 "Real human support" 会压到人物肩颈的亮部，
     另外补一层暗色投影，保证叠在皮肤/发丝上也读得清 */
  html body .ld-pc-copy .ld-pc-trust{
    display:flex!important;margin-top:28px!important;
    gap:15px!important;
    font-size:13.5px!important;letter-spacing:.02em!important;
    text-transform:none!important;
    color:#f0ddc6!important;
    text-shadow:0 1px 4px rgba(27,7,5,.85),0 0 12px rgba(27,7,5,.55)!important;
  }
  html body .ld-pc-copy .ld-pc-trust svg{width:19px!important;height:19px!important;flex:0 0 19px!important;color:var(--ldf-gold)!important;filter:drop-shadow(0 1px 3px rgba(27,7,5,.8))!important}
  html body .ld-pc-copy .ld-pc-trust i{width:1px!important;height:15px!important;background:rgba(216,181,108,.4)!important}

  /* 1024–1279 窄屏笔记本：这一档人物图缩得比大屏小、往左压得更多，
     整套放大的字号会让第二个 CTA 直接盖在脸上。整体降一档，
     保证按钮右边界与信任行都停在人物轮廓左侧。 */
  @media (max-width:1279px){
    html body .ld-pc-copy h1{font-size:clamp(62px,6.55vw,88px)!important;margin:18px 0 16px!important}
    html body .ld-pc-copy .ld-eyebrow{font-size:12.5px!important}
    html body .ld-pc-copy>p{font-size:17px!important;max-width:500px!important}
    html body .ld-pc-actions{margin-top:24px!important;gap:14px!important}
    html body .ld-btn{min-height:54px!important;padding:0 22px!important;font-size:15px!important;gap:9px!important}
    html body .ld-btn b{font-size:19px!important}
    html body .ld-pc-copy .ld-pc-trust{margin-top:24px!important;gap:12px!important;font-size:12.5px!important}
    html body .ld-pc-copy .ld-pc-trust svg{width:17px!important;height:17px!important;flex:0 0 17px!important}
    html body .ld-pc-copy .ld-pc-trust i{height:13px!important}
  }

  /* 收尾标语：回到 Hero 底部居中（覆盖 mobile-final 的 display:none!important） */
  html body .ld-pc-hero .ld-pc-bottom{
    display:flex!important;position:absolute!important;
    left:0!important;right:0!important;bottom:72px!important;
    max-width:none!important;z-index:4!important;
    align-items:center!important;gap:6px!important;
  }
  /* 人物图缩到右侧后，收尾标语会落在她的身体上；补一层柔和暗场把它托起来 */
  html body .ld-pc-hero .ld-pc-bottom::before{
    content:"";position:absolute;left:50%!important;transform:translateX(-50%)!important;
    bottom:-72px!important;width:min(1000px,86vw)!important;height:220px!important;
    background:radial-gradient(58% 100% at 50% 100%,rgba(16,3,7,.86) 0%,rgba(16,3,7,.62) 42%,rgba(16,3,7,0) 100%)!important;
    z-index:-1!important;pointer-events:none!important;
  }
  html body .ld-pc-human p{text-shadow:0 2px 20px rgba(14,2,6,.75),0 1px 4px rgba(14,2,6,.7)}
  html body .ld-pc-bottom .ld-pc-human{width:100%!important;text-align:center!important;color:var(--ldf-cream)!important}
  html body .ld-pc-human>span{
    justify-content:center!important;
    font-size:10px!important;letter-spacing:.26em!important;color:var(--ldf-gold)!important;
  }
  html body .ld-pc-human>span i{width:44px!important;background:linear-gradient(90deg,transparent,rgba(216,181,108,.75))!important}
  html body .ld-pc-human>span i:last-child{background:linear-gradient(90deg,rgba(216,181,108,.75),transparent)!important}
  html body .ld-pc-human p{
    font-size:clamp(20px,2.1vw,30px)!important;line-height:1.2!important;
    margin-top:8px!important;color:var(--ldf-cream)!important;
  }
  /* 效果图里 "journey" 是浅金手写体，不是粉色斜体 */
  html body .ld-pc-human em{
    font-family:'Great Vibes',cursive!important;font-style:normal!important;
    font-size:1.32em!important;line-height:1!important;color:#f4dcae!important;
  }
}

/* ── 4. 移动 Hero（≤900px） ────────────────────────────────
   M1 页头两枚图标：白描边 1.35px → 古金 2px 圆头描边
   M2 Shop Now：米白描边 → 古金描边 + 字距 .14em + 金幕扫光 3.2s
   M3 免邮条：DM Sans 白字 → 衬线 16.5px 古金字，金额提亮        */
@keyframes ld-shop-sweep{
  0%{transform:translate3d(-165%,0,0) skewX(-18deg)}
  52%{transform:translate3d(310%,0,0) skewX(-18deg)}
  100%{transform:translate3d(310%,0,0) skewX(-18deg)}
}

@media (max-width:900px){

  /* M1 ── 只动「账户」「购物袋」两枚，汉堡与 logo 不碰。
     白色重影的根因：这个位置被叠了两层 ——
       ① mobile-final.css:230/231 垫了一张奶白色 PNG（mobile-account-white.png，26px）
       ② 同文件 257 行又把内联 SVG 撑成 28px、2px 白描边
     两者尺寸差 2px，金色那层压不住白的那层，边缘就露白。
     做法：背景图直接换成「金色矢量 data-URI」，DOM 里的 SVG 显式关掉，
     保证这个位置永远只有一层金色线条，不会再出现重影。 */
  html body .head .headrow .header-login,
  html body .head .headrow .header-bag{
    background-color:transparent!important;
    background-repeat:no-repeat!important;
    background-position:center center!important;
    background-size:26px 26px!important;
    /* 原有 drop-shadow(0 2px 5px #0008) 会让金线发虚，去掉 */
    filter:none!important;
  }
  html body .head .headrow .header-login{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d8b56c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4 4-7 8-7s8 3 8 7'/%3E%3C/svg%3E")!important;
  }
  html body .head .headrow .header-bag{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d8b56c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8h12l1 13H5L6 8Z'/%3E%3Cpath d='M9 8V6a3 3 0 0 1 6 0v2'/%3E%3C/svg%3E")!important;
  }
  /* 内联 SVG 关掉，避免和上面的金色背景图再叠成双层 */
  html body .head .headrow .header-login svg,
  html body .head .headrow .header-bag svg{
    display:none!important;
  }
  /* 按压反馈：换成浅金矢量，保持同一套图层逻辑 */
  html body .head .headrow .header-login:active{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f0d9a8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4 4-7 8-7s8 3 8 7'/%3E%3C/svg%3E")!important;
  }
  html body .head .headrow .header-bag:active{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f0d9a8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8h12l1 13H5L6 8Z'/%3E%3Cpath d='M9 8V6a3 3 0 0 1 6 0v2'/%3E%3C/svg%3E")!important;
  }

  /* M2 ── Shop Now：金幕扫光（内掠光，克制）
     真机（iOS Safari）看不到扫光的两个原因，都已拆掉：
     ① 原实现给按钮挂了 backdrop-filter —— Safari 会把它提升成独立合成层，
        层内再用 left 做动画不会触发重绘，光带等于不画。这里改用 rgba 底 + 内阴影模拟玻璃感。
     ② 动画属性是 left（CPU 布局），改为 translate3d + will-change，走 GPU 合成，真机稳定。
     顺带把峰值亮度提上来，保证在 375~430px 的小屏上也看得清。 */
  html body .ld-m-btn-shop{
    position:absolute!important;
    left:11%!important;right:11%!important;width:78%!important;
    bottom:20px!important;height:56px!important;
    font-size:18px!important;font-weight:500!important;letter-spacing:.14em!important;
    background:linear-gradient(180deg,rgba(48,12,24,.62) 0%,rgba(26,7,16,.52) 100%)!important;
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
    border:1.5px solid rgba(216,181,108,.78)!important;
    border-radius:999px!important;color:#fdf3e0!important;
    box-shadow:0 6px 18px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.07)!important;
    overflow:hidden!important;
    isolation:isolate!important;
  }
  /* 文字压在光带之上，扫光只做背景掠动 */
  html body .ld-m-btn-shop span,
  html body .ld-m-btn-shop b{position:relative!important;z-index:2!important}
  html body .ld-m-btn-shop b{font-size:0!important}
  html body .ld-m-btn-shop b::after{
    content:"\2192";font:400 22px/1 Arial,sans-serif!important;
  }
  html body .ld-m-btn-shop::after{
    content:"";position:absolute!important;top:-2px!important;bottom:-2px!important;left:0!important;
    width:42%!important;z-index:1!important;
    background:linear-gradient(105deg,
      rgba(255,232,176,0) 0%,
      rgba(255,236,188,.34) 38%,
      rgba(255,248,224,.78) 50%,
      rgba(255,236,188,.34) 62%,
      rgba(255,232,176,0) 100%)!important;
    transform:translate3d(-165%,0,0) skewX(-18deg);
    animation:ld-shop-sweep 2.6s cubic-bezier(.38,0,.2,1) infinite!important;
    will-change:transform!important;
    pointer-events:none!important;
    backface-visibility:hidden!important;
  }

  /* M3 ── 免邮条：衬线杂志感 */
  html body .ld-m-shipping{
    height:68px!important;
    background:#1b0705!important;
    border-top:1px solid rgba(216,181,108,.35)!important;
    border-bottom:0!important;
    color:var(--ldf-gold)!important;
    font-family:'Cormorant Garamond',Georgia,'Times New Roman',serif!important;
    font-size:16.5px!important;font-weight:500!important;letter-spacing:.05em!important;
    gap:12px!important;
  }
  html body .ld-m-shipping span{
    color:var(--ldf-gold)!important;
    font-family:inherit!important;font-size:16.5px!important;
    font-weight:500!important;letter-spacing:.05em!important;
  }
  html body .ld-m-shipping b,
  html body .ld-m-shipping strong{color:#f0d9a8!important;font-weight:600!important}
  html body .ld-m-shipping svg{
    width:22px!important;height:22px!important;flex:0 0 22px!important;
    color:var(--ldf-gold)!important;
    stroke:var(--ldf-gold)!important;stroke-width:1.4!important;
  }
  html body .ld-m-shipping svg *{stroke:var(--ldf-gold)!important;fill:none!important}
}

/* 平板档：衬线字号抬到 18px，与小标题层级对齐 */
@media (min-width:768px) and (max-width:900px){
  html body .ld-m-shipping,
  html body .ld-m-shipping span{font-size:18px!important}
}

/* 减弱动态偏好：不能直接关掉扫光。
   iPhone「设置 → 辅助功能 → 动态效果 → 减弱动态效果」一旦开启，这里原来写的是
   animation:none + display:none，等于真机上彻底看不到金幕 —— 而桌面浏览器不触发
   这个媒体查询，所以电脑模拟一切正常。这就是「电脑能看到、真机看不到」的头号原因。
   改成放慢 + 减弱，既尊重无障碍也不牺牲效果。 */
@media (prefers-reduced-motion:reduce){
  html body .ld-m-btn-shop::after{
    display:block!important;
    opacity:.72!important;
    animation-duration:7s!important;
  }
}


/* ==================================================================
   LD social links + home collection grid · 2026-11-09
   Prefixed ld-, no new requests, no icon font, no layout shift.
   ================================================================== */

/* Top bar: five icons sit in the empty right side of the 40px notice bar.
   Absolute positioning leaves the centred announcement untouched. */
@media (min-width:1024px){
  html body .notice{display:flex!important}
}
html body .notice .ld-social-top{
  position:absolute!important;right:clamp(24px,4vw,70px)!important;top:0!important;
  height:100%!important;display:flex!important;align-items:center!important;
  gap:7px!important;z-index:3!important;
}
html body .notice .ld-social-top a{
  width:26px!important;height:26px!important;flex:0 0 26px!important;
  display:grid!important;place-items:center!important;
  color:#fff4e8!important;border:1px solid rgba(255,244,232,.3)!important;
  border-radius:50%!important;
  transition:background .2s ease,border-color .2s ease,transform .2s ease!important;
}
html body .notice .ld-social-top a:hover,
html body .notice .ld-social-top a:focus-visible{
  background:rgba(255,244,232,.16)!important;border-color:#f6d38a!important;
  transform:translateY(-1px);outline:none;
}
html body .notice .ld-social-top a:focus-visible{box-shadow:0 0 0 2px #f6d38a!important}
html body .notice .ld-social-top svg{width:14px!important;height:14px!important;display:block!important}

/* Tablet/mobile: the header is absolutely positioned over the hero and the
   notice bar is hidden, so a slim icon row goes into normal flow below the hero. */
html body .ld-social-strip{display:none!important}
@media (max-width:1023px){
  html body .ld-social-strip{
    display:flex!important;align-items:center!important;justify-content:center!important;
    flex-wrap:wrap!important;gap:12px!important;
    min-height:46px!important;padding:9px 16px!important;
    background:#170811!important;border-bottom:1px solid rgba(246,211,138,.16)!important;
  }
  html body .ld-social-strip__label{
    color:#d9c6a8!important;font-size:10px!important;letter-spacing:.16em!important;
    text-transform:uppercase!important;
  }
  html body .ld-social-strip a{
    width:28px!important;height:28px!important;flex:0 0 28px!important;
    display:grid!important;place-items:center!important;color:#f6d38a!important;
    border:1px solid rgba(246,211,138,.34)!important;border-radius:50%!important;
  }
  html body .ld-social-strip a:hover,
  html body .ld-social-strip a:focus-visible{background:rgba(246,211,138,.14)!important;outline:none}
  html body .ld-social-strip svg{width:15px!important;height:15px!important;display:block!important}
}

/* Footer: five labels must wrap instead of overflowing the 231px column. */
html body .footer-contact .social-links{flex-wrap:wrap!important;gap:8px 18px!important}
html body .footer-contact .social-links a{white-space:nowrap!important}

/* Home collection: count + category shortcuts above each 52-card grid. */
html body .ld-collection-bar{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;
  gap:12px 24px;margin:0 0 24px;padding:0 0 18px;
  border-bottom:1px solid rgba(240,169,195,.18);
}
html body .ld-collection-count{margin:0;color:#c9b4c0;font-size:13px;letter-spacing:.02em}
html body .ld-collection-count strong{color:#f6d38a;font-weight:600;font-variant-numeric:tabular-nums}
html body .ld-collection-chips{display:flex;flex-wrap:wrap;gap:8px}
html body .ld-collection-chips a{
  display:inline-flex;align-items:center;min-height:30px;padding:5px 12px;
  color:#f0a9c3!important;font-size:11px;letter-spacing:.03em;
  border:1px solid rgba(240,169,195,.34)!important;border-radius:99px!important;
  transition:background .2s ease,border-color .2s ease;
}
html body .ld-collection-chips a:hover,
html body .ld-collection-chips a:focus-visible{
  background:rgba(240,169,195,.12)!important;border-color:#f0a9c3!important;outline:none;
}
html body .ld-collection-chips a.is-all{color:#f6d38a!important;border-color:rgba(246,211,138,.5)!important}

/* Exit link after a long grid, so 52 cards never become a dead end. */
html body .ld-collection-more{display:flex;justify-content:center;margin:34px 0 0}
html body .ld-collection-more a{
  display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:10px 26px;
  color:#f6d38a!important;font-size:13px;letter-spacing:.06em;
  border:1px solid rgba(246,211,138,.55)!important;border-radius:3px!important;
  transition:background .2s ease;
}
html body .ld-collection-more a:hover,
html body .ld-collection-more a:focus-visible{background:rgba(246,211,138,.12)!important;outline:none}
html body .ld-collection-more a span{font-size:16px}

/* 52 cards: skip render work for off-screen rows. auto + intrinsic size keeps
   the scrollbar stable; lazy images already come from content-product.php. */
html body .product-section .products > .lb-card{
  content-visibility:auto;contain-intrinsic-size:auto 578px;
}
@media (max-width:1023px){
  html body .product-section .products > .lb-card{contain-intrinsic-size:auto 520px}
}
@media (max-width:600px){
  html body .ld-collection-bar{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:18px}
  html body .ld-collection-chips{gap:6px}
  html body .ld-collection-chips a{min-height:28px;padding:4px 10px;font-size:10px}
  html body .ld-collection-more{margin-top:26px}
  html body .product-section .products > .lb-card{contain-intrinsic-size:auto 470px}
}

/* The decorative serif renders digits as old-style figures (uneven baseline),
   which reads as a typo at 13px. Only the counting numbers use a lining sans. */
html body .ld-num{
  font-family:"DM Sans",Arial,Helvetica,sans-serif!important;
  font-variant-numeric:lining-nums tabular-nums!important;
  font-feature-settings:"lnum" 1,"tnum" 1!important;
  font-size:1em;letter-spacing:0;
}
html body .ld-collection-count strong.ld-num{font-weight:700;color:#f6d38a}
html body .ld-collection-more .ld-num{font-weight:600}