/* ==========================================================
   작두 타는 곽도사 — 랜딩 (이미지 조립형)
   600px 컬럼 중앙 배치, 모바일은 100% 폭으로 축소
   ========================================================== */

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  background: #01091c;
  overflow-x: hidden;
  -webkit-tap-highlight-color: transparent;
}

img { display: block; width: 100%; height: auto; }
a   { display: block; }

/* 섹션: 전체 폭 배경 + 600px 컬럼 */
.sec {
  width: 100%;
  display: flex;
  justify-content: center;
  position: relative;
}
.col {
  width: 100%;
  max-width: 600px;
  position: relative;
}

/* 1. 헤더 */
.sec--header {
  background:
    linear-gradient(177.8deg, rgba(96, 6, 2, 0.75) 10.9%, rgba(12, 12, 12, 0.75) 28.1%, rgba(0, 0, 0, 0.75) 65.6%, rgba(54, 9, 7, 0.75) 78.3%),
    #01091c;
  box-shadow: 0 0 50px rgba(0, 0, 0, 0.1);
}
.header {
  display: flex;
  align-items: center;
  height: 80px;
}
.header__logo { flex: 1 1 0; min-width: 0; }
.header__logo img { width: 100%; }
.header__nav {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
}
.header__nav img { width: auto; height: 44px; }

/* 2. 메인 비주얼: 1800px 배경 + 600px 인물 */
.sec--hero {
  background: url("assets/hero-bg.jpg") center top / auto 100% no-repeat #01091c;
}
.sec--hero::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(0deg, rgba(1, 13, 27, 0) 50%, rgba(1, 13, 27, 0.3) 100%);
  pointer-events: none;
}

/* 3~4. 다크 텍스처 구간 */
.sec--dark {
  background: url("assets/texture.jpg") center / cover no-repeat #04050a;
  box-shadow: 0 0 50px rgba(0, 0, 0, 0.1);
}

/* 5. 적중 인증 */
.sec--proof {
  background: linear-gradient(180deg, #1b1111 0%, #010101 51%, #161010 100%);
  box-shadow: 0 0 50px rgba(0, 0, 0, 0.1);
}

/* 6. 제휴 CTA */
.sec--cta { background: #000; }

/* 7. 푸터 */
.sec--footer { background: #111; }

/* 모바일 */
@media (max-width: 600px) {
  .header { height: 13.33vw; }           /* 80/600 */
  .header__nav { right: 3.33vw; }
  .header__nav img { height: 7.33vw; }  /* 44/600 */
  .sec--hero { background-size: auto 100%; }
}
