/* campingferien.ch – Mobile-Gesamtfix 18.10.2026
   Ziel: saubere mobile Darstellung auf allen Seiten und natürliche deutsche Worttrennung. */

html,body{max-width:100%;overflow-x:clip}
body{word-break:normal;overflow-wrap:normal;hyphens:none;-webkit-hyphens:none}
img,picture,video,iframe,svg{max-width:100%}
main,main *,header,header *,footer,footer *{min-width:0}

/* Keine willkürliche Trennung mitten im Wort. Deutsche Silbentrennung darf nur dort greifen,
   wo der Browser sie für de-CH korrekt unterstützt. */
h1,h2,h3,h4,h5,h6{
  word-break:normal!important;
  overflow-wrap:normal!important;
  hyphens:none!important;
  -webkit-hyphens:none!important;
  text-wrap:balance;
}
p,li,td,th,blockquote,figcaption{
  word-break:normal!important;
  overflow-wrap:normal!important;
  hyphens:none!important;
  -webkit-hyphens:none!important;
}
/* Buttons, Navigation, Labels und kurze Linktexte nie künstlich mitten im Wort umbrechen. */
.brand,.mainnav a,.mobile-nav a,.header-cta,.pill,.holiday-button,.inline-link,.holiday-text-link,
.eyebrow,.tag,button,label{
  word-break:normal!important;
  overflow-wrap:normal!important;
  hyphens:none!important;
  -webkit-hyphens:none!important;
  white-space:normal;
}
/* Sichtbare Roh-URLs dürfen notfalls umbrechen. */
.sources a,.legal-section a,.guide-section a,.source-note a{
  overflow-wrap:normal!important;
  word-break:normal!important;
}

.header,.shell,.article-wrap,.legal-page,.guide-page,.footer-top,.footer-bottom,
.hero-grid,.split,.dest-grid,.story-grid,.grid2,.theme-row,.guide-list>div,
.holiday-hero-grid,.holiday-country-grid,.holiday-split,.choice-grid,
.destination-hero-grid,.partner-choice-grid,.destination-info-grid,.practical-list{
  min-width:0;
  max-width:100%;
}

/* Flex- und Grid-Inhalte dürfen auf schmalen Screens wirklich schrumpfen. */
.actions,.holiday-actions,.holiday-tags,.tags,.legal-links,.country-links,.holiday-region-links,
.story-meta,.footer-bottom{min-width:0;max-width:100%;flex-wrap:wrap}

@media(max-width:950px){
  .header{padding-left:16px;padding-right:16px;gap:10px}
  .brand{font-size:16px;line-height:1.1;flex:1 1 auto;max-width:calc(100% - 54px)}
  .brand>span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .logo{flex:0 0 36px}
  .mobile-toggle{display:flex!important;flex:0 0 42px;width:42px;height:42px}
  .mobile-nav{padding-left:16px;padding-right:16px}
  .mobile-nav a{padding:12px 0;line-height:1.35}
  .site-header{top:0!important}

  .hero-grid,.split,.dest-grid,.story-grid,.grid2,.footer-top,
  .holiday-hero-grid,.holiday-split,.choice-grid,
  .destination-hero-grid,.partner-choice-grid,.destination-info-grid,.practical-list{
    grid-template-columns:minmax(0,1fr)!important;
  }
  .section-head{align-items:flex-start!important;flex-direction:column!important;gap:12px}
  .section-head>p{max-width:none}

  .hero-media,.holiday-hero-media,.destination-hero figure{min-width:0;max-width:100%}
  .hero-media img,.holiday-hero-media img,.destination-hero img{max-width:100%}

  .footer-top{gap:28px}
  .footer p{max-width:none}
}

@media(max-width:800px){
  .shell,.article-wrap,.legal-page,.guide-page,.footer-top,.footer-bottom{
    padding-left:16px!important;
    padding-right:16px!important;
  }
  .home-section,.holiday-design .home-section{padding-top:44px!important;padding-bottom:44px!important}
  .hero{padding-top:36px;padding-bottom:44px}
  .article-wrap,.legal-page,.guide-page{padding-top:30px}

  .hero h1,.article-head h1,.legal-head h1,.guide-head h1,
  .holiday-hero-copy h1,.country-hero .holiday-hero-copy h1{
    font-size:clamp(31px,9vw,42px)!important;
    line-height:1.08!important;
    letter-spacing:-.03em!important;
  }
  .home-holiday-hero h1{font-size:clamp(36px,10vw,48px)!important}
  .home-section h2,.holiday-design .home-section h2,
  .article-section h2,.guide-section h2,.legal-section h2,
  .toll-page #alle-laender h2{
    font-size:clamp(25px,7.2vw,32px)!important;
    line-height:1.15!important;
  }
  h3{line-height:1.22}

  .lead,.holiday-intro,.legal-intro,.guide-intro,.intro{font-size:16px!important;line-height:1.65}

  .holiday-partners>.shell{grid-template-columns:minmax(0,1fr)!important;gap:16px!important}
  .partner-intro p{max-width:none!important}
  .partner-entry{border-left:0!important;border-top:1px solid #e1e5df;padding:14px 0 0!important}

  .holiday-country-card{display:block!important}
  .country-card-copy{min-height:0!important}
  .holiday-region-links{padding:20px!important}
  .holiday-booking-strip>.shell{flex-direction:column!important;align-items:flex-start!important}

  .destination-page .partner-choice{min-height:0!important}
  .destination-page .destination-info-card,.destination-page .practical-item,
  .choice-grid article,.toll-page .check-item,.toll-page .system-card,.toll-page .toll-country-card{
    width:100%;max-width:100%
  }

  .theme-row{grid-template-columns:38px minmax(0,1fr)!important;gap:10px 12px!important;padding:18px 16px!important}
  .theme-row>p,.theme-row>ul{grid-column:2!important}
  .theme-row ul{gap:8px 12px!important}

  .guide-list>div{grid-template-columns:34px minmax(0,1fr)!important;gap:6px 12px!important}
  .guide-list .eyebrow{display:none!important}
  .guide-list small,.guide-list a{grid-column:2!important}

  .gear-list li{grid-template-columns:32px minmax(0,1fr)!important}
  .gear-list>li>span{grid-column:2!important}

  .story-side article{grid-template-columns:minmax(0,1fr)!important}
  .story-side img{height:auto!important;aspect-ratio:16/9;object-fit:cover}

  .footer-top{grid-template-columns:minmax(0,1fr)!important;padding-top:38px!important;padding-bottom:34px!important}
  .footer-bottom{flex-direction:column!important;align-items:flex-start!important;gap:12px!important}
  .legal-links{gap:10px 16px!important}

  input,select,textarea{max-width:100%;font-size:16px}
  table{max-width:100%}
}

@media(max-width:560px){
  .header{height:58px!important;padding-left:14px!important;padding-right:14px!important}
  .brand{font-size:15px;gap:8px}
  .logo{width:34px;height:34px;flex-basis:34px}
  .mobile-toggle{width:40px;height:40px;flex-basis:40px}
  .mobile-nav{padding-left:14px;padding-right:14px}

  .shell,.article-wrap,.legal-page,.guide-page,.footer-top,.footer-bottom{
    padding-left:14px!important;
    padding-right:14px!important;
  }
  .hero h1,.article-head h1,.legal-head h1,.guide-head h1,
  .holiday-hero-copy h1,.country-hero .holiday-hero-copy h1{
    font-size:clamp(29px,9.5vw,36px)!important;
  }
  .home-holiday-hero h1{font-size:clamp(34px,11vw,42px)!important}

  .actions,.holiday-actions{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:10px!important;width:100%}
  .actions .pill,.holiday-actions .holiday-button,.holiday-actions .pill{
    width:100%;max-width:100%;text-align:center;justify-content:center
  }
  .holiday-button,.pill{max-width:100%;white-space:normal}

  .badge{position:static!important;display:inline-block;margin-top:12px;transform:none!important}
  .stats{grid-template-columns:minmax(0,1fr)!important}

  .theme-row{grid-template-columns:minmax(0,1fr)!important}
  .theme-row>b,.theme-row>h3,.theme-row>small,.theme-row>p,.theme-row>ul{grid-column:1!important}
  .theme-row>b{margin-bottom:-4px}

  .guide-list>div{grid-template-columns:minmax(0,1fr)!important}
  .guide-list>div>*{grid-column:1!important}

  .country-card-copy{padding:20px 18px!important}
  .country-card-copy h3{font-size:24px!important}
  .holiday-region-links{padding:18px 16px!important}
  .holiday-region-links .pill{width:100%;text-align:center}

  .destination-page .destination-hero{padding-top:28px!important;padding-bottom:34px!important}
  .destination-page .destination-hero img{height:230px!important;object-fit:cover}
  .destination-page .partner-choice{padding:18px!important}
  .destination-page .partner-choice figure{max-width:100%;overflow:hidden}
  .destination-page .partner-choice figure img{max-width:100%}
  .destination-page .destination-info-card,.destination-page .practical-item{padding:18px!important}

  .info-visual{height:150px!important}

  .toll-page .filters{grid-template-columns:minmax(0,1fr)!important}
  .toll-page .filters input,.toll-page .filters select{width:100%!important}
  .toll-table td{overflow-wrap:normal!important;word-break:normal!important;hyphens:none!important}

  .footer h3{letter-spacing:.16em}
}

@media(max-width:380px){
  .brand{font-size:14px}
  .logo{width:32px;height:32px;flex-basis:32px}
  .mobile-toggle{width:38px;height:38px;flex-basis:38px}
  .shell,.article-wrap,.legal-page,.guide-page,.footer-top,.footer-bottom{padding-left:12px!important;padding-right:12px!important}
  .eyebrow{letter-spacing:.14em!important}
  .hero h1,.article-head h1,.legal-head h1,.guide-head h1,
  .holiday-hero-copy h1,.country-hero .holiday-hero-copy h1{font-size:29px!important}
  .home-holiday-hero h1{font-size:34px!important}
  .toll-table td{grid-template-columns:minmax(84px,34%) minmax(0,1fr)!important;gap:8px!important}
}


/* 18.10.2026 – Mobile-Korrektur Campingformen:
   Auf kleinen Displays keine Restspalten aus dem Desktop-Grid beibehalten. */
@media(max-width:800px){
  #campingformen .theme-row{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    padding:20px 18px!important;
  }
  #campingformen .theme-row>*{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    grid-column:auto!important;
  }
  #campingformen .theme-row>b{
    display:block!important;
    margin:0 0 4px!important;
  }
  #campingformen .theme-row>div{
    display:block!important;
    margin:0 0 14px!important;
  }
  #campingformen .theme-row>p{
    display:block!important;
    margin:0 0 16px!important;
    line-height:1.65!important;
  }
  #campingformen .theme-row ul{
    display:block!important;
    margin:0 0 12px!important;
    padding:0!important;
  }
  #campingformen .theme-row li{
    display:block!important;
    margin:0 0 8px!important;
  }
  #campingformen .theme-row .inline-link,
  #campingformen .theme-row .holiday-text-link{
    display:inline-block!important;
    width:auto!important;
    max-width:100%!important;
  }
}


/* 18.10.2026 – finaler Mobile-Fix für Listen/Karten und Worttrennung */
@media(max-width:800px){
  /* Auf dem Handy normale Wortumbrüche; keine sichtbaren Auto-Silbentrennungen wie passen-den. */
  main p,main li,main td,main th,main small,main figcaption{
    word-break:normal!important;
    overflow-wrap:normal!important;
    hyphens:none!important;
    -webkit-hyphens:none!important;
  }

  /* Theme-/Campingformen-Karten vollständig einspaltig. Verhindert 1-Zeichen-Spalten. */
  .theme-list{width:100%!important;max-width:100%!important;overflow:hidden!important}
  .theme-row{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:20px 18px!important;
  }
  .theme-row>*{
    display:block!important;
    position:static!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    grid-column:auto!important;
    grid-row:auto!important;
  }
  .theme-row>b{margin:0 0 5px!important}
  .theme-row>div{margin:0 0 14px!important}
  .theme-row>p{margin:0 0 16px!important;line-height:1.65!important}
  .theme-row ul{display:block!important;margin:0 0 12px!important;padding:0!important}
  .theme-row li{display:block!important;margin:0 0 8px!important}
  .theme-row .inline-link,.theme-row .holiday-text-link{
    display:inline-block!important;
    width:auto!important;
    max-width:100%!important;
  }
}


/* 18.10.2026 – Worttrennung final:
   Auf mobilen Ansichten KEINE automatische Silbentrennung und KEINE Trennung mitten im Wort.
   Lange technische URLs dürfen ausschliesslich in Quellenbereichen umbrechen. */
@media(max-width:800px){
  body, body p, body li, body td, body th, body small, body figcaption,
  body h1, body h2, body h3, body h4, body h5, body h6,
  body a, body span, body strong, body b, body em, body label, body button{
    -webkit-hyphens:none!important;
    hyphens:none!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
  }
  .sources a,.legal-section a,.guide-section a,.source-note a,
  a[href^="http://"],a[href^="https://"]{
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    -webkit-hyphens:none!important;
    hyphens:none!important;
  }
}