/* Gridgirls.de Mobile Only Fix 147
   Nur iPhone/iPad. Desktop bleibt komplett unverändert.
   Ziel: mobile Karten, Buttons, Überschriften und Boxen sauber darstellen.
*/

@media (max-width: 1024px){

  html,
  body{
    overflow-x:hidden !important;
  }

  /* Seitenbreite mobil sicher begrenzen */
  .gg-content,
  main.gg-content,
  .gg-section,
  .section-inner,
  .content-inner,
  .home-section,
  .home-highlights,
  .highlights,
  .latest-posts,
  .archive-grid,
  .gallery-grid,
  .post-grid,
  .cards-grid,
  .gg-card-grid,
  .category-grid,
  .timeline-grid,
  .gg-overview-grid,
  .gg-gallery-real,
  .gg-gallery-built,
  .gg-topic-copy,
  .gg-faq-box{
    width:calc(100% - 28px) !important;
    max-width:calc(100% - 28px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
  }

  /* iPad: Bild/Text-Boxen untereinander */
  .gg-topic-split-hero,
  .gg-topic-split-135,
  .gg-box-topic-135,
  .gg-feature-row,
  .gg-boxenluder-feature{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:20px !important;
    width:calc(100% - 28px) !important;
    max-width:calc(100% - 28px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
  }

  .gg-topic-split-hero img,
  .gg-topic-split-135 img,
  .gg-box-topic-135 img,
  .gg-feature-row img,
  .gg-boxenluder-feature img{
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    object-fit:contain !important;
    display:block !important;
  }

  .gg-topic-split-copy,
  .gg-box-copy-135,
  .gg-feature-copy{
    padding:22px 18px !important;
    box-sizing:border-box !important;
  }

  /* Themenblöcke iPad 2-spaltig */
  .gg-topic-links{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:12px !important;
    width:calc(100% - 28px) !important;
    max-width:calc(100% - 28px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .gg-topic-links a{
    min-height:54px !important;
    padding:0 16px !important;
    font-size:13px !important;
    line-height:1.2 !important;
  }
}

@media (max-width: 700px){

  /* Übersichts-Karten mobil kompakt, ohne Desktop anzufassen */
  .card,
  .gg-card,
  .gallery-card,
  .post-card,
  .archive-card,
  .grid-card,
  .teaser-card,
  .gallery-teaser,
  .card-item,
  .post-item,
  .archive-item,
  .gallery-item,
  article[class*="card"],
  article[class*="post"],
  a[class*="card"]{
    width:100% !important;
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
  }

  /* Kartenbilder 16:9 */
  .card img,
  .gg-card img,
  .gallery-card img,
  .post-card img,
  .archive-card img,
  .grid-card img,
  .teaser-card img,
  .gallery-teaser img,
  .card-item img,
  .post-item img,
  .archive-item img,
  .gallery-item img,
  article[class*="card"] img,
  article[class*="post"] img,
  a[class*="card"] img{
    width:100% !important;
    height:auto !important;
    aspect-ratio:16/9 !important;
    object-fit:cover !important;
    display:block !important;
  }

  /* Wichtig: nur Überschriften IN Karten verkleinern */
  .card h1,.card h2,.card h3,.card h4,
  .gg-card h1,.gg-card h2,.gg-card h3,.gg-card h4,
  .gallery-card h1,.gallery-card h2,.gallery-card h3,.gallery-card h4,
  .post-card h1,.post-card h2,.post-card h3,.post-card h4,
  .archive-card h1,.archive-card h2,.archive-card h3,.archive-card h4,
  .grid-card h1,.grid-card h2,.grid-card h3,.grid-card h4,
  .teaser-card h1,.teaser-card h2,.teaser-card h3,.teaser-card h4,
  .gallery-teaser h1,.gallery-teaser h2,.gallery-teaser h3,.gallery-teaser h4,
  .card-item h1,.card-item h2,.card-item h3,.card-item h4,
  .post-item h1,.post-item h2,.post-item h3,.post-item h4,
  .archive-item h1,.archive-item h2,.archive-item h3,.archive-item h4,
  .gallery-item h1,.gallery-item h2,.gallery-item h3,.gallery-item h4,
  article[class*="card"] h1,article[class*="card"] h2,article[class*="card"] h3,article[class*="card"] h4,
  article[class*="post"] h1,article[class*="post"] h2,article[class*="post"] h3,article[class*="post"] h4,
  a[class*="card"] h1,a[class*="card"] h2,a[class*="card"] h3,a[class*="card"] h4,
  .card-title,
  .post-title,
  .archive-title,
  .gallery-title,
  .teaser-title,
  .entry-title{
    font-size:22px !important;
    line-height:1.15 !important;
    letter-spacing:.01em !important;
    margin-top:12px !important;
    margin-bottom:10px !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
    hyphens:none !important;
  }

  /* Kartenbeschreibung */
  .card p,
  .gg-card p,
  .gallery-card p,
  .post-card p,
  .archive-card p,
  .grid-card p,
  .teaser-card p,
  .gallery-teaser p,
  .card-item p,
  .post-item p,
  .archive-item p,
  .gallery-item p,
  article[class*="card"] p,
  article[class*="post"] p,
  a[class*="card"] p,
  .card-excerpt,
  .post-excerpt,
  .gallery-excerpt,
  .entry-summary{
    font-size:15px !important;
    line-height:1.52 !important;
    margin-bottom:14px !important;
  }

  /* Datum/Meta */
  .card .meta,.card .date,.card time,
  .gg-card .meta,.gg-card .date,.gg-card time,
  .gallery-card .meta,.gallery-card .date,.gallery-card time,
  .post-card .meta,.post-card .date,.post-card time,
  .archive-card .meta,.archive-card .date,.archive-card time,
  .grid-card .meta,.grid-card .date,.grid-card time,
  .card-item .meta,.card-item .date,.card-item time,
  .post-item .meta,.post-item .date,.post-item time,
  .archive-item .meta,.archive-item .date,.archive-item time,
  .gallery-item .meta,.gallery-item .date,.gallery-item time,
  .entry-meta,
  .card-meta{
    font-size:13px !important;
    line-height:1.3 !important;
    letter-spacing:.05em !important;
  }

  /* Galerie öffnen / Buttons mobil kompakt */
  .card .btn,.card .button,.card .gg-btn,.card .gallery-btn,.card .open-gallery,.card .gallery-open,.card .card-button,.card .read-more,
  .gg-card .btn,.gg-card .button,.gg-card .gg-btn,.gg-card .gallery-btn,.gg-card .open-gallery,.gg-card .gallery-open,.gg-card .card-button,.gg-card .read-more,
  .gallery-card .btn,.gallery-card .button,.gallery-card .gg-btn,.gallery-card .gallery-btn,.gallery-card .open-gallery,.gallery-card .gallery-open,.gallery-card .card-button,.gallery-card .read-more,
  .post-card .btn,.post-card .button,.post-card .gg-btn,.post-card .gallery-btn,.post-card .open-gallery,.post-card .gallery-open,.post-card .card-button,.post-card .read-more,
  .archive-card .btn,.archive-card .button,.archive-card .gg-btn,.archive-card .gallery-btn,.archive-card .open-gallery,.archive-card .gallery-open,.archive-card .card-button,.archive-card .read-more,
  .grid-card .btn,.grid-card .button,.grid-card .gg-btn,.grid-card .gallery-btn,.grid-card .open-gallery,.grid-card .gallery-open,.grid-card .card-button,.grid-card .read-more,
  article[class*="card"] .btn,article[class*="card"] .button,article[class*="card"] .gg-btn,article[class*="card"] .gallery-btn,article[class*="card"] .open-gallery,article[class*="card"] .gallery-open,article[class*="card"] .card-button,article[class*="card"] .read-more,
  a.btn,
  a.button{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:auto !important;
    max-width:100% !important;
    min-width:0 !important;
    min-height:0 !important;
    padding:12px 18px !important;
    font-size:14px !important;
    line-height:1.2 !important;
    letter-spacing:.05em !important;
    white-space:normal !important;
  }

  /* Boxenluder/SEO-Seiten mobil */
  .gg-content h2,
  main.gg-content h2,
  .gg-topic-copy h2,
  .gg-topic-split-copy h2,
  .gg-box-copy-135 h2,
  .gg-feature-copy h2{
    font-size:28px !important;
    line-height:1.08 !important;
  }

  .gg-content p,
  main.gg-content p,
  .gg-topic-copy p,
  .gg-topic-split-copy p,
  .gg-box-copy-135 p,
  .gg-feature-copy p,
  .gg-topic-note{
    font-size:15px !important;
    line-height:1.62 !important;
  }

  .gg-topic-links{
    grid-template-columns:1fr !important;
  }
}

@media (max-width: 430px){
  .card h1,.card h2,.card h3,.card h4,
  .gg-card h1,.gg-card h2,.gg-card h3,.gg-card h4,
  .gallery-card h1,.gallery-card h2,.gallery-card h3,.gallery-card h4,
  .post-card h1,.post-card h2,.post-card h3,.post-card h4,
  .archive-card h1,.archive-card h2,.archive-card h3,.archive-card h4,
  .grid-card h1,.grid-card h2,.grid-card h3,.grid-card h4,
  .teaser-card h1,.teaser-card h2,.teaser-card h3,.teaser-card h4,
  .gallery-teaser h1,.gallery-teaser h2,.gallery-teaser h3,.gallery-teaser h4,
  .card-item h1,.card-item h2,.card-item h3,.card-item h4,
  .post-item h1,.post-item h2,.post-item h3,.post-item h4,
  .archive-item h1,.archive-item h2,.archive-item h3,.archive-item h4,
  .gallery-item h1,.gallery-item h2,.gallery-item h3,.gallery-item h4,
  article[class*="card"] h1,article[class*="card"] h2,article[class*="card"] h3,article[class*="card"] h4,
  article[class*="post"] h1,article[class*="post"] h2,article[class*="post"] h3,article[class*="post"] h4,
  a[class*="card"] h1,a[class*="card"] h2,a[class*="card"] h3,a[class*="card"] h4,
  .card-title,
  .post-title,
  .archive-title,
  .gallery-title,
  .teaser-title,
  .entry-title{
    font-size:21px !important;
    line-height:1.14 !important;
  }

  .gg-content,
  main.gg-content,
  .gg-section,
  .section-inner,
  .content-inner,
  .home-section,
  .home-highlights,
  .highlights,
  .latest-posts,
  .archive-grid,
  .gallery-grid,
  .post-grid,
  .cards-grid,
  .gg-card-grid,
  .category-grid,
  .timeline-grid,
  .gg-overview-grid,
  .gg-gallery-real,
  .gg-gallery-built,
  .gg-topic-copy,
  .gg-faq-box,
  .gg-topic-split-hero,
  .gg-topic-split-135,
  .gg-box-topic-135,
  .gg-feature-row,
  .gg-boxenluder-feature,
  .gg-topic-links{
    width:calc(100% - 24px) !important;
    max-width:calc(100% - 24px) !important;
  }
}
