/* =========================
   evt_ptd_240108.css
   - 초보자용 전체 완성
   - 반응형(텍스트/이미지 자동)
   - 폰트 3단계 (Hero/Title/Body)
   - 단어 중간 깨짐 방지
   ========================= */

#evt_ptd_240108{
  font-family: Pretendard, -apple-system, BlinkMacSystemFont,
    "Segoe UI", Roboto, "Noto Sans KR",
    "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  color:#111;
  line-height:1.6;

  /* ======================
     ✅ 여기만 바꾸세요 (초보자 수정영역)
     ====================== */
  --FS_HERO_MIN: 26px;  --FS_HERO_MAX: 56px;  /* HERO 큰글씨 */
  --FS_TITLE_MIN: 20px; --FS_TITLE_MAX: 28px; /* 본문 타이틀 */
  --FS_BODY_MIN: 14px;  --FS_BODY_MAX: 18px;  /* 설명/본문 */

  --PX: clamp(16px, 4vw, 40px);              /* 좌우 여백 */
  --PY: clamp(32px, 6vw, 64px);              /* 상하 여백 */
  --RD: clamp(12px, 2vw, 16px);              /* 라운드 */

  --HERO_TOP: clamp(40px, 10vw, 90px);       /* HERO 글자 위에서부터 */
  /* ====================== */


  /* PRICE BAR tokens */
  --PRICEBAR_BORDER: #e7e1d6;
  --PRICEBAR_RADIUS: 16px;
  --PRICEBAR_ACCENT: #c79a37; /* gold */
  --PRICEBAR_TEXT: #111;

  /* 반응형 자동 계산 */
  --FS_HERO: clamp(var(--FS_HERO_MIN), 5vw, var(--FS_HERO_MAX));
  --FS_TITLE: clamp(var(--FS_TITLE_MIN), 3.2vw, var(--FS_TITLE_MAX));
  --FS_BODY: clamp(var(--FS_BODY_MIN), 2vw, var(--FS_BODY_MAX));

  /* 단어 중간 깨짐 방지 */
  word-break: keep-all;
  overflow-wrap: normal;
  word-wrap: normal;
}

#evt_ptd_240108 *{ box-sizing:border-box; }
#evt_ptd_240108 img{ display:block; width:100%; height:auto; }
#evt_ptd_240108 p{ margin:0; }
#evt_ptd_240108 b{ font-weight:800; }

#evt_ptd_240108 .fz-hero{
  font-size: var(--FS_HERO);
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: -0.03em;
}

#evt_ptd_240108 .fz-title{
  font-size: var(--FS_TITLE);
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: -0.02em;
}

#evt_ptd_240108 .fz-title-2{
  font-size: var(--FS_TITLE);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.02em;
}

/* 문장 안에서 b로 감싼 부분만 강조 */
#evt_ptd_240108 .fz-title-2 b{
  font-weight: 900;
}

#evt_ptd_240108 .fz-body{
  font-size: var(--FS_BODY);
  font-weight: 400;
  line-height: 1.75;
  letter-spacing: -0.02em;
	
}

/* 섹션 */
#evt_ptd_240108 .sec{ background:#fff; text-align:center; }
#evt_ptd_240108 .sec.ivory{ background:#f3f3eb; }

#evt_ptd_240108 .inner{
  max-width: 980px;
  margin: 0 auto;
  padding: var(--PY) var(--PX);
}

/* 유틸 */
#evt_ptd_240108 .left{ text-align:left; }
#evt_ptd_240108 .center{ text-align:center; }
#evt_ptd_240108 .round{ border-radius: var(--RD); overflow:hidden; }

#evt_ptd_240108 .mb10{ margin-bottom:10px; }
#evt_ptd_240108 .mb20{ margin-bottom:clamp(12px, 2vw, 20px); }
#evt_ptd_240108 .mb40{ margin-bottom:clamp(20px, 4vw, 40px); }
#evt_ptd_240108 .mt20{ margin-top:clamp(12px, 2vw, 20px); }
#evt_ptd_240108 .mt30{ margin-top:clamp(16px, 3vw, 32px); }

/* HERO */
#evt_ptd_240108 .hero{ position:relative; }
#evt_ptd_240108 .hero-txt{
  position:absolute;
  top: var(--HERO_TOP);
  left: var(--PX);
  right: var(--PX);
  text-align:left;
  text-shadow:0 2px 8px rgba(255,255,255,.35);
}

/* 2열 → 화면 좁으면 자동 1열 */
#evt_ptd_240108 .row{
  display:flex;
  flex-wrap:wrap;
  gap:clamp(12px, 2vw, 28px);
  align-items:center;
}
#evt_ptd_240108 .col{ flex:1; min-width:280px; }
#evt_ptd_240108 .col.img{ min-width:180px; }

/* SET 2개 */
#evt_ptd_240108 .grid{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
}
#evt_ptd_240108 .card{ flex:1; min-width:260px; }
#evt_ptd_240108 .caption{
  font-size: var(--FS_BODY);
  color:#333;
  margin-top:12px;
}

/* 배경 섹션 */
#evt_ptd_240108 .bg{
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
#evt_ptd_240108 .overlay{
  background:rgba(255,255,255,.72);
}

/* =========================
   8) PRICE BAR
   ========================= */
#evt_ptd_240108 .pricebar-link{
  display:block;
  text-decoration:none;
  color: inherit;
}
#evt_ptd_240108 .pricebar{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--PRICEBAR_BORDER);
  border-radius: var(--PRICEBAR_RADIUS);
  padding: 18px 20px;
  background:#fff;
}
#evt_ptd_240108 .pricebar__left,
#evt_ptd_240108 .pricebar__right{
  display:flex;
  align-items:center;
}
#evt_ptd_240108 .badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  background: var(--PRICEBAR_ACCENT);
  color: #fff;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: -0.02em;
}
#evt_ptd_240108 .price__value{
  color: var(--PRICEBAR_TEXT);
  font-weight: 900;
  font-size: clamp(22px, 4.6vw, 30px);
  letter-spacing: -0.03em;
  line-height: 1;
}

/* hover (optional) */
#evt_ptd_240108 .pricebar-link:hover .pricebar{
  background: #fbfaf8;
}

