/* ============================================================
   Telegram Premium06 - 라이트 모드 스타일시트
   대상: #tg-premium06-wrapper
   버전: v1.0.2
   ============================================================ */

/* ── 그누보드5 완전 리셋 ── */
#tg-premium06-wrapper,
#tg-premium06-wrapper *,
#tg-premium06-wrapper *::before,
#tg-premium06-wrapper *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: none;
    outline: none;
    text-decoration: none;
    list-style: none;
    background: none;
    font-style: normal;
}
#tg-premium06-wrapper h1,
#tg-premium06-wrapper h2,
#tg-premium06-wrapper h3,
#tg-premium06-wrapper h4,
#tg-premium06-wrapper h5,
#tg-premium06-wrapper h6 {
    font-size: inherit;
    font-weight: inherit;
    line-height: 1.35;
    letter-spacing: -0.02em;
}
#tg-premium06-wrapper p {
    margin-bottom: 14px !important;
    line-height: 1.85 !important;
}
#tg-premium06-wrapper p:last-child {
    margin-bottom: 0 !important;
}

/* ── Material Symbols 아이콘 폰트 강제 복구 (리셋 충돌 방지) ── */
#tg-premium06-wrapper .material-symbols-outlined {
    font-family: 'Material Symbols Outlined' !important;
    font-weight: normal !important;
    font-style: normal !important;
    font-size: 1.5rem !important;
    line-height: 1 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    display: inline-block !important;
    white-space: nowrap !important;
    word-wrap: normal !important;
    direction: ltr !important;
    -webkit-font-feature-settings: 'liga' !important;
    font-feature-settings: 'liga' !important;
    -webkit-font-smoothing: antialiased !important;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24 !important;
}

/* ── 디자인 토큰 (라이트 모드) ── */
#tg-premium06-wrapper {
    --prem06-gold:        #B8860B;   /* 라이트 배경 대비용 다크 골드 */
    --prem06-gold-bg:     #FFF8E7;   /* 골드 연한 배경 */
    --prem06-gold-border: #D4AF37;
    --prem06-wine:        #800020;
    --prem06-wine-dark:   #5C0016;
    --prem06-wine-light:  #F9EDEE;   /* 와인 연한 배경 */
    --prem06-bg:          #FFFFFF;   /* 흰색 배경 */
    --prem06-surface:     #FFFFFF;   /* 카드/패널 배경 */
    --prem06-surface-2:   #F0EBE8;   /* 보조 배경 */
    --prem06-border:      rgba(0, 0, 0, 0.08);
    --prem06-border-dark: rgba(0, 0, 0, 0.15);
    --prem06-text:        #1A1A1A;   /* 기본 텍스트 */
    --prem06-text-sub:    #4A4A4A;   /* 보조 텍스트 */
    --prem06-muted:       #777777;   /* 연한 텍스트 */
    --prem06-white:       #FFFFFF;
    --prem06-shadow:      0 2px 16px rgba(0, 0, 0, 0.08);
    --prem06-shadow-lg:   0 8px 32px rgba(0, 0, 0, 0.12);
    --prem06-transition:  all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);

    /* 폰트 크기 토큰 */
    --fs-xs:   .8rem;
    --fs-sm:   .9rem;
    --fs-base: 1rem;
    --fs-md:   1.05rem;
    --fs-lg:   1.2rem;
    --fs-xl:   1.45rem;

    /* 레이아웃 */
    max-width: 1100px;
    margin: 0 auto;
    width: 100%;
    overflow: hidden !important;
    background-color: var(--prem06-bg);
    color: var(--prem06-text);
    font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: var(--fs-base);
    line-height: 1.6;
}

/* ── 스크롤 애니메이션 ── */
#tg-premium06-wrapper .tg-premium06-motion {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}
#tg-premium06-wrapper .tg-premium06-motion.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* ── 공통 텍스트 ── */
#tg-premium06-wrapper .tg-premium06-text--gold {
    color: var(--prem06-wine);
}

/* ── 히어로 섹션 ── */
#tg-premium06-wrapper .tg-premium06-hero {
    position: relative !important;
    background: linear-gradient(150deg, var(--prem06-wine-dark) 0%, var(--prem06-wine) 60%, #A0003A 100%) !important;
    padding: 70px 40px 60px !important;
    text-align: center !important;
    border-radius: 0 0 48px 48px !important;
    margin-bottom: 50px !important;
    overflow: hidden !important;
}
#tg-premium06-wrapper .tg-premium06-hero::before {
    content: '' !important;
    position: absolute !important;
    top: -30% !important;
    left: -10% !important;
    width: 60% !important;
    height: 180% !important;
    background: radial-gradient(ellipse, rgba(255,255,255,0.08) 0%, transparent 70%) !important;
    pointer-events: none !important;
}
#tg-premium06-wrapper .tg-premium06-hero::after {
    content: '' !important;
    position: absolute !important;
    bottom: -20% !important;
    right: -5% !important;
    width: 40% !important;
    height: 120% !important;
    background: radial-gradient(ellipse, rgba(212,175,55,0.1) 0%, transparent 70%) !important;
    pointer-events: none !important;
}
#tg-premium06-wrapper .tg-premium06-hero__badge-group {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 28px !important;
    position: relative !important;
    z-index: 1 !important;
}
#tg-premium06-wrapper .tg-premium06-hero__eyebrow {
    display: inline-block !important;
    padding: 5px 18px !important;
    border: 1px solid rgba(255,255,255,0.5) !important;
    border-radius: 30px !important;
    font-size: var(--fs-xs) !important;
    color: rgba(255,255,255,0.9) !important;
    letter-spacing: 0.12em !important;
}
#tg-premium06-wrapper .tg-premium06-hero__icon-flow {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 4px !important;
}
#tg-premium06-wrapper .tg-premium06-hero__icon-main {
    font-size: 3.5rem !important;
    color: rgba(255,255,255,0.95) !important;
}
#tg-premium06-wrapper .tg-premium06-hero__icon-arrow {
    font-size: 1.4rem !important;
    color: rgba(255,255,255,0.4) !important;
}
#tg-premium06-wrapper .tg-premium06-hero__icon-sub {
    font-size: 1.8rem !important;
    color: rgba(255,255,255,0.7) !important;
}
#tg-premium06-wrapper .tg-premium06-hero__title {
    position: relative !important;
    z-index: 1 !important;
    font-size: clamp(1.6rem, 4.5vw, 2.4rem) !important;
    font-weight: 800 !important;
    color: #FFFFFF !important;
    line-height: 1.25 !important;
}
#tg-premium06-wrapper .tg-premium06-hero .tg-premium06-text--gold {
    color: #FFE08A !important;
}

/* ── 도입부 ── */
#tg-premium06-wrapper .tg-premium06-intro {
    background: var(--prem06-surface) !important;
    border-left: 4px solid var(--prem06-wine) !important;
    border-radius: 12px !important;
    padding: 36px 28px !important;
    margin-bottom: 40px !important;
    font-size: var(--fs-md) !important;
    color: var(--prem06-text-sub) !important;
    line-height: 1.9 !important;
    box-shadow: var(--prem06-shadow) !important;
}
#tg-premium06-wrapper .tg-premium06-intro strong {
    color: var(--prem06-wine) !important;
}

/* ── 섹션 공통 ── */
#tg-premium06-wrapper .tg-premium06-section {
    padding: 48px 0 !important;
    margin-bottom: 12px !important;
    text-align: left !important;
}
#tg-premium06-wrapper .tg-premium06-section__label {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 5px 14px !important;
    background: var(--prem06-wine-light) !important;
    border: 1px solid rgba(128,0,32,0.2) !important;
    border-radius: 20px !important;
    font-size: var(--fs-xs) !important;
    color: var(--prem06-wine) !important;
    font-weight: 600 !important;
    margin: 0 auto 14px auto !important;
    width: fit-content !important;
}
#tg-premium06-wrapper .tg-premium06-section__label .material-symbols-outlined {
    font-size: 1rem !important;
}
#tg-premium06-wrapper .tg-premium06-section__title {
    font-size: clamp(1.3rem, 3vw, 1.7rem) !important;
    font-weight: 700 !important;
    color: var(--prem06-text) !important;
    margin-bottom: 16px !important;
    text-align: center !important;
}
#tg-premium06-wrapper .tg-premium06-section > p {
    font-size: var(--fs-md) !important;
    color: var(--prem06-text-sub) !important;
    text-align: center !important;
    max-width: 680px !important;
    margin: 0 auto 32px auto !important;
    line-height: 1.85 !important;
}

/* ── 어두운 섹션 → 라이트 모드에서는 밝은 배경 ── */
#tg-premium06-wrapper .tg-premium06-section--dark {
    background: var(--prem06-surface) !important;
    border: 1px solid var(--prem06-border) !important;
    border-radius: 24px !important;
    padding: 48px 44px !important;
    margin-bottom: 40px !important;
    box-shadow: var(--prem06-shadow) !important;
}
#tg-premium06-wrapper .tg-premium06-section--dark p {
    color: var(--prem06-text-sub) !important;
}
#tg-premium06-wrapper .tg-premium06-section--dark strong {
    color: var(--prem06-wine) !important;
}
#tg-premium06-wrapper .tg-premium06-section__label--light {
    background: var(--prem06-wine-light) !important;
    border-color: rgba(128,0,32,0.2) !important;
    color: var(--prem06-wine) !important;
}
#tg-premium06-wrapper .tg-premium06-section__title--white {
    color: var(--prem06-text) !important;
}
#tg-premium06-wrapper .tg-premium06-section__desc--white {
    font-size: var(--fs-md) !important;
    color: var(--prem06-text-sub) !important;
    text-align: center !important;
    max-width: 680px !important;
    margin: 0 auto 32px auto !important;
    line-height: 1.85 !important;
}

/* ── 카드 그리드 ── */
#tg-premium06-wrapper .tg-premium06-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)) !important;
    gap: 20px !important;
    margin-bottom: 32px !important;
}
#tg-premium06-wrapper .tg-premium06-card {
    background: var(--prem06-surface) !important;
    border: 1px solid var(--prem06-border) !important;
    border-radius: 18px !important;
    padding: 28px 24px !important;
    transition: var(--prem06-transition) !important;
    box-shadow: var(--prem06-shadow) !important;
}
#tg-premium06-wrapper .tg-premium06-card:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(128,0,32,0.3) !important;
    box-shadow: var(--prem06-shadow-lg) !important;
}
#tg-premium06-wrapper .tg-premium06-card--featured {
    border-color: rgba(184,134,11,0.3) !important;
    background: var(--prem06-gold-bg) !important;
}
#tg-premium06-wrapper .tg-premium06-card__icon {
    font-size: 2.5rem !important;
    color: var(--prem06-wine) !important;
    display: block !important;
    margin-bottom: 16px !important;
}
#tg-premium06-wrapper .tg-premium06-card--featured .tg-premium06-card__icon {
    color: var(--prem06-gold) !important;
}
#tg-premium06-wrapper .tg-premium06-card__title {
    font-size: var(--fs-lg) !important;
    font-weight: 700 !important;
    color: var(--prem06-text) !important;
    margin-bottom: 10px !important;
}
#tg-premium06-wrapper .tg-premium06-card__text {
    font-size: var(--fs-base) !important;
    color: var(--prem06-text-sub) !important;
    line-height: 1.75 !important;
    margin-bottom: 0 !important;
}

/* ── 상향 제한 목록 ── */
#tg-premium06-wrapper .tg-premium06-limits {
    background: var(--prem06-gold-bg) !important;
    border: 1px solid rgba(184,134,11,0.25) !important;
    border-radius: 16px !important;
    padding: 28px 24px !important;
}
#tg-premium06-wrapper .tg-premium06-limits__title {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: var(--fs-lg) !important;
    font-weight: 700 !important;
    color: var(--prem06-gold) !important;
    margin-bottom: 16px !important;
}
#tg-premium06-wrapper .tg-premium06-limits__title .material-symbols-outlined {
    font-size: 1.5rem !important;
}
#tg-premium06-wrapper .tg-premium06-limits__list li {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    font-size: var(--fs-base) !important;
    color: var(--prem06-text) !important;
    padding: 10px 0 !important;
    border-bottom: 1px solid rgba(184,134,11,0.15) !important;
    line-height: 1.75 !important;
}
#tg-premium06-wrapper .tg-premium06-limits__list li:last-child {
    border-bottom: none !important;
}
#tg-premium06-wrapper .tg-premium06-limits__list .material-symbols-outlined {
    font-size: 1.2rem !important;
    color: var(--prem06-gold) !important;
    flex-shrink: 0 !important;
}
#tg-premium06-wrapper .tg-premium06-limits__list strong {
    color: var(--prem06-wine) !important;
}

/* ── 결제 카드 그리드 ── */
#tg-premium06-wrapper .tg-premium06-payment-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)) !important;
    gap: 20px !important;
}
#tg-premium06-wrapper .tg-premium06-payment-card {
    background: var(--prem06-surface-2) !important;
    border: 1px solid var(--prem06-border) !important;
    border-radius: 16px !important;
    padding: 28px 24px !important;
    transition: var(--prem06-transition) !important;
}
#tg-premium06-wrapper .tg-premium06-payment-card:hover {
    border-color: rgba(128,0,32,0.25) !important;
    box-shadow: var(--prem06-shadow) !important;
}
#tg-premium06-wrapper .tg-premium06-payment-card__header {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 14px !important;
    flex-wrap: wrap !important;
}
#tg-premium06-wrapper .tg-premium06-payment-card__header .material-symbols-outlined {
    font-size: 1.8rem !important;
    color: var(--prem06-wine) !important;
}
#tg-premium06-wrapper .tg-premium06-payment-card__header h3 {
    font-size: var(--fs-lg) !important;
    font-weight: 700 !important;
    color: var(--prem06-text) !important;
}
#tg-premium06-wrapper .tg-premium06-payment-card p {
    font-size: var(--fs-sm) !important;
    color: var(--prem06-text-sub) !important;
    margin-bottom: 14px !important;
    line-height: 1.75 !important;
}
#tg-premium06-wrapper .tg-premium06-badge {
    padding: 3px 10px !important;
    border-radius: 20px !important;
    font-size: var(--fs-xs) !important;
}
#tg-premium06-wrapper .tg-premium06-badge--recommend {
    background: var(--prem06-wine) !important;
    color: #fff !important;
    font-weight: 700 !important;
}
#tg-premium06-wrapper .tg-premium06-step-list {
    counter-reset: step-counter !important;
    padding: 0 !important;
    margin-bottom: 16px !important;
}
#tg-premium06-wrapper .tg-premium06-step-list li {
    counter-increment: step-counter !important;
    position: relative !important;
    padding: 10px 8px 10px 42px !important;
    font-size: var(--fs-sm) !important;
    color: var(--prem06-text) !important;
    border-bottom: 1px solid var(--prem06-border) !important;
    line-height: 1.75 !important;
}
#tg-premium06-wrapper .tg-premium06-step-list li::before {
    content: counter(step-counter) !important;
    position: absolute !important;
    left: 8px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 22px !important;
    height: 22px !important;
    background: var(--prem06-wine) !important;
    color: #fff !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
}
#tg-premium06-wrapper .tg-premium06-step-list li:last-child {
    border-bottom: none !important;
}
#tg-premium06-wrapper .tg-premium06-step-list strong {
    color: var(--prem06-wine) !important;
}
#tg-premium06-wrapper .tg-premium06-tip-box {
    background: #FFF8E7 !important;
    border: 1px solid rgba(184,134,11,0.25) !important;
    border-radius: 10px !important;
    padding: 12px 16px !important;
    font-size: var(--fs-sm) !important;
    color: var(--prem06-text-sub) !important;
    line-height: 1.75 !important;
}
#tg-premium06-wrapper .tg-premium06-tip-box strong {
    color: #7A5900 !important;
}

/* ── 가격 표 ── */
#tg-premium06-wrapper .tg-premium06-table-wrap {
    overflow-x: auto !important;
    background: var(--prem06-surface) !important;
    border: 1px solid var(--prem06-border) !important;
    border-radius: 16px !important;
    margin: 24px 0 !important;
    box-shadow: var(--prem06-shadow) !important;
}
#tg-premium06-wrapper .tg-premium06-table {
    width: 100% !important;
    border-collapse: collapse !important;
    min-width: 480px !important;
}
#tg-premium06-wrapper .tg-premium06-table th,
#tg-premium06-wrapper .tg-premium06-table td {
    padding: 16px 20px !important;
    text-align: left !important;
    border-bottom: 1px solid var(--prem06-border) !important;
    font-size: var(--fs-base) !important;
    line-height: 1.6 !important;
}
#tg-premium06-wrapper .tg-premium06-table th {
    color: var(--prem06-wine) !important;
    font-weight: 700 !important;
    background: var(--prem06-wine-light) !important;
}
#tg-premium06-wrapper .tg-premium06-table td {
    color: var(--prem06-text) !important;
}
#tg-premium06-wrapper .tg-premium06-table__row--highlight {
    background: #FFF8F9 !important;
}
#tg-premium06-wrapper .tg-premium06-table__row--highlight strong {
    color: var(--prem06-wine) !important;
}
#tg-premium06-wrapper .tg-premium06-caution {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    background: #FFF4F5 !important;
    border: 1px solid rgba(128,0,32,0.15) !important;
    border-radius: 12px !important;
    padding: 14px 18px !important;
}
#tg-premium06-wrapper .tg-premium06-caution .material-symbols-outlined {
    font-size: 1.3rem !important;
    color: var(--prem06-wine) !important;
    flex-shrink: 0 !important;
    margin-top: 2px !important;
}
#tg-premium06-wrapper .tg-premium06-caution p {
    font-size: var(--fs-sm) !important;
    color: var(--prem06-text-sub) !important;
    margin-bottom: 0 !important;
    line-height: 1.75 !important;
}
#tg-premium06-wrapper .tg-premium06-caution strong {
    color: var(--prem06-wine) !important;
}

/* ── 직장인 팁 ── */
#tg-premium06-wrapper .tg-premium06-tip-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)) !important;
    gap: 20px !important;
    margin-top: 24px !important;
}
#tg-premium06-wrapper .tg-premium06-tip-item {
    display: flex !important;
    gap: 16px !important;
    background: var(--prem06-surface) !important;
    border: 1px solid var(--prem06-border) !important;
    border-radius: 16px !important;
    padding: 28px 24px !important;
    box-shadow: var(--prem06-shadow) !important;
    transition: var(--prem06-transition) !important;
}
#tg-premium06-wrapper .tg-premium06-tip-item:hover {
    border-color: rgba(128,0,32,0.2) !important;
    box-shadow: var(--prem06-shadow-lg) !important;
}
#tg-premium06-wrapper .tg-premium06-tip-item > .material-symbols-outlined {
    font-size: 2rem !important;
    color: var(--prem06-wine) !important;
    flex-shrink: 0 !important;
}
#tg-premium06-wrapper .tg-premium06-tip-item h3 {
    font-size: var(--fs-lg) !important;
    font-weight: 700 !important;
    color: var(--prem06-text) !important;
    margin-bottom: 8px !important;
}
#tg-premium06-wrapper .tg-premium06-tip-item p {
    font-size: var(--fs-base) !important;
    color: var(--prem06-text-sub) !important;
    line-height: 1.75 !important;
    margin-bottom: 0 !important;
}

/* ── 결론 요약 (라이트 다크 그라데이션) ── */
#tg-premium06-wrapper .tg-premium06-summary {
    background: linear-gradient(150deg, var(--prem06-wine-dark) 0%, var(--prem06-wine) 100%) !important;
    border-radius: 24px !important;
    padding: 60px 56px !important;
    margin-top: 20px !important;
    text-align: center !important;
}
#tg-premium06-wrapper .tg-premium06-summary__title {
    font-size: var(--fs-xl) !important;
    font-weight: 800 !important;
    color: #FFFFFF !important;
    margin-bottom: 32px !important;
}
#tg-premium06-wrapper .tg-premium06-summary__title .material-symbols-outlined {
    color: #FFE08A !important;
    vertical-align: middle !important;
}
#tg-premium06-wrapper .tg-premium06-summary__flow {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 16px !important;
    margin-bottom: 36px !important;
    flex-wrap: wrap !important;
}
#tg-premium06-wrapper .tg-premium06-summary__step {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
}
#tg-premium06-wrapper .tg-premium06-summary__step .material-symbols-outlined {
    font-size: 2.5rem !important;
    color: #FFE08A !important;
}
#tg-premium06-wrapper .tg-premium06-summary__step p {
    font-size: var(--fs-sm) !important;
    color: rgba(255,255,255,0.85) !important;
    text-align: center !important;
    margin-bottom: 0 !important;
    line-height: 1.5 !important;
}
#tg-premium06-wrapper .tg-premium06-summary__arrow {
    font-size: 1.8rem !important;
    color: rgba(255,255,255,0.4) !important;
}
#tg-premium06-wrapper .tg-premium06-summary__checklist {
    text-align: left !important;
    max-width: 600px !important;
    margin: 0 auto 32px auto !important;
    background: rgba(255,255,255,0.08) !important;
    border-radius: 16px !important;
    padding: 20px 24px !important;
}
#tg-premium06-wrapper .tg-premium06-summary__checklist li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    padding: 10px 0 !important;
    border-bottom: 1px solid rgba(255,255,255,0.1) !important;
    font-size: var(--fs-base) !important;
    color: rgba(255,255,255,0.85) !important;
    line-height: 1.75 !important;
}
#tg-premium06-wrapper .tg-premium06-summary__checklist li:last-child {
    border-bottom: none !important;
}
#tg-premium06-wrapper .tg-premium06-summary__checklist .material-symbols-outlined {
    font-size: 1.2rem !important;
    color: #FFE08A !important;
    flex-shrink: 0 !important;
    margin-top: 2px !important;
}
#tg-premium06-wrapper .tg-premium06-summary__checklist strong {
    color: #FFFFFF !important;
}
#tg-premium06-wrapper .tg-premium06-summary__footer {
    font-size: var(--fs-sm) !important;
    color: rgba(255,255,255,0.6) !important;
}
#tg-premium06-wrapper .tg-premium06-summary__footer a {
    color: #FFE08A !important;
    text-decoration: underline !important;
}

/* ── 반응형 ── */
@media (max-width: 768px) {
    #tg-premium06-wrapper .tg-premium06-hero {
        padding: 50px 20px 40px !important;
        border-radius: 0 0 28px 28px !important;
    }
    #tg-premium06-wrapper .tg-premium06-section--dark {
        padding: 36px 20px !important;
    }
    #tg-premium06-wrapper .tg-premium06-summary {
        padding: 48px 24px !important;
    }
    #tg-premium06-wrapper .tg-premium06-summary__arrow {
        transform: rotate(90deg) !important;
    }
}