@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400;1,700&family=Cormorant+Garamond:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&family=Noto+Serif+KR:wght@400;700&display=swap');/* React 앱 기본 리셋 - 모든 스타일은 mcoaching.css에서 처리 */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; overflow-x: hidden; width: 100%; }
#root, .app-wrapper { width: 100%; overflow-x: hidden; position: relative; }

/* Reset & Variables */
:root {
    --primary-color: #000000;
    --text-main: #333333;
    --text-light: #777777;
    --bg-light: #f9f9f9;
    --header-height: 96px; /* 疫꿸퀣??120px?癒?퐣 20% ?곕벡??*/
    --header-shrink: 80px;  /* 疫꿸퀣??100px?癒?퐣 20% ?곕벡??*/
    --transition-speed: 0.4s;
    --font-en: 'Montserrat', sans-serif;
    --font-ko: 'Noto Sans KR', sans-serif;
}
html {
    overflow-x: hidden; /* html ?덈꺼?먯꽌??媛€濡??ㅽ겕濡?李⑤떒 */
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    word-break: keep-all;
    overflow-wrap: break-word;
}
body {
    font-family: var(--font-ko);
    color: var(--text-main);
    line-height: 1.6;
    background-color: #ffffff;
    overflow-x: hidden; /* 揶쎻궗嚥???쎄쾿嚥????遺얇늺 ?遺얜굶??獄쎻뫗? */
}
a {
    text-decoration: none;
    color: inherit;
}
ul {
    list-style: none;
}
/* ==================================
   1. Header (?怨룸뼊 筌롫뗀?김쳸?
================================== */
#main-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    transition: all var(--transition-speed) ease;
    background-color: transparent; /* 珥덇린: ?щ챸 */
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    color: #ffffff; /* 珥덇린: ?곗깋 ?띿뒪?몃줈 蹂듦뎄 */
}
/* ??쎄쾿嚥???癰궰野껋럥由??Sticky ??삳쐭 ?????(White 甕곌쑴?? */
#main-header.scrolled {
    background-color: #ffffff;
    color: #000000;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.05);
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}
.header-inner {
    max-width: 1600px; /* ????諭???쎄쾿??????(?癒?맒癰귣벀?? */
    margin: 0 auto;
    padding: 0 40px; /* ?癒?맒癰귣벀??*/
    height: var(--header-height);
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: height var(--transition-speed) ease;
}
/* ??쎄쾿嚥?????삳쐭 ?誘れ뵠揶쎛 ?봔??뺤쓦野?餓κ쑴堉??*/
#main-header.scrolled .header-inner {
    height: var(--header-shrink);
}
/* 嚥≪뮄???????곗춦 (???筌왖 嚥≪뮄??? */
.logo {
    display: flex;
    align-items: center;
}
.logo img {
    height: 80px; /* ??삳쐭 ??쑴???筌띿쉸?????筌왖 ?誘れ뵠 (疫꿸퀣??2獄??類?) */
    width: auto;
    /* ??쎄쾿嚥????봔??뺤쑎???袁り숲 ?袁れ넎???袁る퉸 transition??filter ??욧쉐 ?곕떽? */
    transition: height var(--transition-speed) ease, filter var(--transition-speed) ease;
}
#main-header.scrolled .logo img {
    height: 64px; /* ??쎄쾿嚥????봔??뺤쓦野??곕벡??(疫꿸퀣??2獄??類?) */
    filter: invert(1); /* ?癒?궚 嚥≪뮄????酉???깆뱽 ?醫???렽???깃맒筌?獄쏆꼷??*/
}
/* ?怨쀫? 6?? 筌롫뗀???怨몃열 */
.gnb {
    transform: translateX(-15vw) scale(0.8); /* 揶쏅벡?ｆ에??ル슣瑜?餓λ쵐釉?筌???곗쨮 ???선?諛?????덈뻻??20% ?곕벡??*/
    transform-origin: center; /* ??뽰쁽?귐딅퓠???곕벡??*/
}
.gnb ul {
    display: flex;
    gap: 5rem; /* 揶쎛嚥?揶쏄쑨爰??癒?맒癰귣벀??*/
}
.gnb a {
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: opacity 0.3s ease;
    padding: 10px 0;
}
.gnb a:hover {
    opacity: 0.6;
}
/* ?怨론????얜챷??筌롫뗄??????? (?怨좊뱜 ??由?鈺곌퀣?? */
.gnb .en {
    font-family: 'Malgun Gothic', '筌띾쵐? ?⑥쥓逾?, 'Noto Sans KR', sans-serif;
    font-style: normal;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 1px;
    margin-bottom: 4px;
}

.gnb .ko {
    font-family: 'Malgun Gothic', '筌띾쵐? ?⑥쥓逾?, 'Noto Sans KR', sans-serif;
    font-size: 13px;
    font-weight: 500;
    opacity: 0.9;
    letter-spacing: 0px;
    white-space: nowrap;
    transition: color 0.3s ease;
}
/* ??쎄쾿嚥???獄쏆빘? 獄쏄퀗瑗??筌띿쉸????뺥닏 ??용뮞??筌뤿굝猷?鈺곌퀣??*/
#main-header.scrolled .gnb .ko {
    color: var(--text-light);
}
/* ==================================
   2. Hero Section (筌롫뗄??獄쏄퀡瑗?
================================== */
.hero {
    position: relative;
    height: 100vh;
    width: 100%;
    background-color: #000; /* ?怨멸맒 嚥≪뮆諭???Fallback */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    overflow: hidden; /* ??쑬逾??? ?癒?죬??륁궎筌왖 ??낅즲嚥?筌△뫀??*/
}
/* 獄쏄퉫???깆뒲???怨멸맒 ?????(?遺얇늺 揶쎛??筌?쑴??묾? */
.hero-video {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    transform: translate(-50%, -50%);
    z-index: 0;
}
/* ?怨룸뼊 ??삳쐭 ??용뮞??揶쎛??녾쉐???袁る립 筌ㅼ뮇???뽰벥 獄쏆빘? ??살쒔??됱뵠 (獄쏄퀗瑗??遺얇늺 獄쏆빓由??醫?) */
.hero-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to bottom, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0) 25%);
    z-index: 1;
    pointer-events: none;
}
/* ==================================
   3. Content Sections & Animations
================================== */
.section {
    padding: 140px 40px;
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.section.bg-white { background-color: #ffffff; }
.section.bg-light { background-color: var(--bg-light); }
.section-inner {
    max-width: 1200px;
    width: 100%;
    text-align: center;
}
.section-title {
    font-family: var(--font-en);
    font-size: 36px;
    font-weight: 300;
    letter-spacing: 4px;
    margin-bottom: 30px;
}
.section-desc {
    font-size: 16px;
    color: var(--text-light);
}
/* ==================================
   5. About Section (筌뤿굞?ョ㎉????뻣)
================================== */
.about-content {
    display: flex;
    gap: 60px;
    margin-top: 60px;
    text-align: left;
}
.about-philosophy {
    flex: 1.2;
}
.about-profile {
    flex: 0.8;
    background-color: #fafafa;
    padding: 40px;
    border-radius: 8px;
    border: 1px solid #eeeeee;
}
.about-subtitle {
    font-family: var(--font-ko);
    font-size: 22px;
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: 25px;
    position: relative;
    padding-bottom: 15px;
}
.about-subtitle::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 35px;
    height: 2px;
    background-color: #c9a96e; /* ?ⓥ뫀諭??????*/
}
.about-text {
    font-size: 16px;
    line-height: 1.8;
    color: #444444;
    margin-bottom: 35px;
}
.core-values {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.val-item {
    font-family: var(--font-en);
    font-size: 13px;
    background: #f4f4f4;
    padding: 8px 16px;
    border-radius: 30px;
    color: #555555;
    letter-spacing: 0.5px;
}
.val-item strong {
    color: #c9a96e;
    font-weight: 700;
    font-size: 14px;
}
.profile-list {
    list-style: none;
    padding: 0;
}
.profile-list li {
    font-size: 15px;
    line-height: 1.7;
    margin-bottom: 14px;
    color: #555555;
}
.profile-list li strong {
    display: inline-block;
    width: 50px;
    color: #111111;
    font-weight: 600;
}
/* ?봔??뺤쓦野??醫롮궎?쒕???Fade-in Up ?醫딅빍筌롫뗄????紐낅샒 */
.fade-up {
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 1s ease-out, transform 1s cubic-bezier(0.2, 0.8, 0.2, 1);
}
/* JavaScript ???甕곌쑨? ??쎄쾿嚥▲끉??揶쏅Ŋ???뤿연 ?곕떽???롫뮉 ?????*/
.fade-up.visible {
    opacity: 1;
    transform: translateY(0);
}
/* ==================================
   6. Case & Insights Section
================================== */
.category-filter {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-bottom: 40px;
    flex-wrap: wrap;
}
.filter-btn {
    padding: 10px 24px;
    background-color: #f4f4f4;
    color: #666666;
    border: 1px solid transparent;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    font-family: var(--font-ko);
}
.filter-btn:hover {
    background-color: #eeeeee;
}
.filter-btn.active {
    background-color: #1a233a;
    color: #ffffff;
    border-color: #1a233a;
    box-shadow: 0 4px 10px rgba(26, 35, 58, 0.2);
}
.case-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 60px;
    margin-bottom: 50px;
    text-align: left;
}
/* 筌뤴뫀而?? ?紐꾧텢??꾨뱜 燁삳?諭?1??以??袁れ넎 */
.case-card {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    cursor: pointer;
    height: 320px; /* ?⑥쥙???誘れ뵠 */
    border: none;
    background-color: #000;
}
.case-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.3);
}
.case-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.case-img img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    transition: transform 0.6s ease;
    opacity: 0.9;
}
.case-card:hover .case-img img {
    transform: scale(1.08);
    opacity: 1;
}
.case-info {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 40px 25px 25px 25px;
    z-index: 2;
    background: linear-gradient(to top, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.6) 50%, transparent 100%);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
.case-tag {
    display: inline-block;
    font-size: 13px;
    color: #ffd700;
    font-weight: 700;
    margin-bottom: 10px;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-shadow: 0 2px 4px rgba(0,0,0,0.8);
}
.case-title {
    font-size: 20px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 15px;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-shadow: 0 2px 5px rgba(0,0,0,0.8);
}
.case-meta {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    color: #e0e0e0;
    border-top: 1px solid rgba(255,255,255,0.3);
    padding-top: 15px;
    font-weight: 500;
    text-shadow: 0 1px 3px rgba(0,0,0,0.8);
}
.case-more {
    text-align: center;
}
.btn-more {
    display: inline-block;
    padding: 14px 45px;
    background-color: transparent;
    color: #1a233a;
    border: 1px solid #1a233a;
    border-radius: 30px;
    font-size: 15px;
    font-weight: 600;
    transition: all 0.3s ease;
}
.btn-more:hover {
    background-color: #1a233a;
    color: #ffffff;
}
/* ==================================
   7. Testimonials (?⑥쥒而??袁㏓┛ ?얜똾釉?嚥▲끇彛?
================================== */
.marquee-container {
    width: 100%; /* ?꾩껜 ?붾㈃ ?덈퉬 ?곸슜 -> 媛濡??ㅽ겕濡?踰꾧렇 諛⑹?瑜??꾪빐 100% 蹂寃?*/
    position: relative;
    left: 0;
    transform: translateX(-25%);
    overflow: hidden;
    padding: 20px 0;
    /* ?臾믡걹 ??뱀뵠 ?癒?염??살쓦野???륁뵠??뽯툡????롫즲嚥?筌띾뜆????怨몄뒠 */
    mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
}
.marquee-track {
    display: flex;
    gap: 30px;
    width: -moz-max-content;
    width: max-content;
    /* 55????덈툧 ?醫륁굨(linear)??곗쨮 ?얜똾釉?infinite) 獄쏆꼶??*/
    animation: scroll-marquee 55s linear infinite;
}
.marquee-group {
    display: flex;
    gap: 30px;
}
/* 筌띾뜆?????살쒔 ????깅뻻 ?類? (Hover Pause) */
.marquee-track:hover {
    animation-play-state: paused;
}
/* ???뼎 ?醫딅빍筌롫뗄??? ?類μ넇?????紐낅뱜(group) + ??媛싷쭕?곌껍 ??猷????귐딅?*/
@keyframes scroll-marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(-50% - 15px)); }
}
.testimonial-card {
    background: #ffffff;
    padding: 50px;
    border-radius: 20px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.02);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: left;
    width: 500px;
    min-width: 500px;
    flex-shrink: 0;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.testimonial-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 30px 60px rgba(15, 23, 42, 0.08);
    border-color: rgba(30, 58, 138, 0.15);
}
.testimonial-card .quote {
    font-size: 24px;
    line-height: 1.8;
    color: #334155;
    font-weight: 400;
    margin: 0 0 30px 0;
    word-break: keep-all;
}
.testimonial-card .reviewer {
    font-size: 21px;
    color: #1e3a8a;
    font-weight: 700;
    letter-spacing: -0.3px;
    border-top: 1px solid #f1f5f9;
    padding-top: 22px;
    display: block;
    margin-top: auto;
}
.testimonial-card .stars {
    display: none;
}
.testimonial-card .position {
    color: #1a233a;
    font-size: 13px;
    font-weight: 600;
}
/* ==================================
   4. Mobile Responsive (筌뤴뫀而??筌ㅼ뮇???
================================== */
.mobile-menu-btn {
    display: none;
    background: transparent;
    border: none;
    cursor: pointer;
    width: 30px;
    height: 24px;
    position: relative;
    z-index: 1001; /* ??살쒔??됱뵠癰귣???筌ㅼ뮇湲??*/
}
.mobile-menu-btn span {
    display: block;
    position: absolute;
    height: 2px;
    width: 100%;
    background-color: #ffffff; /* ?꾨쾭嫄?踰꾪듉???곗깋?쇰줈 蹂듦뎄 */
    transition: all 0.3s ease;
}
#main-header.scrolled .mobile-menu-btn span {
    background-color: #000000; /* ??쎄쾿嚥???野꺜????*/
}
/* ?袁⑥쒔椰?甕곌쑵??3餓?揶쏄쑨爰?*/
.mobile-menu-btn span:nth-child(1) { top: 0; }
.mobile-menu-btn span:nth-child(2) { top: 11px; }
.mobile-menu-btn span:nth-child(3) { top: 22px; }
/* 筌롫뗀?긷첎? ??議?????袁⑥쒔椰?甕곌쑵??X 筌뤴뫁堉??곗쨮 癰궰??*/
.mobile-menu-btn.active span:nth-child(1) {
    top: 11px;
    transform: rotate(45deg);
    background-color: #000000; /* ??살쒔??됱뵠 ?袁⑸퓠??野꺜????*/
}
.mobile-menu-btn.active span:nth-child(2) {
    opacity: 0;
}
.mobile-menu-btn.active span:nth-child(3) {
    top: 11px;
    transform: rotate(-45deg);
    background-color: #000000;
}
/* 筌뤴뫀而???袁⑹뒠 筌롫뗀????살쒔??됱뵠 */
.mobile-nav-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    height: 100dvh;
    background-color: #ffffff;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s ease, visibility 0.4s ease;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    overflow-y: auto;
    padding: 80px 20px;
}
.mobile-nav-overlay.active {
    opacity: 1;
    visibility: visible;
}
.mobile-gnb ul {
    display: flex;
    flex-direction: column;
    gap: 30px;
    text-align: center;
}
.mobile-gnb a {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #000000;
    transition: opacity 0.3s ease;
}
.mobile-gnb a:hover {
    opacity: 0.6;
}
.mobile-gnb .en {
    font-family: var(--font-en);
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 2px;
    margin-bottom: 5px;
}
.mobile-gnb .ko {
    font-size: 14px;
    font-weight: 400;
    color: #666666;
}
/* ==================================
   8. Case & Insights Modal (??밸씜)
================================== */
.case-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s ease, visibility 0.4s ease;
}
.case-modal.active {
    opacity: 1;
    visibility: visible;
}
.case-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(10, 15, 25, 0.7);
    backdrop-filter: blur(5px);
    z-index: 1;
}
.case-modal-content {
    background-color: #ffffff;
    width: 90%;
    max-width: 800px;
    max-height: 85vh;
    border-radius: 12px;
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    overflow: hidden;
}
.case-modal-close {
    position: absolute;
    top: 20px;
    right: 25px;
    background: transparent;
    border: none;
    font-size: 28px;
    color: #888;
    cursor: pointer;
    transition: color 0.3s ease;
    z-index: 3;
}
.case-modal-close:hover {
    color: #1a233a;
}
.case-modal-header {
    padding: 40px 40px 20px;
    border-bottom: 1px solid #eeeeee;
}
.case-modal-tag {
    display: inline-block;
    font-size: 14px;
    color: #c9a96e;
    font-weight: 700;
    margin-bottom: 15px;
}
.case-modal-title {
    font-size: 24px;
    font-weight: 700;
    color: #1a233a;
    line-height: 1.4;
    margin-bottom: 20px;
}
.case-modal-meta {
    display: flex;
    gap: 20px;
    font-size: 14px;
    color: #888888;
}
.case-modal-body {
    padding: 30px 40px 40px;
    overflow-y: auto;
}
/* ?뚣끉??? ??쎄쾿嚥▲끇而?*/
.case-modal-body::-webkit-scrollbar {
    width: 8px;
}
.case-modal-body::-webkit-scrollbar-track {
    background: #f1f1f1; 
}
.case-modal-body::-webkit-scrollbar-thumb {
    background: #c1c1c1; 
    border-radius: 4px;
}
.case-modal-body::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8; 
}
.case-modal-img-wrapper {
    margin-bottom: 30px;
    border-radius: 8px;
    overflow: hidden;
}
.case-modal-img-wrapper img {
    width: 100%;
    height: auto;
    display: block;
}
.case-modal-text {
    font-size: 16px;
    line-height: 1.8;
    color: #444444;
    white-space: normal; /* HTML ??볥젃 ?닌듼쒐몴??癒?염??살쓦野????쐭筌띻낱釉?묾??袁る퉸 normal嚥?癰궰野?*/
}
/* ??뺥닜??筌뤴뫀而??獄쏆꼷????닌덉퍢 */
/* ==================================
   ABOUT MCOACHING Section (New Layout)
================================== */
.about-container {
    display: flex;
    gap: 60px;
    margin-top: 50px;
    align-items: flex-start;
}
.about-left {
    flex: 0 0 35%;
}
.about-image-wrapper {
    position: relative;
}
.about-ceo-img {
    width: 100%;
    border-radius: 16px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.08);
    display: block;
}
.about-badges {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin-top: 20px;
}
.badge {
    background: #f8f9fb;
    padding: 15px 20px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #eeeeee;
}
.badge-num {
    font-size: 24px;
    font-weight: 700;
    color: #1a233a;
    font-family: var(--font-en);
}
.badge-label {
    font-size: 13px;
    font-weight: 600;
    color: #666;
    text-transform: uppercase;
    font-family: var(--font-en);
    letter-spacing: 1px;
}
.about-right {
    flex: 1;
}
.about-slogan {
    font-size: 24px;
    font-weight: 700;
    color: #1a233a;
    line-height: 1.5;
    margin-bottom: 20px;
    word-break: keep-all;
}
.about-intro {
    font-size: 16px;
    color: #555;
    line-height: 1.8;
    margin-bottom: 50px;
    word-break: keep-all;
}
.about-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}
.grid-col {
    background: #ffffff;
    border-top: 3px solid #1a233a;
    padding-top: 20px;
}
.grid-title {
    font-size: 18px;
    font-weight: 700;
    color: #1a233a;
    margin-bottom: 15px;
    word-break: keep-all;
}
.grid-desc {
    font-size: 14px;
    color: #666;
    line-height: 1.7;
    word-break: keep-all;
}
/* ==================================
   NEW ABOUT SECTION: PREMIUM MEDICAL STYLE
================================== */
/* ?怨몃열 1: ?袁ⓥ봺沃섎챷毓???쎄쾿 ??쎄틛 獄쏄퀡瑗?*/
.dark-stat-banner {
    background-color: #001F3F; /* ????쇱뵠??*/
    padding: 7rem 0;
    color: #ffffff;
    text-align: center;
}
.banner-inner {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}
.banner-badge {
    display: inline-block;
    color: #ffffff;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 2px;
    margin-bottom: 25px;
    font-family: var(--font-en);
    border: 1px solid rgba(255, 255, 255, 0.4);
    padding: 6px 18px;
    border-radius: 50px;
    background: rgba(255,255,255,0.05);
}
.banner-title {
    font-size: 36px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 30px;
    line-height: 1.4;
    word-break: keep-all;
}
.banner-desc {
    font-size: 17px;
    color: #e2e8f0; /* ?怨좊립 域밸챶???*/
    line-height: 1.7;
    margin-bottom: 60px;
    word-break: keep-all;
    font-weight: 300;
}
.banner-stats-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    margin-bottom: 60px;
}
.stat-box {
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 12px;
    padding: 30px 20px;
    background: rgba(255, 255, 255, 0.03);
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: transform 0.3s ease, background 0.3s ease;
}
.stat-box:hover {
    transform: translateY(-5px);
    background: rgba(255, 255, 255, 0.08);
}
.stat-icon {
    font-size: 28px;
    margin-bottom: 15px;
}
.stat-label {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.6);
    margin-bottom: 8px;
    letter-spacing: 1px;
    font-family: var(--font-en);
}
.stat-value {
    font-size: 22px;
    font-weight: 700;
    color: #ffffff;
}
.banner-actions {
    display: flex;
    justify-content: center;
    gap: 20px;
}
.btn-solid-primary {
    background-color: #ffffff;
    color: #001F3F;
    padding: 16px 36px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 50px;
    text-decoration: none;
    transition: all 0.3s ease;
}
.btn-solid-primary:hover {
    background-color: #f1f1f1;
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}
.btn-outline-light {
    background-color: transparent;
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.4);
    padding: 16px 36px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 50px;
    text-decoration: none;
    transition: all 0.3s ease;
}
.btn-outline-light:hover {
    background-color: rgba(255, 255, 255, 0.1);
    border-color: #ffffff;
}
/* ?怨몃열 2: ??륁뵠?遺얜굡 3????쑴竊??燁삳?諭??怨몃열 */
.visual-cards-area {
    background-color: #ffffff;
    padding: 4rem 0; /* Reduced from 6rem 0 */
}
.cards-grid-v {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    max-width: 1600px;
    margin: 0 auto;
    padding: 0 20px;
}
.v-card {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    height: 380px;
    background-size: cover;
    background-position: center top;
    display: flex;
    align-items: flex-end;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    transition: transform 0.4s ease;
    flex-shrink: 0;
}
.v-card:hover {
    transform: translateY(-8px);
}
.v-card-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,0) 60%, rgba(0,0,0,0.85) 80%, rgba(0,0,0,0.95) 100%);
    z-index: 1;
}
.v-card-content {
    position: relative;
    z-index: 2;
    padding: 30px;
    color: #ffffff;
    width: 100%;
    text-align: left;
}
.v-card-title {
    font-size: 29px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    margin-bottom: 12px !important;
    line-height: 1.3 !important;
}
.v-card-caption {
    font-size: 20px !important;
    color: rgba(255, 255, 255, 0.9) !important;
    line-height: 1.6 !important;
    word-break: keep-all;
}
/* Mobile Cards Layout Fix - ?쒕옒洹??ㅽ겕濡?+ ?먮룞 ?щ씪?대뱶 吏??*/
/* ?먮룞 ?щ씪?대뱶 ?꾪듃 ?몃뵒耳?댄꽣 */
.mobile-carousel-dots {
    display: none; /* PC?먯꽌???④? */
}
/* ?怨몃열 3: ?됰슢?????뽮텢 ?怨몃열 */
.brand-story-area {
    background-color: #f8f9fb;
    padding: 6rem 0 8rem;
}
.story-inner {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
    text-align: center;
}
.story-title {
    font-size: 28px;
    font-weight: 700;
    color: #001F3F; /* navy */
    margin-bottom: 30px;
}
.story-proposition {
    font-size: 20px;
    color: #333333;
    margin-bottom: 50px;
    word-break: keep-all;
}
.story-list {
    text-align: left;
    list-style: none;
    padding: 0;
    margin: 0;
}
.story-list li {
    font-size: 16px;
    color: #4b5563; /* ??쎄쾿 域밸챶???*/
    line-height: 1.9;
    margin-bottom: 20px;
    background: #ffffff;
    padding: 25px 35px;
    border-radius: 12px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.03);
    word-break: keep-all;
}
.story-list strong {
    color: #001F3F;
    font-size: 17px;
}
.story-divider {
    color: #cbd5e1;
    margin: 0 10px;
    font-weight: 300;
}
/* ==================================
   NEW ABOUT SECTION: BACKGROUND VIDEO & TYPOGRAPHY
================================== */
.dark-stat-banner {
    background-color: transparent !important; /* 獄쏄퀗瑗???쑬逾??? ?袁る퉸 疫꿸퀣????깃맒 ??볤탢 */
    padding: 7rem 0;
    color: #ffffff;
    text-align: center;
}
.about-bg-video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    transform: translateX(-50%) translateY(-50%);
    -o-object-fit: cover;
       object-fit: cover;
    z-index: 1; /* 筌왖??뽮텢?? z-index 1 */
}
.about-video-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: radial-gradient(circle at center, rgba(0, 15, 35, 0.88) 0%, rgba(0, 15, 35, 0.4) 100%);
    z-index: 2; /* ??살쒔??됱뵠????쑬逾????*/
}
.dark-stat-banner .banner-title {
    font-size: 46px !important;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 20px !important;
    line-height: 1.3;
}
.banner-coach-line {
    font-size: 19px;
    color: #D4AF37; /* ?ⓥ뫀諭???*/
    font-weight: 600;
    margin-bottom: 30px;
    letter-spacing: 0.5px;
}
.dark-stat-banner .banner-desc {
    font-size: 17px !important;
    color: rgba(255, 255, 255, 0.85) !important;
    line-height: 1.8 !important;
    margin-bottom: 60px !important;
    font-weight: 300;
}
.dark-stat-banner .stat-box {
    background: rgba(0, 20, 40, 0.5) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
}
/* ??쑬逾????살쒔??됱뵠 揶쎛??녾쉐 域밸갭???*/
.about-video-overlay {
    background: radial-gradient(circle at center, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.7) 100%) !important;
}
/* ??????燁삳?諭???됱뵠?袁⑹뜍 */
.about-integrated-cards {
    margin: 50px auto 50px auto;
}
.about-integrated-cards .v-card {
    height: 320px; /* ??쑬逾???袁⑸퓠????댭???? ??꾩쓺 ??곸? 鈺곌퀣??*/
    align-items: center; /* ?類ㅼ㉦???類ｌ졊 */
    justify-content: center;
    text-align: center;
    border: 1px solid rgba(255,255,255,0.1);
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}
.about-integrated-cards .v-card-overlay {
    background: rgba(0, 0, 0, 0.6) !important; /* 燁삳?諭????????곸? ??紐쇔칰??類ｋ즷 */
}
.about-integrated-cards .v-card-content {
    padding: 20px;
}
.about-integrated-cards .v-card-title {
    font-size: 20px;
    margin-bottom: 10px;
    text-shadow: 0 2px 4px rgba(0,0,0,0.5);
}
.about-integrated-cards .v-card-caption {
    font-size: 14px;
    text-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
.dark-stat-banner .banner-desc {
    margin-top: 20px;
}
/* 1. 獄쏄퀗瑗??怨멸맒 ?ル슣??域밸갭???筌△몿??(Linear Gradient) */
.about-video-overlay {
    background: linear-gradient(to right, #000000 0%, rgba(0,0,0,0.93) 25%, rgba(0,0,0,0.96) 50%, rgba(0,0,0,0.93) 75%, #000000 100%) !important;
}
/* 2. ??쑴竊??燁삳?諭???而???? 獄?獄쏅벡???袁⑹읈 ??볤탢 */
.about-integrated-cards .v-card {
    height: auto !important; /* ?誘れ뵠 ??쀫립 ??곸젫 */
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 20px 10px;
}
.about-integrated-cards .v-card-content {
    padding: 0 !important;
}
.about-integrated-cards .v-card-title {
    font-size: 24px !important;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 15px !important;
    text-shadow: none !important; /* ??梨?獄쏄퀗瑗???嚥????袁⑹뒭 筌ㅼ뮇???*/
}
.about-integrated-cards .v-card-caption {
    font-size: 16px !important;
    color: rgba(255, 255, 255, 0.85) !important;
    text-shadow: none !important;
    line-height: 1.6;
}
/* ==================================
   EXTRA DARK OVERLAY & RIGHT SIDE DARKENING
================================== */
.about-video-overlay {
    background: linear-gradient(to right, #000000 0%, rgba(0,0,0,0.85) 25%, rgba(0,0,0,0.65) 45%, rgba(0,0,0,0.6) 55%, rgba(0,0,0,0.8) 75%, rgba(0,0,0,0.95) 90%, #000000 100%) !important;
}
/* ==================================
   HIGhend GLASSMORPHISM PILLARS
================================== */
.glass-pillars-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.5rem;
}
.glass-pillar {
    background: rgba(0, 31, 63, 0.4); /* Deep Navy 甕곗쥙???*/
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: 520px;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.4);
    transition: transform 0.5s ease, border-color 0.5s ease, box-shadow 0.5s ease;
}
.glass-pillar:hover {
    transform: translateY(-15px);
    border-color: #50C878; /* Emerald Green ?????*/
    box-shadow: 0 40px 80px rgba(0, 0, 0, 0.6);
}
.pillar-img {
    height: 260px;
    background-size: cover;
    background-position: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    transition: transform 0.8s ease;
}
.glass-pillar:hover .pillar-img {
    transform: scale(1.05);
}
.pillar-content {
    padding: 40px 30px;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 100%);
    position: relative;
    z-index: 2; /* scale ??揶쎛???筌왖 ??낅즲嚥?*/
}
.pillar-title {
    font-size: 28px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 20px;
    line-height: 1.4;
    word-break: keep-all;
    display: flex;
    align-items: flex-start;
}
.pillar-title span {
    color: #50C878; /* Emerald Green */
    margin-right: 10px;
    font-size: 32px;
}
.pillar-copy {
    font-size: 22px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.6;
    word-break: keep-all;
}
/* ==================================
   RESTORED VISUAL CARDS AREA
================================== */
.visual-cards-area {
    background-color: #ffffff;
    padding: 6rem 0;
    scroll-margin-top: 120px;
}
/* ==================================
   EXTRA DARK OVERLAY & RIGHT SIDE DARKENING
================================== */
.about-video-overlay {
    background: linear-gradient(to right, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 25%, rgba(0,0,0,0.6) 50%, rgba(0,0,0,0.85) 75%, rgba(0,0,0,0.95) 100%) !important;
}
/* ==================================
   EXTRA DARK OVERLAY & RIGHT SIDE DARKENING
================================== */
.about-video-overlay {
    background: linear-gradient(to right, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.8) 35%, rgba(0,0,0,0.8) 75%, rgba(0,0,0,0.4) 100%) !important;
}
/* ==================================
   EXTRA DARK OVERLAY & RIGHT SIDE DARKENING
================================== */
.about-video-overlay {
    background: linear-gradient(to right, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 25%, rgba(0,0,0,0.6) 50%, rgba(0,0,0,0.85) 75%, rgba(0,0,0,0.95) 100%) !important;
}
/* ==================================
   EXTRA DARK OVERLAY & RIGHT SIDE DARKENING
================================== */
.about-video-overlay {
    background: linear-gradient(to right, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 25%, rgba(0,0,0,0.6) 50%, rgba(0,0,0,0.4) 75%, rgba(0,0,0,0.3) 100%) !important;
}
/* ==================================
   EXTRA DARK OVERLAY & RIGHT SIDE DARKENING
================================== */
.about-video-overlay {
    background: linear-gradient(to right, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 25%, rgba(0,0,0,0.6) 50%, rgba(0,0,0,0.4) 75%, rgba(0,0,0,0.4) 90%, rgba(0,0,0,0.95) 100%) !important;
}
/* ==================================
   EXTRA DARK OVERLAY & RIGHT SIDE DARKENING
================================== */
.about-video-overlay {
    background: linear-gradient(to right, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 25%, rgba(0,0,0,0.6) 50%, rgba(0,0,0,0.8) 70%, rgba(0,0,0,0.95) 85%, #000000 100%) !important;
}
/* ==================================
   EXTRA DARK OVERLAY & RIGHT SIDE DARKENING
================================== */
.about-video-overlay {
    background: linear-gradient(to right, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 25%, rgba(0,0,0,0.6) 50%, rgba(0,0,0,0.4) 75%, rgba(0,0,0,0.4) 85%, #000000 100%) !important;
}
/* ==================================
   EXTRA DARK OVERLAY & RIGHT SIDE DARKENING
================================== */
.about-video-overlay {
    background: linear-gradient(to right, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 25%, rgba(0,0,0,0.6) 50%, rgba(0,0,0,0.15) 75%, rgba(0,0,0,0.15) 80%, #000000 90%, #000000 100%) !important;
}
\n
/* ==================================
   USER REQUESTED ENHANCEMENTS (2x Sizes, 2 Columns, Twinkle Stars, Card Backgrounds)
================================== */
.bright-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 40px !important;
}
.b-title { font-size: 42px !important; font-weight: 700 !important; margin-bottom: 15px !important; }
.b-title-ko { font-size: 24px !important; font-weight: 500 !important; color: #94a3b8 !important; }
.b-highlight { font-size: 26px !important; margin-top: 30px !important; margin-bottom: 15px !important; }
.b-desc { font-size: 20px !important; line-height: 1.8 !important; margin-bottom: 15px !important; }
.b-icon { 
    font-size: 45px !important; 
    width: 80px !important; 
    height: 80px !important; 
    margin-bottom: 35px !important; 
}
/* Increase card padding to accommodate larger text */
.bright-card {
    position: relative;
    overflow: hidden;
    padding: 60px 50px !important;
    background-color: #1a233a !important; /* Base dark color for card */
    border-radius: 20px !important; /* Slightly more rounded for larger cards */
}
/* Twinkling star background for cards */
.bright-card::before {
    content: "";
    position: absolute;
    top: -50%; left: -50%; width: 200%; height: 200%;
    background-image: 
        radial-gradient(1.5px 1.5px at 20px 30px, #ffffff, rgba(0,0,0,0)),
        radial-gradient(1.5px 1.5px at 40px 70px, #ffffff, rgba(0,0,0,0)),
        radial-gradient(1px 1px at 90px 40px, #ffffff, rgba(0,0,0,0)),
        radial-gradient(2px 2px at 160px 120px, #ffffff, rgba(0,0,0,0)),
        radial-gradient(2.5px 2.5px at 200px 180px, #ffffff, rgba(0,0,0,0));
    background-size: 250px 250px;
    animation: twinkle-stars 8s linear infinite;
    opacity: 0.25;
    z-index: 0;
}
@keyframes twinkle-stars {
    0% { transform: translateY(0); opacity: 0.1; }
    50% { opacity: 0.5; }
    100% { transform: translateY(-125px); opacity: 0.1; }
}
.b-icon, .b-content {
    position: relative;
    z-index: 1;
}
/* Background for Compare & Roadmap to improve readability and premium feel */
.bright-compare, .bright-roadmap {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 24px !important;
    padding: 70px 60px !important;
    margin-top: 80px !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2) !important;
    backdrop-filter: blur(15px);
}
.compare-title, .roadmap-title {
    font-size: 40px !important;
    margin-bottom: 60px !important;
}
/* Mobile adjustments */
/* ==================================
   USER REQUESTED ENHANCEMENTS (Cobalt Blue Gradient, Block KO Title)
================================== */
.b-title-ko {
    display: block !important;
    margin-left: 0 !important;
    margin-top: 15px !important;
    font-size: 24px !important;
    color: #94a3b8 !important;
}
.bright-card {
    /* Cobalt Blue Transparent Gradient */
    background: linear-gradient(135deg, rgba(0, 71, 171, 0.8) 0%, rgba(0, 20, 60, 0.1) 100%) !important;
    backdrop-filter: blur(15px) !important;
    border: 1px solid rgba(0, 100, 255, 0.15) !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3) !important;
}
/* ==================================
   USER REQUESTED ENHANCEMENTS (CORE VALUE 20x, Dark Gray Title, Darkening Cobalt Cards, Yellow Highlight, Adjusted Card Sizes, Dark Cobalt Bottom Cards)
================================== */
/* 1. CORE VALUE 20獄??類? */
/* 疫꿸퀣??12px~14px 疫꿸퀣? 20獄쏄퀡????240px~280px. ?遺우쁽?紐꾩뱽 ??곹뒄筌왖 ??꾩쓺 椰꾧퀡???獄쏄퀗瑗???용뮞???類κ묶嚥??諭곸넅 */
.bright-badge {
    font-size: 150px !important; 
    line-height: 1 !important;
    display: block !important;
    text-align: center;
    color: rgba(255, 255, 255, 0.03) !important; /* 椰꾧퀡?????곌숲筌띾뜇寃??癒?덱 */
    letter-spacing: 5px !important;
    margin-bottom: -40px !important; /* ?袁⑥삋 ???????野껊??귛칰?獄쏄퀣??*/
    font-weight: 900 !important;
}
/* 2. 筌롫뗄??????? 獄???뺥닏 ????? 筌욊쑵釉????퉳 */
.bright-main-title {
    color: #6b7280 !important; /* 筌욊쑵釉????퉳 (揶쎛??녾쉐???袁る퉸 ?袁⑹읈 ??紐쇽쭪?????꾩쓺) */
    position: relative;
    z-index: 2;
}
.bright-sub-title {
    color: #4b5563 !important; /* 鈺곌퀗????筌욊쑵釉????퉳 */
    position: relative;
    z-index: 2;
}
/* 3. 燁삳?諭??紐껋쨮 ??由?40% ?곕벡?? 揶쎛嚥???由?10% ?類ㅼ삢 */
.bright-inner {
    max-width: 1400px !important; /* 揶쎛嚥≪뮉猷???蹂? 燁삳?諭뜹첎? 揶쎛嚥≪뮆以??뚣끉??袁⑥쨯 ?醫딅즲 */
    margin: 0 auto;
}
.bright-grid {
    gap: 20px !important; /* 揶쏄쑨爰??餓κ쑴肉?燁삳?諭??揶쎛嚥????곕떽? ?類ｋ궖 */
}
.bright-card {
    padding: 30px 40px !important; /* ?紐껋쨮 ??ㅻ뎃 ?????곕벡??(?癒?삋 60px -> 30px) */
    border-radius: 16px !important;
}
/* 燁삳?諭???? ?遺용꺖??쇱벥 ?怨밸릭 ??媛???곕벡???뤿연 ?紐껋쨮 疫뀀챷?좂몴?餓κ쑴??*/
.b-icon {
    margin-bottom: 15px !important; /* ?癒?삋 35px -> 15px */
    width: 60px !important;
    height: 60px !important;
    font-size: 35px !important;
}
.b-title {
    margin-bottom: 5px !important;
    font-size: 36px !important; /* ?誘れ뵠??餓κ쑴?졿묾??袁る퉸 ?怨좊뱜 ???좑쭩???곸? 鈺곌퀣??*/
}
.b-title-ko {
    margin-top: 5px !important;
    margin-bottom: 15px !important;
}
.b-highlight {
    margin-top: 15px !important; /* ?癒?삋 30px -> 15px */
    margin-bottom: 10px !important;
}
.b-desc {
    margin-bottom: 5px !important;
    line-height: 1.5 !important;
}
/* 4. ?袁⑥삋 燁삳?諭뜻에?揶쏅뜆?붹에?獄쏄퀗瑗?筌욊쑵釉?칰?(?꾨뗀而???됰뗀竊?甕곗쥙??? */
.bright-card:nth-child(1) { background: linear-gradient(135deg, rgba(0, 71, 171, 0.8), rgba(0, 20, 60, 0.1)) !important; }
.bright-card:nth-child(2) { background: linear-gradient(135deg, rgba(0, 60, 150, 0.85), rgba(0, 20, 60, 0.2)) !important; }
.bright-card:nth-child(3) { background: linear-gradient(135deg, rgba(0, 50, 130, 0.9), rgba(0, 20, 60, 0.4)) !important; }
.bright-card:nth-child(4) { background: linear-gradient(135deg, rgba(0, 40, 110, 0.95), rgba(0, 20, 60, 0.6)) !important; }
.bright-card:nth-child(5) { background: linear-gradient(135deg, rgba(0, 30, 90, 1), rgba(0, 20, 60, 0.8)) !important; }
.bright-card:nth-child(6) { background: linear-gradient(135deg, rgba(0, 20, 70, 1), rgba(0, 20, 60, 1)) !important; }
/* 5. 燁삳?諭???疫꼲?癒?뮉 獄쏄퉮源? ?λ뜄以????륁뵠??깆뵠?紐껊뮉 獄쏆빘? ?紐껋삂 */
.bright-card .b-title,
.bright-card .b-title-ko,
.bright-card .b-desc {
    color: #ffffff !important;
}
.bright-card .b-highlight {
    color: #ffdd00 !important; /* 獄쏆빘? ?紐껋삂 (?ⓥ뫀諭??癒?쨮?? */
}
.bright-card .b-icon {
    color: #ffffff !important; /* ?袁⑹뵠????깃맒???怨쀪퉳??곗쨮 ???뵬??????됱벉. ?癒곕립??삠늺 ?紐껋삂??곗쨮: color: #ffdd00 !important; */
}
/* 6. 嚥≪뮆諭띰쭕?燁삳?諭?獄쏄퀗瑗?筌욊쑵釉??꾨뗀而?紐껎닜??域밸챶??怨쀬뵠??*/
.bright-roadmap {
    background: linear-gradient(135deg, #002255 0%, #000a1a 100%) !important; /* 筌욊쑵釉??꾨뗀而???됰뗀竊?域밸챶??怨쀬뵠??*/
    border: 1px solid rgba(0, 100, 255, 0.2) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4) !important;
}
/* ?곕떽?: 筌뤴뫀而??筌ㅼ뮇???(CORE VALUE ??由? */
/* ==================================
   USER REQUESTED ENHANCEMENTS (Roadmap on Top, 2x Text Sizes)
================================== */
/* 嚥≪뮆諭띰쭕??????: 筌욊쑵釉??袁⑹읈?? ?怨쀪퉳 */
.roadmap-title {
    color: #ffffff !important;
    font-weight: 800 !important;
    font-size: 38px !important;
    margin-bottom: 50px !important;
}
/* 嚥≪뮆諭띰쭕?筌띾뜆彛? ?癒?삋 ??롫뼊????덈쐲 野껉퍔???怨룸뼊??곗쨮 ??議???嚥?筌띾뜆彛??????*/
.bright-roadmap {
    margin-bottom: 80px !important; /* ?袁⑥삋 The BRIGHT Journey ??????⑥눘??揶쏄쑨爰?*/
    margin-top: 20px !important;
}
/* ?怨론???곕솁甕?B,R,I,G,H,T) ?袁⑹뵠????由?2獄??類? */
.roadmap-step .step-icon {
    font-size: 40px !important;
    width: 80px !important;  
    height: 80px !important;
    line-height: 80px !important;
    border-width: 4px !important;
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.4) !important;
    background-color: rgba(255, 255, 255, 0.05) !important;
}
/* ??곕솁甕??袁⑥삋 疫꼲?癒?굶 ??由?2獄??類? */
.roadmap-step .step-label {
    font-size: 32px !important; 
    font-weight: 700 !important;
    color: #ffffff !important;
    margin-top: 20px !important;
    white-space: nowrap;
}
/* ?怨뚭퍙 ?醫됰궢 ????由?獄??袁⑺뒄 鈺곌퀣??(?뚣끉彛??袁⑹뵠?꾩꼷肉?筌띿쉸?? */
.roadmap-step .dot {
    width: 20px !important;
    height: 20px !important;
    background-color: #ffdd00 !important; /* ?癒? ??????뚎됱쑎 ?醫? */
}
.roadmap-line {
    height: 4px !important;
    top: 40px !important; /* ?뚣끉彛??袁⑹뵠?꾩꼷????덉뺘 ?誘れ뵠嚥??袁⑺뒄 */
    background-color: rgba(255, 255, 255, 0.2) !important;
}
/* 筌뤴뫀而???곕떽? 筌ㅼ뮇???*/
/* ==================================
   USER REQUESTED ENHANCEMENTS (Core Value Badge)
================================== */
.core-value-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #ffffff;
    color: #1e3a8a; /* 筌욊쑵釉??꾨뗀而???됰뗀竊???용뮞??*/
    font-size: 26px;
    font-weight: 900;
    padding: 15px 50px;
    border-radius: 50px; /* ?臾먭국???觀??筌╈돦?????녿젃??? */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    text-transform: uppercase;
    letter-spacing: 2px;
}
/* Subtitle bold styling */
.bright-sub-title {
    font-weight: 900 !important;
    font-size: 26px !important;
    color: #1e40af !important; /* 筌욊쑵釉??꾨뗀而???됰뗀竊?*/
    letter-spacing: 1px !important;
    /* ??紐??獄쏄퀗瑗?????揶쎛??녾쉐???袁る퉸 ???????遺우뵠????쇱궔 域밸챶????곕떽? (??????遺욧퍕?? ?袁⑤빍筌왖筌?揶쎛??녾쉐 癰귣똻?? */
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.4) !important;
}
/* ==================================
   USER REQUESTED ENHANCEMENTS (Compare Section 2x Size)
================================== */
.compare-card p {
    font-size: 28px !important; /* 疫꿸퀣??15px~17px ??????2獄??類? */
    line-height: 1.6 !important;
    font-weight: 700 !important;
    margin: 0 !important;
}
.compare-card {
    min-height: 140px !important; /* ?뚣끉彛??怨좊뱜????곸뱽 ????덈즲嚥?獄쏅벡??筌ㅼ뮇???誘れ뵠 ?怨밸샨 */
    padding: 35px 40px !important; /* 獄쏅벡????? ??媛??類? */
    border-radius: 16px !important; /* 獄쏅벡?ゅ첎? ?뚣끉彛?筌띾슦寃?筌뤴뫁苑뚨뵳??ⓦ볦ぇ????곸? 鈺곌퀣??*/
}
/* ?遺욧땀????由????용뮞???類?????쑬???뤿연 鈺곌퀣??*/
.compare-arrow {
    width: 60px !important;
    height: 60px !important;
}
.arrow-icon {
    font-size: 30px !important;
}
/* ==================================
   USER REQUESTED ENHANCEMENTS (Compare Section No-Wrap)
================================== */
/* 癰궰?遺우벥 ??쇨퍥 ?뚢뫂???瑗ョ몴?揶쎛嚥≪뮆以??????類ㅼ삢??뤿연 餓κ쑬而?퐛?獄쎻뫗? */
.compare-visual-wrap {
    max-width: 1400px !important; /* 疫꿸퀣??900px?癒?퐣 ?????類ㅼ삢 */
    width: 100%;
}
.compare-card {
    flex: 1 1 auto !important; /* 燁삳?諭뜹첎? ??ㅻ뮉 ?⑤벀而???겸뫖???筌△뫁???롫즲嚥???됱뒠 */
}
.compare-card p {
    white-space: nowrap !important; /* 揶쏅벡??餓κ쑬而?퐛?獄쎻뫗? */
    /* 筌띾슣鍮??뚢뫂???瑗ヨ퉪???疫꼲?癒? ??댭?疫뀀챶????곸? 餓κ쑴?졾쳞怨뺢돌 ??륂뒄野??醫? 野껉퀣?? 癰귣똾??1400px????28px ??餓??겸뫖???*/
}
/* 筌뤴뫀而??깅퓠??뺣뮉 nowrap??????곴퐣 ?遺얇늺 獄쏅떽臾??곗쨮 ?????野껉퍔??獄쎻뫗? */
/* ==================================
   USER REQUESTED ENHANCEMENTS (Tidy & Compact Compare Section)
================================== */
.compare-row {
    display: flex;
    align-items: stretch; /* ?誘れ뵠????덉뵬??띿쓺 筌띿쉸??*/
    justify-content: center;
    gap: 20px !important; /* 燁삳?諭?揶쏄쑨爰???깆젟??띿쓺 ?醫? */
    margin-bottom: 15px !important; /* ???퍢 揶쏄쑨爰??곕벡??*/
}
.compare-card {
    flex: 1 !important; /* ?ル슣??燁삳?諭????덊돩???類μ넇??50:50??곗쨮 揶쏅벡?????뵬 */
    min-height: 80px !important; /* ?⑥눖猷??띿쓺 ?뚮챶???紐껋쨮 ?誘れ뵠 ?곕벡??*/
    padding: 20px 30px !important; /* ??? ??媛??곕벡??*/
    display: flex;
    align-items: center;
    justify-content: center; /* ??용뮞?紐? 餓λ쵐釉??類ｌ졊??뤿연 ??볦퍟????됱젟揶??봔??*/
    text-align: center !important;
}
/* ?遺욧땀???袁⑺뒄 ?⑥쥙??獄???由??곕벡??*/
.compare-arrow {
    width: 50px !important;
    height: auto !important; /* stretch??筌띿쉸??揶쎛?????類ｌ졊??롫즲嚥?鈺곌퀣??*/
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.arrow-icon {
    font-size: 26px !important;
}
/* ??용뮞????由??醫???롫┷ ??댭?????獄쏅벡?ゅ첎? ??쑬????沃샕嚥???곸?筌?鈺곌퀣??*/
.compare-card p {
    font-size: 24px !important; /* 28px?? 獄쏅벡?ょ몴???댭???쇱뒭野????嚥?24px嚥?????(???????깆춦?? */
    white-space: nowrap !important;
    margin: 0 !important;
}
/* ==================================
   USER REQUESTED ENHANCEMENTS (Sophisticated Custom Arrow)
================================== */
/* ?遺욧땀???뚢뫂???瑗??癒?퍥????롪돌???대벀??疫???Line)??곗쨮 癰궰??*/
.compare-arrow {
    align-self: center !important; /* ?봔筌뤴뫁??stretch(?誘れ뵠 ??뤿선?? ??욧쉐 ?얜똻???랁??紐껋쨮 ?類ㅼ㉦???⑥쥙??*/
    width: 120px !important; /* ?遺욧땀??疫뀀챷?좂몴???苡??怨쀬삢 -> ?癒?염??살쓦野??臾믡걹 獄쏅벡??揶쎛嚥???由??곕벡???*/
    height: 5px !important; /* ???대벀由곁몴?2獄???곴맒 ?癒?뜓野?(5px) */
    background-color: #00d282 !important; /* ?됰슢???域밸챶???뚎됱쑎 ?怨몄뒠 */
    border: none !important; /* 疫꿸퀣????녿젃??? ???あ??????*/
    border-radius: 0 !important; /* ?觀??獄쏄퀗瑗?????*/
    margin: 0 15px !important; /* 獄쏅벡??? ?遺욧땀????????媛?*/
    position: relative; /* ?遺욧땀??疫꿸퀣???*/
}
/* 疫꿸퀣?????용뮞????嚥???쇰선??덈쐲 疫꿸퀬?????? 筌ｌ꼶??*/
.arrow-icon {
    display: none !important; 
}
/* CSS????뽰뒠??뤿연 ?遺욧땀????Head)???紐껋졃??띿쓺 筌욊낯???遺우쁽??*/
.compare-arrow::after {
    content: '';
    position: absolute;
    right: -1px; /* ?遺욧땀???袁⑺뒄????밸퓠 筌띿쉸??*/
    top: 50%;
    transform: translateY(-50%);
    border-left: 20px solid #00d282; /* ?遺욧땀?λ맩??疫뀀챷?좂몴?疫뀀㈇????쎈늄??띿쓺 */
    border-top: 12px solid transparent; /* ?袁⑸툡????梨??띿쓺 繹먮‘釉????⑥퍟????밴쉐 */
    border-bottom: 12px solid transparent;
}
/* 筌뤴뫀而???遺얇늺 筌ㅼ뮇???(?遺욧땀??? ?袁⑥삋???館釉?袁⑥쨯 ??륁춦??곗쨮 癰궰?? */
/* ==================================
   About Hero Manifesto (Stacked Layout)
================================== */
.about-hero-manifesto {
    background-color: #FFFFFF;
    padding: 100px;
    max-width: 1400px;
    margin: 0 auto;
}
.manifesto-header {
    margin-bottom: 50px;
}
.manifesto-content-split {
    display: flex;
    align-items: center; /* Vertically center content, allowing natural image aspect ratios */
}
.manifesto-content-split.reverse {
    flex-direction: row-reverse;
}
.manifesto-content-split.reverse .manifesto-left {
    padding-right: 0;
    padding-left: 60px;
}
.manifesto-left {
    width: 65%;
    padding-right: 60px;
    text-align: left;
}
.manifesto-label, .context-label {
    font-family: 'Cormorant Garamond', 'Georgia', serif;
    font-style: italic;
    font-size: 26pt; /* ~30% reduced from 38pt */
    font-weight: 700; /* Bold */
    letter-spacing: -1px; /* Tighter letter spacing */
    margin-bottom: 24px;
    text-transform: uppercase;
    text-align: left;
    display: inline-block;
    position: relative;
    padding-left: 32px; /* Space for the left-attached bar */
}
.sub-topic-label {
    font-family: 'Cormorant Garamond', 'Georgia', serif;
    font-style: italic;
    font-size: 18pt;
    font-weight: 800; /* Thicker weight as requested */
    color: #FFFFFF; /* White for perfect readability against dark blue */
    letter-spacing: 1px;
    margin-bottom: 24px;
    display: inline-block;
    padding: 8px 30px;
    background: linear-gradient(135deg, #002266 0%, #0047AB 100%); /* Vivid Cobalt Blue Gradient */
    border-radius: 50px; /* Pill-shaped box */
    box-shadow: 0 6px 20px rgba(0, 71, 171, 0.2); /* Elegant blue glow */
}
.reverse-header {
    text-align: right;
}
.reverse-header .manifesto-label, .reverse-header .context-label {
    text-align: right;
    padding-left: 0;
    padding-right: 32px; /* Space for the right-attached bar */
}
.gradient-title {
    background: linear-gradient(135deg, #002266 0%, #3388FF 40%, #0047AB 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(1px 2px 3px rgba(0, 0, 0, 0.15)); /* 3D effect */
}
.manifesto-label::before, .context-label::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 12px; /* Thicker bar */
    height: 50px;
    background-color: #0047AB; /* Vivid Cobalt Blue */
}
.reverse-header .manifesto-label::before, .reverse-header .context-label::before {
    left: auto;
    right: 0;
}
.manifesto-divider {
    height: 1px;
    background-color: #E2E8F0;
    width: 100%;
    margin: 32px 0;
    border: none;
}
.manifesto-kr, .context-kr {
    font-size: 18pt; /* Slightly larger than 15pt English */
    color: #071E3D;
    font-weight: 700;
    line-height: 1.45;
    margin-bottom: 24px;
    word-break: keep-all;
    text-align: left;
}
.manifesto-en, .context-en {
    font-size: 15pt;
    color: #475569;
    font-style: italic;
    line-height: 1.6;
    margin-bottom: 0;
    text-align: left;
}
.manifesto-body, .context-body {
    font-size: 14pt;
    color: #334155;
    line-height: 1.8;
    word-break: keep-all;
    text-align: left;
}
.manifesto-indicator {
    display: inline-block;
    background-color: #FFFFFF;
    padding: 14px 32px;
    border-radius: 50px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    font-size: 13pt;
    color: #071E3D;
    font-weight: 600;
    margin-top: 0;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
}
.manifesto-indicator:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
    color: #0047AB; /* Vivid Cobalt Blue on hover */
}
.manifesto-right {
    width: 35%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.manifesto-img {
    width: 100%;
    aspect-ratio: 16 / 11; /* Force identical size for all images (landscape) */
    -o-object-fit: cover;
       object-fit: cover; /* Gracefully crop any outlier like G image */
    border-radius: 24px;
    display: block;
}
.hero-img {
    height: 480px !important; /* Force identical vertical size for top two sections */
    -o-object-fit: cover;
       object-fit: cover;
}
/* ==================================
   Premium Compare Section (BRIGHT Journey)
================================== */
.premium-compare-wrap {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.premium-compare-row {
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 30px;
}
.premium-before-card, .premium-after-card {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px 40px;
    border-radius: 16px;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.premium-before-card:hover, .premium-after-card:hover {
    transform: translateY(-5px);
}
.premium-before-card {
    background-color: #F8FAFC; /* Extremely soft premium gray */
    border: 1px solid #E2E8F0;
    color: #64748B; /* Muted Oxford Blue */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02); /* Very subtle float */
}
.premium-before-card p {
    font-size: 20px;
    font-weight: 500;
    margin: 0;
}
.premium-after-card {
    background: linear-gradient(135deg, #002266 0%, #0047AB 100%);
    border: none;
    color: #FFFFFF;
    box-shadow: 0 10px 30px rgba(0, 71, 171, 0.15);
}
.premium-after-card p {
    font-size: 22px;
    font-weight: 700;
    margin: 0;
}
.premium-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    color: #0047AB;
    font-family: 'Playfair Display', 'Cormorant Garamond', serif;
    font-style: italic;
    width: 60px;
    flex-shrink: 0;
}
/* --- Navigation Dropdown CSS --- */
.has-dropdown {
    position: relative;
}
.dropdown-menu {
    display: block !important;
    position: absolute;
    top: 100%;
    left: 0;
    transform: translateY(10px);
    background: #ffffff;
    border: 1px solid #eaeaea;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    border-radius: 4px;
    padding: 12px 0;
    min-width: 225px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 100;
    list-style: none;
    margin: 0;
    text-align: left;
}
.has-dropdown:hover .dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.dropdown-menu li {
    display: block;
    margin: 0;
}
.dropdown-menu li a {
    display: block;
    padding: 12px 25px;
    color: #333 !important;
    font-size: 18px;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.2s, color 0.2s;
    font-weight: normal;
}
.dropdown-menu li a:hover {
    background: #f8f9fa;
    color: #00d282 !important;
}
/* Arrow indicator for dropdown parent */
.has-dropdown > a::after {
    content: '';
    display: inline-block;
    margin-left: 6px;
    vertical-align: middle;
    border-top: 4px solid currentColor;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    transition: transform 0.3s;
    opacity: 0.7;
}
.has-dropdown:hover > a::after {
    transform: rotate(180deg);
}
/* ==========================================================================
   SCF (Self-Care Facilitator) Section - Dark Glassmorphism Theme
   ========================================================================== */
.scf-section {
    position: relative;
    background: linear-gradient(135deg, #050f24 0%, #001a4d 50%, #03122f 100%);
    color: #ffffff;
    padding: 100px 0;
    overflow: hidden;
    font-family: 'Malgun Gothic', 'Noto Sans KR', sans-serif;
}
/* Background Glowing Orbs */
.scf-section::before,
.scf-section::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    filter: blur(100px);
    z-index: 0;
    pointer-events: none;
}
.scf-section::before {
    width: 600px;
    height: 600px;
    background: rgba(30, 80, 255, 0.2);
    top: -200px;
    left: -200px;
}
.scf-section::after {
    width: 500px;
    height: 500px;
    background: rgba(0, 162, 255, 0.15);
    bottom: -150px;
    right: -100px;
}
.scf-container {
    position: relative;
    z-index: 1;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
/* Glassmorphism Cards */
.scf-glass-card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 24px;
    padding: 40px 30px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease, border-color 0.3s ease;
}
.scf-glass-card:hover {
    transform: translateY(-10px);
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.05);
}
/* Typographic Elements */
.scf-badge {
    display: inline-block;
    padding: 6px 16px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 30px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    margin-bottom: 20px;
    color: #8bb3ff;
}
.scf-title {
    font-size: 42px;
    font-weight: 800;
    margin-bottom: 20px;
    line-height: 1.3;
    word-break: keep-all;
    background: linear-gradient(to right, #ffffff, #a3c2ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.scf-subtitle {
    font-size: 18px;
    color: #a0aec0;
    font-weight: 400;
    line-height: 1.6;
    margin-bottom: 60px;
    max-width: 800px;
    word-break: keep-all;
}
/* 3 Core Values Grid */
.scf-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 320px));
    justify-content: center;
    gap: 30px;
    margin-bottom: 80px;
}
.scf-card-number {
    font-size: 60px;
    font-weight: 900;
    color: rgba(255, 255, 255, 0.1);
    line-height: 1;
    margin-bottom: 10px;
}
.scf-card-title {
    font-size: 22px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 15px;
    word-break: keep-all;
}
.scf-card-desc {
    font-size: 15.5px;
    color: #cbd5e1;
    line-height: 1.7;
    font-weight: 400;
    word-break: keep-all;
}
/* REACH Timeline / Mechanism */
.scf-reach-container {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 24px;
    padding: 50px;
    margin-bottom: 80px;
    border: 1px solid rgba(255, 255, 255, 0.05);
}
.scf-reach-title {
    text-align: center;
    font-size: 28px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 40px;
    word-break: keep-all;
}
.scf-reach-steps {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.scf-reach-step {
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 16px;
    padding: 20px 30px;
    transition: background 0.3s ease;
}
.scf-reach-step:hover {
    background: rgba(255, 255, 255, 0.08);
}
.scf-reach-letter {
    font-size: 36px;
    font-weight: 900;
    color: #4a90e2;
    width: 60px;
    flex-shrink: 0;
}
.scf-reach-name {
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    width: 180px;
    flex-shrink: 0;
}
.scf-reach-desc {
    font-size: 16px;
    color: #cbd5e1;
    font-weight: 400;
}
/* Curriculum Grid */
.scf-curriculum-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 350px));
    justify-content: center;
    gap: 20px;
}
.scf-curriculum-day {
    background: rgba(0, 34, 102, 0.4);
    border-top: 4px solid #4a90e2;
    padding: 30px;
    border-radius: 0 0 16px 16px;
}
.scf-day-title {
    font-size: 20px;
    font-weight: 800;
    color: #fff;
    margin-bottom: 10px;
}
.scf-day-subtitle {
    font-size: 15px;
    color: #8bb3ff;
    margin-bottom: 20px;
    font-weight: 600;
}
.scf-day-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.scf-day-list li {
    font-size: 14px;
    color: #cbd5e1;
    line-height: 1.6;
    margin-bottom: 10px;
    padding-left: 15px;
    position: relative;
}
.scf-day-list li::before {
    content: '??;
    position: absolute;
    left: 0;
    color: #4a90e2;
}



/* ==========================================================================
   SCF Expanded Elements
   ========================================================================== */

/* Mastery Grid (3 Core Competencies) */
.scf-mastery-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 320px));
    justify-content: center;
    gap: 30px;
    margin-bottom: 40px;
}
.scf-mastery-card {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    overflow: hidden;
}
.scf-mastery-header {
    background: #002266;
    padding: 15px;
    text-align: center;
    font-size: 18px;
    font-weight: 800;
    color: #fff;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.scf-mastery-body {
    padding: 25px;
    font-size: 15px;
    line-height: 1.6;
    color: #cbd5e1;
    text-align: center;
    word-break: keep-all;
}

/* Professional Values */
.scf-values-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 480px));
    justify-content: center;
    gap: 40px;
    margin-bottom: 80px;
}
.scf-value-box {
    background: rgba(4, 21, 56, 0.6);
    border: 1px solid rgba(74, 144, 226, 0.3);
    border-radius: 16px;
    padding: 30px;
}
.scf-value-title {
    font-size: 20px;
    font-weight: 800;
    color: #4a90e2;
    margin-bottom: 15px;
}
.scf-value-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.scf-value-list li {
    font-size: 15px;
    color: #cbd5e1;
    margin-bottom: 8px;
    padding-left: 15px;
    position: relative;
}
.scf-value-list li::before {
    content: '??;
    position: absolute;
    left: 0;
    color: #4a90e2;
}
/* Detailed Curriculum Time Blocks */
.scf-time-block {
    margin-bottom: 25px;
    background: rgba(0, 0, 0, 0.15);
    border-radius: 12px;
    padding: 20px;
}
.scf-time-header {
    font-size: 15px;
    font-weight: 800;
    color: #8bb3ff;
    margin-bottom: 10px;
    border-bottom: 1px solid rgba(139, 179, 255, 0.2);
    padding-bottom: 8px;
}
.scf-time-title {
    font-size: 17px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 15px;
}
/* Course Info Bar */
.scf-course-info {
    background: linear-gradient(90deg, rgba(74,144,226,0.1) 0%, rgba(0,34,102,0.4) 100%);
    border: 1px solid rgba(74, 144, 226, 0.2);
    border-radius: 24px;
    padding: 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 30px;
    margin-bottom: 60px;
}
.scf-info-item {
    flex: 1;
    min-width: 250px;
}
.scf-info-label {
    font-size: 14px;
    color: #8bb3ff;
    font-weight: 600;
    margin-bottom: 5px;
}
.scf-info-value {
    font-size: 18px;
    color: #fff;
    font-weight: 700;
}
/* REACH SYSTEM Hero Section */
.reach-hero-section {
    background-color: #F8FAFC; /* Soft White */
    width: 100%;
    padding: 40px 5%; /* Greatly reduced to minimize gaps */
}
/* Insight Section (Second Cards) Wrapper */
.insight-section-wrap {
    padding: 3rem 0 4rem 0;
}
.reach-hero-container {
    display: grid;
    grid-template-columns: 1fr 1fr; /* Equal 50:50 size */
    gap: 40px; /* Gap between videos */
    width: 100%;
    max-width: 1540px; /* Increased max-width by 10% to make the whole section proportionally larger */
    margin: 0 auto;
    /* Removed forced height to allow aspect-ratio to dictate height proportionally */
}
.reach-hero-left, .reach-hero-right {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 30px; /* Fully rounded elegant corners */
    aspect-ratio: 16 / 9; /* Restore exact video ratio to prevent colored letterboxing */
    cursor: pointer;
    transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), box-shadow 0.3s ease;
}
.reach-hero-left:hover, .reach-hero-right:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}
.reach-hero-left:active, .reach-hero-right:active {
    transform: scale(0.95);
    transition: transform 0.1s ease;
}
.reach-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover; /* Fill perfectly to avoid any colored gaps */
    z-index: 1;
    border-radius: 30px; /* Ensure the video itself has rounded corners */
}
.reach-hero-right .reach-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 44, 95, 0.15); /* 15% Deep Navy filter */
    z-index: 2;
    border-radius: 30px; /* Match video border radius */
}
.reach-hero-right .reach-content {
    position: relative;
    z-index: 3;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 2rem;
}
.reach-top-title {
    font-size: 20px;
    color: #C5A059; /* Accent Gold */
    font-weight: 500;
    letter-spacing: 0.15em;
    margin-bottom: 24px;
}
.reach-main-title {
    font-size: 48px;
    font-weight: 700;
    color: #FFFFFF;
    letter-spacing: 0.1em;
    margin-bottom: 24px;
}
.reach-sub-text {
    font-size: 22px;
    color: #FFFFFF;
    font-family: 'Playfair Display', 'Cormorant Garamond', 'Noto Serif KR', serif; /* Thin Serif */
    font-weight: 300;
    letter-spacing: 0.08em;
    margin: 0;
}
/* ==================================
   REACH SYSTEM: SUB-BLOCKS 2, 3, 4
================================== */
.reach-details-section {
    background-color: #F8FAFC; /* Soft White */
    padding: 120px 5%;
    color: #002C5F; /* Deep Navy Default */
}
.reach-details-inner {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 160px; /* Huge vertical padding between sub-blocks for anti-box feel */
}
/* SUB-BLOCK 2: Diagnosis */
.signal-diagnosis {
    display: grid;
    grid-template-columns: 4.5fr 5.5fr; /* Asymmetric */
    gap: 80px;
    align-items: center;
}
.signal-title {
    font-size: 42px;
    font-weight: 800;
    color: #002C5F;
    line-height: 1.4;
    margin-bottom: 24px;
    word-break: keep-all;
}
.signal-desc {
    font-size: 20px;
    color: #4A5568;
    line-height: 1.7;
    word-break: keep-all;
}
.signal-right {
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.signal-item {
    display: flex;
    gap: 30px;
    align-items: flex-start;
}
.signal-num {
    font-size: 24px;
    font-weight: 700;
    color: #C5A059; /* Accent Gold */
    font-family: 'Montserrat', sans-serif;
    margin-top: 4px;
}
.signal-item-title {
    font-size: 22px;
    font-weight: 700;
    color: #002C5F;
    margin-bottom: 10px;
}
.signal-item-desc {
    font-size: 16px;
    color: #4A5568;
    line-height: 1.6;
}
/* SUB-BLOCK 3: Pathway */
.mechanism-pathway {
    position: relative;
    padding: 60px 0;
}
.pathway-line {
    position: absolute;
    top: 100px; /* Center of the letter */
    left: 0;
    width: 100%;
    height: 1px;
    background-color: rgba(0, 44, 95, 0.15); /* Minimal horizontal line */
    z-index: 1;
}
.pathway-steps {
    display: flex;
    justify-content: space-between;
    position: relative;
    z-index: 2;
    gap: 40px;
}
.pathway-step {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}
.step-letter {
    font-size: 80px;
    font-weight: 300;
    font-family: 'Playfair Display', 'Cormorant Garamond', serif;
    color: #002C5F;
    background-color: #F8FAFC; /* Overlap line to hide it */
    padding: 0 20px;
    margin-bottom: 30px;
    line-height: 1;
}
.step-title {
    font-size: 22px;
    font-weight: 700;
    color: #C5A059;
    margin-bottom: 16px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.step-ko {
    font-size: 16px;
    font-weight: 500;
    color: #002C5F;
}
.step-desc {
    font-size: 15px;
    color: #4A5568;
    line-height: 1.7;
    word-break: keep-all;
}
/* SUB-BLOCK 4: Data Proof */
.data-proof {
    text-align: center;
}
.data-proof-main-title {
    font-size: 32px;
    font-weight: 700;
    color: #002C5F;
    margin-bottom: 80px;
}
.data-proof-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 60px;
}
.data-item {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.data-number {
    font-size: 120px; /* Huge numerical data */
    font-weight: 300;
    font-family: 'Montserrat', sans-serif;
    color: #002C5F;
    line-height: 1;
    margin-bottom: 24px;
    letter-spacing: -2px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.data-unit {
    font-size: 24px;
    font-weight: 500;
    color: #C5A059;
    margin-left: 10px;
    font-family: 'Noto Sans KR', sans-serif;
    letter-spacing: 0;
    margin-bottom: 15px; /* Adjust baseline manually for flex-end */
}
.data-title {
    font-size: 22px;
    font-weight: 700;
    color: #002C5F;
    margin-bottom: 16px;
}
.data-desc {
    font-size: 15px;
    color: #718096; /* Subtle text for official scale */
    line-height: 1.6;
    word-break: keep-all;
}
/* Responsive */
/* =========================================================================
   SCF NEW SECTION & MODAL (Anti-Box, Soft White, Deep Navy, Accent Gold)
   ========================================================================= */
/* Main Section */
.scf-new-section {
    position: relative;
    background: linear-gradient(135deg, #050f24 0%, #001a4d 50%, #03122f 100%);
    color: #ffffff;
    padding: 180px 5% 150px 5%;
    overflow: hidden;
    font-family: 'Malgun Gothic', 'Noto Sans KR', sans-serif;
}
/* Background Glowing Orbs for new section */
.scf-new-section::before,
.scf-new-section::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    filter: blur(100px);
    z-index: 0;
    pointer-events: none;
}
.scf-new-section::before {
    width: 600px;
    height: 600px;
    background: rgba(30, 80, 255, 0.2);
    top: -200px;
    left: -200px;
}
.scf-new-section::after {
    width: 500px;
    height: 500px;
    background: rgba(0, 162, 255, 0.15);
    bottom: -150px;
    right: -100px;
}
.scf-new-inner {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 150px;
}
/* Sub-block 1: Identity */
.scf-identity {
    text-align: center;
    max-width: 900px;
    margin: 0 auto;
}
.scf-badge-new {
    display: inline-block;
    font-size: 16px;
    color: #8bb3ff;
    font-weight: 600;
    letter-spacing: 0.5px;
    margin-bottom: 24px;
}
.scf-main-heading {
    font-size: 36px;
    font-weight: 400;
    color: #ffffff;
    line-height: 1.4;
    margin-bottom: 30px;
    word-break: keep-all;
}
.scf-main-title {
    font-size: 45px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 40px;
    letter-spacing: -0.5px;
}
.scf-main-desc {
    font-size: 19px;
    color: #e2e8f0;
    line-height: 1.8;
    opacity: 1;
    word-break: keep-all;
}
/* Sub-block 2: Core Competency */
.scf-competency {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 320px));
    justify-content: center;
    gap: 40px;
}
.competency-col {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 24px;
    padding: 40px 30px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    text-align: center;
    align-items: center;
    transition: transform 0.3s ease, border-color 0.3s ease;
}
.competency-col:hover {
    transform: translateY(-10px);
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.05);
}
.competency-title {
    font-size: 22px;
    font-weight: 700;
    color: #ffffff;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding-bottom: 20px;
}
.competency-desc {
    font-size: 15px;
    color: #cbd5e1;
    line-height: 1.7;
    opacity: 0.8;
    word-break: keep-all;
}
/* Buttons */
.scf-buttons {
    display: flex;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
    margin-top: -30px;
}
.btn-scf-modal {
    background-color: transparent;
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #ffffff;
    padding: 18px 40px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 40px;
    cursor: pointer;
    transition: all 0.3s ease;
}
.btn-scf-modal:hover {
    background-color: #ffffff;
    color: #002C5F;
    border-color: #ffffff;
}
.btn-scf-contact {
    background-color: #4a90e2;
    color: #fff;
    padding: 18px 40px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 40px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 1px solid #4a90e2;
}
.btn-scf-contact:hover {
    background-color: #357abd;
    border-color: #357abd;
}
/* =========================================================================
   SCF MODAL BODY (Sub-block 3 & 4)
   ========================================================================= */
.scf-new-modal-body {
    display: flex;
    flex-direction: column;
    gap: 100px;
    padding: 60px 40px !important;
}
/* Sub-block 3: Curriculum Timeline */
.scf-curriculum-essence {
    max-width: 800px;
    margin: 0 auto;
    width: 100%;
}
.curriculum-timeline {
    position: relative;
    padding-left: 50px;
    border-left: 1px solid rgba(0, 44, 95, 0.2);
    display: flex;
    flex-direction: column;
    gap: 60px;
}
.timeline-item {
    position: relative;
}
.timeline-item::before {
    content: '';
    position: absolute;
    left: -55px; /* Half of padding plus border */
    top: 0;
    width: 11px;
    height: 11px;
    background-color: #C5A059;
    border-radius: 50%;
}
.timeline-day {
    font-size: 14px;
    font-weight: 700;
    color: #C5A059;
    margin-bottom: 10px;
    letter-spacing: 2px;
}
.timeline-content {
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.timeline-title {
    font-size: 24px;
    font-weight: 700;
    color: #002C5F;
}
.timeline-desc {
    font-size: 16px;
    color: #002C5F;
    line-height: 1.7;
    opacity: 0.8;
    word-break: keep-all;
}
/* Sub-block 4: Professional Value */
.scf-professional-value {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: flex-start;
}
.value-left {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.value-main-msg {
    font-size: 32px;
    font-weight: 700;
    color: #002C5F;
    line-height: 1.4;
    word-break: keep-all;
}
.value-sub-msg {
    font-size: 18px;
    color: #002C5F;
    opacity: 0.8;
    line-height: 1.6;
    word-break: keep-all;
}
.value-right {
    display: flex;
    flex-direction: column;
    gap: 30px;
}
.value-item {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-bottom: 25px;
    border-bottom: 1px solid rgba(0, 44, 95, 0.1);
}
.value-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}
.value-badge {
    font-size: 13px;
    font-weight: 700;
    color: #C5A059;
    letter-spacing: 1px;
}
.value-desc {
    font-size: 16px;
    font-weight: 600;
    color: #002C5F;
    line-height: 1.5;
    word-break: keep-all;
}
/* Responsive */
/* ==========================================
   9. ?紐껋뵬???類ㅼ삢 ?紐낃숲??덈?(?類ㅺ퐣????볥젃??& ?怨쀬뵠??筌앹빖梨?
   ========================================== */
/* ?紐껋뵬???醫딅즲筌?1: ?類ㅺ퐣????볥젃??筌욊쑬??(3????됱뵠?袁⑹뜍) */
.reach-sub-block.signal-diagnosis {
    display: flex;
    flex-direction: row;
    gap: 40px;
    align-items: stretch;
}
.signal-left {
    flex: 1;
    min-width: 250px;
}
.signal-col-center {
    flex: 1.2;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.signal-col-right {
    flex: 1.5;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #F8FAFC;
    border-radius: 12px;
    padding: 40px 30px;
}
.btn-signal-check {
    background: none;
    border: none;
    color: #C9A96E;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    margin-top: 15px;
    padding: 0;
    text-align: left;
    transition: opacity 0.3s ease;
}
.btn-signal-check:hover {
    opacity: 0.8;
}
.signal-item {
    cursor: pointer;
    transition: transform 0.3s ease;
    padding-bottom: 25px;
    border-bottom: 1px solid rgba(0, 44, 95, 0.1);
}
.signal-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}
.signal-item.active {
    transform: translateX(5px);
}
.signal-item.active .btn-signal-check {
    opacity: 0.5;
}
.signal-detail-placeholder {
    display: none;
    font-size: 15px;
    color: #002C5F;
    text-align: center;
    opacity: 0.7;
    font-weight: 500;
    line-height: 1.6;
}
.signal-detail-placeholder.active {
    display: block;
}
.signal-detail-content {
    display: none;
    flex-direction: column;
    align-items: flex-start;
    animation: fadeInRight 0.5s ease forwards;
}
.signal-detail-content.active {
    display: flex;
}
@keyframes fadeInRight {
    from { opacity: 0; transform: translateX(15px); }
    to { opacity: 1; transform: translateX(0); }
}
.detail-title {
    font-size: 20px;
    font-weight: 700;
    color: #002C5F;
    margin-bottom: 25px;
    letter-spacing: -0.5px;
}
.detail-checklist {
    list-style: none;
    padding: 0;
    margin: 0 0 35px 0;
}
.detail-checklist li {
    font-size: 15px;
    color: #002C5F;
    margin-bottom: 15px;
    position: relative;
    padding-left: 20px;
    font-weight: 500;
    line-height: 1.6;
    letter-spacing: -0.3px;
}
.detail-checklist li::before {
    content: '';
    position: absolute;
    left: 0; top: 9px;
    width: 5px; height: 5px;
    background-color: #002C5F;
    border-radius: 50%;
}
.detail-action-btn {
    display: inline-block;
    font-size: 16px;
    color: #C9A96E;
    font-weight: 700;
    text-decoration: none;
    transition: opacity 0.3s ease;
}
.detail-action-btn:hover {
    opacity: 0.8;
}
/* ?紐껋뵬???醫딅즲筌?2: ?怨쀬뵠??筌앹빖梨?(??꾨샍) */
.data-item {
    position: relative;
}
.inline-tooltip-layer {
    position: absolute;
    bottom: 110%; /* ?얜㈇??獄쏅뗀以??袁⑥쨮 ??깅선??살カ */
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    background-color: #F8FAFC; /* Soft White */
    padding: 20px;
    border-radius: 8px;
    width: 320px;
    box-shadow: 0 10px 30px rgba(0, 44, 95, 0.08); /* 沃섎챶?뀐쭖???域밸챶??? ???あ????곸벉 */
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
    z-index: 100;
    pointer-events: none;
}
.inline-tooltip-layer.active {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
    pointer-events: auto;
}
.inline-tooltip-title {
    font-size: 16px;
    color: #002C5F;
    font-weight: 700;
    margin-bottom: 10px;
    letter-spacing: -0.5px;
    text-align: left;
}
.inline-tooltip-desc {
    font-size: 14px;
    color: #002C5F;
    line-height: 1.6;
    font-weight: 500;
    text-align: left;
    word-break: keep-all;
}
/* ==================================
   Premium Deep Blue Button
================================== */
.premium-btn-deepblue {
    display: inline-block;
    background-color: #002C5F; /* Deep Blue */
    color: #ffffff;
    font-size: 18px;
    font-weight: 600;
    text-decoration: none;
    padding: 20px 50px;
    border-radius: 12px;
    letter-spacing: -0.5px;
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.4s ease;
    box-shadow: 0 10px 30px rgba(0, 44, 95, 0.2);
}
.premium-btn-deepblue:hover {
    transform: scale(1.05);
    box-shadow: 0 15px 40px rgba(0, 44, 95, 0.3);
    color: #ffffff;
}
\n
/* ==========================================================================
   SELF-CARE EMOTIONAL HEALING PAGE CSS
   ========================================================================== */

/* Global Settings */
.sc-section {
    padding: 180px 0;
    font-family: 'Pretendard', 'Noto Sans KR', sans-serif;
    line-height: 1.6;
    letter-spacing: -0.02em;
}
.sc-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 40px;
}
.sc-grid {
    display: grid;
    gap: 80px;
    align-items: center;
}
.sc-grid-4-6 {
    grid-template-columns: 4fr 6fr;
}
.sc-grid-5-5 {
    grid-template-columns: 1fr 1fr;
}
.sc-grid-45-55 {
    grid-template-columns: 45fr 55fr;
}
.sc-headline {
    font-size: 42px;
    font-weight: 800;
    line-height: 1.3;
    margin-bottom: 40px;
    word-break: keep-all;
}
.sc-text-white { color: #ffffff; }
.sc-text-navy { color: #0A192F; }
.sc-text-center { text-align: center; }
/* SESSION 1 */
.sc-session1 {
    background-color: #0A192F;
    color: #ffffff;
    padding-top: 180px; /* Account for header */
    padding-bottom: 90px !important;
}
.sc-s1-proof-list {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-top: 60px;
}
.sc-proof-item {
    border-left: 2px solid rgba(255,255,255,0.2);
    padding-left: 20px;
}
.sc-proof-num {
    font-family: 'Montserrat', sans-serif;
    font-size: 36px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 10px;
    letter-spacing: -0.03em;
}
.sc-proof-desc {
    font-size: 16px;
    color: #a0aec0;
    line-height: 1.7;
    word-break: keep-all;
}
.sc-s1-target-list {
    display: flex;
    flex-direction: column;
    gap: 35px;
}
.sc-target-item {
    background: rgba(255,255,255,0.03);
    padding: 30px;
    border-radius: 8px;
}
.sc-target-title {
    font-size: 18px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 12px;
}
.sc-target-desc {
    font-size: 14px;
    color: #cbd5e1; /* Light Gray */
    line-height: 1.8;
    font-weight: 300;
    word-break: keep-all;
}
.sc-s1-graphic {
    margin-top: 60px;
    display: flex;
    justify-content: flex-end;
}
.sc-line-graph {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    height: 60px;
}
.sc-line {
    width: 2px;
    background-color: rgba(255,255,255,0.3);
}
.sc-line-1 { height: 30%; }
.sc-line-2 { height: 60%; }
.sc-line-3 { height: 100%; background-color: #0047AB; }
/* SESSION 2 */
.sc-session2 {
    background-color: #F8FAFC; /* Off-white */
    padding-top: 120px !important;
    padding-bottom: 120px !important;
}
.sc-s2-timeline-wrapper {
    position: relative;
    margin-top: 80px;
    padding-top: 40px;
}
.sc-timeline-line {
    position: absolute;
    top: 40px;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #e2e8f0;
    z-index: 1;
}
.sc-timeline-steps {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
    position: relative;
    z-index: 2;
}
.sc-step-card {
    background: transparent;
    padding: 20px 10px;
    text-align: left;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.sc-step-letter {
    font-family: 'Montserrat', sans-serif;
    font-size: 48px;
    font-weight: 800;
    color: #cbd5e1;
    margin-bottom: 20px;
    transition: color 0.3s ease;
    line-height: 1;
}
.sc-step-title {
    font-size: 18pt; /* 24px */
    font-weight: 700;
    color: #0A192F;
    margin-bottom: 15px;
}
.sc-step-desc {
    font-size: 13pt; /* 17px */
    color: #475569;
    line-height: 1.6;
    word-break: keep-all;
}
.sc-step-card:hover {
    transform: translateY(-4px);
}
.sc-step-card:hover .sc-step-letter {
    color: #0047AB; /* Mcoaching Deep Blue */
}
/* SESSION 3 */
.sc-session3 {
    background-color: #f1f5f9; /* ??깆뵠???????꾨뱜 域밸챶???(筌띲끉????梨???癒?덱??獄쏆빘? 域밸챶??? */
    padding-top: 120px !important;
}
.sc-s3-visual {
    position: relative;
    width: 100%;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 20px 40px rgba(0,0,0,0.08);
}
.sc-s3-visual img {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 4/3;
    -o-object-fit: cover;
       object-fit: cover;
}
.sc-s3-visual-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to right, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
}
.sc-s3-guide-list {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-top: 50px;
}
.sc-guide-item {
    position: relative;
    padding-left: 24px;
}
.sc-guide-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 6px;
    bottom: -6px;
    width: 2px;
    background-color: #0047AB; /* Deep Blue Vertical Line */
}
.sc-guide-title {
    font-size: 18px;
    font-weight: 700;
    color: #0A192F;
    margin-bottom: 10px;
}
.sc-guide-desc {
    font-size: 14pt; /* ~18.6px */
    color: #334155; /* Dark Gray */
    line-height: 1.8;
    word-break: keep-all;
}
/* SESSION 4 */
.sc-session4 {
    background-color: #F8FAFC;
    padding-top: 10% !important;
}
.sc-book-wrapper {
    position: relative;
    padding: 20px;
}
.sc-book-img {
    width: 100%;
    max-width: 450px;
    display: block;
    margin: 0 auto;
    filter: drop-shadow(0 30px 40px rgba(0, 0, 0, 0.15)); /* ??녾퍥?怨몄뵥 ??곹뀤?????袁⑹뒭 */
}
.sc-subtitle {
    font-size: 20px;
    font-weight: 600;
    color: #64748B;
    margin-bottom: 30px;
}
.sc-body-paragraphs {
    font-size: 16px;
    color: #475569;
    line-height: 1.8;
    margin-bottom: 40px;
}
.sc-body-paragraphs p {
    margin-bottom: 15px;
}
.sc-book-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14pt;
    font-weight: 700;
    color: #ffffff;
    background-color: #0047AB; /* Cobalt Blue */
    text-decoration: none;
    padding: 20px 50px;
    margin-top: 20px;
    margin-bottom: 60px;
    border-radius: 50px; /* ?袁⑹읈??獄쏆꼷????觀??筌뤴뫁苑뚨뵳?*/
    box-shadow: 0 10px 30px rgba(0, 71, 171, 0.15);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.sc-book-link:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(10, 25, 47, 0.25);
    background-color: #0A192F; /* Hover ????쎄쾿 ??쇱뵠??쑬以?癰궰??*/
}
.sc-modality-cards {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.sc-modality-card {
    background: #ffffff;
    border: 1px solid rgba(0,0,0,0.04);
    padding: 35px 40px;
    border-radius: 0; /* Boxy editorial feel */
    box-shadow: 0 4px 15px rgba(0,0,0,0.02);
}
.sc-modality-title {
    font-size: 22px;
    font-weight: 700;
    color: #0A192F;
    margin-bottom: 12px;
}
.sc-modality-desc {
    font-size: 18px;
    color: #64748B;
    line-height: 1.6;
}
.sc-cta-wrapper {
    text-align: center;
    margin-top: 100px;
}
.sc-cta-btn {
    display: inline-block;
    background-color: #0047AB;
    color: #ffffff;
    font-size: 18px;
    font-weight: 700;
    text-decoration: none;
    padding: 24px 60px;
    /* 筌욊낯沅쀥첎怨뱀굨 ???あ??獄쏄퀣?? 筌??브쑵釉???륁뵠?遺얜굡 獄쎻뫗??*/
    border-radius: 0;
    box-shadow: 0 15px 30px rgba(0, 71, 171, 0.2);
    transition: all 0.4s ease;
    letter-spacing: 0.02em;
}
.sc-cta-btn:hover {
    background-color: #002266; /* 筌?쑬猷?癰궰??*/
    box-shadow: 0 20px 40px rgba(0, 34, 102, 0.3);
    transform: translateY(-2px);
}
/* Animations */
.fade-in-bottom {
    animation: fadeInBottom 1.5s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
    opacity: 0;
    transform: translateY(20px);
}
@keyframes fadeInBottom {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* Responsive Overrides */
.clean-popup-overlay { display: none; }
.clean-popup-overlay.active { display: flex; }
/* ==================================
   INSIGHT CARDS (Original Design)
================================== */
.home-insight-section {
    padding: 120px 40px;
    background-color: #f8fafc;
}
.home-insight-section .section-inner {
    max-width: 1500px;
    margin: 0 auto;
}
.insight-white-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 50px;
    text-align: left;
}
.insight-white-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
    cursor: pointer;
    transition: all 0.3s ease;
    height: 450px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}
.insight-white-card:hover, .insight-white-card:active {
    border: 1px solid #002C5F; /* Deep Blue Border */
    box-shadow: 0 10px 30px rgba(0, 44, 95, 0.15);
}
.insight-white-card .card-text-area {
    padding: 15px 20px;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.insight-white-card .card-category {
    font-size: 16px;
    color: #475569;
    font-weight: 600;
    margin-bottom: 25px;
    font-family: 'Montserrat', sans-serif;
    letter-spacing: 0.5px;
}
.insight-white-card .card-title-wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 15px;
}
.insight-white-card .card-title {
    font-size: 19px;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: keep-all;
}
.insight-white-card .card-arrow {
    font-size: 28px;
    color: #94a3b8;
    transition: color 0.3s ease;
    margin-top: 5px;
    text-decoration: none;
}
.insight-white-card:hover .card-arrow {
    color: #002C5F;
}
.insight-white-card .card-img-area {
    height: 310px;
    width: 100%;
    overflow: hidden;
}
.insight-white-card .card-img-area img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
       object-fit: contain;
    -o-object-position: top center;
       object-position: top center;
    transition: transform 0.5s ease;
}
.insight-white-card:hover .card-img-area img {
    transform: scale(1.05);
}
/* Hero Text Overrides for Mobile */
.hero-text-container {
    position: relative;
    z-index: 3;
    width: 100%;
    height: 100%;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding-top: 15%;
    padding-left: 8%;
}
.hero-slogan-ko {
    font-size: 58px;
    font-weight: bold;
    display: block;
    margin-bottom: 10px;
    letter-spacing: -1px;
    color: #ffffff;
    text-shadow: 0 4px 15px rgba(0,0,0,0.2);
    word-break: keep-all; /* Prevents awkward character breaks */
}
.hero-slogan-en {
    font-family: 'Playfair Display', 'Cormorant Garamond', serif;
    font-style: italic;
    font-size: 26px;
    color: #ffffff;
    letter-spacing: 0.5px;
    text-shadow: 0 4px 15px rgba(0,0,0,0.2);
}
/* video-insert-section PC 湲곕낯 ?믪씠 */
.video-insert-section {
    height: 80vh;
    min-height: 500px;
}
/* =========================================================================
   SCF Roadmap Section (Home & Facilitation)
   ========================================================================= */
.scf-integrated-section {
    padding: 60px 0; /* Reduced from 120px 0 to minimize gaps */
    background-color: #fff0f5;
    overflow-x: hidden;
}
.scf-roadmap-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
}
.scf-section-header {
    text-align: left;
    margin-bottom: 50px;
}
.scf-section-header .section-title {
    font-size: 21px;
    font-weight: 700;
    color: #002C5F;
    margin-bottom: 10px;
    letter-spacing: 0;
    line-height: 1.2;
}
.scf-section-header h2 {
    font-size: 40px;
    font-weight: 700;
    color: #111;
    margin-top: 0;
    margin-bottom: 20px;
}
.scf-lead-text {
    font-size: 18px;
    color: #555;
    line-height: 1.6;
    word-break: keep-all;
    letter-spacing: -0.5px;
}
.scf-timeline-track {
    display: flex;
    flex-direction: column;
    gap: 30px;
}
.scf-step-card {
    background: #ffffff;
    border-radius: 20px;
    padding: 40px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    display: flex;
    align-items: flex-start;
    gap: 30px;
    border: 1px solid #fbcfe8;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.scf-step-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.08);
}
.step-number-axis {
    font-size: 48px;
    font-weight: 800;
    color: #e2e8f0;
    line-height: 1;
}
.step-content-sheet h3 {
    font-size: 24px;
    color: #002266;
    font-weight: 700;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 15px;
    flex-wrap: wrap;
}
.step-content-sheet .ko-spec-label {
    font-size: 16px;
    background: #eef2ff;
    color: #4a90e2;
    padding: 6px 12px;
    border-radius: 20px;
    font-weight: 600;
}
.step-content-sheet p {
    font-size: 18px;
    color: #475569;
    line-height: 1.7;
    margin: 0;
    word-break: keep-all;
}
/* =========================================================================
   SCF Testimonial Section (Home)
   ========================================================================= */
.scf-review-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
}
.premium-review-card {
    background: #ffffff;
    padding: 40px;
    border-radius: 20px;
    border: 1px solid #f8f9fa;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: left;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.premium-review-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.06);
}
.premium-review-card .review-verbatim {
    font-size: 18px;
    line-height: 1.8;
    color: #334155;
    margin-bottom: 25px;
    word-break: keep-all;
}
.premium-review-card .review-author-info {
    font-size: 16px;
    color: #1e3a8a;
    font-weight: 700;
    border-top: 1px solid #f1f5f9;
    padding-top: 20px;
    margin-top: auto;
}
.dynamic-popup {
    position: fixed !important;
    top: var(--popup-top, 100px) !important;
    left: var(--popup-left, 100px) !important;
    transform: none !important;
}
/* ============================================================
   ?벑 紐⑤컮??醫낇빀 媛?낆꽦 媛쒖꽑 (2026-06-21)
   - Hero ?곸긽: ??ㅽ겕由??뺣룄媛?蹂듭썝
   - v-card: ?덈퉬 ?뺣? + ?믪씠 利앷?
   - reach-hero: ?몃줈 ?ㅽ깮 + 異⑸텇???믪씠
   - training-card: ?⑥씪 而щ읆
   - ?뱀뀡 ?щ갚: 紐⑤컮??理쒖쟻??
   - ?고듃: 媛?낆꽦 ?μ긽
============================================================ */
/* Fix white text on white background in sub-categories */
#main-header.scrolled .gnb-depth1 {
    color: #1e293b !important;
}
.gnb-depth1 {
    color: #ffffff;
    font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
    font-size: 16px;
    font-weight: 500;
    transition: color 0.3s ease;
}
#main-header.scrolled .mobile-menu-header {
    color: #1e293b !important;
}
/* ============================================================
   ?벑 紐⑤컮??媛濡??ㅻ쾭?뚮줈???꾩쟾 李⑤떒 (2026-06-25)
   - 紐⑤뱺 ?뱀뀡??酉고룷?몃? 踰쀬뼱?섏? ?딅룄濡?蹂댁옣
   - ?곸긽 ?섎┝ ?꾩긽 ?섏젙
============================================================ */
/* ============================================================
   ?벑 紐⑤컮??v-移대뱶 臾댄븳 留덊??щ씪?대뱶 (2026-06-25)
   - 由щ럭 留덊댁? ?숈씪??諛⑹떇 (translateX -50% 臾댄븳 猷⑦봽)
   - PC: 3??洹몃━???좎?, 蹂듭궗 洹몃９ ?④?
   - 紐⑤컮?? 醫뚢넂???곗냽 ?먮룞 ?ㅽ겕濡?
============================================================ */
/* ?? PC: 蹂듭궗 洹몃９ ?④? + 留덊?鍮꾪솢?깊솕 ??洹몃━??蹂듭썝 ???????????????????? */
.v-card-group[aria-hidden="true"] { display: none; }
.v-card-marquee-container { width: 100%; }
/* ?? PC(1025px ?댁긽): 留덊??꾩쟾 鍮꾪솢?깊솕 ??3??洹몃━?쒕줈 ?쒖떆 ?????????????? */
@media screen and (min-width: 1025px) {
    /* 留덊??몃옓: ?몃줈 ?ㅽ깮 (媛?洹몃９??媛곸옄 ?됱쓣 李⑥?) */
    .v-card-marquee-track {
        display: block !important;
        animation: none !important;
        width: 100% !important;
    }
    /* ?먮낯 洹몃９留?洹몃━?쒕줈 ?쒖떆 */
    .cards-grid-v.v-card-group {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        flex-direction: unset !important;
        flex-wrap: unset !important;
        overflow-x: visible !important;
        animation: none !important;
        gap: 2rem !important;
        max-width: 1600px !important;
        margin: 0 auto !important;
        padding: 0 20px !important;
    }
    /* 蹂듭궗 洹몃９ ?꾩쟾 ?④? */
    .v-card-group[aria-hidden="true"] {
        display: none !important;
    }
    /* 移대뱶 ?ш린 ?먮옒?濡? height 380px, ?덈퉬 ?먮룞 */
    .v-card-group .v-card {
        flex: unset !important;
        max-width: unset !important;
        width: 100% !important;
        height: 380px !important;
        scroll-snap-align: unset !important;
    }
    /* Hero ?곸긽: PC?먯꽌 ??ㅽ겕由??좎? */
    .hero {
        height: 100vh !important;
        min-height: 600px !important;
        max-height: unset !important;
    }
    .hero-video {
        -o-object-fit: cover !important;
           object-fit: cover !important;
        background-color: unset !important;
    }
}
/* ?? 紐⑤컮?? 臾댄븳 留덊??쒖꽦?????????????????????????????? */
.kca-header {

  position: fixed;

  top: 0; left: 0; width: 100%;

  height: 76px;

  background: rgba(255, 255, 255, 0.95);

  backdrop-filter: blur(8px);

  border-bottom: 1px solid var(--color-border-light);

  z-index: 1000;

  display: flex;

  align-items: center;

}
.kca-header-inner {

  display: flex;

  justify-content: space-between;

  align-items: center;

  width: 100%;

  max-width: 1500px;

  margin: 0 auto;

  padding: 0 20px;

}
.kca-logo {

  display: flex;

  align-items: center;

  gap: 8px;

}
.kca-logo-text {

  font-size: 24px;

  font-weight: 900;

  color: var(--color-primary);

  letter-spacing: -0.5px;

}
.kca-gnb-list {

  display: flex;

  gap: 40px;

}
.kca-gnb-item {

  position: relative;

  padding: 26px 0;

}
.kca-gnb-depth1 {
  font-size: 18px;
  font-weight: 600;

  color: var(--color-text-primary);

  cursor: pointer;

  transition: color 0.2s ease;

}
.kca-gnb-item:hover .kca-gnb-depth1 {

  color: var(--color-accent);

}
.kca-dropdown {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(8px);
  min-width: 170px;
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-top: 3px solid #0B2D6E;
  border-radius: 0 0 10px 10px;
  box-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.08), 0 4px 6px -2px rgba(15, 23, 42, 0.03);
  padding: 6px 4px;
  z-index: 50;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: all 0.3s ease;
}
.kca-dropdown.open, .kca-gnb-item:hover .kca-dropdown {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.kca-dropdown-link {
  display: block;
  font-size: 13px;
  font-weight: 400;
  color: #475569;
  padding: 8px 12px;
  border-radius: 6px;
  text-decoration: none;
  transition: all 0.15s ease-in-out;
  white-space: nowrap;
}
.kca-dropdown-link:hover {
  color: #0B2D6E;
  background-color: #f8fafc;
  font-weight: 500;
}
.kca-action-btn {

  font-size: 14px;

  font-weight: 700;

  color: var(--color-text-secondary);

  padding: 8px 16px;

  border: 1px solid var(--color-accent-dark);

  border-radius: 20px;

  transition: all 0.2s ease;

}
.kca-action-btn:hover {
  background-color: var(--color-accent-dark);
  color: var(--color-white);
  border-color: var(--color-accent-dark);
}
.kca-auth-btn {
  text-decoration: none;
  padding: 8px 18px;
  border-radius: 20px;
  font-size: 14px;
  font-weight: 700;
  transition: all 0.2s;
  border: 1px solid #ffffff;
  color: #ffffff;
  background: transparent;
}
.kca-auth-btn:hover {
  background-color: #2563eb;
  border-color: #2563eb;
  color: #ffffff;
}
.kca-auth-btn-logout {
  background: transparent;
  border: 1px solid #ffffff;
  color: #ffffff;
  padding: 8px 16px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
}
.kca-auth-btn-logout:hover {
  background-color: #2563eb;
  border-color: #2563eb;
  color: #ffffff;
}
.kca-header.scrolled .kca-auth-btn {
  border: 1px solid #ffffff;
  color: #ffffff;
}
.kca-header.scrolled .kca-auth-btn:hover {
  background-color: #2563eb;
  border-color: #2563eb;
  color: #ffffff;
}
.kca-header.scrolled .kca-auth-btn-logout {
  border: 1px solid #ffffff;
  color: #ffffff;
}
.kca-header.scrolled .kca-auth-btn-logout:hover {
  background-color: #2563eb;
  border-color: #2563eb;
  color: #ffffff;
}
@media (max-width: 768px) {
  .auth-left-panel {
    display: none !important;
  }
}
.kca-mobile-btn { display: none; }
/* Header Transparency Overrides */
.kca-header {
  background: transparent !important;
  backdrop-filter: none !important;
  border-bottom: 1px solid rgba(255,255,255,0.15) !important;
  transition: all 0.3s ease;
}
.kca-header.scrolled {
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(8px) !important;
  border-bottom: 1px solid var(--color-border-light) !important;
}
.kca-header .kca-gnb-depth1 {
  color: #ffffff !important;
}
.kca-header.scrolled .kca-gnb-depth1 {
  color: var(--color-text-primary) !important;
}
.kca-header .kca-logo img {
  filter: brightness(0) invert(1);
  transition: all 0.3s ease;
}
.kca-header .kca-hamburger-lines span {
  background-color: #ffffff !important;
}
.kca-header.scrolled .kca-hamburger-lines span {
  background-color: var(--color-primary) !important;
}
.kca-header .kca-hamburger-text {
  color: #ffffff !important;
}
.kca-header.scrolled .kca-hamburger-text {
  color: var(--color-primary) !important;
}
.kca-gnb-list { margin-right: 0 !important; }
/* Final Fixes */
@media (min-width: 1025px) {
  .kca-mobile-overlay, .kca-mobile-btn, .mobile-nav-overlay, .mobile-menu-btn {
    display: none !important;
  }
  .kca-gnb {
    margin-left: auto !important;
    margin-right: 30px !important;
  }
  .kca-header-inner {
    padding-right: 40px !important;
  }
}
.kca-header .kca-logo img {
  filter: none !important;
}
/* Increase Menu Font Size */
.kca-gnb-depth1 {
  font-size: 19px !important;
  font-weight: 600 !important;
}
/* Center Dropdown Menus */
.kca-gnb-item {
  position: relative !important;
}
.kca-dropdown {
  left: 50% !important;
  transform: translateX(-50%) !important;
  margin-left: 0 !important;
}
/* Dropdown Top Border Color */
.kca-dropdown {
  border-top: 3px solid #b57b85 !important; /* 梨꾨룄 ??? 吏꾪븳 ?묓겕 */
}
/* Improve Header Visibility on Bright Images */
.kca-header:not(.scrolled) {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%) !important;
}
.kca-header:not(.scrolled) .kca-gnb-depth1,
.kca-header:not(.scrolled) .kca-mobile-btn {
  text-shadow: 0 2px 8px rgba(0,0,0,0.8);
}
/* Simple Text Cards */
.text-card {
    width: 380px;
    height: 220px;
    background-color: #ffffff;
    border-radius: 16px;
    padding: 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-shadow: 0 10px 25px rgba(0,0,0,0.06);
    border: 1px solid #e2e8f0;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    flex: 0 0 auto;
}
.text-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0,0,0,0.1);
}
.text-card-title {
    font-size: 22px;
    font-weight: 700;
    color: #002c5f;
    margin-bottom: 12px;
}
.text-card-caption {
    font-size: 16px;
    color: #475569;
    line-height: 1.6;
    word-break: keep-all;
    margin: 0;
}
/* ?ㅽ겕濡???濡쒓퀬 ?됱긽 諛섏쟾 (?곗깋 -> 寃?뺤깋) */
/* ?몃젴???띿뒪??移대뱶 ?붿옄??由щ돱??*/
.text-card {
    background: #ffffff !important;
    border: none !important;
    border-radius: 16px !important;
    border-top: 5px solid #002c5f !important; /* 紐낆퐫移?硫붿씤 ?ㅼ씠鍮?而щ윭濡??ъ씤??*/
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08) !important;
    padding: 40px 35px !important;
    justify-content: flex-start !important;
    height: 240px !important;
    position: relative;
    overflow: hidden;
}
.text-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to bottom, rgba(0,44,95,0.02), transparent);
    pointer-events: none;
}
.text-card-title {
    font-size: 23px !important;
    font-weight: 800 !important;
    color: #002c5f !important;
    margin-bottom: 18px !important;
    letter-spacing: -0.5px !important;
}
.text-card-caption {
    font-size: 17px !important;
    color: #475569 !important;
    line-height: 1.6 !important;
}
/* ?붿씠??湲?섏뒪紐⑦뵾利?+ 諛섍구移??④낵 (Overlap effect) */
.visual-cards-area {
    margin-top: -130px !important; /* ?덉뼱濡??곸뿭 ?꾨줈 130px ?밴꺼?щ┝ */
    position: relative !important;
    z-index: 20 !important;
    background-color: transparent !important;
    padding-top: 0 !important;
}
.text-card {
    background: rgba(255, 255, 255, 0.75) !important; /* ?щ챸???곗깋 */
    backdrop-filter: blur(15px) !important; /* 諛곌꼍 釉붾윭 泥섎━ (?좊━ 吏덇컧) */
    -webkit-backdrop-filter: blur(15px) !important;
    border: 1px solid rgba(255, 255, 255, 0.8) !important; /* ?좊━ ?뚮몢由?諛섏궗愿?*/
    border-top: 5px solid #002c5f !important; /* ?곷떒 ?ㅼ씠鍮??ъ씤???좎? */
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15) !important; /* 遺?쒕윭???낆껜 洹몃┝??*/
}
/* 湲?먯깋???щ챸 諛곌꼍 ?꾩뿉?쒕룄 ??蹂댁씠?꾨줉 吏꾪븯寃?*/
.text-card-title {
    color: #002c5f !important;
    text-shadow: 0 1px 2px rgba(255,255,255,0.8) !important;
}
.text-card-caption {
    color: #1e293b !important;
    font-weight: 500 !important;
}
/* ?ㅽ겕濡??쒖뿉???ㅻ뜑媛 ?붾━???붿씠?멸? ?섏? ?딄퀬 諛섑닾紐??ㅼ씠鍮꾨줈 ?좎??섏뼱 ?대?吏 ?꾩뿉 ?좎엳???먮굦 遺??*/
.kca-header.scrolled {
    background: rgba(0, 28, 61, 0.85) !important; /* 諛섑닾紐??ㅼ씠鍮?*/
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid rgba(255,255,255,0.1) !important;
}
/* ?ㅽ겕濡????띿뒪??諛?踰꾪듉 而щ윭瑜??곗깋?쇰줈 怨좎젙 (?대몢??諛곌꼍?대?濡? */
.kca-header.scrolled .kca-gnb-depth1,
.kca-header.scrolled .kca-mobile-btn,
.kca-header.scrolled .kca-hamburger-text {
    color: #ffffff !important;
    text-shadow: none !important;
}
.kca-header.scrolled .kca-hamburger-lines span {
    background-color: #ffffff !important;
}
/* 濡쒓퀬???대몢??諛곌꼍??留욊쾶 ?ㅼ떆 ?곗깋?쇰줈 (諛앷쾶) */
/* Slim Business Ribbon Section (SEHA 스타일 띠 배너) */
.business-ribbon-section {
    background-color: #002c5f; /* 명코칭 메인 네이비 */
    background-image: linear-gradient(to right, rgba(0,0,0,0.4), rgba(0,0,0,0.1));
    color: #ffffff;
    padding: 70px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.ribbon-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
.ribbon-main-title {
    font-size: 15px;
    color: rgba(255, 255, 255, 0.6);
    margin-bottom: 45px;
    font-weight: 400;
    letter-spacing: -0.5px;
}
.ribbon-grid {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 20px;
}
.ribbon-item {
    flex: 1;
    min-width: 200px;
    padding: 0 15px;
    position: relative;
}
/* 구분선 (맨 마지막 항목 제외) */
.ribbon-item:not(:last-child)::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 50px;
    background-color: rgba(255, 255, 255, 0.15);
}
.ribbon-item-title {
    font-size: 26px;
    font-weight: 800;
    margin-bottom: 12px;
    color: #ffffff;
    letter-spacing: -1px;
}
.ribbon-item-desc {
    font-size: 16px;
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.5;
    word-break: keep-all;
    font-weight: 300;
}
/* Hero Bottom Glass Cards (SEHA Style Overlap) */
.hero-bottom-cards {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    display: flex;
    z-index: 20;
}
.hero-bottom-card {
    flex: 1;
    background: rgba(0, 28, 61, 0.55); /* 명코칭 네이비 기반의 반투명 유리 */
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    padding: 35px 40px;
    display: flex;
    align-items: flex-start;
    gap: 25px;
    transition: background 0.3s ease;
    cursor: default;
}
.hero-bottom-card:hover {
    background: rgba(0, 28, 61, 0.85);
}
.hero-bottom-card:last-child {
    border-right: none;
}
.hero-bc-num {
    font-size: 22px;
    font-weight: 800;
    color: #ffffff;
    font-family: 'Outfit', sans-serif;
    opacity: 0.9;
    line-height: 1;
}
.hero-bc-content {
    flex: 1;
}
.hero-bc-label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    color: #00e5ff; /* 포인트 형광 블루/민트 */
    letter-spacing: 1px;
    margin-bottom: 8px;
}
.hero-bc-title {
    font-size: 22px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 10px;
    letter-spacing: -0.5px;
}
.hero-bc-desc {
    font-size: 15px;
    color: rgba(255, 255, 255, 0.75);
    line-height: 1.4;
    word-break: keep-all;
}
/* Adjust dot navigation since cards occupy bottom */
.hero-slider-nav {
    bottom: 180px !important;
}
/* NEW SCF Timeline Styling (Horizontal Stacked Cards) */
.scf-roadmap-wrapper {
    max-width: 1000px; /* 좀 더 타이트한 폭 */
    margin: 0 auto;
    padding: 0 20px;
}
.scf-timeline-track {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 40px;
}
.scf-step-card {
    background-color: #ffffff;
    border-radius: 12px;
    padding: 30px 40px;
    display: flex;
    align-items: center;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.scf-step-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
}
.step-number-axis {
    font-size: 55px;
    font-weight: 800;
    color: #e2e8f0;
    font-family: 'Outfit', sans-serif;
    line-height: 1;
    margin-right: 40px;
    min-width: 70px;
}
.step-content-sheet {
    flex: 1;
}
.step-title-flex {
    display: flex;
    align-items: center;
    gap: 15px;
    font-size: 22px;
    font-weight: 700;
    color: #002c5f;
    margin-bottom: 12px;
    margin-top: 0;
}
.ko-spec-label {
    background-color: #eef2f6;
    color: #002c5f;
    font-size: 13px;
    font-weight: 600;
    padding: 5px 12px;
    border-radius: 20px;
    letter-spacing: -0.5px;
}
.step-content-sheet p {
    font-size: 15px;
    color: #666666;
    line-height: 1.5;
    margin: 0;
    word-break: keep-all;
}
/* Global Mobile Readability Adjustments */
/* Injected from Home.jsx */
/* Modal CSS */
.scf-modal-overlay {
            position: fixed;
            top: 0; left: 0; width: 100%; height: 100%;
            background: rgba(0, 5, 20, 0.8);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            z-index: 9999;
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s ease;
        }
.scf-modal-overlay.active {
            opacity: 1;
            visibility: visible;
        }
.scf-modal-content {
            background: #F8FAFC;
            border: 1px solid rgba(0, 44, 95, 0.1);
            border-radius: 20px;
            width: 90%;
            max-width: 1000px;
            height: 85vh;
            display: flex;
            flex-direction: column;
            box-shadow: 0 30px 60px rgba(0,0,0,0.5);
            transform: translateY(30px);
            transition: all 0.3s ease;
        }
.scf-modal-overlay.active .scf-modal-content {
            transform: translateY(0);
        }
.scf-modal-header {
            padding: 20px 30px;
            border-bottom: 1px solid rgba(255,255,255,0.1);
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
.scf-modal-close {
            background: transparent;
            border: none;
            color: #fff;
            font-size: 36px;
            cursor: pointer;
            line-height: 1;
            transition: color 0.3s ease;
        }
.scf-modal-close:hover {
            color: #4a90e2;
        }
.scf-modal-body {
            padding: 30px;
            overflow-y: auto;
            flex: 1;
        }
/* Custom Scrollbar for Modal */
.scf-modal-body::-webkit-scrollbar {
            width: 10px;
        }
.scf-modal-body::-webkit-scrollbar-track {
            background: rgba(255,255,255,0.05);
        }
.scf-modal-body::-webkit-scrollbar-thumb {
            background: rgba(255,255,255,0.2);
            border-radius: 5px;
        }
.scf-modal-body::-webkit-scrollbar-thumb:hover {
            background: rgba(255,255,255,0.4);
        }
.contact-banner-container {
            background-color: #ffffff;
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 40px 0;
            gap: 80px;
            flex-wrap: wrap;
            max-width: 1400px;
            margin: 0 auto;
        }
.contact-banner-img-wrap {
            flex: 1;
            display: flex;
            justify-content: center;
            min-width: 300px;
        }
.contact-banner-img-wrap img {
            max-width: 100%;
            height: auto;
            -o-object-fit: contain;
               object-fit: contain;
            max-height: 450px;
        }
.contact-banner-content {
            flex: 1.2;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: flex-start;
            min-width: 300px;
        }
.contact-banner-title {
            font-size: 42px;
            font-weight: 800;
            color: #111;
            line-height: 1.4;
            margin-bottom: 24px;
            letter-spacing: -0.02em;
            word-break: keep-all;
        }
.contact-banner-subtitle {
            font-size: 18px;
            color: #555;
            line-height: 1.6;
            margin-bottom: 40px;
            font-weight: 500;
            word-break: keep-all;
            max-width: 600px;
        }
.contact-banner-btn {
            background-color: #1E3A8A;
            color: #fff;
            padding: 20px 50px;
            font-size: 18px;
            font-weight: 700;
            text-decoration: none;
            border-radius: 8px;
            display: inline-block;
            text-align: center;
            width: 400px; /* 2x size */
            max-width: 100%;
            align-self: center; /* Center within the column */
            margin-top: 20px;
            transition: background-color 0.2s ease, transform 0.2s ease;
            box-shadow: 0 4px 12px rgba(30, 58, 138, 0.2);
        }
.contact-banner-btn:hover {
            background-color: #172B66;
            transform: translateY(-2px);
            box-shadow: 0 6px 16px rgba(30, 58, 138, 0.3);
        }
@keyframes slideInLeft {
          from { opacity: 0; transform: translateX(-30px) translateY(-50%); }
          to { opacity: 1; transform: translateX(0) translateY(-50%); }
        }
@keyframes shimmerMove {
          0% { transform: translateX(-150%) skewX(-15deg); }
          100% { transform: translateX(250%) skewX(-15deg); }
        }
.shimmer-effect {
          position: absolute;
          top: 0; left: 0; width: 50%; height: 100%;
          background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.15) 50%, rgba(255,255,255,0) 100%);
          animation: shimmerMove 3.5s infinite;
          z-index: 1;
        }
/* =========================================
   모바일 우측 메뉴 및 오버레이 스타일 추가
   ========================================= */
@keyframes menuSlideIn {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}
@keyframes menuSlideOut {
  from { transform: translateX(0); }
  to { transform: translateX(100%); }
}
/* 모바일 메뉴 오버레이 초기 상태 (우측 화면 밖에 숨김) */
.kca-mobile-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  background-color: #ffffff;
  z-index: 9998;
  transform: translateX(100%);
  overflow-y: auto;
  padding-top: 80px;
}
/* 모바일 메뉴 열림 (화면 안으로 들어옴) */
.kca-mobile-overlay.active {
  animation: menuSlideIn 0.4s cubic-bezier(0.77, 0, 0.175, 1) forwards;
}
/* 모바일 메뉴 닫힘 (화면 밖으로 나감) */
.kca-mobile-overlay.closing {
  animation: menuSlideOut 0.4s cubic-bezier(0.77, 0, 0.175, 1) forwards;
}
.kca-mobile-gnb ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.kca-mobile-gnb > ul > li {
  border-bottom: 1px solid #f0f0f0;
}
.kca-mobile-menu-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  font-size: 18px;
  font-weight: 700;
  color: #111;
  cursor: pointer;
}
.kca-mobile-menu-header.active {
  color: #002C5F;
}
.kca-mobile-submenu {
  background-color: #f9f9f9;
}
.kca-mobile-submenu li a {
  display: block;
  padding: 15px 20px 15px 30px;
  color: #555;
  font-size: 16px;
  text-decoration: none;
}
.kca-mobile-submenu li a.active {
  color: #002C5F;
  font-weight: 700;
}
/* 모바일 전용 CSS 분리 파일 */

@media screen and (max-width: 768px) {
    .case-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .case-card {
        height: 260px;
    }
    :root {
        --header-height: 80px;
        --header-shrink: 60px;
    }

    .gnb {
        display: none; /* PC 筌롫뗀????? */
    }

    .mobile-menu-btn {
        display: block; /* ?袁⑥쒔椰?甕곌쑵????뽮쉐??*/
    }

    .mobile-nav-overlay {
        display: flex; /* ??됱뵠?袁⑹뜍 餓Β??(疫꿸퀡??visibility: hidden) */
    }

    /* 嚥≪뮄??筌뤴뫀而???곕벡??(?癒?염??살쓦野? */
    .logo img {
        height: 40px;
    }

    #main-header.scrolled .logo img {
        height: 32px;
    }

    .header-inner {
        padding: 0 20px;
    }

    .section-title {
        font-size: 28px;
    }

    .section {
        padding: 80px 20px;
    }

    /* About ?諭??筌뤴뫀而??????*/
    .about-content {
        flex-direction: column;
        gap: 40px;
    }

    /* ??????怨멸쉭 ??륁뵠筌왖 筌뤴뫀而??????*/
    #postContainer {
        padding: 30px 20px !important;
    }
    #postTitle {
        font-size: 24px !important;
    }
    .bright-grid { grid-template-columns: 1fr !important; }
    .b-title { font-size: 32px !important; }
    .b-title-ko { font-size: 20px !important; }
    .b-highlight { font-size: 22px !important; }
    .b-desc { font-size: 18px !important; }
    .bright-card { padding: 40px 30px !important; }

    .bright-compare, .bright-roadmap {
        padding: 40px 20px !important;
        margin-top: 50px !important;
    }
    .compare-title, .roadmap-title {
        font-size: 32px !important;
        margin-bottom: 40px !important;
    }
    .bright-badge {
        font-size: 60px !important;
        margin-bottom: -20px !important;
    }
    .roadmap-step .step-label { font-size: 22px !important; }
    .roadmap-step .step-icon { width: 60px !important; height: 60px !important; line-height: 60px !important; font-size: 28px !important; }
    .roadmap-title { font-size: 28px !important; }
    .core-value-badge {
        font-size: 20px;
        padding: 12px 35px;
    }
    .compare-card p {
        font-size: 20px !important;
    }
    .compare-card {
        min-height: 80px !important;
        padding: 20px 25px !important;
    }
    .compare-arrow {
        width: 40px !important;
        height: 40px !important;
    }
    .arrow-icon {
        font-size: 20px !important;
    }
    /* =====================================================
       紐⑤컮??Hero / Video ?뱀뀡: ??ㅽ겕由??뺣룄媛?蹂듭썝
       ?듭떖 蹂寃? 56.25vw(16:9 諛뺤뒪) ??100svh(??ㅽ겕由?
    ===================================================== */
    .hero {
        height: 100svh !important;       /* ??ㅽ겕由??뺣룄媛??좎? */
        height: 100dvh !important;
        min-height: 500px !important;
        width: 100% !important;
    }
    .video-insert-section {
        height: 75svh !important;        /* ?곸젅???믪씠 */
        height: 75dvh !important;
        min-height: 400px !important;
        aspect-ratio: unset !important;
    }
    .hero-video {
        width: 100% !important;
        height: 100% !important;
        -o-object-fit: cover !important;
           object-fit: cover !important;    /* ?곸긽????긽 苑?李④쾶 */
        -o-object-position: center center !important;
           object-position: center center !important;
    }
    .hero-text-container {
        padding-top: 30%;                /* ?띿뒪???몃줈 ?꾩튂 議곗젙 */
        padding-left: 20px;
        padding-right: 20px;
    }
    .pure-image-tray img.clean-rendered-asset {
        max-width: 100%;
        height: auto;
        -o-object-fit: contain;
           object-fit: contain;
    }
    .hero-slogan-ko {
        font-size: 26px;
        line-height: 1.4;
        margin-bottom: 8px;
        word-break: keep-all;
    }
    .hero-slogan-en {
        font-size: 15px;
        margin-top: 10px;
    }
    .dynamic-popup {
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) var(--popup-translate, translate(0,0)) !important;
    }
    /* ?? v-card (?대?吏 移대뱶 洹몃━?? ???????????????????? */
    /* 媛濡??ㅽ겕濡?移대뱶瑜????ш쾶, ??踰덉뿉 ?섎굹??蹂댁씠寃?*/
    .v-card {
        flex: 0 0 85vw !important;
        max-width: 85vw !important;
        height: 340px !important;
    }
    .v-card-title {
        font-size: 20px !important;
        line-height: 1.3 !important;
        word-break: keep-all;
    }
    .v-card-caption {
        font-size: 14px !important;
    }
    .reach-hero-right {
        min-height: 280px !important;
        aspect-ratio: 16 / 9 !important;
        border-radius: 16px !important;
    }
    .reach-main-title {
        font-size: 32px !important;
    }
    .reach-top-title {
        font-size: 15px !important;
    }
    .reach-sub-text {
        font-size: 15px !important;
    }
    .reach-hero-section {
        padding: 20px 4% 30px !important;
    }

    /* ?? SCF ?쇱떎由ы뀒?댁뀡 ?뱀뀡 ????????????????????????? */
    .scf-new-section {
        padding: 60px 5% !important; /* 100px ??60px */
    }
    .scf-main-heading {
        font-size: 22px !important;
        line-height: 1.5 !important;
        word-break: keep-all;
    }
    .scf-main-title {
        font-size: 26px !important;
    }
    .scf-main-desc {
        font-size: 15px !important;
        line-height: 1.7 !important;
    }

    /* ?? training-card (援먯쑁 ?뱀뀡) ????????????????????? */
    .training-card {
        flex: 1 1 100% !important; /* 2????1??*/
        padding: 30px 24px !important;
    }

    /* ?? ?뱀뀡 ?쇰컲 ?щ갚 ???????????????????????????????? */
    .section {
        padding: 60px 20px !important; /* 140px ??60px */
    }
    /* 援먯쑁 ?뱀뀡 ?대? */
    #training .section-inner {
        padding: 0 !important;
    }
    #training h2 {
        font-size: 20px !important;
        margin-bottom: 20px !important;
    }
    #training p.section-desc {
        font-size: 18px !important;
        margin-bottom: 30px !important;
    }

    /* ?? SCF 濡쒕뱶留??뱀뀡 ??????????????????????????????? */
    .scf-integrated-section {
        padding: 40px 0 !important;
    }
    .scf-roadmap-wrapper {
        padding: 0 16px !important;
    }
    .scf-section-header h2 {
        font-size: 24px !important;
        line-height: 1.4 !important;
        word-break: keep-all;
    }
    .scf-lead-text {
        font-size: 15px !important;
        line-height: 1.7 !important;
    }

    /* ?? ?꾧린 留덊?移대뱶 ???????????????????????????????? */
    .premium-review-card {
        width: 85vw !important;
        min-width: 85vw !important;
        padding: 28px 24px !important;
    }
    .premium-review-card .review-verbatim {
        font-size: 15px !important;
        line-height: 1.7 !important;
    }
    .premium-review-card .review-author-info {
        font-size: 14px !important;
    }

    /* ?? 踰꾪듉 ?곗튂 ?곸뿭 ?뺣? ??????????????????????????? */
    .premium-btn-deepblue {
        font-size: 16px !important;
        padding: 16px 36px !important;
        display: block !important;
        text-align: center !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    .btn-scf-modal,
    .btn-scf-contact {
        width: 100% !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

    /* ?? ?몄궗?댄듃 移대뱶 ?뱀뀡 ???????????????????????????? */
    .home-insight-section {
        padding: 60px 20px !important;
    }
    .insight-white-card {
        height: auto !important;
    }
    .insight-white-card .card-img-area {
        height: 200px !important;
    }
    .insight-white-card .card-title {
        font-size: 16px !important;
    }
    /* 紐⑤뱺 ?뱀뀡 ?덈퉬 ?쒗븳 */
    section, div, article, aside, nav, main {
        max-width: 100%;
    }

    /* 臾댄븳 濡ㅻ쭅 ?몃옓?ㅼ? ?덈퉬 100% 媛뺤젣 ?쒗븳?먯꽌 ?덉쇅 泥섎━ (留덊??딄? 諛?寃뱀묠 踰꾧렇 ?닿껐) */
    .v-card-marquee-track,
    .cards-grid-v.v-card-group,
    .marquee-track,
    .marquee-group {
        max-width: none !important;
    }

    /* ?몃옓???뺤긽 湲몄씠瑜??섏갼?섏쑝誘濡??띾룄??紐⑤컮?쇱뿉 留욊쾶 ?⑥텞 (55珥?-> 20珥? */
    .marquee-track {
        animation-duration: 20s !important;
    }

    /* 留덊??꾧린 ?щ씪?대뱶) 而⑦뀒?대꼫 ?ㅻ쾭?뚮줈??李⑤떒 */
    .marquee-container {
        overflow: hidden !important;
        max-width: 100vw !important;
    }

    /* ?앹뾽: 媛濡??ㅽ겕濡ㅻ컮 ?쒓굅 (overflow-y:auto ??overflow-x??auto媛 ?섎뒗 踰꾧렇 李⑤떒) */
    .dynamic-popup {
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        max-width: min(95vw, 480px) !important;
        max-height: 90vh !important;
        overflow-x: hidden !important;       /* ???ш린媛 ??씤?? 媛濡??ㅽ겕濡ㅻ컮/?붿궡???쒓굅 */
        overflow-y: auto !important;
        box-sizing: border-box !important;
    }

    /* video-insert-section ?곸긽 ?섎┝ 諛⑹? + ?믪씠 以꾩뿬???곸긽 ?꾩껜 ?몄텧 */
    .video-insert-section {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
        height: 56.25vw !important;    /* 16:9 鍮꾩쑉: ?곸긽 ? ?몄텧 */
        min-height: 220px !important;
        max-height: 55vh !important;
    }
    /* ??踰덉㎏ ?곸긽 ???띿뒪?몃룄 ?묎쾶 議곗젙 */
    .video-insert-section .hero-slogan-ko {
        font-size: clamp(16px, 4vw, 22px) !important;
        margin-bottom: 6px !important;
    }
    .video-insert-section .hero-slogan-en {
        font-size: clamp(12px, 3vw, 16px) !important;
    }
    .video-insert-section .hero-text-container {
        padding-top: 10% !important;
    }

    /* reach-hero-section 媛濡??ㅻ쾭?뚮줈??諛⑹? */
    .reach-hero-section {
        width: 100% !important;
        overflow: hidden !important;
    }

    /* scf-integrated-section ?ㅻ쾭?뚮줈??諛⑹? */
    .scf-integrated-section {
        width: 100% !important;
        overflow: hidden !important;
    }

    /* insight ?뱀뀡 */
    .home-insight-section {
        width: 100% !important;
        overflow: hidden !important;
    }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
    .case-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
}

@media screen and (max-width: 1024px) {
    .about-container {
        flex-direction: column;
    }
    .about-left {
        flex: 1;
        width: 100%;
    }
    .about-grid {
        grid-template-columns: 1fr;
    }
    .visual-cards-area {
        padding: 3rem 0 !important;
        overflow: visible !important; /* 移대뱶 ?붾┝ 諛⑹? */
    }
    /* insight-section-wrap??overflow??visible濡?*/
    .insight-section-wrap {
        overflow: visible !important;
    }
    .banner-inner {
        overflow: visible !important;
        padding: 0 !important;
    }
    .cards-grid-v {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 1rem !important;
        padding: 0 5vw 20px 5vw !important; /* ?묒” ?щ갚?쇰줈 ?ㅼ쓬 移대뱶 ??蹂댁씠寃?*/
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .cards-grid-v::-webkit-scrollbar {
        display: none !important;
    }
    .v-card {
        scroll-snap-align: start;
        flex: 0 0 80vw !important;
        max-width: 80vw !important;   /* 340px 怨좎젙 ?댁젣 ???붾㈃ 鍮꾨? */
        height: 360px !important;
        background-position: center center !important;
        padding: 0 !important;
        min-width: 0 !important;
        margin-bottom: 0 !important;
    }
    .v-card-content {
        padding: 24px !important;
    }
    .v-card-title {
        font-size: 22px !important;
        margin-bottom: 10px !important;
        line-height: 1.3 !important;
        word-break: keep-all;
    }
    .v-card-caption {
        font-size: 15px !important;
        line-height: 1.5 !important;
    }
    .v-card-title span {
        font-size: 28px !important;
    }
    .mobile-carousel-dots {
        display: flex;
        justify-content: center;
        gap: 8px;
        padding: 12px 0 4px;
    }
    .mobile-carousel-dots .dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: #cbd5e1;
        transition: all 0.3s ease;
        cursor: pointer;
    }
    .mobile-carousel-dots .dot.active {
        background: #002C5F;
        width: 24px;
        border-radius: 4px;
    }
    .banner-title { font-size: 28px; }
    .banner-stats-grid { grid-template-columns: 1fr; }
    .banner-actions { flex-direction: column; }
    .dark-stat-banner .banner-title { font-size: 32px !important; }
    .banner-coach-line { font-size: 16px; }
    .banner-title span:first-child { font-size: 38px !important; }
    .banner-title span:last-child { font-size: 38px !important; }
    .glass-pillars-grid {
        grid-template-columns: 1fr;
    }
    .glass-pillar {
        min-height: auto;
    }
    .banner-title span:first-child { font-size: 38px !important; }
    .banner-title span:last-child { font-size: 38px !important; }
    .banner-title span:first-child { font-size: 38px !important; }
    .banner-title span:last-child { font-size: 38px !important; }
    .banner-title span:first-child { font-size: 38px !important; }
    .banner-title span:last-child { font-size: 38px !important; }
    .banner-title span:first-child { font-size: 38px !important; }
    .banner-title span:last-child { font-size: 38px !important; }
    .banner-title span:first-child { font-size: 38px !important; }
    .banner-title span:last-child { font-size: 38px !important; }
    .banner-title span:first-child { font-size: 38px !important; }
    .banner-title span:last-child { font-size: 38px !important; }
    .banner-title span:first-child { font-size: 38px !important; }
    .banner-title span:last-child { font-size: 38px !important; }
    .banner-title span:first-child { font-size: 38px !important; }
    .banner-title span:last-child { font-size: 38px !important; }
    .compare-card p {
        white-space: normal !important;
        word-break: keep-all;
    }
    .compare-row {
        flex-direction: column;
        gap: 10px !important;
    }
    .compare-card {
        width: 100% !important;
    }
    .compare-arrow {
        width: 5px !important; /* 筌뤴뫀而??깅퓠??뺣뮉 ?紐껋쨮?醫롮뵠沃샕嚥???덊돩揶쎛 ?대벀由?*/
        height: 60px !important; /* ?紐껋쨮??疫뀀챷??*/
        margin: 20px auto !important; /* ?怨밸릭 ??媛?*/
    }
    .compare-arrow::after {
        right: auto;
        left: 50%;
        top: auto;
        bottom: -1px; /* ?λ맩???袁⑥삋???館釉?袁⑥쨯 獄쏄퀣??*/
        transform: translateX(-50%);
        border-left: 12px solid transparent;
        border-right: 12px solid transparent;
        border-top: 20px solid #00d282; /* ?袁⑥삋???館釉????⑥퍟??*/
        border-bottom: none;
    }
    .premium-compare-row {
        flex-direction: column;
        gap: 15px;
    }
    .premium-arrow {
        transform: rotate(90deg);
        height: 40px;
        width: 100%;
    }
    /* 蹂듭궗 洹몃９ ?쒖떆 */
    .v-card-group[aria-hidden="true"] { display: flex !important; }

    /* 而⑦뀒?대꼫: ?ㅻ쾭?뚮줈??李⑤떒 */
    .v-card-marquee-container {
        overflow: hidden !important;
        width: 100% !important;
    }

    /* ?몃옓: 媛濡?flex + ?좊땲硫붿씠??*/
    .v-card-marquee-track {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        animation: v-cards-marquee 15s linear infinite;
        width: -moz-max-content;
        width: max-content;
    }

    /* 媛?洹몃９(?먮낯 + 蹂듭궗): 媛濡?flex ??*/
    .cards-grid-v.v-card-group {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        overflow-x: visible !important;
        scroll-snap-type: none !important;
        padding: 0 16px 20px 0 !important;
        gap: 16px !important;
        flex-shrink: 0 !important;
    }

    /* 移대뱶 怨좎젙 ?덈퉬 (80vw) */
    .v-card-group .v-card {
        flex: 0 0 80vw !important;
        max-width: 80vw !important;
        scroll-snap-align: none !important;
    }

    /* 臾댄븳 猷⑦봽 ?ㅽ봽?덉엫 - 釉뚮씪?곗? max-content 踰꾧렇 諛⑹?瑜??꾪빐 ?뺥솗???섏튂濡??대룞 (移대뱶 3媛?240vw + 媛꾧꺽/?⑤뵫 48px) */
    @keyframes v-cards-marquee {
        0%   { transform: translateX(0); }
        100% { transform: translateX(calc(-240vw - 48px)); }
    }

    /* ?몃옓 ?좊땲硫붿씠??- 50% ???먮━寃?(8珥?-> 16珥? */
    .v-card-marquee-track {
        animation: v-cards-marquee 16s linear infinite !important;
    }

    /* ?? 硫붿씤 Hero ?곸긽: 16:9 鍮꾩쑉濡??몃줈 異뺤냼 ??醫뚯슦 ?섎┝ ?놁쓬 ?? */
    .hero {
        height: 56.25vw !important;
        min-height: 240px !important;
        max-height: 60vh !important;
    }
    .hero-video {
        -o-object-fit: contain !important;
           object-fit: contain !important;
        -o-object-position: center center !important;
           object-position: center center !important;
        background-color: #000 !important;
    }

    /* ?? ??踰덉㎏ ?곸긽: 紐⑤컮?쇱뿉??以묒븰 湲곗? ?? */
    .video-insert-player {
        -o-object-position: center center !important;
           object-position: center center !important;
    }
}

@media (max-width: 1024px) {
    .about-hero-manifesto {
        padding: 80px 20px 60px;
    }
    .manifesto-content-split,
    .manifesto-content-split.reverse {
        flex-direction: column;
    }
    .manifesto-left,
    .manifesto-content-split.reverse .manifesto-left {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
        margin-bottom: 25px;
    }
    .manifesto-right {
        width: 100%;
    }
    .manifesto-label, .context-label {
        font-size: 18px;
    }
    .manifesto-kr {
        font-size: 18px;
        word-break: keep-all;
    }
    .context-kr {
        font-size: 18px;
        word-break: keep-all;
    }
    .manifesto-en, .context-en {
        font-size: 14px;
        word-break: keep-all;
    }
    .context-body, .manifesto-body {
        font-size: 15px;
    }
    .manifesto-img {
        height: auto;
        aspect-ratio: 16 / 11;
    }
    .signal-diagnosis {
        grid-template-columns: 1fr;
        gap: 60px;
    }
    .pathway-steps {
        flex-direction: column;
        gap: 60px;
    }
    .pathway-line {
        display: none; /* Hide line on mobile */
    }
    .step-letter {
        margin-bottom: 15px;
    }
    .data-proof-grid {
        grid-template-columns: 1fr;
    }
    .data-number {
        font-size: 90px;
    }
    .data-unit {
        font-size: 20px;
        margin-bottom: 10px;
    }
    .scf-competency {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .scf-professional-value {
        grid-template-columns: 1fr;
        gap: 50px;
    }
    .reach-sub-block.signal-diagnosis {
        flex-direction: column;
    }
    .signal-left, .signal-col-center, .signal-col-right {
        width: 100%;
    }
    .sc-grid { grid-template-columns: 1fr !important; gap: 50px; }
    .sc-s2-timeline-wrapper { padding-top: 20px; }
    .sc-timeline-line { display: none; }
    .sc-timeline-steps { grid-template-columns: 1fr; gap: 30px; }
    .sc-step-card { text-align: center; background: #fff; padding: 30px; border-radius: 8px; box-shadow: 0 10px 20px rgba(0,0,0,0.03); }
    .sc-guide-item::before { left: 0; }
    .sc-section { padding: 80px 0; }
    .kca-gnb, .kca-action-btn { display: none !important; }

  .kca-mobile-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px; /* ?꾩씠肄섍낵 湲???ъ씠??媛꾧꺽 */
    background: none;
    border: none;
    cursor: pointer;
    z-index: 10001;
  }

  /* ?섎떒 ?띿뒪???붿옄??*/
  .kca-hamburger-text {
    font-size: 10px;
    font-weight: 700;
    color: var(--color-primary);
    letter-spacing: 0.5px;
    font-family: 'Inter', 'Noto Sans KR', sans-serif;
  }

  /* ?꾩씠肄??곸뿭 (?쎄컙 而ㅼ?怨??먭볼?뚯쭚) */
  .kca-hamburger-lines {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 28px; /* 湲곗〈 26px -> 28px */
    height: 18px;
  }
  .kca-hamburger-lines span {
    display: block;
    width: 100%;
    height: 2.2px; /* 湲곗〈 2px -> 2.2px */
    background-color: var(--color-primary);
    transition: all 0.3s ease;
    border-radius: 2px;
  }

  /* 硫붾돱 ?대┝(X) ?좊땲硫붿씠??*/
  .kca-mobile-btn.active .kca-hamburger-lines span:nth-child(1) {
    transform: translateY(7.9px) rotate(45deg);
  }
  .kca-mobile-btn.active .kca-hamburger-lines span:nth-child(2) {
    opacity: 0;
  }
  .kca-mobile-btn.active .kca-hamburger-lines span:nth-child(3) {
    transform: translateY(-7.9px) rotate(-45deg);
  }
    .hero-bottom-card {
        padding: 25px 20px;
        flex-direction: column;
        gap: 15px;
    }
}

@media (max-width: 991px) {
    .scf-grid { grid-template-columns: 1fr; }
    .scf-curriculum-grid { grid-template-columns: 1fr; }
    .scf-reach-step { flex-direction: column; align-items: flex-start; gap: 10px; padding: 25px; }
    .scf-reach-name { width: auto; }
}

@media (max-width: 768px) {
    .edu-overview-box {
        padding: 30px 16px !important;
    }
    .edu-benefit-box {
        padding: 20px !important;
    }
    .scf-mastery-grid { grid-template-columns: 1fr; }
    .scf-values-grid { grid-template-columns: 1fr; }
    .scf-reach-title { font-size: 22px; }
    .scf-mastery-body { padding-bottom: 35px; } /* give extra space at bottom to prevent cutoff */
    .scf-new-section {
        padding: 100px 5%;
    }
    .scf-main-heading { font-size: 28px; }
    .scf-main-title { font-size: 32px; }
    .scf-new-modal-body { padding: 40px 20px !important; }
    .insight-white-grid {
        grid-template-columns: 1fr !important;
    }
    .home-insight-section .insight-subtitle {
        font-size: 18px !important;
    }
    .insight-white-card {
        height: auto;
    }
    .insight-white-card .card-img-area {
        height: 240px;
    }
    .scf-integrated-section {
        padding: 60px 0;
    }
    .scf-roadmap-wrapper {
        padding: 0 20px;
    }
    .scf-section-header h2 {
        font-size: 28px;
    }
    .scf-step-card {
        flex-direction: column;
        padding: 25px;
        gap: 15px;
    }
    .step-number-axis {
        font-size: 36px;
    }
    .step-content-sheet h3 {
        font-size: 20px;
    }
    .step-content-sheet p {
        font-size: 16px;
    }
    .scf-review-wrapper {
        padding: 0 20px;
    }
    .ribbon-grid {
        flex-direction: column;
        gap: 50px;
    }
    .ribbon-item:not(:last-child)::after {
        display: none;
    }
    .hero-bottom-cards {
        display: none; /* 모바일에서는 숨기거나 세로로 배치해야 함 */
    }
    .hero-slider-nav {
        bottom: 30px !important;
    }
    .scf-step-card {
        flex-direction: column;
        align-items: flex-start;
        padding: 25px;
    }
    .step-number-axis {
        margin-right: 0;
        margin-bottom: 15px;
        font-size: 40px;
    }
    .step-title-flex {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    h1, h2, h3, h4, p, span, div {
    word-break: keep-all !important;
    overflow-wrap: break-word !important;
  }
  .scf-main-title, .page-hero-title, .scf-reach-title, .hero-title {
    font-size: 28px !important;
    line-height: 1.3 !important;
  }
  .scf-main-heading, .scf-reach-desc, .hero-desc, .page-hero-desc {
    font-size: 16px !important;
    line-height: 1.5 !important;
  }
  .schedule-popup-title {
    font-size: 30px !important;
  }
    .contact-banner-container {
                padding: 40px 20px;
                text-align: center;
                gap: 40px;
            }
            .contact-banner-content {
                align-items: center;
            }
            .contact-banner-title {
                font-size: 32px;
            }
            .contact-banner-subtitle {
                font-size: 16px;
            }
    .schedule-popup-wrapper {
            top: 38% !important; left: 20px !important; transform: translateY(-50%) !important;
            width: 92vw !important;
            max-width: 410px !important;
          }
          .schedule-popup-container {
            width: 100% !important;
          }
          .schedule-popup-banner {
            padding: 24px 20px 30px 20px !important;
          }
          .schedule-popup-logo {
            top: 16px !important;
            left: 20px !important;
            font-size: 18px !important;
          }
          .schedule-popup-whitecard {
            margin-top: 44px !important;
            padding: 20px 24px !important;
            margin-bottom: 20px !important;
          }
          .schedule-popup-year {
            font-size: 14px !important;
            margin-bottom: 4px !important;
          }
          .schedule-popup-title {
            font-size: 32px !important;
            letter-spacing: -1px !important;
          }
          .schedule-popup-text-area {
            padding-left: 0 !important;
          }
          .schedule-popup-desc-en {
            font-size: 16px !important;
            margin-bottom: 8px !important;
          }
          .schedule-popup-desc-ko {
            font-size: 26px !important;
            line-height: 1.3 !important;
          }
          .schedule-popup-btn-area {
            gap: 10px !important;
            margin-top: 24px !important;
          }
          .schedule-popup-btn-item {
            padding: 12px 14px !important;
            font-size: 15px !important;
          }
}

@media (max-width: 992px) {
    .reach-hero-container {
        grid-template-columns: 1fr;
        height: auto;
    }
    .reach-hero-left, .reach-hero-right {
        height: auto;
        aspect-ratio: auto;
        min-height: 350px;
        padding-top: 20px;
        padding-bottom: 20px;
    }
    .reach-hero-section {
        padding: 10px 5% !important; /* Extreme reduction for mobile */
    }
    .insight-section-wrap {
        padding: 1rem 0 1rem 0 !important; /* Extreme reduction for mobile */
    }
    .insight-white-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

.hero-slider-container {
    position: relative;
    width: 100%;
    height: 100vh;
    height: 100dvh;
    min-height: 600px;
    max-height: 900px;
    overflow: hidden;
    background-color: #000;
}

.hero-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 1;
    pointer-events: none;
    transition: opacity 1.2s ease-in-out;
}

.hero-slide.active {
    opacity: 1;
    z-index: 2;
    pointer-events: auto;
}

.hero-slide-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
}

@keyframes kenBurnsZoom { 
    from { transform: scale(1); } 
    to { transform: scale(1.15); } 
}

/* 켄 번스(Ken Burns) 줌 효과 - active와 fade-out 모두 동일한 애니메이션 유지 */
.hero-slide.active .hero-slide-bg,
.hero-slide.fade-out .hero-slide-bg {
    animation: kenBurnsZoom 6s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

/* 어두운 오버레이 (텍스트 가독성) */
.hero-slide-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, rgba(0,28,61,0.7) 0%, rgba(0,0,0,0.3) 100%);
    z-index: 3;
}

.hero-slide-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-top: 60px;
    padding-bottom: 40px;
    z-index: 4;
    text-align: center;
    color: #fff;
}

.hero-slide-title {
    font-size: clamp(32px, 5vw, 56px);
    font-weight: 900;
    margin-bottom: 20px;
    letter-spacing: -1px;
    text-shadow: 0 4px 30px rgba(0,0,0,0.9), 0 2px 10px rgba(0,0,0,0.9), 0 1px 3px rgba(0,0,0,0.9);
    -webkit-text-stroke: 0.5px rgba(0,0,0,0.25);
    white-space: normal;
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease 0.3s, transform 0.8s ease 0.3s;
}

.hero-slide.active .hero-slide-title {
    opacity: 1;
    transform: translateY(0);
}

.hero-slide-desc {
    font-size: clamp(18px, 2.5vw, 24px);
    font-weight: 500;
    letter-spacing: -0.5px;
    white-space: normal;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s ease 0.5s, transform 0.8s ease 0.5s;
    text-shadow: 0 4px 30px rgba(0,0,0,0.9), 0 2px 10px rgba(0,0,0,0.9), 0 1px 3px rgba(0,0,0,0.9);
    -webkit-text-stroke: 0.5px rgba(0,0,0,0.25);
    max-width: 90vw;
}

.hero-slide.active .hero-slide-desc {
    opacity: 1;
    transform: translateY(0);
}

/* 하단 네비게이션 인디케이터 */
.hero-slider-nav {
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    display: flex;
    gap: 12px;
}

.hero-slider-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: rgba(255,255,255,0.4);
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
}

.hero-slider-dot.active {
    background-color: #fff;
    transform: scale(1.3);
}

/* 화살표 버튼 */
.hero-nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    color: rgba(255,255,255,0.5);
    font-size: 3rem;
    cursor: pointer;
    z-index: 5;
    transition: color 0.3s ease;
    padding: 20px;
}

.hero-nav-btn:hover {
    color: #fff;
}

.hero-nav-prev { left: 20px; }
.hero-nav-next { right: 20px; }

@media (max-width: 1024px) {
    .hero-slider-container {
        height: 70vh !important;
        min-height: 400px !important;
    }
    .hero-slide-content {
        padding-bottom: 30px; /* Adjusted to prevent overlapping with dots */
    }
    .hero-nav-btn {
        display: none;
    }
}

.hero-slide:nth-child(3) .hero-slide-bg { background-position: center top !important; background-size: cover !important; }


/* 골든 REACH 슬라이드 텍스트 가독성 확보 */
.hero-slide:nth-child(2) .hero-slide-overlay {
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.25) 60%, transparent 100%) !important;
}

@media (max-width: 768px) {
    .hero-slide-desc {
        white-space: pre-line;
    }
    .hero-slide-title {
        white-space: pre-line;
    }
}
/*!
 * Quill Editor v2.0.3
 * https://quilljs.com
 * Copyright (c) 2017-2024, Slab
 * Copyright (c) 2014, Jason Chen
 * Copyright (c) 2013, salesforce.com
 */
.ql-container{box-sizing:border-box;font-family:Helvetica,Arial,sans-serif;font-size:13px;height:100%;margin:0;position:relative}.ql-container.ql-disabled .ql-tooltip{visibility:hidden}.ql-container:not(.ql-disabled) li[data-list=checked] > .ql-ui,.ql-container:not(.ql-disabled) li[data-list=unchecked] > .ql-ui{cursor:pointer}.ql-clipboard{left:-100000px;height:1px;overflow-y:hidden;position:absolute;top:50%}.ql-clipboard p{margin:0;padding:0}.ql-editor{box-sizing:border-box;counter-reset:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;line-height:1.42;height:100%;outline:none;overflow-y:auto;padding:12px 15px;-o-tab-size:4;tab-size:4;-moz-tab-size:4;text-align:left;white-space:pre-wrap;word-wrap:break-word}.ql-editor > *{cursor:text}.ql-editor p,.ql-editor ol,.ql-editor pre,.ql-editor blockquote,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{margin:0;padding:0}@supports (counter-set:none){.ql-editor p,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{counter-set:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor p,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{counter-reset:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}.ql-editor table{border-collapse:collapse}.ql-editor td{border:1px solid #000;padding:2px 5px}.ql-editor ol{padding-left:1.5em}.ql-editor li{list-style-type:none;padding-left:1.5em;position:relative}.ql-editor li > .ql-ui:before{display:inline-block;margin-left:-1.5em;margin-right:.3em;text-align:right;white-space:nowrap;width:1.2em}.ql-editor li[data-list=checked] > .ql-ui,.ql-editor li[data-list=unchecked] > .ql-ui{color:#777}.ql-editor li[data-list=bullet] > .ql-ui:before{content:'\2022'}.ql-editor li[data-list=checked] > .ql-ui:before{content:'\2611'}.ql-editor li[data-list=unchecked] > .ql-ui:before{content:'\2610'}@supports (counter-set:none){.ql-editor li[data-list]{counter-set:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list]{counter-reset:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered]{counter-increment:list-0}.ql-editor li[data-list=ordered] > .ql-ui:before{content:counter(list-0, decimal) '. '}.ql-editor li[data-list=ordered].ql-indent-1{counter-increment:list-1}.ql-editor li[data-list=ordered].ql-indent-1 > .ql-ui:before{content:counter(list-1, lower-alpha) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-1{counter-set:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-1{counter-reset:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-2{counter-increment:list-2}.ql-editor li[data-list=ordered].ql-indent-2 > .ql-ui:before{content:counter(list-2, lower-roman) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-2{counter-set:list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-2{counter-reset:list-3 list-4 list-5 list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-3{counter-increment:list-3}.ql-editor li[data-list=ordered].ql-indent-3 > .ql-ui:before{content:counter(list-3, decimal) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-3{counter-set:list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-3{counter-reset:list-4 list-5 list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-4{counter-increment:list-4}.ql-editor li[data-list=ordered].ql-indent-4 > .ql-ui:before{content:counter(list-4, lower-alpha) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-4{counter-set:list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-4{counter-reset:list-5 list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-5{counter-increment:list-5}.ql-editor li[data-list=ordered].ql-indent-5 > .ql-ui:before{content:counter(list-5, lower-roman) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-5{counter-set:list-6 list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-5{counter-reset:list-6 list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-6{counter-increment:list-6}.ql-editor li[data-list=ordered].ql-indent-6 > .ql-ui:before{content:counter(list-6, decimal) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-6{counter-set:list-7 list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-6{counter-reset:list-7 list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-7{counter-increment:list-7}.ql-editor li[data-list=ordered].ql-indent-7 > .ql-ui:before{content:counter(list-7, lower-alpha) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-7{counter-set:list-8 list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-7{counter-reset:list-8 list-9}}.ql-editor li[data-list=ordered].ql-indent-8{counter-increment:list-8}.ql-editor li[data-list=ordered].ql-indent-8 > .ql-ui:before{content:counter(list-8, lower-roman) '. '}@supports (counter-set:none){.ql-editor li[data-list].ql-indent-8{counter-set:list-9}}@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-8{counter-reset:list-9}}.ql-editor li[data-list=ordered].ql-indent-9{counter-increment:list-9}.ql-editor li[data-list=ordered].ql-indent-9 > .ql-ui:before{content:counter(list-9, decimal) '. '}.ql-editor .ql-indent-1:not(.ql-direction-rtl){padding-left:3em}.ql-editor li.ql-indent-1:not(.ql-direction-rtl){padding-left:4.5em}.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:3em}.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:4.5em}.ql-editor .ql-indent-2:not(.ql-direction-rtl){padding-left:6em}.ql-editor li.ql-indent-2:not(.ql-direction-rtl){padding-left:7.5em}.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:6em}.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:7.5em}.ql-editor .ql-indent-3:not(.ql-direction-rtl){padding-left:9em}.ql-editor li.ql-indent-3:not(.ql-direction-rtl){padding-left:10.5em}.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:9em}.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:10.5em}.ql-editor .ql-indent-4:not(.ql-direction-rtl){padding-left:12em}.ql-editor li.ql-indent-4:not(.ql-direction-rtl){padding-left:13.5em}.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:12em}.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:13.5em}.ql-editor .ql-indent-5:not(.ql-direction-rtl){padding-left:15em}.ql-editor li.ql-indent-5:not(.ql-direction-rtl){padding-left:16.5em}.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:15em}.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:16.5em}.ql-editor .ql-indent-6:not(.ql-direction-rtl){padding-left:18em}.ql-editor li.ql-indent-6:not(.ql-direction-rtl){padding-left:19.5em}.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:18em}.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:19.5em}.ql-editor .ql-indent-7:not(.ql-direction-rtl){padding-left:21em}.ql-editor li.ql-indent-7:not(.ql-direction-rtl){padding-left:22.5em}.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:21em}.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:22.5em}.ql-editor .ql-indent-8:not(.ql-direction-rtl){padding-left:24em}.ql-editor li.ql-indent-8:not(.ql-direction-rtl){padding-left:25.5em}.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:24em}.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:25.5em}.ql-editor .ql-indent-9:not(.ql-direction-rtl){padding-left:27em}.ql-editor li.ql-indent-9:not(.ql-direction-rtl){padding-left:28.5em}.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:27em}.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:28.5em}.ql-editor li.ql-direction-rtl{padding-right:1.5em}.ql-editor li.ql-direction-rtl > .ql-ui:before{margin-left:.3em;margin-right:-1.5em;text-align:left}.ql-editor table{table-layout:fixed;width:100%}.ql-editor table td{outline:none}.ql-editor .ql-code-block-container{font-family:monospace}.ql-editor .ql-video{display:block;max-width:100%}.ql-editor .ql-video.ql-align-center{margin:0 auto}.ql-editor .ql-video.ql-align-right{margin:0 0 0 auto}.ql-editor .ql-bg-black{background-color:#000}.ql-editor .ql-bg-red{background-color:#e60000}.ql-editor .ql-bg-orange{background-color:#f90}.ql-editor .ql-bg-yellow{background-color:#ff0}.ql-editor .ql-bg-green{background-color:#008a00}.ql-editor .ql-bg-blue{background-color:#06c}.ql-editor .ql-bg-purple{background-color:#93f}.ql-editor .ql-color-white{color:#fff}.ql-editor .ql-color-red{color:#e60000}.ql-editor .ql-color-orange{color:#f90}.ql-editor .ql-color-yellow{color:#ff0}.ql-editor .ql-color-green{color:#008a00}.ql-editor .ql-color-blue{color:#06c}.ql-editor .ql-color-purple{color:#93f}.ql-editor .ql-font-serif{font-family:Georgia,Times New Roman,serif}.ql-editor .ql-font-monospace{font-family:Monaco,Courier New,monospace}.ql-editor .ql-size-small{font-size:.75em}.ql-editor .ql-size-large{font-size:1.5em}.ql-editor .ql-size-huge{font-size:2.5em}.ql-editor .ql-direction-rtl{direction:rtl;text-align:inherit}.ql-editor .ql-align-center{text-align:center}.ql-editor .ql-align-justify{text-align:justify}.ql-editor .ql-align-right{text-align:right}.ql-editor .ql-ui{position:absolute}.ql-editor.ql-blank::before{color:rgba(0,0,0,0.6);content:attr(data-placeholder);font-style:italic;left:15px;pointer-events:none;position:absolute;right:15px}.ql-snow.ql-toolbar:after,.ql-snow .ql-toolbar:after{clear:both;content:'';display:table}.ql-snow.ql-toolbar button,.ql-snow .ql-toolbar button{background:none;border:none;cursor:pointer;display:inline-block;float:left;height:24px;padding:3px 5px;width:28px}.ql-snow.ql-toolbar button svg,.ql-snow .ql-toolbar button svg{float:left;height:100%}.ql-snow.ql-toolbar button:active:hover,.ql-snow .ql-toolbar button:active:hover{outline:none}.ql-snow.ql-toolbar input.ql-image[type=file],.ql-snow .ql-toolbar input.ql-image[type=file]{display:none}.ql-snow.ql-toolbar button:hover,.ql-snow .ql-toolbar button:hover,.ql-snow.ql-toolbar button:focus,.ql-snow .ql-toolbar button:focus,.ql-snow.ql-toolbar button.ql-active,.ql-snow .ql-toolbar button.ql-active,.ql-snow.ql-toolbar .ql-picker-label:hover,.ql-snow .ql-toolbar .ql-picker-label:hover,.ql-snow.ql-toolbar .ql-picker-label.ql-active,.ql-snow .ql-toolbar .ql-picker-label.ql-active,.ql-snow.ql-toolbar .ql-picker-item:hover,.ql-snow .ql-toolbar .ql-picker-item:hover,.ql-snow.ql-toolbar .ql-picker-item.ql-selected,.ql-snow .ql-toolbar .ql-picker-item.ql-selected{color:#06c}.ql-snow.ql-toolbar button:hover .ql-fill,.ql-snow .ql-toolbar button:hover .ql-fill,.ql-snow.ql-toolbar button:focus .ql-fill,.ql-snow .ql-toolbar button:focus .ql-fill,.ql-snow.ql-toolbar button.ql-active .ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill{fill:#06c}.ql-snow.ql-toolbar button:hover .ql-stroke,.ql-snow .ql-toolbar button:hover .ql-stroke,.ql-snow.ql-toolbar button:focus .ql-stroke,.ql-snow .ql-toolbar button:focus .ql-stroke,.ql-snow.ql-toolbar button.ql-active .ql-stroke,.ql-snow .ql-toolbar button.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow.ql-toolbar button:hover .ql-stroke-miter,.ql-snow .ql-toolbar button:hover .ql-stroke-miter,.ql-snow.ql-toolbar button:focus .ql-stroke-miter,.ql-snow .ql-toolbar button:focus .ql-stroke-miter,.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter{stroke:#06c}@media (pointer:coarse){.ql-snow.ql-toolbar button:hover:not(.ql-active),.ql-snow .ql-toolbar button:hover:not(.ql-active){color:#444}.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill{fill:#444}.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter{stroke:#444}}.ql-snow{box-sizing:border-box}.ql-snow *{box-sizing:border-box}.ql-snow .ql-hidden{display:none}.ql-snow .ql-out-bottom,.ql-snow .ql-out-top{visibility:hidden}.ql-snow .ql-tooltip{position:absolute;transform:translateY(10px)}.ql-snow .ql-tooltip a{cursor:pointer;text-decoration:none}.ql-snow .ql-tooltip.ql-flip{transform:translateY(-10px)}.ql-snow .ql-formats{display:inline-block;vertical-align:middle}.ql-snow .ql-formats:after{clear:both;content:'';display:table}.ql-snow .ql-stroke{fill:none;stroke:#444;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}.ql-snow .ql-stroke-miter{fill:none;stroke:#444;stroke-miterlimit:10;stroke-width:2}.ql-snow .ql-fill,.ql-snow .ql-stroke.ql-fill{fill:#444}.ql-snow .ql-empty{fill:none}.ql-snow .ql-even{fill-rule:evenodd}.ql-snow .ql-thin,.ql-snow .ql-stroke.ql-thin{stroke-width:1}.ql-snow .ql-transparent{opacity:.4}.ql-snow .ql-direction svg:last-child{display:none}.ql-snow .ql-direction.ql-active svg:last-child{display:inline}.ql-snow .ql-direction.ql-active svg:first-child{display:none}.ql-snow .ql-editor h1{font-size:2em}.ql-snow .ql-editor h2{font-size:1.5em}.ql-snow .ql-editor h3{font-size:1.17em}.ql-snow .ql-editor h4{font-size:1em}.ql-snow .ql-editor h5{font-size:.83em}.ql-snow .ql-editor h6{font-size:.67em}.ql-snow .ql-editor a{text-decoration:underline}.ql-snow .ql-editor blockquote{border-left:4px solid #ccc;margin-bottom:5px;margin-top:5px;padding-left:16px}.ql-snow .ql-editor code,.ql-snow .ql-editor .ql-code-block-container{background-color:#f0f0f0;border-radius:3px}.ql-snow .ql-editor .ql-code-block-container{margin-bottom:5px;margin-top:5px;padding:5px 10px}.ql-snow .ql-editor code{font-size:85%;padding:2px 4px}.ql-snow .ql-editor .ql-code-block-container{background-color:#23241f;color:#f8f8f2;overflow:visible}.ql-snow .ql-editor img{max-width:100%}.ql-snow .ql-picker{color:#444;display:inline-block;float:left;font-size:14px;font-weight:500;height:24px;position:relative;vertical-align:middle}.ql-snow .ql-picker-label{cursor:pointer;display:inline-block;height:100%;padding-left:8px;padding-right:2px;position:relative;width:100%}.ql-snow .ql-picker-label::before{display:inline-block;line-height:22px}.ql-snow .ql-picker-options{background-color:#fff;display:none;min-width:100%;padding:4px 8px;position:absolute;white-space:nowrap}.ql-snow .ql-picker-options .ql-picker-item{cursor:pointer;display:block;padding-bottom:5px;padding-top:5px}.ql-snow .ql-picker.ql-expanded .ql-picker-label{color:#ccc;z-index:2}.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill{fill:#ccc}.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke{stroke:#ccc}.ql-snow .ql-picker.ql-expanded .ql-picker-options{display:block;margin-top:-1px;top:100%;z-index:1}.ql-snow .ql-color-picker,.ql-snow .ql-icon-picker{width:28px}.ql-snow .ql-color-picker .ql-picker-label,.ql-snow .ql-icon-picker .ql-picker-label{padding:2px 4px}.ql-snow .ql-color-picker .ql-picker-label svg,.ql-snow .ql-icon-picker .ql-picker-label svg{right:4px}.ql-snow .ql-icon-picker .ql-picker-options{padding:4px 0}.ql-snow .ql-icon-picker .ql-picker-item{height:24px;width:24px;padding:2px 4px}.ql-snow .ql-color-picker .ql-picker-options{padding:3px 5px;width:152px}.ql-snow .ql-color-picker .ql-picker-item{border:1px solid transparent;float:left;height:16px;margin:2px;padding:0;width:16px}.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg{position:absolute;margin-top:-9px;right:0;top:50%;width:18px}.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=''])::before{content:attr(data-label)}.ql-snow .ql-picker.ql-header{width:98px}.ql-snow .ql-picker.ql-header .ql-picker-label::before,.ql-snow .ql-picker.ql-header .ql-picker-item::before{content:'Normal'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before{content:'Heading 1'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before{content:'Heading 2'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before{content:'Heading 3'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before{content:'Heading 4'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before{content:'Heading 5'}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before{content:'Heading 6'}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before{font-size:2em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before{font-size:1.5em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before{font-size:1.17em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before{font-size:1em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before{font-size:.83em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before{font-size:.67em}.ql-snow .ql-picker.ql-font{width:108px}.ql-snow .ql-picker.ql-font .ql-picker-label::before,.ql-snow .ql-picker.ql-font .ql-picker-item::before{content:'Sans Serif'}.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]::before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before{content:'Serif'}.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]::before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before{content:'Monospace'}.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before{font-family:Georgia,Times New Roman,serif}.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before{font-family:Monaco,Courier New,monospace}.ql-snow .ql-picker.ql-size{width:98px}.ql-snow .ql-picker.ql-size .ql-picker-label::before,.ql-snow .ql-picker.ql-size .ql-picker-item::before{content:'Normal'}.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before{content:'Small'}.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before{content:'Large'}.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before{content:'Huge'}.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before{font-size:10px}.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before{font-size:18px}.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before{font-size:32px}.ql-snow .ql-color-picker.ql-background .ql-picker-item{background-color:#fff}.ql-snow .ql-color-picker.ql-color .ql-picker-item{background-color:#000}.ql-code-block-container{position:relative}.ql-code-block-container .ql-ui{right:5px;top:5px}.ql-toolbar.ql-snow{border:1px solid #ccc;box-sizing:border-box;font-family:'Helvetica Neue','Helvetica','Arial',sans-serif;padding:8px}.ql-toolbar.ql-snow .ql-formats{margin-right:15px}.ql-toolbar.ql-snow .ql-picker-label{border:1px solid transparent}.ql-toolbar.ql-snow .ql-picker-options{border:1px solid transparent;box-shadow:rgba(0,0,0,0.2) 0 2px 8px}.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label{border-color:#ccc}.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options{border-color:#ccc}.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover{border-color:#000}.ql-toolbar.ql-snow + .ql-container.ql-snow{border-top:0}.ql-snow .ql-tooltip{background-color:#fff;border:1px solid #ccc;box-shadow:0 0 5px #ddd;color:#444;padding:5px 12px;white-space:nowrap}.ql-snow .ql-tooltip::before{content:"Visit URL:";line-height:26px;margin-right:8px}.ql-snow .ql-tooltip input[type=text]{display:none;border:1px solid #ccc;font-size:13px;height:26px;margin:0;padding:3px 5px;width:170px}.ql-snow .ql-tooltip a.ql-preview{display:inline-block;max-width:200px;overflow-x:hidden;text-overflow:ellipsis;vertical-align:top}.ql-snow .ql-tooltip a.ql-action::after{border-right:1px solid #ccc;content:'Edit';margin-left:16px;padding-right:8px}.ql-snow .ql-tooltip a.ql-remove::before{content:'Remove';margin-left:8px}.ql-snow .ql-tooltip a{line-height:26px}.ql-snow .ql-tooltip.ql-editing a.ql-preview,.ql-snow .ql-tooltip.ql-editing a.ql-remove{display:none}.ql-snow .ql-tooltip.ql-editing input[type=text]{display:inline-block}.ql-snow .ql-tooltip.ql-editing a.ql-action::after{border-right:0;content:'Save';padding-right:0}.ql-snow .ql-tooltip[data-mode=link]::before{content:"Enter link:"}.ql-snow .ql-tooltip[data-mode=formula]::before{content:"Enter formula:"}.ql-snow .ql-tooltip[data-mode=video]::before{content:"Enter video:"}.ql-snow a{color:#06c}.ql-container.ql-snow{border:1px solid #ccc}
/*# sourceMappingURL=quill.snow.css.map */.rental-container {
  width: 100%;
  background-color: #ffffff;
  color: #171717;
  font-family: 'Pretendard', sans-serif;
  -webkit-font-smoothing: antialiased;
  padding-bottom: 96px;
}
.rental-container ::-moz-selection {
  background-color: #f5f5f5;
}
.rental-container ::selection {
  background-color: #f5f5f5;
}

/* HERO HEADER */
.rental-header {
  max-width: 1280px;
  margin: 0 auto;
  padding: 96px 24px 64px 24px;
  border-bottom: 1px solid #f5f5f5;
}
@media (min-width: 768px) {
  .rental-header {
    padding-top: 128px;
    padding-bottom: 96px;
  }
}
.rental-kicker {
  font-size: 19.2px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: #1e40af;
  text-transform: uppercase;
  display: block;
  margin-bottom: 12px;
}
.rental-title {
  font-size: 36px;
  font-weight: 300;
  letter-spacing: -0.025em;
  color: #171717;
  line-height: 1.25;
  margin: 0;
}
@media (min-width: 768px) {
  .rental-title {
    font-size: 48px;
    line-height: 1;
  }
}
.rental-title strong {
  font-weight: 500;
  color: #262626;
}
.rental-desc {
  margin-top: 24px;
  font-size: 16px;
  color: #525252;
  font-weight: 300;
  max-width: 100%;
  word-break: keep-all;
  line-height: 1.625;
}
@media (min-width: 768px) {
  .rental-desc { font-size: 18px; }
}

/* MAIN CONTENT */
.rental-main {
  max-width: 1280px;
  margin: 0 auto;
  padding: 64px 24px;
  display: flex;
  flex-direction: column;
  gap: 128px;
}
@media (min-width: 768px) {
  .rental-main {
    padding-top: 96px;
    padding-bottom: 96px;
    gap: 176px;
  }
}

/* SECTION */
.rental-section {
  display: flex;
  flex-direction: column;
  gap: 64px;
}

.rental-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px;
  align-items: center;
}
@media (min-width: 1024px) {
  .rental-grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 64px;
    align-items: flex-end;
  }
}

/* TEXT BLOCK */
.rental-text-block {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
@media (min-width: 1024px) {
  .rental-text-block { grid-column: span 7 / span 7; }
  .rental-text-block.order-last { order: 9999; }
}

.rental-label {
  display: flex;
  align-items: center;
  gap: 12px;
}
.rental-label-line {
  width: 6px;
  height: 20px;
  background-color: #2563eb;
  border-radius: 2px;
}
.rental-label-text {
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: #1e40af;
  text-transform: uppercase;
}

.rental-section-title {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.025em;
  color: #171717;
  line-height: 1.375;
  margin: 0;
}
@media (min-width: 768px) {
  .rental-section-title { font-size: 30px; }
}

.rental-quote {
  font-size: 14px;
  color: #a3a3a3;
  font-style: italic;
  font-weight: 300;
  font-family: serif;
  letter-spacing: 0.025em;
  margin: 0;
}
@media (min-width: 768px) {
  .rental-quote { font-size: 16px; }
}

.rental-hr {
  border: 0;
  border-top: 1px solid #e5e5e5;
  width: 100%;
  margin: 16px 0;
}

.rental-bullets {
  display: flex;
  flex-direction: column;
  gap: 12px;
  font-size: 19px;
  color: #262626;
  font-weight: 300;
  word-break: keep-all;
  line-height: 1.625;
}
@media (min-width: 768px) {
  .rental-bullets { font-size: 19px; }
}
.rental-bullets p {
  margin: 0;
  position: relative;
  padding-left: 18px;
}
.rental-bullets p::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.6em;
  width: 6px;
  height: 6px;
  background-color: #1e40af;
  border-radius: 1px;
  transform: rotate(45deg);
}
.rental-bullets strong { font-weight: 600; }

/* MEDIA BLOCK */
.rental-media-block {
  /* No specific styles needed unless handling order */
}
@media (min-width: 1024px) {
  .rental-media-block { grid-column: span 5 / span 5; }
  .rental-media-block.order-first { order: -9999; }
}

.rental-aspect-box {
  aspect-ratio: 4 / 3;
  background-color: #fafafa;
  border-radius: 40px;
  overflow: hidden;
  border: 1px solid #f5f5f5;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  position: relative;
}
.rental-aspect-box video,
.rental-aspect-box img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

/* OVERLAP LAYOUT */
.rental-overlap-container {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
}
.rental-overlap-main {
  width: 80%;
  height: 80%;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  border: 1px solid #f5f5f5;
  z-index: 1;
}
.rental-overlap-sub {
  width: 55%;
  height: 55%;
  position: absolute;
  bottom: 0;
  right: 0;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2);
  border: 4px solid #ffffff;
  z-index: 2;
  transition: transform 0.3s ease;
}
.rental-overlap-sub:hover {
  transform: scale(1.05);
}
.rental-overlap-main img,
.rental-overlap-sub img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.rental-badge {
  position: absolute;
  top: 16px;
  right: 16px;
  background-color: rgba(0, 0, 0, 0.5);
  color: #ffffff;
  font-size: 10px;
  letter-spacing: 0.1em;
  padding: 4px 12px;
  border-radius: 9999px;
  text-transform: uppercase;
  backdrop-filter: blur(4px);
}

/* CAROUSEL */
.rental-carousel {
  width: 100%;
  max-width: 1024px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.rental-carousel-inner {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  background-color: #fafafa;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  border: 1px solid #f5f5f5;
}
.rental-carousel-track {
  display: flex;
  height: 100%;
}
.rental-carousel-slide {
  min-width: 100%;
  height: 100%;
  position: relative;
  background-color: #fafafa;
}
.rental-carousel-slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.rental-carousel-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  background-color: rgba(255, 255, 255, 0.8);
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #171717;
  cursor: pointer;
  z-index: 10;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  transition: all 0.2s ease;
}
.rental-carousel-btn:hover {
  background-color: #ffffff;
  box-shadow: 0 4px 6px rgba(0,0,0,0.15);
  transform: translateY(-50%) scale(1.1);
}
.rental-carousel-btn.prev { left: 16px; }
.rental-carousel-btn.next { right: 16px; }
.rental-carousel-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
}
.rental-carousel-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #d4d4d4;
  border: none;
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 0;
}
.rental-carousel-dot.active {
  background-color: #2563eb;
  width: 32px;
  border-radius: 10px;
}

/* CTA SECTION */
.rental-cta {
  background-color: #fafafa;
  border-top: 1px solid #f5f5f5;
  padding: 80px 0;
  margin-top: 48px;
}
.rental-cta-inner {
  max-width: 896px;
  margin: 0 auto;
  padding: 0 24px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.rental-cta-title {
  font-size: 30px;
  font-weight: 500;
  color: #171717;
  margin: 0;
}
.rental-cta-desc {
  color: #737373;
  font-weight: 300;
  line-height: 1.625;
  font-size: 18px;
  margin: 0;
}
.rental-cta-desc br.hidden-md { display: none; }
@media (min-width: 768px) {
  .rental-cta-desc br.hidden-md { display: block; }
}

.rental-btn-group {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 16px;
  padding-top: 16px;
}
@media (min-width: 640px) {
  .rental-btn-group { flex-direction: row; flex-wrap: wrap; }
}
.rental-btn {
  width: 100%;
  padding: 16px 32px;
  border-radius: 9999px;
  font-weight: 500;
  transition: all 0.2s ease;
  text-decoration: none;
  box-sizing: border-box;
  text-align: center;
}
@media (min-width: 640px) {
  .rental-btn { width: auto; }
}
.rental-btn-outline {
  background-color: #ffffff;
  color: #1e3a8a;
  border: 1px solid #dbeafe;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.rental-btn-outline:hover {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}
.rental-btn-primary {
  background-color: #2563eb;
  color: #ffffff;
  border: 1px solid transparent;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}
.rental-btn-primary:hover {
  background-color: #1d4ed8;
}
.\!container {
  width:        100% !important;
}
.container {
  width:        100%;
}
@media (min-width: 640px) {
  .\!container {
    max-width:        640px !important;
  }
  .container {
    max-width:        640px;
  }
}
@media (min-width: 768px) {
  .\!container {
    max-width:        768px !important;
  }
  .container {
    max-width:        768px;
  }
}
@media (min-width: 1024px) {
  .\!container {
    max-width:        1024px !important;
  }
  .container {
    max-width:        1024px;
  }
}
@media (min-width: 1280px) {
  .\!container {
    max-width:        1280px !important;
  }
  .container {
    max-width:        1280px;
  }
}
@media (min-width: 1536px) {
  .\!container {
    max-width:        1536px !important;
  }
  .container {
    max-width:        1536px;
  }
}
.pointer-events-none {
  pointer-events:        none;
}
.visible {
  visibility:        visible;
}
.collapse {
  visibility:        collapse;
}
.fixed {
  position:        fixed;
}
.absolute {
  position:        absolute;
}
.relative {
  position:        relative;
}
.sticky {
  position:        sticky;
}
.inset-0 {
  inset:        0px;
}
.-left-12 {
  left:        -3rem;
}
.-left-6 {
  left:        -1.5rem;
}
.-right-12 {
  right:        -3rem;
}
.-right-3 {
  right:        -0.75rem;
}
.-top-12 {
  top:        -3rem;
}
.-top-3 {
  top:        -0.75rem;
}
.bottom-0 {
  bottom:        0px;
}
.bottom-1\/4 {
  bottom:        25%;
}
.bottom-6 {
  bottom:        1.5rem;
}
.bottom-\[20\%\] {
  bottom:        20%;
}
.left-0 {
  left:        0px;
}
.left-1\/2 {
  left:        50%;
}
.left-\[135\%\] {
  left:        135%;
}
.left-\[85\%\] {
  left:        85%;
}
.right-0 {
  right:        0px;
}
.right-10 {
  right:        2.5rem;
}
.top-0 {
  top:        0px;
}
.top-1\/2 {
  top:        50%;
}
.top-1\/4 {
  top:        25%;
}
.top-\[135\%\] {
  top:        135%;
}
.top-\[18\%\] {
  top:        18%;
}
.top-\[34\%\] {
  top:        34%;
}
.top-\[40\%\] {
  top:        40%;
}
.top-\[42\%\] {
  top:        42%;
}
.top-\[85\%\] {
  top:        85%;
}
.-z-10 {
  z-index:        -10;
}
.z-0 {
  z-index:        0;
}
.z-10 {
  z-index:        10;
}
.z-20 {
  z-index:        20;
}
.z-\[100\] {
  z-index:        100;
}
.order-first {
  order:        -9999;
}
.order-last {
  order:        9999;
}
.mx-6 {
  margin-left:        1.5rem;
  margin-right:        1.5rem;
}
.mx-8 {
  margin-left:        2rem;
  margin-right:        2rem;
}
.mx-auto {
  margin-left:        auto;
  margin-right:        auto;
}
.-ml-1 {
  margin-left:        -0.25rem;
}
.mb-1 {
  margin-bottom:        0.25rem;
}
.mb-10 {
  margin-bottom:        2.5rem;
}
.mb-12 {
  margin-bottom:        3rem;
}
.mb-16 {
  margin-bottom:        4rem;
}
.mb-2 {
  margin-bottom:        0.5rem;
}
.mb-20 {
  margin-bottom:        5rem;
}
.mb-24 {
  margin-bottom:        6rem;
}
.mb-3 {
  margin-bottom:        0.75rem;
}
.mb-4 {
  margin-bottom:        1rem;
}
.mb-5 {
  margin-bottom:        1.25rem;
}
.mb-6 {
  margin-bottom:        1.5rem;
}
.mb-8 {
  margin-bottom:        2rem;
}
.ml-2 {
  margin-left:        0.5rem;
}
.ml-auto {
  margin-left:        auto;
}
.mt-1 {
  margin-top:        0.25rem;
}
.mt-16 {
  margin-top:        4rem;
}
.mt-2 {
  margin-top:        0.5rem;
}
.mt-4 {
  margin-top:        1rem;
}
.mt-8 {
  margin-top:        2rem;
}
.mt-auto {
  margin-top:        auto;
}
.block {
  display:        block;
}
.inline-block {
  display:        inline-block;
}
.inline {
  display:        inline;
}
.flex {
  display:        flex;
}
.inline-flex {
  display:        inline-flex;
}
.table {
  display:        table;
}
.table-cell {
  display:        table-cell;
}
.\!grid {
  display:        grid !important;
}
.grid {
  display:        grid;
}
.hidden {
  display:        none;
}
.aspect-square {
  aspect-ratio:        1 / 1;
}
.h-1 {
  height:        0.25rem;
}
.h-10 {
  height:        2.5rem;
}
.h-12 {
  height:        3rem;
}
.h-14 {
  height:        3.5rem;
}
.h-16 {
  height:        4rem;
}
.h-2 {
  height:        0.5rem;
}
.h-2\.5 {
  height:        0.625rem;
}
.h-20 {
  height:        5rem;
}
.h-24 {
  height:        6rem;
}
.h-3 {
  height:        0.75rem;
}
.h-3\/4 {
  height:        75%;
}
.h-32 {
  height:        8rem;
}
.h-4 {
  height:        1rem;
}
.h-40 {
  height:        10rem;
}
.h-5 {
  height:        1.25rem;
}
.h-6 {
  height:        1.5rem;
}
.h-64 {
  height:        16rem;
}
.h-\[2px\] {
  height:        2px;
}
.h-\[300px\] {
  height:        300px;
}
.h-\[350px\] {
  height:        350px;
}
.h-\[400px\] {
  height:        400px;
}
.h-\[450px\] {
  height:        450px;
}
.h-\[500px\] {
  height:        500px;
}
.h-\[85vh\] {
  height:        85vh;
}
.h-full {
  height:        100%;
}
.w-1\.5 {
  width:        0.375rem;
}
.w-10 {
  width:        2.5rem;
}
.w-12 {
  width:        3rem;
}
.w-14 {
  width:        3.5rem;
}
.w-16 {
  width:        4rem;
}
.w-2 {
  width:        0.5rem;
}
.w-24 {
  width:        6rem;
}
.w-3 {
  width:        0.75rem;
}
.w-3\/4 {
  width:        75%;
}
.w-32 {
  width:        8rem;
}
.w-4 {
  width:        1rem;
}
.w-4\/5 {
  width:        80%;
}
.w-5 {
  width:        1.25rem;
}
.w-6 {
  width:        1.5rem;
}
.w-64 {
  width:        16rem;
}
.w-8 {
  width:        2rem;
}
.w-\[2px\] {
  width:        2px;
}
.w-\[400px\] {
  width:        400px;
}
.w-\[500px\] {
  width:        500px;
}
.w-\[90\%\] {
  width:        90%;
}
.w-full {
  width:        100%;
}
.max-w-2xl {
  max-width:        42rem;
}
.max-w-3xl {
  max-width:        48rem;
}
.max-w-4xl {
  max-width:        56rem;
}
.max-w-5xl {
  max-width:        64rem;
}
.max-w-6xl {
  max-width:        72rem;
}
.max-w-\[280px\] {
  max-width:        280px;
}
.max-w-\[400px\] {
  max-width:        400px;
}
.max-w-lg {
  max-width:        32rem;
}
.max-w-md {
  max-width:        28rem;
}
.max-w-sm {
  max-width:        24rem;
}
.flex-1 {
  flex:        1 1 0%;
}
.flex-shrink {
  flex-shrink:        1;
}
.shrink-0 {
  flex-shrink:        0;
}
.border-collapse {
  border-collapse:        collapse;
}
.origin-top-left {
  transform-origin:        top left;
}
.-translate-x-1\/2 {
  --tw-translate-x:        -50%;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-x-1\/3 {
  --tw-translate-x:        -33.333333%;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-x-4 {
  --tw-translate-x:        -1rem;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-y-1\/2 {
  --tw-translate-y:        -50%;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-y-12 {
  --tw-translate-y:        -3rem;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-1\/2 {
  --tw-translate-x:        50%;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-1\/3 {
  --tw-translate-x:        33.333333%;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-12 {
  --tw-translate-x:        3rem;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-\[-100\%\] {
  --tw-translate-x:        -100%;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-1\/3 {
  --tw-translate-y:        33.333333%;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-rotate-45 {
  --tw-rotate:        -45deg;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-45 {
  --tw-rotate:        45deg;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-90 {
  --tw-rotate:        90deg;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.transform {
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.animate-\[fadeInUp_0\.6s_ease-out\] {
  animation:        fadeInUp 0.6s ease-out;
}
.animate-\[flowingLight_2s_ease-in-out_infinite\] {
  animation:        flowingLight 2s ease-in-out infinite;
}
.animate-\[shimmer_2s_infinite\] {
  animation:        shimmer 2s infinite;
}
@keyframes spin {
  to {
    transform:        rotate(360deg);
  }
}
.animate-\[spin_15s_linear_infinite\] {
  animation:        spin 15s linear infinite;
}
@keyframes ping {
  75%, 100% {
    transform:        scale(2);
    opacity:        0;
  }
}
.animate-ping {
  animation:        ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
}
.cursor-default {
  cursor:        default;
}
.cursor-not-allowed {
  cursor:        not-allowed;
}
.cursor-pointer {
  cursor:        pointer;
}
.resize {
  resize:        both;
}
.grid-cols-1 {
  grid-template-columns:        repeat(1, minmax(0, 1fr));
}
.grid-cols-4 {
  grid-template-columns:        repeat(4, minmax(0, 1fr));
}
.flex-col {
  flex-direction:        column;
}
.flex-wrap {
  flex-wrap:        wrap;
}
.items-start {
  align-items:        flex-start;
}
.items-center {
  align-items:        center;
}
.justify-center {
  justify-content:        center;
}
.justify-between {
  justify-content:        space-between;
}
.justify-items-center {
  justify-items:        center;
}
.gap-1 {
  gap:        0.25rem;
}
.gap-10 {
  gap:        2.5rem;
}
.gap-12 {
  gap:        3rem;
}
.gap-2 {
  gap:        0.5rem;
}
.gap-3 {
  gap:        0.75rem;
}
.gap-4 {
  gap:        1rem;
}
.gap-5 {
  gap:        1.25rem;
}
.gap-6 {
  gap:        1.5rem;
}
.gap-x-16 {
  -moz-column-gap:        4rem;
       column-gap:        4rem;
}
.gap-y-20 {
  row-gap:        5rem;
}
.overflow-hidden {
  overflow:        hidden;
}
.overflow-visible {
  overflow:        visible;
}
.break-keep {
  word-break:        keep-all;
}
.rounded {
  border-radius:        0.25rem;
}
.rounded-2xl {
  border-radius:        1rem;
}
.rounded-3xl {
  border-radius:        1.5rem;
}
.rounded-\[2\.5rem\] {
  border-radius:        2.5rem;
}
.rounded-\[3rem\] {
  border-radius:        3rem;
}
.rounded-full {
  border-radius:        9999px;
}
.rounded-lg {
  border-radius:        0.5rem;
}
.rounded-none {
  border-radius:        0px;
}
.rounded-xl {
  border-radius:        0.75rem;
}
.border {
  border-width:        1px;
}
.border-2 {
  border-width:        2px;
}
.border-4 {
  border-width:        4px;
}
.border-\[10px\] {
  border-width:        10px;
}
.border-\[12px\] {
  border-width:        12px;
}
.border-\[3px\] {
  border-width:        3px;
}
.border-b {
  border-bottom-width:        1px;
}
.border-b-2 {
  border-bottom-width:        2px;
}
.border-l-\[6px\] {
  border-left-width:        6px;
}
.border-r-2 {
  border-right-width:        2px;
}
.border-t {
  border-top-width:        1px;
}
.border-t-2 {
  border-top-width:        2px;
}
.border-t-\[4px\] {
  border-top-width:        4px;
}
.border-dashed {
  border-style:        dashed;
}
.border-none {
  border-style:        none;
}
.border-blue-100 {
  --tw-border-opacity:        1;
  border-color:        rgb(219 234 254 / var(--tw-border-opacity, 1));
}
.border-blue-400 {
  --tw-border-opacity:        1;
  border-color:        rgb(96 165 250 / var(--tw-border-opacity, 1));
}
.border-blue-500 {
  --tw-border-opacity:        1;
  border-color:        rgb(59 130 246 / var(--tw-border-opacity, 1));
}
.border-blue-600 {
  --tw-border-opacity:        1;
  border-color:        rgb(37 99 235 / var(--tw-border-opacity, 1));
}
.border-blue-700\/50 {
  border-color:        rgb(29 78 216 / 0.5);
}
.border-indigo-100 {
  --tw-border-opacity:        1;
  border-color:        rgb(224 231 255 / var(--tw-border-opacity, 1));
}
.border-indigo-400 {
  --tw-border-opacity:        1;
  border-color:        rgb(129 140 248 / var(--tw-border-opacity, 1));
}
.border-indigo-500 {
  --tw-border-opacity:        1;
  border-color:        rgb(99 102 241 / var(--tw-border-opacity, 1));
}
.border-indigo-700\/50 {
  border-color:        rgb(67 56 202 / 0.5);
}
.border-pink-500 {
  --tw-border-opacity:        1;
  border-color:        rgb(236 72 153 / var(--tw-border-opacity, 1));
}
.border-slate-100 {
  --tw-border-opacity:        1;
  border-color:        rgb(241 245 249 / var(--tw-border-opacity, 1));
}
.border-slate-100\/60 {
  border-color:        rgb(241 245 249 / 0.6);
}
.border-slate-200 {
  --tw-border-opacity:        1;
  border-color:        rgb(226 232 240 / var(--tw-border-opacity, 1));
}
.border-slate-300 {
  --tw-border-opacity:        1;
  border-color:        rgb(203 213 225 / var(--tw-border-opacity, 1));
}
.border-slate-600 {
  --tw-border-opacity:        1;
  border-color:        rgb(71 85 105 / var(--tw-border-opacity, 1));
}
.border-slate-700 {
  --tw-border-opacity:        1;
  border-color:        rgb(51 65 85 / var(--tw-border-opacity, 1));
}
.border-slate-700\/50 {
  border-color:        rgb(51 65 85 / 0.5);
}
.border-slate-800 {
  --tw-border-opacity:        1;
  border-color:        rgb(30 41 59 / var(--tw-border-opacity, 1));
}
.border-slate-900 {
  --tw-border-opacity:        1;
  border-color:        rgb(15 23 42 / var(--tw-border-opacity, 1));
}
.border-white {
  --tw-border-opacity:        1;
  border-color:        rgb(255 255 255 / var(--tw-border-opacity, 1));
}
.border-b-slate-600 {
  --tw-border-opacity:        1;
  border-bottom-color:        rgb(71 85 105 / var(--tw-border-opacity, 1));
}
.border-b-transparent {
  border-bottom-color:        transparent;
}
.border-l-blue-600 {
  --tw-border-opacity:        1;
  border-left-color:        rgb(37 99 235 / var(--tw-border-opacity, 1));
}
.border-l-slate-200 {
  --tw-border-opacity:        1;
  border-left-color:        rgb(226 232 240 / var(--tw-border-opacity, 1));
}
.border-l-transparent {
  border-left-color:        transparent;
}
.border-r-slate-600 {
  --tw-border-opacity:        1;
  border-right-color:        rgb(71 85 105 / var(--tw-border-opacity, 1));
}
.border-t-transparent {
  border-top-color:        transparent;
}
.bg-\[\#3d5a80\] {
  --tw-bg-opacity:        1;
  background-color:        rgb(61 90 128 / var(--tw-bg-opacity, 1));
}
.bg-\[\#6c8ebf\] {
  --tw-bg-opacity:        1;
  background-color:        rgb(108 142 191 / var(--tw-bg-opacity, 1));
}
.bg-\[\#7b88c6\] {
  --tw-bg-opacity:        1;
  background-color:        rgb(123 136 198 / var(--tw-bg-opacity, 1));
}
.bg-\[\#94a3b8\] {
  --tw-bg-opacity:        1;
  background-color:        rgb(148 163 184 / var(--tw-bg-opacity, 1));
}
.bg-\[\#98c1d9\] {
  --tw-bg-opacity:        1;
  background-color:        rgb(152 193 217 / var(--tw-bg-opacity, 1));
}
.bg-\[\#e07a5f\] {
  --tw-bg-opacity:        1;
  background-color:        rgb(224 122 95 / var(--tw-bg-opacity, 1));
}
.bg-\[\#e2e8f0\] {
  --tw-bg-opacity:        1;
  background-color:        rgb(226 232 240 / var(--tw-bg-opacity, 1));
}
.bg-\[\#ee6c4d\] {
  --tw-bg-opacity:        1;
  background-color:        rgb(238 108 77 / var(--tw-bg-opacity, 1));
}
.bg-black {
  --tw-bg-opacity:        1;
  background-color:        rgb(0 0 0 / var(--tw-bg-opacity, 1));
}
.bg-black\/60 {
  background-color:        rgb(0 0 0 / 0.6);
}
.bg-blue-100 {
  --tw-bg-opacity:        1;
  background-color:        rgb(219 234 254 / var(--tw-bg-opacity, 1));
}
.bg-blue-100\/90 {
  background-color:        rgb(219 234 254 / 0.9);
}
.bg-blue-200\/60 {
  background-color:        rgb(191 219 254 / 0.6);
}
.bg-blue-400 {
  --tw-bg-opacity:        1;
  background-color:        rgb(96 165 250 / var(--tw-bg-opacity, 1));
}
.bg-blue-50 {
  --tw-bg-opacity:        1;
  background-color:        rgb(239 246 255 / var(--tw-bg-opacity, 1));
}
.bg-blue-50\/50 {
  background-color:        rgb(239 246 255 / 0.5);
}
.bg-blue-500 {
  --tw-bg-opacity:        1;
  background-color:        rgb(59 130 246 / var(--tw-bg-opacity, 1));
}
.bg-blue-500\/5 {
  background-color:        rgb(59 130 246 / 0.05);
}
.bg-blue-600 {
  --tw-bg-opacity:        1;
  background-color:        rgb(37 99 235 / var(--tw-bg-opacity, 1));
}
.bg-blue-600\/20 {
  background-color:        rgb(37 99 235 / 0.2);
}
.bg-blue-900\/40 {
  background-color:        rgb(30 58 138 / 0.4);
}
.bg-emerald-400 {
  --tw-bg-opacity:        1;
  background-color:        rgb(52 211 153 / var(--tw-bg-opacity, 1));
}
.bg-indigo-100 {
  --tw-bg-opacity:        1;
  background-color:        rgb(224 231 255 / var(--tw-bg-opacity, 1));
}
.bg-indigo-50 {
  --tw-bg-opacity:        1;
  background-color:        rgb(238 242 255 / var(--tw-bg-opacity, 1));
}
.bg-indigo-50\/50 {
  background-color:        rgb(238 242 255 / 0.5);
}
.bg-indigo-500 {
  --tw-bg-opacity:        1;
  background-color:        rgb(99 102 241 / var(--tw-bg-opacity, 1));
}
.bg-indigo-500\/10 {
  background-color:        rgb(99 102 241 / 0.1);
}
.bg-indigo-600 {
  --tw-bg-opacity:        1;
  background-color:        rgb(79 70 229 / var(--tw-bg-opacity, 1));
}
.bg-indigo-700 {
  --tw-bg-opacity:        1;
  background-color:        rgb(67 56 202 / var(--tw-bg-opacity, 1));
}
.bg-indigo-900\/50 {
  background-color:        rgb(49 46 129 / 0.5);
}
.bg-pink-700 {
  --tw-bg-opacity:        1;
  background-color:        rgb(190 24 93 / var(--tw-bg-opacity, 1));
}
.bg-red-500 {
  --tw-bg-opacity:        1;
  background-color:        rgb(239 68 68 / var(--tw-bg-opacity, 1));
}
.bg-slate-200 {
  --tw-bg-opacity:        1;
  background-color:        rgb(226 232 240 / var(--tw-bg-opacity, 1));
}
.bg-slate-50 {
  --tw-bg-opacity:        1;
  background-color:        rgb(248 250 252 / var(--tw-bg-opacity, 1));
}
.bg-slate-700 {
  --tw-bg-opacity:        1;
  background-color:        rgb(51 65 85 / var(--tw-bg-opacity, 1));
}
.bg-slate-700\/50 {
  background-color:        rgb(51 65 85 / 0.5);
}
.bg-slate-800 {
  --tw-bg-opacity:        1;
  background-color:        rgb(30 41 59 / var(--tw-bg-opacity, 1));
}
.bg-slate-800\/50 {
  background-color:        rgb(30 41 59 / 0.5);
}
.bg-slate-900 {
  --tw-bg-opacity:        1;
  background-color:        rgb(15 23 42 / var(--tw-bg-opacity, 1));
}
.bg-white {
  --tw-bg-opacity:        1;
  background-color:        rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.bg-white\/20 {
  background-color:        rgb(255 255 255 / 0.2);
}
.bg-white\/80 {
  background-color:        rgb(255 255 255 / 0.8);
}
.bg-gradient-to-r {
  background-image:        linear-gradient(to right, var(--tw-gradient-stops));
}
.from-blue-600 {
  --tw-gradient-from:        #2563eb var(--tw-gradient-from-position);
  --tw-gradient-to:        rgb(37 99 235 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops:        var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-transparent {
  --tw-gradient-from:        transparent var(--tw-gradient-from-position);
  --tw-gradient-to:        rgb(0 0 0 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops:        var(--tw-gradient-from), var(--tw-gradient-to);
}
.via-blue-500 {
  --tw-gradient-to:        rgb(59 130 246 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops:        var(--tw-gradient-from), #3b82f6 var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.to-indigo-600 {
  --tw-gradient-to:        #4f46e5 var(--tw-gradient-to-position);
}
.to-transparent {
  --tw-gradient-to:        transparent var(--tw-gradient-to-position);
}
.bg-clip-text {
  -webkit-background-clip:        text;
          background-clip:        text;
}
.fill-blue-500\/10 {
  fill:        rgb(59 130 246 / 0.1);
}
.p-4 {
  padding:        1rem;
}
.p-5 {
  padding:        1.25rem;
}
.p-6 {
  padding:        1.5rem;
}
.p-8 {
  padding:        2rem;
}
.px-10 {
  padding-left:        2.5rem;
  padding-right:        2.5rem;
}
.px-12 {
  padding-left:        3rem;
  padding-right:        3rem;
}
.px-2 {
  padding-left:        0.5rem;
  padding-right:        0.5rem;
}
.px-3 {
  padding-left:        0.75rem;
  padding-right:        0.75rem;
}
.px-4 {
  padding-left:        1rem;
  padding-right:        1rem;
}
.px-6 {
  padding-left:        1.5rem;
  padding-right:        1.5rem;
}
.px-8 {
  padding-left:        2rem;
  padding-right:        2rem;
}
.py-0\.5 {
  padding-top:        0.125rem;
  padding-bottom:        0.125rem;
}
.py-1 {
  padding-top:        0.25rem;
  padding-bottom:        0.25rem;
}
.py-1\.5 {
  padding-top:        0.375rem;
  padding-bottom:        0.375rem;
}
.py-2 {
  padding-top:        0.5rem;
  padding-bottom:        0.5rem;
}
.py-20 {
  padding-top:        5rem;
  padding-bottom:        5rem;
}
.py-24 {
  padding-top:        6rem;
  padding-bottom:        6rem;
}
.py-5 {
  padding-top:        1.25rem;
  padding-bottom:        1.25rem;
}
.py-6 {
  padding-top:        1.5rem;
  padding-bottom:        1.5rem;
}
.pb-24 {
  padding-bottom:        6rem;
}
.pb-4 {
  padding-bottom:        1rem;
}
.pb-8 {
  padding-bottom:        2rem;
}
.pl-4 {
  padding-left:        1rem;
}
.pt-10 {
  padding-top:        2.5rem;
}
.pt-24 {
  padding-top:        6rem;
}
.pt-32 {
  padding-top:        8rem;
}
.text-left {
  text-align:        left;
}
.text-center {
  text-align:        center;
}
.text-right {
  text-align:        right;
}
.font-sans {
  font-family:        ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
.font-serif {
  font-family:        ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
}
.text-2xl {
  font-size:        1.5rem;
  line-height:        2rem;
}
.text-3xl {
  font-size:        1.875rem;
  line-height:        2.25rem;
}
.text-4xl {
  font-size:        2.25rem;
  line-height:        2.5rem;
}
.text-\[1\.15rem\] {
  font-size:        1.15rem;
}
.text-\[1\.1rem\] {
  font-size:        1.1rem;
}
.text-\[1\.2rem\] {
  font-size:        1.2rem;
}
.text-\[1\.3rem\] {
  font-size:        1.3rem;
}
.text-\[1\.8rem\] {
  font-size:        1.8rem;
}
.text-\[10px\] {
  font-size:        10px;
}
.text-\[13px\] {
  font-size:        13px;
}
.text-\[1rem\] {
  font-size:        1rem;
}
.text-\[6rem\] {
  font-size:        6rem;
}
.text-lg {
  font-size:        1.125rem;
  line-height:        1.75rem;
}
.text-sm {
  font-size:        0.875rem;
  line-height:        1.25rem;
}
.text-xl {
  font-size:        1.25rem;
  line-height:        1.75rem;
}
.text-xs {
  font-size:        0.75rem;
  line-height:        1rem;
}
.font-black {
  font-weight:        900;
}
.font-bold {
  font-weight:        700;
}
.font-extrabold {
  font-weight:        800;
}
.font-light {
  font-weight:        300;
}
.font-medium {
  font-weight:        500;
}
.font-normal {
  font-weight:        400;
}
.uppercase {
  text-transform:        uppercase;
}
.italic {
  font-style:        italic;
}
.leading-\[1\.1\] {
  line-height:        1.1;
}
.leading-\[1\.4\] {
  line-height:        1.4;
}
.leading-\[1\.7\] {
  line-height:        1.7;
}
.leading-\[1\.8\] {
  line-height:        1.8;
}
.leading-loose {
  line-height:        2;
}
.leading-none {
  line-height:        1;
}
.leading-relaxed {
  line-height:        1.625;
}
.leading-snug {
  line-height:        1.375;
}
.leading-tight {
  line-height:        1.25;
}
.tracking-\[0\.1em\] {
  letter-spacing:        0.1em;
}
.tracking-tight {
  letter-spacing:        -0.025em;
}
.tracking-tighter {
  letter-spacing:        -0.05em;
}
.tracking-wide {
  letter-spacing:        0.025em;
}
.tracking-widest {
  letter-spacing:        0.1em;
}
.text-black {
  --tw-text-opacity:        1;
  color:        rgb(0 0 0 / var(--tw-text-opacity, 1));
}
.text-blue-100 {
  --tw-text-opacity:        1;
  color:        rgb(219 234 254 / var(--tw-text-opacity, 1));
}
.text-blue-300 {
  --tw-text-opacity:        1;
  color:        rgb(147 197 253 / var(--tw-text-opacity, 1));
}
.text-blue-400 {
  --tw-text-opacity:        1;
  color:        rgb(96 165 250 / var(--tw-text-opacity, 1));
}
.text-blue-500 {
  --tw-text-opacity:        1;
  color:        rgb(59 130 246 / var(--tw-text-opacity, 1));
}
.text-blue-600 {
  --tw-text-opacity:        1;
  color:        rgb(37 99 235 / var(--tw-text-opacity, 1));
}
.text-blue-700 {
  --tw-text-opacity:        1;
  color:        rgb(29 78 216 / var(--tw-text-opacity, 1));
}
.text-indigo-100 {
  --tw-text-opacity:        1;
  color:        rgb(224 231 255 / var(--tw-text-opacity, 1));
}
.text-indigo-200 {
  --tw-text-opacity:        1;
  color:        rgb(199 210 254 / var(--tw-text-opacity, 1));
}
.text-indigo-300 {
  --tw-text-opacity:        1;
  color:        rgb(165 180 252 / var(--tw-text-opacity, 1));
}
.text-indigo-600 {
  --tw-text-opacity:        1;
  color:        rgb(79 70 229 / var(--tw-text-opacity, 1));
}
.text-indigo-700 {
  --tw-text-opacity:        1;
  color:        rgb(67 56 202 / var(--tw-text-opacity, 1));
}
.text-orange-100 {
  --tw-text-opacity:        1;
  color:        rgb(255 237 213 / var(--tw-text-opacity, 1));
}
.text-slate-100 {
  --tw-text-opacity:        1;
  color:        rgb(241 245 249 / var(--tw-text-opacity, 1));
}
.text-slate-300 {
  --tw-text-opacity:        1;
  color:        rgb(203 213 225 / var(--tw-text-opacity, 1));
}
.text-slate-400 {
  --tw-text-opacity:        1;
  color:        rgb(148 163 184 / var(--tw-text-opacity, 1));
}
.text-slate-500 {
  --tw-text-opacity:        1;
  color:        rgb(100 116 139 / var(--tw-text-opacity, 1));
}
.text-slate-600 {
  --tw-text-opacity:        1;
  color:        rgb(71 85 105 / var(--tw-text-opacity, 1));
}
.text-slate-700 {
  --tw-text-opacity:        1;
  color:        rgb(51 65 85 / var(--tw-text-opacity, 1));
}
.text-slate-800 {
  --tw-text-opacity:        1;
  color:        rgb(30 41 59 / var(--tw-text-opacity, 1));
}
.text-slate-900 {
  --tw-text-opacity:        1;
  color:        rgb(15 23 42 / var(--tw-text-opacity, 1));
}
.text-transparent {
  color:        transparent;
}
.text-white {
  --tw-text-opacity:        1;
  color:        rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.underline {
  text-decoration-line:        underline;
}
.line-through {
  text-decoration-line:        line-through;
}
.decoration-blue-200 {
  text-decoration-color:        #bfdbfe;
}
.decoration-blue-500 {
  text-decoration-color:        #3b82f6;
}
.decoration-indigo-200 {
  text-decoration-color:        #c7d2fe;
}
.decoration-indigo-300 {
  text-decoration-color:        #a5b4fc;
}
.decoration-2 {
  text-decoration-thickness:        2px;
}
.decoration-4 {
  text-decoration-thickness:        4px;
}
.underline-offset-2 {
  text-underline-offset:        2px;
}
.underline-offset-4 {
  text-underline-offset:        4px;
}
.opacity-0 {
  opacity:        0;
}
.opacity-20 {
  opacity:        0.2;
}
.opacity-40 {
  opacity:        0.4;
}
.opacity-50 {
  opacity:        0.5;
}
.opacity-80 {
  opacity:        0.8;
}
.opacity-90 {
  opacity:        0.9;
}
.shadow-2xl {
  --tw-shadow:        0 25px 50px -12px rgb(0 0 0 / 0.25);
  --tw-shadow-colored:        0 25px 50px -12px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_20px_50px_rgba\(15\2c 23\2c 42\2c 0\.05\)\] {
  --tw-shadow:        0 20px 50px rgba(15,23,42,0.05);
  --tw-shadow-colored:        0 20px 50px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_20px_60px_rgba\(15\2c 23\2c 42\2c 0\.06\)\] {
  --tw-shadow:        0 20px 60px rgba(15,23,42,0.06);
  --tw-shadow-colored:        0 20px 60px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[12px_12px_0px_0px_rgba\(15\2c 23\2c 42\2c 1\)\] {
  --tw-shadow:        12px 12px 0px 0px rgba(15,23,42,1);
  --tw-shadow-colored:        12px 12px 0px 0px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[4px_4px_0_rgba\(15\2c 23\2c 42\2c 0\.2\)\] {
  --tw-shadow:        4px 4px 0 rgba(15,23,42,0.2);
  --tw-shadow-colored:        4px 4px 0 var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[4px_4px_0px_0px_rgba\(15\2c 23\2c 42\2c 1\)\] {
  --tw-shadow:        4px 4px 0px 0px rgba(15,23,42,1);
  --tw-shadow-colored:        4px 4px 0px 0px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[6px_6px_0px_0px_rgba\(15\2c 23\2c 42\2c 1\)\] {
  --tw-shadow:        6px 6px 0px 0px rgba(15,23,42,1);
  --tw-shadow-colored:        6px 6px 0px 0px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[6px_6px_0px_0px_rgba\(59\2c 130\2c 246\2c 1\)\] {
  --tw-shadow:        6px 6px 0px 0px rgba(59,130,246,1);
  --tw-shadow-colored:        6px 6px 0px 0px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[8px_8px_0px_0px_rgba\(15\2c 23\2c 42\2c 1\)\] {
  --tw-shadow:        8px 8px 0px 0px rgba(15,23,42,1);
  --tw-shadow-colored:        8px 8px 0px 0px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[8px_8px_0px_0px_rgba\(59\2c 130\2c 246\2c 1\)\] {
  --tw-shadow:        8px 8px 0px 0px rgba(59,130,246,1);
  --tw-shadow-colored:        8px 8px 0px 0px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-inner {
  --tw-shadow:        inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored:        inset 0 2px 4px 0 var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-lg {
  --tw-shadow:        0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored:        0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-md {
  --tw-shadow:        0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored:        0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-sm {
  --tw-shadow:        0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored:        0 1px 2px 0 var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.outline {
  outline-style:        solid;
}
.blur {
  --tw-blur:        blur(8px);
  filter:        var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-3xl {
  --tw-blur:        blur(64px);
  filter:        var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[120px\] {
  --tw-blur:        blur(120px);
  filter:        var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[150px\] {
  --tw-blur:        blur(150px);
  filter:        var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.drop-shadow-2xl {
  --tw-drop-shadow:        drop-shadow(0 25px 25px rgb(0 0 0 / 0.15));
  filter:        var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.drop-shadow-md {
  --tw-drop-shadow:        drop-shadow(0 4px 3px rgb(0 0 0 / 0.07)) drop-shadow(0 2px 2px rgb(0 0 0 / 0.06));
  filter:        var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.drop-shadow-sm {
  --tw-drop-shadow:        drop-shadow(0 1px 1px rgb(0 0 0 / 0.05));
  filter:        var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.drop-shadow-xl {
  --tw-drop-shadow:        drop-shadow(0 20px 13px rgb(0 0 0 / 0.03)) drop-shadow(0 8px 5px rgb(0 0 0 / 0.08));
  filter:        var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.grayscale {
  --tw-grayscale:        grayscale(100%);
  filter:        var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.filter {
  filter:        var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.backdrop-blur-md {
  --tw-backdrop-blur:        blur(12px);
  backdrop-filter:        var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-sm {
  --tw-backdrop-blur:        blur(4px);
  backdrop-filter:        var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-filter {
  backdrop-filter:        var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.transition {
  transition-property:        color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function:        cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration:        150ms;
}
.transition-all {
  transition-property:        all;
  transition-timing-function:        cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration:        150ms;
}
.transition-colors {
  transition-property:        color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function:        cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration:        150ms;
}
.transition-opacity {
  transition-property:        opacity;
  transition-timing-function:        cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration:        150ms;
}
.transition-shadow {
  transition-property:        box-shadow;
  transition-timing-function:        cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration:        150ms;
}
.transition-transform {
  transition-property:        transform;
  transition-timing-function:        cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration:        150ms;
}
.duration-300 {
  transition-duration:        300ms;
}
.duration-700 {
  transition-duration:        700ms;
}
.ease-in-out {
  transition-timing-function:        cubic-bezier(0.4, 0, 0.2, 1);
}

/* Assessment Component Scoped CSS (Derived from SEHA) */

:root {
  /* Primary: 딥블루 */
  --color-primary:        #0B2D6E;
  --color-primary-dark:   #071E4A;
  --color-primary-light:  #1A4BA0;

  /* Accent: 코발트블루 */
  --color-accent:         #2563EB;
  --color-accent-light:   #3B82F6;
  --color-accent-bright:  #60A5FA;
  --color-accent-dark:    #1D4ED8;

  /* Neutral */
  --color-white:          #FFFFFF;
  --color-bg:             #F4F7FC;
  --color-bg-deep:        #EBF0FA;
  --color-surface:        #FFFFFF;
  --color-border:         #D1DCF0;
  --color-border-light:   #E8EEF8;

  /* Text */
  --color-text-primary:   #0F1C3A;
  --color-text-secondary: #3C4F72;
  --color-text-muted:     #6B7FA8;
  --color-text-light:     #9AAAC8;
  --color-text:           #0F1C3A;

  /* Fonts */
  --font-sans: 'Pretendard', 'Noto Sans KR', sans-serif;
  --font-serif: 'Pretendard', 'Noto Sans KR', sans-serif;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes flowingLight {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

@keyframes pulseNode {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(1.2); }
}

@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

.hover\:-translate-y-1:hover {
  --tw-translate-y:        -0.25rem;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.hover\:-translate-y-2:hover {
  --tw-translate-y:        -0.5rem;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.hover\:scale-105:hover {
  --tw-scale-x:        1.05;
  --tw-scale-y:        1.05;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.hover\:border-l-\[6px\]:hover {
  border-left-width:        6px;
}

.hover\:border-blue-300:hover {
  --tw-border-opacity:        1;
  border-color:        rgb(147 197 253 / var(--tw-border-opacity, 1));
}

.hover\:border-blue-500\/30:hover {
  border-color:        rgb(59 130 246 / 0.3);
}

.hover\:border-blue-600:hover {
  --tw-border-opacity:        1;
  border-color:        rgb(37 99 235 / var(--tw-border-opacity, 1));
}

.hover\:border-indigo-600:hover {
  --tw-border-opacity:        1;
  border-color:        rgb(79 70 229 / var(--tw-border-opacity, 1));
}

.hover\:border-slate-800:hover {
  --tw-border-opacity:        1;
  border-color:        rgb(30 41 59 / var(--tw-border-opacity, 1));
}

.hover\:border-l-blue-600:hover {
  --tw-border-opacity:        1;
  border-left-color:        rgb(37 99 235 / var(--tw-border-opacity, 1));
}

.hover\:border-l-indigo-600:hover {
  --tw-border-opacity:        1;
  border-left-color:        rgb(79 70 229 / var(--tw-border-opacity, 1));
}

.hover\:bg-blue-700:hover {
  --tw-bg-opacity:        1;
  background-color:        rgb(29 78 216 / var(--tw-bg-opacity, 1));
}

.hover\:bg-slate-100:hover {
  --tw-bg-opacity:        1;
  background-color:        rgb(241 245 249 / var(--tw-bg-opacity, 1));
}

.hover\:bg-slate-200:hover {
  --tw-bg-opacity:        1;
  background-color:        rgb(226 232 240 / var(--tw-bg-opacity, 1));
}

.hover\:bg-slate-50:hover {
  --tw-bg-opacity:        1;
  background-color:        rgb(248 250 252 / var(--tw-bg-opacity, 1));
}

.hover\:bg-slate-800:hover {
  --tw-bg-opacity:        1;
  background-color:        rgb(30 41 59 / var(--tw-bg-opacity, 1));
}

.hover\:bg-slate-900:hover {
  --tw-bg-opacity:        1;
  background-color:        rgb(15 23 42 / var(--tw-bg-opacity, 1));
}

.hover\:shadow-\[10px_10px_0px_0px_rgba\(15\2c 23\2c 42\2c 1\)\]:hover {
  --tw-shadow:        10px 10px 0px 0px rgba(15,23,42,1);
  --tw-shadow-colored:        10px 10px 0px 0px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.hover\:shadow-\[12px_12px_0px_0px_rgba\(15\2c 23\2c 42\2c 1\)\]:hover {
  --tw-shadow:        12px 12px 0px 0px rgba(15,23,42,1);
  --tw-shadow-colored:        12px 12px 0px 0px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.hover\:shadow-\[12px_12px_0px_0px_rgba\(59\2c 130\2c 246\2c 1\)\]:hover {
  --tw-shadow:        12px 12px 0px 0px rgba(59,130,246,1);
  --tw-shadow-colored:        12px 12px 0px 0px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.hover\:shadow-\[6px_6px_0px_0px_rgba\(15\2c 23\2c 42\2c 1\)\]:hover {
  --tw-shadow:        6px 6px 0px 0px rgba(15,23,42,1);
  --tw-shadow-colored:        6px 6px 0px 0px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.hover\:shadow-\[8px_8px_0px_0px_rgba\(15\2c 23\2c 42\2c 1\)\]:hover {
  --tw-shadow:        8px 8px 0px 0px rgba(15,23,42,1);
  --tw-shadow-colored:        8px 8px 0px 0px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.hover\:shadow-\[8px_8px_0px_0px_rgba\(37\2c 99\2c 235\2c 0\.15\)\]:hover {
  --tw-shadow:        8px 8px 0px 0px rgba(37,99,235,0.15);
  --tw-shadow-colored:        8px 8px 0px 0px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.hover\:shadow-\[8px_8px_0px_0px_rgba\(79\2c 70\2c 229\2c 0\.15\)\]:hover {
  --tw-shadow:        8px 8px 0px 0px rgba(79,70,229,0.15);
  --tw-shadow-colored:        8px 8px 0px 0px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.hover\:shadow-md:hover {
  --tw-shadow:        0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored:        0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow:        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.group:hover .group-hover\:scale-105 {
  --tw-scale-x:        1.05;
  --tw-scale-y:        1.05;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.group:hover .group-hover\:scale-110 {
  --tw-scale-x:        1.1;
  --tw-scale-y:        1.1;
  transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.group:hover .group-hover\:bg-blue-200 {
  --tw-bg-opacity:        1;
  background-color:        rgb(191 219 254 / var(--tw-bg-opacity, 1));
}

.group:hover .group-hover\:bg-blue-500\/20 {
  background-color:        rgb(59 130 246 / 0.2);
}

.group:hover .group-hover\:bg-blue-800 {
  --tw-bg-opacity:        1;
  background-color:        rgb(30 64 175 / var(--tw-bg-opacity, 1));
}

.group:hover .group-hover\:bg-indigo-50 {
  --tw-bg-opacity:        1;
  background-color:        rgb(238 242 255 / var(--tw-bg-opacity, 1));
}

.group:hover .group-hover\:text-blue-400 {
  --tw-text-opacity:        1;
  color:        rgb(96 165 250 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-blue-50 {
  --tw-text-opacity:        1;
  color:        rgb(239 246 255 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-blue-500 {
  --tw-text-opacity:        1;
  color:        rgb(59 130 246 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-blue-600 {
  --tw-text-opacity:        1;
  color:        rgb(37 99 235 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-blue-700 {
  --tw-text-opacity:        1;
  color:        rgb(29 78 216 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-indigo-500 {
  --tw-text-opacity:        1;
  color:        rgb(99 102 241 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:text-indigo-700 {
  --tw-text-opacity:        1;
  color:        rgb(67 56 202 / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:opacity-100 {
  opacity:        1;
}

@media (min-width: 640px) {
  .sm\:flex-row {
    flex-direction:        row;
  }
}

@media (min-width: 768px) {
  .md\:mx-0 {
    margin-left:        0px;
    margin-right:        0px;
  }
  .md\:mb-0 {
    margin-bottom:        0px;
  }
  .md\:block {
    display:        block;
  }
  .md\:inline {
    display:        inline;
  }
  .md\:h-\[90vh\] {
    height:        90vh;
  }
  .md\:w-5\/12 {
    width:        41.666667%;
  }
  .md\:w-64 {
    width:        16rem;
  }
  .md\:w-7\/12 {
    width:        58.333333%;
  }
  .md\:grid-cols-2 {
    grid-template-columns:        repeat(2, minmax(0, 1fr));
  }
  .md\:flex-row {
    flex-direction:        row;
  }
  .md\:items-center {
    align-items:        center;
  }
  .md\:gap-16 {
    gap:        4rem;
  }
  .md\:gap-20 {
    gap:        5rem;
  }
  .md\:p-12 {
    padding:        3rem;
  }
  .md\:p-16 {
    padding:        4rem;
  }
  .md\:p-8 {
    padding:        2rem;
  }
  .md\:px-0 {
    padding-left:        0px;
    padding-right:        0px;
  }
  .md\:pb-32 {
    padding-bottom:        8rem;
  }
  .md\:pl-2 {
    padding-left:        0.5rem;
  }
  .md\:pt-40 {
    padding-top:        10rem;
  }
  .md\:text-2xl {
    font-size:        1.5rem;
    line-height:        2rem;
  }
  .md\:text-3xl {
    font-size:        1.875rem;
    line-height:        2.25rem;
  }
  .md\:text-4xl {
    font-size:        2.25rem;
    line-height:        2.5rem;
  }
  .md\:text-5xl {
    font-size:        3rem;
    line-height:        1;
  }
  .md\:text-\[1\.2rem\] {
    font-size:        1.2rem;
  }
  .md\:text-\[2\.2rem\] {
    font-size:        2.2rem;
  }
  .md\:text-\[2rem\] {
    font-size:        2rem;
  }
  .md\:text-\[3\.5rem\] {
    font-size:        3.5rem;
  }
  .md\:text-\[3rem\] {
    font-size:        3rem;
  }
  .md\:text-xl {
    font-size:        1.25rem;
    line-height:        1.75rem;
  }
  .md\:leading-\[1\.3\] {
    line-height:        1.3;
  }
}

@media (min-width: 1024px) {
  .lg\:sticky {
    position:        sticky;
  }
  .lg\:top-24 {
    top:        6rem;
  }
  .lg\:col-span-3 {
    grid-column:        span 3 / span 3;
  }
  .lg\:col-span-4 {
    grid-column:        span 4 / span 4;
  }
  .lg\:col-span-6 {
    grid-column:        span 6 / span 6;
  }
  .lg\:col-span-7 {
    grid-column:        span 7 / span 7;
  }
  .lg\:flex {
    display:        flex;
  }
  .lg\:w-\[280px\] {
    width:        280px;
  }
  .lg\:w-auto {
    width:        auto;
  }
  .lg\:rotate-0 {
    --tw-rotate:        0deg;
    transform:        translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }
  .lg\:grid-cols-10 {
    grid-template-columns:        repeat(10, minmax(0, 1fr));
  }
  .lg\:grid-cols-4 {
    grid-template-columns:        repeat(4, minmax(0, 1fr));
  }
  .lg\:flex-row {
    flex-direction:        row;
  }
  .lg\:items-end {
    align-items:        flex-end;
  }
  .lg\:justify-between {
    justify-content:        space-between;
  }
  .lg\:gap-12 {
    gap:        3rem;
  }
  .lg\:gap-6 {
    gap:        1.5rem;
  }
  .lg\:p-4 {
    padding:        1rem;
  }
  .lg\:text-\[3\.5rem\] {
    font-size:        3.5rem;
  }
}

@media (min-width: 1280px) {
  .xl\:w-20 {
    width:        5rem;
  }
}
