/*------------// Overall //------------------*/
*{box-sizing:border-box}
body{margin:0; padding: 0; background-color: var(--background);}
ol, ul, li { list-style-type: none; }
div, p, img, ul, li, form, input, label, aside, menu, section, span, dl, dt, dd, h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; }
input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"]::-moz-focus-inner {
border:none;
padding:0;
}
:focus, map { 
	-moz-outline-style: none; 
	} 
A:link { 
	text-decoration: none; color:var(--black);
	}
A:visited {
	text-decoration: none; color: var(--black); 
	}
A:hover {
	text-decoration: none; color: var(--highlight);
	 }
table { border-collapse: collapse; border-spacing: 0; empty-cells: show; } 
@font-face {
  font-family: "Libre Baskerville";
  src: url("/fonts/LibreBaskerville-Italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Libre Baskerville";
  src: url("/fonts/librebaskerville-variablefont_wght-webfont.woff2") format("woff2");
  font-weight: 400 700; /* 关键：声明权重范围 */
  font-style: normal;
  font-display: swap;
}
html, body {
  font-family: "Libre Baskerville",serif;
  font-weight: 400;
  letter-spacing: 1px;
}
/* 繁体中文专用字体覆盖 */
html.lang-zh-Hant, .lang-zh-Hant body {
  font-family: "Microsoft YaHei","Microsoft JhengHei", "PingFang TC", "Noto Sans TC",  sans-serif;
  letter-spacing: 0.5px; /* 中文不适合 1px */
}
.img-comn img{ width: 100%; max-width: 100%; display:block; margin:25px 0;}
strong {
  font-weight: 700;
}
.fimg img{ max-width:800px; display:block; margin:25px 0; }
.wd-note strong{ font-size:20px; }
.wrp{
	width: 100%;
	margin:0 auto;
}
.ntbr{
	background: #c7a47a;
	height: 36px;
	line-height: 36px;
	text-align: center;
	font-size: 12px;
}
.ntbr a,.ntbr a:visited{ 
	color: #FFF;
	}
.ntbr .dot{
	margin: 0 10px;
	font-family: inherit;
}
/* =========================
   PÉTALES Common Header
   (extracted from home.css)
   ========================= */

/* Variables + base reset (shared by header/footer/pages) */
:root{
  --bg:#f5f2e8;
  --white:#fff;
  --black:#333;
  --accent:#b3835a;
  --gold:#c9a67a;
  --max:1680px;
  --bar-h:34px;
  --nav-h:90px;
  --t:.18s;
  --gap:22px;

  --ptl-max: var(--max);
  --ptl-gap: 28px;
  --ptl-gap-lg: 38px;
  --ptl-ink: #1a1a1a;
  --ptl-muted: rgba(0,0,0,.62);
  --ptl-accent: var(--accent);
}

*{box-sizing:border-box}
body{margin:0;background:var(--bg);}
a{color:inherit;text-decoration:none}
button{font:inherit}
.sr-only{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* ===== HEADER OVER HERO / (also works on other pages) ===== */
.site-header{position:absolute;left:0;right:0;top:0;z-index:9998;color:var(--white)}

.topbar{
  height:var(--bar-h);
  display:flex;align-items:center;justify-content:center;
  padding:0 16px;
  background:rgba(199,164,122,1);
  color:#fff;
  font-size:12px;
  letter-spacing:.12em;
}
.topbar a,.topbar a:visited{color:rgba(255,255,255,.85);}
.topbar a:hover{color:rgba(255,255,255,1);}

.nav-wrap{
  height:var(--nav-h);
  max-width:var(--max);
  margin:0 auto;
  padding:0 20px;
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  align-items:center;
  gap:12px;
}

/* desktop left menu */
.nav-left{font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.nav-list{list-style:none;margin:0;padding:0;display:flex;gap:22px;align-items:center}
.nav-item{position:relative}
.nav-link{
  display:inline-block;
  padding:12px 0;
  opacity:.95;
  color:rgba(255,255,255,.85);
  font-size:13px;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.08em;
  line-height:1
}
a.nav-link,a.nav-link:visited{color:rgba(255,255,255,.85);}
a.nav-link:hover{color:rgba(255,255,255,1);}

/* logo */
.brand{display:block; width:180px; height:60px; padding-top:15px;}
.brand-top{font-size:28px;letter-spacing:.08em}
.brand-sub{margin-top:4px;font-size:11px;letter-spacing:.34em;opacity:.85}
.brand svg{ width:100%; height:auto; display:block; overflow:visible;}
.brand .cls-1{fill:#FFF;}
.brand:hover .cls-1{fill:#FFF;}

/* right icons */
.nav-right{display:flex;justify-content:flex-end;gap:16px;align-items:center}
.icon-btn{
  border:0;background:transparent;
  color:rgba(255,255,255,.85);
  cursor:pointer;
  padding:6px;
  display:grid;place-items:center
}
.icon-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7}
.icon-btn:hover{color:rgba(255,255,255,1)}
a.icon-btn,a.icon-btn:visited{color:rgba(255,255,255,.85);}

/* desktop submenu */
@media (hover:hover) and (pointer:fine){
  .nav-item.has-sub::after{
    content:"";
    position:absolute;left:0;top:100%;
    width:260px;height:22px;
    pointer-events:auto;
  }
}
.sub-menu{
  position:absolute;left:0;top:100%;
  margin-top:8px;
  min-width:260px;
  padding:6px 0;
  z-index:9999;
  display:block;
  opacity:0;visibility:hidden;
  transform: translateY(-4px);
  pointer-events:none;
  transition: opacity .15s ease, transform .15s ease, visibility .15s ease;
}
.sub-menu a{
  display:block;padding:6px 0;
  font-size:13px;letter-spacing:.02em;text-transform:none;
  color:rgba(255,255,255,.85);
  white-space:nowrap;line-height:1.2;
}
.sub-menu a:hover{color:rgba(255,255,255,1);}
.nav-item.has-sub:hover a{color:rgba(255,255,255,1);}
.nav-item.has-sub:hover > .nav-link{color:rgba(255,255,255,1);}
.nav-item.has-sub.is-open > .sub-menu{
  opacity:1;visibility:visible;transform: translateY(0);pointer-events:auto
}

/* Search overlay */
.searchOverlay{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 10001; /* 确保搜索框显示在最上层 */
}
.searchOverlay.is-open{
    display: flex;
}

.searchOverlay__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    backdrop-filter: saturate(120%) blur(8px);
}

.searchOverlay__panel {
    position: relative;
	width: 380px;
    max-width: 720px;
    margin: calc(var(--bar-h) + 22px) auto 0;
    border-radius: 14px;
    background: rgba(245, 242, 232, 0.96);
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.35);
    color: #1a1a1a;
    padding: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    flex-direction: row;
}

.searchForm__row{ display: flex; align-items: center;}
.searchForm {
    display: flex;
    width: 100%;
    max-width: 500px;
    gap: 10px;
}

.searchInput {
    width: 80%;
    padding: 10px;
    font-size: 16px;
    border: 1px solid #ddd;
    border-radius: 4px;
    outline: none;
}

.searchBtn {
    width: 20%;
    padding: 10px;
    background: #ddd;
    border: none;
    cursor: pointer;
    border-radius: 4px;
	margin-left: 15px;
}

.searchBtn svg {
    width: 18px;
    height: 18px;
	fill: #333; 
}



.searchClose {
    position: absolute;
    top: 10px;
    right: 10px;
    background: transparent;
    border: none;
    cursor: pointer;
}

.searchClose svg {
    width: 20px;
    height: 20px;
}

/* Focused input */
.searchInput:focus {
    border-color: rgba(0, 0, 0, 0.28);
}

/* Search Close Button */
.searchClose {
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.06);
    cursor: pointer;
    display: grid;
    place-items: center;
}

.searchClose svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: #111;
    stroke-width: 2;
}
.searchInput:focus{border-color:rgba(0,0,0,.28)}
.searchClose{
  width:40px;height:40px;border:0;border-radius:999px;
  background:rgba(0,0,0,.06);
  cursor:pointer;
  display:grid;place-items:center;
}
.searchClose svg{width:18px;height:18px;fill:none;stroke:#111;stroke-width:2}

/* ===== Mobile header / drawer ===== */
.nav-mobile{display:none}
.burger{display:none}

/* breakpoint: <=1024 switch to mobile header pattern */
@media (max-width:1025px){
  .nav-wrap{
    grid-template-columns:auto 1fr auto; /* logo left, center spacer, menu right */
    padding:0 16px;
  }
  .nav-left{display:none}
  .nav-right{display:none} /* icons move into drawer */
  .brand{justify-self:start;align-items:flex-start;}
  .brand-top{font-size:24px}
  .brand-sub{font-size:10px;margin-top:3px}
  .brand svg{width:100px;height:45px;}
  
  .burger{
    display:inline-grid;
    justify-self:end;
    border:0;background:transparent;
    cursor:pointer;padding:8px;
    place-items:center;
  }
  body.home .burger{color:rgba(255,255,255,.92);}
  .burger svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8}
  /* 默认（内页）：hover 不要变白 */
  .burger:hover{ color:#2b2b2a; }
  
  /* 仅首页 hero 上方需要白色 */
  body.page--home .burger:hover{ color:#fff; }

  .nav-mobile{display:block}
  .nav-link{font-size:12px;}
  .brand{ width: 160px;}
}

/* Drawer */
.drawer{
  position:fixed;inset:0;
  z-index:10040;
  display:none;
}
.drawer.is-open{display:block}
.drawer__backdrop{
  position:absolute;inset:0;
  background:rgba(0,0,0,.55);
  backdrop-filter:saturate(120%) blur(8px);
}
body .drawer__panel{
  position:absolute;right:0;top:0;bottom:0;
  width:min(420px, 86vw);
  background:rgba(245,242,232,.98);
  color:#141414;
  box-shadow:-24px 0 80px rgba(0,0,0,.35);
  display:flex;
  flex-direction:column;
  padding:22px 18px 18px;
}
body.page--baby .drawer__panel{
	background:rgba(238,243,245,.98);
}
.drawer__top{
  display:flex;align-items:center;justify-content:space-between;
  padding-bottom:14px;
  border-bottom:1px solid rgba(0,0,0,.08);
}
.drawer__title{
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(0,0,0,.60);
}
.drawer__close{
  width:40px;height:40px;border:0;border-radius:999px;
  background:rgba(0,0,0,.06);
  cursor:pointer;
  display:grid;place-items:center;
}
.drawer__close svg{width:18px;height:18px;fill:none;stroke:#111;stroke-width:2}

.mnav{margin:16px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.mnav a, .mnav button{
  width:100%;
  text-align:left;
  border:0;
  background:transparent;
  padding:0px 2px;
  font-size:16px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#151515;
  cursor:pointer;
}
.mnav .mitem{border-bottom:1px solid rgba(0,0,0,.06);padding:8px 0 10px 0px}
.mnav .mitem:last-child{border-bottom:none}

/* Accordion */
.acc-btn{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;
}
.chev{
  width:18px;height:18px;
  fill:none;stroke:#111;stroke-width:2;
  transition:transform .18s ease;
}
.mitem.is-expanded .chev{transform:rotate(180deg)}
.msub{
  display:none;
  padding:8px 0 0 0;
}
.mitem.is-expanded .msub{display:block}
.msub a{
  display:block;
  padding:8px 2px;
  font-size:15px;
  letter-spacing:.02em;
  text-transform:none;
  color:rgba(0,0,0,.78);
}

/* Drawer actions (icons moved into drawer bottom) */
.drawer__actions{
  margin-top:auto;
  padding-top:14px;
  border-top:1px solid rgba(0,0,0,.08);
  display:flex;
  gap:14px;
  justify-content:flex-start;
}
.drawer__actions .icon-btn{
  color:#111;
  padding:10px;
}
.drawer__actions .icon-btn:hover{color:#000}

@media (prefers-reduced-motion: reduce){
  .sub-menu{transition:none}
}

/* header.css add-on for list pages only */
body.page--list .site-header{
 position: relative; /* 确保子菜单定位层级正常 */
 z-index: 100;       /
  background: rgba(243,239,236,.92); /* 你常用 #f3efec */
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0,0,0,.06);
}

body.page--list .site-header .sub-menu{
  z-index: 200;
}

/* ===========================
   LIST PAGE HEADER PATCH
   Only affects pages with body.page--list
=========================== */

/* 关键：不要让 nav-wrap/父级裁切下拉菜单 */
body.page--list .site-header,
body.page--list .site-header .nav-wrap,
body.page--list .site-header nav,
body.page--list .site-header .nav-left,
body.page--list .site-header .nav-list{
  overflow: visible !important;
}

/* 确保下拉菜单定位与层级 */
body.page--list .site-header .nav-item.has-sub{
  position: relative;
}
body.page--list .site-header{
  position: relative;
  z-index: 999;
}

/* 兜底：强制 hover / focus-within 显示 sub-menu（桌面端） */
@media (hover:hover){
  body.page--list .site-header .sub-menu{
    display: block !important;       /* 即使你之前用 display:none，这里也兜底 */
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(8px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
    z-index: 2000;
  }

  body.page--list .site-header .nav-item.has-sub:hover .sub-menu,
  body.page--list .site-header .nav-item.has-sub:focus-within .sub-menu{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }
}

/* 桌面菜单文字颜色 + hover 颜色 */
body.page--list .site-header .nav-link,
body.page--list .site-header .nav-list a{
  color: #2b2b2a !important;
}
body.page--list .site-header .nav-link:hover,
body.page--list .site-header .nav-list a:hover{
  color: #bfa77a !important;
}

/* 右侧图标颜色（SVG跟随 currentColor） */
body.page--list .site-header .nav-right{
  color: #2b2b2a;
}
body.page--list .site-header .icon-btn{
  color: #2b2b2a;
}
body.page--list .site-header .icon-btn:hover{
  color: #bfa77a;
}
body.page--list .site-header .icon-btn svg{
  stroke: currentColor;
  fill: none;
}
/* ===== Language menu (same tone as search overlay) ===== */
.lang-menu{
  position: absolute;
  width: 160px;
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  box-shadow: 0 3px 3px rgba(0,0,0,.1);
  padding: 10px 12px;
  opacity: 0;
  transform: translateY(6px);
  pointer-events: none;
  transition: opacity .16s ease, transform .16s ease;
  z-index: 9999;
}

/* ✅ JS 打开时靠这个显示（移动端必须） */
.lang-menu.is-open{
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* Mobile menu uses fixed positioning (JS will set top/left) */
.lang-menu.is-mobile{
  position: fixed;
  z-index: 10000;
}

.lang-menu .lang-item{
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  padding: 10px 10px;
  font-size: 14px;
  letter-spacing: .02em;
  cursor: pointer;
  border-radius: 10px;
  opacity: .9;
}
.lang-menu .lang-item:hover{
  background: rgba(0,0,0,.04);
  opacity: 1;
}

/* Mobile: inside drawer (fixed feeling) */
.lang-menu.is-mobile{
  position: absolute;
  width: 190px;
  z-index: 8000;
}

/* ===== Wishlist count badge (optional) ===== */
.header-heart .wl-badge{
  position:absolute;
  top:-4px;
  right:-6px;
  min-width:16px;
  height:16px;
  padding:0 4px;
  border-radius:999px;
  display:none;
  align-items:center;
  justify-content:center;
  font-size:10px;
  line-height:16px;
  background:#111;
  color:#fff;
}
.fnt-li{ padding: 0 0 0 30px; margin: 0;}
.fnt-li li{ list-style-type: disc; font-size: 14px; line-height: 180%; color: rgba(43, 43, 42, .72);}
.sgd-tbl table{ width: 100%; max-width: 100%;}
.sgd-tbl th,.sgd-tbl td{ text-align: left; font-size: 14px; padding: 10px 0;  color: rgba(43, 43, 42, .72);  border-bottom: 1px solid rgba(43, 43, 42, .4); }
.sgd-tbl td{border-bottom: 1px solid rgba(43, 43, 42, .1);}

