/* ===== 1. 폰트 불러오기 (Font Face) ===== */

/* 온글잎 의슬이체 */
@font-face {
    font-family: 'OngleipWFontList';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2501-1@1.1/Ownglyph_wiseelist-Rg.woff2') format('woff2');
    font-weight: normal;
    font-display: swap;
}

/* 페이퍼로지 (다중 두께 지원) */
@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-1Thin.woff2') format('woff2');
    font-weight: 100;
    font-display: swap;
}
@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-2ExtraLight.woff2') format('woff2');
    font-weight: 200;
    font-display: swap;
}
@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-3Light.woff2') format('woff2');
    font-weight: 300;
    font-display: swap;
}
@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-4Regular.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-5Medium.woff2') format('woff2');
    font-weight: 500;
    font-display: swap;
}
@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-6SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-display: swap;
}
@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-7Bold.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}
@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-8ExtraBold.woff2') format('woff2');
    font-weight: 800;
    font-display: swap;
}
@font-face {
    font-family: 'Paperozi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-9Black.woff2') format('woff2');
    font-weight: 900;
    font-display: swap;
}

/* 대구동성로체 — 비주얼(3슬라이드) 2·3번 상단 서브타이틀 */
@font-face {
    font-family: 'DaeguDongseongRo';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2511-1@1.0/DaeguDongseongro-Regular.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'DaeguDongseongRo';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2511-1@1.0/DaeguDongseongro-Bold.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}

/* 평창평화체 — 비주얼 첫 문장(line1·상단 p) */
@font-face {
    font-family: 'PyeongchangPeace';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2206-02@1.0/PyeongChangPeace-Light.woff2') format('woff2');
    font-weight: 300;
    font-display: swap;
}
@font-face {
    font-family: 'PyeongchangPeace';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2206-02@1.0/PyeongChangPeace-Bold.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}

/* 에이투지체 — 비주얼 1번 슬라이드 제목 */
@font-face {
    font-family: 'A2z';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2601-6@1.0/에이투지체-1Thin.woff2') format('woff2');
    font-weight: 100;
    font-display: swap;
}
@font-face {
    font-family: 'A2z';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2601-6@1.0/에이투지체-2ExtraLight.woff2') format('woff2');
    font-weight: 200;
    font-display: swap;
}
@font-face {
    font-family: 'A2z';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2601-6@1.0/에이투지체-3Light.woff2') format('woff2');
    font-weight: 300;
    font-display: swap;
}
@font-face {
    font-family: 'A2z';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2601-6@1.0/에이투지체-4Regular.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'A2z';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2601-6@1.0/에이투지체-5Medium.woff2') format('woff2');
    font-weight: 500;
    font-display: swap;
}
@font-face {
    font-family: 'A2z';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2601-6@1.0/에이투지체-6SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-display: swap;
}
@font-face {
    font-family: 'A2z';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2601-6@1.0/에이투지체-7Bold.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}
@font-face {
    font-family: 'A2z';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2601-6@1.0/에이투지체-8ExtraBold.woff2') format('woff2');
    font-weight: 800;
    font-display: swap;
}
@font-face {
    font-family: 'A2z';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2601-6@1.0/에이투지체-9Black.woff2') format('woff2');
    font-weight: 900;
    font-display: swap;
}

/* 상상꽃길 — 비주얼 1번 슬라이드 본문(평범한·처음부터) */
@font-face {
    font-family: 'FlowerRoad';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_three@1.0/SangSangFlowerRoad.woff') format('woff');
    font-weight: normal;
    font-display: swap;
}

/* 학교안심 칠판지우개 */
@font-face {
    font-family: 'SchoolSafetyChalkboardEraser';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-5@1.0/HakgyoansimChilpanjiugaeTTF-L.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'SchoolSafetyChalkboardEraser';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-5@1.0/HakgyoansimChilpanjiugaeTTF-B.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}

/* 여기어때 잘난체 고딕 */
@font-face {
    font-family: 'YeogiOttaeJalnanGothic';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_231029@1.1/JalnanGothic.woff') format('woff');
    font-weight: normal;
    font-display: swap;
}

/* 원스토어 모바일팝 */
@font-face {
    font-family: 'OneStoreMobilePop';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/ONE-Mobile-POP.woff') format('woff');
    font-weight: normal;
    font-display: swap;
}

/* 경복궁 수문장 Title (3가지 두께) */
@font-face {
    font-family: 'GyeongbokgungSumunjangTitle';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2511-3@1.0/Sumunjang_TitleL.woff2') format('woff2');
    font-weight: 300;
    font-display: swap;
}
@font-face {
    font-family: 'GyeongbokgungSumunjangTitle';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2511-3@1.0/Sumunjang_TitleM.woff2') format('woff2');
    font-weight: 500;
    font-display: swap;
}
@font-face {
    font-family: 'GyeongbokgungSumunjangTitle';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2511-3@1.0/Sumunjang_TitleB.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}

/* --- 1. 신규 추가 폰트 로드 --- */
/* KCC-혜림체 (정갈한 손글씨) */
@font-face {
    font-family: 'KccHyeri';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2411-3@1.0/KCCHyerim-Regular.woff2') format('woff2');
    font-weight: normal;
    font-display: swap;
}
/* 안성탕면 ESG 에코체 (친근한 브랜드/음식 느낌) */
@font-face {
    font-family: 'AnsungtangmyunEsgEco';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_11-01@1.0/Ansungtangmyun-ESG.woff2') format('woff2');
    font-weight: normal;
    font-display: swap;
}

/* 태나다체 Taenada (스텐실 스타일 제목용 — 포스터·배너·강조 문구)
   참고: 넓은 자폭·곧은 획으로 가독성 좋음. 제목·슬로건·숫자 강조에 적합. */
@font-face {
    font-family: 'Taenada';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2210-2@1.0/Tenada.woff2') format('woff2');
    font-weight: normal;
    font-display: swap;
}

/* 학교안심 칠판지우개 (중복 방지 확인) */
@font-face {
    font-family: 'SchoolSafetyChalkboardEraser';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-5@1.0/HakgyoansimChilpanjiugaeTTF-L.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'SchoolSafetyChalkboardEraser';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-5@1.0/HakgyoansimChilpanjiugaeTTF-B.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}

/* ============================================================
   1. 신규 추가 폰트 로드 (The Final Collection)
   ============================================================ */

/* 정림사지체 (전통적이고 정갈함) */
@font-face {
    font-family: 'JeongnimsaJi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_231029@1.1/Jeongnimsaji-R.woff2') format('woff2');
    font-weight: 400; font-display: swap;
}
@font-face {
    font-family: 'JeongnimsaJi';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_231029@1.1/Jeongnimsaji-B.woff2') format('woff2');
    font-weight: 700; font-display: swap;
}

/* 넥슨 고딕 (깔끔한 게임/UI 느낌) */
@font-face {
    font-family: 'NexonLv2Gothic';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON Lv2 Gothic Light.woff') format('woff');
    font-weight: 300; font-display: swap;
}
@font-face {
    font-family: 'NexonLv2Gothic';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON Lv2 Gothic.woff') format('woff');
    font-weight: 400; font-display: swap;
}
@font-face {
    font-family: 'NexonLv2Gothic';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON Lv2 Gothic Bold.woff') format('woff');
    font-weight: 700; font-display: swap;
}

/* 카페24 프로슬림 (비즈니스/커머스 최적화) */
@font-face {
    font-family: 'Cafe24ProSlim';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2511-1@1.0/Cafe24PROSlim-Light.woff2') format('woff2');
    font-weight: 300; font-display: swap;
}
@font-face {
    font-family: 'Cafe24ProSlim';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2511-1@1.0/Cafe24PROSlim-Regular.woff2') format('woff2');
    font-weight: 400; font-display: swap;
}
@font-face {
    font-family: 'Cafe24ProSlim';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2511-1@1.0/Cafe24PROSlim-Bold.woff2') format('woff2');
    font-weight: 700; font-display: swap;
}

/* 충주김생체 (예술적인 서예 느낌) */
@font-face {
    font-family: 'ChungjuKimsaeng';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2312-1@1.1/ChungjuKimSaengTTF.woff2') format('woff2');
    font-weight: normal; font-display: swap;
}

/* 김좌진장군체 (강인하고 묵직함) */
@font-face {
    font-family: 'KimJwaJinGeneral';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/GenKJwajinOTF-Rg.woff') format('woff');
    font-weight: 400; font-display: swap;
}
@font-face {
    font-family: 'KimJwaJinGeneral';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/GenKJwajinOTF-Bd.woff') format('woff');
    font-weight: 700; font-display: swap;
}

/* ===== 2. 변수 (색상 + 폰트) ===== */
:root {
    --color-deep-green: #14331e;
    --color-gold: #f7a000;
    --color-white: #fff;
    --color-black: #1a1a1a;
    /* 콘텐츠 최대 너비·섹션 패딩 (시안 통일) */
    --content-max: 1200px;
    --content-wide: 1280px;
    --section-padding-x: clamp(1rem, 4vw, 2.5rem);
    --section-padding-y: clamp(3rem, 8vw, 5rem);
    /* 폰트: 기존 호환 + 추가 */
    --font-main: 'Paperozi', sans-serif;
    --font-title: 'YeogiOttaeJalnanGothic', sans-serif;
    --font-title-bold: 'YeogiOttaeJalnanGothic', sans-serif;
    --font-title-elegant: 'GyeongbokgungSumunjangTitle', serif;
    --font-point: 'OneStoreMobilePop', sans-serif;
    --font-accent: 'OngleipWFontList', cursive;
    --font-chalk: 'SchoolSafetyChalkboardEraser', sans-serif;
    /* 신규 추가: 제목·감성·특수용 */
    --font-title-food: 'AnsungtangmyunEsgEco', sans-serif;
    --font-accent-soft: 'OngleipWFontList', cursive;
    --font-accent-clean: 'KccHyeri', cursive;
    /* The Final Collection: 디자인 역할별 변수 */
    --font-ui: 'NexonLv2Gothic', sans-serif;
    --font-admin: 'Cafe24ProSlim', sans-serif;
    --font-head-strong: 'KimJwaJinGeneral', serif;
    --font-head-trad: 'JeongnimsaJi', serif;
    --font-head-art: 'ChungjuKimsaeng', cursive;
    --font-head-modern: 'YeogiOttaeJalnanGothic', sans-serif;
    --font-food: 'AnsungtangmyunEsgEco', sans-serif;
    --font-stencil: 'Taenada', sans-serif;  /* 태나다체 — 제목·슬로건·강조 */
    --font-visual-subtitle: 'PyeongchangPeace', sans-serif; /* 비주얼 첫 문장(슬라이드 line1·상단 p) */
    --font-visual-slide1: 'FlowerRoad', sans-serif; /* 비주얼 1번 본문 — 상상꽃길 */
    /* 왼쪽 세로선 + 로고 정렬 (로고 원 중심이 선 위에 오도록) */
    --line-x: 4.5rem;
    /* 레일 네비가 있을 때 글자 영역을 한 글자 정도 안으로 밀기 (1024px 이상에서만 적용) */
    --rail-content-inset: 0;
    --logo-size: clamp(70px, 12vw, 90px);
    --logo-size-scrolled: clamp(48px, 8vw, 56px);

    /* 히어로 문구 줄별 폰트 (폰트명만 바꿔서 적용)
       사용 예: var(--font-title) / var(--font-head-trad) / var(--font-head-art) */
    --hero-font-line1: var(--font-head-trad);      /* 정림사지체 */
    --hero-font-line2: var(--font-head-art);       /* 충주김생체 */
    --hero-font-line3: var(--font-title);           /* 여기어때 잘난체 — 합리적인 투자로… */
    --hero-font-sub: var(--font-main);             /* 2층 매장에서도 월매출이! */
    --hero-font-sales: var(--font-title);          /* ₩ 134,996,800 */
    --hero-font-caption: var(--font-main);         /* 건대점 2022년 5월 매출기준 */
}

/*
  ===== 폰트 활용 가이드 (참고용) =====
  [기존]
  --font-title-elegant (수문장체): 브랜드 메시지, 메뉴 이름(마제소바, 돈카츠) → 장인 정신
  --font-point (원모바일팝): 이벤트 배너, CTA 버튼
  --font-main (페이퍼로지): 설명글, 숫자 지표 섹션 → 가독성 좋음
  --font-title-bold (잘난체): 제목·강조
  --font-accent (의슬이체): 감성 문구
  --font-chalk (칠판지우개): 칠판 느낌 포인트
  --font-title-food (안성탕면에코) / --font-accent-clean (KCC혜림체)
  --font-stencil (태나다체): 스텐실 스타일 제목·슬로건·배너·숫자 강조

  [The Final Collection]
  --font-head-trad (정림사지체): "백 줄의 정성" 같은 메인 슬로건, 고전적 아름다움·정갈함
  --font-head-strong (김좌진장군체): "성공 창업의 압도적 지표" 같은 섹션 타이틀, 신뢰감·무게감
  --font-admin (카페24 프로슬림): 관리자 페이지·상담 신청 폼 작은 글씨, 비즈니스/커머스
  --font-head-art (충주김생체): 메뉴 소개 하단 낙관(도장) 느낌, 강조 단어 포인트, 예술적
  --font-ui (넥슨 고딕): 본문·시스템 UI, 가독성 최우선
*/

/* --- 바로 적용 가능한 유틸리티 클래스 --- */
.font-food { font-family: var(--font-title-food); }
.font-hyeri { font-family: var(--font-accent-clean); }
.font-chalk { font-family: var(--font-chalk); }
.admin-text { font-family: var(--font-admin); }
.font-head-trad { font-family: var(--font-head-trad); }
.font-head-strong { font-family: var(--font-head-strong); }
.font-head-art { font-family: var(--font-head-art); }
.font-ui { font-family: var(--font-ui); }
.font-stencil { font-family: var(--font-stencil); }
/* 정림사지체 등 타이틀 내 굵게 강조 (400 + 700 조합용) — 구분이 잘 나도록 색·그림자 보강 */
.tit-bold {
    font-weight: 700;
    color: #fff;
    text-shadow: 0 0 20px rgba(255,255,255,0.2), 0 1px 3px rgba(0,0,0,0.25);
}

/* 모바일: 섹션 타이틀 줄바꿈 — 어절·단어 단위 유지, 한 글자만 덜렁 내려가는 현상 완화 */
@media (max-width: 768px) {
    .comp-v2-title,
    .cost-v2-title,
    .franchise-title,
    .contact-v2-title,
    .brand-v2-title,
    .profit-donut-title,
    .why-v2-title,
    .section--menu .section__title,
    .partner-cta__title,
    .section--brand-story-timeline .brand-v2-title,
    .cost-new-headline {
        word-break: keep-all;
        line-break: strict;
        overflow-wrap: break-word;
        text-wrap: balance;
    }
    .comp-v2-title .tit-bold,
    .cost-v2-title .tit-bold,
    .contact-v2-title .tit-bold,
    .brand-v2-title .tit-bold {
        word-break: keep-all;
    }
}

/* ===== 2.5 이미지·요소 드래그/선택 방지 (텍스트는 선택 가능) ===== */
img:not(.draggable) {
    -webkit-user-drag: none;
    -moz-user-drag: none;
    user-drag: none;
    user-select: none;
    pointer-events: auto;
}
[style*="background-image"]:not(.draggable):not(.swiper-slide) {
    user-select: none;
}
button, [role="button"], .btn, .btn-view, .btn-more, .btn-submit,
.logo, .logo-circle, .site-header, .rail-nav, .rail-nav__link, .rail-nav__items,
.cursor-circle, .cursor-wrap, .vertical-line,
i[class*="fa-"], .menu-item .menu-img, .hero-swiper__img, .slide-bg,
.swiper-button-next, .swiper-button-prev, .swiper-pagination {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
.draggable img { -webkit-user-drag: auto; user-drag: auto; }

/* ===== 3. 기본 적용 ===== */
*, *::before, *::after { box-sizing: border-box; }
html {
    scroll-behavior: auto;
    font-size: 16px;
    overflow-y: auto;
    overflow-x: hidden;
}
/* scroll-behavior: smooth 를 제거한 이유:
   GSAP ScrollTrigger snap이 scrollTop을 프레임마다 갱신할 때
   smooth가 각 갱신에 브라우저 smooth 애니메이션을 추가로 적용해
   두 애니메이션이 충돌 → snap 이 여러 번 발동해 엉뚱한 위치에 멈추는 버그.
   앵커 링크 smooth 스크롤은 아래 JS에서 처리. */
body {
    margin: 0;
    font-family: var(--font-main);
    font-size: clamp(0.9375rem, 1vw, 1rem);
    font-weight: 400;
    line-height: 1.65;
    background: var(--color-deep-green);
    color: var(--color-white);
    overflow-x: hidden;
    /* 커스텀 커서(cursor-effect.js) 사용 시: cursor: none; */
    cursor: auto;
    -webkit-font-smoothing: antialiased;
}
body.intro-active {
    overflow: hidden;
    height: 100vh;
    height: 100dvh;
}

/* ===== 인트로 스플래시 (GSAP): 중앙 로고 → 헤더 위치로 좌표 이동·축소 후 바통 터치 ===== */
#splash-overlay.splash-overlay {
    position: fixed;
    inset: 0;
    z-index: 10001;
    background: #fff;
    pointer-events: auto;
}
#splash-logo.splash-logo {
    position: fixed;
    left: 50%;
    top: 50%;
    width: clamp(280px, 64vw, 420px);
    height: clamp(280px, 64vw, 420px);
    max-width: min(420px, 90vw);
    max-height: min(420px, 90vmin);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10002;
    margin: 0;
    margin-left: 0;
    margin-top: 0;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    pointer-events: none;
    box-sizing: border-box;
}
.splash-logo__img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}
#header-logo {
    opacity: 0;
    transition: opacity 0.25s ease-out;
}
body.intro-done #header-logo {
    opacity: 1;
}

/* 인트로 중 헤더 영역 클릭 방지, 종료 후 표시 */
.site-header--intro-hidden {
    pointer-events: none;
}
.site-header--intro-hidden #header-logo { pointer-events: none; }
.logo--intro-hidden { pointer-events: none; }
body.intro-done .site-header--intro-hidden { pointer-events: auto; }
body.intro-done .logo--intro-hidden { pointer-events: auto; }

/* 인트로 종료 후 콘텐츠 아래→위 페이드인 */
.main--intro-hidden {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.6s ease-out 0.15s, transform 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.15s;
}
body.intro-done .main--intro-hidden {
    opacity: 1;
    transform: translateY(0);
}

h1, h2, h3, h4, .tit {
    font-family: var(--font-title);
}

.hand-write {
    font-family: var(--font-accent);
}

/* 활용 가이드 클래스 */
.tit-elegant { font-family: var(--font-title-elegant); font-weight: 700; }
.txt-pop { font-family: var(--font-point); }
.brand-msg { font-family: var(--font-accent); font-size: 1.2rem; }

/* ===== 리셋·기본 (커서 등) ===== */
.cursor-wrap[data-cursor-enabled="false"] ~ * { cursor: auto; }
.cursor-wrap[data-cursor-enabled="false"] ~ .cursor-circle { display: none !important; }

.cursor-wrap {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 9999;
}

/* 커스텀 커서: body 직계로 두어 mix-blend-mode 반전이 확실히 적용되도록 함 */
.cursor-circle {
    position: fixed;
    left: -100px;
    top: -100px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #fff;
    mix-blend-mode: difference;
    pointer-events: none;
    z-index: 10000;
    transform: scale(1);
    transform-origin: center center;
    opacity: 1;
    transition: opacity 0.3s ease-out;
}
.cursor-circle.is-leave {
    opacity: 0;
}
.cursor-circle.is-hover {
    transform: scale(1.5);
    opacity: 0.85;
}

/* ===== 시안: 왼쪽 세로선 — 최상단에서 로고 밑까지 이어지는 선 ===== */
.vertical-line--upper {
    position: fixed;
    left: var(--line-x);
    top: 0;
    width: 1px;
    height: calc(var(--logo-size) / 3 + var(--logo-size) + 8px);
    background: rgba(255, 255, 255, 0.18);
    transform: translateX(-50%);
    z-index: 999;
    pointer-events: none;
    transition: background 0.4s ease;
}
.vertical-line--upper.vertical-line--light {
    background: rgba(0, 0, 0, 0.2);
}

/* 로고 밑부터: 스크롤 선 (끝까지 전체) */
.vertical-line:not(.vertical-line--upper) {
    position: fixed;
    left: var(--line-x);
    top: calc(var(--logo-size) / 3 + var(--logo-size) + 8px);
    bottom: 0;
    width: 1px;
    background: rgba(255, 255, 255, 0.18);
    transform: translateX(-50%);
    z-index: 999;
    pointer-events: none;
    transition: background 0.4s ease;
}
.vertical-line:not(.vertical-line--upper).vertical-line--light {
    background: rgba(0, 0, 0, 0.2);
}

/* ===== 레일 내비게이션: 로고 밑에서 시작, 화면 끝까지 ===== */
.rail-nav {
    position: fixed;
    left: var(--line-x);
    top: calc(var(--logo-size) / 3 + var(--logo-size) + 8px);
    bottom: 0;
    transform: translateX(-50%);
    width: 1px;
    z-index: 998;
    pointer-events: none;
    transition: opacity 0.3s;
}
.rail-nav--hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
.rail-nav__line {
    display: none;
}
.rail-nav__dot {
    position: absolute;
    left: 50%;
    top: 0%;
    width: 28px;
    height: 28px;
    margin-left: -14px;
    margin-top: -14px;
    border-radius: 50%;
    background: var(--color-white, #fff);
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    transition: transform 0.25s ease-out, box-shadow 0.25s ease-out;
}
.rail-nav__dot-img {
    width: 18px;
    height: 18px;
    object-fit: contain;
}
.rail-nav__dot--active {
    box-shadow: 0 0 12px rgba(255, 255, 255, 0.6), 0 0 24px rgba(255, 220, 150, 0.35);
}
.rail-nav__items {
    position: absolute;
    left: 12px;
    top: 0;
    bottom: 0;
    list-style: none;
    margin: 0;
    padding: 0;
    pointer-events: auto;
}
.rail-nav__item {
    position: absolute;
    left: 0;
    transform: translateY(-50%);
    margin: 0;
}
.rail-nav__link {
    font-size: 0.7rem;
    color: rgba(255, 255, 255, 0.6);
    text-decoration: none;
    padding: 2px 0;
    transition: color 0.2s;
    white-space: nowrap;
}
.rail-nav__link:hover { color: rgba(255, 255, 255, 0.95); }
.rail-nav__item--active .rail-nav__link {
    color: var(--color-gold);
    font-weight: 700;
}

/* 밝은 배경 섹션(메뉴 등)에서 레일 색 반전 */
.vertical-line--light {
    background: rgba(0, 0, 0, 0.2);
    transition: background 0.4s ease;
}
.vertical-line {
    transition: background 0.4s ease;
}
.rail-nav--light .rail-nav__link {
    color: rgba(0, 0, 0, 0.45);
}
.rail-nav--light .rail-nav__link:hover {
    color: rgba(0, 0, 0, 0.85);
}
.rail-nav--light .rail-nav__item--active .rail-nav__link {
    color: #14331e;
}
.rail-nav--light .rail-nav__dot {
    background: #14331e;
    box-shadow: 0 0 0 2px rgba(255,255,255,0.4);
}
.rail-nav--light .rail-nav__dot--active {
    box-shadow: 0 0 12px rgba(20,51,30,0.4), 0 0 24px rgba(20,51,30,0.2);
}
@media (max-width: 1450px) {
    .rail-nav { display: none; }
    .vertical-line { display: none; }
}
@media (min-width: 1451px) {
    :root { --rail-content-inset: 1.5em; }
}
@media (min-width: 1451px) {
    .visual-sec .visual-txt { margin-left: var(--rail-content-inset); }
    .section--next { padding-left: calc(var(--section-padding-x) + var(--rail-content-inset)); }
    .section--menu { padding-left: calc(var(--section-padding-x) + var(--rail-content-inset)); }
    .section--values { padding-left: calc(var(--section-padding-x) + var(--rail-content-inset)); }
    .section--contact-form { padding-left: calc(var(--section-padding-x) + var(--rail-content-inset)); }
    .section--brand-v2 { padding-left: calc(var(--section-padding-x) + var(--rail-content-inset)); }
    .section--cost-v2 { padding-left: calc(var(--section-padding-x) + var(--rail-content-inset)); }
    .section--why-v2 { padding-left: calc(var(--section-padding-x) + var(--rail-content-inset)); }
    .section--comp-v2 { padding-left: calc(var(--section-padding-x) + var(--rail-content-inset)); }
}

/* ===== 고정 로고: 헤더와 분리, 항상 좌측 상단 고정 (테두리 없음) ===== */
.logo--fixed {
    position: fixed;
    top: calc(var(--logo-size) / 3);
    left: calc(var(--line-x) - var(--logo-size) / 2);
    z-index: 1001;
    pointer-events: auto;
}
.logo--fixed .logo-circle {
    border: none;
    background: transparent;
    transform: none;
}

/* ===== 헤더: 스크롤해도 안 보임, 나중에 섹션 스크롤 메뉴 넣을 영역 ===== */
.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    padding: 1rem 2rem;
    min-height: 4rem;
    pointer-events: none;
    visibility: hidden;
    opacity: 0;
}
.site-header.scrolled {
    visibility: hidden;
    opacity: 0;
}
.site-header .logo { pointer-events: auto; }

.logo {
    display: inline-block;
    text-decoration: none;
    color: inherit;
}
.logo-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--logo-size);
    height: var(--logo-size);
    background: var(--color-white);
    border: 2px solid var(--color-black);
    border-radius: 50%;
    color: var(--color-black);
    transition: border-color 0.35s, background 0.35s;
    overflow: hidden;
}
.logo-img {
    width: 78%;
    height: auto;
    max-height: 78%;
    object-fit: contain;
    display: block;
}

/* ===== 메인 비주얼 (index5 풀스크린 슬라이더, 최상단) ===== */
.visual-sec {
    width: 100%;
    height: 100vh;
    height: 100dvh;
    position: relative;
    overflow: hidden;
    background: #000;
}
.visual-sec .swiper-main-visual,
.visual-sec .swiper {
    width: 100%;
    height: 100%;
}
/* 가로 슬라이드 전환 시에도 슬라이드 높이·클립이 유지되도록 (배경이 빠져 검은 영역이 보이는 현상 방지) */
.visual-sec .swiper-main-visual .swiper-slide {
    position: relative;
    overflow: hidden;
    height: 100%;
    min-height: 100%;
    box-sizing: border-box;
}
.visual-sec .slide-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    min-width: 100%;
    min-height: 100%;
    z-index: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transform: scale(1.2);
    transform-origin: center center;
    transition: transform 6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.visual-sec .swiper-slide-active .slide-bg {
    transform: scale(1);
}
.visual-sec .swiper-slide::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: rgba(0, 0, 0, 0.48);
    pointer-events: none;
}
.visual-sec .visual-txt {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    text-align: center;
    color: #fff;
    width: 100%;
    padding: 0 1rem;
}
.visual-sec .visual-txt p {
    font-family: var(--font-visual-subtitle);
    font-size: clamp(0.875rem, 1.5vw, 1.25rem);
    letter-spacing: 0.2em;
    font-weight: 300;
    margin-bottom: 1rem;
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 1s 0.5s, transform 1s 0.5s;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5), 0 2px 8px rgba(0, 0, 0, 0.4);
}
.visual-sec .visual-txt h2 {
    font-family: var(--font-accent, 'Nanum Myeongjo', serif);
    font-size: clamp(2.5rem, 6vw, 5rem);
    font-weight: 700;
    line-height: 1.2;
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 1s 0.2s, transform 1s 0.2s;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.6), 0 2px 10px rgba(0, 0, 0, 0.45), 0 4px 20px rgba(0, 0, 0, 0.35);
}
.visual-sec .swiper-slide-active .visual-txt h2,
.visual-sec .swiper-slide-active .visual-txt p {
    opacity: 1;
    transform: translateY(0);
}

/* 메인 비주얼 Swiper — 페이지네이션 (슬라이드 개수 표시) */
.visual-sec .main-visual-pagination.swiper-pagination {
    bottom: clamp(1rem, 4vh, 2.5rem);
    left: 0;
    right: 0;
    z-index: 12;
}
.visual-sec .main-visual-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    background: rgba(255, 255, 255, 0.45);
    opacity: 1;
}
.visual-sec .main-visual-pagination .swiper-pagination-bullet-active {
    background: #fff;
    transform: scale(1.15);
}

/* ===== 인트로 긴자료코형: 풀스크린 배경 + 오버레이 + 원형 펄스 + Scroll 깜빡임 ===== */
@keyframes intro-ginza-circle-zoom {
    0%   { transform: scale(1); opacity: 0.8; }
    30%  { transform: scale(1.2); opacity: 0.4; }
    60%  { transform: scale(1.4); opacity: 0; }
    100% { opacity: 0; }
}
@keyframes intro-ginza-bling {
    0%, 25%, 75%, 100% { opacity: 1; }
    50% { opacity: 0; }
}
.visual-sec.intro-ginza {
    background: #0a0a0a;
}
.visual-sec.intro-ginza .intro-ginza__movie {
    position: absolute;
    inset: 0;
    overflow: hidden;
    z-index: 0;
}
.visual-sec.intro-ginza .intro-ginza__iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    width: min(2500px, 180vw);
    height: min(1100px, 120vh);
    border: 0;
    transform: translate(-50%, -50%);
    pointer-events: none;
    z-index: 1;
}
.visual-sec.intro-ginza .intro-ginza__video {
    position: absolute;
    top: 50%;
    left: 50%;
    width: min(2500px, 180vw);
    height: min(1100px, 120vh);
    transform: translate(-50%, -50%);
    pointer-events: none;
    z-index: 1;
    object-fit: cover;
}
.visual-sec.intro-ginza .intro-ginza__poster {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    z-index: 1;
}
.visual-sec.intro-ginza .intro-ginza__dim {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.42);
    z-index: 2;
    pointer-events: none;
}
.visual-sec.intro-ginza .intro-ginza__content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 1360px;
    padding: 0 clamp(1rem, 4vw, 2rem);
    text-align: center;
    text-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
    z-index: 3;
}
.visual-sec.intro-ginza .intro-ginza__title-wrap {
    display: flex;
    justify-content: center;
    margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
}
.visual-sec.intro-ginza .intro-ginza__circle {
    position: relative;
    width: min(25vw, 220px);
    max-width: 100%;
    background: #231815;
    border-radius: 50%;
    z-index: 1;
}
.visual-sec.intro-ginza .intro-ginza__circle::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: #231815;
    opacity: 0.5;
    z-index: -1;
    animation: intro-ginza-circle-zoom 0.5s linear infinite;
}
.visual-sec.intro-ginza .intro-ginza__circle::after {
    content: '';
    display: block;
    padding-bottom: 100%;
}
.visual-sec.intro-ginza .intro-ginza__stat-list {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    transform: translateY(-50%);
    padding: 0 !important;
    margin: 0 !important;
}
.visual-sec.intro-ginza .intro-ginza__stat-list li {
    width: 100%;
    text-align: center;
    font-weight: 500;
    color: var(--color-gold, #dab866);
    line-height: 1.2;
}
.visual-sec.intro-ginza .intro-ginza__stat-list li:nth-child(1) { font-size: clamp(0.875rem, 1.8vw, 1.5rem); }
.visual-sec.intro-ginza .intro-ginza__stat-list li:nth-child(2) {
    font-size: clamp(2rem, 5vw, 4rem);
    font-weight: 700;
}
.visual-sec.intro-ginza .intro-ginza__stat-list li:nth-child(3) { font-size: clamp(0.875rem, 1.8vw, 1.5rem); }
.visual-sec.intro-ginza .intro-ginza__stat-list li:nth-child(4) { font-size: clamp(0.7rem, 1.2vw, 1rem); opacity: 0.95; }
.visual-sec.intro-ginza .intro-ginza__cols { margin-top: clamp(0.5rem, 2vw, 1rem); }
.visual-sec.intro-ginza .intro-ginza__col-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: clamp(1rem, 4vw, 3rem);
    font-size: 0;
    padding: 0 !important;
    margin: 0 !important;
    position: relative;
}
.visual-sec.intro-ginza .intro-ginza__col-list::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 720px;
    height: 1px;
    background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.85), transparent);
    z-index: -1;
    pointer-events: none;
}
.visual-sec.intro-ginza .intro-ginza__col-list li {
    display: inline-block;
    vertical-align: middle;
    width: min(42%, 280px);
    font-family: var(--font-body, 'Pretendard', sans-serif);
    font-weight: 500;
    font-size: clamp(1rem, 2vw, 1.35rem);
    line-height: 1.45;
    color: #fff;
    text-align: center;
}
.visual-sec.intro-ginza .intro-ginza__col-list li strong {
    display: block;
    margin-top: 0.25em;
    font-size: clamp(1.35rem, 3vw, 2.2rem);
    font-weight: 700;
    color: #fff;
}
.visual-sec.intro-ginza .intro-ginza__tagline {
    margin: clamp(1.5rem, 4vw, 2.5rem) 0 0;
    font-family: var(--font-head-art, var(--font-accent, serif));
    font-size: clamp(1.5rem, 4vw, 3.5rem);
    line-height: 1.15;
    font-weight: 700;
    color: #fff;
}
.visual-sec.intro-ginza .intro-ginza__scroll {
    position: absolute;
    bottom: clamp(1.25rem, 3vw, 2rem);
    left: 50%;
    transform: translateX(-50%);
    z-index: 4;
    text-align: center;
    font-weight: 500;
    font-size: clamp(0.85rem, 1.2vw, 1rem);
    line-height: 1.4;
    color: rgba(255, 255, 255, 0.95);
    transition: opacity 0.35s ease;
}
.visual-sec.intro-ginza .intro-ginza__scroll-icon {
    display: block;
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    margin-bottom: 0.15em;
    animation: intro-ginza-bling 2s linear infinite;
}
.visual-sec.intro-ginza .intro-ginza__scroll-label {
    display: block;
    letter-spacing: 0.05em;
}
body.intro-ginza--scrolled .visual-sec.intro-ginza .intro-ginza__scroll {
    opacity: 0;
    pointer-events: none;
    animation: none;
}
body.intro-ginza--scrolled .visual-sec.intro-ginza .intro-ginza__scroll-icon {
    animation: none;
}
@media (min-width: 769px) {
    .visual-sec.intro-ginza .intro-ginza__content {
        padding-left: calc(clamp(1rem, 4vw, 2rem) + var(--rail-content-inset, 0px));
    }
    /* 긴자형 통계: 뷰포트 정중앙 (레일 inset 비대칭 제거) */
    .visual-sec.intro-ginza .intro-ginza__content.intro-ginza__content--stats2026 {
        padding-left: clamp(1rem, 4vw, 2.5rem);
        padding-right: clamp(1rem, 4vw, 2.5rem);
    }
}
@media (max-width: 750px) {
    .visual-sec.intro-ginza {
        min-height: 70vh;
        height: 70vh;
        height: 70dvh;
    }
    .visual-sec.intro-ginza .intro-ginza__iframe {
        width: 180vw;
        height: 70vh;
    }
    .visual-sec.intro-ginza .intro-ginza__video {
        width: 180vw;
        height: 70vh;
    }
    .visual-sec.intro-ginza .intro-ginza__circle {
        width: min(42vw, 200px);
    }
    .visual-sec.intro-ginza .intro-ginza__circle--stats {
        width: min(78vw, 270px);
    }
    .visual-sec.intro-ginza .intro-ginza__col-list {
        flex-direction: column;
        align-items: center;
        gap: 1rem;
    }
    .visual-sec.intro-ginza .intro-ginza__col-list li {
        width: 100%;
        max-width: 320px;
    }
    .visual-sec.intro-ginza .intro-ginza__col-list::before {
        display: none;
    }
    .visual-sec.intro-ginza .intro-ginza__tagline {
        font-size: clamp(1.15rem, 5vw, 1.5rem);
    }
}
@media (prefers-reduced-motion: reduce) {
    .visual-sec.intro-ginza .intro-ginza__circle::before,
    .visual-sec.intro-ginza .intro-ginza__scroll-icon,
    .visual-sec.intro-ginza .intro-ginza__poster {
        animation: none;
    }
    .visual-sec.intro-ginza .intro-ginza__poster {
        transform: none;
    }
}

/* ===== 히어로: 두 레이어 겹침 — 위(텍스트 10|70|20), 아래(이미지 우하단 기준) ===== */
.hero {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    align-items: stretch;
    padding: 0;
    padding-left: calc(clamp(1rem, 4vw, 2rem) + var(--rail-content-inset) + 1em);
    background: #14331e;
}
.hero__inner {
    width: 100%;
    max-width: 100%;
    margin: 0;
    position: relative;
    min-height: 0;
}

/* 레이어2: 이미지 — 한 칸, 이미지·레이어 모두 우측 하단 기준 */
.hero__layer2 {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    overflow: hidden;
}
.hero__layer2 .hero__right {
    position: relative;
    width: 100%;
    height: 100%;
    right: auto;
    top: auto;
    bottom: auto;
}

/* 레이어1: 텍스트 — 예전 3칸 그리드(5|78|17) 제거: 한 블록만 두고 패딩으로 우측 이미지 여유 (폰트 키울 때 잘림·과한 줄바꿈 완화) */
.hero__layer1 {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    min-height: 80vh;
    min-height: 80dvh;
}
.hero__layer1 .hero__spacer--left,
.hero__layer1 .hero__spacer--right {
    display: none;
}
.hero__spacer { min-width: 0; }
.hero__left {
    min-width: 0;
    width: 100%;
    max-width: min(72rem, calc(100% - clamp(1rem, 8vw, 6rem)));
    padding-left: clamp(1.5rem, 4vw, 4rem);
    padding-right: clamp(1.25rem, 3vw, 2rem);
    padding-top: clamp(4rem, 10vw, 6rem);
    padding-bottom: clamp(3rem, 6vw, 4rem);
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: visible;
}
.hero__right {
    min-width: 0;
    overflow: hidden;
}

@media (max-width: 900px) {
    .hero { padding: 0 0.5rem; min-height: 0; }
    .hero__inner { display: flex; flex-direction: column; overflow: visible; }
    .hero__layer1 {
        order: 0;
        min-height: auto;
        display: block;
        width: 100%;
    }
    .hero__layer1 .hero__spacer { display: none; }
    .hero__layer1 .hero__left { max-width: 100%; }
    .hero__layer2 {
        position: relative;
        order: 1;
        min-height: 34vh;
        flex-shrink: 0;
        margin-left: -0.5rem;
        margin-right: -0.5rem;
        width: calc(100% + 1rem);
    }
    .hero__left {
        width: 100%;
        max-width: none;
        padding: 2.5rem 0.5rem 0.15rem;
        text-align: center;
    }
    .hero__headline { margin-bottom: 0.4rem; }
    .hero__headline,
    .hero__headline-line,
    .hero__headline-line--1,
    .hero__headline-line--2 { text-align: center; }
    .hero__layer2 { margin-top: -1rem; }
    .hero__layer2 { justify-content: center; align-items: center; }
    .hero-swiper { height: 100%; }
    .hero-swiper__img {
        background-size: 88%;
        background-position: center bottom;
    }
    .hero__headline { font-size: clamp(1.5rem, 6vw, 2.5rem); }
    .hero__sub { font-size: clamp(0.95rem, 3.5vw, 1.25rem); }
    .hero__sales { font-size: clamp(1.5rem, 8vw, 2.5rem); }
    .hero__sales-caption { font-size: clamp(0.7rem, 2vw, 0.9rem); }
}
@media (max-width: 800px) {
    .hero-swiper__img {
        background-size: 96%;
        background-position: center bottom;
    }
}
@media (max-width: 600px) {
    .hero { padding: 0 0.5rem; }
    .hero__left { padding: 2rem 0.5rem 0.15rem; }
    .hero__layer2 {
        min-height: 28vh;
        margin-top: -1rem;
        margin-left: -0.5rem;
        margin-right: -0.5rem;
        width: calc(100% + 1rem);
    }
    .hero-swiper__img {
        background-size: 100%;
        background-position: center bottom;
    }
    .hero__headline { font-size: clamp(1.35rem, 7vw, 2rem); }
    .hero__sub { font-size: clamp(0.9rem, 4vw, 1.1rem); }
    .hero__sales { font-size: clamp(1.4rem, 10vw, 2rem); }
    .hero__sales-caption { font-size: clamp(0.65rem, 2.5vw, 0.8rem); }
}
@media (max-width: 380px) {
    .hero__left { padding: 1.5rem 0.5rem 0.15rem; }
    .hero__headline { font-size: 1.25rem; }
    .hero__sub { font-size: 0.85rem; }
    .hero__sales { font-size: 1.25rem; }
    .hero__sales-caption { font-size: 0.65rem; }
}

/* 헤드라인: 반응형 clamp, 줄 간격 맞춤, 폰트는 변수로 */
.hero__headline {
    font-family: var(--hero-font-line1);
    margin: 0 0 0.75rem;
    font-size: clamp(1.5rem, 4.5vw, 4.4rem);
    font-weight: normal;
    line-height: 1.1;
    letter-spacing: -0.02em;
    word-spacing: 0.08em;
    text-align: left;
}
.hero__headline-line {
    display: block;
    overflow: visible;
    line-height: 1.1;
    text-align: left;
}
.hero__headline-line--1 { color: var(--color-white); }
.hero__headline-line--2 {
    font-family: var(--hero-font-line2);
    margin-left: 0;
    margin-top: 0;
    font-size: 1em;
}
.hero__headline-line--3 {
    font-family: var(--hero-font-line3);
    margin-top: 0;
    font-size: 0.55em;
    color: rgba(255, 255, 255, 0.95);
}
.hero__headline-line--gap {
    display: block;
    height: 0;
    margin-top: 1.1em;
    overflow: visible;
}
/* 모바일(세로 배치): 헤드라인 포함 전부 중앙 정렬 (기본 스타일보다 뒤에 두어 우선 적용) */
@media (max-width: 900px) {
    .hero__headline,
    .hero__headline-line,
    .hero__headline-line--1,
    .hero__headline-line--2,
    .hero__headline-line--3 { text-align: center; }
}
/* 단어 단위: 단어 사이 여백으로 띄어쓰기 확실히 */
.hero__headline-word {
    display: inline-block;
    margin-right: 0.4em;
    vertical-align: top;
}
.hero__headline-word:last-child { margin-right: 0; }

.hero__headline-char {
    display: inline-block;
    opacity: 0;
    transform: translateY(-120%);
    transition: opacity 0.5s ease, transform 0.5s ease;
    vertical-align: top;
}
.hero__headline-char.is-visible {
    opacity: 1;
    transform: translateY(0);
}
.hero__headline-line--accent .hero__headline-char { color: #ffff3c; }
/* 스크램블 효과: 해독 중 반짝임·미세 블러 → 완성 시 선명 */
.hero__headline-line--accent.is-scrambling .hero__headline-char {
    filter: blur(0.5px);
    text-shadow: 0 0 8px rgba(247, 160, 0, 0.6);
    transition: filter 0.15s ease, text-shadow 0.15s ease;
}
.hero__headline-line--accent.is-scrambling .hero__headline-char.is-locked {
    filter: none;
    text-shadow: none;
}

/* 서브 카피: 폰트는 변수 --hero-font-sub, 반응형 */
.hero__sub {
    font-family: var(--hero-font-sub);
    margin: 0 0 1.25rem;
    font-size: clamp(0.95rem, 2.2vw, 2.4rem);
    font-weight: 600;
    color: var(--color-white);
    opacity: 0;
    transform: translateX(-40px);
    transition: opacity 0.6s ease 0.5s, transform 0.6s ease 0.5s;
}
.hero__sub.is-visible {
    opacity: 1;
    transform: translateX(0);
}

/* 매출 숫자: 폰트는 변수 --hero-font-sales, 반응형 */
.hero__sales {
    font-family: var(--hero-font-sales);
    margin-bottom: 0.35rem;
    font-size: clamp(1.75rem, 7vw, 8.5rem);
    font-weight: normal;
    letter-spacing: -0.02em;
    color: var(--color-white);
    overflow: visible;
    word-break: keep-all;
    white-space: nowrap;
}
.hero__sales-currency { margin-right: 0.1em; }
.hero__sales-value { display: inline-block; min-width: 0; }

/* 매출 기준 캡션: 폰트는 변수 --hero-font-caption, 반응형 */
.hero__sales-caption {
    font-family: var(--hero-font-caption);
    margin: 0 0 1.5em;
    font-size: clamp(0.7rem, 1.4vw, 1.5rem);
    font-weight: 400;
    color: rgba(255,255,255,0.7);
}

/* 우측 이미지: .hero__right는 상단에서 position: absolute로 정의됨 (겹침 레이아웃) */

.hero-swiper {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    overflow: hidden;
}
.hero-swiper__img {
    width: 100%;
    height: 100%;
    background-size: 60%;
    background-repeat: no-repeat;
    background-position: right bottom;
}
.hero-swiper-pagination { bottom: 1rem !important; }
.hero-swiper-pagination .swiper-pagination-bullet {
    background: var(--color-white);
    opacity: 0.5;
}
.hero-swiper-pagination .swiper-pagination-bullet-active {
    background: var(--color-gold);
    opacity: 1;
}

/* ===== 공통 섹션: 배경·가이드선·로고는 위와 동일하게 이어짐 ===== */
.section {
    background: var(--color-deep-green);
    padding: var(--section-padding-y) var(--section-padding-x) clamp(4rem, 10vw, 6rem);
    padding-left: calc(var(--line-x) + var(--section-padding-x) + var(--rail-content-inset));
}

/* 스택 레이어: 각 섹션 하단에서 아래로 드리우는 그림자 — 다음 섹션 위쪽에 보임 (길이·진하기 70%) */
main > section {
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.35);
}

/* ===== 스크롤 스냅: 최소 높이만 보장, 내용 잘림 없음 (뒤죽박죽 방지) ===== */
.scroll-snap-section {
    min-height: 100vh;
    min-height: 100dvh;
    overflow: visible;
    box-sizing: border-box;
}
/* 창업 비용: 내용이 길어 스냅 대상에서 제외 */
.section--opening-cost {
    min-height: 100vh;
    min-height: 100dvh;
    overflow: visible;
    box-sizing: border-box;
}
/* 푸터는 스냅 대상만 하고 높이 고정 유지 */
.site-footer.scroll-snap-section {
    min-height: 0;
}
/* 모바일: 스냅 비활성화 시 높이/오버플로우 해제로 내용 잘림 방지 */
@media (max-width: 1023px) {
    /*
      스냅을 끄더라도, 풀스크린 비주얼/히어로는 Swiper가 부모 높이(100%)를 필요로 함.
      여기서 height:auto로 바꾸면 비주얼이 접히며 "빈 칸"처럼 보일 수 있어 예외 처리한다.
    */
    .scroll-snap-section:not(.visual-sec),
    .section--opening-cost {
        height: auto;
        min-height: 0;
        overflow: visible;
    }
    .visual-sec.scroll-snap-section {
        min-height: 100vh;
        min-height: 100dvh;
        height: 100vh;
        height: 100dvh;
    }
}

/* 모바일(실기기 포함): 긴자 메인 배경 미디어는 무조건 꽉 차게(검정 여백 방지) */
@media (max-width: 900px) {
    .visual-sec.intro-ginza .intro-ginza__movie { inset: 0; }
    .visual-sec.intro-ginza .intro-ginza__video,
    .visual-sec.intro-ginza .intro-ginza__iframe {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        transform: none;
    }
    .visual-sec.intro-ginza .intro-ginza__video {
        object-fit: cover;
    }
}

.section__inner {
    max-width: var(--content-max);
    margin: 0 auto;
}
.section__placeholder {
    margin: 0;
    font-family: var(--font-main);
    font-size: 1rem;
    color: rgba(255,255,255,0.6);
}
/* 두 번째 섹션: 하단 약 20% 위치에서 시작, 경계선·밝은 배경으로 분리 */
.section--next {
    margin-top: 0;
    min-height: 30vh;
    background: #f8f6f2;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    padding: var(--section-padding-y) var(--section-padding-x);
    padding-left: var(--section-padding-x);
}
.section--next .section__placeholder {
    font-size: clamp(0.9375rem, 1vw, 1rem);
    line-height: 1.6;
    color: rgba(0, 0, 0, 0.5);
}

/* ===== 메뉴 소개 섹션 (index5 참고) ===== */
.section--menu {
    position: relative;
    overflow: hidden;
    background: #f8f6f2;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    padding: var(--section-padding-y) var(--section-padding-x);
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.35), inset 0 24px 40px -12px rgba(0, 0, 0, 0.25);
}
.menu-section-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 33.333%;
    max-width: 100%;
    height: 100%;
    background-size: cover;
    background-position: left center;
    background-repeat: no-repeat;
    opacity: 0.3;
    pointer-events: none;
    z-index: 0;
}
/* 좌측 스트립 오른쪽 가장자리만 섹션 배경색으로 부드럽게 이어짐 */
.menu-section-bg::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(40%, 5rem);
    background: linear-gradient(90deg, transparent 0%, #f8f6f2 100%);
    pointer-events: none;
}
.section--menu .section__inner.container {
    position: relative;
    z-index: 1;
    max-width: var(--content-wide);
    margin: 0 auto;
}
.section--menu .title-box {
    text-align: center;
    margin-bottom: clamp(2.5rem, 5vw, 4rem);
}
.section--menu .section__title {
    font-family: var(--font-title-food);
    font-size: clamp(1.75rem, 4.5vw, 3.2rem);
    color: var(--color-deep-green, #14331e);
    margin-bottom: 0.5rem;
    line-height: 1.25;
}
.section--menu .section__title .section__title-line2 {
    display: inline;
}
@media (max-width: 640px) {
    .section--menu .section__title {
        font-size: clamp(1.35rem, 5.5vw, 1.75rem);
        word-break: keep-all;
        text-wrap: balance;
    }
    /* PC처럼 한 덩어리로 줄바꿈(브라우저가 균형 있게 나눔). 두 번째 줄만 통째로 내리지 않음 */
    .section--menu .section__title .section__title-line2 {
        display: inline;
    }
}
.section--menu .section__subtitle {
    font-size: clamp(0.9375rem, 1.2vw, 1.125rem);
    color: #555;
    letter-spacing: -0.02em;
    line-height: 1.6;
}
.section--menu .menu-slider-wrap {
    position: relative;
}
.section--menu .menu-slider-btn {
    position: absolute;
    top: 35%;
    transform: translateY(-50%);
    z-index: 2;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 2px solid var(--color-deep-green, #14331e);
    background: rgba(255, 255, 255, 0.95);
    color: var(--color-deep-green, #14331e);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}
.section--menu .menu-slider-btn:hover {
    background: var(--color-deep-green, #14331e);
    color: var(--color-white, #fff);
    border-color: var(--color-deep-green, #14331e);
    box-shadow: 0 4px 16px rgba(20, 51, 30, 0.25);
}
.section--menu .menu-slider-btn:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(247, 160, 0, 0.4);
}
.section--menu .menu-slider-btn--prev { left: -12px; }
.section--menu .menu-slider-btn--next { right: -12px; }
@media (max-width: 640px) {
    .section--menu .menu-slider-btn {
        width: 40px;
        height: 40px;
        font-size: 0.875rem;
    }
    .section--menu .menu-slider-btn--prev { left: 4px; }
    .section--menu .menu-slider-btn--next { right: 4px; }
}
.section--menu .menu-grid {
    display: flex;
    flex-wrap: nowrap;
    gap: clamp(1.5rem, 3vw, 2.5rem);
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 0.5rem 0.5rem 0.5rem 0.5rem;
    scroll-behavior: smooth;
}
.section--menu .menu-grid::-webkit-scrollbar {
    display: none;
}
.section--menu .menu-item {
    flex: 0 0 auto;
    min-width: min(280px, 85vw);
    max-width: 320px;
    scroll-snap-align: start;
    cursor: pointer;
}
.section--menu .menu-img {
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 8px;
    margin-bottom: 1.25rem;
    background: rgba(0, 0, 0, 0.06);
}
.section--menu .menu-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}
.section--menu .menu-item:hover .menu-img img {
    transform: scale(1.08);
}
.section--menu .menu-txt h4 {
    font-family: var(--font-chalk);
    font-size: clamp(1.1rem, 1.5vw, 1.35rem);
    margin-bottom: 0.5rem;
    color: var(--color-deep-green, #14331e);
    font-weight: 700;
    line-height: 1.3;
}
.section--menu .menu-txt p {
    font-size: clamp(0.875rem, 1.1vw, 1rem);
    color: #555;
    line-height: 1.65;
}

/* ===== 브랜드 스토리 섹션 (index5 참고) ===== */
.section--brand {
    display: flex;
    min-height: 480px;
    background: #f5f3ef;
    padding: 0;
    padding-left: 0;
}
.section--brand .brand-bg {
    flex: 0 0 50%;
    width: 50%;
    min-height: 400px;
    min-width: 0;
    background-color: var(--color-deep-green, #14331e);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.section--brand .brand-info {
    flex: 0 0 50%;
    width: 50%;
    min-width: 0;
    max-width: none;
    padding: clamp(3rem, 8vw, 5rem) clamp(2rem, 6vw, 5rem);
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.section--brand .brand-info__title {
    font-family: var(--font-accent, 'Nanum Myeongjo', serif);
    font-size: clamp(1.5rem, 3.2vw, 2.9rem);
    line-height: 1.3;
    margin-bottom: 1.25rem;
    color: #111;
}
.section--brand .brand-info__text {
    font-size: clamp(0.875rem, 1.05vw, 1.0625rem);
    color: #444;
    line-height: 1.8;
    margin-bottom: 2rem;
}
.section--brand .btn-view {
    display: inline-block;
    width: fit-content;
    padding: 0.9rem 2.2rem;
    border: 1px solid #888;
    font-size: clamp(0.875rem, 1vw, 1rem);
    font-weight: 500;
    color: #222;
    transition: border-color 0.3s, background 0.3s, color 0.3s;
}
.section--brand .btn-view:hover {
    border-color: var(--color-deep-green, #14331e);
    background: var(--color-deep-green, #14331e);
    color: #fff;
}
@media (max-width: 900px) {
    .section--brand {
        flex-direction: column;
    }
    .section--brand .brand-bg {
        flex: 0 0 auto;
        width: 100%;
        min-height: 280px;
        order: 0;
        background-position: center center;
        background-size: cover;
    }
    .section--brand .brand-info {
        flex: 0 0 auto;
        width: 100%;
        order: 1;
        max-width: none;
        padding: 2.5rem 1.5rem;
    }
    .section--brand .brand-info__title {
        font-size: clamp(1.4rem, 5vw, 1.85rem);
    }
    .section--brand .brand-info__text {
        font-size: clamp(0.875rem, 2.5vw, 1rem);
    }
}

/* ===== 시안: 푸터 위 추가 섹션들 ===== */

/* 브랜드 경쟁력 (카드 3장) — 상단 2배·하단 3배 여백, 블록 세로 중앙 */
.section--brand-competitiveness {
    background: #102231;
    padding-top: clamp(4rem, 10vw, 6rem);
    padding-bottom: clamp(6rem, 15vw, 9rem);
    padding-left: var(--section-padding-x);
    padding-right: var(--section-padding-x);
    overflow: visible;
    display: flex;
    align-items: center;
    min-height: 75vh;
    min-height: 75dvh;
}
.section--brand-competitiveness .competitiveness-inner {
    width: 100%;
}
.competitiveness-inner {
    max-width: min(1152px, 92%); /* 전체 넓이 약 10% 축소 (1280 → 1152) */
    margin: 0 auto;
    overflow: visible;
}
.competitiveness-header {
    text-align: center;
    margin-bottom: clamp(1.25rem, 3vw, 2rem);
}
.competitiveness-title {
    font-family: var(--font-title-food);
    font-size: clamp(1.5rem, 3.5vw, 2.5rem);
    font-weight: 700;
    color: #fff;
    margin: 0 0 0.35rem;
    line-height: 1.25;
}
.competitiveness-subtitle {
    margin: 0 0 calc(2.5em + 40px);
    font-size: clamp(0.9rem, 1.2vw, 1.05rem);
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.5;
}
.competitiveness-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(0.75rem, 2vw, 1.25rem);
    align-items: stretch;
    justify-items: stretch;
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
    overflow: visible;
}
.competitiveness-card {
    background: #1e3136;
    border-radius: 12px;
    padding: clamp(1.1rem, 2.5vw, 1.6rem) clamp(1.65rem, 3.75vw, 2.4rem);
    padding-bottom: calc(clamp(1.1rem, 2.5vw, 1.6rem) + 1.5em);
    min-height: clamp(320px, 38vw, 420px);
    display: flex;
    flex-direction: column;
    position: relative;
    border: 1px solid rgba(255, 255, 255, 0.06);
    transition: transform 0.4s ease, box-shadow 0.4s ease, background-color 0.4s ease;
    z-index: 0;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
}
/* 카드 활성(JS .card-active) — 기본 상태에서 가운데, hover 시 해당 카드 */
.competitiveness-card.card-active {
    background: #244a5e;
    transform: translateY(-12px) scale(1.2);
    z-index: 2;
    box-shadow: 0 24px 56px rgba(0, 0, 0, 0.55), 0 12px 24px rgba(0, 0, 0, 0.4);
}
/* reveal 등장 후 active 카드 */
.reveal-section.section-inview .competitiveness-card.reveal-item.revealed.card-active {
    transform: translateY(-12px) scale(1.2);
    z-index: 2;
    box-shadow: 0 24px 56px rgba(0, 0, 0, 0.55), 0 12px 24px rgba(0, 0, 0, 0.4);
}
/* 카드 3단 구조: 위(고정) · 중간(가변·중앙) · 아래(고정) */
.competitiveness-card__top {
    flex-shrink: 0;
}
.competitiveness-card__middle {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 0;
    padding: 0.5rem clamp(1rem, 3vw, 1.5rem);
    margin-left: clamp(-1rem, -3vw, -1.5rem);
    margin-right: clamp(-1rem, -3vw, -1.5rem);
    font-family: var(--font-stencil);
}
.competitiveness-card__middle .competitiveness-card__rate-num,
.competitiveness-card__middle .competitiveness-card__rate-arrow,
.competitiveness-card__middle .competitiveness-card__lead {
    font-family: var(--font-stencil);
    font-size: clamp(1.5rem, 2.4vw, 2.2rem);
    white-space: nowrap;
}
.competitiveness-card__middle .competitiveness-card__lead,
.competitiveness-card__middle .competitiveness-card__rates,
.competitiveness-card__middle .competitiveness-card__bullets {
    margin: 0;
    max-width: 100%;
    text-align: center;
}
.competitiveness-card__middle .competitiveness-card__rates--horizontal {
    flex-wrap: nowrap;
}
.competitiveness-card__middle .competitiveness-card__rate-arrow {
    font-size: clamp(1.3rem, 2vw, 1.8rem);
}
.competitiveness-card__middle .competitiveness-card__bullets {
    font-size: clamp(1.06rem, 2.9vw, 1.32rem);
}
.competitiveness-card__bottom {
    flex-shrink: 0;
}
.competitiveness-card__label {
    display: block;
    font-size: clamp(0.7rem, 0.9vw, 0.8rem);
    color: rgba(255, 255, 255, 0.55);
    margin-bottom: 0.35rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.competitiveness-card__title {
    font-family: var(--font-chalk);
    font-size: clamp(0.9rem, 1.35vw, 1.15rem);
    font-weight: 700;
    color: #e6c200;
    margin: 0;
    line-height: 1.3;
}
.competitiveness-card__rates {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem 1rem;
    flex-wrap: nowrap;
    margin: 0 0 0.4rem;
}
.competitiveness-card__rates--horizontal {
    gap: 0.5rem 0.75rem;
    margin: 0;
}
.competitiveness-card__rates--vertical {
    flex-direction: column;
    gap: 0.4rem 0;
    margin: 0 0 0.85rem;
    align-items: center;
}
.competitiveness-card__rates--vertical .competitiveness-card__rate-caption {
    font-size: clamp(0.72rem, 0.95vw, 0.82rem);
    color: rgba(255, 255, 255, 0.75);
    line-height: 1.35;
    text-align: center;
    letter-spacing: 0.02em;
}
.competitiveness-card__rates--vertical .competitiveness-card__rate-num {
    font-size: clamp(1.5rem, 3.2vw, 2.1rem);
    line-height: 1.2;
}
.competitiveness-card__rates--vertical .competitiveness-card__rate-arrow {
    font-size: clamp(1.35rem, 2.6vw, 1.9rem);
    margin: 0.1rem 0;
    color: #7cb342;
}
.competitiveness-card__rate-desc {
    margin: 0 0 1em;
    font-size: clamp(0.72rem, 0.95vw, 0.82rem);
    color: rgba(255, 255, 255, 0.75);
    line-height: 1.4;
    text-align: center;
}
.competitiveness-card__rate-desc + .competitiveness-card__desc {
    margin-top: 1em;
}
.competitiveness-card__rate-num {
    font-family: var(--font-stencil);
    font-size: clamp(1.5rem, 2.4vw, 2.2rem);
    font-weight: 700;
    color: #fff;
    line-height: 1;
}
.competitiveness-card__rate-arrow {
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    color: #7cb342;
    line-height: 1;
}
.competitiveness-card__lead {
    margin: 0;
    font-size: clamp(1.5rem, 2.4vw, 2.2rem);
    font-weight: 700;
    font-family: var(--font-stencil);
    color: #fff;
    line-height: 1.35;
    letter-spacing: 0.02em;
    white-space: nowrap;
    text-align: center;
}
.competitiveness-card__lead-num {
    font-size: 1.5em;
    font-weight: 700;
    line-height: 1.2;
}
.competitiveness-card__bullets {
    margin: 0 0 0.5rem;
    font-size: clamp(0.85rem, 1.1vw, 1rem);
    color: rgba(255, 255, 255, 0.95);
    line-height: 1.5;
}
.competitiveness-card__bottom .competitiveness-card__desc + .competitiveness-card__desc,
.competitiveness-card__bottom .competitiveness-card__bullets + .competitiveness-card__desc {
    margin-top: 0.65em;
}
.competitiveness-card__desc {
    margin: 0;
    font-size: clamp(0.8rem, 1vw, 0.9rem);
    color: rgba(255, 255, 255, 0.88);
    line-height: 1.5;
    text-align: left;
}
.competitiveness-card__desc + .competitiveness-card__desc {
    margin-top: 0.5rem;
}
@media (max-width: 900px) {
    .competitiveness-cards {
        grid-template-columns: 1fr;
    }
    /* 1열일 때는 가운데 카드 기본 강조 해제 — JS에서 모바일 분기 */
    .competitiveness-card.card-active {
        background: #1e3136;
        transform: none;
        z-index: 0;
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
    }
    .reveal-section.section-inview .competitiveness-card.reveal-item.revealed.card-active {
        transform: none;
        z-index: 0;
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
    }
}

/* 브랜드 실적 · 창업비용 안내 (흰 배경) — 아래 개설비용 섹션과 구분 */
.section--metrics {
    background: #fff;
    padding: var(--section-padding-y) var(--section-padding-x);
    padding-left: var(--section-padding-x);
    padding-bottom: clamp(4rem, 10vw, 6rem);
}
.metrics-inner {
    max-width: var(--content-max);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: clamp(2rem, 5vw, 4rem);
    align-items: center;
}
.metrics-title {
    margin: 0 0 1rem;
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    font-weight: 700;
    color: var(--color-deep-green, #14331e);
    line-height: 1.25;
}
.metrics-left .metrics-visual {
    aspect-ratio: 4/3;
    max-width: 420px;
    background: #f0ede8;
    border-radius: 8px;
    overflow: hidden;
}
.metrics-visual__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
/* 창업비용 안내: 이미지 대신 텍스트 영역 */
.metrics-visual--text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(1.25rem, 3vw, 2rem);
    background: linear-gradient(145deg, #f5f2ed 0%, #ebe7e1 100%);
    border: 1px solid rgba(20, 51, 30, 0.08);
}
.metrics-visual__lead {
    margin: 0 0 0.35em;
    font-size: clamp(1.15rem, 2.2vw, 1.5rem);
    font-weight: 700;
    color: var(--color-deep-green, #14331e);
    line-height: 1.3;
    letter-spacing: -0.02em;
}
.metrics-visual__sub {
    margin: 0 0 1rem;
    font-size: clamp(0.85rem, 1.2vw, 0.95rem);
    color: #555;
    line-height: 1.4;
}
.metrics-visual__list {
    margin: 0 0 1rem;
    padding: 0 0 0 1.1em;
    list-style: disc;
    font-size: clamp(0.8rem, 1vw, 0.9rem);
    color: #444;
    line-height: 1.65;
}
.metrics-visual__list li { margin-bottom: 0.35em; }
.metrics-visual__list li:last-child { margin-bottom: 0; }
.metrics-visual__cta {
    margin: 0;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(20, 51, 30, 0.12);
    font-size: clamp(0.75rem, 1vw, 0.85rem);
    color: #666;
    line-height: 1.5;
    font-style: italic;
}
.metrics-note {
    margin: 1rem 0 0;
    font-size: clamp(0.8rem, 1vw, 0.9rem);
    color: #666;
    line-height: 1.5;
}
.metrics-item__heading {
    display: block;
    font-size: clamp(0.8rem, 1vw, 0.95rem);
    color: #555;
    margin-bottom: 0.35rem;
    line-height: 1.3;
}
.metrics-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
}
.metrics-item {
    padding: clamp(1rem, 2vw, 1.5rem);
    background: #f8f6f2;
    border-radius: 8px;
    text-align: center;
}
.metrics-value { display: block; font-size: clamp(1.35rem, 2.8vw, 2.25rem); font-weight: 700; color: var(--color-deep-green, #14331e); line-height: 1.2; }
.metrics-label { font-size: clamp(0.875rem, 1.1vw, 1rem); color: #555; line-height: 1.4; }

/* 개설비용 (탭 + 테이블) — 창업비용 안내와 시각·스크롤 구분 */
.section--opening-cost {
    background: #1B263B;
    padding: var(--section-padding-y) var(--section-padding-x);
    padding-left: var(--section-padding-x);
    padding-top: clamp(4rem, 10vw, 6rem);
}
.opening-cost-inner {
    max-width: var(--content-wide);
    margin: 0 auto;
}
.opening-cost-header {
    text-align: center;
    margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
}
.opening-cost-title {
    font-family: var(--font-title-food);
    font-size: clamp(1.5rem, 3.5vw, 2.5rem);
    font-weight: 700;
    color: #fff;
    margin: 0 0 0.5rem;
    line-height: 1.25;
}
.opening-cost-subtitle {
    font-family: var(--font-main);
    font-size: clamp(0.875rem, 1.1vw, 1rem);
    color: rgba(255, 255, 255, 0.85);
    margin: 0;
    line-height: 1.5;
}
.opening-cost-tabs {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
    flex-wrap: wrap;
}
.opening-cost-tab {
    font-family: var(--font-main);
    font-size: clamp(0.875rem, 1vw, 1rem);
    padding: 0.75rem 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
    cursor: pointer;
    transition: background 0.25s, border-color 0.25s;
}
.opening-cost-tab:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.45);
}
.opening-cost-tab.is-active {
    background: rgba(120, 60, 40, 0.9);
    border-color: var(--color-gold, #f7a000);
    color: #fff;
}
.opening-cost-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 1rem;
}
.opening-cost-panel {
    display: none;
}
.opening-cost-panel.is-active {
    display: block;
}
.opening-cost-panel[hidden] {
    display: none !important;
}
.opening-cost-table {
    width: 100%;
    min-width: 560px;
    border-collapse: collapse;
    font-family: var(--font-main);
    font-size: clamp(0.8125rem, 1vw, 0.9375rem);
    color: #fff;
}
.opening-cost-table th,
.opening-cost-table td {
    padding: clamp(0.6rem, 1.2vw, 0.85rem) clamp(0.75rem, 1.5vw, 1rem);
    border: 1px solid rgba(255, 255, 255, 0.18);
    text-align: center;
    vertical-align: top;
    line-height: 1.45;
}
.opening-cost-table thead th {
    background: rgba(0, 0, 0, 0.35);
    font-weight: 700;
    text-align: center;
}
/* 금액이 변하는 행: 20평 동일, 25평 조금 더 어둡게, 30평 더 어둡게 */
#opening-cost-20 .opening-cost-row--varies td {
    background: transparent;
}
#opening-cost-25 .opening-cost-row--varies td {
    background: rgba(0, 0, 0, 0.16);
}
#opening-cost-30 .opening-cost-row--varies td {
    background: rgba(0, 0, 0, 0.28);
}
.opening-cost-cat {
    font-family: var(--font-chalk);
    font-weight: 700;
    color: #fff;
    width: 12%;
    white-space: nowrap;
}
.opening-cost-detail {
    color: rgba(255, 255, 255, 0.88);
    width: 58%;
    text-align: center;
}
.opening-cost-amount {
    text-align: center;
    font-weight: 700;
    color: #fff;
    width: 30%;
    white-space: nowrap;
}
.opening-cost-highlight {
    color: var(--color-gold, #f7a000);
    font-weight: 700;
}
.opening-cost-badge {
    display: inline-block;
    margin-right: 0.5em;
    padding: 0.2em 0.5em;
    background: var(--color-gold, #f7a000);
    color: #1a1a1a;
    font-size: 0.85em;
    font-weight: 700;
    border-radius: 4px;
    vertical-align: middle;
}
.opening-cost-strike {
    text-decoration: line-through;
    color: rgba(255, 255, 255, 0.6);
    margin-right: 0.25em;
}
.opening-cost-table tfoot td {
    border-top: 2px solid rgba(255, 255, 255, 0.25);
    padding: clamp(0.85rem, 1.5vw, 1rem);
    font-weight: 700;
    background: rgba(0, 0, 0, 0.25);
}
.opening-cost-total-label { text-align: center; color: #fff; }
.opening-cost-total-amount {
    text-align: center;
    font-size: clamp(1rem, 1.3vw, 1.2rem);
    color: #fff;
}
.opening-cost-note {
    margin: 0;
    font-size: clamp(0.75rem, 0.95vw, 0.875rem);
    color: rgba(255, 255, 255, 0.65);
    line-height: 1.5;
    text-align: center;
}
@media (max-width: 640px) {
    .opening-cost-table { font-size: 0.8rem; }
    .opening-cost-cat, .opening-cost-detail, .opening-cost-amount { width: auto; }
}

@media (max-width: 768px) {
    .metrics-inner { grid-template-columns: 1fr; }
}

.btn-more { font-size: clamp(0.75rem, 0.9vw, 0.875rem); color: var(--color-gold, #f7a000); text-decoration: none; font-weight: 500; }

/* 카츠왕만의 특별함 (스크롤 섹션) */
.section--special {
    background: #10192d;
    padding: var(--section-padding-y) var(--section-padding-x);
    padding-left: var(--section-padding-x);
}
.special-inner { max-width: var(--content-max); margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.special-inner .section__inner { max-width: 100%; }
.special-title { font-family: var(--font-accent, serif); font-size: clamp(1.6rem, 3.8vw, 2.75rem); color: #fff; margin-bottom: 0.75rem; line-height: 1.25; }
.special-desc { font-size: clamp(1rem, 1.2vw, 1.15rem); color: rgba(255,255,255,0.95); margin-bottom: 0.5rem; line-height: 1.5; }
.special-sub { font-size: clamp(0.875rem, 1vw, 1rem); color: rgba(255,255,255,0.75); line-height: 1.5; }
.special-left { margin-bottom: 0; }
.special-collage { height: 200px; background: rgba(255,255,255,0.08); border-radius: 8px; margin-bottom: 1.5rem; }
.special-profiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1rem, 2vw, 1.5rem); }
.profile-card { background: rgba(255,255,255,0.06); padding: clamp(1rem, 2vw, 1.5rem); border-radius: 8px; text-align: center; }
.profile-card .profile-img { width: 60px; height: 60px; margin: 0 auto 0.5rem; border-radius: 50%; background: rgba(255,255,255,0.15); }
.profile-card span { display: block; font-size: clamp(0.875rem, 1vw, 1rem); color: #fff; margin-bottom: 0.5rem; line-height: 1.3; }
@media (max-width: 768px) { .special-inner { grid-template-columns: 1fr; } .special-profiles { grid-template-columns: 1fr; } }

/* 창업성공 + 최고의 재료 묶음 (한 스크롤 섹션) — 배경·여백 통일로 창업문의와의 틈새 제거 */
.scroll-snap-section--group {
    min-height: 100vh;
    min-height: 100dvh;
    box-sizing: border-box;
    background: #0a1824;
    margin-bottom: 0;
}
.scroll-snap-section--group + .section--contact-form {
    margin-top: 0;
}
.section--franchise-gallery {
    background: #0a1824;
    padding: var(--section-padding-y) var(--section-padding-x);
    padding-left: var(--section-padding-x);
}
.gallery-inner {
    max-width: var(--content-wide);
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(300px, 400px) 1fr;
    gap: clamp(2rem, 5vw, 4rem);
    align-items: start;
    padding: 0 0.5rem;
}
.gallery-left { min-width: 0; }
.gallery-title { font-family: var(--font-accent, serif); font-size: clamp(2.25rem, 6vw, 5rem); color: #fff; line-height: 1.1; margin-bottom: 0.25rem; }
.gallery-desc { font-size: clamp(1.35rem, 1.7vw, 1.7rem); color: rgba(255,255,255,0.95); margin-bottom: 0.5rem; line-height: 1.4; }
.gallery-sub { font-size: clamp(0.875rem, 1vw, 1rem); color: rgba(255,255,255,0.75); line-height: 1.4; }
.gallery-right { min-width: 0; }
.gallery-flyers { min-height: 120px; background: rgba(255,255,255,0.06); border-radius: 8px; margin-bottom: 1rem; }
.gallery-carousel { overflow: hidden; }
.gallery-carousel .swiper-slide { width: 280px; }
.gallery-thumb { aspect-ratio: 16/10; background: rgba(255,255,255,0.1); border-radius: 6px; }
.gallery-carousel .swiper-button-prev,
.gallery-carousel .swiper-button-next { color: #fff; }
@media (max-width: 900px) { .gallery-inner { grid-template-columns: 1fr; } }

/* 브랜드 가치 / 최고의 재료 — 창업성공과 동일 배경, 원형 장식 제거 */
.section--values { background: #0a1824; padding: var(--section-padding-y) var(--section-padding-x); padding-left: var(--section-padding-x); padding-bottom: clamp(4rem, 10vw, 6rem); }
.values-inner { max-width: min(900px, 100%); margin: 0 auto; }
.values-deco { display: none; }
.values-icons { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.5rem, 4vw, 3rem); padding: 2rem 0; }
.value-item { text-align: center; color: #fff; }
.value-item i { font-size: clamp(2rem, 4vw, 2.5rem); color: var(--color-gold, #f7a000); margin-bottom: 0.75rem; display: block; }
.value-item h4 { font-size: clamp(1rem, 1.2vw, 1.2rem); margin-bottom: 0.35rem; line-height: 1.3; }
.value-item p { font-size: clamp(0.875rem, 1vw, 0.95rem); color: rgba(255,255,255,0.88); line-height: 1.5; }
@media (max-width: 768px) { .values-icons { grid-template-columns: 1fr; } }

/* 문의 폼 (다크 브라운) */
/* 창업문의하기: 이미지 배경 + 어두운 오버레이(0.8) */
.section--contact-form {
    background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url('../images/request_bg_01.jpg') no-repeat center center;
    background-size: cover;
    background-color: #2c2419;
    padding: var(--section-padding-y) var(--section-padding-x);
    padding-left: var(--section-padding-x);
    padding-top: clamp(4rem, 10vw, 6rem);
    min-height: 100vh;
    box-sizing: border-box;
    background-attachment: scroll;
}
.form-inner {
    width: 100%;
    max-width: min(500px, 100%);
    margin: 0 auto;
    box-sizing: border-box;
}
@media (min-width: 860px) {
    .form-inner {
        min-width: 800px;
        max-width: 800px;
    }
}
.form-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    background: transparent;
    padding: clamp(0.75rem, 1.5vw, 1rem) 0;
    margin-bottom: 1.5rem;
    padding-left: 0;
}
.form-title {
    margin: 0;
    font-family: var(--font-head-strong);
    font-size: clamp(2.25rem, 5vw, 3.5rem);
    font-weight: 700;
    color: #fff;
    line-height: 1.3;
    text-align: left;
}
.form-required-note {
    margin: 0;
    font-size: clamp(0.75rem, 0.9vw, 0.875rem);
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.4;
}
.contact-form .form-row { margin-bottom: 1.25rem; }
.contact-form .form-label {
    display: block;
    font-size: clamp(0.875rem, 1vw, 1rem);
    color: rgba(255, 255, 255, 0.92);
    margin-bottom: 0.4rem;
    line-height: 1.4;
}
.contact-form .form-label--required::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-right: 0.35em;
    vertical-align: middle;
    background: #e74c3c;
    border-radius: 50%;
}
.contact-form .form-row--checkbox {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    margin-bottom: 1rem;
}
.form-checkbox {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: clamp(0.8125rem, 0.95vw, 0.9375rem);
    color: rgba(255, 255, 255, 0.85);
    cursor: pointer;
    flex: 0 1 auto;
}
.form-checkbox__input-wrap { display: flex; align-items: center; }
.form-checkbox__input-wrap input { width: auto; min-height: auto; margin: 0; }
.form-checkbox__text { line-height: 1.4; }
.form-checkbox__spacer { flex: 1; min-width: 1rem; }
.form-link-view {
    flex-shrink: 0;
    padding: 0.35em 0.6em;
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.95);
    font-size: clamp(0.8125rem, 0.95vw, 0.9375rem);
    text-decoration: underline;
    cursor: pointer;
    font-family: inherit;
}
.form-link-view:hover { color: var(--color-gold, #f7a000); }
.contact-form label:not(.form-checkbox) { display: block; font-size: clamp(0.875rem, 1vw, 1rem); color: rgba(255,255,255,0.92); margin-bottom: 0.4rem; line-height: 1.4; }
.contact-form input, .contact-form textarea { width: 100%; padding: clamp(0.75rem, 1.5vw, 0.9rem) 1rem; min-height: 48px; border: 1px solid rgba(255,255,255,0.4); border-radius: 8px; background: rgba(255,255,255,0.22); color: #fff; font-size: clamp(0.9375rem, 1vw, 1rem); line-height: 1.4; }
.contact-form textarea { min-height: 120px; resize: vertical; }
.contact-form input::placeholder, .contact-form textarea::placeholder { color: rgba(255,255,255,0.5); }
.contact-form input:focus, .contact-form textarea:focus { outline: none; border-color: var(--color-gold, #f7a000); background: rgba(255,255,255,0.3); }
.btn-submit { width: 100%; padding: clamp(0.9rem, 2vw, 1.1rem) 2rem; min-height: 52px; background: #111; color: #fff; border: none; border-radius: 8px; font-size: clamp(0.9375rem, 1vw, 1.0625rem); font-weight: 600; cursor: pointer; margin-top: 0.5rem; transition: background 0.25s; }
.btn-submit:hover { background: var(--color-deep-green, #14331e); }

/* 개인정보 취급방침 전문보기 레이어 */
.privacy-layer {
    position: fixed;
    inset: 0;
    z-index: 10002;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    box-sizing: border-box;
}
.privacy-layer[hidden] { display: none; }
.privacy-layer__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    cursor: pointer;
}
.privacy-layer__box {
    position: relative;
    width: 100%;
    max-width: 520px;
    max-height: 80vh;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.privacy-layer__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    background: #1a1a1a;
    color: #fff;
}
.privacy-layer__title {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.3;
}
.privacy-layer__close {
    width: 36px;
    height: 36px;
    padding: 0;
    border: none;
    background: transparent;
    color: #fff;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    border-radius: 4px;
    transition: background 0.2s;
}
.privacy-layer__close:hover { background: rgba(255, 255, 255, 0.15); }
.privacy-layer__body {
    padding: 1.5rem 1.25rem;
    overflow-y: auto;
    color: #333;
    font-size: 0.9375rem;
    line-height: 1.6;
}
.privacy-layer__doc h5 {
    margin: 1.25rem 0 0.5rem;
    font-size: 1rem;
    font-weight: 700;
    color: #1a1a1a;
}
.privacy-layer__doc h5:first-of-type { margin-top: 0; }
.privacy-layer__doc p { margin: 0 0 0.5rem; }
.privacy-layer__doc ul {
    margin: 0.25rem 0 0.75rem 1.25rem;
    padding: 0;
}
.privacy-layer__doc li { margin-bottom: 0.25rem; }
.privacy-layer__empty {
    margin: 0;
    color: #888;
    font-style: italic;
}

/* 상담 접수 완료 레이어 */
.inquiry-success-layer {
    position: fixed;
    inset: 0;
    z-index: 10003;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    box-sizing: border-box;
}
.inquiry-success-layer[hidden] { display: none; }
.inquiry-success-layer__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    cursor: pointer;
}
.inquiry-success-layer__box {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 400px;
    padding: 2rem;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
    text-align: center;
}
.inquiry-success-layer__title {
    margin: 0 0 1rem;
    font-size: 1.25rem;
    font-weight: 700;
    color: #1a1a1a;
}
.inquiry-success-layer__text {
    margin: 0 0 1.5rem;
    font-size: 1rem;
    color: #333;
    line-height: 1.6;
}
.inquiry-success-layer__btn {
    display: inline-block;
    padding: 0.75rem 2rem;
    background: var(--color-deep-green, #14331e);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.25s;
}
.inquiry-success-layer__btn:hover {
    background: #1a3d28;
}

/* ===== 푸터 (창업문의하기와 구분) ===== */
.site-footer {
    background: #0f0f0f;
    color: #999;
    padding: clamp(3rem, 8vw, 4rem) var(--section-padding-x) 2rem;
    padding-top: clamp(3rem, 8vw, 4rem);
    font-size: clamp(0.8125rem, 1vw, 0.9375rem);
    line-height: 1.55;
    box-shadow: inset 0 24px 48px -12px rgba(0, 0, 0, 0.7);
}
.site-footer .foot-inner {
    max-width: var(--content-wide);
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 1.5rem;
}
.site-footer .foot-logo {
    margin-bottom: 1.25rem;
}
.site-footer .foot-logo .logo-text-ko {
    font-family: var(--font-accent, 'Nanum Myeongjo', serif);
    font-size: clamp(1.25rem, 1.5vw, 1.5rem);
    font-weight: 700;
    color: rgba(255, 255, 255, 0.75);
}
.site-footer .foot-info p {
    margin-bottom: 0.4rem;
    color: #999;
    line-height: 1.5;
}
.site-footer .foot-sns {
    display: flex;
    gap: 1rem;
}
.site-footer .foot-sns a {
    color: rgba(255, 255, 255, 0.6);
    font-size: clamp(1.1rem, 1.3vw, 1.25rem);
    transition: color 0.3s, opacity 0.3s;
}
.site-footer .foot-sns a:hover {
    color: var(--color-gold, #f7a000);
    opacity: 1;
}
.site-footer .copyright {
    text-align: center;
    border-top: 1px solid #333;
    margin-top: 2rem;
    padding-top: 1.5rem;
    font-size: clamp(0.75rem, 0.9vw, 0.8125rem);
    color: #666;
    line-height: 1.5;
}
.site-footer .footer-links {
    text-align: center;
    margin-top: 1rem;
    font-size: clamp(0.75rem, 0.9vw, 0.8125rem);
}
.site-footer .footer-links a { color: #888; text-decoration: none; }
.site-footer .footer-links a:hover { color: var(--color-gold, #f7a000); }
.site-footer .footer-links .sep { color: #555; margin: 0 0.5rem; }
.site-footer .footer-links .footer-admin-link { font-size: 0.75em; color: #666; letter-spacing: 0; }
.site-footer .footer-links .footer-admin-link:hover { color: var(--color-gold, #f7a000); }
@media (max-width: 768px) {
    .site-footer .foot-inner {
        flex-direction: column;
    }
}

/* ===== Reveal on Scroll: 섹션 진입 시 등장, 이탈 시 초기화 (반복 재생) ===== */

/* 기본 초기 상태 (숨김) */
.reveal-section .reveal-item {
    opacity: 0;
    transition: opacity 0.55s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
}
/* 방향별 초기 위치 */
.reveal-section .reveal-item[data-reveal-effect="fade-up"],
.reveal-section .reveal-item:not([data-reveal-effect]) {
    transform: translateY(28px);
}
.reveal-section .reveal-item[data-reveal-effect="fade-left"] {
    transform: translateX(28px);
}
.reveal-section .reveal-item[data-reveal-effect="fade-right"] {
    transform: translateX(-28px);
}
.reveal-section .reveal-item[data-reveal-effect="zoom-in"] {
    transform: scale(0.9);
}

/* 진입: revealed 클래스 추가 시 애니메이션 실행 */
.reveal-section.section-inview .reveal-item.revealed {
    opacity: 1;
    transform: translate(0) scale(1);
}

/* 이탈: 즉시 초기 상태로 (transition-delay = 0, JS에서 이미 0으로 설정) */
.reveal-section.section-out .reveal-item {
    opacity: 0;
    transition-duration: 0.25s; /* 이탈은 빠르게 */
}
.reveal-section.section-out .reveal-item[data-reveal-effect="fade-up"],
.reveal-section.section-out .reveal-item:not([data-reveal-effect]) {
    transform: translateY(28px);
}
.reveal-section.section-out .reveal-item[data-reveal-effect="fade-left"] {
    transform: translateX(28px);
}
.reveal-section.section-out .reveal-item[data-reveal-effect="fade-right"] {
    transform: translateX(-28px);
}
.reveal-section.section-out .reveal-item[data-reveal-effect="zoom-in"] {
    transform: scale(0.9);
}

/* 접근성: 모션 감소 설정 시 애니메이션 비활성화 */
@media (prefers-reduced-motion: reduce) {
    .reveal-section .reveal-item,
    .reveal-section.section-out .reveal-item {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/* ===========================================================
   신규 섹션 1: 브랜드 경쟁력 상세 (#sectionCompetitivenessDetail)
   =========================================================== */
.section--comp-detail {
    background: #0e1c27;
    color: #fff;
    padding: var(--section-padding-y) var(--section-padding-x);
}
.comp-detail-inner {
    max-width: var(--content-max);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: clamp(4rem, 8vw, 6rem);
}
.comp-detail-block {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(2rem, 5vw, 4rem);
    align-items: center;
}
.comp-detail-block--reverse {
    direction: rtl;
}
.comp-detail-block--reverse > * {
    direction: ltr;
}
.comp-detail-block__label {
    display: inline-block;
    font-family: var(--font-stencil);
    font-size: clamp(0.75rem, 1vw, 0.9rem);
    color: rgba(255,255,255,0.5);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 0.5rem;
}
.comp-detail-block__title {
    font-family: var(--font-chalk);
    font-size: clamp(1.4rem, 2.5vw, 2rem);
    font-weight: 700;
    color: #e6c200;
    line-height: 1.35;
    margin: 0 0 1.2rem;
}
.comp-detail-block__body {
    font-size: clamp(0.85rem, 1.1vw, 1rem);
    line-height: 1.7;
    color: rgba(255,255,255,0.85);
    margin: 0 0 1.5rem;
}
.comp-detail-block__quote {
    border-left: 3px solid #e6c200;
    padding: 1rem 1.25rem;
    margin: 0;
    background: rgba(255,255,255,0.04);
    border-radius: 0 8px 8px 0;
    font-size: clamp(0.85rem, 1vw, 0.95rem);
    color: rgba(255,255,255,0.9);
    line-height: 1.6;
}
.comp-detail-block__quote-label {
    display: block;
    font-family: var(--font-stencil);
    font-size: 0.75rem;
    color: #e6c200;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 0.4rem;
}

/* 게이지 비교 (SAVING) */
.gauge-compare {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: clamp(1.5rem, 3vw, 2.5rem);
    padding: 2rem 0;
}
.gauge-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
}
.gauge-bar {
    width: clamp(60px, 8vw, 90px);
    height: 200px;
    background: rgba(255,255,255,0.08);
    border-radius: 8px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
}
.gauge-bar__fill {
    width: 100%;
    border-radius: 8px 8px 0 0;
    transition: height 1.2s ease;
}
.gauge-bar__fill--38 {
    height: 76%;
    background: linear-gradient(to top, #6b3a3a, #a05050);
}
.gauge-bar__fill--30 {
    height: 60%;
    background: linear-gradient(to top, #2a6b3a, #4caf50);
}
.gauge-item__num {
    font-family: var(--font-stencil);
    font-size: clamp(1.8rem, 3vw, 2.5rem);
    font-weight: 700;
    color: #fff;
}
.gauge-item--highlight .gauge-item__num {
    color: #e6c200;
}
.gauge-item__caption {
    font-size: clamp(0.72rem, 0.9vw, 0.82rem);
    color: rgba(255,255,255,0.6);
    text-align: center;
    line-height: 1.4;
}
.gauge-compare__arrow {
    font-size: clamp(1.5rem, 2.5vw, 2rem);
    color: #e6c200;
    align-self: center;
    margin-bottom: 3rem;
}

/* 혜택 그리드 (FREE) */
.benefit-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(0.75rem, 1.5vw, 1.25rem);
}
.benefit-card {
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 12px;
    padding: clamp(1.2rem, 2vw, 1.6rem);
    text-align: center;
    transition: background 0.3s ease, transform 0.3s ease;
}
.benefit-card:hover {
    background: rgba(255,255,255,0.1);
    transform: translateY(-4px);
}
.benefit-card i {
    font-size: clamp(1.5rem, 2.5vw, 2rem);
    color: #e6c200;
    margin-bottom: 0.75rem;
    display: block;
}
.benefit-card strong {
    display: block;
    font-family: var(--font-stencil);
    font-size: clamp(0.9rem, 1.2vw, 1.05rem);
    margin-bottom: 0.5rem;
}
.benefit-card p {
    margin: 0;
    font-size: clamp(0.75rem, 0.9vw, 0.85rem);
    color: rgba(255,255,255,0.7);
    line-height: 1.5;
}

/* 마케팅 카드 (MARKETING) */
.marketing-cards {
    display: flex;
    flex-direction: column;
    gap: clamp(0.75rem, 1.5vw, 1.25rem);
}
.marketing-card {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 10px;
    padding: clamp(1rem, 1.8vw, 1.4rem);
    transition: background 0.3s ease;
}
.marketing-card:hover {
    background: rgba(255,255,255,0.08);
}
.marketing-card__icon {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(230,194,0,0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #e6c200;
    font-size: 1.1rem;
}
.marketing-card strong {
    display: block;
    font-size: clamp(0.9rem, 1.1vw, 1rem);
    margin-bottom: 0.3rem;
}
.marketing-card p {
    margin: 0;
    font-size: clamp(0.78rem, 0.9vw, 0.88rem);
    color: rgba(255,255,255,0.7);
    line-height: 1.55;
}

@media (max-width: 900px) {
    .comp-detail-block {
        grid-template-columns: 1fr;
    }
    .comp-detail-block--reverse {
        direction: ltr;
    }
    .gauge-bar {
        height: 140px;
    }
}

/* ===========================================================
   신규 섹션 2: 창업 절차 안내 (#sectionProcess)
   =========================================================== */
.section--process {
    background: #fff;
    padding: var(--section-padding-y) var(--section-padding-x);
}
.process-inner {
    max-width: var(--content-max);
    margin: 0 auto;
}
.process-header {
    text-align: center;
    margin-bottom: clamp(2.5rem, 5vw, 4rem);
}
.process-title {
    font-family: var(--font-title-food);
    font-size: clamp(1.6rem, 3vw, 2.4rem);
    color: var(--color-black);
    margin: 0 0 0.6rem;
}
.process-subtitle {
    font-size: clamp(0.85rem, 1.1vw, 1rem);
    color: #666;
    margin: 0;
}
.process-timeline {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    position: relative;
    gap: 0.5rem;
}
.process-timeline::before {
    content: '';
    position: absolute;
    top: 32px;
    left: 10%;
    right: 10%;
    height: 2px;
    border-top: 2px dashed #d0d0d0;
    z-index: 0;
}
.process-step {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    position: relative;
    z-index: 1;
}
.process-step__icon {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: #14331e;
    color: #e6c200;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    margin-bottom: 1rem;
    box-shadow: 0 4px 16px rgba(20,51,30,0.25);
}
.process-step__num {
    font-family: var(--font-stencil);
    font-size: clamp(0.7rem, 0.9vw, 0.8rem);
    color: #e6c200;
    letter-spacing: 0.08em;
    margin-bottom: 0.35rem;
}
.process-step__title {
    font-size: clamp(0.95rem, 1.3vw, 1.15rem);
    color: var(--color-black);
    margin-bottom: 0.35rem;
}
.process-step__desc {
    margin: 0;
    font-size: clamp(0.75rem, 0.9vw, 0.85rem);
    color: #888;
    line-height: 1.5;
    max-width: 160px;
}

@media (max-width: 900px) {
    .process-timeline {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }
    .process-timeline::before {
        top: 0;
        bottom: 0;
        left: 32px;
        right: auto;
        width: 2px;
        height: auto;
        border-top: none;
        border-left: 2px dashed #d0d0d0;
    }
    .process-step {
        flex-direction: row;
        text-align: left;
        gap: 1rem;
        padding: 1rem 0;
    }
    .process-step__icon {
        flex-shrink: 0;
        margin-bottom: 0;
    }
    .process-step__desc {
        max-width: none;
    }
}

/* ===========================================================
   신규 섹션 3: 파트너 모집 CTA (#sectionPartnerCTA)
   =========================================================== */
.section--partner-cta {
    position: relative;
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.partner-cta-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    z-index: 0;
}
.partner-cta-overlay {
    position: absolute;
    inset: 0;
    background: rgba(20,51,30,0.82);
    z-index: 1;
}
.partner-cta-content {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: 720px;
    padding: clamp(3rem, 8vw, 5rem) var(--section-padding-x);
}
.partner-cta__title {
    font-family: var(--font-stencil);
    font-size: clamp(1.8rem, 3.5vw, 2.8rem);
    color: #fff;
    line-height: 1.35;
    margin: 0 0 1.2rem;
}
.partner-cta__lead {
    font-size: clamp(1rem, 1.6vw, 1.3rem);
    color: #e6c200;
    margin: 0 0 1.5rem;
    line-height: 1.5;
}
.partner-cta__body {
    font-size: clamp(0.85rem, 1.1vw, 1rem);
    color: rgba(255,255,255,0.8);
    line-height: 1.75;
    margin: 0 0 2.5rem;
}
.partner-cta__btn {
    display: inline-block;
    padding: 1rem 2.5rem;
    background: #e6c200;
    color: #14331e;
    font-family: var(--font-stencil);
    font-size: clamp(0.95rem, 1.2vw, 1.1rem);
    font-weight: 700;
    text-decoration: none;
    border-radius: 50px;
    transition: background 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 4px 20px rgba(230,194,0,0.3);
}
.partner-cta__btn:hover {
    background: #ffd600;
    transform: translateY(-2px);
    box-shadow: 0 8px 32px rgba(230,194,0,0.45);
}


/* =============================================
   ★ 브랜드 스토리 v2 (리디자인)
   ============================================= */
.section--brand-v2 {
    background: linear-gradient(170deg, #0d1420 0%, #1a2840 50%, #0d1420 100%);
    padding: clamp(4rem, 10vw, 7rem) var(--section-padding-x);
    position: relative;
    overflow: hidden;
}
.section--brand-v2::before {
    content: '';
    position: absolute;
    top: -40%; right: -20%;
    width: 60%; height: 120%;
    background: radial-gradient(ellipse, rgba(230,194,0,0.06) 0%, transparent 70%);
    pointer-events: none;
}
.brand-v2-inner {
    max-width: 1200px;
    margin: 0 auto;
}
.brand-v2-header {
    text-align: center;
    margin-bottom: clamp(2rem, 5vw, 3.5rem);
}
.brand-v2-label {
    display: inline-block;
    font-family: var(--font-stencil);
    font-size: clamp(0.7rem, 1.2vw, 0.85rem);
    color: var(--color-gold);
    letter-spacing: 0.3em;
    text-transform: uppercase;
    margin-bottom: 0.8rem;
    border: 1px solid rgba(230,194,0,0.3);
    padding: 0.35em 1.2em;
    border-radius: 50px;
}
.brand-v2-title {
    font-family: var(--font-head-art);
    font-size: clamp(1.8rem, 4vw, 3rem);
    color: rgba(255,255,255,0.68);
    font-weight: 400;
    line-height: 1.3;
    margin: 0 0 0.6rem;
}
.brand-v2-subtitle {
    font-size: clamp(1rem, 2vw, 1.3rem);
    color: rgba(255,255,255,0.7);
    margin: 0;
}
.brand-v2-subtitle em {
    color: var(--color-gold);
    font-style: normal;
    font-weight: 700;
}
.brand-v2-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(1rem, 2.5vw, 2rem);
    margin-bottom: clamp(2rem, 4vw, 3rem);
}
.brand-v2-card {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 16px;
    padding: clamp(1.5rem, 3vw, 2.2rem);
    transition: transform 0.35s ease, border-color 0.35s ease, background 0.35s ease;
}
.brand-v2-card:hover {
    transform: translateY(-6px);
    border-color: rgba(230,194,0,0.3);
    background: rgba(255,255,255,0.07);
}
.brand-v2-card__icon {
    width: 48px; height: 48px;
    display: flex; align-items: center; justify-content: center;
    background: rgba(230,194,0,0.12);
    border-radius: 12px;
    color: var(--color-gold);
    font-size: 1.2rem;
    margin-bottom: 1rem;
}
.brand-v2-card__title {
    font-family: var(--font-korean);
    font-size: clamp(1rem, 1.6vw, 1.2rem);
    color: #fff;
    font-weight: 700;
    margin: 0 0 0.6rem;
}
.brand-v2-card__text {
    font-size: clamp(0.85rem, 1.2vw, 0.95rem);
    color: rgba(255,255,255,0.65);
    line-height: 1.7;
    margin: 0;
}
.brand-v2-img {
    border-radius: 20px;
    overflow: hidden;
    margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
    max-height: 400px;
}
.brand-v2-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.brand-v2-cta {
    text-align: center;
}
.brand-v2-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    background: var(--color-gold);
    color: #1a1a1a;
    padding: 0.9em 2.4em;
    border-radius: 50px;
    font-weight: 700;
    font-size: clamp(0.9rem, 1.2vw, 1rem);
    text-decoration: none;
    transition: background 0.3s, transform 0.3s, box-shadow 0.3s;
    box-shadow: 0 4px 20px rgba(230,194,0,0.25);
}
.brand-v2-btn:hover {
    background: #ffd600;
    transform: translateY(-2px);
    box-shadow: 0 8px 32px rgba(230,194,0,0.4);
}
@media (max-width: 768px) {
    .brand-v2-grid { grid-template-columns: 1fr; }
    .brand-v2-img { max-height: 250px; }
}


/* =============================================
   ★ 창업비용 통합 v2 (리디자인)
   ============================================= */
.section--cost-v2 {
    background: #05070d; /* fallback when bg image not loaded */
    padding: clamp(4rem, 10vw, 7rem) var(--section-padding-x);
    position: relative;
    overflow: visible;
}
.cost-v2-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    pointer-events: none;
}
.cost-v2-bg--photo {
    z-index: 0;
    filter: brightness(0.93) saturate(1.08) contrast(1.02);
}
.cost-v2-overlay {
    position: absolute;
    inset: 0;
    /* 예전 아트 레이어 역할: 미세 톤·비네팅을 그라데이션으로 */
    background:
        radial-gradient(ellipse 100% 75% at 50% 0%, rgba(255, 214, 140, 0.07) 0%, transparent 52%),
        radial-gradient(ellipse 90% 70% at 50% 100%, rgba(0, 0, 0, 0.35) 0%, transparent 55%),
        linear-gradient(170deg, rgba(4,6,12,0.94) 0%, rgba(10,16,28,0.91) 50%, rgba(4,6,12,0.96) 100%),
        rgba(0, 0, 0, 0.2);
    z-index: 2;
}
.cost-v2-inner {
    position: relative;
    z-index: 3;
    max-width: 1140px;
    margin: 0 auto;
}
.cost-v2-header {
    text-align: center;
    margin-bottom: clamp(2rem, 5vw, 3rem);
}
.cost-v2-label {
    display: inline-block;
    font-family: var(--font-stencil);
    font-size: clamp(0.7rem, 1.2vw, 0.85rem);
    color: var(--color-gold);
    letter-spacing: 0.3em;
    text-transform: uppercase;
    margin-bottom: 0.8rem;
    border: 1px solid rgba(230,194,0,0.3);
    padding: 0.35em 1.2em;
    border-radius: 50px;
}
.cost-v2-title {
    font-family: var(--font-head-art);
    font-weight: 400;
    font-size: clamp(1.8rem, 4vw, 3rem);
    color: rgba(255,255,255,0.68);
    line-height: 1.3;
    margin: 0 0 0.6rem;
}
.cost-v2-subtitle {
    font-size: clamp(0.9rem, 1.5vw, 1.1rem);
    color: rgba(255,255,255,0.6);
    margin: 0;
}

/* 비용 섹션: 수익 구조 + 창업 비용 표 (PC 좌우 — 좌측 좁게, 모바일 세로) */
.cost-v2-tables {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
    gap: clamp(1.25rem, 2.8vw, 2.25rem);
    align-items: start;
    margin-bottom: clamp(1rem, 2vw, 1.5rem);
    width: 100%;
}
.cost-v2-table-panel {
    min-width: 0;
}
@media (min-width: 1025px) {
    .cost-v2-tables {
        grid-template-columns: minmax(0, 20rem) minmax(0, 1fr);
        gap: clamp(0.85rem, 1.8vw, 1.35rem);
        max-width: 1040px;
        margin-left: auto;
        margin-right: auto;
    }
}
.cost-v2-table-heading {
    font-family: 'Pretendard', var(--font-ui), -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: clamp(0.84rem, 1.05vw, 0.95rem);
    font-weight: 600;
    color: rgba(255, 255, 255, 0.92);
    margin: 0 0 0.65rem;
    text-align: center;
    letter-spacing: -0.02em;
    line-height: 1.45;
}
.cost-v2-table-scroll {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 10px;
}
.cost-data-table {
    width: 100%;
    min-width: 0;
    border-collapse: collapse;
    font-size: clamp(0.7rem, 0.95vw, 0.86rem);
    table-layout: fixed;
}
/* 좌측 수익 구조: 컬럼 폭·패딩 축소로 전체 너비 절약 */
.cost-data-table--profit {
    font-size: clamp(0.64rem, 0.82vw, 0.78rem);
}
.cost-data-table--profit thead th,
.cost-data-table--profit tbody th,
.cost-data-table--profit tbody td {
    padding: 0.34rem 0.32rem;
}
.cost-data-table--profit thead th:first-child {
    width: 28%;
}
.cost-data-table--profit .cost-data-table__cell-num {
    width: 24%;
}
/* 창업 비용: 인테리어 행 항목명 한 줄 */
.cost-data-table--startup th.cost-data-table__cell-nowrap {
    white-space: nowrap;
}
.cost-data-table--startup {
    min-width: 420px;
}
.cost-data-table thead th {
    background: #cce3de;
    color: #0a0a0a;
    font-weight: 700;
    padding: 0.55rem 0.45rem;
    text-align: center;
    border: none;
    vertical-align: middle;
}
.cost-data-table thead th:first-child {
    text-align: left;
    border-radius: 10px 0 0 0;
}
.cost-data-table thead th:last-child {
    border-radius: 0 10px 0 0;
}
.cost-data-table__cell-num {
    text-align: right;
    white-space: nowrap;
}
.cost-data-table tbody th,
.cost-data-table tbody td {
    padding: 0.42rem 0.45rem;
    vertical-align: middle;
    border: none;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
}
.cost-data-table tbody th {
    font-weight: 600;
    text-align: left;
    color: rgba(255, 255, 255, 0.94);
    background: rgba(42, 48, 58, 0.96);
}
.cost-data-table tbody td {
    color: rgba(255, 255, 255, 0.9);
    background: rgba(42, 48, 58, 0.96);
}
.cost-data-table tbody tr:nth-child(even) th,
.cost-data-table tbody tr:nth-child(even) td {
    background: rgba(36, 41, 50, 0.96);
}
.cost-data-table__total th,
.cost-data-table__total td {
    font-weight: 700;
    background: rgba(48, 54, 66, 0.98) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
}
.cost-data-table__total th {
    color: #fff;
}
.cost-data-table__gold {
    color: var(--color-gold, #e6c200) !important;
}
.cost-v2-table-note {
    margin: 0.65rem 0 0;
    font-size: clamp(0.66rem, 0.9vw, 0.78rem);
    color: rgba(255, 255, 255, 0.45);
    font-style: normal;
    line-height: 1.55;
    text-align: left;
}

/* ==============================================
   ★ 창업 비용 카드형 레이아웃 (신규)
   ============================================== */
.cost-new-wrap {
    display: grid;
    grid-template-columns: clamp(14.5rem, 24vw, 19rem) minmax(0, 1fr);
    gap: clamp(0.85rem, 1.6vw, 1.25rem);
    align-items: start;
    margin-top: clamp(2rem, 4vw, 3rem);
}
.cost-new-intro {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    min-width: 0;
}
.cost-new-headline {
    font-family: 'Pretendard', sans-serif;
    font-size: clamp(1.15rem, 2vw, 1.65rem);
    font-weight: 700;
    color: rgba(255,255,255,0.92);
    line-height: 1.5;
    margin: 0;
    letter-spacing: -0.01em;
    word-break: keep-all;
}
.cost-new-headline__accent {
    color: #FFD700;
    white-space: nowrap;
}
@media (max-width: 420px) {
    .cost-new-headline__accent {
        white-space: normal;
    }
}
.cost-new-benefits {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
}
.cost-new-benefits li {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
}
.cnb-icon {
    flex-shrink: 0;
    width: 2.2rem;
    height: 2.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,215,0,0.12);
    border: 1px solid rgba(255,215,0,0.28);
    border-radius: 50%;
    color: #FFD700;
    font-size: 0.85rem;
    margin-top: 0.05rem;
}
.cnb-text {
    display: flex;
    flex-direction: column;
    gap: 0.18rem;
}
.cnb-text strong {
    font-family: 'Pretendard', sans-serif;
    font-size: clamp(0.82rem, 1.1vw, 0.94rem);
    font-weight: 700;
    color: rgba(255,255,255,0.9);
}
.cnb-text span {
    font-family: 'Pretendard', sans-serif;
    font-size: clamp(0.7rem, 0.9vw, 0.78rem);
    color: rgba(255,255,255,0.42);
}
/* ──────────────────────────────────────────────
   통합 비용 테이블 (좌측 항목 레이블 + 4열 금액)
────────────────────────────────────────────── */
.cost-unified-table {
    width: 100%;
    border-radius: 12px;
    overflow: visible; /* 행 등장 애니메이션이 잘리지 않도록 */
    border: 1px solid rgba(255,255,255,0.2);
}
/* 첫 번째/마지막 행에 border-radius 직접 적용 */
.cut-row--header .cut-cell:first-child { border-radius: 12px 0 0 0; }
.cut-row--header .cut-cell:last-child  { border-radius: 0 12px 0 0; }
.cut-row--total  .cut-cell:first-child { border-radius: 0 0 0 12px; }
.cut-row--total  .cut-cell:last-child  { border-radius: 0 0 12px 0; }
.cut-row {
    display: grid;
    grid-template-columns: 6.35rem repeat(3, minmax(0, 1fr));
    align-items: stretch;
    border-bottom: 1px solid rgba(255,255,255,0.16);
}
.cut-row:last-child {
    border-bottom: none;
}
.cut-row:nth-child(odd):not(.cut-row--header):not(.cut-row--total) .cut-cell {
    background: rgba(255,255,255,0.12);
}
.cut-row--header {
    border-bottom: 1px solid rgba(255,255,255,0.24);
}
.cut-row--total {
    border-top: 2px solid rgba(255,215,0,0.42);
    border-bottom: none;
}
.cut-cell {
    padding: 0.45rem 0.42rem;
    font-family: 'Pretendard', sans-serif;
    font-size: clamp(0.66rem, 0.88vw, 0.8rem);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-right: 1px solid rgba(255,255,255,0.16);
}
.cut-cell:last-child {
    border-right: none;
}
/* 좌측 레이블 열 */
.cut-cell--label {
    justify-content: center;
    text-align: center;
    color: rgba(255,255,255,0.82);
    font-size: clamp(0.72rem, 0.92vw, 0.84rem);
    font-weight: 700;
    border-right: 1px solid rgba(255,255,255,0.22);
    background: rgba(0,0,0,0.28) !important;
    padding: 0.45rem 0.42rem;
    white-space: nowrap;
    flex-direction: column;
    align-items: center;
    gap: 0;
    line-height: 1.3;
}
.cut-cell--label em {
    font-style: normal;
    font-size: 0.78em;
    font-weight: 400;
    color: rgba(255,255,255,0.42);
    display: block;
}
/* 금액 열 */
.cut-cell--col {
    color: rgba(255,255,255,0.92);
    font-family: 'GmarketSans', 'Gmarket Sans', sans-serif;
    font-size: clamp(0.66rem, 0.88vw, 0.8rem);
    font-weight: 600;
    flex-direction: column;
    gap: 0;
    line-height: 1.2;
}
.cut-cell--col em {
    font-style: normal;
    font-size: 0.72em;
    font-family: 'Pretendard', sans-serif;
    color: rgba(255,255,255,0.6);
    display: block;
}
/* 베스트(12평) 열 강조 */
.cut-cell--best {
    background: rgba(255,215,0,0.16) !important;
    border-right-color: rgba(255,215,0,0.28);
    border-left: 1px solid rgba(255,215,0,0.28);
}
/* 황금색 값 */
.cut-val--gold {
    color: #FFD700 !important;
}
.cut-val--gold em {
    color: rgba(255,215,0,0.7) !important;
}
/* 헤더 */
.cut-row--header .cut-cell {
    padding: 0.58rem 0.42rem;
    background: rgba(255,255,255,0.14) !important;
}
.cut-row--header .cut-cell--best {
    background: rgba(255,215,0,0.17) !important;
}
/* 12평 헤더: 베스트 배지 = 이 셀 우상단 기준 */
.cut-row--header .cut-cell--head-best {
    position: relative;
    padding-top: 1.05rem;
}
.cut-badge {
    display: inline-block;
    background: #FFD700;
    color: #111;
    font-family: 'Pretendard', sans-serif;
    font-size: 0.55rem;
    font-weight: 800;
    padding: 0.15em 0.6em;
    border-radius: 100px;
    letter-spacing: 0.03em;
    white-space: nowrap;
}
/* 12평 열 헤더 셀 우상단 */
.cut-badge--corner {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    margin: 0;
    padding: 0.34em 0.65em 0.3em;
    font-size: clamp(0.52rem, 0.65vw, 0.6rem);
    border-radius: 0 0 0 9px;
    line-height: 1.2;
    box-shadow: 0 1px 0 rgba(0,0,0,0.1);
}
.cut-pyeong {
    display: flex;
    align-items: baseline;
    gap: 0.12em;
}
.cut-num {
    font-family: 'GmarketSans', 'Gmarket Sans', sans-serif;
    font-size: clamp(1.35rem, 2vw, 1.85rem);
    font-weight: 700;
    color: #FFD700;
    line-height: 1;
}
.cut-unit {
    font-family: 'Pretendard', sans-serif;
    font-size: clamp(0.68rem, 0.85vw, 0.78rem);
    font-weight: 600;
    color: rgba(255,255,255,0.52);
}
/* 합계 행 */
.cut-row--total .cut-cell {
    padding-top: 0.8rem;
    padding-bottom: 0.8rem;
    background: rgba(0,0,0,0.38) !important;
}
.cut-row--total .cut-cell--best {
    background: rgba(255,215,0,0.2) !important;
}
.cut-row--total .cut-cell--label {
    color: rgba(255,255,255,0.85);
    font-weight: 700;
    font-size: clamp(0.68rem, 0.88vw, 0.8rem);
    background: rgba(0,0,0,0.45) !important;
}
.cut-row--total .cut-cell--col {
    font-size: clamp(0.85rem, 1.1vw, 1rem);
}
.cut-row--total .cut-cell--col em {
    color: rgba(255,215,0,0.75) !important;
    font-size: 0.65em;
}
/* 반응형: 모바일 가로 스크롤 */
@media (max-width: 640px) {
    .cost-unified-table {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        border-radius: 10px;
    }
    .cut-row {
        min-width: 460px;
        grid-template-columns: 5.5rem repeat(4, 1fr);
    }
}

/* 카드 그리드 */
.cost-cards-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}
.cost-pyeong-card {
    position: relative;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 14px;
    padding: 1.4rem 1.2rem 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: border-color 0.25s, transform 0.25s;
}
.cost-pyeong-card:hover {
    border-color: rgba(255,215,0,0.35);
    transform: translateY(-3px);
}
.cost-pyeong-card--best {
    border-color: rgba(255,215,0,0.45);
    background: rgba(255,215,0,0.05);
}
.cost-pyeong-card--best::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(255,215,0,0.08) 0%, transparent 70%);
    pointer-events: none;
}
.cost-pyeong-card__badge {
    position: absolute;
    top: 0;
    right: 0;
    background: #FFD700;
    color: #111;
    font-family: 'Pretendard', sans-serif;
    font-size: 0.63rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    padding: 0.28em 0.8em;
    border-radius: 0 14px 0 10px;
}
.cost-pyeong-card__header {
    display: flex;
    align-items: baseline;
    gap: 0.2em;
    margin-bottom: 1rem;
    padding-bottom: 0.8rem;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}
.cpcard-num {
    font-family: 'GmarketSans', 'Gmarket Sans', sans-serif;
    font-size: clamp(1.8rem, 2.8vw, 2.4rem);
    font-weight: 700;
    color: #FFD700;
    line-height: 1;
}
.cpcard-unit {
    font-family: 'Pretendard', sans-serif;
    font-size: clamp(0.85rem, 1.1vw, 1rem);
    font-weight: 600;
    color: rgba(255,255,255,0.5);
}
.cost-pyeong-card__items {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    flex: 1;
}
.cost-pyeong-card__items li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.45rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    font-family: 'Pretendard', sans-serif;
    font-size: clamp(0.68rem, 0.92vw, 0.8rem);
}
.cost-pyeong-card__items li:last-child {
    border-bottom: none;
}
.cpi-label {
    color: rgba(255,255,255,0.48);
    flex-shrink: 0;
}
.cpi-val {
    font-weight: 600;
    color: rgba(255,255,255,0.82);
    text-align: right;
    font-family: 'GmarketSans', 'Gmarket Sans', sans-serif;
    font-size: 0.76rem;
}
.cpi-val--gold {
    color: #FFD700;
}
.cpi-val em {
    font-style: normal;
    font-size: 0.7em;
    font-family: 'Pretendard', sans-serif;
    opacity: 0.7;
    margin-left: 0.2em;
}
.cost-pyeong-card__total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0.8rem -1.2rem 0;
    padding: 0.9rem 1.2rem;
    background: rgba(0,0,0,0.35);
    border-top: 1px solid rgba(255,215,0,0.18);
}
.cost-pyeong-card--best .cost-pyeong-card__total {
    background: rgba(255,215,0,0.1);
    border-top-color: rgba(255,215,0,0.4);
}
.cpt-label {
    font-family: 'Pretendard', sans-serif;
    font-size: 0.68rem;
    font-weight: 700;
    color: rgba(255,255,255,0.45);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.cpt-amount {
    font-family: 'GmarketSans', 'Gmarket Sans', sans-serif;
    font-size: clamp(1.05rem, 1.6vw, 1.35rem);
    font-weight: 700;
    color: #FFD700;
    line-height: 1;
}
.cpt-amount em {
    font-style: normal;
    font-family: 'Pretendard', sans-serif;
    font-size: 0.6em;
    font-weight: 500;
    color: rgba(255,215,0,0.7);
    margin-left: 0.15em;
}
@media (max-width: 1024px) {
    .cost-new-wrap {
        grid-template-columns: 1fr;
    }
    .cost-new-benefits {
        flex-direction: row;
        flex-wrap: wrap;
    }
    .cost-new-benefits li {
        flex: 1 1 calc(33% - 0.8rem);
        min-width: 160px;
    }
}
@media (max-width: 640px) {
    .cost-cards-grid {
        grid-template-columns: 1fr 1fr;
        gap: 0.7rem;
    }
    .cost-pyeong-card {
        padding: 1rem 0.85rem 0;
    }
    .cost-pyeong-card__total {
        margin: 0.7rem -0.85rem 0;
        padding: 0.7rem 0.85rem;
    }
    .cost-new-benefits li {
        flex: 1 1 100%;
    }
}
@media (max-width: 400px) {
    .cost-cards-grid {
        grid-template-columns: 1fr;
    }
}

.cost-v2-highlights {
    display: flex;
    justify-content: center;
    gap: clamp(1rem, 3vw, 2.5rem);
    margin-bottom: clamp(2.5rem, 5vw, 4rem);
    flex-wrap: wrap;
}
.cost-v2-highlight {
    text-align: center;
    min-width: 140px;
}
.cost-v2-highlight__badge {
    display: inline-block;
    background: rgba(230,194,0,0.15);
    color: var(--color-gold);
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.3em 1em;
    border-radius: 50px;
    letter-spacing: 0.08em;
    margin-bottom: 0.5rem;
}
.cost-v2-highlight__value {
    display: block;
    font-family: var(--font-stencil);
    font-size: clamp(2.2rem, 5vw, 3.5rem);
    color: #fff;
    font-weight: 700;
    line-height: 1.1;
}
.cost-v2-highlight__value small {
    font-size: 0.4em;
    color: rgba(255,255,255,0.5);
}
.cost-v2-highlight__note {
    display: block;
    font-size: 0.8rem;
    color: rgba(255,255,255,0.45);
    margin-top: 0.2rem;
}
.cost-v2-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(1rem, 2vw, 1.5rem);
    margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}
.cost-v2-card {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 16px;
    overflow: hidden;
    position: relative;
    transition: transform 0.35s ease, border-color 0.35s ease;
}
.cost-v2-card:hover {
    transform: translateY(-4px);
    border-color: rgba(230,194,0,0.25);
}
.cost-v2-card--featured {
    border-color: var(--color-gold);
    background: rgba(230,194,0,0.06);
}
.cost-v2-card--featured:hover {
    border-color: var(--color-gold);
}
.cost-v2-card__badge {
    position: absolute;
    top: 0; right: 0;
    background: var(--color-gold);
    color: #1a1a1a;
    font-family: var(--font-stencil);
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.35em 1em;
    border-radius: 0 16px 0 12px;
    letter-spacing: 0.1em;
}
.cost-v2-card__header {
    padding: clamp(1.2rem, 2.5vw, 1.8rem);
    text-align: center;
    border-bottom: 1px solid rgba(255,255,255,0.06);
}
.cost-v2-card__size {
    display: block;
    font-family: var(--font-stencil);
    font-size: clamp(0.9rem, 1.5vw, 1.1rem);
    color: var(--color-gold);
    letter-spacing: 0.1em;
    margin-bottom: 0.3rem;
}
.cost-v2-card__size-caption {
    color: #fff;
    font-weight: 500;
}
.cost-v2-card__total {
    display: block;
    font-family: var(--font-stencil);
    font-size: clamp(1.8rem, 3.5vw, 2.6rem);
    color: #fff;
    font-weight: 700;
    line-height: 1.1;
}
.cost-v2-card__total small {
    font-size: 0.4em;
    color: rgba(255,255,255,0.5);
}
.cost-v2-card__list {
    list-style: none;
    margin: 0;
    padding: clamp(0.8rem, 2vw, 1.2rem) clamp(1rem, 2.5vw, 1.5rem);
}
.cost-v2-card__list li {
    display: flex;
    justify-content: space-between;
    padding: 0.5em 0;
    font-size: clamp(0.8rem, 1.1vw, 0.9rem);
    color: rgba(255,255,255,0.6);
    border-bottom: 1px solid rgba(255,255,255,0.04);
}
.cost-v2-card__list li:last-child {
    border-bottom: none;
}
.cost-v2-card__list li span:last-child {
    color: rgba(255,255,255,0.85);
    font-weight: 600;
}
.cost-v2-footnote {
    text-align: center;
    font-size: clamp(0.75rem, 1vw, 0.85rem);
    color: rgba(255,255,255,0.35);
    margin: 0;
}
.cost-v2-footnote--after-tables {
    margin-top: clamp(1rem, 2.5vw, 1.75rem);
}
.cost-v2-footnote--extra {
    margin-top: 0.45rem;
    color: rgba(255,255,255,0.28);
}
@media (max-width: 1024px) {
    .cost-v2-tables {
        grid-template-columns: 1fr;
        max-width: none;
    }
}
@media (max-width: 768px) {
    .cost-v2-cards { grid-template-columns: 1fr; max-width: 400px; margin-left: auto; margin-right: auto; }
    .cost-v2-highlights { gap: 1.5rem; }
    .cost-data-table { font-size: clamp(0.68rem, 2.8vw, 0.82rem); }
    .cost-data-table--profit {
        font-size: clamp(0.66rem, 2.7vw, 0.78rem);
    }
    .cost-data-table--profit thead th,
    .cost-data-table--profit tbody th,
    .cost-data-table--profit tbody td {
        padding: 0.38rem 0.35rem;
    }
    .cost-v2-table-heading {
        font-size: clamp(0.8rem, 3.1vw, 0.92rem);
        font-weight: 600;
    }
}


/* =============================================
   ★ 특별함+가치 통합 v2 (리디자인)
   ============================================= */
.section--why-v2 {
    background: #0d1f14; /* fallback when bg image not loaded */
    padding: clamp(4rem, 10vw, 7rem) var(--section-padding-x);
    position: relative;
    overflow: visible;
}
.why-v2-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    z-index: 0;
}
.why-v2-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(170deg, rgba(13,31,20,0.82) 0%, rgba(22,46,31,0.78) 50%, rgba(13,31,20,0.85) 100%);
    z-index: 1;
}
.section--why-v2::before {
    content: '';
    position: absolute;
    bottom: -30%; left: -15%;
    width: 50%; height: 100%;
    background: radial-gradient(ellipse, rgba(230,194,0,0.05) 0%, transparent 70%);
    pointer-events: none;
    z-index: 2;
}
.why-v2-inner {
    position: relative;
    z-index: 3;
    max-width: 1200px;
    margin: 0 auto;
}
.why-v2-header {
    text-align: center;
    margin-bottom: clamp(2.5rem, 5vw, 4rem);
}
.why-v2-label {
    display: inline-block;
    font-family: var(--font-stencil);
    font-size: clamp(0.7rem, 1.2vw, 0.85rem);
    color: var(--color-gold);
    letter-spacing: 0.3em;
    text-transform: uppercase;
    margin-bottom: 0.8rem;
    border: 1px solid rgba(230,194,0,0.3);
    padding: 0.35em 1.2em;
    border-radius: 50px;
}
.why-v2-title {
    font-family: var(--font-head-art);
    font-weight: 400;
    font-size: clamp(1.8rem, 4vw, 3rem);
    color: rgba(255,255,255,0.68);
    line-height: 1.3;
    margin: 0;
}
.why-v2-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(1rem, 2vw, 1.5rem);
}
.why-v2-item {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 16px;
    padding: clamp(1.5rem, 3vw, 2.2rem);
    position: relative;
    transition: transform 0.35s ease, border-color 0.35s ease, background 0.35s ease;
}
.why-v2-item:hover {
    transform: translateY(-6px);
    border-color: rgba(230,194,0,0.25);
    background: rgba(255,255,255,0.06);
}
.why-v2-item__num {
    position: absolute;
    top: clamp(1rem, 2vw, 1.5rem);
    right: clamp(1rem, 2vw, 1.5rem);
    font-family: var(--font-stencil);
    font-size: clamp(2rem, 3.5vw, 3rem);
    color: rgba(230,194,0,0.08);
    font-weight: 700;
    line-height: 1;
    pointer-events: none;
}
.why-v2-item__icon {
    width: 48px; height: 48px;
    display: flex; align-items: center; justify-content: center;
    background: rgba(230,194,0,0.1);
    border-radius: 12px;
    color: var(--color-gold);
    font-size: 1.2rem;
    margin-bottom: 1rem;
}
.why-v2-item__title {
    font-family: var(--font-korean);
    font-size: clamp(1rem, 1.5vw, 1.15rem);
    color: #fff;
    font-weight: 700;
    margin: 0 0 0.5rem;
}
.why-v2-item__text {
    font-size: clamp(0.82rem, 1.1vw, 0.92rem);
    color: rgba(255,255,255,0.6);
    line-height: 1.7;
    margin: 0;
}
@media (max-width: 900px) {
    .why-v2-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
    .why-v2-grid { grid-template-columns: 1fr; }
}


/* =============================================
   ★ 수익 구조 도넛 차트 섹션 (Polyline 인포그래픽)
   ============================================= */
.section--profit-donut {
    background: #10141f;
    padding: clamp(4rem, 10vw, 7rem) var(--section-padding-x);
    position: relative;
    overflow: hidden;
}
.profit-donut-bg--photo {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.4; /* DB profit_bg_opacity 로 인라인 재정의 가능 */
    pointer-events: none;
    z-index: 0;
}
.profit-donut-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(170deg, rgba(16,20,31,0.88) 0%, rgba(16,24,40,0.82) 50%, rgba(16,20,31,0.9) 100%);
    pointer-events: none;
    z-index: 1;
}
.section--profit-donut::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 60% 50% at 50% 100%, rgba(230,0,18,0.06) 0%, transparent 70%);
    pointer-events: none;
    z-index: 2;
}
.profit-donut-inner {
    position: relative;
    z-index: 3;
    max-width: 760px;
    margin: 0 auto;
}
.profit-donut-header {
    text-align: center;
    margin-bottom: clamp(0.8rem, 1.5vw, 1.2rem);
}
.profit-donut-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    font-family: 'Pretendard', sans-serif;
    font-size: clamp(0.62rem, 1vw, 0.72rem);
    font-weight: 600;
    color: rgba(255,255,255,0.65);
    letter-spacing: 0.18em;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.14);
    padding: 0.4em 1.1em;
    border-radius: 50px;
    margin-bottom: 1rem;
}
.profit-donut-title {
    font-family: var(--font-head-art);
    font-weight: 400;
    font-size: clamp(1.6rem, 3.5vw, 2.6rem);
    color: rgba(255,255,255,0.85);
    line-height: 1.25;
    margin: 0;
    letter-spacing: -0.01em;
}
.profit-donut-title .tit-bold {
    color: #e60012;
}
.profit-donut-subtitle {
    font-family: 'Pretendard', sans-serif;
    font-size: clamp(0.75rem, 1.1vw, 0.88rem);
    color: rgba(255,255,255,0.45);
    margin: 0.4rem 0 0;
    letter-spacing: 0.02em;
}
.profit-donut-subtitle .fa-location-dot {
    color: #FFD700;
    margin-right: 0.3em;
}
.profit-donut-body {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.profit-donut-chart-wrap {
    width: min(540px, 92vw);
    margin: 0 auto;
}
.profit-donut-chart-wrap canvas {
    display: block;
    width: 100% !important;
    height: auto !important;
}
.profit-donut-note {
    font-size: clamp(0.68rem, 0.9vw, 0.74rem);
    color: rgba(255,255,255,0.35);
    margin-top: 1.2rem;
    text-align: center;
    line-height: 1.6;
}
@media (max-width: 480px) {
    .profit-donut-chart-wrap {
        width: 96vw;
    }
}

/* =============================================
   ★ 브랜드 경쟁력 v2 (리디자인 — PDF p.2~5)
   ============================================= */
.section--comp-v2 {
    background: #0d1f14; /* fallback when bg image not loaded */
    padding: clamp(4rem, 10vw, 7rem) var(--section-padding-x);
    position: relative;
    overflow: visible;
}
.comp-v2-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    pointer-events: none;
}
.comp-v2-bg--photo {
    z-index: 0;
    filter: brightness(0.94) saturate(1.1) contrast(1.03);
}
.comp-v2-overlay {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 85% 55% at 75% 15%, rgba(230, 194, 0, 0.09) 0%, transparent 50%),
        radial-gradient(ellipse 100% 80% at 50% 100%, rgba(0, 0, 0, 0.28) 0%, transparent 58%),
        linear-gradient(170deg, rgba(13,31,20,0.82) 0%, rgba(26,58,40,0.78) 50%, rgba(13,31,20,0.85) 100%);
    z-index: 2;
}
.comp-v2-inner {
    position: relative;
    z-index: 3;
    max-width: 1200px;
    margin: 0 auto;
}

/* 헤더 */
.comp-v2-header {
    text-align: center;
    margin-bottom: clamp(1rem, 2.5vw, 1.5rem);
}
.comp-v2-label {
    display: inline-block;
    font-family: var(--font-stencil);
    font-size: clamp(0.7rem, 1.2vw, 0.85rem);
    color: var(--color-gold);
    letter-spacing: 0.3em;
    text-transform: uppercase;
    margin-bottom: 0.8rem;
    border: 1px solid rgba(230,194,0,0.3);
    padding: 0.35em 1.2em;
    border-radius: 50px;
}
.comp-v2-title {
    font-family: var(--font-head-art);
    font-size: clamp(1.8rem, 4vw, 3rem);
    color: rgba(255,255,255,0.68);
    font-weight: 400;
    line-height: 1.3;
    margin: 0 0 0.5rem;
}
.comp-v2-subtitle {
    font-size: clamp(0.9rem, 1.5vw, 1.1rem);
    color: rgba(255,255,255,0.55);
    margin: 0;
}

/* 블록 공통 */
.comp-v2-block {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto 1fr;
    gap: 0 clamp(1.5rem, 3vw, 3rem);
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 20px;
    padding: clamp(2rem, 4vw, 3rem);
    margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
    position: relative;
    overflow: hidden;
}
.comp-v2-block:last-child { margin-bottom: 0; }
.comp-v2-block--alt {
    background: rgba(230,194,0,0.04);
    border-color: rgba(230,194,0,0.15);
}

/* 배지 */
.comp-v2-block__badge {
    position: absolute;
    top: 0; left: 0;
    background: var(--color-gold);
    color: #1a1a1a;
    font-family: var(--font-stencil);
    font-size: clamp(0.65rem, 1vw, 0.75rem);
    font-weight: 700;
    padding: 0.4em 1.4em;
    border-radius: 20px 0 12px 0;
    letter-spacing: 0.15em;
}

/* 텍스트 영역 */
.comp-v2-block__content {
    grid-column: 1;
    grid-row: 1 / -1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.comp-v2-block__title {
    font-family: var(--font-korean);
    font-size: clamp(1.3rem, 2.5vw, 1.8rem);
    color: #fff;
    font-weight: 700;
    line-height: 1.35;
    margin: 0 0 1rem;
}
.comp-v2-block__body {
    font-size: clamp(0.85rem, 1.2vw, 0.95rem);
    color: rgba(255,255,255,0.6);
    line-height: 1.75;
    margin: 0;
}

/* 비주얼 영역 */
.comp-v2-block__visual {
    grid-column: 2;
    grid-row: 1 / -1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1.2rem;
}

/* SAVING: 게이지 */
.comp-v2-gauge {
    display: flex;
    align-items: center;
    gap: clamp(1rem, 2vw, 2rem);
    justify-content: center;
}
.comp-v2-gauge__item {
    text-align: center;
    flex: 1;
    max-width: 160px;
}
.comp-v2-gauge__bar {
    width: 100%;
    height: 10px;
    background: rgba(255,255,255,0.08);
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 0.6rem;
}
.comp-v2-gauge__fill {
    height: 100%;
    width: var(--pct);
    background: rgba(255,255,255,0.25);
    border-radius: 5px;
    transition: width 1s ease;
}
.comp-v2-gauge__item--gold .comp-v2-gauge__fill {
    background: var(--color-gold);
}
.comp-v2-gauge__num {
    display: block;
    font-family: var(--font-stencil);
    font-size: clamp(2rem, 4vw, 3rem);
    color: rgba(255,255,255,0.5);
    font-weight: 700;
    line-height: 1;
}
.comp-v2-gauge__num small {
    font-size: 0.5em;
}
.comp-v2-gauge__item--gold .comp-v2-gauge__num {
    color: var(--color-gold);
}
.comp-v2-gauge__cap {
    display: block;
    font-size: 0.8rem;
    color: rgba(255,255,255,0.4);
    margin-top: 0.25rem;
}
.comp-v2-gauge__arrow {
    color: var(--color-gold);
    font-size: 1.2rem;
    flex-shrink: 0;
}
.comp-v2-block__quote {
    font-size: clamp(0.82rem, 1.1vw, 0.9rem);
    color: rgba(255,255,255,0.45);
    line-height: 1.6;
    margin: 0;
    padding: 1rem 1.2rem;
    background: rgba(255,255,255,0.03);
    border-left: 3px solid rgba(230,194,0,0.3);
    border-radius: 0 8px 8px 0;
}
.comp-v2-block__quote i {
    color: rgba(230,194,0,0.4);
    margin-right: 0.4em;
}

/* FREE: 혜택 리스트 */
.comp-v2-benefits {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.8rem;
}
.comp-v2-benefit {
    display: flex;
    gap: 0.8rem;
    align-items: flex-start;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 12px;
    padding: 1rem;
}
.comp-v2-benefit__num {
    flex-shrink: 0;
    width: 28px; height: 28px;
    display: flex; align-items: center; justify-content: center;
    background: var(--color-gold);
    color: #1a1a1a;
    font-family: var(--font-stencil);
    font-size: 0.75rem;
    font-weight: 700;
    border-radius: 50%;
}
.comp-v2-benefit strong {
    display: block;
    font-size: clamp(0.85rem, 1.1vw, 0.95rem);
    color: #fff;
    margin-bottom: 0.2rem;
}
.comp-v2-benefit p {
    font-size: clamp(0.75rem, 1vw, 0.82rem);
    color: rgba(255,255,255,0.5);
    line-height: 1.5;
    margin: 0;
}
.comp-v2-zero {
    text-align: center;
    padding: 1rem;
    background: rgba(230,194,0,0.06);
    border: 1px solid rgba(230,194,0,0.15);
    border-radius: 12px;
    margin-top: 0.5rem;
}
.comp-v2-zero__label {
    display: block;
    font-size: 0.75rem;
    color: rgba(255,255,255,0.5);
    letter-spacing: 0.08em;
    margin-bottom: 0.2rem;
}
.comp-v2-zero__value {
    font-family: var(--font-stencil);
    font-size: clamp(2.2rem, 4.5vw, 3.2rem);
    color: var(--color-gold);
    font-weight: 700;
    line-height: 1;
}
.comp-v2-zero__value small {
    font-size: 0.35em;
    color: rgba(255,255,255,0.5);
}

/* MARKETING: 카드 */
.comp-v2-mkt-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.8rem;
}
.comp-v2-mkt-card {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 12px;
    padding: clamp(1rem, 2vw, 1.4rem);
    text-align: center;
    transition: border-color 0.3s, transform 0.3s;
}
.comp-v2-mkt-card:hover {
    border-color: rgba(230,194,0,0.25);
    transform: translateY(-3px);
}
.comp-v2-mkt-card__icon {
    width: 40px; height: 40px;
    display: flex; align-items: center; justify-content: center;
    background: rgba(230,194,0,0.1);
    border-radius: 10px;
    color: var(--color-gold);
    font-size: 1rem;
    margin: 0 auto 0.7rem;
}
.comp-v2-mkt-card strong {
    display: block;
    font-size: clamp(0.85rem, 1.1vw, 0.95rem);
    color: #fff;
    margin-bottom: 0.4rem;
}
.comp-v2-mkt-card p {
    font-size: clamp(0.75rem, 0.95vw, 0.82rem);
    color: rgba(255,255,255,0.5);
    line-height: 1.55;
    margin: 0;
}
.comp-v2-block__footer {
    font-size: clamp(0.8rem, 1vw, 0.88rem);
    color: rgba(255,255,255,0.4);
    text-align: center;
    margin: 0;
    padding-top: 0.5rem;
    border-top: 1px solid rgba(255,255,255,0.06);
}

/* 모바일 */
@media (max-width: 768px) {
    .comp-v2-block {
        grid-template-columns: 1fr;
    }
    .comp-v2-block__content {
        grid-column: 1;
        grid-row: auto;
    }
    .comp-v2-block__visual {
        grid-column: 1;
        grid-row: auto;
        margin-top: 1.5rem;
    }
    .comp-v2-benefits { grid-template-columns: 1fr; }
    .comp-v2-mkt-cards { grid-template-columns: 1fr; }
    .comp-v2-gauge { flex-direction: column; }
    .comp-v2-gauge__arrow { transform: rotate(90deg); }
}

/* =============================================
   경쟁력 6-카드 그리드
   ============================================= */
.comp-cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(1rem, 2vw, 1.5rem);
    margin-top: clamp(1.5rem, 3vw, 2.5rem);
}
.comp-card {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 16px;
    padding: clamp(1.4rem, 3vw, 2rem) clamp(1.2rem, 2.5vw, 1.75rem);
    transition: border-color 0.3s, background 0.3s, transform 0.3s;
    position: relative;
    overflow: hidden;
}
.comp-card:hover {
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(230, 194, 0, 0.3);
    transform: translateY(-3px);
}
.comp-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(230,194,0,0.04) 0%, transparent 55%);
    pointer-events: none;
}
.comp-card__icon {
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 50%;
    background: rgba(230, 194, 0, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.85rem;
    color: var(--color-gold, #e6c200);
    font-size: 1.05rem;
}
.comp-card__num {
    font-family: var(--font-stencil), sans-serif;
    font-size: clamp(0.62rem, 0.8vw, 0.72rem);
    color: rgba(230, 194, 0, 0.65);
    letter-spacing: 0.12em;
    margin: 0 0 0.3rem;
    font-weight: 700;
}
.comp-card__title {
    font-family: 'Pretendard', var(--font-ui), sans-serif;
    font-size: clamp(0.92rem, 1.2vw, 1.08rem);
    font-weight: 700;
    color: #fff;
    line-height: 1.4;
    margin: 0 0 0.65rem;
    word-break: keep-all;
    overflow-wrap: break-word;
}
.comp-card__body {
    font-family: 'Pretendard', var(--font-ui), sans-serif;
    font-size: clamp(0.8rem, 1vw, 0.88rem);
    color: rgba(255, 255, 255, 0.62);
    line-height: 1.65;
    margin: 0;
}
@media (max-width: 640px) {
    .comp-cards {
        grid-template-columns: 1fr;
    }
}

/* =============================================
   ★ 창업 절차 v2 (그린 컴팩트)
   ============================================= */
.section--process-v2 {
    background: linear-gradient(170deg, #0d1f14 0%, #1a3a28 50%, #0d1f14 100%);
    padding: clamp(2.5rem, 5vw, 4rem) var(--section-padding-x);
    position: relative;
    overflow: hidden;
}
.section--process-v2::before {
    content: '';
    position: absolute;
    top: -30%; left: -15%;
    width: 50%; height: 100%;
    background: radial-gradient(ellipse, rgba(230,194,0,0.05) 0%, transparent 70%);
    pointer-events: none;
}
.process-v2-inner {
    max-width: 1100px;
    margin: 0 auto;
}
.process-v2-header {
    text-align: center;
    margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}
.process-v2-label {
    display: inline-block;
    font-family: var(--font-stencil);
    font-size: clamp(0.65rem, 1vw, 0.8rem);
    color: var(--color-gold);
    letter-spacing: 0.3em;
    text-transform: uppercase;
    margin-bottom: 0.5rem;
    border: 1px solid rgba(230,194,0,0.3);
    padding: 0.25em 1em;
    border-radius: 50px;
}
.process-v2-title {
    font-family: var(--font-korean);
    font-size: clamp(1.4rem, 3vw, 2.2rem);
    color: #fff;
    font-weight: 700;
    margin: 0;
}

.process-v2-steps {
    display: flex;
    align-items: stretch;
    gap: 0;
    position: relative;
}
.process-v2-steps::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(230,194,0,0.25), transparent);
    pointer-events: none;
}

.process-v2-step {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: clamp(1rem, 2vw, 1.5rem) clamp(0.5rem, 1vw, 1rem);
    position: relative;
    z-index: 1;
    transition: transform 0.3s ease;
}
.process-v2-step:hover {
    transform: translateY(-4px);
}

.process-v2-step__num {
    font-family: var(--font-stencil);
    font-size: clamp(1.6rem, 3vw, 2.4rem);
    color: rgba(230,194,0,0.15);
    font-weight: 900;
    line-height: 1;
    margin-bottom: 0.3rem;
    letter-spacing: 0.05em;
}
.process-v2-step__body {
    margin-bottom: 0.6rem;
}
.process-v2-step__title {
    display: block;
    font-size: clamp(0.9rem, 1.3vw, 1.1rem);
    color: #fff;
    font-weight: 700;
    margin-bottom: 0.2rem;
}
.process-v2-step__desc {
    margin: 0;
    font-size: clamp(0.7rem, 0.9vw, 0.82rem);
    color: rgba(255,255,255,0.55);
    line-height: 1.45;
}
.process-v2-step__icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(230,194,0,0.1);
    border: 1px solid rgba(230,194,0,0.25);
    color: var(--color-gold);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    transition: background 0.3s ease, box-shadow 0.3s ease;
}
.process-v2-step:hover .process-v2-step__icon {
    background: rgba(230,194,0,0.2);
    box-shadow: 0 0 20px rgba(230,194,0,0.2);
}
.process-v2-step:hover .process-v2-step__num {
    color: rgba(230,194,0,0.35);
}

@media (max-width: 900px) {
    .process-v2-steps {
        flex-direction: column;
        gap: 0;
    }
    .process-v2-steps::before {
        top: 0; bottom: 0;
        left: 22px; right: auto;
        width: 1px; height: auto;
        background: linear-gradient(180deg, transparent, rgba(230,194,0,0.25), transparent);
    }
    .process-v2-step {
        flex-direction: row;
        text-align: left;
        gap: 0.8rem;
        padding: 0.8rem 0;
    }
    .process-v2-step__num {
        min-width: 44px;
        text-align: center;
        font-size: 1.4rem;
    }
    .process-v2-step__body {
        flex: 1;
        margin-bottom: 0;
    }
    .process-v2-step__icon {
        width: 36px;
        height: 36px;
        font-size: 0.85rem;
    }
}

@media (min-width: 1451px) {
    .section--process-v2 { padding-left: calc(var(--section-padding-x) + var(--rail-content-inset)); }
    .section--franchise { padding-left: calc(var(--section-padding-x) + var(--rail-content-inset)); }
}

/* =============================================
   ★ 창업절차 + 파트너 CTA 통합 (#sectionFranchise)
   ============================================= */
.section--franchise {
    position: relative;
    overflow: visible;
    padding: clamp(4rem, 8vw, 6rem) var(--section-padding-x);
}
.franchise-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    z-index: 0;
}
.franchise-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(170deg, rgba(13,20,32,0.92) 0%, rgba(26,40,64,0.88) 50%, rgba(13,20,32,0.94) 100%);
    z-index: 1;
}
.franchise-inner {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
}

.franchise-header {
    text-align: center;
    margin-bottom: clamp(2rem, 4vw, 3.5rem);
}
.franchise-label {
    display: inline-block;
    font-family: var(--font-stencil);
    font-size: clamp(0.65rem, 1vw, 0.8rem);
    color: var(--color-gold);
    letter-spacing: 0.3em;
    text-transform: uppercase;
    margin-bottom: 0.8rem;
    border: 1px solid rgba(230,194,0,0.3);
    padding: 0.3em 1.2em;
    border-radius: 50px;
}
.franchise-title {
    font-family: var(--font-head-art);
    font-size: clamp(1.6rem, 3.5vw, 2.6rem);
    color: #fff;
    font-weight: 400;
    line-height: 1.35;
    margin: 0 0 0.6rem;
}
.franchise-subtitle {
    font-size: clamp(0.9rem, 1.4vw, 1.1rem);
    color: rgba(255,255,255,0.6);
    margin: 0;
}

.franchise-steps {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 0;
    margin-bottom: clamp(2.5rem, 5vw, 4rem);
}
.franchise-step {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    max-width: 180px;
    padding: 0 clamp(0.3rem, 0.8vw, 0.8rem);
}
.franchise-step__icon {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(230,194,0,0.1);
    border: 1px solid rgba(230,194,0,0.25);
    color: var(--color-gold);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    margin-bottom: 0.8rem;
    transition: background 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
}
.franchise-step:hover .franchise-step__icon {
    background: rgba(230,194,0,0.2);
    box-shadow: 0 0 24px rgba(230,194,0,0.25);
    transform: translateY(-4px);
}
.franchise-step__num {
    font-family: var(--font-stencil);
    font-size: clamp(0.6rem, 0.85vw, 0.75rem);
    color: var(--color-gold);
    letter-spacing: 0.12em;
    margin-bottom: 0.4rem;
    opacity: 0.7;
}
.franchise-step__title {
    display: block;
    font-size: clamp(0.95rem, 1.3vw, 1.1rem);
    color: #fff;
    font-weight: 700;
    margin-bottom: 0.25rem;
}
.franchise-step__desc {
    margin: 0;
    font-size: clamp(0.72rem, 0.9vw, 0.82rem);
    color: rgba(255,255,255,0.5);
    line-height: 1.5;
}
.franchise-step__connector {
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 0.85rem;
    font-weight: 900;
    padding-top: 18px;
    flex-shrink: 0;
}

.franchise-cta {
    text-align: center;
    border-top: 1px solid rgba(255,255,255,0.08);
    padding-top: clamp(1.5rem, 3vw, 2.5rem);
}
.franchise-cta__body {
    font-size: clamp(0.85rem, 1.1vw, 1rem);
    color: rgba(255,255,255,0.6);
    line-height: 1.75;
    max-width: 700px;
    margin: 0 auto clamp(1.5rem, 3vw, 2rem);
}
.franchise-cta__btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.9em 2.4em;
    background: var(--color-gold);
    color: #1a1a1a;
    font-family: var(--font-stencil);
    font-size: clamp(0.9rem, 1.2vw, 1rem);
    font-weight: 700;
    text-decoration: none;
    border-radius: 50px;
    transition: background 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 4px 20px rgba(230,194,0,0.25);
}
.franchise-cta__btn:hover {
    background: #ffd600;
    transform: translateY(-2px);
    box-shadow: 0 8px 32px rgba(230,194,0,0.4);
}

@media (max-width: 900px) {
    .franchise-steps {
        flex-direction: column;
        align-items: center;
        gap: 0.5rem;
    }
    .franchise-step {
        flex-direction: row;
        text-align: left;
        max-width: 100%;
        gap: 1rem;
        padding: 0.6rem 0;
    }
    .franchise-step__icon {
        flex-shrink: 0;
        margin-bottom: 0;
        width: 44px;
        height: 44px;
        font-size: 1rem;
    }
    .franchise-step__connector {
        display: none;
    }
    .franchise-step__desc br { display: none; }
}

/* =============================================
   ★ 창업문의 리디자인 (#sectionContactForm v2)
   ============================================= */
.section--contact-v2 {
    background: #0d1420; /* fallback when bg image not loaded */
    padding: clamp(4rem, 8vw, 6rem) var(--section-padding-x);
    position: relative;
    overflow: visible;
}
.contact-v2-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    pointer-events: none;
}
.contact-v2-bg--photo {
    z-index: 0;
    filter: brightness(0.92) saturate(1.06) contrast(1.02);
}
.contact-v2-overlay {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 90% 60% at 20% 30%, rgba(100, 140, 200, 0.08) 0%, transparent 48%),
        radial-gradient(ellipse 100% 75% at 50% 100%, rgba(0, 0, 0, 0.32) 0%, transparent 55%),
        linear-gradient(170deg, rgba(13,20,32,0.82) 0%, rgba(26,40,64,0.78) 50%, rgba(13,20,32,0.85) 100%);
    z-index: 2;
}
.section--contact-v2::before {
    content: '';
    position: absolute;
    bottom: -30%; left: -20%;
    width: 60%; height: 100%;
    background: radial-gradient(ellipse, rgba(230,194,0,0.05) 0%, transparent 70%);
    pointer-events: none;
    z-index: 3;
}
.contact-v2-inner {
    position: relative;
    z-index: 4;
    max-width: 720px;
    margin: 0 auto;
}
.contact-v2-header {
    text-align: center;
    margin-bottom: clamp(2rem, 4vw, 3rem);
}
.contact-v2-label {
    display: inline-block;
    font-family: var(--font-stencil);
    font-size: clamp(0.65rem, 1vw, 0.8rem);
    color: var(--color-gold);
    letter-spacing: 0.3em;
    text-transform: uppercase;
    margin-bottom: 0.8rem;
    border: 1px solid rgba(230,194,0,0.3);
    padding: 0.3em 1.2em;
    border-radius: 50px;
}
.contact-v2-title {
    font-family: var(--font-head-art);
    font-size: clamp(1.8rem, 4vw, 2.8rem);
    color: rgba(255,255,255,0.68);
    font-weight: 400;
    margin: 0 0 0.6rem;
    line-height: 1.35;
}
.contact-v2-title__line {
    display: block;
}
.contact-v2-title__line + .contact-v2-title__line {
    margin-top: 0.12em;
}
.contact-v2-title__accent {
    color: #fff;
    font-weight: 700;
}
.contact-v2-subtitle {
    font-size: clamp(0.85rem, 1.2vw, 1rem);
    color: rgba(255,255,255,0.55);
    margin: 0;
}

.contact-v2-form {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 20px;
    padding: clamp(1.5rem, 4vw, 2.5rem);
}

.contact-v2-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(1rem, 2vw, 1.5rem);
    margin-bottom: clamp(1rem, 2vw, 1.5rem);
}
.contact-v2-field--full {
    grid-column: 1 / -1;
}
.contact-v2-field__label {
    display: block;
    font-size: clamp(0.82rem, 1vw, 0.92rem);
    color: rgba(255,255,255,0.8);
    font-weight: 600;
    margin-bottom: 0.4rem;
}
.contact-v2-field__req {
    display: inline-block;
    width: 6px;
    height: 6px;
    background: var(--color-gold);
    border-radius: 50%;
    vertical-align: middle;
    margin-left: 0.2em;
}
.contact-v2-field__input {
    width: 100%;
    padding: clamp(0.7rem, 1.5vw, 0.9rem) 1rem;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 10px;
    color: #fff;
    font-size: clamp(0.88rem, 1vw, 0.95rem);
    font-family: inherit;
    transition: border-color 0.3s ease, background 0.3s ease;
    box-sizing: border-box;
}
.contact-v2-field__input::placeholder {
    color: rgba(255,255,255,0.3);
}
.contact-v2-field__input:focus {
    outline: none;
    border-color: var(--color-gold);
    background: rgba(255,255,255,0.1);
}
.contact-v2-field__textarea {
    min-height: 120px;
    resize: vertical;
}

.contact-v2-agree {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    margin-bottom: clamp(1.2rem, 2vw, 1.5rem);
}
.contact-v2-agree__label {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    cursor: pointer;
}
.contact-v2-agree__check {
    width: 16px;
    height: 16px;
    margin-top: 0.15em;
    accent-color: var(--color-gold);
    cursor: pointer;
    flex-shrink: 0;
}
.contact-v2-agree__text {
    font-size: clamp(0.62rem, 0.78vw, 0.72rem);
    color: rgba(255,255,255,0.58);
    line-height: 1.5;
}
.contact-v2-agree__view {
    flex-shrink: 0;
    background: none;
    border: none;
    color: var(--color-gold);
    font-size: clamp(0.65rem, 0.82vw, 0.76rem);
    text-decoration: underline;
    cursor: pointer;
    font-family: inherit;
    padding: 0;
    transition: color 0.2s;
}
.contact-v2-agree__view:hover {
    color: #ffd600;
}

.contact-v2-submit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6em;
    width: 100%;
    padding: clamp(0.9rem, 2vw, 1.1rem) 2rem;
    background: var(--color-gold);
    color: #1a1a1a;
    border: none;
    border-radius: 50px;
    font-family: var(--font-stencil);
    font-size: clamp(0.95rem, 1.2vw, 1.1rem);
    font-weight: 700;
    cursor: pointer;
    transition: background 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 4px 20px rgba(230,194,0,0.25);
}
.contact-v2-submit:hover {
    background: #ffd600;
    transform: translateY(-2px);
    box-shadow: 0 8px 32px rgba(230,194,0,0.4);
}

@media (max-width: 600px) {
    .contact-v2-grid {
        grid-template-columns: 1fr;
    }
}
@media (min-width: 1451px) {
    .section--contact-v2 { padding-left: calc(var(--section-padding-x) + var(--rail-content-inset)); }
}

/* ===== index_work 2026.03 전달안: 메인 슬라이드·긴자형 통계·도넛·타임라인·팝업 ===== */
.visual-sec.visual-sec--hero-slides {
    /* ① 3슬라이드 구간: 상단 ② 긴자 인트로 다음 풀스크린 */
    min-height: 100vh;
    min-height: 100dvh;
}
.visual-sec.visual-sec--hero-slides .swiper-slide--hero-dim::after {
    background: rgba(0, 0, 0, 0.58);
}
.visual-sec.visual-sec--hero-slides .swiper-slide--hero-dim.swiper-slide--extra-dim::after {
    background: rgba(0, 0, 0, 0.74);
}

/* 비주얼 3슬라이드: GSAP 줄 스태거 — 초기 상태는 .visual-hero-text-js 에서만 (visual-slide-text.js) */
#sectionHeroSlides .visual-txt__h2-line {
    display: block;
}
#sectionHeroSlides.visual-hero-text-js .visual-txt__h2-line,
#sectionHeroSlides.visual-hero-text-js .visual-txt--center-stack .visual-txt__line1,
#sectionHeroSlides.visual-hero-text-js .visual-txt--center-stack .visual-txt__line2 {
    opacity: 0;
    transform: translateY(20px);
    transition: none !important;
}

.visual-sec .visual-txt--left-bottom {
    top: auto;
    bottom: clamp(2rem, 8vh, 5rem);
    left: clamp(1rem, 4vw, 3rem);
    right: auto;
    transform: none;
    text-align: left;
    max-width: min(90vw, 36rem);
    padding: 0 clamp(1rem, 3vw, 2rem);
}
.visual-sec.visual-sec--hero-slides .visual-txt--left-bottom {
    /* 3슬라이드(1번 포함)에서 폰트 확대 시 박스 폭이 먼저 막혀 줄이 추가로 꺾이는 현상 완화 */
    max-width: min(96vw, 62rem);
}
.visual-sec .visual-txt--left-bottom .visual-txt__h2 {
    font-family: var(--font-visual-slide1);
    font-size: clamp(1.5rem, 3.85vw, 2.85rem);
    line-height: 1.25;
    margin: 0;
    font-weight: normal;
    letter-spacing: -0.03em;
}
/* 1번 슬라이드: 의도한 2줄만(각 줄 내부 자동 줄바꿈 방지) */
.visual-sec .visual-txt--left-bottom .visual-txt__h2-row {
    display: block;
    white-space: nowrap;
}
@media (max-width: 420px) {
    /* nowrap 유지 + 좁은 폭에서만 살짝 축소(가로 스크롤 방지) */
    .visual-sec.visual-sec--hero-slides .visual-txt--left-bottom .visual-txt__h2 {
        font-size: clamp(0.82rem, 3.45vw, 1.95rem);
        letter-spacing: -0.03em;
    }
}
/* 비주얼 1슬라이드: 돈까스·다릅니다 — 슬라이드 2·3 line2 본문과 동일(Paperozi 700) */
.visual-sec .visual-txt--left-bottom .visual-txt__h2 .mv-slide__accent--slide1 {
    font-family: var(--font-main);
    font-weight: 700;
    letter-spacing: -0.03em;
}
.visual-sec .visual-txt--center-stack {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    max-width: min(92vw, 42rem);
}
/* 긴자 흐름 3슬라이드(2·3번 center-stack): 큰 타이포 대비 가로 폭 확대 — 42rem 한도 해제 */
.visual-sec.visual-sec--hero-slides .visual-txt--center-stack {
    max-width: min(96vw, 62rem);
    padding-left: clamp(0.75rem, 3vw, 1.5rem);
    padding-right: clamp(0.75rem, 3vw, 1.5rem);
    box-sizing: border-box;
}
.visual-sec .visual-txt--center-stack .visual-txt__line1 {
    font-family: var(--font-visual-subtitle);
    font-size: clamp(1rem, 2.2vw, 1.35rem);
    font-weight: 300;
    letter-spacing: -0.02em;
    line-height: 1.5;
    margin-bottom: 1.25rem;
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 1s 0.35s, transform 1s 0.35s;
    text-shadow: 0 2px 12px rgba(0,0,0,0.55);
}
/* 비주얼 2·3번 슬라이드: 상단(line1) 폰트 크기 2배 — 기존 clamp min/vw/max 각각 ×2 */
.visual-sec .visual-txt--center-stack .visual-txt__line1--xl2 {
    /* 기본(모바일/태블릿 포함): 화면보다 커지지 않게 기존 라인1 스케일 유지 */
    font-size: clamp(1rem, 2.2vw, 1.35rem);
    margin-bottom: 1.25rem;
    line-height: 1.5;
}
.visual-sec.visual-sec--hero-slides .visual-txt--center-stack .visual-txt__line1 {
    font-family: 'A2z', sans-serif;
    font-weight: 100;
    font-size: clamp(0.92rem, 2.05vw, 1.28rem);
    letter-spacing: -0.045em;
}
.visual-sec .visual-txt--center-stack .visual-txt__line2 {
    font-size: clamp(1.35rem, 3vw, 2rem);
    font-weight: 700;
    line-height: 1.45;
    color: #fff;
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 1s 0.5s, transform 1s 0.5s;
    text-shadow: 0 2px 14px rgba(0,0,0,0.6);
}
.visual-sec .visual-txt--center-stack .mv-slide__accent {
    display: inline-block;
    font-size: inherit;
    font-weight: inherit;
}
.visual-sec .swiper-slide-active .visual-txt--center-stack .visual-txt__line1,
.visual-sec .swiper-slide-active .visual-txt--center-stack .visual-txt__line2 {
    opacity: 1;
    transform: translateY(0);
}
.visual-sec .swiper-slide-active .visual-txt--left-bottom .visual-txt__h2 {
    opacity: 1;
    transform: translateY(0);
}

/* 긴자료코형: 원형 수치 → 2열 매출/순익 → 하단 카피 (뷰포트 대칭 정렬) */
.intro-ginza__content--stats2026 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: clamp(0.85rem, 2.2vw, 1.35rem);
    padding: 0 clamp(1rem, 4vw, 2.5rem);
    width: 100%;
    max-width: 52rem;
    box-sizing: border-box;
}
.intro-ginza__title-wrap--stats {
    display: flex;
    justify-content: center;
    margin: 0;
}
/* 긴자 사이트와 동일: 진한 원 + 링 펄스, 안에 수익률·%·평수 */
.intro-ginza__circle--stats {
    /* 모바일 기기별 폰트/뷰포트 계산 차이를 감안해 여유(약 -35% 수준) */
    width: min(46vw, 185px);
    max-width: 100%;
}
/* 모바일 전용(기존 max-width:750px 규칙의 높은 specificity를 확실히 덮어씀) */
@media (max-width: 750px) {
    .visual-sec.intro-ginza .intro-ginza__circle--stats {
        width: min(46vw, 185px);
    }
}
.intro-ginza__stat-stack {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    transform: translateY(-50%);
    padding: 0.4rem 0.65rem;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.12rem;
    text-align: center;
}
.intro-ginza__circle--stats .intro-ginza__label-top {
    margin: 0;
    font-size: clamp(0.78rem, 2vw, 1rem);
    font-weight: 600;
    letter-spacing: 0.06em;
    color: var(--color-gold, #dab866);
    line-height: 1.25;
}
.intro-ginza__circle--stats .intro-ginza__pct {
    margin: 0.15rem 0;
    font-size: clamp(2.25rem, 10vw, 3.6rem);
    font-weight: 800;
    line-height: 1;
    color: #fff;
    text-shadow: 0 2px 16px rgba(0, 0, 0, 0.5);
}
.intro-ginza__circle--stats .intro-ginza__label-mid {
    margin: 0;
    font-size: clamp(0.68rem, 1.65vw, 0.88rem);
    font-weight: 500;
    color: rgba(255, 255, 255, 0.92);
    line-height: 1.35;
    letter-spacing: -0.02em;
}
.visual-sec.intro-ginza .intro-ginza__poster {
    transform: scale(1.08);
    transform-origin: center center;
    animation: intro-ginza-poster-drift 14s ease-in-out infinite alternate;
}
@keyframes intro-ginza-poster-drift {
    0% { transform: scale(1.06); }
    100% { transform: scale(1); }
}
.visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__cols {
    width: 100%;
    max-width: 38rem;
    margin: 0;
    padding: 0;
}
.visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__stat-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: start;
    width: 100%;
    max-width: 38rem;
    margin: 0 auto;
    box-sizing: border-box;
}
.visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__stat-label {
    padding: 0 0.75rem;
    font-size: clamp(0.82rem, 1.75vw, 1rem);
    line-height: 1.35;
    text-align: center;
    color: #fff;
    box-sizing: border-box;
}
.visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__stat-label:first-child {
    border-right: 1px solid rgba(255, 255, 255, 0.28);
}
.visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__stat-rule {
    grid-column: 1 / -1;
    margin: clamp(0.45rem, 1.4vw, 0.65rem) 0 clamp(0.55rem, 1.6vw, 0.8rem);
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.38);
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.12);
}
.visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__stat-value {
    padding: 0 0.75rem;
    text-align: center;
    box-sizing: border-box;
}
.visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__stat-grid > .intro-ginza__stat-value:nth-child(4) {
    border-right: 1px solid rgba(255, 255, 255, 0.28);
}
/* 월매출·월순이익 금액: 동일 색·동일 서체 */
.visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__figure--unified {
    display: block;
    font-size: clamp(1rem, 2.65vw, 1.58rem);
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
    color: #fff;
    word-break: keep-all;
    letter-spacing: -0.02em;
    text-shadow: 0 1px 14px rgba(0, 0, 0, 0.35);
}
.visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__stats-note {
    margin: clamp(0.65rem, 1.8vw, 1rem) 0 0;
    text-align: center;
    font-size: clamp(0.68rem, 1.45vw, 0.82rem);
    font-weight: 400;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.78);
    letter-spacing: -0.02em;
}
.visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__tagline {
    margin: clamp(0.85rem, 2.2vw, 1.35rem) 0 0;
    max-width: 22em;
    margin-left: auto;
    margin-right: auto;
    font-size: clamp(1.8rem, 5.7vw, 3.55rem);
    line-height: 1.22;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.92);
    text-shadow:
        0 2px 6px rgba(0, 0, 0, 0.65),
        0 4px 18px rgba(0, 0, 0, 0.5),
        0 0 28px rgba(0, 0, 0, 0.4);
}
.visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__tagline .intro-ginza__tagline-accent {
    color: var(--color-gold, #dab866);
    font-weight: 700;
}

/*
 * 비주얼(넓은 화면): 글자 크게
 * 이전 901px 보정은 상한·vw 증가가 작아 체감이 약했음 → 상한을 크게 올림(대략 +20~45% 구간).
 * 모바일·좁은 태블릿(≤900px)은 기존 clamp 유지.
 */
@media (min-width: 901px) {
    .visual-sec .visual-txt p {
        font-size: clamp(0.95rem, 1.85vw, 1.65rem);
    }
    .visual-sec .visual-txt h2 {
        font-size: clamp(2.75rem, 7vw, 6.5rem);
    }
    .visual-sec .visual-txt--left-bottom .visual-txt__h2 {
        font-size: clamp(1.85rem, 4.75vw, 4.25rem);
    }
    .visual-sec .visual-txt--center-stack .visual-txt__line1 {
        font-size: clamp(1.08rem, 2.75vw, 1.95rem);
    }
    .visual-sec.visual-sec--hero-slides .visual-txt--center-stack .visual-txt__line1 {
        font-size: clamp(1.02rem, 2.55vw, 1.78rem);
    }
    .visual-sec .visual-txt--center-stack .visual-txt__line1--xl2 {
        font-size: clamp(2.16rem, 5.5vw, 3.9rem);
        margin-bottom: clamp(1.25rem, 3vw, 2.25rem);
        line-height: 1.45;
    }
    .visual-sec.visual-sec--hero-slides .visual-txt--center-stack .visual-txt__line1--xl2 {
        font-size: clamp(2.02rem, 5.1vw, 3.55rem);
    }
    .visual-sec .visual-txt--center-stack .visual-txt__line2 {
        font-size: clamp(1.55rem, 3.6vw, 2.95rem);
    }
    .intro-ginza__circle--stats .intro-ginza__label-top {
        font-size: clamp(0.88rem, 2.25vw, 1.2rem);
    }
    .intro-ginza__circle--stats .intro-ginza__pct {
        font-size: clamp(2.6rem, 11vw, 5rem);
    }
    .intro-ginza__circle--stats .intro-ginza__label-mid {
        font-size: clamp(0.75rem, 1.85vw, 1.05rem);
    }
    .visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__stat-label {
        font-size: clamp(0.9rem, 2vw, 1.2rem);
    }
    .visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__figure--unified {
        font-size: clamp(1.15rem, 3.15vw, 2.15rem);
    }
    .visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__stats-note {
        font-size: clamp(0.74rem, 1.6vw, 0.98rem);
    }
    .visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__tagline {
        font-size: clamp(2.1rem, 6vw, 4.85rem);
    }
}
@media (max-width: 520px) {
    .visual-sec.intro-ginza .intro-ginza__circle--stats {
        width: min(52vw, 175px);
    }
}

/* 모바일 메인(긴자 인트로): 하단 카피가 1글자 떨어지지 않게 소폭 축소 */
@media (max-width: 520px) {
    .visual-sec.intro-ginza .intro-ginza__content--stats2026 .intro-ginza__tagline {
        font-size: clamp(1.65rem, 5.1vw, 3.1rem);
        letter-spacing: -0.01em;
    }
}

.brand-v2-subtitle--block {
    max-width: 48rem;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.75;
    color: rgba(255,255,255,0.82);
}
.brand-v2-timeline {
    list-style: none;
    margin: clamp(1.5rem, 3vw, 2.5rem) auto 0;
    padding: 0;
    max-width: 40rem;
    text-align: left;
}
.brand-v2-timeline__item {
    display: grid;
    grid-template-columns: 5rem 1fr;
    gap: 0.75rem 1rem;
    padding: 0.85rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.12);
    font-size: clamp(0.9rem, 1.2vw, 1rem);
    color: rgba(255,255,255,0.88);
}
.brand-v2-timeline__phase {
    font-weight: 700;
    color: var(--color-gold, #e6c200);
}
.brand-v2-timeline__text { line-height: 1.55; }

@font-face {
    font-family: 'GmarketSans';
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
}
@font-face {
    font-family: 'GmarketSans';
    font-weight: 500;
    font-style: normal;
    font-display: swap;
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
}

/* 브랜드 스토리 — Success Path 버티컬 타임라인 (배경 사진 + 라이트 오버레이 · 딥레드) */
.section--brand-v2.section--brand-story-timeline {
    --brand-story-ink: rgba(255,255,255,0.88);
    --brand-story-ink-soft: rgba(255,255,255,0.55);
    --brand-story-red: #FFD700;
    --brand-story-line: rgba(255,255,255,0.22);
    position: relative;
    overflow: hidden;
    padding: clamp(3rem, 7vw, 5.5rem) var(--section-padding-x);
    background-color: #06080f;
    background-image: none;
}
.section--brand-story-timeline .brand-story-tl-inner {
    max-width: min(90rem, 96vw);
    position: relative;
    z-index: 2;
}
.section--brand-story-timeline .brand-v2-header {
    max-width: min(78rem, 100%);
    margin-left: auto;
    margin-right: auto;
    margin-bottom: clamp(1.25rem, 2.5vw, 2rem);
    padding-left: clamp(0.25rem, 1.5vw, 1rem);
    padding-right: clamp(0.25rem, 1.5vw, 1rem);
}
/* 가운데 큰 원형 방사 그라데이션만 (선형 딤 없음) */
.section--brand-v2.section--brand-story-timeline::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    background: radial-gradient(
        circle min(92vmin, 58rem) at 50% 44%,
        rgba(0, 0, 0, 0.58) 0%,
        rgba(0, 0, 0, 0.34) 45%,
        rgba(0, 0, 0, 0.1) 70%,
        transparent 84%
    );
}
.brand-story-bg-img {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center center;
    opacity: 0.22;
    pointer-events: none;
    z-index: 0;
}
.section--brand-story-timeline .brand-v2-label {
    font-family: 'GmarketSans', 'Gmarket Sans', var(--font-stencil), sans-serif;
    font-weight: 700;
    color: var(--color-gold, #FFD700);
    border-color: rgba(255,215,0,0.3);
    letter-spacing: 0.22em;
    margin-bottom: 0.45rem;
}
.section--brand-story-timeline .brand-v2-title {
    font-family: var(--font-head-art);
    font-size: clamp(1.8rem, 4vw, 3rem);
    color: rgba(255,255,255,0.88);
    font-weight: 400;
    line-height: 1.3;
    margin: 0 0 0.5rem;
    max-width: 100%;
}
.section--brand-story-timeline .brand-v2-title .tit-bold {
    color: var(--color-gold, #FFD700);
    font-weight: 700;
    text-shadow: none;
}
.section--brand-story-timeline .brand-v2-subtitle--block {
    max-width: none;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    font-family: var(--font-main);
    font-size: clamp(0.9rem, 1.15vw, 1.05rem);
    font-weight: 400;
    line-height: 1.68;
    color: rgba(255,255,255,0.55);
}
.brand-story-tl__em {
    font-family: inherit;
    font-weight: 700;
    color: var(--color-gold, #FFD700);
    font-style: normal;
}
.brand-story-tl {
    list-style: none;
    margin: clamp(1.25rem, 2.5vw, 2rem) auto 0;
    padding: 0;
    /* 연혁 카드 영역만 상단 헤더보다 좁게 (가독·집중) */
    max-width: min(52rem, 100%);
    font-family: 'Pretendard', var(--font-ui), sans-serif;
}
.brand-story-tl__item {
    display: grid;
    grid-template-columns: 5.5rem minmax(0, 1fr);
    gap: clamp(0.75rem, 2vw, 1.35rem);
    align-items: start;
    padding-bottom: clamp(0.85rem, 1.8vw, 1.35rem);
    position: relative;
}
.brand-story-tl__item:last-child {
    padding-bottom: 0;
}
.brand-story-tl__rail {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding-top: 0.1rem;
    align-self: stretch;
    min-height: 100%;
}
.brand-story-tl__step {
    font-family: 'GmarketSans', 'Gmarket Sans', sans-serif;
    font-weight: 700;
    font-size: clamp(0.74rem, 1.05vw, 0.85rem);
    color: rgba(255,255,255,0.4);
    letter-spacing: 0.06em;
    margin-bottom: 0.4rem;
}
.brand-story-tl__node {
    width: 2.85rem;
    height: 2.85rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 2px solid rgba(255,215,0,0.5);
    color: var(--color-gold, #FFD700);
    font-size: 0.95rem;
    box-shadow: 0 2px 14px rgba(0,0,0,0.35);
    position: relative;
    z-index: 1;
}
.brand-story-tl__connector {
    position: absolute;
    left: 50%;
    top: 4.05rem;
    bottom: -0.2rem;
    width: 2px;
    margin-left: -1px;
    background: linear-gradient(180deg, rgba(255,215,0,0.4) 0%, rgba(255,215,0,0.05) 100%);
    transform-origin: top;
    transform: scaleY(0);
    transition: transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
    z-index: 0;
}
.brand-story-tl__item.revealed .brand-story-tl__connector {
    transform: scaleY(1);
}
.brand-story-tl__panel {
    display: block;
    background: #fff;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 16px;
    padding: clamp(0.85rem, 2vw, 1.15rem) clamp(1rem, 2.5vw, 1.35rem);
    box-shadow: 0 8px 32px rgba(0,0,0,0.3);
    transition: box-shadow 0.35s ease, border-color 0.35s ease;
}
.brand-story-tl__panel:hover {
    border-color: rgba(255,215,0,0.4);
    box-shadow: 0 12px 40px rgba(0,0,0,0.45);
}
.brand-story-tl__phase {
    display: block;
    font-family: 'GmarketSans', 'Gmarket Sans', sans-serif;
    font-weight: 700;
    font-size: clamp(0.82rem, 1.2vw, 0.95rem);
    color: #b8860b;
    margin-bottom: 0.35rem;
    letter-spacing: 0.04em;
}
.brand-story-tl__text {
    margin: 0;
    font-size: clamp(0.9rem, 1.3vw, 1.05rem);
    font-weight: 500;
    color: #222;
    line-height: 1.55;
}
.section--brand-story-timeline .brand-v2-cta {
    margin-top: clamp(1.25rem, 3.5vw, 2.6rem);
}
@media (max-width: 600px) {
    .brand-story-tl__item {
        grid-template-columns: 4.35rem minmax(0, 1fr);
    }
}

.pl-section { padding-bottom: 2rem; }
.pl-header { text-align: center; margin-bottom: clamp(1.5rem, 3vw, 2.5rem); }
.pl-badge {
    display: inline-block;
    font-size: clamp(0.8rem, 1.1vw, 0.95rem);
    padding: 0.35rem 0.85rem;
    border-radius: 999px;
    background: rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.9);
    margin-bottom: 0.75rem;
}
.pl-title {
    font-family: var(--font-accent, 'Nanum Myeongjo', serif);
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    color: #fff;
    margin: 0;
    font-weight: 700;
}
.pl-chart-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: clamp(1.5rem, 4vw, 3rem);
}
.pl-donut {
    position: relative;
    width: min(72vw, 280px);
    aspect-ratio: 1;
}
.pl-donut__ring {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: conic-gradient(
        #e6b422 0deg 104.4deg,
        #b85c38 104.4deg 219.6deg,
        #3d7ea6 219.6deg 291.6deg,
        #6b5b95 291.6deg 327.6deg,
        #c94c4c 327.6deg 338.4deg,
        #5a6a72 338.4deg 360deg
    );
}
.pl-donut__hole {
    position: absolute;
    inset: 16%;
    border-radius: 50%;
    background: #121a16;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 0.5rem;
}
.pl-donut__pct {
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    font-weight: 800;
    color: #fff;
    line-height: 1.1;
}
.pl-donut__cap {
    font-size: clamp(0.7rem, 1.1vw, 0.85rem);
    color: rgba(255,255,255,0.75);
    margin-top: 0.35rem;
}
.pl-legend {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.45rem;
    font-size: clamp(0.82rem, 1.1vw, 0.95rem);
    color: rgba(255,255,255,0.88);
}
.pl-legend__sw {
    display: inline-block;
    width: 0.65rem;
    height: 0.65rem;
    border-radius: 2px;
    margin-right: 0.4rem;
    vertical-align: middle;
}
.pl-legend__sw--profit { background: #e6b422; }
.pl-legend__sw--food { background: #b85c38; }
.pl-legend__sw--labor { background: #3d7ea6; }
.pl-legend__sw--rent { background: #6b5b95; }
.pl-legend__sw--royalty { background: #c94c4c; }
.pl-legend__sw--etc { background: #5a6a72; }
.pl-footnote {
    text-align: center;
    font-size: clamp(0.75rem, 1vw, 0.85rem);
    color: rgba(255,255,255,0.55);
    margin-top: 1.5rem;
    max-width: 36rem;
    margin-left: auto;
    margin-right: auto;
}

.cost-v2-totalbar {
    text-align: center;
    font-size: clamp(1rem, 1.4vw, 1.15rem);
    color: #fff;
    margin: 1rem 0 0.75rem;
    padding: 0.65rem 1rem;
    background: rgba(255,255,255,0.06);
    border-radius: 8px;
}
.cost-v2-totalbar span { color: var(--color-gold, #e6c200); font-weight: 800; margin: 0 0.35rem; }
.cost-v2-totalbar em { font-style: normal; font-size: 0.9em; opacity: 0.85; }
.cost-v2-extra-line {
    font-size: clamp(0.78rem, 1vw, 0.88rem);
    color: rgba(255,255,255,0.65);
    line-height: 1.5;
    max-width: 48rem;
    margin: 0 auto 1rem;
    text-align: center;
}
.cost-v2-cards--4 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
}
.cost-v2-highlights--2026 .cost-v2-highlight__value { font-size: clamp(1.25rem, 2.5vw, 1.75rem); }

.franchise-steps--8 {
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem 0.25rem;
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
}
.franchise-steps--8 .franchise-step {
    min-width: 88px;
    padding: 0.65rem 0.5rem;
}
.franchise-steps--8 .franchise-step__num {
    display: block;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--color-gold, #e6c200);
    margin-bottom: 0.25rem;
}
.franchise-steps--8 .franchise-step__title {
    font-size: clamp(0.78rem, 1vw, 0.88rem);
    font-weight: 600;
    line-height: 1.3;
}
.franchise-step__connector--break {
    flex-basis: 100%;
    width: 100%;
    height: 0;
    margin: 0;
    padding: 0;
    border: none;
    overflow: hidden;
}

/* 8단계 + 아이콘·설명 카드 (2줄: 4+4) */
.franchise-steps--8-rich {
    max-width: 1120px;
    margin-left: auto;
    margin-right: auto;
    align-items: flex-start;
    gap: 0.35rem 0.15rem;
}
.franchise-steps--8-rich .franchise-step {
    flex: 0 1 calc(12.5% - 0.5rem);
    min-width: 100px;
    max-width: 132px;
    padding: 0 0.35rem;
}
.franchise-steps--8-rich .franchise-step__icon {
    width: 50px;
    height: 50px;
    font-size: 1.05rem;
    margin-bottom: 0.55rem;
}
.franchise-steps--8-rich .franchise-step__num {
    font-family: var(--font-stencil);
    font-size: clamp(0.65rem, 0.9vw, 0.78rem);
    font-weight: 600;
    letter-spacing: 0.06em;
    color: var(--color-gold, #e6c200);
    opacity: 0.95;
    margin-bottom: 0.2rem;
}
.franchise-steps--8-rich .franchise-step__title {
    font-size: clamp(0.82rem, 1.05vw, 0.95rem);
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: 0.2rem;
}
.franchise-steps--8-rich .franchise-step__desc {
    font-size: clamp(0.68rem, 0.85vw, 0.78rem);
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.52);
}
.franchise-steps--8-rich .franchise-step__connector {
    padding-top: 22px;
}
.franchise-steps--8-rich .franchise-step__connector--break {
    padding-top: 0.75rem;
    margin-bottom: 0.25rem;
}
/* 모바일·태블릿: 8단계는 세로 8칸 대신 2열 그리드 카드로 압축 */
@media (max-width: 900px) {
    .franchise-steps--8-rich {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.55rem 0.4rem;
        flex-direction: unset;
        align-items: stretch;
        max-width: 100%;
        margin-bottom: clamp(1.35rem, 4vw, 2.25rem);
    }
    .franchise-steps--8-rich .franchise-step__connector,
    .franchise-steps--8-rich .franchise-step__connector--break {
        display: none !important;
    }
    .franchise-steps--8-rich .franchise-step {
        flex: none;
        max-width: none;
        min-width: 0;
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: center;
        text-align: center;
        gap: 0.25rem;
        padding: 0.55rem 0.35rem 0.6rem;
        background: rgba(255, 255, 255, 0.06);
        border: 1px solid rgba(255, 255, 255, 0.1);
        border-radius: 12px;
        box-sizing: border-box;
    }
    .franchise-steps--8-rich .franchise-step__icon {
        width: 38px;
        height: 38px;
        font-size: 0.92rem;
        margin-bottom: 0.2rem;
    }
    .franchise-steps--8-rich .franchise-step__num {
        margin-bottom: 0.1rem;
        font-size: 0.68rem;
    }
    .franchise-steps--8-rich .franchise-step__title {
        margin-bottom: 0.15rem;
        font-size: clamp(0.72rem, 3.4vw, 0.84rem);
        line-height: 1.25;
    }
    .franchise-steps--8-rich .franchise-step__desc {
        flex: unset;
        padding-left: 0;
        margin-top: 0;
        font-size: 0.62rem;
        line-height: 1.4;
        color: rgba(255, 255, 255, 0.55);
    }
    /* 공통 모바일 규칙에서 br 숨김 해제 — 카드 안에서 두 줄 설명 유지 */
    .franchise-steps--8-rich .franchise-step__desc br {
        display: block;
    }
    .section--franchise .franchise-header {
        margin-bottom: clamp(1.25rem, 3.5vw, 2rem);
    }
    .franchise-title {
        word-break: keep-all;
        text-wrap: balance;
    }
}

.promo-popup {
    position: fixed;
    inset: 0;
    z-index: 100200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}
.promo-popup[hidden] { display: none !important; }
.promo-popup__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.55);
}
.promo-popup__box {
    position: relative;
    width: min(90vw, 400px);
    max-height: 90vh;
    overflow-y: auto;
    background: #1A3A2A;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.45);
    border: 1px solid rgba(255,255,255,0.08);
}
.promo-popup__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem 0;
}
.promo-popup__logo { height: 36px; width: auto; object-fit: contain; }
.promo-popup__close {
    background: none;
    border: none;
    color: rgba(255,255,255,0.75);
    font-size: 1.75rem;
    line-height: 1;
    cursor: pointer;
    padding: 0.25rem;
}
.promo-popup__body { padding: 0.5rem 1.25rem 1rem; text-align: center; }
.promo-popup__eyebrow {
    font-size: 0.75rem;
    letter-spacing: 0.15em;
    color: #fff;
    margin: 0 0 0.5rem;
}
.promo-popup__title {
    font-size: clamp(1.5rem, 5vw, 1.85rem);
    font-weight: 800;
    color: #fff;
    margin: 0 0 0.25rem;
    line-height: 1.2;
}
.promo-popup__mainline {
    font-size: clamp(1.75rem, 5.5vw, 2.25rem);
    font-weight: 800;
    color: #fff;
    margin: 0 0 0.75rem;
    line-height: 1.2;
}
.promo-popup__free { color: #00CC44; }
.promo-popup__badge {
    display: inline-block;
    font-size: 0.72rem;
    padding: 0.35rem 0.65rem;
    border-radius: 6px;
    background: #00CC44;
    color: #fff;
    font-weight: 700;
    margin: 0 0 0.75rem;
    line-height: 1.35;
}
.promo-popup__desc {
    font-size: 0.9rem;
    color: rgba(255,255,255,0.92);
    margin: 0 0 1rem;
    line-height: 1.45;
}
.promo-popup__cta {
    display: block;
    width: 100%;
    padding: 0.85rem 1rem;
    background: #00CC44;
    color: #111;
    font-weight: 800;
    border-radius: 10px;
    text-decoration: none;
    font-size: 0.95rem;
    transition: filter 0.2s, transform 0.2s;
}
.promo-popup__cta:hover { filter: brightness(1.08); }
.promo-popup__foot {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 1.25rem 1rem;
    border-top: 1px solid rgba(255,255,255,0.1);
}
.promo-popup__link {
    background: none;
    border: none;
    font-size: 0.78rem;
    color: rgba(255,255,255,0.45);
    cursor: pointer;
    text-decoration: underline;
    padding: 0;
    font-family: inherit;
}
.promo-popup__link:hover { color: rgba(255,255,255,0.75); }

/* 이미지 레이어 팝업 (768×1376 세로 배너 — 반응형) */
html.modal-open,
body.modal-open {
    overflow: hidden !important;
    touch-action: none;
}
/* 팝업 열릴 때 하단·고정 UI가 레이어 위로 겹치지 않도록 */
html.modal-open .intro-ginza__scroll,
html.modal-open .fab-consult,
html.modal-open .swiper-pagination,
html.modal-open .main-visual-pagination,
html.modal-open .swiper-button-prev,
html.modal-open .swiper-button-next,
html.modal-open .rail-nav,
html.modal-open .vertical-line {
    visibility: hidden !important;
    pointer-events: none !important;
}
.image-popup {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: max(0.35rem, env(safe-area-inset-top, 0px))
             max(0.35rem, env(safe-area-inset-right, 0px))
             max(0.35rem, env(safe-area-inset-bottom, 0px))
             max(0.35rem, env(safe-area-inset-left, 0px));
    box-sizing: border-box;
    pointer-events: auto;
}
.image-popup[hidden] { display: none !important; }
.image-popup__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.48);
    z-index: 0;
}
/* 패널·이미지 동일 크기 — PC/모바일 공통, 이미지 비율에 맞춤 (내부 검정 여백 없음) */
.image-popup__panel {
    position: relative;
    z-index: 1;
    margin: auto;
    width: fit-content;
    max-width: min(768px, 92vw);
    max-height: min(94vh, 94dvh);
}
.image-popup__figure {
    position: relative;
    margin: 0;
    width: fit-content;
    max-width: min(768px, 92vw);
    line-height: 0;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 10px 36px rgba(0, 0, 0, 0.38);
    background: transparent;
}
.image-popup__img {
    display: block;
    width: auto;
    height: auto;
    max-width: min(768px, 92vw);
    max-height: min(calc(94vh - 2rem), calc(94dvh - 2rem));
    vertical-align: top;
}
.image-popup__close {
    position: absolute;
    top: 0.35rem;
    right: 0.35rem;
    z-index: 2;
    width: 2.25rem;
    height: 2.25rem;
    border: none;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.45);
    color: #fff;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: background 0.2s;
}
.image-popup__close:hover { background: rgba(0, 0, 0, 0.65); }
.image-popup__foot {
    flex: 0 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.35rem;
    padding: 0;
    width: 100%;
}
.image-popup__link {
    background: none;
    border: none;
    font-size: 0.78rem;
    color: rgba(255, 255, 255, 0.72);
    cursor: pointer;
    text-decoration: underline;
    padding: 0.25rem 0;
    font-family: inherit;
}
.image-popup__link:hover { color: #fff; }
@media (max-width: 480px) {
    .image-popup__figure,
    .image-popup__img { max-width: min(768px, 94vw); }
    .image-popup__close {
        top: 0.25rem;
        right: 0.25rem;
        width: 2rem;
        height: 2rem;
        font-size: 1.35rem;
    }
}