/* =========================================================
   밝은 배경 판 - style.css 뒤에 얹는 오버라이드
   구조·타이포·간격은 그대로 두고 명암만 뒤집는다.
   강도는 사진의 단단한 그림자와 큰 국문 제목이 낸다.
   푸터만 어둡게 남겨 페이지 바닥을 잡는다.
   ========================================================= */

/* ---------- 헤더 ---------- */
.hd--over { color: var(--stone-700); }
.hd--over:not(.is-stuck) .hd__mark-en { color: var(--accent); }
.hd--over:not(.is-stuck) .hd__mark-ko { color: var(--stone-400); }

body.is-locked .hd { color: var(--stone-700); }
body.is-locked .hd__mark-en { color: var(--accent); }
body.is-locked .hd__mark-ko { color: var(--stone-400); }

/* ---------- 메뉴 오버레이 ---------- */
.navov { background: var(--paper); }
.navov__item { border-top-color: var(--stone-200); }
.navov__item:last-child { border-bottom-color: var(--stone-200); }
.navov__item a { color: var(--navy); }
.navov__item a:hover { color: var(--accent); }
.navov__num { color: var(--stone-400); }
.navov__desc,
.navov__foot { color: var(--stone-500); }

/* ---------- 히어로 ---------- */
.hero { background: var(--paper); color: var(--navy); }
.hero::before {
  background-image:
    linear-gradient(rgba(24,46,78,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(24,46,78,.045) 1px, transparent 1px);
}
.hero__bg {
  background-image: url("../img/hero-light.jpg");
  background-image: image-set(url("../img/hero-light.webp") type("image/webp"),
                              url("../img/hero-light.jpg")  type("image/jpeg"));
  background-position: 76% center;
}
/* 사선 그림자 위로 제목이 지나가므로 왼쪽에 흰 베일을 덮는다 */
.hero__veil {
  background: linear-gradient(90deg,
    rgba(255,255,255,.90) 0%,  rgba(255,255,255,.82) 32%,
    rgba(255,255,255,.46) 52%, rgba(255,255,255,.06) 74%,
    rgba(255,255,255,0)   100%);
}
.hero__ko  { color: var(--navy); }
.hero__sub { color: var(--stone-600); }
.hero__more { color: var(--stone-600); border-bottom-color: var(--stone-300); }
.hero__more:hover { color: var(--accent); border-bottom-color: var(--accent); }

.hero__index { border-top-color: var(--stone-200); }
.hero__index a { border-left-color: var(--stone-200); }
.hero__index a:hover { background: rgba(24,46,78,.035); }
.hero__index em { color: var(--accent); }
.hero__index b { color: var(--navy); }
.hero__index small { color: var(--stone-500); }

/* ---------- 어둡던 섹션 (CONTACT / 업무영역 하단 띠) ---------- */
.sec--dark { background: var(--stone-100); color: var(--stone-600); }
.sec--dark .sec__num { color: rgba(24,46,78,.07); }
.sec--dark .sec__title { color: var(--navy); }
.sec--dark .sec__lead { color: var(--stone-600); }
.sec--dark .prof__name { color: var(--navy); }
.sec--dark .prof__lead { color: var(--stone-600); }
.sec--dark .career { border-top-color: var(--stone-200); }
.sec--dark .career li { border-bottom-color: var(--stone-200); }
.sec--dark .career b { color: var(--navy); }

.sec--tex::before {
  background-image: url("../img/cta-band-light.jpg");
  background-image: image-set(url("../img/cta-band-light.webp") type("image/webp"),
                              url("../img/cta-band-light.jpg")  type("image/jpeg"));
  opacity: .62;
}

.cnt__note { color: var(--stone-600); }
.cnt__info div { border-bottom-color: var(--stone-200); }
.cnt__info dt { color: var(--stone-500); }
.cnt__info dd { color: var(--navy); }

/* ---------- 모바일 ---------- */
@media (max-width: 768px) {
  .hero__bg { background-position: 70% center; }
  .hero__veil {
    background: linear-gradient(180deg,
      rgba(255,255,255,.42) 0%,  rgba(255,255,255,.88) 20%,
      rgba(255,255,255,.88) 76%, rgba(255,255,255,.50) 100%);
  }
}

/* 상담 양식은 밝은 판 기준으로 짜여 있어 추가 보정이 필요 없다.
   어두운 판에서 볼 때만 아래가 style.css 의 기본값을 쓴다. */
