/*
Theme Name: 숨고 커스텀 테마
Description: 숨고 브랜드 스타일의 워드프레스 커스텀 테마. 헤더와 푸터는 숨고 디자인을 적용하고, 바디는 워드프레스 기본 콘텐츠를 사용합니다.
Version: 1.0.0
Requires PHP: 7.4
*/

/* =========================================
   Prisma Semantic Token
   ========================================= */
:root {
    --background-primary : rgba(255, 255, 255, 1);
    --background-off_white : #F6F7F9;
    --background-secondary : #EFF1F5;
    --background-tertiary : #E0E5EB;
    --background-quaternary : #C7CED6;
    --background-quinary : #AAB4BF;
    --background-senary : #8F9AAB;
    --background-hovered : #465162;
    --background-pressed : #465162;
    --background-enabled : #293341;
    --background-purple : #F1EEFF;
    --background-purple_enabled : #693BF2;
    --background-purple_hovered : #6302FB;
    --background-purple_pressed : #5400D7;
    --background-red : #FDEBEC;
    --background-red_enabled : #FF3541;
    --background-red_hovered : #EA1623;
    --background-red_pressed : #C11C26;
    --background-blue : #F0F9FF;
    --background-information : #0087FF;
    --background-positive : #00A163;
    --core-Purple : #693BF2;
    --core-Blue : #0087FF;
    --core-BlueGray : #1C242F;
    --core-White : rgba(255, 255, 255, 1);
    --text-white : rgba(255, 255, 255, 1);
    --text-quaternary : #C7CED6;
    --text-tertiary : #AAB4BF;
    --text-secondary : #6A7685;
    --text-primary : #1C242F;
    --text-purple : #693BF2;
    --text-purple_hovered : #6302FB;
    --text-purple_light : #C5B6FF;
    --text-blue : #0087FF;
    --text-none : unset;
    --overlay-black_100 : rgba(0, 0, 0, 1);
    --overlay-black_90 : rgba(0, 0, 0, 0.9);
    --overlay-black_80 : rgba(0, 0, 0, 0.8);
    --overlay-black_50 : rgba(0, 0, 0, 0.5);
    --overlay-black_30 : rgba(0, 0, 0, 0.3);
    --overlay-black_5 : rgba(0, 0, 0, 0.05);
    --overlay-black_0 : rgba(0, 0, 0, 0);
    --overlay-white_100 : rgba(255, 255, 255, 1);
    --overlay-white_0 : rgba(255, 255, 255, 0);
    --border-active : #693BF2;
    --border-tertiary : #EFF1F5;
    --border-secondary : #E0E5EB;
    --border-quaternary : #C7CED6;
    --border-quinary : #1C242F;
    --border-senary : rgba(0, 0, 0, 0.05);
    --border-error : #FF3541;
    --border-negative : #FF3541;
    --border-white : rgba(255, 255, 255, 1);
    --border-positive : #0087FF;
    --border-information : #00A163;
    --state-negative-bg : #FDEBEC;
    --state-negative-text : #FF3541;
    --state-warning-bg : #FFFCDE;
    --state-warning-text : #FFC300;
    --state-positive-bg : #E7FCEF;
    --state-positive-text : #00A163;
    --state-information-bg : #E7F4FF;
    --state-information-text : #0087FF;
}

/* =========================================
   Prisma Palette Token
   ========================================= */
:root {
    --bluegray-S010 : #F6F7F9;
    --bluegray-S050 : #EFF1F5;
    --bluegray-S100 : #E0E5EB;
    --bluegray-S200 : #C7CED6;
    --bluegray-S300 : #AAB4BF;
    --bluegray-S400 : #8F9AAB;
    --bluegray-S500 : #6A7685;
    --bluegray-S600 : #5D697A;
    --bluegray-S700 : #465162;
    --bluegray-S800 : #293341;
    --bluegray-S900 : #1C242F;
    --purple-S010 : #F6F4FF;
    --purple-S050 : #F1EEFF;
    --purple-S100 : #E3DEFF;
    --purple-S200 : #C5B6FF;
    --purple-S300 : #9C7CFF;
    --purple-S400 : #865FFF;
    --purple-S500 : #693BF2;
    --purple-S600 : #6302FB;
    --purple-S700 : #5400D7;
    --purple-S800 : #3E009F;
    --purple-S900 : #1f004f;
    --blue-S010 : #F0F9FF;
    --blue-S050 : #E7F4FF;
    --blue-S100 : #D8ECFE;
    --blue-S200 : #A3DCFF;
    --blue-S300 : #6BC7FF;
    --blue-S400 : #3DA3FF;
    --blue-S500 : #0087FF;
    --blue-S600 : #006FFF;
    --blue-S700 : #005CD5;
    --blue-S800 : #103580;
    --blue-S900 : #012160;
    --green-S010 : #F1FFF6;
    --green-S050 : #E7FCEF;
    --green-S100 : #D8FDEA;
    --green-S200 : #AAF3CF;
    --green-S300 : #62E9A6;
    --green-S400 : #4CD993;
    --green-S500 : #00BF75;
    --green-S600 : #00A163;
    --green-S700 : #008551;
    --green-S800 : #005F3A;
    --green-S900 : #004D2D;
    --red-S010 : #FEF6F6;
    --red-S050 : #FDEBEC;
    --red-S100 : #FFDBDD;
    --red-S200 : #FFBCBF;
    --red-S300 : #FF959A;
    --red-S400 : #FE666E;
    --red-S500 : #FF3541;
    --red-S600 : #EA1623;
    --red-S700 : #C11C26;
    --red-S800 : #981119;
    --red-S900 : #5C070C;
    --yellow-S010 : #FFFEF0;
    --yellow-S050 : #FFFCDE;
    --yellow-S100 : #FFFABF;
    --yellow-S200 : #FFF066;
    --yellow-S300 : #FFE313;
    --yellow-S400 : #FFD500;
    --yellow-S500 : #FFC300;
    --yellow-S600 : #EDAE00;
    --yellow-S700 : #D09500;
    --yellow-S800 : #976C00;
    --yellow-S900 : #6B4802;
    --orange-S010 : #FFF7F0;
    --orange-S050 : #FFF3E7;
    --orange-S100 : #FFE7D0;
    --orange-S200 : #FFD2A8;
    --orange-S300 : #FFB273;
    --orange-S400 : #FF943C;
    --orange-S500 : #FF7C11;
    --orange-S600 : #FF5907;
    --orange-S700 : #CA4300;
    --orange-S800 : #943100;
    --orange-S900 : #581D00;
    --pink-S010 : #FFF8FE;
    --pink-S050 : #FFF2FD;
    --pink-S100 : #FFE9FB;
    --pink-S200 : #FFE0F9;
    --pink-S300 : #FFC5F4;
    --pink-S400 : #FFB6F1;
    --pink-S500 : #FF8FEB;
    --pink-S600 : #FF64E3;
    --pink-S700 : #EB55C5;
    --pink-S800 : #BD2D99;
    --pink-S900 : #78145F;
    --white-S000 : rgba(255, 255, 255, 0);
    --white-S010 : rgba(255, 255, 255, 0.05);
    --white-S050 : rgba(255, 255, 255, 0.1);
    --white-S100 : rgba(255, 255, 255, 0.2);
    --white-S200 : rgba(255, 255, 255, 0.3);
    --white-S300 : rgba(255, 255, 255, 0.4);
    --white-S400 : rgba(255, 255, 255, 0.5);
    --white-S500 : rgba(255, 255, 255, 0.6);
    --white-S600 : rgba(255, 255, 255, 0.7);
    --white-S700 : rgba(255, 255, 255, 0.8);
    --white-S800 : rgba(255, 255, 255, 0.9);
    --white-S900 : rgba(255, 255, 255, 1);
    --black-S000 : rgba(0, 0, 0, 0);
    --black-S010 : rgba(0, 0, 0, 0.05);
    --black-S050 : rgba(0, 0, 0, 0.1);
    --black-S100 : rgba(0, 0, 0, 0.2);
    --black-S200 : rgba(0, 0, 0, 0.3);
    --black-S300 : rgba(0, 0, 0, 0.4);
    --black-S400 : rgba(0, 0, 0, 0.5);
    --black-S500 : rgba(0, 0, 0, 0.6);
    --black-S600 : rgba(0, 0, 0, 0.7);
    --black-S700 : rgba(0, 0, 0, 0.8);
    --black-S800 : rgba(0, 0, 0, 0.9);
    --black-S900 : rgba(0, 0, 0, 1);
}

/* =========================================
   Prisma Gradient Token
   ========================================= */
:root {
    --gradient-black_80_bottom : linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
    --gradient-black_80_left : linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
    --gradient-black_80_right : linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
    --gradient-black_80_top : linear-gradient(to top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
    --gradient-black_50_bottom : linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5));
    --gradient-black_50_left : linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5));
    --gradient-black_50_right : linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5));
    --gradient-black_50_top : linear-gradient(to top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5));
    --gradient-white_100_bottom : linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
    --gradient-white_100_left : linear-gradient(to left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
    --gradient-white_100_right : linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
    --gradient-white_100_top : linear-gradient(to top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
}

/* =========================================
   Prisma Typography Token
   ========================================= */

/* -- Font Size -- */
:root {
    --font-size-10: 10px;
    --font-size-11: 11px;
    --font-size-12: 12px;
    --font-size-14: 14px;
    --font-size-16: 16px;
    --font-size-18: 18px;
    --font-size-20: 20px;
    --font-size-24: 24px;
    --font-size-28: 28px;
    --font-size-34: 34px;
    --font-size-36: 36px;
    --font-size-52: 52px;
}

/* -- Font Weight -- */
:root {
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
}

/* -- Line Height -- */
:root {
    --line-height-14: 14px;
    --line-height-16: 16px;
    --line-height-18: 18px;
    --line-height-20: 20px;
    --line-height-22: 22px;
    --line-height-24: 24px;
    --line-height-26: 26px;
    --line-height-28: 28px;
    --line-height-32: 32px;
    --line-height-38: 38px;
    --line-height-44: 44px;
    --line-height-46: 46px;
    --line-height-72: 72px;
}

/* -- Display -- */
.typo-display_52_bold    { font-size: var(--font-size-52); font-weight: var(--font-weight-bold);     line-height: var(--line-height-72); letter-spacing: 0; }
.typo-display_36_bold    { font-size: var(--font-size-36); font-weight: var(--font-weight-bold);     line-height: var(--line-height-46); letter-spacing: 0; }
.typo-display_34_bold    { font-size: var(--font-size-34); font-weight: var(--font-weight-bold);     line-height: var(--line-height-44); letter-spacing: 0; }
.typo-display_28_bold    { font-size: var(--font-size-28); font-weight: var(--font-weight-bold);     line-height: var(--line-height-38); letter-spacing: 0; }

/* -- Headline -- */
.typo-headline_24_bold   { font-size: var(--font-size-24); font-weight: var(--font-weight-bold);     line-height: var(--line-height-32); letter-spacing: 0; }
.typo-headline_20_bold   { font-size: var(--font-size-20); font-weight: var(--font-weight-bold);     line-height: var(--line-height-28); letter-spacing: 0; }
.typo-headline_18_bold   { font-size: var(--font-size-18); font-weight: var(--font-weight-bold);     line-height: var(--line-height-26); letter-spacing: 0; }
.typo-headline_16_bold   { font-size: var(--font-size-16); font-weight: var(--font-weight-bold);     line-height: var(--line-height-24); letter-spacing: 0; }

/* -- Body -- */
.typo-body_18_semibold   { font-size: var(--font-size-18); font-weight: var(--font-weight-semibold); line-height: var(--line-height-26); letter-spacing: 0; }
.typo-body_18_medium     { font-size: var(--font-size-18); font-weight: var(--font-weight-medium);   line-height: var(--line-height-26); letter-spacing: 0; }
.typo-body_18_regular    { font-size: var(--font-size-18); font-weight: var(--font-weight-regular);  line-height: var(--line-height-26); letter-spacing: 0; }
.typo-body_16_semibold   { font-size: var(--font-size-16); font-weight: var(--font-weight-semibold); line-height: var(--line-height-24); letter-spacing: 0; }
.typo-body_16_medium     { font-size: var(--font-size-16); font-weight: var(--font-weight-medium);   line-height: var(--line-height-24); letter-spacing: 0; }
.typo-body_16_regular    { font-size: var(--font-size-16); font-weight: var(--font-weight-regular);  line-height: var(--line-height-24); letter-spacing: 0; }
.typo-body_14_semibold   { font-size: var(--font-size-14); font-weight: var(--font-weight-semibold); line-height: var(--line-height-22); letter-spacing: 0; }
.typo-body_14_medium     { font-size: var(--font-size-14); font-weight: var(--font-weight-medium);   line-height: var(--line-height-22); letter-spacing: 0; }
.typo-body_14_regular    { font-size: var(--font-size-14); font-weight: var(--font-weight-regular);  line-height: var(--line-height-22); letter-spacing: 0; }
.typo-body_12_semibold   { font-size: var(--font-size-12); font-weight: var(--font-weight-semibold); line-height: var(--line-height-20); letter-spacing: 0; }
.typo-body_12_medium     { font-size: var(--font-size-12); font-weight: var(--font-weight-medium);   line-height: var(--line-height-20); letter-spacing: 0; }
.typo-body_12_regular    { font-size: var(--font-size-12); font-weight: var(--font-weight-regular);  line-height: var(--line-height-20); letter-spacing: 0; }

/* -- Misc (Button, Chip, Navigation, Badge) -- */
.typo-button_18_semibold { font-size: var(--font-size-18); font-weight: var(--font-weight-semibold); line-height: var(--line-height-26); letter-spacing: 0; }
.typo-button_16_semibold { font-size: var(--font-size-16); font-weight: var(--font-weight-semibold); line-height: var(--line-height-20); letter-spacing: 0; }
.typo-button_14_semibold { font-size: var(--font-size-14); font-weight: var(--font-weight-semibold); line-height: var(--line-height-20); letter-spacing: 0; }
.typo-button_12_semibold { font-size: var(--font-size-12); font-weight: var(--font-weight-semibold); line-height: var(--line-height-16); letter-spacing: 0; }
.typo-chip_14_regular    { font-size: var(--font-size-14); font-weight: var(--font-weight-regular);  line-height: var(--line-height-16); letter-spacing: 0; }
.typo-navigation_10_medium { font-size: var(--font-size-10); font-weight: var(--font-weight-medium); line-height: var(--line-height-14); letter-spacing: 0; }
.typo-badge_12_semibold  { font-size: var(--font-size-12); font-weight: var(--font-weight-semibold); line-height: var(--line-height-20); letter-spacing: 0; }
.typo-badge_11_semibold  { font-size: var(--font-size-11); font-weight: var(--font-weight-semibold); line-height: var(--line-height-18); letter-spacing: 0; }

/* =========================================
   Prisma Spacing Token
   ========================================= */
:root {
    --spacing-S2 : 2px;
    --spacing-S4 : 4px;
    --spacing-S6 : 6px;
    --spacing-S8 : 8px;
    --spacing-S12 : 12px;
    --spacing-S16 : 16px;
    --spacing-S20 : 20px;
    --spacing-S24 : 24px;
    --spacing-S28 : 28px;
    --spacing-S32 : 32px;
    --spacing-S40 : 40px;
    --spacing-S48 : 48px;
    --spacing-S56 : 56px;
    --spacing-S64 : 64px;
    --spacing-S80 : 80px;
    --grid-spacing-Gap : 16px;
    --grid-spacing-MobilePadding : 16px;
    --grid-spacing-DesktopPadding : 120px;
    --footer-spacing-Mobile : 40px;
    --footer-spacing-Desktop : 120px;
}

/* =========================================
   Prisma Drop Shadow Token
   ========================================= */
:root {
    --dropShadow-bottom_1 : 0 2px 8px 0 rgba(41, 51, 65, 0.04);
    --dropShadow-bottom_2 : 0 4px 12px 0 rgba(41, 51, 65, 0.08), 0 0 2px 0 rgba(41, 51, 65, 0.06);
    --dropShadow-bottom_3 : 0 8px 24px 0 rgba(41, 51, 65, 0.10), 0 2px 8px 0 rgba(41, 51, 65, 0.08);
    --dropShadow-bottom_4 : 0 16px 48px 0 rgba(41, 51, 65, 0.12), 0 4px 16px 0 rgba(41, 51, 65, 0.10);
    --dropShadow-top_1 : 0 -2px 8px 0 rgba(41, 51, 65, 0.04);
    --dropShadow-top_2 : 0 -4px 12px 0 rgba(41, 51, 65, 0.08), 0 0 2px 0 rgba(41, 51, 65, 0.06);
    --dropShadow-top_3 : 0 -8px 24px 0 rgba(41, 51, 65, 0.10), 0 -2px 8px 0 rgba(41, 51, 65, 0.08);
    --dropShadow-top_4 : 0 -16px 48px 0 rgba(41, 51, 65, 0.12), 0 -4px 16px 0 rgba(41, 51, 65, 0.10);
}

/* =========================================
   테마 변수 (Prisma 토큰 기반 매핑)
   ========================================= */
:root {
    /* 브랜드 컬러 → Prisma Purple 계열 */
    --soomgo-primary:       var(--background-purple_enabled);    /* #693BF2 */
    --soomgo-primary-dark:  var(--background-purple_hovered);    /* #6302FB */
    --soomgo-primary-light: var(--background-purple);            /* #F1EEFF */
    --soomgo-secondary:     var(--background-red_enabled);       /* #FF3541 */

    /* 텍스트 & 배경 → Prisma BlueGray 계열 */
    --soomgo-dark:          var(--core-BlueGray);                /* #1C242F */
    --soomgo-gray-900:      var(--bluegray-S900);                /* #1C242F */
    --soomgo-gray-700:      var(--bluegray-S700);                /* #465162 */
    --soomgo-gray-500:      var(--bluegray-S500);                /* #6A7685 */
    --soomgo-gray-300:      var(--bluegray-S200);                /* #C7CED6 */
    --soomgo-gray-100:      var(--bluegray-S010);                /* #F6F7F9 */
    --soomgo-white:         var(--background-primary);           /* #FFFFFF */

    /* 그림자 → Prisma DropShadow */
    --soomgo-shadow:        var(--dropShadow-bottom_1);
    --soomgo-shadow-md:     var(--dropShadow-bottom_2);
    --soomgo-shadow-lg:     var(--dropShadow-bottom_3);

    /* 타이포그래피 & 레이아웃 */
    --soomgo-font:          'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
    --soomgo-radius:        var(--spacing-S8);                   /* 8px */
    --soomgo-radius-lg:     var(--spacing-S16);                  /* 16px */
    --header-height:        71px;
}

/* =========================================
   리셋 & 기본 스타일
   ========================================= */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
    font-size: 16px;
}

body {
    font-family: var(--soomgo-font);
    font-size: var(--font-size-16);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-24);
    letter-spacing: 0;
    color: var(--soomgo-gray-900);
    background-color: var(--soomgo-white);
    -moz-osx-font-smoothing: grayscale;
}

a {
    color: var(--text-purple);
    text-decoration: none;
    transition: color 0.2s ease;
}

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

ul, ol {
    list-style: none;
}

button {
    cursor: pointer;
    border: none;
    background: none;
    font-family: var(--soomgo-font);
}

/* =========================================
   레이아웃 컨테이너
   ========================================= */
.soomgo-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 56px;
}

.single .site-main > .soomgo-container {
    max-width: 1200px;
}

.site-content-area {
    min-height: calc(100vh - var(--header-height) - 400px);
    padding: 48px 0;
}

/* =========================================
   헤더 스타일 (숨고 동일 디자인)
   ========================================= */
.soomgo-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background-color: var(--soomgo-white);
    border-bottom: 1px solid var(--border-secondary);
    height: var(--header-height);
}

.soomgo-header-inner {
    display: flex;
    align-items: center;
    height: var(--header-height);
    gap: 0;
    width: 100%;
    padding: 0 44px;
}

/* 로고 */
.soomgo-logo {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    margin-right: 32px;
}

.soomgo-logo-link {
    display: flex;
    align-items: center;
}

.soomgo-logo-link svg {
    display: block;
}

/* 헤더 내비게이션 - 숨고 스타일 */
.soomgo-header-nav {
    display: flex;
    align-items: center;
    flex: 1;
}

.soomgo-header-nav .nav-menu {
    display: flex;
    align-items: center;
    gap: 0;
}

.soomgo-header-nav .nav-menu li a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: var(--header-height);
    padding: 0 16px;
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    white-space: nowrap;
    transition: color 0.15s ease;
    position: relative;
    line-height: var(--header-height);
}

.soomgo-header-nav .nav-menu li.current-menu-item a {
    color: var(--soomgo-primary);
    font-weight: 600;
}

/* 헤더 우측 액션 영역 - 숨고 스타일 */
.soomgo-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    margin-left: auto;
}

/* 로그인 / 회원가입 텍스트 링크 */
.soomgo-header-login {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary);
    white-space: nowrap;
    transition: color 0.15s ease;
}

/* 고수가입 버튼 - 숨고 스타일 (아웃라인) */
.btn-soomgo-gosu {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 16px;
    font-size: 14px;
    font-weight: 600;
    color: var(--soomgo-primary);
    border: 1.5px solid var(--soomgo-primary);
    border-radius: 6px;
    transition: all 0.15s ease;
    white-space: nowrap;
}

/* 모바일 메뉴 토글 */
.soomgo-menu-toggle {
    display: none;
    margin-right: var(--spacing-S16);
}

/* 모바일 드로어 */
.soomgo-mobile-menu {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1001;
    pointer-events: none;
}

.soomgo-mobile-menu .mobile-menu-inner {
    position: relative;
    z-index: 1;
    width: 80%;
    padding: var(--spacing-S20);
    background: var(--soomgo-white);
    height: 100%;
    overflow-y: auto;
    transform: translateX(-100%);
    transition: transform 0.3s ease;
}

.soomgo-mobile-menu .mobile-menu-header {
    display: flex;
    justify-content: flex-end;
    margin: 0;
}

.soomgo-mobile-menu .mobile-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: 0;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.soomgo-mobile-menu.is-open {
    pointer-events: auto;
}

.soomgo-mobile-menu.is-open .mobile-menu-inner {
    transform: translateX(0);
}

.soomgo-mobile-menu.is-open .mobile-overlay {
    opacity: 1;
}

.soomgo-mobile-menu .nav-menu {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: 24px;
    padding-bottom: 20px;
}

.soomgo-mobile-menu .nav-menu li a {
    display: block;
    padding: var(--spacing-S12) 0;
    font-size: 16px;
    font-weight: 600;
    color: var(--text-primary);
    border-radius: 0;
    transition: color 0.15s;
}

.soomgo-mobile-menu .nav-menu li.current-menu-item a {
    color: var(--soomgo-primary);
    background: transparent;
}

.soomgo-mobile-menu .mobile-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.soomgo-mobile-menu .mobile-actions .soomgo-header-login {
    display: block;
    padding: 14px 4px;
    font-size: 16px;
    font-weight: 500;
    color: var(--text-primary);
    text-align: left;
}

.soomgo-mobile-menu .mobile-actions .btn-soomgo-gosu {
    display: flex;
    justify-content: center;
    padding: 14px;
    font-size: 15px;
    border-radius: 8px;
}

/* =========================================
   콘텐츠 영역 (워드프레스 기본 스타일)
   ========================================= */
.site-main {
    padding: 64px 0 80px;
}

/* =========================================
   싱글 포스트 2-컬럼 레이아웃 (본문 + TOC 사이드바)
   ========================================= */
.single-layout {
    display: flex;
    gap: 108px;
    align-items: flex-start;
}

.single-content {
    flex: 1;
    min-width: 0;
}

.single-toc-sidebar {
    flex-shrink: 0;
    width: 260px;
    position: sticky;
    top: calc(var(--header-height) + 24px);
    max-height: calc(100vh - var(--header-height) - 48px);
    overflow-y: auto;
}

.single-toc-sidebar:empty {
    display: none;
}

/* TOC 공통 스타일 (사이드바 & 본문 내 동일) */
.single #ez-toc-container {
    border: none;
    background: none;
    padding: 0;
    width: 100%;
    box-shadow: none;
}

.single #ez-toc-container .ez-toc-title-container {
    display: none;
}

.single #ez-toc-container nav > ul {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 14px;
    line-height: 22px;
}

.single #ez-toc-container ul {
    padding-left: 0;
    list-style: none;
}

.single #ez-toc-container ul ul {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 6px;
}

.single #ez-toc-container li {
    margin-bottom: 0;
}

/* H2 레벨 (최상위) 항목 */
.single #ez-toc-container nav > ul > li > a {
    display: block;
    color: var(--text-primary);
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
    transition: color 0.15s ease;
}

/* H3 이하 (하위) 항목 */
.single #ez-toc-container a {
    display: block;
    color: var(--text-secondary);
    text-decoration: none;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    transition: color 0.15s ease;
}

.single #ez-toc-container a:hover {
    color: var(--text-primary);
}

/* TOC 하단 CTA */
.toc-cta {
    margin: 24px 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.toc-cta.toc-cta-mobile {
    display: none;
}


@media (max-width: 1200px) {
    .single-toc-sidebar {
        width: 220px;
    }
}

@media (max-width: 960px) {
    .single-layout {
        display: block;
    }

    .single-toc-sidebar {
        display: none;
    }

    .toc-cta.toc-cta-mobile {
        display: flex;
    }

    .toc-cta.toc-cta-mobile .toc-cta-show-mobile {
        display: flex;
    }
}

/* 페이지/아카이브 헤더 */
.page-header {
    margin-bottom: 32px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--border-secondary);
}

.page-title {
    font-size: 28px;
    font-weight: 700;
    color: var(--text-primary);
}

.archive-description {
    margin-top: 8px;
    color: var(--text-secondary);
}

/* 게시물 목록 */
.site-main > .soomgo-container > article {
    margin-bottom: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid var(--border-tertiary);
}

.site-main > .soomgo-container > article:last-of-type {
    border-bottom: none;
}

/* 엔트리 헤더 */
.entry-header {
    margin-bottom: 20px;
}

.entry-title {
    font-size: var(--font-size-34);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-44);
    letter-spacing: 0;
    color: var(--text-primary);
    margin-bottom: 12px;
}

.entry-title + .entry-meta {
    margin-top: 40px;
}

.entry-title a {
    color: inherit;
    text-decoration: none;
}

/* 메타 정보 */
.entry-meta {
    font-size: var(--font-size-16);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-24);
    color: var(--text-secondary);
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.entry-meta .byline::before {
    content: '·';
    margin-right: 12px;
}

/* 썸네일 */
.entry-thumbnail {
    margin-bottom: 24px;
}

.entry-thumbnail img {
    border-radius: 20px;
    width: 100%;
    height: auto;
}

/* 발췌문 */
.entry-summary {
    font-size: 15px;
    line-height: 1.7;
    color: var(--text-secondary);
    margin-top: 12px;
}

/* 본문 콘텐츠 */
.entry-content {
    font-size: var(--font-size-16);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-24);
    color: var(--text-primary);
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
    font-weight: var(--font-weight-bold);
    color: var(--text-primary);
    margin: 32px 0;
    letter-spacing: 0;
}

.entry-content h1 { font-size: var(--font-size-28); line-height: var(--line-height-38); } /* display_28_bold */
.entry-content h2 { font-size: var(--font-size-24); line-height: var(--line-height-32); } /* headline_24_bold */
.entry-content h3 { font-size: var(--font-size-20); line-height: var(--line-height-28); } /* headline_20_bold */
.entry-content h4 { font-size: var(--font-size-18); line-height: var(--line-height-26); } /* headline_18_bold */
.entry-content h5 { font-size: var(--font-size-16); line-height: var(--line-height-24); } /* headline_16_bold */
.entry-content h6 { font-size: var(--font-size-14); line-height: var(--line-height-22); } /* body_14_semibold */

.entry-content p {
    margin-bottom: 24px;
    color: var(--text-secondary);
}

.entry-content p strong{
    color: var(--text-primary);
}

.entry-content ul,
.entry-content ol {
    margin-bottom: 1em;
    padding-left: 24px;
}

.entry-content ul { list-style: disc; }
.entry-content ol { list-style: decimal; }

.entry-content li {
    margin-bottom: 4px;
}

.entry-content blockquote {
    margin: 1.5em 0;
    padding: 16px 20px;
    border-left: 4px solid var(--border-secondary);
    background: var(--background-off_white);
    color: var(--text-secondary);
}

.entry-content code {
    background: var(--background-enabled);
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 14px;
    font-family: 'Courier New', monospace;
}

.entry-content pre {
    background: var(--background-enabled);
    color: #e2e8f0;
    padding: 20px;
    border-radius: 8px;
    overflow-x: auto;
    margin-bottom: 1em;
}

.entry-content img {
    border-radius: 20px;
    margin: 1em 0;
}

/* 테이블 */
.entry-content table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: var(--font-size-14);
    line-height: var(--line-height-22);
    letter-spacing: 0;
}

.entry-content figure.wp-block-table{
    margin: 24px 0;
}

.entry-content table thead th {
    background: var(--background-secondary);
    font-weight: var(--font-weight-semibold);
    color: var(--text-primary);
    padding: 8px 20px;
    text-align: left;
    border: none;
}

.entry-content table thead th:first-child {
    border-radius: 8px 0 0 8px;
}

.entry-content table thead th:last-child {
    border-radius: 0 8px 8px 0;
}

.entry-content table tbody td {
    font-weight: var(--font-weight-regular);
    color: var(--text-secondary);
    padding: 12px 20px;
    border: none;
    border-bottom: 1px solid var(--border-secondary);
}

/* 엔트리 푸터 (태그 등) */
.entry-footer {
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid var(--border-tertiary);
    font-size: 14px;
    color: var(--text-secondary);
}

/* 페이지네이션 & 내비게이션 */
.pagination,
.posts-navigation,
.post-navigation {
    margin: 40px 0 0;
    padding-top: 24px;
    border-top: 1px solid var(--border-tertiary);
}

.nav-links {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: center;
    flex-wrap: wrap;
}

.page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 8px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    color: var(--text-primary);
    border: 1px solid var(--border-secondary);
}

.page-numbers.current {
    background: var(--text-purple);
    color: white;
    border-color: var(--text-purple);
}

/* 포스트 내비게이션 */
.post-navigation .nav-links {
    justify-content: space-between;
}

.post-navigation .nav-subtitle {
    display: block;
    font-size: 12px;
    color: var(--text-secondary);
    margin-bottom: 4px;
}

.post-navigation .nav-title {
    font-weight: 600;
    color: var(--text-primary);
}

/* 검색결과 없음 / 404 */
.no-results,
.error-404 {
    text-align: center;
    padding: 80px 0;
}

.no-results h2,
.error-404 .page-title {
    font-size: 24px;
    margin-bottom: 12px;
}

.no-results p,
.error-404 .page-content p {
    color: var(--text-secondary);
    margin-bottom: 24px;
}

/* =========================================
   푸터 스타일 (Information.tsx 동일 디자인)
   ========================================= */
.soomgo-footer {
    background: var(--soomgo-white);
    font-family: var(--soomgo-font);
    border-top: 1px solid var(--bluegray-S100);
    padding: 21px 12px 40px;
}

/* ── 메인 영역 (Container) ── */
.soomgo-footer-main {
    margin: 0 auto;
    display: block;
    max-width: 970px;
    padding: 0;
}

/* ── 좌측: 연락처 + 다운로드 (Contents) ── */
.footer-info-contents {
    display: inline-block;
    vertical-align: top;
    margin-bottom: 30px;
}

/* 전화번호 (Contact) */
.footer-contact {
    margin: 0;
    font-size: 20px;
    font-weight: 500;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: var(--purple-S500);
    padding-bottom: 3px;
}

/* 운영 시간 (ContactDescription) */
.footer-contact-desc {
    font-size: 14px;
    line-height: normal;
    letter-spacing: normal;
    color: var(--bluegray-S500);
    padding-bottom: 30px;
}

/* 다운로드 버튼 (Download) */
.footer-downloads {
    position: relative;
}

.footer-download-btn {
    display: inline-flex;
    align-items: center;
    align-content: center;
    width: 136px;
    height: 36px;
    background-color: var(--purple-S500);
    border-radius: 20.5px;
    color: var(--core-White);
    font-size: 12px;
    font-weight: 500;
    line-height: 36px;
    letter-spacing: normal;
    white-space: nowrap;
    padding-left: 16px;
    padding-right: 16px;
    margin-right: 8px;
    text-align: center;
    border: none;
    cursor: pointer;
    font-family: var(--soomgo-font);
    text-decoration: none;
}

.footer-download-btn:last-child {
    margin-right: 0;
}

.footer-download-icon {
    display: inline-flex;
    width: 26px;
    height: 20px;
    margin-right: 6px;
}

/* ── 우측: 카테고리 네비게이션 (CategoryContents) ── */
.footer-category-contents {
    display: block;
    width: auto;
    margin-bottom: 0;
    float: right;
}

/* 카테고리 리스트 (CategoryList) */
.footer-category-list {
    margin-bottom: 0;
}

/* 카테고리 아이템 (Category) */
.footer-category {
    vertical-align: top;
    min-width: 95px;
}

/* 모바일 전용 → 데스크톱에서 숨김 */
.footer-category-mobile {
    display: none;
}

/* 데스크톱 전용 → 데스크톱에서 inline-block */
.footer-category-desktop {
    display: inline-block;
}

/* 카테고리 제목 (Title) */
.footer-category-title {
    position: relative;
    padding-bottom: 5px;
    line-height: normal;
    letter-spacing: normal;
    font-weight: 500;
    font-size: 14px;
    cursor: pointer;
    color: var(--bluegray-S800);
    margin: 0;
}

/* 셰브론 아이콘 (데스크톱에서 숨김) */
.footer-chevron {
    display: none;
}

/* 서브메뉴 텍스트 (CategoryText) */
.footer-submenu li a {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 2px;
    width: fit-content;
    font-size: 14px;
    line-height: normal;
    letter-spacing: normal;
    color: var(--bluegray-S500);
    padding: 0 0 5px 0;
    text-decoration: none;
}

/* ── 하단: Terms (법적 링크 + 회사 정보) ── */
.soomgo-footer-bottom {
    display: block;
    max-width: 970px;
    margin: 0 auto;
    padding: 0;
    padding-top: 20px;
}

/* 컨테이너: 좌측(콘텐츠) + 우측(SNS 배지) */
.terms-container {
    width: 100%;
    display: flex;
    align-items: flex-end;
}

/* 좌측: 약관·면책·회사정보 */
.terms-contents {
    display: inline-block;
    vertical-align: top;
    flex: 1;
}

/* 공통 행 */
.terms-row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-S8) var(--spacing-S20);
    line-height: 18px;
    padding-bottom: 8px;
}

/* 법적 링크 행 */
.terms-links {
    padding-right: 96px;
}

.terms-links a {
    font-size: 12px;
    line-height: normal;
    letter-spacing: normal;
    color: var(--bluegray-S500);
    font-weight: 500;
}

/* 면책 고지 행 */
.terms-disclaimer {
    padding-right: 96px;
}

.terms-text {
    display: inline-block;
    font-size: 12px;
    line-height: normal;
    letter-spacing: normal;
    color: var(--bluegray-S500);
    font-weight: normal;
    text-align: start;
    margin: 0;
}

/* 회사 정보 (데스크톱) */
.terms-company-desktop {
    gap: 0;
    flex-direction: column;
}

.terms-company-desktop li {
    display: block;
    text-align: start;
    font-size: 12px;
    padding: 0;
}

.terms-company-desktop li span {
    font-size: 12px;
    line-height: normal;
    letter-spacing: normal;
    color: var(--bluegray-S500);
    margin: 0;
}

/* 회사 정보 (모바일) — 데스크톱에서 숨김 */
.terms-company-mobile {
    display: none;
}

.terms-company-mobile li {
    display: block;
    text-align: start;
    font-size: 12px;
    padding: 0;
}

.terms-company-mobile li span {
    font-size: 12px;
    line-height: normal;
    letter-spacing: normal;
    color: var(--bluegray-S500);
    margin: 0;
}

/* SNS 배지 */
.terms-badges {
    display: flex;
    column-gap: var(--spacing-S12);
    flex: none;
    float: right;
    padding-bottom: 40px;
}

.sns-badge {
    display: block;
    text-decoration: none;
    color: var(--text-primary);
}

.sns-badge > div {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--background-tertiary);
}

/* =========================================
   반응형 디자인
   ========================================= */
@media (max-width: 1024px) {
    /* 1024px 이하에서는 특별한 변경 없음 (inline-block 레이아웃 유지) */
}

@media (max-width: 768px) {
    :root {
        --header-height: 56px;
    }

    .soomgo-header-nav,
    .soomgo-header-actions {
        display: none;
    }

    .soomgo-header-inner {
        padding: 0px
    }

    .soomgo-menu-toggle {
        display: flex;
    }

    .soomgo-mobile-menu {
        display: block;
    }

    /* Terms: 모바일 레이아웃 */
    .soomgo-footer-bottom {
        text-align: center;
        padding-top: 0;
    }

    .terms-container {
        display: block;
    }

    .terms-contents {
        display: block;
    }

    .terms-contents ul:first-of-type {
        padding-bottom: 0;
    }

    .terms-row {
        justify-content: center;
        padding-right: 0;
        margin: 20px 0;
    }

    .terms-row:last-of-type {
        display: block;
        padding-bottom: 0;
    }

    .terms-links {
        padding-right: 0;
    }

    .terms-disclaimer {
        padding-right: 0;
    }

    .terms-text {
        text-align: center;
        padding: 0 27px;
    }

    /* 데스크톱 회사정보 숨기고 모바일용 표시 */
    .terms-company-desktop {
        display: none;
    }

    .terms-company-mobile {
        display: flex;
    }

    .terms-company-mobile li {
        text-align: center;
    }

    /* SNS 배지: 모바일 */
    .terms-badges {
        float: none;
        padding-bottom: 0;
        display: inline-flex;
        justify-content: center;
        width: 100%;
    }

    /* Information: 모바일 레이아웃 */
    .soomgo-footer-main {
        text-align: center;
    }

    .footer-info-contents {
        display: block;
        margin-bottom: 17px;
    }

    .footer-contact-desc {
        padding-bottom: 17px;
    }

    /* 카테고리: 모바일 */
    .footer-category-contents {
        width: 100%;
        float: none;
    }

    .footer-category-mobile {
        display: block;
        border-bottom: 1px solid var(--bluegray-S100);
    }

    .footer-category-mobile.is-open {
        padding-bottom: 15px;
    }

    .footer-category-desktop {
        display: none;
    }

    .footer-category-title {
        width: 100%;
        padding: 13px 0;
        font-size: 16px;
    }

    /* 셰브론 아이콘: 모바일에서 표시 */
    .footer-chevron {
        display: inline;
        position: absolute;
        right: 20px;
        color: var(--text-purple);
        transition: transform 0.25s ease;
    }

    .footer-category-mobile.is-open .footer-chevron {
        transform: rotate(180deg);
    }

    /* 서브메뉴: 모바일 */
    .footer-category-mobile .footer-submenu {
        display: none;
    }

    .footer-category-mobile.is-open .footer-submenu {
        display: block;
    }

    .footer-submenu li a {
        justify-content: center;
        width: 100%;
        font-size: 16px;
        padding: 13px 0;
    }

    .site-main {
        padding: 28px 0 48px;
    }

    .soomgo-container {
        padding: 0 16px;
    }

}



/* =========================================
   워드프레스 위젯 영역
   ========================================= */
.widget {
    margin-bottom: 32px;
}

.widget-title {
    font-size: 16px;
    font-weight: 700;
    color: var(--soomgo-gray-900);
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--soomgo-primary);
}

/* =========================================
   댓글 영역
   ========================================= */
.comments-area {
    margin-top: 48px;
    padding-top: 40px;
    border-top: 1px solid var(--soomgo-gray-100);
}

.comments-title {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 24px;
    color: var(--soomgo-gray-900);
}

.comment-form input,
.comment-form textarea {
    width: 100%;
    padding: 12px 16px;
    border: 1.5px solid var(--soomgo-gray-300);
    border-radius: var(--soomgo-radius);
    font-family: var(--soomgo-font);
    font-size: 14px;
    color: var(--soomgo-gray-900);
    transition: border-color 0.2s;
    outline: none;
}

.comment-form input:focus,
.comment-form textarea:focus {
    border-color: var(--soomgo-primary);
    box-shadow: 0 0 0 3px var(--purple-S100);
}

.comment-form .submit {
    background: var(--soomgo-primary);
    color: var(--soomgo-white);
    padding: 12px 28px;
    border-radius: 100px;
    font-size: 15px;
    font-weight: 600;
    transition: all 0.2s;
    cursor: pointer;
    border: none;
    font-family: var(--soomgo-font);
}

/* =========================================
   Prisma Button
   ========================================= */

/* -- Base -- */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 8px;
    font-family: var(--soomgo-font);
    font-weight: var(--font-weight-semibold);
    letter-spacing: 0;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
    text-decoration: none;
    box-sizing: border-box;
}

.btn:disabled,
.btn.is-disabled {
    cursor: not-allowed;
}

/* -- Size: Large (default) -- */
.btn-lg,
.btn {
    height: 48px;
    padding: 12px 16px;
    gap: 8px;
    font-size: var(--font-size-16);
    line-height: 20px;
}

/* -- Size: Medium -- */
.btn-md {
    height: 40px;
    padding: 12px;
    gap: 4px;
    font-size: var(--font-size-14);
    line-height: 20px;
}

/* -- Size: Small -- */
.btn-sm {
    height: 36px;
    padding: 8px 12px;
    gap: 4px;
    font-size: var(--font-size-14);
    line-height: 20px;
}

/* -- Size: Tiny -- */
.btn-xs {
    height: 28px;
    padding: 4px 8px;
    gap: 4px;
    font-size: var(--font-size-12);
    line-height: 16px;
}

/* -- Variant: Primary -- */
.btn-primary {
    background-color: var(--background-purple_enabled);
    color: var(--text-white);
}

.btn-primary:disabled,
.btn-primary.is-disabled {
    background-color: var(--background-tertiary);
    color: var(--text-tertiary);
}

/* -- Variant: Secondary -- */
.btn-secondary {
    background-color: var(--background-primary);
    border: 1px solid var(--border-secondary);
    color: var(--text-primary);
}

.btn-secondary:disabled,
.btn-secondary.is-disabled {
    background-color: var(--background-primary);
    color: var(--text-quaternary);
}

/* -- Variant: Tertiary -- */
.btn-tertiary {
    background-color: var(--background-secondary);
    color: var(--text-primary);
}

.btn-tertiary:disabled,
.btn-tertiary.is-disabled {
    background-color: var(--background-secondary);
    color: var(--text-quaternary);
}

/* -- Variant: Danger -- */
.btn-danger {
    background-color: var(--background-red_enabled);
    color: var(--text-white);
}

.btn-danger:disabled,
.btn-danger.is-disabled {
    background-color: var(--background-tertiary);
    color: var(--text-tertiary);
}

/* -- Variant: Ghost Primary -- */
.btn-ghost-primary {
    background-color: transparent;
    color: var(--text-purple);
}

.btn-ghost-primary:disabled,
.btn-ghost-primary.is-disabled {
    color: var(--text-quaternary);
    background-color: transparent;
}

/* -- Variant: Ghost Secondary -- */
.btn-ghost-secondary {
    background-color: transparent;
    color: var(--text-secondary);
}

.btn-ghost-secondary:disabled,
.btn-ghost-secondary.is-disabled {
    color: var(--text-quaternary);
    background-color: transparent;
}

/* -- Variant: Ghost Danger -- */
.btn-ghost-danger {
    background-color: transparent;
    color: var(--state-negative-text);
}

.btn-ghost-danger:disabled,
.btn-ghost-danger.is-disabled {
    color: var(--text-quaternary);
    background-color: transparent;
}

/* -- Full Width -- */
.btn-block {
    width: 100%;
}

/* -- Icon Size -- */
.btn .btn-icon { width: 20px; height: 20px; flex-shrink: 0; }
.btn-md .btn-icon { width: 16px; height: 16px; }
.btn-sm .btn-icon { width: 16px; height: 16px; }
.btn-xs .btn-icon { width: 14px; height: 14px; }

/* =========================================
   FAQ 섹션
   ========================================= */
.faq-wrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 32px;
}

.faq-title {
    font-size: var(--font-size-20);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-28);
    color: var(--text-primary);
    margin-bottom: 4px;
}

.faq-item {
    background: var(--background-off_white);
    border-radius: 12px;
    padding: 0 20px;
}

.faq-item summary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 16px 0;
    font-size: var(--font-size-16);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-24);
    letter-spacing: 0;
    color: var(--text-primary);
    cursor: pointer;
    list-style: none;
}

.faq-item summary::-webkit-details-marker {
    display: none;
}

.faq-item summary::after {
    content: '';
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    margin-left: auto;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%236A7685' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    transition: transform 0.2s ease;
}

.faq-item[open] summary::after {
    transform: rotate(180deg);
}

.faq-a {
    padding-bottom: 16px;
    font-size: var(--font-size-16);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-24);
    letter-spacing: 0;
    color: var(--text-secondary);
}

/* =========================================
   유틸리티
   ========================================= */
.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}

.skip-link {
    position: absolute;
    top: -999px;
    left: 0;
    padding: 10px 20px;
    background: var(--soomgo-primary);
    color: var(--soomgo-white);
    font-size: 14px;
    font-weight: 600;
    z-index: 9999;
    border-radius: 0 0 var(--soomgo-radius) 0;
}

.skip-link:focus {
    top: 0;
}