/* =========================================================
   v61 – Mobile First Nachschärfung für die komplette Website
   Gilt nur für Tablet/Telefon und lässt Desktop-Regeln unangetastet.
   ========================================================= */

@media (max-width:1180px){
  html,
  body{
    max-width:100%;
    overflow-x:hidden;
  }

  body:not(.reader-mode),
  .page-main,
  .subpage,
  .frame,
  .page-grid,
  .surface{
    min-width:0;
  }

  .site-header{
    width:100%;
  }

  .mobile-menu{
    max-height:calc(100dvh - 68px);
    overflow-y:auto;
    overscroll-behavior:contain;
  }

  .page-title,
  .page-title > *{
    min-width:0;
    max-width:100%;
  }

  .page-title h1{
    max-width:100%;
    font-size:clamp(36px,6vw,44px) !important;
    line-height:1.04;
    overflow-wrap:anywhere;
    hyphens:auto;
  }

  .page-title p{
    max-width:100%;
    white-space:normal !important;
    line-height:1.45;
  }

  .content-scroll{
    height:auto;
    max-height:none;
    overflow:visible;
  }

  .content-scroll,
  .legal-document,
  .archive-story,
  .audio-detail,
  .audio-overview{
    max-width:100%;
  }

  img,
  video,
  iframe,
  audio,
  canvas{
    max-width:100%;
  }

  a[href^="mailto:"],
  a[href^="tel:"]{
    overflow-wrap:anywhere;
    word-break:break-word;
  }
}

@media (max-width:720px){
  :root{
    --mobile-gutter:14px;
  }

  body:not(.reader-mode){
    font-size:15px;
    line-height:1.48;
  }

  /* ---------- Kopfzeile / Navigation ---------- */
  .site-header{
    position:sticky;
    top:0;
    z-index:200;
  }

  .nav-shell{
    width:calc(100% - 24px) !important;
    min-height:72px;
    gap:8px;
  }

  .brand{
    min-width:0;
    flex:1 1 auto;
    gap:9px;
  }

  .brand > div{
    min-width:0;
  }

  .brand-logo{
    width:48px !important;
    height:56px !important;
    flex:0 0 48px;
  }

  .brand-title{
    max-width:230px;
    font-size:14.5px !important;
    line-height:1.08;
    white-space:normal;
  }

  .brand-sub,
  .search{
    display:none !important;
  }

  .menu-toggle{
    flex:0 0 44px;
    width:44px !important;
    height:44px !important;
    margin-left:auto;
  }

  .bars,
  .bars::before,
  .bars::after{
    width:20px;
  }

  .mobile-menu{
    max-height:calc(100dvh - 72px);
    padding:4px 16px max(16px,env(safe-area-inset-bottom));
  }

  .mobile-menu a{
    min-height:50px;
    font-size:15px;
  }

  /* ---------- Allgemeine Seitenschale ---------- */
  .frame,
  .footer-shell{
    width:calc(100% - (2 * var(--mobile-gutter))) !important;
  }

  .subpage{
    min-height:0 !important;
    padding:16px 0 28px !important;
  }

  .page-grid{
    height:auto !important;
    gap:14px !important;
  }

  .page-title{
    display:block !important;
  }

  .page-title h1{
    font-size:clamp(30px,9vw,36px) !important;
    line-height:1.04 !important;
    letter-spacing:-.02em;
    margin:0 !important;
  }

  .page-title p{
    margin-top:8px !important;
    font-size:14px !important;
    line-height:1.45 !important;
  }

  .page-title-inline-link-v57{
    display:inline !important;
    margin:0 0 0 4px !important;
    white-space:normal !important;
  }

  .surface{
    max-width:100%;
    border-radius:12px;
  }

  .content-scroll{
    padding:12px !important;
  }

  .content-grid{
    gap:12px !important;
  }

  .content-card{
    padding:16px !important;
  }

  .content-card h2,
  .content-scroll h2{
    font-size:clamp(22px,6.4vw,26px) !important;
    line-height:1.15;
    overflow-wrap:anywhere;
  }

  .content-scroll h3{
    font-size:19px !important;
    line-height:1.2;
  }

  .content-card p,
  .content-scroll p,
  .content-scroll li{
    font-size:14px !important;
    line-height:1.5;
  }

  .btn,
  .send,
  button:not(.slider-arrow):not(.reader-control):not(.church-lightbox-close-v52):not(.church-lightbox-nav-v52){
    min-height:44px;
  }

  .btn{
    padding:10px 14px;
    font-size:13px;
  }

  input,
  select,
  textarea{
    max-width:100%;
  }

  /* iOS zoomt Formfelder unter 16 px beim Fokus hinein. */
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea{
    font-size:16px !important;
  }

  /* ---------- Startseite ---------- */
  .home-main{
    min-height:0;
  }

  .hero{
    height:min(560px,calc(100svh - 72px)) !important;
    min-height:500px;
  }

  .hero-content{
    height:100%;
    align-items:center;
    padding:24px 16px 86px;
  }

  .hero-copy{
    max-width:100%;
  }

  .hero-copy h1{
    max-width:100%;
    margin:8px 0 12px;
    font-size:clamp(39px,12vw,50px) !important;
    line-height:1.01;
    overflow-wrap:normal;
  }

  .hero-copy p{
    font-size:17px;
    line-height:1.42;
  }

  .hero-caption{
    display:none !important;
  }

  .slider-arrow{
    bottom:18px !important;
  }

  .hero-dots{
    bottom:31px !important;
  }

  .services,
  .news{
    padding:20px var(--mobile-gutter) !important;
  }

  .panel-head{
    align-items:flex-start;
  }

  .panel-head h2{
    font-size:26px !important;
    line-height:1.08;
  }

  .service-row{
    gap:9px;
  }

  .venue{
    padding:0 0 4px;
  }

  .venue h3{
    font-size:21px;
  }

  .venue p{
    font-size:12px;
  }

  .service-card{
    min-height:0;
    padding:13px 14px;
  }

  .service-date{
    font-size:25px;
  }

  .service-time{
    font-size:11px;
  }

  .service-card h4{
    margin-top:9px;
    font-size:13px;
    line-height:1.25;
  }

  .service-card p{
    font-size:11.5px;
    line-height:1.35;
  }

  .news-item{
    grid-template-columns:62px minmax(0,1fr) 14px;
    gap:10px;
    padding:11px 0;
  }

  .news-thumb{
    width:62px;
    height:48px;
  }

  .news-item h3{
    font-size:16px;
    line-height:1.2;
  }

  .news-item p{
    font-size:11.5px;
    line-height:1.35;
  }

  /* ---------- Gottesdienste ---------- */
  .services-columns-v19,
  .services-columns-detailed,
  .services-columns{
    gap:14px !important;
  }

  .service-venue-panel,
  .venue-panel-detailed,
  .venue-panel{
    padding:14px !important;
  }

  .service-venue-head,
  .venue-head,
  .venue-head-detailed{
    gap:10px;
  }

  .venue-head h2,
  .service-venue-head h2,
  .venue-head-detailed h2{
    font-size:26px !important;
  }

  .venue-head p,
  .service-venue-head p,
  .venue-head-detailed p{
    font-size:12px !important;
    line-height:1.4;
  }

  .service-detail-card{
    grid-template-columns:54px minmax(0,1fr) !important;
    gap:10px !important;
    min-height:0;
    padding:12px !important;
  }

  .service-detail-date strong{
    font-size:26px;
  }

  .service-detail-date span{
    font-size:12px;
  }

  .service-detail-copy h3{
    margin-bottom:5px;
    font-size:14px;
    line-height:1.28;
  }

  .service-detail-meta,
  .service-detail-leaders{
    font-size:11px;
    line-height:1.35;
  }

  .service-detail-time{
    grid-column:2;
    margin-top:3px;
    text-align:left;
    font-size:11px;
  }

  .service-detail-time strong{
    font-size:14px;
  }

  .event-line-detailed{
    grid-template-columns:52px minmax(0,1fr) !important;
    gap:10px;
    padding:11px !important;
  }

  .event-title-row{
    grid-template-columns:1fr !important;
  }

  /* ---------- Landing-, Angebot- und Kirchenkarten ---------- */
  .landing-grid,
  .offer-columns,
  .church-duo,
  .archive-grid,
  .content-grid{
    grid-template-columns:1fr !important;
  }

  .landing-grid{
    gap:12px;
  }

  .landing-card{
    min-height:220px;
    padding:20px !important;
  }

  .landing-card h2{
    font-size:26px !important;
    line-height:1.12;
  }

  .landing-card p{
    font-size:14px !important;
  }

  .offer-card{
    min-height:360px !important;
  }

  .church-feature{
    min-height:380px !important;
  }

  .offer-content{
    left:18px;
    right:18px;
    bottom:18px;
  }

  .offer-content h2,
  .church-feature h2{
    font-size:28px !important;
    line-height:1.08;
  }

  .white-chip,
  .chip{
    min-height:38px;
  }

  /* ---------- Ansprechpartner / Gruppen ---------- */
  .groups-directory{
    gap:12px;
  }

  .all-groups-link{
    gap:10px;
    padding:15px;
  }

  .all-groups-link strong{
    font-size:18px;
  }

  .all-groups-link span,
  .groups-note,
  .source-note{
    font-size:12px;
    line-height:1.45;
  }

  .group-card{
    padding:16px;
  }

  .group-card h2{
    font-size:21px;
  }

  .group-card dl > div{
    grid-template-columns:68px minmax(0,1fr);
  }

  .group-card dt,
  .group-card dd{
    font-size:11.5px;
  }

  /* ---------- Gemeindebrief ---------- */
  .brief-layout-v8{
    gap:14px;
  }

  .brief-current-v8{
    padding:16px !important;
    gap:20px !important;
  }

  .brief-current-v8 .brief-cover--pdf{
    width:min(100%,300px) !important;
  }

  .brief-meta-v8 h2{
    font-size:30px !important;
    line-height:1.08;
  }

  .brief-meta-v8 .brief-facts,
  .brief-meta-v8 .brief-description{
    font-size:13.5px !important;
    line-height:1.5;
  }

  .archive-panel-v8,
  .archive-panel-v40{
    padding:14px !important;
  }

  .archive-head-v8 h2,
  .archive-head-v40 h2{
    font-size:23px !important;
  }

  .brief-archive-entry-v40{
    grid-template-columns:68px minmax(0,1fr) !important;
    gap:10px;
    padding:10px;
  }

  .brief-archive-cover-v40{
    width:68px !important;
  }

  .brief-archive-copy-v40 h3{
    font-size:15px;
  }

  /* ---------- Archiv / Inhaltsseiten ---------- */
  .archive-card{
    padding:16px !important;
  }

  .archive-card h2{
    font-size:22px !important;
    line-height:1.18;
  }

  .archive-card p{
    font-size:13px !important;
    line-height:1.48;
  }

  .archive-story{
    padding:16px !important;
  }

  .archive-lead{
    font-size:21px !important;
    line-height:1.35;
  }

  .archive-story-section{
    padding:16px 0;
  }

  .archive-story-section h2{
    font-size:22px !important;
  }

  .archive-story-section p,
  .archive-document-list li{
    font-size:13.5px !important;
  }

  .archive-resource{
    align-items:flex-start;
    min-height:44px;
    font-size:12px;
  }

  /* ---------- Detailseiten / Leitbild / Musik ---------- */
  .detail-intro-v43 h2,
  .leitbild-intro-v43 h2,
  .application-intro-v45 h2,
  .new-konfi-intro-v45 h2,
  .music-program-copy-v45 h2{
    font-size:26px !important;
    line-height:1.15;
  }

  .detail-section-grid-v43,
  .music-service-grid-v43,
  .principles-grid-v43,
  .new-konfi-grid-v45,
  .application-grid-v45,
  .music-service-strip-v45{
    grid-template-columns:1fr !important;
  }

  .detail-section-v43,
  .new-konfi-grid-v45 section,
  .application-grid-v45 section{
    padding:15px;
  }

  .detail-section-v43 p,
  .new-konfi-grid-v45 p,
  .application-grid-v45 p{
    font-size:13.5px !important;
    line-height:1.5;
  }

  .detail-facts-v43,
  .leitbild-nav-v43{
    grid-template-columns:1fr !important;
  }

  .leitbild-nav-v43{
    padding:10px;
  }

  .leitbild-nav-v43 a{
    min-height:40px;
    display:flex;
    align-items:center;
    font-size:12px;
  }

  .leitbild-section-v43{
    padding:20px 0;
  }

  .leitbild-section-v43 h2{
    font-size:22px !important;
  }

  .leitbild-section-v43 p{
    font-size:14px !important;
    line-height:1.6;
  }

  .music-program-document-v45{
    gap:18px;
    padding-bottom:20px;
  }

  .music-program-cover-v45{
    width:min(100%,230px);
    margin-inline:auto;
  }

  .music-program-footer-v45,
  .new-konfi-contact-v45,
  .application-contact-v45,
  .music-info-strip-v43{
    gap:12px;
  }

  /* ---------- Audioguide ---------- */
  .audio-overview,
  .audio-detail{
    padding:15px !important;
  }

  .audio-detail-main{
    min-width:0;
    padding:4px 0 16px !important;
  }

  .audio-detail-main h2{
    max-width:100%;
    font-size:clamp(28px,9vw,36px) !important;
    line-height:1.08;
    overflow-wrap:anywhere;
  }

  .audio-player,
  .audio-player audio,
  .audio-playall-row,
  .audio-nav{
    width:100% !important;
    max-width:100%;
  }

  .audio-mini-title{
    overflow-wrap:anywhere;
  }

  /* ---------- Kontakt ---------- */
  .contact-main-card{
    border-radius:12px;
  }

  .contact-details-pane,
  .contact-form-pane,
  .contact-v35-info,
  .contact-v35-form{
    padding:16px !important;
  }

  .contact-pane-head h2,
  .contact-v35-heading h2{
    font-size:26px !important;
    line-height:1.12;
  }

  .contact-pane-head p,
  .contact-v35-heading > p{
    font-size:14px !important;
  }

  .contact-detail-row{
    gap:5px !important;
    padding:14px 0 !important;
  }

  .contact-detail-row h3,
  .contact-v35-item h3{
    font-size:18px !important;
  }

  .contact-detail-content p,
  .contact-v35-item p,
  .contact-v35-lines{
    font-size:14px !important;
    line-height:1.5 !important;
  }

  .contact-form-v36,
  .contact-v35-form-grid{
    grid-template-columns:1fr !important;
    gap:11px !important;
  }

  .form-wide,
  .contact-v35-form-grid .full{
    grid-column:auto !important;
  }

  .form-field input,
  .form-field select,
  .contact-v35-form-grid input,
  .contact-v35-form-grid select{
    min-height:46px;
    height:46px !important;
  }

  .form-field textarea,
  .contact-v35-form-grid textarea{
    min-height:130px;
    height:auto !important;
    max-height:none;
  }

  .local-captcha-row{
    grid-template-columns:minmax(0,1fr) 76px 44px !important;
    gap:7px;
  }

  .local-captcha-question,
  .captcha-refresh,
  .local-captcha-row input{
    min-height:44px;
  }

  .contact-privacy-v36,
  .contact-v35-privacy{
    font-size:12px !important;
  }

  .contact-submit-v36,
  .contact-v35-submit{
    align-items:stretch !important;
    flex-direction:column !important;
    gap:10px !important;
  }

  .contact-submit-v36 .send,
  .contact-v35-submit .send{
    width:100%;
  }

  .contact-status--success,
  .contact-status--error{
    top:80px !important;
    width:calc(100vw - 16px) !important;
  }

  /* ---------- Offene Kirche / Taufgedenken / Kirchenporträts ---------- */
  .open-church-scroll-v49,
  .baptism-memorial-scroll-v50,
  .church-detail-scroll-v51{
    gap:16px;
  }

  .open-church-photo-v49,
  .open-church-photo-v49 img{
    min-height:200px !important;
  }

  .open-church-welcome-v49 h2,
  .baptism-memorial-intro-v50 h2,
  .church-detail-intro-v51 h2{
    font-size:25px !important;
  }

  .open-church-times-v49,
  .open-church-info-grid-v49 section,
  .baptism-memorial-card-v50,
  .baptism-memorial-inscriptions-v50,
  .baptism-memorial-contact-v50,
  .church-card-v51,
  .church-music-history-v51,
  .church-detail-footer-v51,
  .church-stolpe-specials-v51{
    padding:15px !important;
  }

  .open-church-slot-grid-v49,
  .open-church-info-grid-v49,
  .baptism-memorial-grid-v50,
  .baptism-memorial-detail-images-v50,
  .baptism-memorial-facts-v50,
  .baptism-memorial-meaning-grid-v50,
  .church-detail-grid-v51,
  .church-music-grid-v51,
  .church-special-links-v51,
  .church-timeline-v51,
  .church-facts-v51{
    grid-template-columns:1fr !important;
  }

  .baptism-memorial-main-image-v50{
    max-width:100%;
  }

  .church-detail-image-v51,
  .church-detail-image-v51 img{
    min-height:220px !important;
  }

  /* ---------- 360°, Galerie & Karte ---------- */
  .church-panorama-v52,
  .church-gallery-v52,
  .church-map-v55{
    padding:12px !important;
  }

  .church-panorama-preview-v52{
    height:190px !important;
  }

  .church-gallery-head-v52{
    align-items:flex-start;
    flex-direction:column;
    gap:8px;
  }

  .church-gallery-grid-v52{
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  .church-gallery-item-v52{
    grid-template-rows:auto auto auto !important;
    padding:8px;
  }

  .church-gallery-image-v52{
    height:200px !important;
  }

  .church-gallery-caption-v52{
    font-size:12px !important;
  }

  .church-gallery-credit-v53{
    font-size:10px !important;
    line-height:1.4;
  }

  .church-map-head-v55{
    gap:12px;
  }

  .church-map-actions-v55{
    width:100%;
  }

  .church-map-actions-v55 .btn{
    width:100%;
  }

  .church-map-canvas-v55,
  .church-map-frame-v55{
    min-height:350px !important;
    height:350px !important;
  }

  .church-map-gate-v55{
    padding:16px !important;
  }

  /* ---------- Gemeindekirchenrat ---------- */
  .gkr-scroll-v57{
    gap:16px;
  }

  .gkr-hero-v57{
    gap:18px;
  }

  .gkr-photo-v57 figcaption{
    padding:10px 11px;
  }

  .gkr-photo-v57 figcaption strong{
    font-size:12px;
  }

  .gkr-photo-v57 figcaption span{
    font-size:10.5px;
  }

  .gkr-intro-v57 h2{
    font-size:25px !important;
  }

  .gkr-info-grid-v57,
  .gkr-keyfacts-v57,
  .gkr-members-grid-v57{
    grid-template-columns:1fr !important;
  }

  .gkr-card-v57,
  .gkr-members-v58{
    padding:14px !important;
  }

  .gkr-member-row-v58{
    grid-template-columns:34px minmax(0,1fr) !important;
    min-height:0;
  }

  .gkr-member-row-v58 > span{
    padding:8px !important;
    font-size:11px !important;
  }

  .gkr-member-row-v58 > span:last-child{
    grid-column:2;
    padding-top:0 !important;
    text-align:left !important;
  }

  .gkr-member-header-v58 > span:last-child{
    display:none;
  }

  .gkr-status-pill-v58{
    max-width:100%;
    white-space:normal;
    text-align:left;
    font-size:9px;
  }

  /* ---------- Rechtliche Seiten ---------- */
  .legal-wrap{
    padding:16px 0 28px !important;
  }

  .legal-card,
  .legal-document{
    max-height:none !important;
    overflow:visible !important;
    padding:16px !important;
  }

  .legal-card h1{
    font-size:32px !important;
  }

  .legal-document h2,
  .legal-card h2{
    font-size:21px !important;
  }

  .legal-document p,
  .legal-document li,
  .legal-card p{
    font-size:13.5px !important;
    line-height:1.58;
  }

  .legal-highlight{
    padding:14px !important;
  }

  /* ---------- Datenschutzdialog ---------- */
  .consent-banner{
    left:8px !important;
    right:8px !important;
    bottom:8px !important;
  }

  .consent-banner-inner{
    gap:12px;
    padding:15px;
    border-radius:12px;
  }

  .consent-copy h2{
    font-size:20px;
  }

  .consent-copy p{
    font-size:11.5px;
  }

  .consent-actions{
    flex-direction:column;
  }

  .consent-actions .btn{
    width:100%;
    flex:none;
  }

  .consent-modal{
    padding:8px;
  }

  .consent-dialog{
    width:100%;
    max-height:calc(100dvh - 16px);
    padding:18px;
    border-radius:12px;
  }

  .consent-dialog h2{
    font-size:23px;
    line-height:1.12;
  }

  .consent-dialog > p{
    font-size:12px;
  }

  .consent-dialog-actions .btn{
    width:100%;
  }

  /* ---------- Footer ---------- */
  .footer-shell{
    grid-template-columns:minmax(0,1fr) auto !important;
    gap:10px 14px !important;
    padding:15px 0 !important;
  }

  .footer-name{
    font-size:11.5px !important;
    line-height:1.25;
  }

  .footer-credit{
    font-size:9px !important;
    line-height:1.35;
  }

  .footer-links{
    grid-column:1/-1;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px 12px !important;
    padding:2px 0 0 !important;
    font-size:11.5px !important;
  }

  .footer-links a,
  .footer-consent-link{
    min-height:34px;
    display:flex;
    align-items:center;
    text-align:left;
  }

  .to-top{
    align-self:start;
  }
}

@media (max-width:480px){
  :root{
    --mobile-gutter:12px;
  }

  .brand-title{
    max-width:210px;
    font-size:13.5px !important;
  }

  .brand-logo{
    width:44px !important;
    height:52px !important;
    flex-basis:44px;
  }

  .page-title h1{
    font-size:clamp(29px,8.8vw,34px) !important;
  }

  .hero{
    min-height:500px;
  }

  .hero-content{
    padding-inline:14px;
  }

  .hero-copy h1{
    font-size:clamp(38px,11.5vw,46px) !important;
  }

  .cta-row{
    display:grid;
    grid-template-columns:1fr;
  }

  .cta-row .btn{
    width:100%;
  }

  .panel-head{
    align-items:flex-start;
    flex-wrap:wrap;
  }

  .brief-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .brief-actions .btn{
    width:100%;
  }

  .local-captcha-row{
    grid-template-columns:minmax(0,1fr) 68px 44px !important;
  }

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

  .church-lightbox-inner-v52{
    padding-left:8px !important;
    padding-right:8px !important;
  }

  .church-lightbox-figure-v52{
    width:100% !important;
  }
}