/* 메인 홈페이지 — 물류 AI 강사 페이지(/logistics-ai-instructor/)와 같은 결로 맞춘 스타일.
   검정 첫 화면 + 주황 포인트 + 따뜻한 밝은 본문, 마지막 문의에서 다시 검정으로 마무리합니다.

   styles.css의 뼈대(그리드·여백·라이트박스·폼)는 그대로 쓰고, 홈 페이지만 색과 배치를 바꿉니다.
   모든 규칙을 body.home 아래에 두었기 때문에 물류 AI 강사 페이지(body.landing)에는 영향이 없습니다.
   색을 바꾸려면 아래 --accent / --accent-bright / --tint 세 값만 고치면 됩니다. */

body.home {
  /* 주황 계열 포인트 */
  --accent: #ba4308;         /* 밝은 배경 위 강조색 */
  --accent-deep: #8a3004;
  --accent-bright: #ffa94d;  /* 검정 배경 위 강조색 */
  --accent-punch: #ff7a1a;   /* 이름·슬로건·버튼에 쓰는 선명한 오렌지 */
  --dark: #11100f;
  --dark-2: #141210;
  --tint: #faf1e8;

  /* styles.css가 쓰는 이름에 그대로 연결 */
  --paper: #ffffff;
  --ink: #1b1a18;
  --ink-soft: #5c544c;
  --blue: var(--accent);
  --blue-deep: var(--accent-deep);
  --mist: var(--tint);
  --line: #e8dcd1;

  /* 글꼴 — Pretendard 한 계열, 로딩이 안 되면 시스템 글꼴로 이어집니다. */
  --sans: 'Pretendard Variable', Pretendard, system-ui, -apple-system, 'Malgun Gothic', '맑은 고딕', sans-serif;
  --serif: var(--sans);

  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.76;
  letter-spacing: -0.011em;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ── 제목·굵기 위계: 한 글꼴 안에서 굵기(750~800 / 650 / 400~500)와 크기로만 구분 ── */
body.home .h2 { margin: 0; font: 750 clamp(1.75rem, 3.1vw, 2.4rem)/1.32 var(--sans); letter-spacing: -0.028em; text-wrap: balance; }
body.home .h3 { font: 700 1.3rem/1.45 var(--sans); letter-spacing: -0.022em; }
body.home .h3--small { font-size: 1.06rem; }
body.home .section__head { max-width: 38em; }
body.home .section__head p { color: var(--ink-soft); }
body.home .note { color: #6b6157; }
body.home .section { padding: 108px 0; }
body.home .section--tint { background: var(--tint); }

/* ── 머리글 ── */
body.home .top {
  background: rgba(255, 255, 255, .92);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(10px) saturate(150%);
}
body.home .top__inner { height: 72px; }
body.home .brand { font: 700 1.2rem/1 var(--sans); letter-spacing: -0.03em; }
body.home .brand span { font: 500 .84rem/1 var(--sans); color: #6b6157; }
body.home .nav a { color: #4b443d; font-weight: 500; letter-spacing: -0.015em; transition: color .15s; }
body.home .nav a:hover { color: var(--accent); }
body.home .btn { font-weight: 650; letter-spacing: -0.01em; }
body.home .btn:hover { background: var(--accent-deep); }
body.home .link { color: var(--ink); }

/* ── 첫 화면: 검정 바탕 + 큰 이름 + 주황 강조 + 오른쪽 프로필 카드 ── */
body.home .hero--split {
  position: relative;
  display: block;
  overflow: hidden;
  min-height: 0;
  padding: 0;
  color: #fff;
  background-color: var(--dark);
  /* 캡처처럼 아주 옅은 격자 — 배경에만 결을 더합니다 */
  background-image:
    linear-gradient(rgba(255, 255, 255, .026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .026) 1px, transparent 1px);
  background-size: 88px 88px;
  background-position: center top;
}
body.home .hero--split::before {
  content: '';
  position: absolute; right: -6%; top: -40%;
  width: 70%; height: 160%;
  background: radial-gradient(closest-side, rgba(242, 168, 120, .22), rgba(242, 168, 120, 0) 72%);
  pointer-events: none;
}

body.home .hero__grid {
  position: relative; z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 350px;
  align-items: center;
  gap: 52px;
  max-width: 1240px;
  margin: 0 auto;
  padding: 62px 24px 54px;
}
body.home .hero__text { max-width: 40rem; padding: 0; }

/* 1. 위쪽 상태 뱃지 — 오렌지 점 + 반투명 알약 */
body.home .hero__status {
  display: inline-flex; align-items: center; gap: 9px;
  margin: 0 0 26px; padding: 7px 15px 7px 13px;
  border: 1px solid rgba(255, 169, 77, .26);
  border-radius: 999px;
  background: rgba(255, 255, 255, .045);
  color: #e9e1d8; font-size: .85rem; font-weight: 500; letter-spacing: -0.005em;
}
body.home .hero__dot {
  flex: none; width: 7px; height: 7px; border-radius: 50%;
  background: var(--accent-bright);
  box-shadow: 0 0 0 3px rgba(255, 169, 77, .16);
  animation: hero-dot 2.6s ease-in-out infinite;
}
@keyframes hero-dot {
  0%, 100% { box-shadow: 0 0 0 3px rgba(255, 169, 77, .16); }
  50% { box-shadow: 0 0 0 7px rgba(255, 169, 77, .04); }
}
@media (prefers-reduced-motion: reduce) { body.home .hero__dot { animation: none; } }

/* 2. 이름 — 첫 화면에서 가장 큰 글자 */
body.home .hero__title { display: block; margin: 0; }
body.home .hero__name {
  display: block;
  margin: 0;
  color: #fff;
  font: 850 clamp(3.2rem, 5.5vw, 4.2rem)/1.02 var(--sans);
  letter-spacing: -0.04em;
}
body.home .hero__sub {
  display: block;
  margin: 16px 0 32px;
  color: #8e8880;
  font: 600 clamp(1.4rem, 1.9vw, 1.5rem)/1.3 var(--sans);
  letter-spacing: 0.06em;
}

/* 3. 슬로건 — 흰 줄과 주황 줄로 강약 */
body.home .hero__slogan {
  margin: 0 0 20px;
  font: 700 clamp(1.5rem, 2.2vw, 1.8rem)/1.46 var(--sans);
  letter-spacing: -0.032em;
}
body.home .hero__slogan > span { display: block; }
body.home .hero__slogan-1 { color: #fff; }
body.home .hero__slogan-2 { color: #fff; }
body.home .hero__slogan .highlight {
  display: inline;
  color: var(--accent-punch);
  font-weight: 850;
  letter-spacing: -0.035em;
  text-shadow: 0 0 26px rgba(255, 122, 26, .38);
}

/* 4. 두 줄 요약 */
body.home .hero__lead {
  margin: 20px 0 0;
  color: #b8b1a9;
  font-size: 1rem;
  line-height: 1.9;
  letter-spacing: -0.006em;
}

/* 5. 전문 분야 태그 — 세 개씩 두 줄로 가지런히 */
body.home .hero__tags {
  list-style: none; display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  margin: 28px 0 0; padding: 0;
}
body.home .hero__tags li {
  white-space: nowrap;
  padding: 8px 18px;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 999px;
  background: rgba(255, 255, 255, .05);
  color: #dcd6ce;
  font-size: .95rem; font-weight: 500; letter-spacing: -0.005em;
}

/* 6. 버튼 세 개 — 채운 주황 / 테두리 / 링크 */
body.home .hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 34px; }
body.home .hero__actions .btn { min-height: 54px; padding: 0 26px; gap: 9px; }
body.home .hero__actions .btn:not(.btn--ghost),
body.home .top .btn {
  background: var(--accent-punch);
  color: #111;
  font-weight: 750;
  box-shadow: 0 10px 22px rgba(255, 122, 26, .22);
}
body.home .hero__actions .btn:not(.btn--ghost):hover,
body.home .top .btn:hover {
  background: #ff8c3a;
  color: #111;
  box-shadow: 0 14px 30px rgba(255, 122, 26, .34);
}
body.home .hero__actions .btn--ghost {
  background: rgba(255, 255, 255, .045);
  border: 1px solid rgba(255, 255, 255, .22);
  color: #fff;
  box-shadow: none;
}
body.home .hero__actions .btn--ghost:hover {
  background: rgba(255, 255, 255, .1);
  color: #fff;
  box-shadow: none;
}
body.home .hero__link {
  display: inline-flex; align-items: center; gap: 7px;
  padding-bottom: 3px;
  border-bottom: 1px solid rgba(255, 255, 255, .34);
  color: #fff; font-size: .98rem; font-weight: 600; text-decoration: none;
  letter-spacing: -0.012em;
}
body.home .hero__link:hover { color: var(--accent-bright); border-color: currentColor; }
body.home .hero__arrow { transition: transform .18s ease; }
body.home .hero__actions a:hover .hero__arrow { transform: translateX(3px); }

/* 7. 오른쪽 프로필 카드 — 원본 비율(2:3)로 허리선까지, 아래에 자격 캡슐 */
body.home .hero__frame {
  position: relative;
  justify-self: center;
  width: 100%;
  max-width: 330px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(255, 169, 77, .30);
  border-radius: 24px;
  background: #1b1917;
  box-shadow: 0 30px 70px rgba(0, 0, 0, .52);
}
body.home .hero__frame img {
  display: block;
  width: 100%;
  aspect-ratio: 2 / 3; /* 원본 사진 비율 — 허리선과 팔짱 낀 소매까지 다 보이게 */
  object-fit: cover;
  object-position: center top;
}
body.home .hero__badge {
  position: absolute; right: 14px; bottom: 14px;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 14px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 999px;
  background: rgba(17, 16, 15, .58);
  backdrop-filter: blur(8px);
  color: #fff; font-size: .82rem; font-weight: 600; letter-spacing: -0.008em;
}


/* ── 핵심 강점 수치 — 첫 화면 바로 아래, 검정 바탕 위의 카드 네 장 ── */
body.home .impact {
  position: relative;
  padding: 4px 0 64px;
  color: #fff;
  background-color: var(--dark);
  background-image:
    linear-gradient(rgba(255, 255, 255, .026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .026) 1px, transparent 1px);
  background-size: 88px 88px;
  background-position: center top;
}
body.home .impact::after {
  content: '';
  position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
  background: linear-gradient(90deg, rgba(242, 168, 120, 0), rgba(242, 168, 120, .42), rgba(242, 168, 120, 0));
}
body.home .impact__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
body.home .impact__card {
  padding: 26px 26px 24px;
  background: #1b1917;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 16px;
}
body.home .impact__num {
  display: flex; align-items: baseline; gap: 3px;
  margin: 0;
  color: #fff;
  font: 800 clamp(1.8rem, 2.6vw, 2.4rem)/1.05 var(--sans);
  letter-spacing: -0.045em;
}
body.home .impact__num span {
  color: var(--accent-punch);
  font-size: .56em; font-weight: 700; letter-spacing: -0.01em;
}
body.home .impact__label { margin: 10px 0 0; color: #f3ede6; font-size: 1.15rem; letter-spacing: -0.008em; }

/* ── 강사 소개 ── */
body.home .about { grid-template-columns: 1fr 1.12fr; gap: 40px 64px; }
body.home .about__belief {
  margin: 26px 0 0;
  padding-left: 20px;
  border-left: 3px solid var(--accent);
  color: var(--ink-soft);
  font: 400 1.1rem/1.8 var(--sans);
  letter-spacing: -0.012em;
  max-width: 24em;
}
body.home .route::before { border-left: 2px dashed var(--accent); opacity: .42; }
body.home .route__stop::before { border: 2px solid var(--accent); background: var(--paper); }
body.home .route__stop--now::before { background: var(--accent); box-shadow: 0 0 0 6px rgba(186, 67, 8, .10); }
body.home .route__stop h3 { font: 700 1.18rem/1.5 var(--sans); letter-spacing: -0.02em; }
body.home .route__stop p { color: var(--ink-soft); }
body.home .values { margin: 6px 0 0; border-top: 1px solid var(--line); }
body.home .values dt { font-weight: 650; letter-spacing: -0.015em; }
body.home .values dd { color: var(--ink-soft); letter-spacing: -0.008em; }

/* ── 경력과 자격: 숫자 네 칸 + 자격 카드 세 열 ── */
body.home .creds { display: block; }
body.home .creds__head { max-width: 40em; }
body.home .creds__head p { margin: 12px 0 0; color: var(--ink-soft); }
body.home .ledger {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin: 44px 0 0;
  border-top: 1px solid var(--line);
}
body.home .ledger__row {
  display: block;
  padding: 24px 24px 4px 0;
  border-top: 0;
}
body.home .ledger__row:last-child { border-bottom: 0; }
body.home .ledger dt {
  font: 800 clamp(1.45rem, 2.6vw, 1.95rem)/1.15 var(--sans);
  letter-spacing: -0.035em;
  color: var(--accent);
}
body.home .ledger dd { margin: 10px 0 0; color: #4a423b; font-size: 1.12rem; line-height: 1.5; letter-spacing: -0.008em; }
body.home .ledger small { display: block; margin-top: 4px; font-size: 1rem; color: #6b6157; }

body.home .creds__body { margin-top: 60px; }
body.home .badges { grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 18px; }
body.home .badge a,
body.home .badge div {
  padding: 12px 12px 18px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  transition: transform .18s, box-shadow .18s, border-color .18s;
}
body.home .badge a:hover {
  border-color: rgba(186, 67, 8, .42);
  box-shadow: 0 14px 30px rgba(40, 24, 10, .09);
  transform: translateY(-2px);
}
body.home .badge img { aspect-ratio: 16 / 10; object-fit: contain; object-position: center; padding: 6px; border-radius: 9px; background: #f8f0e8; }
body.home .badge strong { font-weight: 650; letter-spacing: -0.015em; }
body.home .badge span { color: var(--ink-soft); }
body.home .more-creds { gap: 8px; }
body.home .more-creds li { background: #fff; border: 1px solid var(--line); color: var(--ink-soft); }

/* ── 강의 프로그램 ── */
body.home .programs { column-gap: 56px; }
body.home .program { padding: 26px 0; border-top: 1px solid var(--line); }
body.home .program__name { font: 700 1.22rem/1.45 var(--sans); letter-spacing: -0.022em; }
body.home .program__who { color: var(--accent); font-weight: 600; }
body.home .program__desc { color: var(--ink-soft); }
body.home .program__link { color: var(--accent); }
body.home .program__link:hover { color: var(--accent-deep); }
body.home .steps { margin-top: 22px; }
body.home .steps li { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 22px; }
body.home .steps li::before { color: var(--accent); font-weight: 800; letter-spacing: -0.03em; }
body.home .steps strong { font-weight: 650; }
body.home .steps span { color: var(--ink-soft); }

/* ── 강의 실적과 현장 ── */
body.home .records li { border-top: 1px solid var(--line); }
body.home .records__when { color: #6b6157; }
body.home .records__org { letter-spacing: -0.012em; }
body.home a.records__org:hover { color: var(--accent); }
body.home .records__topic { color: var(--ink-soft); }
body.home .gallery__stage { background: #f2e6da; border-radius: 14px; }
body.home .gallery__thumbs button[aria-current="true"] { outline-color: var(--accent); }
body.home .quotes { margin-top: 76px; }
body.home .quote p { font: 400 1.1rem/1.82 var(--sans); letter-spacing: -0.012em; }
body.home .quote p::before { color: var(--accent); font: 800 2.4rem/1 var(--sans); }
body.home .quote footer { color: #6b6157; }
body.home .review img { border-color: var(--line); background: #fff; }
body.home .review:hover span { color: var(--accent); }

/* ── 문의: 첫 화면과 짝을 이루는 검정 ── */
body.home .contact { background: var(--dark-2); color: #fff; }
body.home .contact .h2 { color: #fff; }
body.home .contact__intro p { color: #ddd2c8; }
body.home .channels li { border-top-color: rgba(255, 255, 255, .14); }
body.home .channels span { color: #c9b8ab; }
body.home .channels a { color: #fff; }
body.home .channels a:hover { color: var(--accent-bright); }
body.home .form { background: #fff; color: var(--ink); border-radius: 22px; padding: 36px; box-shadow: 0 30px 64px rgba(0, 0, 0, .38); }
body.home .form .btn { background: var(--accent-punch); color: #111; font-weight: 750; }
body.home .form .btn:hover { background: #ff8c3a; }
body.home .lightbox { background: rgba(17, 16, 15, .95); }
body.home .field input:focus,
body.home .field textarea:focus { outline-color: var(--accent); border-color: var(--accent); }
body.home .consent input { accent-color: var(--accent); }
body.home .form__msg.is-ok { color: #1c7a4a; }
body.home .form__msg.is-err { color: #b42318; }

/* ── 바닥글 ── */
body.home .foot { background: #fff; border-top: 1px solid var(--line); color: #6b6157; }
body.home .foot__links a:hover { color: var(--accent); }

/* ── 태블릿 ── */
@media (max-width: 960px) {
  body.home .section { padding: 88px 0; }
  body.home .about { grid-template-columns: 1fr; gap: 36px 0; }
  body.home .hero__grid { grid-template-columns: 1fr; gap: 36px; padding: 52px 24px 60px; }
  body.home .hero__text { max-width: 38rem; }
  body.home .hero__frame { max-width: 300px; margin: 0 auto; }
  body.home .badges { grid-template-columns: 1fr 1fr; }
  body.home .creds__body { margin-top: 52px; }
}

/* ── 모바일 ── */
@media (max-width: 720px) {
  body.home { font-size: 16px; }
  body.home .section { padding: 72px 0; }
  body.home .hero__grid { padding: 30px 16px 44px; gap: 26px; }
  body.home .hero__text { display: block; padding: 0; }
  body.home .hero__status { margin-bottom: 20px; padding: 6px 13px 6px 11px; font-size: .79rem; }
  body.home .hero__name { font-size: clamp(2.7rem, 12vw, 3.3rem); }
  body.home .hero__sub { margin: 10px 0 24px; font-size: 1.02rem; letter-spacing: 0.05em; }
  body.home .hero__slogan { font-size: clamp(1.2rem, 4.9vw, 1.42rem); line-height: 1.5; }
  body.home .hero__lead { margin-top: 16px; font-size: .95rem; line-height: 1.85; }
  body.home .hero__tags { display: flex; flex-wrap: wrap; margin-top: 20px; gap: 6px; }
  body.home .hero__tags li { padding: 7px 14px; font-size: .84rem; }
  body.home .hero__actions { margin-top: 26px; gap: 12px; }
  body.home .hero__actions .btn { min-height: 50px; padding: 0 22px; flex: 1 1 auto; }
  body.home .hero__link { font-size: .92rem; }
  body.home .hero__frame { max-width: 265px; margin: 0 auto; }
  body.home .impact { padding: 2px 0 48px; }
  body.home .impact__grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  body.home .impact__card { padding: 18px 18px 16px; border-radius: 14px; }
  body.home .impact__num { font-size: 1.8rem; }
  body.home .impact__label { margin-top: 6px; font-size: 1.05rem; }
  body.home .about { gap: 32px; }
  body.home .ledger { grid-template-columns: 1fr 1fr; margin-top: 32px; }
  body.home .ledger__row { padding: 18px 16px 14px 0; }
  body.home .ledger__row:nth-child(n+3) { border-top: 1px solid var(--line); }
  body.home .badges { grid-template-columns: 1fr; }
  body.home .quotes { margin-top: 52px; }
  body.home .form { padding: 26px 20px; }
  body.home .section__head { margin-bottom: 36px; }
}

body.home .impact__card--book .impact__book-title {
  margin: 0;
  color: #fff;
  font: 800 clamp(1.28rem, 1.85vw, 1.6rem)/1.2 var(--sans);
  letter-spacing: -0.035em;
  word-break: keep-all;
}
body.home .impact__card--book .impact__book-title span {
  color: var(--accent-punch);
}
body.home .impact__card--book .impact__book-tag {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0 0 8px;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(255, 122, 26, .14);
  border: 1px solid rgba(255, 122, 26, .35);
  color: var(--accent-punch);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* ── 강사 소개 개편안 (about-v2) ── */
body.home .about-v2 { display: block; max-width: 1240px; margin: 0 auto; }
body.home .about-v2__head { max-width: 44em; margin-bottom: 38px; text-align: left; }
body.home .about-v2__eyebrow {
  display: inline-block;
  font: 800 .82rem/1 var(--sans);
  letter-spacing: .08em;
  color: var(--accent);
  text-transform: uppercase;
  margin-bottom: 12px;
}
body.home .about-v2__lead {
  margin-top: 16px;
  color: var(--ink-soft);
  font: 400 1.12rem/1.7 var(--sans);
  letter-spacing: -0.012em;
}
body.home .about-v2__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
body.home .about-v2__card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 30px 28px 28px;
  transition: transform .18s, box-shadow .18s, border-color .18s;
}
body.home .about-v2__card:hover {
  border-color: rgba(186, 67, 8, .35);
  box-shadow: 0 12px 28px rgba(40, 24, 10, .07);
  transform: translateY(-2px);
}
body.home .about-v2__num {
  display: inline-block;
  font: 750 .82rem/1 var(--sans);
  letter-spacing: .02em;
  color: var(--accent);
  background: rgba(186, 67, 8, .08);
  padding: 5px 12px;
  border-radius: 999px;
  margin-bottom: 14px;
}
body.home .about-v2__card h3 {
  margin: 0 0 10px;
  font: 750 1.28rem/1.38 var(--sans);
  letter-spacing: -0.022em;
  color: var(--dark);
}
body.home .about-v2__card p {
  margin: 0;
  color: var(--ink-soft);
  font: 400 .98rem/1.68 var(--sans);
  letter-spacing: -0.01em;
}
body.home .about-v2__trust {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 24px;
  padding: 22px 28px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
}
body.home .about-v2__trust-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
body.home .about-v2__trust-item strong {
  font: 800 1.22rem/1.2 var(--sans);
  color: var(--dark);
  letter-spacing: -0.02em;
}
body.home .about-v2__trust-item span {
  font-size: 1.02rem;
  line-height: 1.5;
  color: #4a423b;
}
@media (max-width: 720px) {
  body.home .about-v2__grid { grid-template-columns: 1fr; gap: 14px; }
  body.home .about-v2__card { padding: 22px 20px; }
  body.home .about-v2__trust { grid-template-columns: 1fr; gap: 14px; padding: 20px; }
}

/* ── 강의 주제 마퀴 ── */
body.home .mq-sec { background: var(--dark); color: #fff; padding: 84px 0 88px; overflow: hidden; }
body.home .mq-sec__head { max-width: 1120px; margin: 0 auto 34px; }
body.home .mq-sec__eyebrow { margin: 0 0 10px; color: var(--accent-bright); font: 750 .78rem/1 var(--sans); letter-spacing: .18em; }
body.home .mq-sec .h2 { color: #fff; }
body.home .mq { position: relative; overflow: hidden; padding: 9px 0; }
body.home .mq::before,
body.home .mq::after { content: ""; position: absolute; top: 0; bottom: 0; width: 96px; z-index: 2; pointer-events: none; }
body.home .mq::before { left: 0; background: linear-gradient(90deg, var(--dark), rgba(17,16,15,0)); }
body.home .mq::after { right: 0; background: linear-gradient(270deg, var(--dark), rgba(17,16,15,0)); }
body.home .mq__row { display: flex; width: max-content; animation: mq-scroll 46s linear infinite; }
body.home .mq__row--rev { animation-direction: reverse; animation-duration: 52s; }
body.home .mq__list { display: flex; gap: 14px; margin: 0; padding: 0 14px 0 0; list-style: none; }
body.home .mq__list li {
  flex: none; padding: 12px 22px; border-radius: 999px;
  background: #1c1a17; border: 1px solid rgba(255,255,255,.16);
  color: #eae3db; font: 600 1rem/1.2 var(--sans); letter-spacing: -.01em; white-space: nowrap;
}
@keyframes mq-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { body.home .mq__row { animation: none; } }
@media (max-width: 720px) {
  body.home .mq-sec { padding: 64px 0 68px; }
  body.home .mq-sec__head { padding: 0 24px; margin-bottom: 26px; }
  body.home .mq__list { gap: 10px; padding-right: 10px; }
  body.home .mq__list li { padding: 10px 18px; font-size: .94rem; }
}

/* 마퀴 — 윗줄은 알약 칩, 아랫줄은 점으로 이은 텍스트 흐름 */
body.home .mq__row { animation-duration: 58s; }
body.home .mq__row--rev { animation-duration: 44s; animation-direction: reverse; }
body.home .mq__list li.is-core { background: rgba(255,122,26,.14); border-color: rgba(255,169,77,.55); color: #ffd6ae; }
body.home .mq-sec__note { margin: 12px 0 0; color: #b8a99c; font-size: .98rem; }
body.home .mq__list--dots li.dot { color: #6d635a; padding: 0 6px; }
body.home .mq__row--dots { padding: 4px 0 0; }
body.home .mq__list--dots { gap: 0; padding-right: 0; align-items: center; }
body.home .mq__list--dots li { padding: 0 10px; background: none; border: 0; border-radius: 0; color: #9c9187; }