/* =========================================================
   primawo 2.2.88 – Mobile master for Mietverwaltung +
   Nebenkostenabrechnung
   Loaded after hero-unified.css to neutralise historical
   desktop/tablet overrides on narrow screens.
   ========================================================= */

@media (max-width: 767px){
  .prima-miet-page,
  .prima-nk-page{
    overflow-x:clip;
  }

  .prima-miet-page{--prima-miet-rail:calc(100% - 28px)!important}
  .prima-nk-page{--prima-nk-rail:calc(100% - 28px)!important}

  .prima-miet-page .prima-page-hero__inner,
  .prima-nk-page .prima-page-hero__inner,
  .prima-miet-page .prima-section>.prima-container,
  .prima-nk-page .prima-section>.prima-container{
    width:calc(100% - 28px)!important;
    max-width:none!important;
    margin-inline:auto!important;
  }

  /* -------------------------
     Mobile hero master
     ------------------------- */
  .prima-page-hero--miet,
  .prima-page-hero--nk{
    padding:0!important;
  }
  .prima-page-hero--miet:after,
  .prima-page-hero--nk:after,
  .prima-miet-hero-visual:before,
  .prima-nk-hero-visual:before{
    display:none!important;
    content:none!important;
  }
  .prima-page-hero--miet .prima-page-hero__inner,
  .prima-page-hero--nk .prima-page-hero__inner{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:24px!important;
    min-height:0!important;
    padding:32px 0 38px!important;
  }
  .prima-miet-hero-copy,
  .prima-nk-hero-copy{
    width:100%;
    min-width:0;
  }
  .prima-page-hero--miet .prima-page-hero__kicker,
  .prima-page-hero--nk .prima-page-hero__kicker{
    margin:0 0 10px!important;
    font-size:.66rem!important;
    line-height:1.25!important;
    letter-spacing:.13em!important;
  }
  .prima-page-hero--miet h1,
  .prima-page-hero--nk h1{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    font-size:clamp(2.02rem,9.7vw,2.72rem)!important;
    line-height:1.01!important;
    letter-spacing:-.046em!important;
    text-wrap:balance;
  }
  .prima-page-hero--miet h1>span,
  .prima-page-hero--nk h1>span{
    display:block!important;
    white-space:normal!important;
  }
  .prima-page-hero--miet h1>span+span:before,
  .prima-page-hero--nk h1>span+span:before{
    content:none!important;
  }
  .prima-page-hero--miet .prima-miet-hero-copy>p:not(.prima-page-hero__kicker),
  .prima-page-hero--nk .prima-nk-hero-copy>p:not(.prima-page-hero__kicker){
    max-width:none!important;
    margin:16px 0 0!important;
    font-size:.94rem!important;
    line-height:1.62!important;
  }

  .prima-miet-hero-actions,
  .prima-nk-hero-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:9px!important;
    width:100%;
    margin-top:22px!important;
  }
  .prima-miet-hero-actions .prima-button,
  .prima-nk-hero-actions .prima-button{
    width:100%!important;
    min-height:50px!important;
    justify-content:center!important;
    padding-inline:18px!important;
  }

  .prima-miet-hero-proof,
  .prima-nk-hero-proof{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    margin-top:17px!important;
  }
  .prima-miet-hero-proof>span,
  .prima-nk-hero-proof>span{
    width:100%!important;
    min-width:0!important;
    min-height:38px!important;
    justify-content:flex-start!important;
    padding:7px 9px!important;
    font-size:.65rem!important;
    line-height:1.25!important;
  }
  .prima-miet-hero-proof>span:last-child,
  .prima-nk-hero-proof>span:last-child{
    grid-column:1/-1;
  }

  .prima-miet-hero-visual,
  .prima-nk-hero-visual{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin:0!important;
  }
  .prima-miet-hero-stage,
  .prima-nk-hero-image{
    width:100%!important;
    min-height:0!important;
    aspect-ratio:4/3!important;
    border-radius:20px!important;
    box-shadow:0 18px 44px rgba(0,0,0,.22)!important;
  }
  .prima-miet-hero-stage{
    overflow:hidden!important;
  }
  .prima-miet-hero-image{
    min-height:0!important;
  }
  .prima-miet-hero-stage .prima-miet-hero-image{
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    aspect-ratio:auto!important;
    object-fit:cover!important;
    object-position:66% center!important;
    border:0!important;
  }
  .prima-nk-hero-image{
    background-position:center center!important;
    background-size:cover!important;
  }
  .prima-miet-hero-chip,
  .prima-nk-hero-chip{
    display:none!important;
  }

  /* -------------------------
     Shared section rhythm
     ------------------------- */
  .prima-miet-page .prima-section,
  .prima-nk-page .prima-section{
    padding-block:50px!important;
  }
  .prima-miet-page .prima-kicker,
  .prima-nk-page .prima-kicker{
    font-size:.66rem!important;
    letter-spacing:.12em!important;
  }
  .prima-miet-page .prima-heading,
  .prima-nk-page .prima-heading,
  .prima-miet-section-head h2,
  .prima-nk-section-head h2,
  .prima-nk-automation-head h2{
    max-width:100%!important;
    font-size:clamp(1.8rem,8.4vw,2.35rem)!important;
    line-height:1.06!important;
    letter-spacing:-.035em!important;
    text-wrap:balance;
  }
  .prima-miet-page .prima-lead,
  .prima-nk-page .prima-lead,
  .prima-miet-section-head>p,
  .prima-nk-section-head>p,
  .prima-nk-automation-head>p{
    font-size:.94rem!important;
    line-height:1.66!important;
  }
  .prima-miet-section-head,
  .prima-nk-section-head,
  .prima-nk-automation-head{
    gap:14px!important;
    margin-bottom:28px!important;
  }

  /* -------------------------
     Mietverwaltung
     ------------------------- */
  .prima-miet-intro,
  .prima-miet-owner,
  .prima-miet-portal,
  .prima-miet-faq-layout,
  .prima-miet-closing{
    gap:26px!important;
  }
  .prima-miet-trust{
    width:100%!important;
    max-width:none!important;
    border-radius:22px!important;
    padding:26px 22px!important;
  }
  .prima-miet-trust strong{
    font-size:clamp(2.2rem,11vw,3rem)!important;
    line-height:.98!important;
  }
  .prima-miet-trust p{
    font-size:.9rem!important;
    line-height:1.62!important;
  }

  .prima-miet-scope-grid,
  .prima-miet-owner-grid,
  .prima-miet-process-grid{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  .prima-miet-scope-card,
  .prima-miet-process-grid article,
  .prima-miet-owner-grid article{
    min-height:0!important;
    border-radius:20px!important;
    padding:22px 20px!important;
  }
  .prima-miet-card-top{
    margin-bottom:20px!important;
  }
  .prima-miet-card-icon{
    width:54px!important;
    height:54px!important;
    border-radius:15px!important;
    padding:10px!important;
  }
  .prima-miet-scope-card h3{
    font-size:1.4rem!important;
  }
  .prima-miet-card-intro{
    min-height:0!important;
    margin:10px 0 18px!important;
  }
  .prima-miet-scope-card li{
    padding-block:10px!important;
  }

  .prima-miet-owner__visual{
    width:100%!important;
    max-width:none!important;
    min-height:0!important;
    border-radius:22px!important;
    padding:14px!important;
  }
  .prima-miet-owner-panel{
    width:100%!important;
    border-radius:20px!important;
    padding:24px 20px!important;
  }
  .prima-miet-owner-panel__head{
    align-items:flex-start!important;
  }
  .prima-miet-owner-panel>strong{
    margin-top:14px!important;
    font-size:1.55rem!important;
  }
  .prima-miet-owner-status{
    gap:10px!important;
  }
  .prima-miet-owner-status span{
    min-width:0!important;
    font-size:.82rem!important;
  }
  .prima-miet-owner-status em{
    flex:0 0 auto;
    font-size:.7rem!important;
  }

  .prima-miet-process-grid article{
    padding:20px!important;
  }
  .prima-miet-process-grid h3{
    margin:20px 0 9px!important;
  }

  .prima-miet-boundary{
    grid-template-columns:1fr!important;
    gap:18px!important;
    border-radius:22px!important;
    padding:24px 20px!important;
  }
  .prima-miet-boundary__badge{
    width:64px!important;
    height:64px!important;
    border-radius:18px!important;
  }
  .prima-miet-boundary__badge img{
    width:48px!important;
    height:48px!important;
  }

  .prima-miet-portal-section{
    overflow:hidden!important;
  }
  .prima-miet-portal__features{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:7px!important;
    margin:20px 0!important;
  }
  .prima-miet-portal__features span{
    width:100%!important;
    justify-content:flex-start!important;
  }
  .prima-miet-portal__actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    width:100%!important;
  }
  .prima-miet-portal__actions .prima-button{
    width:100%!important;
    justify-content:center!important;
  }
  .prima-miet-text-link{
    min-height:44px!important;
    justify-content:center!important;
  }
  .prima-miet-portal__mock{
    width:100%!important;
    max-width:none!important;
    border-radius:20px!important;
  }
  .prima-miet-ui__top{
    padding:13px 14px!important;
  }
  .prima-miet-ui__top span{
    display:none!important;
  }
  .prima-miet-ui__body{
    display:block!important;
    min-height:0!important;
  }
  .prima-miet-ui__body nav{
    display:none!important;
  }
  .prima-miet-ui__body section{
    padding:22px 18px!important;
  }
  .prima-miet-ui__body h3{
    margin:8px 0 18px!important;
    font-size:1.25rem!important;
  }
  .prima-miet-ui__cards{
    grid-template-columns:1fr!important;
    gap:7px!important;
  }
  .prima-miet-ui__cards i{
    height:52px!important;
  }

  .prima-miet-faq summary{
    padding:18px 17px!important;
    font-size:.91rem!important;
  }
  .prima-miet-faq>div{
    padding:0 17px 18px!important;
  }

  .prima-miet-closing{
    border-radius:22px!important;
    padding:28px 20px!important;
  }
  .prima-miet-closing h2{
    font-size:clamp(1.85rem,8.8vw,2.4rem)!important;
  }
  .prima-miet-closing__actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:9px!important;
    width:100%!important;
  }
  .prima-miet-closing__actions .prima-button{
    width:100%!important;
    justify-content:center!important;
  }

  /* -------------------------
     Nebenkostenabrechnung
     ------------------------- */
  .prima-nk-intro,
  .prima-nk-cockpit,
  .prima-nk-safety,
  .prima-nk-faq-layout,
  .prima-nk-closing{
    gap:26px!important;
  }
  .prima-nk-trust{
    border-radius:22px!important;
    padding:26px 22px!important;
  }
  .prima-nk-trust strong{
    font-size:clamp(2.2rem,11vw,3rem)!important;
    line-height:.98!important;
  }
  .prima-nk-trust p{
    font-size:.9rem!important;
    line-height:1.62!important;
  }

  .prima-nk-step-grid,
  .prima-nk-file-grid,
  .prima-nk-status-grid{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  .prima-nk-step-card,
  .prima-nk-file-card{
    min-height:0!important;
    border-radius:20px!important;
    padding:22px 20px!important;
  }
  .prima-nk-step-card__top,
  .prima-nk-file-card__top{
    margin-bottom:20px!important;
  }
  .prima-nk-step-card__icon,
  .prima-nk-file-card__icon{
    width:52px!important;
    height:52px!important;
    border-radius:15px!important;
  }
  .prima-nk-step-card h3,
  .prima-nk-file-card h3{
    font-size:1.35rem!important;
  }

  .prima-nk-automation-section{
    overflow:hidden!important;
  }
  .prima-nk-status-grid{
    margin-top:30px!important;
    overflow:visible!important;
    border:0!important;
    background:transparent!important;
  }
  .prima-nk-status-grid article{
    min-height:0!important;
    border:1px solid rgba(255,255,255,.12)!important;
    border-radius:18px!important;
    padding:24px 20px!important;
  }
  .prima-nk-status-grid h3{
    margin:20px 0 10px!important;
    font-size:1.22rem!important;
  }

  .prima-nk-dashboard{
    width:100%!important;
    border-radius:20px!important;
  }
  .prima-nk-dashboard__head{
    padding:22px 18px!important;
  }
  .prima-nk-dashboard__head strong{
    font-size:1.12rem!important;
  }
  .prima-nk-dashboard__body{
    padding:4px 18px!important;
  }
  .prima-nk-dashboard__body>div{
    grid-template-columns:1fr!important;
    gap:4px!important;
    padding:14px 0!important;
  }
  .prima-nk-dashboard__body b{
    font-size:.88rem!important;
  }
  .prima-nk-dashboard__action{
    margin:14px 14px 16px!important;
    padding:13px 14px!important;
    font-size:.8rem!important;
  }

  .prima-nk-safety__points{
    gap:10px!important;
  }
  .prima-nk-safety__points article{
    grid-template-columns:44px minmax(0,1fr)!important;
    gap:14px!important;
    border-radius:18px!important;
    padding:18px!important;
  }
  .prima-nk-safety__points article>span{
    width:42px!important;
    height:42px!important;
    border-radius:13px!important;
  }
  .prima-nk-safety__points h3{
    font-size:1.02rem!important;
  }

  .prima-nk-faq summary{
    padding:18px 17px!important;
    font-size:.91rem!important;
  }
  .prima-nk-faq details>div{
    padding:0 17px 18px!important;
  }

  .prima-nk-closing{
    border-radius:22px!important;
    padding:28px 20px!important;
  }
  .prima-nk-closing h2{
    font-size:clamp(1.85rem,8.8vw,2.4rem)!important;
  }
  .prima-nk-closing__actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:9px!important;
    width:100%!important;
  }
  .prima-nk-closing__actions .prima-button{
    width:100%!important;
    justify-content:center!important;
  }
}

@media (max-width: 420px){
  .prima-page-hero--miet h1,
  .prima-page-hero--nk h1{
    font-size:clamp(1.92rem,9.5vw,2.35rem)!important;
  }
  .prima-miet-hero-proof,
  .prima-nk-hero-proof{
    grid-template-columns:1fr!important;
  }
  .prima-miet-hero-proof>span:last-child,
  .prima-nk-hero-proof>span:last-child{
    grid-column:auto!important;
  }
  .prima-miet-hero-stage,
  .prima-nk-hero-image{
    aspect-ratio:1.2/1!important;
  }
  .prima-miet-owner-status{
    align-items:flex-start!important;
    flex-direction:column!important;
  }
}
