/* ══════════════════════════════════════════════════════════════
   Espresso Core — Responsive Styles v3.0
   Modern Magazine Redesign
   Breakpoints: 1140px, 1018px, 767px, 480px
   ══════════════════════════════════════════════════════════════ */

/* ── Tablet Landscape (<=1140px) ──────────────────────────── */
@media (max-width: 1140px) {
    /* Section */
    .md-espresso-section {
        padding: 48px 0;
    }

    .md-espresso-section__container {
        max-width: 100%;
        padding: 0 20px;
    }

    /* Slider */
    .md-espresso-slider {
        min-height: 480px;
    }

    .md-espresso-slider__slide {
        min-height: 480px;
    }

    .md-espresso-slider__title {
        font-size: 30px;
    }

    .md-espresso-slider__content {
        padding: 40px 36px;
    }

    /* Showbiz */
    .md-espresso-showbiz__layout {
        gap: 20px;
    }

    .md-espresso-card--editorial .md-espresso-card__image {
        min-height: 360px;
    }

    .md-espresso-card--editorial .md-espresso-card__title {
        font-size: 22px;
    }

    /* Page 3 */
    .md-espresso-page3__hero {
        height: 420px;
    }

    .md-espresso-page3__title {
        font-size: 30px;
    }

    /* Sport */
    .md-espresso-sport__layout {
        gap: 20px;
    }

    /* Video */
    .md-espresso-video__featured .md-espresso-card--video .md-espresso-card__image {
        min-height: 340px;
    }

    /* Platforms */
    .md-espresso-platforms__grid {
        gap: 16px;
    }

    /* Popular */
    .md-espresso-popular__grid {
        gap: 0 30px;
    }
}

/* ── Tablet Portrait (<=1018px) ───────────────────────────── */
@media (max-width: 1018px) {
    /* Section */
    .md-espresso-section {
        padding: 40px 0;
    }

    /* Slider */
    .md-espresso-slider {
        min-height: auto;
    }

    .md-espresso-slider__slide {
        min-height: auto;
        grid-template-columns: 50% 50%;
    }

    .md-espresso-slider__title {
        font-size: 26px;
    }

    .md-espresso-slider__content {
        padding: 32px 28px;
    }

    .md-espresso-slider__excerpt {
        font-size: 14px;
    }

    .md-espresso-slider__dots {
        right: 30px;
        bottom: 20px;
    }

    /* Hero thumbs */
    .md-espresso-hero-thumbs {
        grid-template-columns: repeat(4, 1fr);
        gap: 12px;
    }

    /* Showbiz: stack layout */
    .md-espresso-showbiz__layout {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .md-espresso-showbiz__sidebar {
        flex-direction: row;
        overflow-x: auto;
        gap: 12px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .md-espresso-showbiz__sidebar::-webkit-scrollbar {
        display: none;
    }

    .md-espresso-showbiz__sidebar .md-espresso-card--horizontal {
        flex: 0 0 280px;
    }

    .md-espresso-card--editorial .md-espresso-card__image {
        min-height: 320px;
    }

    /* Sport: stack grid */
    .md-espresso-sport__layout {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .md-espresso-sport__sidebar {
        padding: 16px;
    }

    /* Video */
    .md-espresso-video__featured .md-espresso-card--video .md-espresso-card__image {
        min-height: 300px;
    }

    .md-espresso-video__thumbs {
        grid-template-columns: repeat(3, 1fr);
    }

    /* Beauté */
    .md-espresso-beaute__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    /* Page 3 */
    .md-espresso-page3__hero {
        height: 380px;
    }

    .md-espresso-page3__title {
        font-size: 26px;
    }

    /* Platforms */
    .md-espresso-platforms__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Popular: single column */
    .md-espresso-popular__grid {
        grid-template-columns: 1fr;
        gap: 0;
    }

    /* Section header */
    .md-espresso-sh {
        margin-bottom: 24px;
    }

    /* Stories (Hollywood) */
    .md-espresso-stories__item {
        flex: 0 0 180px;
    }

    /* Ticker */
    .md-espresso-ticker__label {
        font-size: 9px;
        padding: 0 12px;
        letter-spacing: 1px;
    }
}

/* ── Mobile (<=767px) ─────────────────────────────────────── */
@media (max-width: 767px) {
    /* Section */
    .md-espresso-section {
        padding: 32px 0;
    }

    .md-espresso-section__container {
        padding: 0 16px;
    }

    /* Section header */
    .md-espresso-sh {
        margin-bottom: 20px;
    }

    .md-espresso-sh__label {
        font-size: 11px;
        letter-spacing: 2px;
    }

    .md-espresso-sh__more {
        font-size: 12px;
    }

    /* Slider: stack vertically */
    .md-espresso-slider {
        min-height: auto;
    }

    .md-espresso-slider__slide {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .md-espresso-slider__image {
        height: 300px;
    }

    .md-espresso-slider__image img {
        height: 300px;
    }

    .md-espresso-slider__content {
        padding: 28px 20px;
        background: var(--mde-cream);
    }

    .md-espresso-slider__title {
        font-size: 22px;
    }

    .md-espresso-slider__excerpt {
        font-size: 13px;
        margin-bottom: 16px;
    }

    .md-espresso-slider__cta {
        font-size: 12px;
    }

    .md-espresso-slider__dots {
        position: relative;
        bottom: auto;
        right: auto;
        justify-content: center;
        padding: 12px 0;
    }

    /* Hero thumbs */
    .md-espresso-hero-thumbs {
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
    }

    /* Card: Hero */
    .md-espresso-card--hero .md-espresso-card__image {
        min-height: 240px;
    }

    .md-espresso-card--hero .md-espresso-card__title {
        font-size: 16px;
    }

    .md-espresso-card--hero .md-espresso-card__overlay {
        padding: 16px;
    }

    /* Card: Editorial */
    .md-espresso-card--editorial .md-espresso-card__image {
        min-height: 280px;
    }

    .md-espresso-card--editorial .md-espresso-card__title {
        font-size: 20px;
    }

    .md-espresso-card--editorial .md-espresso-card__overlay {
        padding: 20px;
    }

    .md-espresso-card--editorial .md-espresso-card__excerpt {
        font-size: 13px;
    }

    /* Card: Standard */
    .md-espresso-card--standard .md-espresso-card__title {
        font-size: 15px;
    }

    .md-espresso-card--standard .md-espresso-card__excerpt {
        font-size: 12px;
    }

    /* Card: Story — reduce width */
    .md-espresso-stories__item {
        flex: 0 0 160px;
    }

    .md-espresso-card--story .md-espresso-card__title {
        font-size: 13px;
    }

    /* Showbiz */
    .md-espresso-showbiz__layout {
        grid-template-columns: 1fr;
    }

    .md-espresso-showbiz__sidebar {
        flex-direction: row;
        overflow-x: auto;
    }

    /* Sport */
    .md-espresso-sport__layout {
        grid-template-columns: 1fr;
    }

    .md-espresso-sport__sidebar {
        padding: 14px;
    }

    .md-espresso-sport__sidebar-title {
        font-size: 16px;
    }

    /* Zodiac: 3 columns */
    .md-espresso-zodia__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 12px;
    }

    .md-espresso-zodia__symbol {
        font-size: 28px;
    }

    .md-espresso-zodia__card {
        padding: 16px 8px;
    }

    .md-espresso-zodia__name {
        font-size: 12px;
    }

    /* Video: 2 column thumbs */
    .md-espresso-video__thumbs {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .md-espresso-video__featured .md-espresso-card--video .md-espresso-card__image {
        min-height: 220px;
    }

    .md-espresso-video__featured .md-espresso-card__play svg {
        width: 44px;
        height: 44px;
    }

    /* Beauté: 2 columns */
    .md-espresso-beaute__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }

    /* Pill tabs scroll on mobile */
    .md-espresso-tabs__nav--pills {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        flex-wrap: nowrap;
        padding-bottom: 4px;
        scrollbar-width: none;
    }

    .md-espresso-tabs__nav--pills::-webkit-scrollbar {
        display: none;
    }

    .md-espresso-tabs__tab--pill {
        padding: 6px 14px;
        font-size: 12px;
        white-space: nowrap;
        flex-shrink: 0;
    }

    /* Page 3 */
    .md-espresso-page3__hero {
        height: 320px;
    }

    .md-espresso-page3__title {
        font-size: 22px;
    }

    .md-espresso-page3__overlay {
        padding: 30px 20px;
    }

    .md-espresso-page3__strip {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    /* Platforms: 2 columns */
    .md-espresso-platforms__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    /* Popular: 1 column */
    .md-espresso-popular__grid {
        grid-template-columns: 1fr;
    }

    .md-espresso-popular__tabs {
        gap: 6px;
    }

    .md-espresso-popular__tab {
        padding: 6px 14px;
        font-size: 12px;
    }

    /* Typos */
    .md-espresso-typos__item {
        flex: 0 0 150px;
    }

    /* Newsletter */
    .md-espresso-section--newsletter {
        padding: 50px 0;
    }

    .md-espresso-newsletter__title {
        font-size: 26px;
    }

    .md-espresso-newsletter__subtitle {
        font-size: 14px;
    }

    .md-espresso-newsletter__input-wrap {
        flex-direction: column;
        border-radius: 6px;
    }

    .md-espresso-newsletter__input {
        border-radius: 6px 6px 0 0;
        border-bottom: 1px solid var(--mde-gray-200);
    }

    .md-espresso-newsletter__submit {
        border-radius: 0 0 6px 6px;
    }

    .md-espresso-social-icons__link {
        width: 36px;
        height: 36px;
    }

    /* Social club */
    .md-espresso-socialclub__platforms {
        gap: 6px;
    }

    .md-espresso-socialclub__platform {
        font-size: 11px;
        padding: 4px 10px;
    }

    /* Ticker */
    .md-espresso-ticker {
        height: 34px;
    }

    .md-espresso-ticker__label {
        font-size: 9px;
        padding: 0 10px;
        letter-spacing: 1px;
    }

    .md-espresso-ticker__item {
        font-size: 12px;
        padding: 0 16px;
        height: 34px;
    }

    /* Poll */
    .md-espresso-poll {
        padding: 20px;
    }

    .md-espresso-poll__question {
        font-size: 18px;
    }

    .md-espresso-poll__option {
        padding: 10px 14px;
    }

    /* Card: Horizontal */
    .md-espresso-card--horizontal .md-espresso-card__rank {
        font-size: 26px;
        min-width: 32px;
    }

    .md-espresso-card--horizontal .md-espresso-card__thumb {
        width: 64px;
        height: 48px;
    }

    /* Card: List */
    .md-espresso-card--list .md-espresso-card__rank {
        font-size: 26px;
        min-width: 30px;
    }

    .md-espresso-card--list .md-espresso-card__thumb {
        width: 64px;
        height: 48px;
    }

    /* Agenda */
    .md-espresso-agenda__timeline {
        padding-left: 32px;
    }

    .md-espresso-agenda__item::before {
        left: -26px;
        width: 10px;
        height: 10px;
    }
}

/* ── Small Mobile (<=480px) ───────────────────────────────── */
@media (max-width: 480px) {
    /* Section */
    .md-espresso-section {
        padding: 24px 0;
    }

    .md-espresso-section__container {
        padding: 0 12px;
    }

    /* Slider */
    .md-espresso-slider__image {
        height: 240px;
    }

    .md-espresso-slider__image img {
        height: 240px;
    }

    .md-espresso-slider__content {
        padding: 20px 16px;
    }

    .md-espresso-slider__title {
        font-size: 18px;
    }

    .md-espresso-slider__cat {
        font-size: 10px;
        letter-spacing: 2px;
    }

    .md-espresso-slider__excerpt {
        font-size: 12px;
        -webkit-line-clamp: 3;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    /* Hero thumbs */
    .md-espresso-hero-thumbs {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }

    /* Card: Hero */
    .md-espresso-card--hero .md-espresso-card__image {
        min-height: 200px;
    }

    .md-espresso-card--hero .md-espresso-card__title {
        font-size: 14px;
    }

    .md-espresso-card--hero .md-espresso-card__overlay {
        padding: 12px;
    }

    .md-espresso-card--hero .md-espresso-card__cat-label {
        font-size: 9px;
    }

    /* Card: Editorial */
    .md-espresso-card--editorial .md-espresso-card__image {
        min-height: 240px;
    }

    .md-espresso-card--editorial .md-espresso-card__title {
        font-size: 18px;
    }

    .md-espresso-card--editorial .md-espresso-card__overlay {
        padding: 16px;
    }

    /* Card: Standard */
    .md-espresso-card--standard .md-espresso-card__title {
        font-size: 14px;
    }

    /* Stories */
    .md-espresso-stories__item {
        flex: 0 0 140px;
    }

    .md-espresso-card--story .md-espresso-card__title {
        font-size: 12px;
    }

    .md-espresso-card--story .md-espresso-card__cat-label {
        font-size: 8px;
    }

    /* Zodiac: 2 columns */
    .md-espresso-zodia__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .md-espresso-zodia__symbol {
        font-size: 24px;
    }

    .md-espresso-zodia__card {
        padding: 14px 8px;
    }

    /* Video */
    .md-espresso-video__thumbs {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .md-espresso-video__featured .md-espresso-card--video .md-espresso-card__image {
        min-height: 180px;
    }

    /* Beauté: 1 column */
    .md-espresso-beaute__grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    /* Page 3 */
    .md-espresso-page3__hero {
        height: 260px;
    }

    .md-espresso-page3__title {
        font-size: 18px;
    }

    .md-espresso-page3__overlay {
        padding: 20px 16px;
    }

    .md-espresso-page3__label {
        font-size: 10px;
    }

    .md-espresso-page3__strip {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }

    /* Platforms: 1 column */
    .md-espresso-platforms__grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    /* Typos */
    .md-espresso-typos__item {
        flex: 0 0 130px;
    }

    .md-espresso-typos__caption {
        font-size: 11px;
    }

    /* Newsletter */
    .md-espresso-section--newsletter {
        padding: 36px 0;
    }

    .md-espresso-newsletter__title {
        font-size: 22px;
    }

    .md-espresso-newsletter__subtitle {
        font-size: 13px;
        margin-bottom: 20px;
    }

    /* Ticker */
    .md-espresso-ticker {
        height: 32px;
    }

    .md-espresso-ticker__label {
        font-size: 8px;
        padding: 0 8px;
    }

    .md-espresso-ticker__item {
        font-size: 11px;
        padding: 0 12px;
        height: 32px;
    }

    /* Badge */
    .md-espresso-badge {
        font-size: 8px;
        padding: 2px 6px;
    }

    /* Poll */
    .md-espresso-poll {
        padding: 16px;
        border-radius: 8px;
    }

    .md-espresso-poll__question {
        font-size: 16px;
    }

    .md-espresso-poll__option {
        padding: 10px 12px;
        gap: 8px;
    }

    .md-espresso-poll__submit {
        padding: 10px 24px;
        font-size: 12px;
    }

    /* Card: Horizontal */
    .md-espresso-card--horizontal .md-espresso-card__link {
        gap: 10px;
        padding: 12px 0;
    }

    .md-espresso-card--horizontal .md-espresso-card__rank {
        font-size: 22px;
        min-width: 28px;
    }

    .md-espresso-card--horizontal .md-espresso-card__title {
        font-size: 13px;
    }

    .md-espresso-card--horizontal .md-espresso-card__thumb {
        width: 56px;
        height: 42px;
    }

    /* Popular */
    .md-espresso-popular__tabs {
        overflow-x: auto;
        scrollbar-width: none;
        flex-wrap: nowrap;
    }

    .md-espresso-popular__tabs::-webkit-scrollbar {
        display: none;
    }

    .md-espresso-popular__tab {
        white-space: nowrap;
        flex-shrink: 0;
        padding: 5px 12px;
        font-size: 11px;
    }

    /* Social icons */
    .md-espresso-social-icons__link {
        width: 34px;
        height: 34px;
    }

    .md-espresso-social-icons__link svg {
        width: 16px;
        height: 16px;
    }

    /* Agenda */
    .md-espresso-agenda__timeline {
        padding-left: 28px;
    }

    .md-espresso-agenda__item {
        margin-bottom: 18px;
    }

    .md-espresso-agenda__item::before {
        left: -22px;
        width: 8px;
        height: 8px;
    }

    /* Section header */
    .md-espresso-sh__label {
        font-size: 10px;
        letter-spacing: 1.5px;
    }

    .md-espresso-sh__more {
        font-size: 11px;
    }
}