/* ===== 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;
}

/* 학교안심 칠판지우개 */
@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;
}
/* 학교안심 칠판지우개 (중복 방지 확인) */
@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;
}

/* ===== 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;
    /* 왼쪽 세로선 + 로고 정렬 (로고 원 중심이 선 위에 오도록) */
    --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-title-elegant) / var(--font-main) / var(--font-accent) / var(--font-point) / var(--font-chalk) */
    --hero-font-line1: var(--font-title-elegant);  /* 왜 평범한 돈카츠에 만족하십니까? — 수문장 */
    --hero-font-line2: 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-food { font-family: var(--font-title-food); }
.font-hyeri { font-family: var(--font-accent-clean); }
.font-chalk { font-family: var(--font-chalk); }

/* ===== 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: smooth;
    font-size: 16px;
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
}
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: none;
    -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 {
    position: fixed;
    left: var(--line-x);
    top: 0;
    bottom: 0;
    width: 1px;
    background: rgba(255, 255, 255, 0.25);
    transform: translateX(-50%);
    z-index: 999;
    pointer-events: none;
}

/* ===== 레일 내비게이션: 선 따라 움직이는 미니 로고 ===== */
.rail-nav {
    position: fixed;
    left: var(--line-x);
    top: 50%;
    transform: translate(-50%, -50%);
    width: 1px;
    height: 75vh;
    max-height: 80vh;
    z-index: 998;
    pointer-events: none;
    transition: opacity 0.3s, transform 0.3s;
}
.rail-nav--hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
.rail-nav__line {
    position: absolute;
    left: 0;
    top: 0;
    width: 1px;
    height: 100%;
    background: rgba(128, 128, 128, 0.5);
}
.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;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    pointer-events: auto;
}
.rail-nav__item { 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); }
@media (max-width: 1023px) {
    .rail-nav { display: none; }
    .vertical-line { display: none; }
}
@media (min-width: 1024px) {
    :root { --rail-content-inset: 1.5em; }
}
@media (min-width: 1024px) {
    .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--showcase2 { 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--history { padding-left: calc(var(--section-padding-x) + var(--rail-content-inset)); }
    .section--inquiry-table { 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)); }
}

/* ===== 고정 로고: 헤더와 분리, 항상 좌측 상단 고정 (테두리 없음) ===== */
.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;
    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 .slide-bg {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    transform: scale(1.2);
    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%;
    background: rgba(0, 0, 0, 0.42);
    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-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);
}

/* ===== 히어로: 두 레이어 겹침 — 위(텍스트 10|70|20), 아래(이미지 우하단 기준) ===== */
.hero {
    min-height: 80vh;
    min-height: 80dvh;
    display: flex;
    align-items: stretch;
    padding: 0;
    padding-left: calc(clamp(1rem, 4vw, 2rem) + var(--rail-content-inset) + 1em);
    background: var(--color-deep-green);
}
.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: 텍스트 — 10% | 70% | 20% */
.hero__layer1 {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 5% 70% 25%;
    width: 100%;
    min-height: 80vh;
    min-height: 80dvh;
}
.hero__spacer { min-width: 0; }
.hero__left {
    min-width: 0;
    width: 100%;
    max-width: 760px;
    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: hidden;
    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;
}
/* 모바일(세로 배치): 헤드라인 포함 전부 중앙 정렬 (기본 스타일보다 뒤에 두어 우선 적용) */
@media (max-width: 900px) {
    .hero__headline,
    .hero__headline-line,
    .hero__headline-line--1,
    .hero__headline-line--2 { 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: var(--color-gold); }
/* 스크램블 효과: 해독 중 반짝임·미세 블러 → 완성 시 선명 */
.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));
}
.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 {
    background: #f8f6f2;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    padding: var(--section-padding-y) var(--section-padding-x);
}
.section--menu .section__inner.container {
    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-accent, 'Nanum Myeongjo', serif);
    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__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-size: clamp(1.1rem, 1.5vw, 1.35rem);
    margin-bottom: 0.5rem;
    color: var(--color-deep-green, #14331e);
    font-weight: 600;
    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: 1;
    min-height: 400px;
    min-width: 0;
    background-color: var(--color-deep-green, #14331e);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
}
.section--brand .brand-info {
    flex: 1;
    min-width: 0;
    max-width: 560px;
    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 {
        min-height: 280px;
        order: 0;
        background-position: center center;
    }
    .section--brand .brand-info {
        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);
    }
}

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

/* 브랜드 실적 (흰 배경) */
.section--metrics {
    background: #fff;
    padding: var(--section-padding-y) var(--section-padding-x);
    padding-left: var(--section-padding-x);
}
.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--special {
    background: #2c2419;
    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; }
.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: 2rem; }
.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; }
.btn-more { font-size: clamp(0.75rem, 0.9vw, 0.875rem); color: var(--color-gold, #f7a000); text-decoration: none; font-weight: 500; }
@media (max-width: 768px) {
    .metrics-inner { grid-template-columns: 1fr; }
    .special-profiles { grid-template-columns: 1fr; }
}

/* 창업 성공 / 갤러리 (다크 브라운) - 넓이 확대 */
.section--franchise-gallery {
    background: #2c2419;
    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; } }

/* 메뉴 쇼케이스 1 (스플릿) */
.section--showcase1 { padding: 0; padding-left: 0; }
.showcase1-inner { display: grid; grid-template-columns: 1fr 1fr; min-height: 400px; }
.showcase1-left { background: #2c2419; position: relative; padding: 2rem; display: flex; flex-direction: column; justify-content: flex-end; }
.showcase1-left .showcase1-img { position: absolute; inset: 0; background: rgba(0,0,0,0.2) center/cover; }
.showcase1-caption { color: #fff; font-size: 1.25rem; font-weight: 600; margin: 0; position: relative; z-index: 1; }
.showcase1-right { background: var(--color-deep-green, #14331e); padding: clamp(2rem, 5vw, 3rem); }
.showcase1-text { color: rgba(255,255,255,0.85); font-size: 0.95rem; margin-bottom: 1.5rem; }
.showcase1-dishes { min-height: 100px; margin-bottom: 1.5rem; }
.showcase1-circles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.circle-item { text-align: center; }
.circle-item .circle-img { width: 80px; height: 80px; margin: 0 auto 0.5rem; border-radius: 50%; background: rgba(255,255,255,0.15); }
.circle-item p { font-size: 0.85rem; color: #fff; margin-bottom: 0.35rem; }
.circle-item .btn-more { font-size: 0.75rem; color: var(--color-gold, #f7a000); }
@media (max-width: 768px) { .showcase1-inner { grid-template-columns: 1fr; } .showcase1-circles { grid-template-columns: 1fr; } }

/* 메뉴 쇼케이스 2 (연한 베이지) */
.section--showcase2 { background: #f8f6f2; padding: var(--section-padding-y) var(--section-padding-x); }
.showcase2-logo { width: 60px; height: 60px; margin: 0 auto 1.5rem; border-radius: 50%; background: var(--color-deep-green, #14331e); }
.showcase2-main .showcase2-tray { max-width: min(400px, 90%); margin: 0 auto 2rem; aspect-ratio: 4/3; background: #e8e4dc; border-radius: 8px; }
.showcase2-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: clamp(0.75rem, 1.5vw, 1.25rem); margin-bottom: 2rem; }
.showcase2-item { aspect-ratio: 1; background: #e0dcd4; border-radius: 8px; }
.showcase2-videos { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; max-width: min(600px, 100%); margin: 0 auto; }
.video-thumb { aspect-ratio: 16/9; background: #d8d4cc; border-radius: 8px; }
@media (max-width: 768px) { .showcase2-grid { grid-template-columns: repeat(2, 1fr); } .showcase2-videos { grid-template-columns: 1fr; } }

/* 브랜드 가치 / 아이콘 (다크 브라운) */
.section--values { background: #2c2419; padding: var(--section-padding-y) var(--section-padding-x); padding-left: var(--section-padding-x); position: relative; }
.values-inner { max-width: min(900px, 100%); margin: 0 auto; }
.values-deco { position: absolute; width: 80px; height: 80px; border-radius: 50%; background: rgba(255,255,255,0.06); }
.values-deco--tl { top: 2rem; left: 2rem; }
.values-deco--tr { top: 2rem; right: 2rem; }
.values-deco--br { bottom: 2rem; right: 2rem; }
.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; } }

/* 10년 노하우 / 팀 (연한 베이지) */
.section--history { background: #f8f6f2; padding: var(--section-padding-y) var(--section-padding-x); }
.history-inner { max-width: var(--content-max); margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 4vw, 3rem); align-items: center; }
.history-title { font-size: clamp(1.4rem, 2.8vw, 2.25rem); color: #111; margin-bottom: 0.5rem; line-height: 1.25; }
.history-sub { font-size: clamp(1rem, 1.2vw, 1.15rem); color: var(--color-deep-green, #14331e); font-weight: 600; margin-bottom: 1rem; line-height: 1.4; }
.history-desc { font-size: clamp(0.9375rem, 1.1vw, 1rem); color: #555; line-height: 1.65; }
.history-photo { aspect-ratio: 4/3; max-width: min(400px, 100%); background: #ddd; border-radius: 8px; }
@media (max-width: 768px) { .history-inner { grid-template-columns: 1fr; } }

/* 가맹문의 테이블 (다크 그린) */
.section--inquiry-table { background: var(--color-deep-green, #14331e); padding: var(--section-padding-y) var(--section-padding-x); padding-left: var(--section-padding-x); }
.inquiry-table-title { text-align: center; color: #fff; font-size: clamp(1.4rem, 2.8vw, 2rem); margin-bottom: 2rem; line-height: 1.3; }
.inquiry-table-wrap { max-width: min(700px, 100%); margin: 0 auto; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.inquiry-table { width: 100%; border-collapse: collapse; color: #fff; font-size: clamp(0.875rem, 1vw, 1rem); }
.inquiry-table th, .inquiry-table td { padding: clamp(0.65rem, 1.2vw, 0.85rem) clamp(0.75rem, 1.5vw, 1rem); border: 1px solid rgba(255,255,255,0.2); text-align: center; line-height: 1.4; }
.inquiry-table th { background: rgba(0,0,0,0.2); font-weight: 600; }
.inquiry-table tbody tr:hover { background: rgba(255,255,255,0.05); }

/* 문의 폼 (다크 브라운) */
.section--contact-form { background: #2c2419; padding: var(--section-padding-y) var(--section-padding-x); padding-left: var(--section-padding-x); }
.form-inner { max-width: min(500px, 100%); margin: 0 auto; }
.form-title { text-align: center; color: #fff; font-size: clamp(1.2rem, 2.4vw, 1.75rem); margin-bottom: 0.5rem; line-height: 1.35; }
.form-subtitle { text-align: center; color: rgba(255,255,255,0.8); font-size: clamp(0.875rem, 1vw, 1rem); margin-bottom: 2rem; line-height: 1.4; }
.contact-form .form-row { margin-bottom: 1.25rem; }
.contact-form .form-row--checkbox { 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; }
.form-checkbox input { width: auto; min-height: auto; }
.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.25); border-radius: 8px; background: rgba(255,255,255,0.08); 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.45); }
.contact-form input:focus, .contact-form textarea:focus { outline: none; border-color: var(--color-gold, #f7a000); background: rgba(255,255,255,0.1); }
.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); }

/* ===== 푸터 (index5 참고) ===== */
.site-footer {
    background: #1a1a1a;
    color: #999;
    padding: var(--section-padding-y) var(--section-padding-x) 2rem;
    font-size: clamp(0.8125rem, 1vw, 0.9375rem);
    line-height: 1.55;
}
.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; }
@media (max-width: 768px) {
    .site-footer .foot-inner {
        flex-direction: column;
    }
}

/* ===== Reveal on Scroll: 섹션 진입 시 등장, 이탈 시 퇴장 ===== */
.reveal-section .reveal-item {
    opacity: 0;
    transition: opacity 0.5s ease, transform 0.5s ease;
}
.reveal-section .reveal-item[data-reveal-effect="fade-up"],
.reveal-section .reveal-item:not([data-reveal-effect]) {
    transform: translateY(24px);
}
.reveal-section .reveal-item[data-reveal-effect="fade-left"] {
    transform: translateX(24px);
}
.reveal-section .reveal-item[data-reveal-effect="fade-right"] {
    transform: translateX(-24px);
}
.reveal-section.section-inview .reveal-item.revealed {
    opacity: 1;
    transform: translate(0);
}
.reveal-section.section-out .reveal-item {
    opacity: 0;
    transition-delay: 0s !important;
}
.reveal-section.section-out .reveal-item[data-reveal-effect="fade-up"],
.reveal-section.section-out .reveal-item:not([data-reveal-effect]) {
    transform: translateY(24px);
}
.reveal-section.section-out .reveal-item[data-reveal-effect="fade-left"] {
    transform: translateX(24px);
}
.reveal-section.section-out .reveal-item[data-reveal-effect="fade-right"] {
    transform: translateX(-24px);
}
@media (prefers-reduced-motion: reduce) {
    .reveal-section .reveal-item {
        opacity: 1;
        transform: none;
        transition: none;
    }
    .reveal-section.section-out .reveal-item {
        opacity: 1;
        transform: none;
    }
}