/* KADAL4D — 瀑布流 masonry：岩壁 hero + 鳞片墙 CSS columns（kd- 前缀，原创样式） */

:root{
  --kd-bg:#1D2013;
  --kd-bg2:#141708;
  --kd-card:#262B18;
  --kd-line:#3B4224;
  --kd-ac:#B5E86A;
  --kd-ac2:#8FC43E;
  --kd-sun:#F2D95C;
  --kd-rock:#4A4E33;
  --kd-ink:#EEF2DF;
  --kd-dim:#AAB394;
  --kd-fd:'Ranchers',cursive;
  --kd-fb:'Sniglet',cursive;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--kd-bg);
  color:var(--kd-ink);
  font-family:var(--kd-fb);
  font-size:16.5px;
  line-height:1.8;
}
a{color:var(--kd-ac);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{font-family:var(--kd-fd);font-weight:400;letter-spacing:1px;line-height:1.2}
h1{font-size:clamp(2rem,4.4vw,3.2rem);color:var(--kd-sun)}
h2{font-size:clamp(1.5rem,2.9vw,2.2rem);color:var(--kd-ac)}
h3{font-size:1.3rem;color:var(--kd-ink)}
main{overflow-x:clip}

/* ---------- header ---------- */
.kd-head{
  position:sticky;top:0;z-index:60;
  background:rgba(20,23,8,.95);
  backdrop-filter:blur(8px);
  border-bottom:3px solid var(--kd-ac);
}
.kd-hd{
  max-width:1220px;margin:0 auto;
  display:flex;align-items:center;gap:1.4rem;
  padding:.6rem 1.2rem;
}
.kd-logo{display:flex;align-items:center;gap:.6rem;min-width:0}
.kd-logo:hover{text-decoration:none}
.kd-scalemark{
  display:grid;
  grid-template-columns:repeat(2,10px);
  gap:3px;
}
.kd-scalemark i{
  width:10px;height:8px;border-radius:50% 50% 45% 45%;
  background:var(--kd-ac);
}
.kd-scalemark i:nth-child(2){background:var(--kd-sun)}
.kd-scalemark i:nth-child(3){background:var(--kd-sun)}
.kd-word{
  font-family:var(--kd-fd);
  font-size:1.5rem;color:var(--kd-ink);letter-spacing:1.5px;
}
.kd-nav{display:flex;gap:1.25rem;margin-left:auto;min-width:0}
.kd-nav a{
  color:var(--kd-dim);font-size:1.05rem;
  padding:.25rem .15rem;border-bottom:3px dotted transparent;
}
.kd-nav a:hover{color:var(--kd-ink);text-decoration:none}
.kd-nav a.kd-on{color:var(--kd-ac);border-bottom-color:var(--kd-ac)}
.kd-hact{display:flex;gap:.55rem}
.kd-btn{
  display:inline-block;
  font-family:var(--kd-fd);
  font-size:1.05rem;letter-spacing:1.2px;
  padding:.3rem 1.1rem .42rem;
  border-radius:12px 12px 4px 4px;
  border:2px solid var(--kd-ac);
  transition:transform .15s ease,box-shadow .15s ease;
}
.kd-btn:hover{text-decoration:none;transform:translateY(-1px)}
.kd-btn-main{
  background:linear-gradient(180deg,var(--kd-ac),var(--kd-ac2));
  color:#141708;
  box-shadow:0 0 16px rgba(181,232,106,.4);
}
.kd-btn-ghost{color:var(--kd-ac);background:transparent}
.kd-burger{display:none;cursor:pointer;flex-direction:column;gap:5px;padding:6px}
.kd-burger span{width:24px;height:2px;background:var(--kd-ink);border-radius:2px}
.kd-navtog{display:none}
.kd-mnav{display:none}

/* ---------- 日光岩点分隔条 ---------- */
.kd-sunstrip{
  display:flex;justify-content:center;gap:1.8rem;
  padding:.5rem 1rem;
  background:
    radial-gradient(circle at 20% 50%,rgba(181,232,106,.07),transparent 40%),
    #191C0E;
  border-bottom:1px solid var(--kd-line);
}
.kd-sunstrip span{
  color:var(--kd-sun);
  font-size:1rem;line-height:1.4;
  text-shadow:0 0 10px rgba(242,217,92,.9);
}
.kd-sunstrip span:nth-child(odd){color:var(--kd-ac)}

/* ---------- hero：岩壁 ---------- */
.kd-hero{
  background:
    radial-gradient(720px 360px at 85% 8%,rgba(181,232,106,.1),transparent 60%),
    var(--kd-bg);
  padding:3rem 1.2rem 3.4rem;
}
.kd-herogrid{
  max-width:1220px;margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:2.4rem;align-items:center;
}
.kd-kick{
  display:inline-block;
  font-family:var(--kd-fd);
  font-size:.95rem;letter-spacing:2.5px;
  color:var(--kd-sun);
  border:2px dotted rgba(242,217,92,.5);
  border-radius:999px;
  padding:.02rem .95rem .12rem;
  margin-bottom:1rem;
}
.kd-lead{color:var(--kd-dim);margin:1rem 0 1.5rem}
.kd-cta{display:flex;flex-wrap:wrap;gap:.75rem}

.kd-rockwall{
  position:relative;
  min-height:320px;
  border-radius:16px;
  background:
    repeating-linear-gradient(105deg,rgba(74,78,51,.35) 0 26px,transparent 26px 54px),
    linear-gradient(180deg,#232714,#171A0B);
  border:1px solid var(--kd-line);
  overflow:hidden;
}
.kd-rock{
  position:absolute;
  border-radius:14px 22px 12px 26px;
  background:linear-gradient(160deg,var(--kd-rock),#33361F);
  border:1px solid #5A5F3E;
}
.kd-r1{left:6%;top:34%;width:34%;height:40%}
.kd-r2{left:38%;top:52%;width:26%;height:28%}
.kd-r3{left:22%;top:12%;width:20%;height:18%}
.kd-r4{left:60%;top:26%;width:30%;height:34%}
.kd-r5{left:56%;top:64%;width:32%;height:22%}
.kd-rockwall .kd-sun{
  position:absolute;
  display:grid;place-items:center;
  width:52px;height:52px;
  border-radius:50%;
  background:rgba(20,23,8,.85);
  border:2px solid var(--kd-sun);
  color:var(--kd-sun);
  font-size:1.05rem;
  box-shadow:0 0 18px rgba(242,217,92,.55);
  animation:kd-glow 3s ease-in-out infinite;
}
.kd-s1{left:16%;top:20%}
.kd-s2{right:16%;top:38%;animation-delay:.7s}
.kd-s3{left:42%;bottom:24%;animation-delay:1.4s}
@keyframes kd-glow{0%,100%{box-shadow:0 0 10px rgba(242,217,92,.35)}50%{box-shadow:0 0 24px rgba(242,217,92,.85)}}
.kd-scaleband{
  position:absolute;left:0;right:0;bottom:0;height:34px;
  background:
    repeating-radial-gradient(circle at 10px -6px,transparent 0 9px,rgba(181,232,106,.22) 9px 10px,transparent 10px 20px);
  border-top:1px solid var(--kd-line);
}

/* ---------- 鳞片墙（masonry） ---------- */
.kd-wallsec{padding:2.8rem 1.2rem;background:var(--kd-bg2);border-top:1px solid var(--kd-line);border-bottom:1px solid var(--kd-line)}
.kd-wallsec>h2,.kd-wallp{text-align:center;max-width:760px;margin-left:auto;margin-right:auto}
.kd-wallp{color:var(--kd-dim);margin:.5rem 0 1.6rem;font-size:.95rem}
.kd-wall{
  max-width:1220px;margin:0 auto;
  columns:3;column-gap:1rem;
}
.kd-card{
  break-inside:avoid;
  width:100%;
  margin:0 0 1rem;
  background:
    radial-gradient(circle at 85% 10%,rgba(181,232,106,.08),transparent 45%),
    var(--kd-card);
  border:1px solid var(--kd-line);
  border-top:3px solid var(--kd-ac);
  border-radius:6px 14px 6px 14px;
  padding:1.1rem 1.05rem 1.15rem;
  min-width:0;
  box-shadow:0 8px 22px rgba(8,10,2,.45);
}
.kd-card:nth-child(even){border-top-color:var(--kd-sun)}
.kd-cardh{font-size:1.2rem;margin-bottom:.45rem}
.kd-sun{color:var(--kd-sun)}
.kd-card p{color:var(--kd-dim);font-size:.93rem}
.kd-card p strong{color:var(--kd-ink)}
.kd-card p b{color:var(--kd-ac)}
.kd-cardlink{
  display:inline-block;
  font-family:var(--kd-fd);
  font-size:.98rem;letter-spacing:1px;
  margin-top:.55rem;
}
.kd-card-note{border-style:dashed}

/* ---------- 栖息地 ---------- */
.kd-habitat{max-width:1000px;margin:0 auto;padding:2.8rem 1.2rem}
.kd-habitat>h2{text-align:center;margin-bottom:1.4rem}
.kd-zones{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.kd-zones li{
  position:relative;
  background:var(--kd-card);
  border:1px solid var(--kd-line);
  border-radius:4px 12px 4px 12px;
  padding:1rem 1rem 1rem 3.6rem;
  min-width:0;
}
.kd-zones li::before{
  content:counter(kd-zone);
  counter-increment:kd-zone;
  position:absolute;left:.9rem;top:.95rem;
  width:2rem;height:2rem;
  display:grid;place-items:center;
  font-family:var(--kd-fd);
  color:#141708;
  background:var(--kd-ac);
  border-radius:50% 45% 50% 45%;
}
.kd-zones{counter-reset:kd-zone}
.kd-zones h3{font-size:1.15rem;margin-bottom:.2rem}
.kd-zones p{font-size:.9rem;color:var(--kd-dim)}

/* ---------- 叙述 ---------- */
.kd-story{max-width:900px;margin:0 auto;padding:2.6rem 1.2rem}
.kd-story h2{margin-bottom:.9rem}
.kd-story p{color:var(--kd-dim);margin-bottom:1rem}
.kd-fig{
  margin:1.6rem 0;
  border:1px solid var(--kd-line);
  border-radius:4px 16px 4px 16px;
  overflow:hidden;
  background:var(--kd-card);
}
.kd-fig img{width:100%}
.kd-fig figcaption{
  padding:.55rem 1rem;
  font-size:.82rem;color:var(--kd-dim);
  border-top:1px solid var(--kd-line);
}
.kd-gloss{
  margin:1.4rem 0 0;
  border:2px dotted var(--kd-line);
  border-radius:4px 14px 4px 14px;
  padding:1.1rem 1.3rem;
  background:#1A1D0D;
}
.kd-glossh{font-family:var(--kd-fd);font-size:1.3rem;color:var(--kd-sun);margin-bottom:.4rem}
.kd-gloss dt{font-family:var(--kd-fd);font-size:1.1rem;color:var(--kd-ac);margin-top:.55rem}
.kd-gloss dd{color:var(--kd-dim);font-size:.92rem;margin:0}

/* ---------- 优势 ---------- */
.kd-why{padding:2.4rem 1.2rem;background:var(--kd-bg2);border-top:1px solid var(--kd-line);border-bottom:1px solid var(--kd-line)}
.kd-why h2{text-align:center;margin-bottom:1.3rem}
.kd-whylist{list-style:none;max-width:1220px;margin:0 auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.kd-whylist li{
  background:var(--kd-card);
  border-left:4px solid var(--kd-sun);
  border-radius:0 10px 10px 0;
  padding:.9rem 1.05rem;
  min-width:0;
}
.kd-whylist h3{font-size:1.12rem;color:var(--kd-ac)}
.kd-whylist p{font-size:.9rem;color:var(--kd-dim)}

/* ---------- 精选 ---------- */
.kd-picks{max-width:900px;margin:0 auto;padding:2.6rem 1.2rem}
.kd-picks h2{margin-bottom:1rem}
.kd-picklist{list-style:none}
.kd-picklist li{
  padding:.85rem .9rem .85rem 1rem;
  border-left:4px solid var(--kd-ac);
  border-bottom:1px dashed var(--kd-line);
  min-width:0;
}
.kd-picklist h3 a{color:var(--kd-ink)}
.kd-picklist p{font-size:.9rem;color:var(--kd-dim);margin-top:.15rem}

/* ---------- FAQ / 信任 ---------- */
.kd-faqsec{padding:2.4rem 1.2rem;background:var(--kd-bg2);border-top:1px solid var(--kd-line)}
.kd-faqsec h2{text-align:center;margin-bottom:1.2rem}
.kd-faqsec details{
  max-width:840px;margin:0 auto .65rem;
  background:var(--kd-card);
  border:1px solid var(--kd-line);
  border-radius:4px 12px 4px 12px;
  padding:.8rem 1.05rem;
}
.kd-faqsec summary{cursor:pointer;font-weight:600;color:var(--kd-ink)}
.kd-faqsec details[open] summary{color:var(--kd-ac)}
.kd-faqsec details p{color:var(--kd-dim);font-size:.93rem;margin-top:.45rem}
.kd-trust{max-width:840px;margin:0 auto;padding:2.6rem 1.2rem}
.kd-trust h2{margin-bottom:.7rem}
.kd-trust p{color:var(--kd-dim)}
.kd-trustlnk{font-family:var(--kd-fd);font-size:1.05rem;letter-spacing:1px;display:inline-block;margin-top:.6rem}

/* ---------- 通用文章纸 ---------- */
.kd-paper{padding:2.4rem 1.2rem 3.2rem}
.kd-edu,.kd-navpage{
  max-width:820px;margin:0 auto;
  background:var(--kd-card);
  border:1px solid var(--kd-line);
  border-radius:4px 16px 4px 16px;
  padding:2rem 1.7rem;
  min-width:0;
}
.kd-crumbs{font-size:.84rem;color:var(--kd-dim);margin-bottom:1rem}
.kd-crumbs span{color:var(--kd-ac)}
.kd-edulead,.kd-navintro{color:var(--kd-dim);margin:.7rem 0 1.2rem}
.kd-edu h2,.kd-navpage h2{font-size:1.4rem;margin:1.6rem 0 .6rem}
.kd-edu p,.kd-navpage p,.kd-pp{color:var(--kd-dim)}
.kd-edu .kd-fig-lead{margin:1.4rem 0}
.kd-steps2{list-style:none;margin:1rem 0}
.kd-steps2 li{
  display:grid;grid-template-columns:52px minmax(0,1fr);gap:.85rem;
  background:#1A1D0D;
  border:1px solid var(--kd-line);
  border-radius:4px 12px 4px 12px;
  padding:.85rem .95rem;
  margin-bottom:.7rem;
  min-width:0;
}
.kd-stepn{
  display:grid;place-items:center;
  width:48px;height:48px;
  font-family:var(--kd-fd);font-size:1.4rem;
  color:#141708;
  background:var(--kd-ac);
  border-radius:50% 45% 50% 45%;
}
.kd-steps2 h3{font-size:1.12rem;margin-bottom:.15rem}
.kd-steps2 p{font-size:.9rem}
.kd-glist{margin:.6rem 0 1rem 1.2rem;color:var(--kd-dim)}
.kd-glist li{margin-bottom:.4rem;font-size:.94rem}
.kd-navaside{
  margin-top:1.6rem;
  background:#1A1D0D;
  border:2px dotted var(--kd-line);
  border-radius:4px 12px 4px 12px;
  padding:1rem 1.1rem;
}
.kd-navaside h3{font-size:1.1rem;color:var(--kd-sun);margin-bottom:.3rem}
.kd-navaside a{display:block;padding:.2rem 0;font-size:.93rem}
.kd-note{
  border-left:4px solid var(--kd-sun);
  background:#1A1D0D;
  padding:.8rem 1rem;
  border-radius:0 8px 8px 0;
  color:var(--kd-ink);font-size:.93rem;
  margin-top:1.2rem;
}
.kd-resp{
  margin-top:1.4rem;
  font-size:.8rem;color:var(--kd-dim);
  border-top:1px solid var(--kd-line);
  padding-top:.8rem;
}

/* ---------- 404 ---------- */
.kd-404{max-width:640px;margin:0 auto;text-align:center;padding:4.2rem 1.2rem}
.kd-404suns{display:flex;justify-content:center;gap:.8rem;font-size:2.1rem;margin-bottom:1.1rem}
.kd-404suns span{
  background:#1A1D0D;
  border:2px solid var(--kd-sun);
  border-radius:50% 45% 50% 45%;
  width:64px;height:60px;
  display:grid;place-items:center;
  color:var(--kd-sun);
}
.kd-404 p{color:var(--kd-dim);margin:.8rem 0 1.4rem}
.kd-404act{display:flex;justify-content:center;flex-wrap:wrap;gap:.7rem}

/* ---------- footer ---------- */
.kd-foot{
  border-top:3px solid var(--kd-ac);
  background:var(--kd-bg2);
  padding:2.4rem 1.2rem 5.6rem;
}
.kd-fgrid{
  max-width:1220px;margin:0 auto;
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:1.6rem;
}
.kd-fcol h3{color:var(--kd-ac);font-size:1.15rem;margin-bottom:.45rem}
.kd-fcol a{display:block;color:var(--kd-dim);font-size:.92rem;padding:.16rem 0}
.kd-fcol a:hover{color:var(--kd-ac)}
.kd-fbrand p{font-size:.85rem;color:var(--kd-dim);margin:.6rem 0}
.kd-18{
  display:inline-block;
  border:2px solid var(--kd-sun);
  color:var(--kd-sun);
  border-radius:50% 45% 50% 45%;
  font-weight:600;font-size:.8rem;
  padding:.02rem .7rem .1rem;
}
.kd-fbot{max-width:1220px;margin:1.8rem auto 0;border-top:1px solid var(--kd-line);padding-top:1rem}
.kd-fbot p{font-size:.78rem;color:var(--kd-dim);text-align:center}

/* ---------- 悬浮条 ---------- */
.kd-float{
  position:fixed;left:50%;bottom:14px;transform:translateX(-50%);
  z-index:80;
  width:min(94vw,560px);
}
.kd-floatin{
  display:flex;align-items:center;justify-content:center;gap:.9rem;
  background:rgba(20,23,8,.96);
  border:2px solid var(--kd-ac);
  border-radius:14px 14px 6px 6px;
  padding:.5rem .95rem;
  box-shadow:0 0 22px rgba(181,232,106,.4);
  backdrop-filter:blur(6px);
}
.kd-tag{white-space:nowrap;font-size:.86rem;color:var(--kd-ink)}
.kd-blink{color:var(--kd-sun);animation:kd-bl 1.7s steps(2,start) infinite}
@keyframes kd-bl{to{visibility:hidden}}
.kd-enter{white-space:nowrap}

/* ---------- 响应式 ---------- */
@media (max-width:1000px){
  .kd-herogrid{grid-template-columns:1fr}
  .kd-rockwall{min-height:240px}
  .kd-wall{columns:2}
}
@media (max-width:960px){
  .kd-nav{display:none}
  .kd-burger{display:flex}
  .kd-navtog:checked~.kd-mnav{display:block}
  .kd-mnav{
    background:#141708;
    border-bottom:1px solid var(--kd-line);
    padding:1rem 1.2rem 1.4rem;
  }
  .kd-mgrp{margin-bottom:1rem}
  .kd-mgrp h3{color:var(--kd-ac);font-size:1.1rem;margin-bottom:.25rem}
  .kd-mgrp a{display:block;color:var(--kd-dim);padding:.22rem 0;font-size:.96rem}
}
@media (max-width:640px){
  .kd-wall{columns:1}
  .kd-zones{grid-template-columns:1fr}
  .kd-whylist{grid-template-columns:1fr}
  .kd-steps2 li{grid-template-columns:1fr}
  .kd-fgrid{grid-template-columns:1fr 1fr}
  .kd-floatin{flex-wrap:wrap;border-radius:12px}
  .kd-hact{margin-left:auto}
  .kd-word{font-size:1.2rem}
}
@media (max-width:460px){
  .kd-fgrid{grid-template-columns:1fr}
  .kd-cta{flex-direction:column;align-items:flex-start}
}
