/* ==========================================================================
   CCPCH — Adaptación a pantallas medianas y pequeñas
   ========================================================================== */

@media (max-width: 1100px) {
  .mosaic-grid { grid-template-columns: repeat(2, 1fr); }
  .mosaic-card.large { grid-column: span 2; grid-row: span 1; min-height: 320px; }
  .mosaic-card.tall { grid-row: span 1; }
  .single-grid { grid-template-columns: 1fr; gap: 48px; }
  .single-sidebar { position: static; }
  .footer-top { grid-template-columns: 1fr 1fr; gap: 40px; }
  .cols-4 .cards-grid, .cols-4 .posts-grid, .posts-grid.cols-4 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 980px) {
  .nav-toggle { display: flex; }

  .nav-links {
    position: fixed; top: var(--nav-height); left: 0; right: 0;
    max-height: calc(100vh - var(--nav-height));
    flex-direction: column; align-items: stretch; gap: 0;
    padding: 12px 5vw 32px;
    background: var(--navy);
    border-bottom: 1px solid rgba(201, 151, 58, .2);
    overflow-y: auto;
    transform: translateY(-8px);
    opacity: 0; visibility: hidden; pointer-events: none;
    transition: opacity .25s var(--ease), transform .25s var(--ease), visibility .25s;
  }
  .navbar.is-open .nav-links { opacity: 1; visibility: visible; transform: none; pointer-events: auto; }

  .nav-links > li { border-bottom: 1px solid rgba(255, 255, 255, .06); }
  .nav-links a { padding: 14px 4px; font-size: .85rem; }
  .nav-links a.nav-cta { margin: 14px 0 0; text-align: center; }

  .dropdown {
    display: none; position: static;
    min-width: 0; padding: 0 0 10px 14px; margin: 0;
    background: transparent; border: none; box-shadow: none;
  }
  .has-dropdown:hover > .dropdown { display: none; }
  .has-dropdown.is-open > .dropdown { display: block; }
  .dropdown a { padding: 10px 4px; font-size: .8rem; }

  .nav-caret { display: none; }
  .dropdown-toggle {
    display: block;
    position: absolute; top: 6px; right: 0;
    width: 40px; height: 40px;
    background: transparent; border: none; cursor: pointer;
  }
  .dropdown-toggle::after {
    content: ''; position: absolute; top: 14px; left: 14px;
    width: 9px; height: 9px;
    border-right: 2px solid rgba(255, 255, 255, .7);
    border-bottom: 2px solid rgba(255, 255, 255, .7);
    transform: rotate(45deg);
    transition: transform .25s var(--ease);
  }
  .has-dropdown.is-open .dropdown-toggle::after { transform: rotate(225deg); }

  section { padding: 72px 0; }
  .ccpch-mosaic { padding: 72px 5vw; }

  .intro-grid { grid-template-columns: 1fr; gap: 44px; }
  .media-derecha .intro-photo { order: 0; }
  .badge-dorado { top: -14px; left: -12px; }
  .badge-rojo { bottom: -12px; right: -12px; }

  .tusan-strip { flex-direction: column; min-height: 0; }
  .tusan-strip.is-reversed { flex-direction: column; }
  .tusan-photo { min-height: 280px; }
  .tusan-photo::after { background: linear-gradient(to bottom, transparent 50%, var(--navy) 100%); }
  .tusan-content { flex: 1 1 auto; padding: 36px 5vw 56px; }

  .map-layout, .contact-layout { grid-template-columns: 1fr; }
  .person-lead, .edicion-destacada, .post-card-featured { grid-column: auto; }
  .person-lead, .edicion-destacada { flex-direction: column; }
  .person-lead .person-photo, .edicion-destacada .edicion-cover { flex: auto; }
  .post-card-featured .post-card-link { flex-direction: column; }
  .post-card-featured .post-card-img { flex: auto; aspect-ratio: 16 / 10; }
  .post-card-featured .post-card-body { padding: 24px; }
  .post-card-featured .post-card-title { font-size: 1.25rem; }

  .section-header-inline { flex-direction: column; align-items: flex-start; gap: 20px; }
}

@media (max-width: 720px) {
  body { font-size: 16px; }
  section { padding: 60px 0; }

  .ccpch-hero { min-height: 88vh; }
  .hero-content { padding: 110px 5vw 150px; }
  .hero-stats { flex-wrap: wrap; }
  .hero-stats .stat-item { flex: 1 0 50%; max-width: none; border-bottom: 1px solid rgba(255, 255, 255, .07); }
  .hero-stats .stat-item:nth-child(2n) { border-right: none; }
  .hero-actions .btn { width: 100%; }

  .page-banner { min-height: 320px; }
  .banner-content { padding-block: 40px 36px; }

  .cols-2 .cards-grid, .cols-3 .cards-grid, .cols-4 .cards-grid,
  .cols-2 .posts-grid, .cols-3 .posts-grid, .cols-4 .posts-grid,
  .posts-grid.cols-2, .posts-grid.cols-3, .posts-grid.cols-4,
  .cards-grid, .posts-grid { grid-template-columns: 1fr; }

  .mosaic-grid { grid-template-columns: 1fr; }
  .mosaic-card.large { min-height: 280px; }
  .mosaic-arrow { opacity: 1; transform: none; }

  .pillars-grid { grid-template-columns: 1fr; }
  .stat-row { gap: 26px; }
  .ccpch-stats .stat-row { gap: 32px; }

  .contact-form .form-row { grid-template-columns: 1fr; gap: 0; }
  .contact-form-wrap { padding: 26px 22px; }

  .newsletter-inner { flex-direction: column; align-items: stretch; }
  .newsletter-form { max-width: none; flex-direction: column; }

  .footer-top { grid-template-columns: 1fr; gap: 34px; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }

  .timeline-item { gap: 18px; }
  .timeline-marker { flex-basis: 40px; height: 40px; font-size: .8rem; }
  .timeline-vertical .timeline-list::before { left: 19px; }

  .gallery-carrusel .gallery-item { flex-basis: 250px; height: 190px; }
  .gallery-carrusel .gallery-item.tall { height: 250px; flex-basis: 200px; }

  .cta-banner-inner { padding: 70px 5vw; }
  .cta-banner-actions .btn { width: 100%; }

  .btn { padding: 13px 24px; }
  .back-to-top { right: 14px; bottom: 14px; }
}

@media print {
  .navbar, .site-footer, .back-to-top, .nav-toggle, .search-form, .breadcrumb { display: none !important; }
  .page-banner { margin-top: 0; min-height: 0; }
  .page-banner > img, .banner-overlay { display: none; }
  .banner-content h1 { color: #000; }
  body { font-size: 12pt; color: #000; }
  a { color: #000; text-decoration: underline; }
}
