/* 鹦鹉养殖繁育基地 · 官方网站  ——  样式表 */
:root{
  --forest:#12503f;      /* 主色 深林绿 */
  --forest-2:#1b6a53;
  --mango:#f08c1e;       /* 强调 芒果橙 */
  --mango-2:#ffb154;
  --leaf:#8fc740;
  --cream:#fbf8f1;
  --paper:#ffffff;
  --ink:#1d2a26;
  --ink-2:#4c5c56;
  --ink-3:#8b9a94;
  --line:#e5e2d8;
  --ok:#2f9e5f;
  --warn:#d98a09;
  --danger:#c9483a;
  --radius:16px;
  --shadow:0 6px 24px rgba(18,80,63,.08);
  --shadow-lg:0 18px 48px rgba(18,80,63,.14);
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--cream);color:var(--ink);
  font-family:"PingFang SC","Microsoft YaHei","Hiragino Sans GB","Noto Sans SC",system-ui,sans-serif;
  line-height:1.75;-webkit-font-smoothing:antialiased;
}
a{color:var(--forest-2);text-decoration:none}
a:hover{color:var(--mango)}
img{max-width:100%;display:block}
.wrap{max-width:var(--max);margin:0 auto;padding:0 22px}

/* ---------- 顶栏 ---------- */
header.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(251,248,241,.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-in{max-width:var(--max);margin:0 auto;padding:12px 22px;display:flex;align-items:center;gap:26px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:19px;color:var(--forest);letter-spacing:.5px}
.logo .mark{
  width:36px;height:36px;border-radius:11px;flex:0 0 36px;
  background:linear-gradient(135deg,var(--forest),var(--leaf) 130%);
  display:grid;place-items:center;font-size:20px;box-shadow:var(--shadow)
}
.nav ul{display:flex;gap:4px;list-style:none;margin:0;padding:0;margin-left:auto;flex-wrap:wrap}
.nav ul a{
  display:block;padding:8px 14px;border-radius:10px;color:var(--ink-2);
  font-size:15px;font-weight:600;transition:.18s
}
.nav ul a:hover{background:#eef5f1;color:var(--forest)}
.nav ul a.on{background:var(--forest);color:#fff}

/* ---------- Hero ---------- */
.hero{
  position:relative;overflow:hidden;color:#fff;
  background:
    radial-gradient(1100px 460px at 88% -12%,rgba(143,199,64,.42),transparent 60%),
    radial-gradient(760px 420px at 4% 108%,rgba(240,140,30,.35),transparent 62%),
    linear-gradient(135deg,#0e4234,#17604a 55%,#1d7a58);
}
.hero-in{max-width:var(--max);margin:0 auto;padding:74px 22px 84px;display:grid;grid-template-columns:1.15fr .85fr;gap:44px;align-items:center}
.hero .tag{
  display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.25);padding:6px 14px;border-radius:999px;
  font-size:13px;font-weight:600;letter-spacing:.4px;margin-bottom:20px
}
.hero h1{font-size:clamp(30px,4.4vw,48px);line-height:1.18;margin:0 0 18px;letter-spacing:.5px}
.hero h1 em{font-style:normal;color:var(--mango-2)}
.hero p.lead{font-size:17px;color:rgba(255,255,255,.9);margin:0 0 30px;max-width:560px}
.btns{display:flex;gap:12px;flex-wrap:wrap}
.btn{
  display:inline-flex;align-items:center;gap:8px;padding:13px 26px;border-radius:12px;
  font-weight:700;font-size:15px;transition:.2s;border:1px solid transparent;cursor:pointer
}
.btn-p{background:var(--mango);color:#231202}
.btn-p:hover{background:var(--mango-2);color:#231202;transform:translateY(-2px);box-shadow:0 12px 26px rgba(240,140,30,.4)}
.btn-g{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.4)}
.btn-g:hover{background:rgba(255,255,255,.2);color:#fff;transform:translateY(-2px)}
.hero-stats{display:flex;gap:34px;margin-top:38px;flex-wrap:wrap}
.hero-stats b{display:block;font-size:30px;line-height:1.1;color:var(--mango-2)}
.hero-stats span{font-size:13px;color:rgba(255,255,255,.72)}
.hero-art{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);
  border-radius:24px;padding:18px;box-shadow:var(--shadow-lg);transform:rotate(1.4deg)
}
.hero-art img{border-radius:16px;aspect-ratio:4/3;object-fit:cover;width:100%;height:auto;display:block}
.hero-art figcaption{font-size:12.5px;color:rgba(255,255,255,.68);margin-top:12px;text-align:center}

/* ---------- 区块 ---------- */
section{padding:70px 0}
.sec-head{max-width:var(--max);margin:0 auto 36px;padding:0 22px}
.sec-head .kicker{color:var(--mango);font-weight:800;font-size:13.5px;letter-spacing:2.5px;text-transform:uppercase}
.sec-head h2{font-size:clamp(24px,3vw,34px);margin:8px 0 12px;color:var(--forest);letter-spacing:.5px}
.sec-head p{margin:0;color:var(--ink-2);font-size:16px;max-width:720px}
.alt{background:linear-gradient(180deg,#fff, #f6faf7)}

/* ---------- 品种卡 ---------- */
.grid{display:grid;gap:24px;max-width:var(--max);margin:0 auto;padding:0 22px}
.g4{grid-template-columns:repeat(4,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
.card{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow);transition:.24s;display:flex;flex-direction:column
}
.card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:#cfe3d8}
.card .ph{position:relative;aspect-ratio:4/3;background:#eef3f0;overflow:hidden}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:.5s}
.card:hover .ph img{transform:scale(1.06)}
.badge{
  position:absolute;top:12px;left:12px;padding:5px 11px;border-radius:999px;
  font-size:12px;font-weight:800;letter-spacing:.3px;backdrop-filter:blur(6px)
}
.b-free{background:rgba(47,158,95,.92);color:#fff}
.b-sign{background:rgba(217,138,9,.94);color:#fff}
.b-perm{background:rgba(201,72,58,.92);color:#fff}
.b-no{background:rgba(60,60,60,.9);color:#fff}
.card .body{padding:16px 18px 18px;display:flex;flex-direction:column;flex:1}
.card h3{margin:0;font-size:19px;color:var(--forest)}
.card .latin{font-size:12.5px;color:var(--ink-3);font-style:italic;margin:2px 0 10px}
.card p.desc{margin:0 0 14px;font-size:14.2px;color:var(--ink-2);flex:1}
.kv{display:flex;gap:10px;flex-wrap:wrap;border-top:1px dashed var(--line);padding-top:12px;margin-top:auto}
.kv span{font-size:12.5px;color:var(--ink-2);background:#f3f7f4;padding:4px 9px;border-radius:8px}
.kv span b{color:var(--forest)}
.price{font-weight:800;color:var(--mango);font-size:15px}

/* ---------- 文章/资讯 ---------- */
.news{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:24px 26px;box-shadow:var(--shadow)}
.news h3{margin:0 0 6px;font-size:19px;color:var(--forest)}
.news .meta{font-size:12.5px;color:var(--ink-3);margin-bottom:12px}
.news ul{margin:0;padding-left:20px;color:var(--ink-2);font-size:14.6px}
.news li{margin-bottom:7px}
.pill{display:inline-block;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:999px;background:#eef5f1;color:var(--forest-2);margin-right:6px}

/* ---------- 表格 ---------- */
.tbl-wrap{overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:620px}
th{background:#f3f7f4;color:var(--forest);text-align:left;padding:13px 16px;font-weight:800;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:12px 16px;border-bottom:1px solid #f1efe7;color:var(--ink-2);vertical-align:top}
tr:last-child td{border-bottom:0}
tbody tr:hover{background:#fbfdfb}

/* ---------- 技巧步骤 ---------- */
.steps{counter-reset:s;display:grid;gap:16px}
.step{
  position:relative;background:#fff;border:1px solid var(--line);border-radius:14px;
  padding:20px 22px 20px 66px;box-shadow:var(--shadow)
}
.step::before{
  counter-increment:s;content:counter(s);
  position:absolute;left:20px;top:20px;width:32px;height:32px;border-radius:10px;
  background:linear-gradient(135deg,var(--forest),var(--leaf));color:#fff;
  display:grid;place-items:center;font-weight:800;font-size:15px
}
.step h4{margin:0 0 6px;font-size:16.5px;color:var(--forest)}
.step p{margin:0;font-size:14.5px;color:var(--ink-2)}
.step ul{margin:6px 0 0;padding-left:18px;font-size:14.3px;color:var(--ink-2)}

/* ---------- 提示条 ---------- */
.notice{
  border-left:4px solid var(--mango);background:#fff8ec;border-radius:0 12px 12px 0;
  padding:16px 20px;font-size:14.5px;color:#6b4a06;margin:0 0 26px
}
.notice.red{border-color:var(--danger);background:#fdf1ef;color:#7d2c22}
.notice.ok{border-color:var(--ok);background:#eefaf2;color:#1c5c39}
.notice b{color:inherit}

/* ---------- 页头 ---------- */
.page-head{background:linear-gradient(135deg,#0e4234,#1b6a53);color:#fff;padding:52px 0 56px}
.page-head h1{margin:0 0 10px;font-size:clamp(26px,3.4vw,38px)}
.page-head p{margin:0;color:rgba(255,255,255,.85);font-size:16px;max-width:760px}
.crumb{font-size:13px;color:rgba(255,255,255,.65);margin-bottom:14px}
.crumb a{color:rgba(255,255,255,.85)}

/* ---------- 页脚 ---------- */
footer{background:#0e2b23;color:rgba(255,255,255,.72);padding:52px 0 26px;margin-top:20px}
.foot-in{max-width:var(--max);margin:0 auto;padding:0 22px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px}
footer h4{color:#fff;font-size:15px;margin:0 0 14px;letter-spacing:.5px}
footer ul{list-style:none;margin:0;padding:0;font-size:14px}
footer li{margin-bottom:8px}
footer a{color:rgba(255,255,255,.72)}
footer a:hover{color:var(--mango-2)}
.copy{max-width:var(--max);margin:34px auto 0;padding:20px 22px 0;border-top:1px solid rgba(255,255,255,.12);font-size:12.8px;color:rgba(255,255,255,.5)}
.copy p{margin:0 0 6px}

/* ---------- 响应式 ---------- */
@media (max-width:1000px){
  .g4{grid-template-columns:repeat(3,1fr)}
  .hero-in{grid-template-columns:1fr;gap:30px;padding-bottom:60px}
  .hero-art{transform:none;max-width:460px}
  .foot-in{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .g4,.g3{grid-template-columns:repeat(2,1fr)}
  .nav-in{gap:10px;flex-wrap:wrap}
  .nav ul{margin-left:0;width:100%}
  .nav ul a{padding:7px 11px;font-size:14px}
  section{padding:52px 0}
}
@media (max-width:520px){
  .g4,.g3,.g2{grid-template-columns:1fr}
  .foot-in{grid-template-columns:1fr}
}

.main-site-link{color:#e8532f;font-weight:600;text-decoration:none;font-size:14px;margin-left:12px}
.nav-in{display:flex;align-items:center;gap:12px;flex-wrap:wrap}