/* Smartphone-Optimierung V250 – Desktop bleibt unverändert */

@media (max-width: 700px),
       (max-width: 900px) and (hover: none) and (pointer: coarse) {

  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }

  .wrap {
    width: calc(100% - 20px) !important;
    max-width: 100% !important;
    margin-inline: auto !important;
  }

  main,
  section,
  article,
  form,
  .panel,
  .card,
  .row-2,
  .grid,
  .vgrid,
  .scen,
  .calc {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  h1 {
    font-size: clamp(30px, 9vw, 39px) !important;
  }

  h2 {
    font-size: clamp(24px, 7vw, 31px) !important;
  }

  h1,
  h2,
  h3,
  h4,
  p,
  li,
  span,
  strong,
  small,
  a {
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  /* Navigation */

  .site-nav-inner,
  .nav,
  .nav-r {
    min-width: 0;
  }

  .site-brand {
    min-width: 0 !important;
    max-width: calc(100% - 54px);
  }

  .site-brand-copy {
    min-width: 0;
  }

  .site-brand-claim {
    display: none;
  }

  /* Formulare – 16 px verhindert automatischen Browser-Zoom */

  input,
  select,
  textarea {
    width: 100%;
    min-width: 0 !important;
    max-width: 100%;
    font-size: 16px !important;
  }

  button,
  .btn,
  [role="button"] {
    max-width: 100%;
    min-height: 44px;
    touch-action: manipulation;
  }

  .cards,
  .cards.two,
  .grid,
  .calc,
  .sc-c,
  .vgrid,
  .drv,
  .row-2,
  .result-overview-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .cards button {
    min-height: 76px;
  }

  /* Ergebniskarten */

  .ck {
    overflow-x: hidden;
  }

  .ck-hd {
    align-items: stretch;
    gap: 14px;
  }

  .ck-act {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .ck-act button,
  .ck-act a {
    width: 100%;
    justify-content: center;
  }

  .card {
    width: 100%;
    padding: 15px !important;
    border-radius: 14px;
    overflow: hidden;
  }

  .c-h {
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 8px;
  }

  .c-h > div {
    min-width: 0;
  }

  .badge {
    max-width: 100%;
    white-space: normal !important;
  }

  /* Kennzahlen */

  .wk-sale-main-v47,
  .wk-sale-range-v47,
  .wk-holding-main-v47,
  .wk-finance-summary-v47 {
    width: 100%;
    min-width: 0;
    padding: 14px !important;
  }

  .wk-sale-main-v47 > strong,
  .wk-sale-range-v47 > strong,
  .vmain > b,
  .gauge > b {
    max-width: 100%;
    font-size: clamp(24px, 8vw, 32px) !important;
    overflow-wrap: anywhere;
  }

  .wk-sale-main-v47 dl > div {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }

  .wk-sale-main-v47 dd {
    text-align: left;
  }

  /* Tabellen */

  .card > table.tbl:not(.mtx),
  .mini-tbl {
    width: 100%;
    table-layout: fixed;
  }

  .card > table.tbl:not(.mtx) th,
  .card > table.tbl:not(.mtx) td,
  .mini-tbl th,
  .mini-tbl td {
    padding: 8px 5px;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  .tbl-wrap,
  .wk-matrix-wrapper-v68,
  .comparison-table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  .wk-matrix-native-v68 {
    min-width: 760px !important;
  }

  .comparison-row {
    min-width: 620px !important;
  }

  /* Szenarien */

  .sc {
    min-width: 0;
    padding: 15px;
  }

  .scen .sc > .sc-h {
    min-height: 0 !important;
    grid-template-columns: 34px minmax(0, 1fr) !important;
  }

  .scen .sc .sc-t h4 {
    min-height: 0 !important;
  }

  .sc-f {
    grid-column: 1 / -1;
    text-align: left;
  }

  /* Konto-, Checkout- und Bearbeitungsdialoge */

  dialog,
  .account-dialog-v19,
  .premium-dialog-v19,
  .edit-dialog {
    width: calc(100% - 12px) !important;
    max-width: calc(100% - 12px) !important;
    max-height: calc(100dvh - 12px) !important;
    margin: auto !important;
    padding: 0 !important;
    border-radius: 17px !important;
  }

  .account-shell-v19,
  .premium-shell-v19,
  .edit-dialog-shell {
    width: 100% !important;
    max-width: 100% !important;
    max-height: calc(100dvh - 12px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }

  .premium-consumer-information-v240 {
    padding: 11px !important;
  }

  .premium-order-summary-v241 {
    display: grid;
    padding: 10px !important;
  }

  .premium-confirmation-v240 {
    grid-template-columns: 22px minmax(0, 1fr) !important;
    gap: 9px !important;
    padding: 10px !important;
  }

  .premium-confirmation-v240 input {
    width: 20px !important;
    height: 20px !important;
  }

  #premium-register-v19 {
    width: 100%;
    min-height: 50px;
    white-space: normal;
  }

  /* Premium-Hinweise */

  .wk-premium-compact-foot-v231 {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    padding: 7px 14px !important;
  }

  .wk-premium-compact-foot-v231 > span {
    padding: 10px 2px !important;
  }

  .wk-premium-compact-foot-v231 > span + span {
    border-top: 1px solid rgba(255, 255, 255, .18) !important;
    border-left: 0 !important;
    padding-left: 2px !important;
  }

  /* Ratgeber und Footer */

  .guide-navigation-grid-v245,
  .site-footer-main-v124,
  .site-footer-navigation-v124 {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .guide-link-v245 {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .site-footer-brand-v124 {
    max-width: 100%;
  }

  img,
  svg,
  video,
  canvas {
    max-width: 100%;
    height: auto;
  }
}

/* Sehr schmale Smartphones */

@media (max-width: 380px) {
  .wrap {
    width: calc(100% - 14px) !important;
  }

  .card {
    padding: 12px !important;
  }

  .premium-confirmation-v240 span {
    font-size: 13px !important;
  }
}

/* Sichere Abstände bei Aussparungen und Home-Leisten */

@supports (padding: max(0px)) {
  @media (max-width: 700px),
         (max-width: 900px) and (hover: none) and (pointer: coarse) {

    .site-nav-inner {
      padding-left: max(10px, env(safe-area-inset-left));
      padding-right: max(10px, env(safe-area-inset-right));
    }

    .site-footer-bottom-v124 {
      padding-bottom: max(18px, env(safe-area-inset-bottom));
    }

    .account-shell-v19,
    .premium-shell-v19,
    .edit-dialog-shell {
      padding-bottom: max(12px, env(safe-area-inset-bottom));
    }
  }
}