/* 한국코다리협회 — 사진은 크게(다큐), 글과 색은 단정하게(기관) */
:root{--navy:#14284A;--navy2:#0E1D37;--bg:#F4F3EF;--panel:#14284A}
.hd .wordmark{font-size:28px;letter-spacing:.05em;color:var(--navy)}
.hd .cta{color:var(--navy)}
.drawer-name{font-family:var(--serif);font-size:15px;color:var(--muted);letter-spacing:.04em;margin-bottom:10px}

/* hero — 덕장 사진 전체 화면 + 아래쪽 어둡게, 글은 왼쪽 아래 */
.ka-hero{position:relative;margin-top:76px;height:calc(100svh - 76px);min-height:560px;overflow:hidden;background:#0b1424}
.ka-hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ka-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,16,32,0) 30%,rgba(8,16,32,.55) 62%,rgba(8,16,32,.85) 100%),linear-gradient(90deg,rgba(8,16,32,.45) 0%,rgba(8,16,32,0) 60%)}
.ka-hero-in{position:absolute;left:var(--gutter);right:var(--gutter);bottom:clamp(48px,9vh,96px);z-index:1;color:#fff}
.ka-eyebrow{font-family:"Big Shoulders Display",var(--sans);font-weight:800;font-size:clamp(14px,1.3vw,19px);letter-spacing:.26em}
.ka-hero h1{font-family:var(--serif);font-weight:600;font-size:clamp(40px,6.6vw,96px);line-height:1.18;letter-spacing:-.015em;margin:18px 0 22px;text-shadow:0 2px 24px rgba(0,0,0,.35)}
.ka-hero-in>*{opacity:0;transform:translateY(16px);animation:kaUp 1.1s cubic-bezier(.2,.7,.2,1) forwards}
.ka-hero-in>*:nth-child(2){animation-delay:.25s}.ka-hero-in>*:nth-child(3){animation-delay:.55s}
@keyframes kaUp{to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.ka-hero-in>*{animation:none;opacity:1;transform:none}}
.ka-sub{font-family:var(--serif);font-size:clamp(16px,1.6vw,21px);letter-spacing:.12em;padding-top:16px;border-top:1px solid rgba(255,255,255,.5);display:inline-block}

/* 소개 split — 남색 패널 */
#about .txt{background:var(--navy)}
#about .txt p{text-align:left}
.ka-note{font-size:14px!important;color:rgba(255,255,255,.7);margin-top:22px!important}
#about,#about .pic{min-height:min(860px,calc(100svh - 76px))}
#about .pic img{object-position:center 40%}

/* 설립 목적 3칸 */
.values{background:#fff}
.vgrid.three{grid-template-columns:repeat(3,1fr);max-width:1180px;border-top-color:var(--navy)}
.vgrid.three .no{color:var(--navy)}

/* 수묵 띠 — 밝은 그림이라 어두운 덧칠 없이 글자를 남색으로 */
.band.ka-ink{min-height:min(760px,90svh);color:var(--navy);background:#f3f0e8}
.band.ka-ink::after{background:linear-gradient(90deg,rgba(243,240,232,.92) 0%,rgba(243,240,232,.55) 45%,rgba(243,240,232,0) 75%)}
.band.ka-ink img{object-position:center 70%}

/* 회장 인사말 — 컬러 사진 */
#chairman{background:var(--bg)}
#chairman .founder-wrap img{filter:none}

/* 기본 정보 */
.ka-info{background:#fff;padding:120px var(--gutter) 110px}
.ka-dl{max-width:880px;margin:0 auto;border-top:2px solid var(--navy)}
.ka-dl>div{display:grid;grid-template-columns:180px 1fr;gap:20px;padding:20px 8px;border-bottom:1px solid var(--soft)}
.ka-dl dt{font-family:var(--serif);font-weight:600;color:var(--navy)}
.ka-dl dd{color:var(--ink)}

/* FAQ */
.ka-faq{background:var(--bg);padding:120px var(--gutter) 110px}
.ka-qa{max-width:880px;margin:0 auto;border-top:2px solid var(--navy)}
.ka-qa details{border-bottom:1px solid var(--soft);padding:0 8px}
.ka-qa summary{cursor:pointer;list-style:none;padding:22px 34px 22px 0;font-family:var(--serif);font-weight:600;font-size:18px;position:relative}
.ka-qa summary::-webkit-details-marker{display:none}
.ka-qa summary::after{content:"+";position:absolute;right:4px;top:18px;font-family:var(--sans);font-weight:300;font-size:26px;color:var(--navy)}
.ka-qa details[open] summary::after{content:"−"}
.ka-qa p{padding:0 0 24px;color:var(--muted);font-size:16px;line-height:1.85}

/* 문의 */
.contact{background:#fff}
.contact .btn.solid{background:var(--navy);border-color:var(--navy)}
.ka-mail{margin-top:18px!important;font-size:15px;letter-spacing:.04em}

/* footer — 남색 */
.ft{background:var(--navy2)}
.ft .top.ka-ft{grid-template-columns:2fr 1fr 1fr}
.ka-ft-name{font-family:var(--serif);font-weight:600;font-size:26px;color:#fff}
.ka-ft-en{font-family:"Big Shoulders Display",var(--sans);font-weight:800;letter-spacing:.18em;font-size:14px;margin-top:6px;color:#9AA6BC}
.ft .biz{border-top-color:#22324F}

@media (max-width:960px){
  .vgrid.three{grid-template-columns:1fr}
  .vgrid.three article{border-right:0;border-bottom:1px solid var(--soft);padding:28px 0}
  #about,#about .pic{min-height:0}
  #about .pic{min-height:440px}
  .ft .top.ka-ft{grid-template-columns:1fr}
}
@media (max-width:640px){
  .hd .wordmark{font-size:16px;letter-spacing:.03em}
  .ka-hero{margin-top:62px;height:calc(100svh - 62px)}
  .ka-dl>div{grid-template-columns:1fr;gap:4px}
  .ka-info,.ka-faq{padding:86px var(--gutter)}
  .band.ka-ink::after{background:linear-gradient(180deg,rgba(243,240,232,.9) 0%,rgba(243,240,232,.4) 60%,rgba(243,240,232,0) 100%)}
  .band.ka-ink .inner{align-items:flex-start}
}
@media (max-width:360px){.hd .wordmark{font-size:14px}}
.letter .ka-greet{font-family:var(--serif);font-weight:600;font-size:clamp(24px,2.4vw,32px);letter-spacing:.02em;color:var(--navy);margin-bottom:24px}
.letter .ka-sign{text-align:right;padding-right:1.6em}.letter .ka-sign strong{margin-left:0;font-size:clamp(24px,2.4vw,32px);letter-spacing:.04em}

/* 배경음악 버튼 — 첫 화면 오른쪽 위, 기본 꺼짐 */
.ka-ctrl{position:absolute;top:22px;right:var(--gutter);z-index:3}
.ka-ctrl button{width:48px;height:48px;border-radius:50%;border:0;background:rgba(20,40,74,.7);cursor:pointer;display:grid;place-items:center}
.ka-ctrl svg{width:18px;height:18px;fill:#fff}