/* ═══════════════════════════════════════════════════════════
   The Kind Cut: Blood & Bloom — Coming Soon teaser
   Layered on ../../css/site.css. Adds a muted rose "bloom" accent.
   ════════════════════════════════════════════════════════ */
:root{ --bloom:#e3a6b4; --blood:#b2414f; }
.hidden{display:none!important}

/* ── Hero ──────────────────────────────────────────────── */
.kc-hero{position:relative;padding:clamp(4rem,10vw,8rem) 0 clamp(3rem,6vw,5rem);overflow:hidden;text-align:center}
.kc-hero::before{content:"";position:absolute;left:50%;top:-10%;width:min(900px,120vw);height:700px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(178,65,79,.18),rgba(216,185,127,.06) 55%,transparent 75%);pointer-events:none;z-index:-1}
.kc-hero-inner{display:flex;flex-direction:column;align-items:center}
.kc-chapter{margin-top:2.25rem;font-family:var(--F-display);font-style:italic;font-size:1.1rem;color:var(--ink-dim)}
.kc-title{font-family:var(--F-display);font-weight:500;line-height:.95;letter-spacing:-.015em;margin:.75rem 0 2.25rem}
.kc-title span{display:block;font-size:clamp(3rem,8vw,6.4rem);color:var(--ink)}
.kc-title em{display:block;font-style:italic;font-weight:400;font-size:clamp(2rem,5vw,3.8rem);color:var(--bloom);margin-top:.35rem}
.kc-oath{max-width:640px;padding:1.75rem 0;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
.kc-oath p{font-family:var(--F-display);font-style:italic;font-size:clamp(1.25rem,2.2vw,1.6rem);line-height:1.45;color:var(--ink)}
.kc-oath cite{display:block;margin-top:1rem;font-style:normal;font-size:.66rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.kc-lede{margin:2rem auto 0;text-align:center}
.kc-status{margin-top:1rem;font-size:.86rem;color:var(--ink-faint)}
.kc-actions{justify-content:center}
.kc-ledger{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(3.5rem,7vw,5.5rem);border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
.kc-ledger div{padding:1.5rem 1rem;display:flex;flex-direction:column-reverse;gap:.25rem}
.kc-ledger div + div{border-left:1px solid var(--line-soft)}
.kc-ledger dt{font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-faint)}
.kc-ledger dd{font-family:var(--F-display);font-size:clamp(1.8rem,3vw,2.4rem);font-weight:600;color:var(--ink)}
@media (max-width:640px){
  .kc-ledger{grid-template-columns:repeat(2,1fr)}
  .kc-ledger div:nth-child(3){border-left:0}
  .kc-ledger div:nth-child(n+3){border-top:1px solid var(--line-soft)}
}

/* ── Mission ───────────────────────────────────────────── */
.kc-mission{align-items:start}
.kc-facts{margin-top:1.5rem;border-top:1px solid var(--line-soft)}
.kc-facts div{display:flex;justify-content:space-between;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--line-soft)}
.kc-facts dt{font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-faint)}
.kc-facts dd{color:var(--ink);font-size:.95rem}
.kc-dropcap::first-letter{font-family:var(--F-display);float:left;font-size:4.2em;line-height:.85;padding:.08em .12em 0 0;color:var(--gold)}

/* ── Codex ─────────────────────────────────────────────── */
.kc-codex-note{margin:1rem auto 0;max-width:60ch;font-size:.95rem}
.faction-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin-bottom:1.5rem}
.faction-tab{background:none;border:1px solid var(--line-soft);color:var(--ink-dim);font-size:.66rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;padding:.75rem 1.1rem;cursor:pointer;transition:border-color .2s,color .2s,background .2s}
.faction-tab:hover{border-color:var(--line);color:var(--ink)}
.faction-tab.active{border-color:var(--gold);color:var(--gold-hi);background:var(--gold-wash)}
.faction-blurb{max-width:70ch;margin:0 auto 2.5rem;text-align:center;font-size:.95rem;min-height:3em}
.codex-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1px;background:var(--line-soft);border:1px solid var(--line-soft)}
.codex-card{all:unset;box-sizing:border-box;cursor:pointer;background:var(--bg-2);padding:1.75rem 1.5rem;display:flex;flex-direction:column;gap:.3rem;position:relative;overflow:hidden;transition:background .4s var(--ease)}
.codex-card::after{content:"";position:absolute;inset:0;background:radial-gradient(300px 160px at 100% 0%,rgba(227,166,180,.08),transparent 70%);opacity:0;transition:opacity .5s}
.codex-card:hover,.codex-card:focus-visible{background:var(--panel)}
.codex-card:hover::after,.codex-card:focus-visible::after{opacity:1}
.codex-card:focus-visible{outline:1px solid var(--gold);outline-offset:-1px}
.codex-mono{width:56px;height:56px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:var(--F-display);font-style:italic;font-size:1.4rem;color:var(--gold);margin-bottom:1rem;transition:border-color .3s}
.codex-card:hover .codex-mono{border-color:var(--gold)}
.codex-faction{font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:var(--bloom)}
.codex-name{font-family:var(--F-display);font-size:1.6rem;font-weight:600;color:var(--ink);line-height:1.15}
.codex-title{font-size:.88rem;color:var(--ink-dim)}
.codex-spec{font-size:.78rem;color:var(--ink-faint)}
.kc-art-note{margin-top:1.5rem;text-align:center;font-size:.82rem;color:var(--ink-faint)}
.grid-empty{grid-column:1/-1;padding:3rem;text-align:center;color:var(--ink-faint);background:var(--bg-2)}

/* ── Impact ────────────────────────────────────────────── */
.kc-rites{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(2rem,5vw,5rem);border-top:1px solid var(--line-soft)}
.kc-rites li{display:grid;grid-template-columns:3.5rem 1fr;gap:1rem;padding:2rem 0;border-bottom:1px solid var(--line-soft)}
.kc-rites li > span{font-family:var(--F-display);font-style:italic;font-size:1.6rem;color:var(--gold);line-height:1.2}
.kc-rites h4{font-family:var(--F-display);font-size:1.45rem;font-weight:600;color:var(--ink);margin-bottom:.4rem}
.kc-rites p{font-size:.93rem}
@media (max-width:760px){ .kc-rites{grid-template-columns:1fr} }

/* ── CTA ───────────────────────────────────────────────── */
.kc-cta{display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap;border:1px solid var(--line-soft);padding:clamp(2rem,5vw,3.5rem);background:linear-gradient(120deg,rgba(216,185,127,.05),transparent 60%)}
.kc-cta .h2{margin-bottom:.5rem}

/* ── Modal ─────────────────────────────────────────────── */
.modal-shell{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:1rem}
.modal-back{position:absolute;inset:0;background:rgba(0,0,0,.75);backdrop-filter:blur(4px);animation:fade .3s}
.modal-box{position:relative;width:min(640px,100%);max-height:calc(100vh - 2rem);overflow-y:auto;background:#0d0b09;border:1px solid var(--line);padding:clamp(1.75rem,5vw,3rem);animation:rise .45s var(--ease)}
@keyframes fade{from{opacity:0}}
@keyframes rise{from{opacity:0;transform:translateY(16px)}}
.modal-close{position:absolute;top:1rem;right:1rem;width:40px;height:40px;background:none;border:1px solid var(--line);color:var(--ink);cursor:pointer;transition:border-color .2s,color .2s}
.modal-close:hover{border-color:var(--gold);color:var(--gold-hi)}
.modal-mono{width:64px;height:64px;border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;font-family:var(--F-display);font-style:italic;font-size:1.6rem;color:var(--gold);margin-bottom:1.25rem}
.modal-faction{font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--bloom)}
.modal-box h3{font-family:var(--F-display);font-size:clamp(2rem,5vw,2.8rem);font-weight:600;line-height:1.05;color:var(--ink);margin:.4rem 0}
.modal-title{font-size:.9rem;color:var(--ink-dim)}
.modal-quote{margin-top:1.5rem;font-family:var(--F-display);font-style:italic;font-size:1.35rem;line-height:1.4;color:var(--ink);border-left:1px solid var(--gold);padding-left:1.1rem}
.modal-lore{margin-top:1.5rem;font-size:.97rem}
.modal-bloomkin{margin-top:1.5rem;padding:1.25rem;border:1px solid var(--line-soft);background:rgba(227,166,180,.03)}
.modal-bloomkin h4{font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--bloom);margin-bottom:.5rem;font-weight:700}
.modal-bloomkin p{font-size:.92rem}
.modal-facts{margin-top:1.25rem}
.modal-facts div{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--line-soft);font-size:.9rem}
.modal-facts dt{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint);padding-top:.2rem}
.modal-facts dd{color:var(--ink);text-align:right}
@media (max-width:600px){
  .codex-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .codex-card{padding:1.25rem 1rem}
  .codex-mono{width:44px;height:44px;font-size:1.1rem;margin-bottom:.75rem}
  .codex-name{font-size:1.3rem}
  .codex-faction{font-size:.55rem;letter-spacing:.16em}
}