/* 设计哲学：新侦探植物报刊美学；所有视觉围绕香蕉视频植物视频证据链、档案化视频卡、品牌前置、非对称报刊布局与自然可信气质展开。 */
:root {
  --pine: #0f2d25;
  --pine-2: #164334;
  --leaf: #72a35d;
  --leaf-bright: #b4d47b;
  --paper: #f7efd9;
  --paper-2: #fff8e8;
  --ink: #1d2822;
  --muted: #66766d;
  --gold: #c59b55;
  --red: #a94038;
  --shadow: 0 24px 60px rgba(15,45,37,.18);
  --radius: 22px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; font-family: -apple-system, BlinkMacSystemFont, 'Microsoft YaHei', 'PingFang SC', Arial, sans-serif; color: var(--ink); background: #f4ead2; line-height: 1.72; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display:block; height:auto; }
.noise-layer { display:none !important; width:0; height:0; overflow:hidden; }
.site-header { position: sticky; top: 0; z-index: 50; backdrop-filter: blur(16px); background: rgba(247,239,217,.92); border-bottom: 1px solid rgba(15,45,37,.12); }
.header-inner { max-width: 1240px; margin: 0 auto; padding: 14px 20px; display:flex; align-items:center; gap:18px; justify-content:space-between; }
.logo-wrap { display:flex; align-items:center; gap:10px; min-width:160px; }
.logo-wrap img { width:128px; height:auto; }
.nav { display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:center; }
.nav a { font-weight:800; font-size:14px; color:#20382f; padding:8px 10px; border-radius:999px; transition:.25s ease; }
.nav a:hover { background:#183e32; color:#fff8e8; transform: translateY(-1px); }
.search-zone { border-top: 1px solid rgba(15,45,37,.08); background: rgba(255,248,232,.78); }
.search-inner { max-width: 1240px; margin:0 auto; padding:12px 20px 16px; display:flex; gap:10px; align-items:center; }
.search-inner input { flex:1; border:1px solid rgba(15,45,37,.18); border-radius:999px; padding:13px 18px; background:#fffdf5; color:var(--ink); font-size:15px; outline:none; box-shadow: inset 0 0 0 1px rgba(255,255,255,.4); }
.search-inner button,.btn { border:0; border-radius:999px; padding:12px 18px; background:var(--pine); color:var(--paper-2); font-weight:900; cursor:pointer; transition:.25s ease; box-shadow: 0 12px 24px rgba(15,45,37,.18); }
.search-inner button:hover,.btn:hover { background:#244f40; transform: translateY(-2px); }
.search-note { max-width: 1240px; margin: -6px auto 10px; padding: 0 24px; color: var(--red); font-size: 13px; min-height: 20px; }
.hero { position:relative; min-height: 650px; color:#fff9e8; background: linear-gradient(90deg, rgba(5,18,17,.9), rgba(5,18,17,.62), rgba(5,18,17,.25)), var(--hero-image); background-size: cover; background-position:center; overflow:hidden; }
.hero::after { content:''; position:absolute; inset:0; background-image: radial-gradient(circle at 20% 30%, rgba(197,155,85,.18), transparent 28%), linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px); background-size: auto, 72px 72px, 72px 72px; pointer-events:none; }
.hero-content { position:relative; z-index:1; max-width:1240px; margin:0 auto; padding:108px 20px 76px; display:grid; grid-template-columns: 1.02fr .72fr; gap:46px; align-items:end; }
.breadcrumb { font-size:13px; letter-spacing:.08em; color:rgba(255,249,232,.76); margin-bottom:14px; }
.kicker { display:inline-flex; align-items:center; gap:10px; padding:8px 13px; border:1px solid rgba(255,249,232,.36); border-radius:999px; background:rgba(15,45,37,.42); color:#f6dc9b; font-weight:900; font-size:13px; }
h1,h2,h3,h4,h5,h6 { font-family: SimSun, 'Noto Serif SC', 'Microsoft YaHei', serif; letter-spacing:.01em; line-height:1.18; margin:0 0 18px; color:inherit; }
h1 { font-size: clamp(42px, 6.3vw, 86px); max-width:880px; text-shadow: 0 8px 32px rgba(0,0,0,.35); }
h2 { font-size: clamp(30px, 4vw, 54px); color:var(--pine); }
h3 { font-size: 26px; color:var(--pine); }
h4 { font-size: 20px; color:var(--pine-2); }
p { margin:0 0 14px; }
.hero p { max-width:780px; font-size:18px; color:rgba(255,249,232,.88); }
.hero-panel { background:rgba(255,248,232,.12); border:1px solid rgba(255,248,232,.22); border-radius:28px; padding:22px; backdrop-filter: blur(12px); box-shadow: 0 24px 80px rgba(0,0,0,.24); transform: rotate(-1.2deg); }
.stats { display:grid; grid-template-columns: repeat(3,1fr); gap:12px; margin-top:22px; }
.stat { padding:14px; border-radius:18px; background:rgba(255,248,232,.12); border:1px solid rgba(255,248,232,.18); }
.stat strong { display:block; color:#ffe2a1; font-size:25px; }
.section { max-width:1240px; margin:0 auto; padding:76px 20px; }
.section-intro { max-width:820px; color:var(--muted); font-size:17px; }
.asym-grid { display:grid; grid-template-columns: 1.15fr .85fr; gap:28px; align-items:start; }
.card { background: rgba(255,248,232,.86); border:1px solid rgba(15,45,37,.12); border-radius: var(--radius); box-shadow: var(--shadow); padding:24px; position:relative; overflow:hidden; }
.card::before { content:''; position:absolute; inset:0 0 auto; height:5px; background:linear-gradient(90deg,var(--pine),var(--gold),var(--leaf)); opacity:.86; }
.video-grid { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:20px; margin-top:28px; }
.video-card { background:#fff8e8; border:1px solid rgba(15,45,37,.14); border-radius:24px; overflow:hidden; box-shadow: 0 18px 44px rgba(15,45,37,.13); transition:.28s ease; position:relative; }
.video-card:hover { transform: translateY(-8px) rotate(-.4deg); box-shadow: 0 26px 70px rgba(15,45,37,.22); }
.video-media { position:relative; aspect-ratio: 4/3; background:#0b201b; overflow:hidden; }
.video-media img,.video-media video { width:100%; height:100%; object-fit:cover; transition: .35s ease; }
.video-card:hover .video-media img { transform: scale(1.055); filter: saturate(1.05) contrast(1.03); }
.play-btn { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%) scale(.82); width:68px; height:68px; border-radius:50%; display:grid; place-items:center; background:rgba(255,248,232,.9); color:var(--pine); opacity:0; transition:.25s ease; box-shadow:0 0 0 10px rgba(255,248,232,.18); font-weight:900; }
.video-card:hover .play-btn { opacity:1; transform:translate(-50%,-50%) scale(1); }
.video-body { padding:18px; }
.meta-row { display:flex; gap:10px; flex-wrap:wrap; color:var(--muted); font-size:13px; margin-top:12px; }
.tag { display:inline-flex; padding:4px 9px; border-radius:999px; background:#e9dec0; color:#274638; font-weight:800; font-size:12px; }
.columns { display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:18px; margin-top:30px; }
.feature-list { display:grid; gap:12px; margin-top:18px; }
.feature-list li { list-style:none; padding:14px 16px; background:#fbf4df; border:1px dashed rgba(15,45,37,.22); border-radius:16px; }
.json-box { margin-top:18px; background:#102821; color:#f8eccb; border-radius:18px; padding:18px; overflow:auto; font-size:13px; line-height:1.58; border:1px solid rgba(197,155,85,.32); }
.logo-wall { display:grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap:12px; margin-top:20px; }
.logo-cell { min-height:74px; display:grid; place-items:center; border-radius:18px; background:linear-gradient(135deg,#fff8e8,#e9dec0); border:1px solid rgba(15,45,37,.14); font-family: SimSun, serif; font-weight:900; color:var(--pine); text-align:center; }
.expert-grid,.review-grid,.faq-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:18px; margin-top:24px; }
.expert { display:grid; grid-template-columns: 92px 1fr; gap:14px; align-items:start; }
.avatar { width:92px; height:92px; border-radius:50%; background: radial-gradient(circle at 30% 25%, #fff3c9, #8cae64 45%, #143a2e 82%); border:4px solid #fff8e8; box-shadow:0 12px 26px rgba(15,45,37,.2); }
.faq-item details { background:#fff8e8; border:1px solid rgba(15,45,37,.14); border-radius:18px; padding:16px 18px; }
.faq-item summary { font-weight:900; color:var(--pine); cursor:pointer; }
.keyword-cloud { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; max-height:none; }
.keyword-cloud span { display:inline-flex; border:1px solid rgba(15,45,37,.16); background:rgba(255,248,232,.72); color:#274638; border-radius:999px; padding:5px 9px; font-size:12px; }
.contact-panel { display:grid; grid-template-columns: .86fr 1.14fr; gap:24px; align-items:center; }
.qr-pair { display:grid; grid-template-columns: repeat(2,1fr); gap:14px; }
.share-row { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.share-row a { border:1px solid rgba(15,45,37,.18); background:#fff8e8; color:var(--pine); border-radius:999px; padding:10px 14px; font-weight:900; text-decoration:none; display:inline-flex; align-items:center; }
.share-row a:hover { background:var(--yellow); transform:translateY(-2px); }
.mcp-widget { border-left:6px solid var(--gold); background:#132b24; color:#fff5d8; border-radius:20px; padding:18px; margin-top:22px; }
.site-footer { background:#0d241e; color:#f9edcf; padding:44px 20px; }
.footer-inner { max-width:1240px; margin:0 auto; display:grid; grid-template-columns: 1fr .8fr; gap:28px; align-items:center; }
.footer-inner img { width:140px; margin-bottom:12px; }
.small { color:rgba(249,237,207,.72); font-size:13px; }
.subhero { background:linear-gradient(120deg,#0f2d25,#1e4a3a); color:#fff8e8; padding:70px 20px; }
.subhero-inner { max-width:1240px; margin:0 auto; }
.topic-band { display:grid; grid-template-columns: 1fr 1fr; gap:22px; margin-top:28px; }
.timeline { border-left:3px solid var(--gold); padding-left:18px; display:grid; gap:16px; }
.notice { background:#fff3c9; border:1px solid rgba(169,64,56,.22); color:#6c3728; padding:12px 14px; border-radius:16px; margin-top:12px; }
@media (max-width: 940px) {
  .header-inner,.search-inner { align-items:flex-start; flex-direction:column; }
  .nav { justify-content:flex-start; }
  .hero-content,.asym-grid,.contact-panel,.footer-inner,.topic-band { grid-template-columns:1fr; }
  .video-grid,.columns,.expert-grid,.review-grid,.faq-grid { grid-template-columns:1fr; }
  .logo-wall { grid-template-columns:repeat(2,1fr); }
  .hero { min-height: auto; }
  .hero-content { padding-top:78px; }
}


/* 设计哲学：新侦探植物报刊美学；本区块用于强化香蕉视频百度EEAT可信证据链。 */
.eeat-panel { background: linear-gradient(135deg, rgba(255,248,232,.94), rgba(232,245,221,.92)); border-top: 1px solid rgba(15,45,37,.14); border-bottom: 1px solid rgba(15,45,37,.14); }
.eeat-grid { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:18px; margin-top:24px; }
.eeat-grid .card { min-height: 210px; }
.audit-strip { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.audit-strip span { background:#102d25; color:#fff8e8; border-radius:999px; padding:9px 12px; font-size:13px; font-weight:900; letter-spacing:.03em; }
@media (max-width: 980px) { .eeat-grid { grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width: 620px) { .eeat-grid { grid-template-columns:1fr; } .search-note { margin-top: 6px; } }

.brand-subtitle{
  margin: 0.7rem 0 0;
  max-width: 680px;
  color: #fff8dc;
  font-size: clamp(1rem, 2vw, 1.22rem);
  line-height: 1.75;
  text-shadow: 0 2px 18px rgba(0,0,0,.36);
}
