/* ════════════════════════════════════════
   DEALGLITCH — Responsive Breakpoints
   4 Stufen: Tablet · Mobile · Small · Tiny
════════════════════════════════════════ */

/* ═══ TABLET (max 1024px) ═══ */
@media(max-width:1024px){
  .tariff-table{font-size:.9rem}
  .tt-head,.tt-row{grid-template-columns:140px 1fr 100px 100px 110px;font-size:.95rem}
  .footer-grid{grid-template-columns:1fr 1fr 1fr}
}

/* ═══ MOBILE (max 768px) ═══ */
@media(max-width:768px){
  html{font-size:15px}
  nav{padding:.4rem .8rem}
  .nav-links{display:none}
  #hamburger{display:block}
  .nav-links.open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:rgba(0,0,5,.95);padding:.8rem;gap:.6rem;border-bottom:1px solid var(--bm);z-index:500;backdrop-filter:blur(8px)}

  /* Hero */
  #hero{padding:2rem 1rem 1.5rem}
  .hero-sub{font-size:.85rem}

  /* Categories */
  .cat-grid{grid-template-columns:repeat(3,1fr);gap:.6rem}
  .cat-card{padding:1rem .6rem}
  .cat-emoji{font-size:2rem}
  .cat-name{font-size:.85rem}
  .cat-count{font-size:.8rem}

  /* Devices */
  .dev-list{grid-template-columns:1fr 1fr}
  .dev-card-img-wrap{height:130px}
  .dev-card-name{font-size:1rem}
  .dev-card-specs{font-size:.9rem}
  .dev-card-brand{font-size:.85rem}
  .dev-card-from{font-size:.95rem}
  .dev-card-count{font-size:.85rem}
  .dev-card-badge{font-size:.8rem}
  .dev-detail-btn{font-size:.9rem}

  /* Config */
  .config-device-header{flex-direction:column;align-items:center}
  .viewer-3d{max-width:100%;height:280px}
  .config-device-info{width:100%;text-align:center}
  .specs-grid{max-width:100%}
  .spec-item{font-size:.9rem}
  .spec-label{font-size:.85rem}
  .spec-value{font-size:.9rem}
  .gb-chips{gap:.3rem}
  .gb-chip{padding:.3rem .6rem;font-size:.85rem}
  .config-title{font-size:1rem}

  /* Tariff table stacked on mobile */
  .tt-head{display:none}
  .tt-row{
    display:flex;flex-direction:column;gap:.4rem;padding:.8rem;
    border:1px solid rgba(255,0,170,.08);margin-bottom:.5rem;background:var(--panel)
  }
  .tt-prov{font-size:.9rem}
  .tt-tarif{font-size:.9rem}
  .tt-tarif small{font-size:.85rem}
  .tt-price{font-size:.95rem}
  .tt-einmal{text-align:left;font-size:.9rem}
  .tt-btn{width:100%;padding:.6rem;text-align:center;font-size:.9rem}
  .tt-best{font-size:.75rem}

  /* Kira results */
  .kira-pick-price{font-size:1.1rem}
  .kira-pick-rank{font-size:1rem}
  .kira-pick-tarif{font-size:.9rem}
  .kira-pick-why{font-size:.9rem}
  .kira-pick-btn{font-size:.9rem}

  /* Checkout */
  #checkout-overlay{padding:1rem .5rem}
  .co-step{font-size:.75rem;padding:.25rem .3rem}
  .co-lbl{font-size:.85rem}
  .co-inp{font-size:.95rem}

  /* Footer */
  .footer-grid{grid-template-columns:1fr 1fr}
  .f-col h4{font-size:.95rem}
  .f-col a{font-size:.85rem}
  .f-legal button{font-size:.8rem}

  /* Choice buttons */
  .choice-btns{flex-direction:column}
  .choice-btn-title{font-size:.9rem}
  .choice-btn-sub{font-size:.85rem}

  /* Section headers */
  section{padding:1.5rem 1rem}
  .sec-tag{font-size:.8rem}
  .sec-sub{font-size:.95rem}
  .back-btn{font-size:.95rem}

  /* Kira chat */
  .kc-msgs{height:200px}
  .kc-msg{max-width:90%;font-size:.9rem}
  .kc-chips{gap:.2rem}
  .kc-chip{font-size:.8rem;padding:.15rem .4rem}
  .kc-send{font-size:.9rem}
  .kc-input{font-size:.95rem}

  /* Video placeholder */
  .video-placeholder{max-width:100%;height:160px}

  /* Status */
  .status-label{font-size:.85rem}
}

/* ═══ SMALL PHONE (max 480px) ═══ */
@media(max-width:480px){
  html{font-size:14px}
  .cat-grid{grid-template-columns:repeat(2,1fr)}
  .cat-emoji{font-size:1.6rem;margin-bottom:.3rem}
  .cat-name{font-size:.8rem}
  .cat-count{font-size:.7rem}

  .dev-list{grid-template-columns:1fr}
  .dev-card-img-wrap{height:180px}
  .dev-card-inner{padding:.8rem}

  .hero-btns{flex-direction:column;align-items:center}
  .btn-p,.btn-s{width:100%;text-align:center;font-size:1rem;padding:.5rem 1rem}

  .footer-grid{grid-template-columns:1fr}

  .viewer-3d{height:240px}

  .spec-item{font-size:.85rem}
  .spec-label{font-size:.8rem}
  .spec-value{font-size:.85rem}

  /* Checkout form single column */
  #co-page2 [style*="grid-template-columns"]{grid-template-columns:1fr!important}
}

/* ═══ TINY PHONE (max 360px) ═══ */
@media(max-width:360px){
  html{font-size:13px}
  nav{padding:.3rem .5rem}
  .logo-text{font-size:.8rem}
  .logo-tag{font-size:.65rem;padding:.08rem .25rem}
  section{padding:1rem .6rem}
  .sec-h2{font-size:1rem}
  .sec-tag{font-size:.65rem}
  .dev-card-name{font-size:.9rem}
}

/* ═══ TOUCH IMPROVEMENTS ═══ */
@media(hover:none) and (pointer:coarse){
  .dev-card,.cat-card,.choice-btn,.tt-btn,.kc-chip,.gb-chip{-webkit-tap-highlight-color:transparent}
  .dev-card:active{transform:scale(.98)}
  .cat-card:active{transform:scale(.97)}
  .gb-chip{min-height:44px;display:flex;align-items:center;justify-content:center}
  .tt-btn{min-height:44px}
  .kc-chip{min-height:36px;display:flex;align-items:center}
}

/* ═══ LANDSCAPE PHONE ═══ */
@media(max-height:500px) and (orientation:landscape){
  #hero{padding:1.5rem 1rem 1rem}
  .hero-h1{margin-bottom:.5rem}
  .h1-main{font-size:3rem}
  .kc-msgs{height:150px}
}