/* =========================================================
   테마(GeneratePress 등) 충돌 원천 차단 리셋
   ========================================================= */
.nasha-prevent-theme-conflict * { box-sizing: border-box !important; }
.nasha-prevent-theme-conflict p:empty, 
.nasha-prevent-theme-conflict br { display: none !important; }
.nasha-prevent-theme-conflict h2, .nasha-prevent-theme-conflict h3, .nasha-prevent-theme-conflict h4 {
    border: none !important; box-shadow: none !important; background: transparent !important; padding: 0 !important; margin: 0 !important;
}
.nasha-prevent-theme-conflict h2::before, .nasha-prevent-theme-conflict h2::after,
.nasha-prevent-theme-conflict h3::before, .nasha-prevent-theme-conflict h3::after { display: none !important; content: none !important; }
.nasha-prevent-theme-conflict a { text-decoration: none !important; color: inherit !important; border: none !important; transition: opacity 0.2s ease; }
.nasha-prevent-theme-conflict a:hover { text-decoration: none !important; opacity: 0.8 !important; }

/* =========================================================
   강력한 절대 비율 썸네일 래퍼 (찌그러짐 방지 & 크기 통일)
   ========================================================= */
.nasha-thumb-wrapper {
    position: relative;
    width: 100%;
    overflow: hidden;
    border-radius: 6px;
    background-color: #f1f5f9;
    display: block;
}
.nasha-thumb-wrapper img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}
.nasha-ratio-16-9 { aspect-ratio: 16 / 9; }
.nasha-ratio-4-3 { aspect-ratio: 4 / 3; }
.nasha-ratio-16-10 { aspect-ratio: 16 / 10; }

/* 공통 텍스트 박스 리셋 (항상 썸네일 상단에 맞춤: flex-start) */
.nasha-card-text { 
    display: flex; 
    flex-direction: column; 
    justify-content: flex-start; 
    min-width: 0; 
}
.nasha-card-text p { color: #666 !important; line-height: 1.55 !important; margin: 0 !important; word-break: keep-all !important; }
.nasha-card-text h2, .nasha-card-text h3, .nasha-card-text h4 { font-weight: 700 !important; line-height: 1.35 !important; margin-bottom: 8px !important; word-break: keep-all !important; color: #111 !important; }
.nasha-date { display: block; font-size: 12px !important; color: #999; margin-top: 6px; }

/* =========================================================
   Layout 1 (클래식 1+3+2)
   ========================================================= */
.nasha-lo1-grid { display: grid; grid-template-columns: 2.2fr 1fr; gap: 30px; align-items: start; margin: 30px 0; }
.nasha-lo1-main a { display: grid; grid-template-columns: 1.35fr 1fr; gap: 20px; margin-bottom: 24px; padding-bottom: 24px; border-bottom: 1px solid #eaeaea; align-items: flex-start; }
.nasha-lo1-bottom { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px; }
.nasha-lo1-right { display: flex; flex-direction: column; gap: 24px; }
.nasha-lo1-sidecard a.nasha-card-link { display: flex; flex-direction: column; gap: 14px; }

/* =========================================================
   Layout 2 (중앙 집중형 2+1+2)
   ========================================================= */
.nasha-lo2-wrapper { display: grid; grid-template-columns: 1fr 2fr 1fr; gap: 30px; margin: 30px 0; }
.nasha-lo2-col { display: flex; flex-direction: column; gap: 24px; }
.nasha-lo2-post .nasha-thumb-wrapper { margin-bottom: 14px; }

/* =========================================================
   Layout 3 (슬라이더 매거진) - 🔥 좌우 높이 및 여백 최적화
   ========================================================= */
.nasha-lo3-wrapper { 
    display: flex; 
    gap: 30px; 
    margin: 30px 0; 
    align-items: stretch; /* 좌/우 박스의 높이를 우측 콘텐츠 기준으로 강제 일치 */
}

/* 좌측 슬라이더 */
.nasha-lo3-left { 
    width: 50%;
    position: relative; /* 자식 요소인 swiper가 100% 채울 수 있게 기준점 역할 */
    border-radius: 12px; 
    overflow: hidden; 
    min-height: 350px; /* 내부 텍스트 보호용 최소 높이 */
}
.nasha-swiper { 
    position: absolute; 
    top: 0; left: 0; right: 0; bottom: 0; 
    width: 100%; height: 100%; 
}
.nasha-swiper .swiper-wrapper { height: 100%; }
.nasha-slide { 
    display: flex; 
    align-items: flex-end; 
    padding: 35px; /* 패딩을 약간 줄여서 타이트하게 */
    background-size: cover; 
    background-position: center; 
    height: 100%; 
    box-sizing: border-box; 
}
.nasha-slide-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, transparent, rgba(0,0,0,0.8)); }
.nasha-slide-content { position: relative; z-index: 2; width: 100%; }
.nasha-slide-content h2 a { color: #fff !important; text-shadow: 0 2px 5px rgba(0,0,0,0.5); }

/* 우측 리스트 (여백 다이어트 및 깔끔한 선 처리) */
.nasha-lo3-right { 
    width: 50%;
    display: flex; 
    flex-direction: column; 
    justify-content: space-between; /* 컴팩트해진 리스트들을 위아래 공간에 맞게 예쁘게 벌려줌 */
}
.nasha-lo3-list-item { 
    display: flex; 
    gap: 18px; 
    padding: 0 0 16px 0; /* 테두리 박스 대신 하단 선과 하단 여백만 부여 */
    border: none;
    border-bottom: 1px solid #eaeaea; 
    border-radius: 0; 
    align-items: flex-start; /* 썸네일 상단과 텍스트 상단을 칼같이 맞춤 */
}
.nasha-lo3-list-item:last-child {
    border-bottom: none; /* 마지막 줄은 선 제거 */
    padding-bottom: 0;
}
.nasha-lo3-thumb { width: 130px; flex-shrink: 0; } /* 썸네일 가로 길이를 컴팩트하게 줄임 */

/* =========================================================
   Layout 4 (7:3 분할 매거진)
   ========================================================= */
.nasha-lo4-wrapper { display: flex; gap: 40px; margin: 30px 0; }
.nasha-lo4-main-col { width: 68%; display: flex; flex-direction: column; gap: 40px; }
.nasha-lo4-side-col { width: 32%; display: flex; flex-direction: column; gap: 24px; }
.nasha-lo4-hero { display: flex; gap: 30px; align-items: flex-start; }
.nasha-hero-text { width: 45%; }
.nasha-hero-img { width: 55%; }
.nasha-lo4-bottom-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; }

/* 4번 레이아웃 우측 */
.nasha-side-item.large { display: flex; flex-direction: column; gap: 14px; }
.nasha-side-item.small { display: flex; gap: 18px; align-items: flex-start; border-top: 1px solid #eaeaea; padding-top: 24px; }
.nasha-side-item.small .nasha-thumb-link { width: 140px; flex-shrink: 0; } 
.nasha-side-item.small .nasha-card-text { flex: 1; }

/* =========================================================
   반응형 모바일 (공통)
   ========================================================= */
@media(max-width: 900px) {
    .nasha-lo1-grid, .nasha-lo1-main a, .nasha-lo1-bottom, .nasha-lo2-wrapper, .nasha-lo3-wrapper, .nasha-lo4-wrapper, .nasha-lo4-hero, .nasha-lo4-bottom-grid { 
        display: flex; flex-direction: column; width: 100%; 
    }
    .nasha-hero-text, .nasha-hero-img { width: 100%; }
    
    /* 모바일 세로 배치 시 좌/우 너비를 풀고 슬라이더의 높이를 다시 찾아줌 */
    .nasha-lo3-left, .nasha-lo3-right { width: 100%; }
    .nasha-lo3-left { height: 400px; } 
    .nasha-lo3-list-item { padding-bottom: 20px; }
}