/* ========================================
   Toss Style Design System (마이그레이션 완료)
   토스 스타일 디자인 시스템 기반 리팩토링

   Note: 섹션 헤더 기본 스타일은 toss-section.css로 이동됨
         이 파일은 추가 스타일 및 특수 케이스만 포함
   ======================================== */

/* ========================================
   섹션 아이콘 래퍼 - 토스 스타일 둥근 배경
   (toss-section.css에 없는 고유 스타일)
   ======================================== */
.notion-section-icon-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--toss-radius-md);
    flex-shrink: 0;
}

.notion-section-icon-wrapper i {
    font-size: 16px;
    color: #ffffff;
}

/* 아이콘 색상 변형 - 토스 스타일 그라디언트 */
.notion-section-icon--purple {
    background: linear-gradient(135deg, #8B5CF6 0%, #A78BFA 100%);
}

.notion-section-icon--blue {
    background: linear-gradient(135deg, var(--toss-blue-primary) 0%, #60A5FA 100%);
}

.notion-section-icon--green {
    background: linear-gradient(135deg, var(--toss-status-success) 0%, #34D399 100%);
}

.notion-section-icon--orange {
    background: linear-gradient(135deg, var(--toss-status-warning) 0%, #FBBF24 100%);
}

.notion-section-icon--red {
    background: linear-gradient(135deg, var(--toss-status-error) 0%, #F87171 100%);
}

.notion-section-icon--pink {
    background: linear-gradient(135deg, #EC4899 0%, #F472B6 100%);
}

/* ========================================
   타이틀 강조 스타일
   ======================================== */
.notion-section-title-highlight {
    font-weight: 700;
}

/* 강조 색상 변형 - 토스 스타일 */
.notion-section-title-highlight--red {
    color: var(--toss-status-error);
}

.notion-section-title-highlight--blue {
    color: var(--toss-blue-primary);
}

.notion-section-title-highlight--orange {
    color: var(--toss-status-warning);
}

.notion-section-title-highlight--purple {
    color: #6940A5;
}

.notion-section-title-highlight--green {
    color: var(--toss-status-success);
}

/* 그라디언트 강조 */
.notion-section-title-highlight--gradient-hot {
    background: linear-gradient(135deg, #FF6B6B 0%, #FF8E53 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.notion-section-title-highlight--gradient-new {
    background: linear-gradient(135deg, #667EEA 0%, #764BA2 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ========================================
   섹션 링크 스타일
   ======================================== */
.notion-section-link {
    display: flex;
    align-items: center;
    gap: var(--toss-space-1);
    font-size: var(--toss-font-small);
    color: var(--toss-text-tertiary);
    text-decoration: none;
    transition: color var(--toss-duration-normal) var(--toss-ease);
}

.notion-section-link:hover {
    color: var(--toss-blue-primary);
}

/* ========================================
   태그/배지 - 토스 스타일
   ======================================== */
.notion-tag {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: var(--toss-radius-sm);
    font-size: var(--toss-font-caption);
    font-weight: 600;
    line-height: 1.4;
}

.notion-tag--default {
    background: var(--toss-bg-base);
    color: var(--toss-text-secondary);
}

.notion-tag--blue {
    background: rgba(49, 130, 246, 0.12);
    color: var(--toss-blue-primary);
}

.notion-tag--red {
    background: rgba(222, 54, 47, 0.12);
    color: var(--toss-status-error);
}

.notion-tag--green {
    background: rgba(55, 210, 141, 0.12);
    color: var(--toss-status-success);
}

.notion-tag--orange {
    background: rgba(253, 153, 51, 0.12);
    color: var(--toss-status-warning);
}

.notion-tag--purple {
    background: rgba(105, 64, 165, 0.12);
    color: #6940A5;
}

/* AI 태그 - 토스 프리미엄 스타일 */
.notion-tag--ai {
    font-family: var(--toss-font-sans);
    letter-spacing: 0.5px;
    background: linear-gradient(145deg, var(--toss-text-primary) 0%, #1F2937 50%, var(--toss-text-primary) 100%);
    color: #E5E7EB;
    border: 1px solid var(--toss-line-emphasized);
    box-shadow:
        inset 0 1px 1px rgba(255,255,255,0.15),
        inset 0 -1px 1px rgba(0,0,0,0.3),
        0 0 10px rgba(49, 130, 246, 0.3);
}

/* ========================================
   카드 - 토스 스타일
   ======================================== */
.notion-card {
    background: var(--toss-bg-white);
    border: 1px solid var(--toss-line-normal);
    border-radius: var(--toss-radius-lg);
    overflow: hidden;
    transition:
        box-shadow var(--toss-duration-normal) var(--toss-ease),
        transform var(--toss-duration-normal) var(--toss-ease);
}

.notion-card:hover {
    box-shadow: var(--toss-shadow-sm);
    transform: translateY(-2px);
}

.notion-card-content {
    padding: var(--toss-space-3) var(--toss-space-4);
}

.notion-card-title {
    font-size: var(--toss-font-body);
    font-weight: 600;
    color: var(--toss-text-primary);
    margin-bottom: var(--toss-space-1);
}

.notion-card-meta {
    font-size: var(--toss-font-caption);
    color: var(--toss-text-tertiary);
}

/* ========================================
   히어로 섹션 - 토스 스타일
   ======================================== */
.notion-hero {
    width: 100%;
    margin-bottom: var(--toss-space-8);
    padding: 0 var(--desktop-padding);
    box-sizing: border-box;
}

.notion-hero-banner {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 5;
    max-height: 280px;
    overflow: hidden;
    background: var(--toss-bg-base);
    border-radius: var(--toss-radius-lg);
}

.notion-hero-banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    opacity: 0.95;
}

/* 히어로 인디케이터 - 토스 스타일 */
.notion-hero-indicators {
    position: absolute;
    bottom: 16px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 6px;
    z-index: 10;
}

.notion-hero-indicator {
    width: 6px;
    height: 6px;
    border-radius: var(--toss-radius-full);
    background: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: all var(--toss-duration-normal) var(--toss-ease);
    border: none;
    padding: 0;
}

.notion-hero-indicator:hover {
    background: rgba(255, 255, 255, 0.8);
}

.notion-hero-indicator.active {
    background: rgba(255, 255, 255, 0.95);
    width: 18px;
    border-radius: 3px;
}

/* ========================================
   브랜드 소식 섹션 - 토스 스타일
   ======================================== */
.notion-stories-title {
    font-size: var(--toss-font-body-large);
    font-weight: 700;
    color: var(--toss-text-primary);
    line-height: var(--toss-line-height-title);
    margin-bottom: var(--toss-space-6);
    font-family: var(--toss-font-sans);
}

.notion-stories-highlight {
    font-family: var(--toss-font-sans);
    color: #B8860B;
    font-weight: 700;
    font-style: italic;
    letter-spacing: 0.5px;
}

/* ========================================
   반응형 - 태블릿
   (섹션 기본 스타일은 toss-section.css에서 처리)
   ======================================== */
@media (max-width: 1024px) {
    .notion-hero {
        padding: 0;
    }

    .notion-hero-banner {
        border-radius: 0;
        max-height: 240px;
    }
}

/* ========================================
   반응형 - 모바일
   (섹션 기본 스타일은 toss-section.css에서 처리)
   ======================================== */
@media (max-width: 767px) {
    .notion-hero-banner {
        aspect-ratio: 16 / 7;
        max-height: 180px;
    }

    .notion-hero-indicators {
        position: static;
        transform: none;
        margin-top: var(--toss-space-3);
        justify-content: center;
    }

    .notion-hero-indicator {
        background: var(--toss-grey-300);
    }

    .notion-hero-indicator.active {
        background: var(--toss-text-primary);
    }

    .notion-stories-title {
        font-size: var(--toss-font-body);
        margin-bottom: var(--toss-space-4);
    }
}

/* ========================================
   유틸리티 클래스 - 토스 스타일
   ======================================== */
.notion-text-primary {
    color: var(--toss-text-primary);
}

.notion-text-secondary {
    color: var(--toss-text-secondary);
}

.notion-text-muted {
    color: var(--toss-text-tertiary);
}

.notion-bg-gray {
    background: var(--toss-bg-base);
}

.notion-bg-hover:hover {
    background: var(--toss-bg-grey-opacity);
}

.notion-border {
    border: 1px solid var(--toss-line-normal);
}

.notion-rounded {
    border-radius: var(--toss-radius-md);
}

/* 섹션 구분선 - 토스 스타일 */
.notion-divider {
    width: 100%;
    height: 1px;
    background: var(--toss-line-weak);
    margin: var(--toss-space-12) 0;
}

/* 호버 효과 통일 - 토스 스타일 */
.notion-hoverable {
    transition: background var(--toss-duration-normal) var(--toss-ease);
    border-radius: var(--toss-radius-sm);
}

.notion-hoverable:hover {
    background: var(--toss-bg-grey-opacity);
}

/* ========================================
   카드 스타일 개선 - 토스 스타일
   ======================================== */

/* 카드 컨테이너 */
.notion-section .special-deals-container {
    gap: var(--toss-space-5) !important;
}

/* 카드 호버 효과 - 토스 스타일 (미묘한 lift) */
.notion-section .deal-card,
.notion-section .place-card,
.content-section .notion-section .deal-card,
.content-section .notion-section .place-card {
    transition:
        transform var(--toss-duration-normal) var(--toss-ease),
        box-shadow var(--toss-duration-normal) var(--toss-ease) !important;
    border-radius: var(--toss-radius-lg) !important;
    background: var(--toss-bg-white) !important;
    box-shadow: var(--toss-shadow-xs) !important;
}

.notion-section .deal-card:hover,
.notion-section .place-card:hover,
.content-section .notion-section .deal-card:hover,
.content-section .notion-section .place-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: var(--toss-shadow-sm) !important;
}

/* 카드 이미지 호버 효과 제거 */
.notion-section .deal-card-image::before,
.notion-section .place-card-image-inner {
    transition: none !important;
}

.notion-section .deal-card:hover .deal-card-image::before,
.notion-section .place-card:hover .place-card-image-inner {
    transform: none !important;
}

/* 카드 이미지 - 토스 스타일 둥근 모서리 */
.notion-section .deal-card-image,
.notion-section .place-card-image {
    border-radius: var(--toss-radius-lg) !important;
    overflow: hidden !important;
}

/* 카드 타이틀 - 토스 스타일 */
.notion-section .deal-title,
.notion-section .place-card-title {
    color: var(--toss-text-primary) !important;
    font-weight: 400 !important;
    font-size: 15px !important;
    line-height: var(--toss-line-height-body) !important;
    letter-spacing: var(--toss-letter-spacing) !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* 카드 위치/메타 정보 - 토스 스타일 */
.notion-section .deal-location,
.notion-section .place-card-location {
    color: var(--toss-text-tertiary) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
}

.notion-section .deal-location svg path {
    fill: var(--toss-text-tertiary) !important;
}

/* 카드 가격 - 토스 스타일 */
.notion-section .deal-current-price,
.notion-section .place-card-price {
    color: var(--toss-text-primary) !important;
    font-weight: 600 !important;
    font-size: 16px !important;
}

.notion-section .deal-current-price span {
    font-size: var(--toss-font-body) !important;
    font-weight: 400 !important;
    color: var(--toss-text-tertiary) !important;
}

/* 카드 정보 영역 */
.notion-section .deal-card-info,
.notion-section .deal-card-body,
.notion-section .place-card-info {
    padding: var(--toss-space-1) 0 !important;
}

/* 할인율 텍스트 - 토스 스타일 */
.notion-section .deal-discount {
    display: inline-flex !important;
    align-items: center !important;
    padding: 0 !important;
    background: none !important;
    color: var(--toss-status-error) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    border-radius: 0 !important;
}

/* 원래 가격 - 토스 스타일 */
.notion-section .deal-original-price {
    color: var(--toss-text-tertiary) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    text-decoration: line-through !important;
}

.notion-section .deal-original-price span {
    font-size: var(--toss-font-small) !important;
    color: var(--toss-text-tertiary) !important;
    font-weight: 400 !important;
}

/* 프로모션 뱃지 - 토스 스타일 */
.notion-section .promotion-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    padding: 4px 8px !important;
    background: rgba(253, 153, 51, 0.12) !important;
    border: none !important;
    border-radius: var(--toss-radius-sm) !important;
    font-size: var(--toss-font-caption) !important;
    font-weight: 600 !important;
    filter: none !important;
}

.notion-section .promotion-badge .fire-icon {
    font-size: 12px !important;
}

.notion-section .promotion-badge .promo-text {
    color: var(--toss-status-warning) !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
    -webkit-text-fill-color: var(--toss-status-warning) !important;
}

/* 카드 뱃지 컨테이너 - 토스 스타일 */
.notion-section .card-badges {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: var(--toss-space-2) !important;
    margin-top: 2px !important;
}

/* 뱃지 크기 고정 - 토스 스타일 */
.notion-section .card-badges .promotion-badge,
.notion-section .card-badges .pet-friendly-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    padding: 0 8px !important;
    border-radius: var(--toss-radius-sm) !important;
    font-size: var(--toss-font-caption) !important;
    font-weight: 600 !important;
    height: 24px !important;
    line-height: 22px !important;
    box-sizing: border-box !important;
    filter: none !important;
}

/* 반려동물 동반 가능 뱃지 - 토스 스타일 */
.notion-section .pet-friendly-badge {
    background: rgba(55, 210, 141, 0.12) !important;
    border: none !important;
}

.notion-section .pet-friendly-badge .pet-icon,
.notion-section .promotion-badge .fire-icon {
    font-size: 12px !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
}

.notion-section .pet-friendly-badge .pet-text,
.notion-section .promotion-badge .promo-text {
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
}

.notion-section .pet-friendly-badge .pet-text {
    color: var(--toss-status-success) !important;
}

/* AI Score - 토스 스타일 */
.notion-section .ai-score-number {
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
    -webkit-text-fill-color: var(--toss-blue-primary) !important;
    color: var(--toss-blue-primary) !important;
    animation: none !important;
}

/* 하트 아이콘 - 항상 표시 */
.notion-section .deal-heart-icon {
    opacity: 1 !important;
}

/* 카드 배지 - 토스 스타일 */
.notion-section .deal-badge,
.notion-section .place-badge {
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(8px) !important;
    border-radius: var(--toss-radius-sm) !important;
    font-size: var(--toss-font-caption) !important;
    font-weight: 600 !important;
    color: var(--toss-text-secondary) !important;
    padding: 4px 10px !important;
}

/* ========================================
   필터 섹션 - 토스 스타일
   ======================================== */

/* 필터 버튼 기본 스타일 */
.filter-section .filter-button {
    background: var(--toss-bg-base);
    color: var(--toss-text-secondary);
    border: none;
    border-radius: var(--toss-radius-md);
    padding: 8px 14px;
    font-size: var(--toss-font-body);
    font-weight: 600;
    cursor: pointer;
    transition: all var(--toss-duration-fast) var(--toss-ease);
}

.filter-section .filter-button:hover {
    background: var(--toss-bg-grey-opacity);
    color: var(--toss-text-primary);
}

.filter-section .filter-button.active {
    background: var(--toss-text-primary);
    color: var(--toss-bg-white);
}

/* 서브카테고리 필터 - 토스 스타일 */
.subcategory-filter,
.filter-button.subcategory-filter {
    background: var(--toss-bg-base) !important;
    color: var(--toss-text-secondary) !important;
    border: none !important;
    border-radius: var(--toss-radius-md) !important;
    padding: 8px 14px !important;
    font-size: var(--toss-font-body) !important;
    font-weight: 600 !important;
    cursor: pointer;
    transition: all var(--toss-duration-fast) var(--toss-ease) !important;
    position: relative;
    overflow: visible !important;
}

.subcategory-filter:hover,
.filter-button.subcategory-filter:hover {
    background: var(--toss-bg-grey-opacity) !important;
    color: var(--toss-text-primary) !important;
}

.subcategory-filter.active,
.filter-button.subcategory-filter.active {
    background: var(--toss-text-primary) !important;
    color: var(--toss-bg-white) !important;
    border: none !important;
}

/* Shimmer 효과 비활성화 */
.subcategory-filter.active::before,
.subcategory-filter.active::after,
.filter-button.subcategory-filter.active::before,
.filter-button.subcategory-filter.active::after {
    display: none !important;
    content: none !important;
}

/* 서브카테고리 아이콘 */
.subcategory-filter i,
.filter-button.subcategory-filter i {
    font-size: 12px !important;
    margin-right: 4px;
}

/* 서브카테고리 컨테이너 */
.subcategory-filters {
    gap: var(--toss-space-2) !important;
}

/* Additional Tab Section - 토스 스타일 */
.additional-tab-section {
    background: var(--toss-bg-white) !important;
    border-bottom: 1px solid var(--toss-line-weak) !important;
}

/* 위치 필터 버튼 - 토스 스타일 */
.filter-section .location-filter-btn {
    background: var(--toss-bg-base) !important;
    color: var(--toss-text-secondary) !important;
    border: none !important;
    border-radius: var(--toss-radius-md) !important;
    padding: 8px 14px !important;
    font-size: var(--toss-font-body) !important;
    font-weight: 600 !important;
    transition: all var(--toss-duration-fast) var(--toss-ease) !important;
    position: relative;
}

.filter-section .location-filter-btn:hover {
    background: var(--toss-bg-grey-opacity) !important;
}

.filter-section .location-filter-btn.active {
    background: var(--toss-blue-light) !important;
    color: var(--toss-blue-primary) !important;
    border: none !important;
}

/* Shimmer 효과 비활성화 */
.filter-section .location-filter-btn.active::before,
.filter-section .location-filter-btn.active::after {
    display: none !important;
}

.filter-section .location-filter-btn.active svg {
    filter: none !important;
    color: var(--toss-blue-primary) !important;
}

.filter-section .location-filter-btn.active svg path {
    fill: var(--toss-blue-primary) !important;
}

/* 거리 버튼 - 토스 스타일 */
.filter-section .distance-btn {
    background: var(--toss-bg-white);
    color: var(--toss-text-secondary);
    border: 1px solid var(--toss-line-normal);
    border-radius: var(--toss-radius-sm);
    padding: 6px 12px;
    font-size: var(--toss-font-caption);
    font-weight: 600;
    transition: all var(--toss-duration-fast) var(--toss-ease);
}

.filter-section .distance-btn:hover {
    border-color: var(--toss-line-emphasized);
    background: var(--toss-bg-base);
}

.filter-section .distance-btn.active {
    background: var(--toss-text-primary);
    color: var(--toss-bg-white);
    border-color: var(--toss-text-primary);
}

/* 할인 토글 - 토스 스타일 */
.filter-section .discount-toggle {
    background: var(--toss-bg-base);
    color: var(--toss-text-secondary);
    border: none;
    border-radius: var(--toss-radius-md);
    padding: 8px 14px;
    font-size: var(--toss-font-body);
    font-weight: 600;
    cursor: pointer;
    transition: all var(--toss-duration-fast) var(--toss-ease);
}

.filter-section .discount-toggle:hover {
    background: var(--toss-bg-grey-opacity);
}

.filter-section .discount-toggle.active {
    background: rgba(55, 210, 141, 0.12);
    color: var(--toss-status-success);
}

/* 가격 필터 버튼 - 토스 스타일 */
.filter-section .price-filter-button {
    background: var(--toss-bg-base) !important;
    color: var(--toss-text-secondary) !important;
    border: none !important;
    border-radius: var(--toss-radius-md) !important;
    padding: 8px 14px !important;
    font-size: var(--toss-font-body) !important;
    font-weight: 600 !important;
    transition: all var(--toss-duration-fast) var(--toss-ease) !important;
    position: relative;
}

.filter-section .price-filter-button:hover {
    background: var(--toss-bg-grey-opacity) !important;
}

.filter-section .price-filter-button.active {
    background: rgba(105, 64, 165, 0.12) !important;
    color: #6940A5 !important;
    border: none !important;
}

/* Shimmer 효과 비활성화 */
.filter-section .price-filter-button.active::before,
.filter-section .price-filter-button.active::after {
    display: none !important;
}

.filter-section .price-filter-button.active svg {
    filter: none !important;
    color: #6940A5 !important;
}

.filter-section .price-filter-button.active svg path {
    stroke: #6940A5 !important;
}

/* 가격 드롭다운 패널 - 토스 스타일 */
.filter-section .price-dropdown-panel {
    background: var(--toss-bg-white);
    border: 1px solid var(--toss-line-normal);
    border-radius: var(--toss-radius-xl);
    box-shadow: var(--toss-shadow-md);
}

.filter-section .price-panel-title {
    color: var(--toss-text-primary);
    font-size: var(--toss-font-body);
    font-weight: 600;
}

/* 가격 퀵 버튼 - 토스 스타일 */
.filter-section .price-quick-btn {
    background: var(--toss-bg-base);
    color: var(--toss-text-secondary);
    border: none;
    border-radius: var(--toss-radius-sm);
    font-size: var(--toss-font-caption);
    font-weight: 600;
    transition: all var(--toss-duration-fast) var(--toss-ease);
}

.filter-section .price-quick-btn:hover {
    background: var(--toss-bg-grey-opacity);
    color: var(--toss-text-primary);
}

/* 초기화 버튼 - 토스 스타일 */
.filter-section .filter-reset,
.filter-section .price-reset-btn {
    background: transparent;
    color: var(--toss-text-tertiary);
    border: none;
    font-size: var(--toss-font-body);
    font-weight: 500;
    cursor: pointer;
    transition: color var(--toss-duration-fast) var(--toss-ease);
}

.filter-section .filter-reset:hover,
.filter-section .price-reset-btn:hover {
    color: var(--toss-status-error);
}


/* ========================================
   스크롤바 - 토스 스타일
   ======================================== */
.notion-section ::-webkit-scrollbar {
    height: 4px;
}

.notion-section ::-webkit-scrollbar-track {
    background: transparent;
}

.notion-section ::-webkit-scrollbar-thumb {
    background: var(--toss-grey-300);
    border-radius: var(--toss-radius-full);
}

.notion-section ::-webkit-scrollbar-thumb:hover {
    background: var(--toss-grey-400);
}

/* ========================================
   인덱스 페이지 전용 - 토스 스타일
   ======================================== */

/* 콘텐츠 섹션 배경 */
.content-section {
    background: var(--toss-bg-white);
}

/* 섹션 간격 - 토스 스타일 */
.content-section .notion-section {
    margin-bottom: var(--toss-space-8) !important;
}

/* 섹션 헤더 - 토스 스타일 */
.content-section .notion-section-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    margin-bottom: var(--toss-space-3) !important;
    padding: 0 !important;
}

/* 더보기 링크 - 데스크톱 16px (서브타이틀과 동일) */
.content-section .notion-section-more {
    font-size: 16px !important;
    line-height: 1.5 !important;
}

/* 타이틀 그룹 - 토스 스타일 */
.content-section .notion-section-title-group {
    display: flex !important;
    align-items: center !important;
    gap: var(--toss-space-2) !important;
    cursor: pointer !important;
    transition: opacity var(--toss-duration-normal) var(--toss-ease) !important;
}

.content-section .notion-section-title-group:hover {
    opacity: 0.7 !important;
}

.content-section .notion-section-title-group:hover .notion-section-arrow {
    transform: translateX(3px) !important;
    color: var(--toss-blue-primary) !important;
}

/* 링크 없는 타이틀 */
.content-section .notion-section-title-group.no-link {
    cursor: default !important;
}

.content-section .notion-section-title-group.no-link:hover {
    opacity: 1 !important;
}

/* 이모지 */
.content-section .notion-section-emoji {
    font-size: var(--toss-font-title) !important;
    line-height: 1 !important;
}

/* 섹션 타이틀 - 데스크톱 20px */
.content-section .notion-section-title {
    font-size: 20px !important;
    font-weight: 600 !important;
    color: var(--toss-text-primary) !important;
    letter-spacing: var(--toss-letter-spacing) !important;
    line-height: var(--toss-line-height-title) !important;
    font-family: var(--toss-font-sans) !important;
    margin: 0 !important;
}

/* 섹션 서브타이틀 - 데스크톱 16px */
.content-section .notion-section-subtitle {
    font-size: 16px !important;
}

/* 화살표 */
.content-section .notion-section-arrow {
    font-size: var(--toss-font-body-large) !important;
    color: var(--toss-text-tertiary) !important;
    margin-left: var(--toss-space-1) !important;
    transition: transform var(--toss-duration-normal) var(--toss-ease), color var(--toss-duration-normal) var(--toss-ease) !important;
    font-weight: 300 !important;
}

/* 브랜드 소식 컨테이너 - 토스 스타일 */
.content-section .brand-updates-container {
    gap: var(--toss-space-5) !important;
}

/* ========================================
   반응형 - 토스 스타일
   ======================================== */

/* 태블릿 */
@media (max-width: 1024px) {
    .content-section .notion-section {
        margin-bottom: var(--toss-space-10) !important;
    }

    .content-section .notion-section-header {
        margin-bottom: var(--toss-space-4) !important;
        padding-left: 24px !important;
        padding-right: 24px !important;
        margin-left: -24px;
        width: calc(100% + 24px);
    }

    /* 태블릿: 타이틀/서브타이틀/더보기 원래 크기로 리셋 */
    .content-section .notion-section-title {
        font-size: var(--toss-font-body-large) !important;
    }

    .content-section .notion-section-subtitle {
        font-size: var(--toss-font-caption) !important;
    }

    .content-section .notion-section-more {
        font-size: var(--toss-font-caption) !important;
    }
}

/* 모바일 */
@media (max-width: 767px) {
    .content-section .notion-section {
        margin-bottom: var(--toss-space-8) !important;
    }

    /* RFQ CTA 버튼 직전 섹션 여백 축소 (CTA 여백 통일) */
    .content-section .notion-section:has(+ .rfq-cta-banner) {
        margin-bottom: 16px !important;
    }

    /* Story CTA 포함 섹션 여백 축소 */
    .content-section .notion-section:has(.story-cta-banner) {
        margin-bottom: 16px !important;
    }

    /* Story CTA 섹션 다음 section-divider marginTop 축소 */
    .content-section .notion-section:has(.story-cta-banner) + .section-divider {
        margin-top: 16px !important;
    }

    /* 모든 섹션-구분선 여백 16px 통일 */
    .content-section .notion-section:has(+ .section-divider) {
        margin-bottom: 16px !important;
    }

    .content-section .notion-section + .section-divider {
        margin-top: 16px !important;
    }

    .content-section .notion-section-header {
        margin-bottom: var(--toss-space-3) !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
        margin-left: -16px;
        width: calc(100% + 16px);
    }

    /* 모바일: 더보기 폰트 크기 원래대로 (위치만 유지) */
    .content-section .notion-section-more {
        font-size: var(--toss-font-caption) !important;
    }

    .content-section .notion-section-title {
        font-size: var(--toss-font-body) !important;
    }

    .content-section .notion-section-emoji {
        font-size: var(--toss-font-body-large) !important;
    }

    /* 모바일 카드 컨테이너 간격 */
    .notion-section .special-deals-container {
        gap: var(--toss-space-3) !important;
    }

    /* 모바일 카드 스타일 */
    .notion-section .deal-title,
    .notion-section .place-card-title {
        font-size: 14px !important;
    }

    .notion-section .deal-current-price,
    .notion-section .place-card-price {
        font-size: 14px !important;
    }

    .notion-section .deal-location,
    .notion-section .place-card-location {
        font-size: 14px !important;
    }

    .notion-section .deal-original-price {
        font-size: 12px !important;
    }

    /* 모바일 카드 정보 영역 */
    .notion-section .deal-card-info,
    .notion-section .deal-card-body,
    .notion-section .place-card-info {
        padding: 2px !important;
    }

    /* 모바일 AI score 텍스트 사이즈 */
    .notion-section .ai-score-number,
    .deal-card .ai-score-number {
        font-size: var(--toss-font-caption) !important;
    }

    .deal-price-section > div[style*="font-size:14px"] {
        font-size: var(--toss-font-caption) !important;
    }

    /* 모바일: 득템찬스, 공간랭킹 섹션 뱃지 숨김 */
    #discount-products-container .card-badges,
    #discount-products-container .promotion-badge,
    #discount-products-container .pet-friendly-badge,
    #popular-places-container .card-badges,
    #popular-places-container .promotion-badge,
    #popular-places-container .pet-friendly-badge {
        display: none !important;
    }

    /* 모바일: 상품 카드 그림자 제거 (데스크톱만 유지) */
    .deal-card,
    .deal-card:hover,
    .deal-card:active,
    .place-card,
    .place-card:hover,
    .place-card:active,
    .notion-section .deal-card,
    .notion-section .deal-card:hover,
    .notion-section .deal-card:active,
    .notion-section .place-card,
    .notion-section .place-card:hover,
    .notion-section .place-card:active,
    .content-section .notion-section .deal-card,
    .content-section .notion-section .place-card {
        box-shadow: none !important;
    }
}

/* ============================================
   가격 마스킹 스타일 (토스 스타일)
   ============================================ */
.deal-price-masked {
    display: flex;
    align-items: center;
    gap: 5px;
    color: #999;
    font-size: 16px;
    font-weight: 600;
}

.masked-lock-icon {
    flex-shrink: 0;
    color: #bbb;
}

.masked-dots {
    letter-spacing: 0.5px;
    color: #bbb;
}

.deal-price-masked-hint {
    font-size: 12px;
    color: #999;
    margin-top: 2px;
    font-weight: 400;
}

/* 모바일 반응형 */
@media (max-width: 768px) {
    .deal-price-masked {
        font-size: 14px;
        gap: 4px;
    }

    .deal-price-masked-hint {
        font-size: 11px;
    }
}