/* ============================================================
   土客网 · 乡土好物平台 
   ============================================================ */
:root{
  --pine:#22391F;        /* 深秧田绿 */
  --pine-2:#2F4F2A;
  --leaf:#4C9A3A;        /* 主色：秧苗绿 */
  --meadow:#7CBF4F;      /* 嫩芽绿 */
  --wheat:#E3B23C;       /* 麦穗金 */
  --paper:#F7F9F0;       /* 米白豆绿 */
  --mist:#E9F1D9;        /* 浅秧苗 */
  --ink:#24301E;
  --sub:#5B6B4C;
  --muted:#93A184;
  --line:#DFE8CE;
  --wrap:1280px;         /* 桌面内容总宽 */
}
body{background:#E3E8D8}
.tkApp{background:var(--paper)}
::selection{background:#C9DD9B;color:var(--pine)}
html{scroll-behavior:smooth}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--leaf);outline-offset:2px;border-radius:6px}

/* 顶部一条“田垄”色带 */
.tkTopAccent{height:4px;background:linear-gradient(90deg,#3E7A2E 0%,var(--leaf) 38%,var(--meadow) 68%,var(--wheat) 100%)}

/* 品牌标识：叶片渐变印章 */
.tkBrandMark{background:linear-gradient(145deg,var(--leaf),#3E7A2E);color:#F5FBEC;box-shadow:0 6px 16px rgba(34,57,31,.26)}
.tkDeskLogo .tkBrandMark{background:linear-gradient(145deg,var(--leaf),#3E7A2E);color:#F5FBEC}
.tkBrandName{letter-spacing:3px}
.tkDtlSrc .tkSrcAva{background:linear-gradient(145deg,var(--leaf),var(--meadow));color:#F5FBEC}
.tkDeskNav{background:linear-gradient(120deg,#22391F,#33502A)}

/* 标题前的“麦穗”色条 + 金色小点 */
.tkSecHd h2::before,.tkPanelHd h3::before,.tkPageCard h2::before{background:linear-gradient(180deg,var(--meadow),var(--leaf))}
.tkSecHd h2::after,.tkPanelHd h3::after{content:'';width:6px;height:6px;border-radius:50%;background:var(--wheat);flex:none}
.tkPageCard h2,.tkSecHd h2,.tkPanelHd h3{letter-spacing:1.5px}

/* 轮播与卡片：田园绿阴影 */
.tkBanner{border-radius:16px;box-shadow:0 14px 30px rgba(34,57,31,.16)}
.tkBannerCap{background:linear-gradient(transparent,rgba(20,40,18,.86))}
.tkBannerCap .tkTag{background:var(--wheat);color:#2C3818}
.tkBannerCap h3{text-shadow:0 2px 10px rgba(20,40,18,.45)}
.tkBannerDots i.tkOn{background:var(--wheat)}
.cat{border-color:#E7EEDB;transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease}
.cat:hover{border-color:var(--meadow);transform:translateY(-2px);box-shadow:0 10px 22px rgba(34,57,31,.10)}
.tkCatIco{background:linear-gradient(150deg,#F0F7E4,var(--mist))}
.cat:hover .tkCatIco{background:linear-gradient(150deg,#E4F0CF,#D3E7B6)}
.tkPageCard,.tkPanel,.tkDtl,.tkAuthCard,.tkBrandCard{border-color:#E7EEDB}

/* 卡片悬浮细化 */
.tkPanel,.tkPageCard,.tkBrandCard,.tkHotCard,.tkLatestGrid a,.tkTopic,.tkFeat{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.tkPanel:hover,.tkPageCard:hover{box-shadow:0 12px 28px rgba(34,57,31,.08)}
.tkBrandCard:hover,.tkHotCard:hover{transform:translateY(-3px);box-shadow:0 14px 28px rgba(34,57,31,.12)}
.tkTopic:hover{background:#E4EED3}

/* 色块：时令提醒 / 咨询卡 / 会员头图 */
.tkNotice{background-image:radial-gradient(circle at 88% 16%,rgba(255,255,255,.24),transparent 46%),linear-gradient(135deg,#3E7A2E,var(--leaf))}
.tkConsultCard{background-image:radial-gradient(circle at 12% 88%,rgba(255,255,255,.16),transparent 42%),linear-gradient(140deg,#2F4F2A,#5E9C38)}
.tkVipHero{background-image:radial-gradient(circle at 82% 12%,rgba(227,178,60,.32),transparent 45%),linear-gradient(145deg,#2F4F2A,#5E9C38)}
.tkVipHero .tkCrown{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.5);color:#F4FAE8}
.tkVipBadge,.tkVipBtn.tkSolid{color:#2C3818}
.tkBrandHero,.tkExpoHero{background-image:radial-gradient(circle at 86% 20%,rgba(227,178,60,.28),transparent 44%),linear-gradient(135deg,#22391F,#3E7A2E)}
.tkCtaBand{border-color:rgba(76,154,58,.34)}

/* 标签、排行与按钮 */
.tkFTag{color:#2F5D22;background:#EAF3D9}
.tkRankNum:nth-child(2){background:#C9DD9B;color:#3E5A1F}
.tkRankNum:nth-child(3){background:#E5F0C9;color:#5A6E2B}
.tkChip{border-color:#E0E9CF}
.tkChip:hover{border-color:var(--meadow);color:#2F5D22}
.tkChip.tkOn,.tkBrandCats .tkBcCat.tkOn{background:linear-gradient(135deg,#3E7A2E,var(--leaf));border-color:transparent}
.tkBtnBlock,.tkBtnSolid,.tkDtlBar .tkBarBtn,.tkCtaBand .tkHeroBtn,.tkSubHero .tkHeroBtn,.tkVipHero .tkConsultBtn{background:linear-gradient(135deg,#3E7A2E,var(--leaf));color:#F5FBEC}
.tkSubHero .tkHeroBtn.tkGhost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.55)}
.tkSubHero .tkHeroBtn.tkGold,.tkCtaBand .tkHeroBtn.tkGold{background:linear-gradient(135deg,var(--wheat),#C99A24);color:#2C3818}
.tkVipBtn{border-color:var(--leaf);color:#2F5D22}
.tkVipBtn.tkSolid{background:linear-gradient(135deg,var(--wheat),#C99A24)}
.tkLoadBtn{color:#2F5D22}
.tkLoadBtn:hover{border-color:var(--leaf);background:#F4F8EB}
.tkBrandCats .tkBcCat{transition:background .2s ease,color .2s ease}
.tkBrandCats .tkBcCat:hover{border-color:var(--meadow);color:#2F5D22}

/* 页脚细节 */
.tkDeskFoot{background:linear-gradient(180deg,#22391F,#1B2E19)}
.tkDeskFootIn{border-top:1px solid rgba(255,255,255,.10);padding-top:40px}
.tkDeskFoot a{transition:color .2s ease}
.tkDeskFoot a:hover{color:#C9DD9B}
.tkDfCopy{border-top:1px solid rgba(255,255,255,.08)}

/* 回到顶部（新增） */
.tkToTop{position:fixed;right:16px;bottom:84px;width:46px;height:46px;border-radius:50%;display:none;place-items:center;
  background:linear-gradient(145deg,#4C9A3A,#2F4F2A);color:#F5FBEC;border:1px solid rgba(255,255,255,.22);
  box-shadow:0 10px 24px rgba(34,57,31,.3);z-index:85;cursor:pointer;transition:transform .2s ease,filter .2s ease}
.tkToTop.tkShow{display:grid}
.tkToTop:hover{transform:translateY(-3px);filter:brightness(1.06)}
@media(min-width:900px){.tkToTop{right:calc((100vw - var(--wrap))/2 + 4px);bottom:36px;width:48px;height:48px}}

/* 桌面：分类筛选吸顶 */
@media(min-width:900px){
  .tkChipsWrap{position:sticky;top:72px;z-index:35;background:linear-gradient(var(--paper) 78%,rgba(247,249,240,0));padding-top:2px}
}
/* 滚动条与打印友好 */
@media(min-width:900px){
  ::-webkit-scrollbar{width:10px;height:10px}
  ::-webkit-scrollbar-thumb{background:#C3D3AE;border-radius:8px;border:2px solid var(--paper)}
  ::-webkit-scrollbar-track{background:#EDF2E4}
}

/* ===== 桌面内容列统一 1280px（去掉容器横向内边距，使内容宽度即 1280） ===== */
@media(min-width:900px){
  .tkDeskNavIn,.tkHeroGrid,.tkCats,.tkHomeLayout,.tkListLayout,.tkDetailLayout,
  .tkPageWrap,.tkAuthWrap,.tkBrandWrap,.tkExpoWrap,.tkDeskFootIn,.tkDfCopyIn,
  .tkReadProgress{max-width:1280px;padding-left:0;padding-right:0}
  .tkSubHero{max-width:1280px}
  .tkToTop{right:max(18px,calc((100vw - 1280px)/2 + 6px))}
}

/* ===== 好物专题：首页图文卡片（图片 + 底部渐变标题） ===== */
.tkTopicCards{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tkTopicCard{position:relative;display:block;border-radius:12px;overflow:hidden;background:var(--mist);transition:transform .22s ease,box-shadow .22s ease}
.tkTopicCard:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(34,57,31,.16)}
.tkTopicCard img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;transition:transform .5s ease}
.tkTopicCard:hover img{transform:scale(1.06)}
.tkTopicMask{position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(18,34,16,.80))}
.tkTopicCap{position:absolute;left:10px;right:10px;bottom:8px;color:#fff;font-size:13.5px;font-weight:600;letter-spacing:.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 2px 8px rgba(18,34,16,.55)}

/* ===== 表单/文字类页面按原设计比例随页面放大（不拉满 1280） =====
   原设计基准 1200px：登录注册 940px、留言页 1000px
   现页面基准 1280px → 1002px、1067px（四舍五入取整） */
@media(min-width:900px){
  .tkAuthWrap{max-width:1002px}
  .tkMsgWrap{max-width:1067px}
}

/* ===== 正文类页面（关于/免责/隐私/会员/留言）同样按原设计比例放大 =====
   原设计基准 1200px 下为 1000px → 现基准 1280px 取 1067px */
@media(min-width:900px){
  .tkPageWrap{max-width:1067px}
}



/* ===== 列表条目 hover / active 背景（不改动原有间距与内容位置） =====
   规则：背景块 = 条目内容区左右各外扩 5px，从而内容四周保留 5px 背景留白 + 3px 圆角
   - 桌面端条目横向内边距为 0        → 背景块 left/right = -5px
   - 移动端图文条目内边距 16px        → 背景块 left/right = 11px（16-5）
   - 侧栏/推荐位条目内边距为 0        → 背景块 left/right = -5px */
.tkFItem,.tkHotCard,.tkRankItem{position:relative;isolation:isolate;border-radius:10px}
.tkFItem::before,.tkHotCard::before,.tkRankItem::before{
  content:'';position:absolute;top:0;bottom:0;left:-5px;right:-5px;border-radius:10px;
  background:transparent;transition:background .18s ease;pointer-events:none;z-index:-1;
}
@media(max-width:899px){
  .tkFeed .tkFItem::before{left:11px;right:11px}
}
.tkFItem:hover::before,.tkFItem:active::before,
.tkHotCard:hover::before,.tkHotCard:active::before,
.tkRankItem:hover::before,.tkRankItem:active::before{background:#F0F6E4}
.tkFItem:hover,.tkFItem:active,.tkHotCard:hover,.tkHotCard:active,.tkRankItem:hover,.tkRankItem:active{background:transparent}

/* ===== 缩略图：圆角统一 10px；悬停时外框尺寸不变、图片在框内放大变亮（同“最新上架”） ===== */
.tkFThumb,.tkHotImg,.tkFCoverImg,.tkLiThumb{border-radius:10px}
.tkFThumb,.tkHotImg,.tkFCoverImg{display:block;overflow:hidden;flex:none}
.tkThumbImg,.tkFThumb img,.tkHotImg img,.tkFCoverImg img,.tkLiThumb img{
  display:block;width:100%;height:100%;object-fit:cover;
  transition:transform .6s ease,filter .6s ease;will-change:transform;
}
/* 取消整块缩放（旧写法），改为只缩放框内图片 */
.tkFThumb:hover,.tkFCoverImg:hover,.tkHotImg:hover{transform:none;filter:none}
.tkFThumb:hover .tkThumbImg,.tkFCoverImg:hover .tkThumbImg,.tkHotImg:hover .tkThumbImg,
.tkFThumb:hover img,.tkFCoverImg:hover img,.tkHotImg:hover img,
.tkLiThumb:hover img{transform:scale(1.08);filter:brightness(1.12)}
.tkFeat{overflow:hidden}

/* ===== 分隔线跟随背景块内缩，避免比背景块更宽造成溢出 ===== */
.tkFItem,.tkHotCard,.tkRankItem{border-bottom:none}
.tkFItem::after,.tkHotCard::after,.tkRankItem::after{
  content:'';position:absolute;left:5px;right:5px;bottom:0;height:0;
  border-top:1px solid #EBF1DF;pointer-events:none;
}
.tkHotCard::after,.tkRankItem::after{border-top:1px dashed #EDF2E2}
.tkHotCard:last-child::after,.tkRankItem:last-child::after{display:none}
@media(max-width:899px){
  .tkFeed .tkFItem::after{left:21px;right:21px}
}