/* ==========================================================================
   Moebelpaket.de – podkategorie Betten / Kinder- & Jugendbetten (msc) · v1.0
   ========================================================================== */
.msc{--s-navy:#162946;--s-ink:#1c2433;--s-muted:#667085;--s-line:#e6e9ef;--s-soft:#f3f5f8;--s-gold:#b09873;margin:6px 0 26px;font-family:Calibri,"Carlito",Arial,sans-serif;letter-spacing:0;color:var(--s-ink)}
.msc :where(*){box-sizing:border-box}
.msc :where(ul,li){list-style:none;margin:0;padding:0}
.msc :where(a){text-decoration:none}
.msc svg{display:block}

/* zakładki */
.msc__tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--s-line);margin-bottom:14px}
.msc__tabs::-webkit-scrollbar{display:none}
.msc .msc__tab{flex:none;position:relative;padding:10px 14px 12px;border:0;background:none;font:inherit;font-size:16px;font-weight:700;color:var(--s-muted);cursor:pointer;white-space:nowrap;transition:color .15s}
.msc .msc__tab::after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:3px;border-radius:3px 3px 0 0;background:var(--s-gold);transform:scaleX(0);transition:transform .2s}
.msc .msc__tab:hover{color:var(--s-ink)}
.msc .msc__tab.is-active{color:var(--s-navy)}
.msc .msc__tab.is-active::after{transform:scaleX(1)}
.msc__panel[hidden]{display:none}

/* kafle (jeden rząd, przewijany) */
.msc-scroll{position:relative}
.msc-cards{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:2px 2px 6px}
.msc-cards::-webkit-scrollbar{display:none}
.msc-cards li{flex:0 0 150px;scroll-snap-align:start}
.msc .msc-card{display:flex;flex-direction:column;gap:7px;height:100%}
.msc-card__img{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:150/112;border-radius:12px;background:var(--s-soft);overflow:hidden;border:1px solid transparent;transition:border-color .15s,background .15s}
.msc-card__img img{width:100%;height:100%;object-fit:cover;transition:transform .25s}
.msc-card__ph{display:none;color:#a7b0bf}
.msc-card__ph svg{width:46px;height:auto}
.msc-card__img.is-empty .msc-card__ph{display:block}
.msc .msc-card__n{font-size:15px;font-weight:700;line-height:1.25;color:var(--s-ink)}
.msc .msc-card__s{font-size:12.5px;color:var(--s-muted);margin-top:-4px}
.msc .msc-card:hover .msc-card__img{border-color:var(--s-navy)}
.msc .msc-card:hover .msc-card__img img{transform:scale(1.05)}
.msc .msc-card:hover .msc-card__n{color:var(--s-navy)}
.msc .msc-arr{position:absolute;top:calc(50% - 32px);z-index:2;width:38px;height:38px;border-radius:50%;border:1px solid var(--s-line);background:#fff;color:var(--s-ink);display:grid;place-items:center;cursor:pointer;box-shadow:0 6px 16px -8px rgba(22,41,70,.45);transition:opacity .15s}
.msc .msc-arr svg{width:16px;height:16px}
.msc .msc-arr--l{left:-14px}
.msc .msc-arr--r{right:-14px}
.msc .msc-arr[disabled]{opacity:0;pointer-events:none}

/* przyciski (rozmiary, funkcje, akcesoria) */
.msc-chips{display:flex;flex-wrap:wrap;gap:8px}
.msc .msc-chip{display:inline-block;padding:8px 14px;border:1px solid var(--s-line);border-radius:999px;background:#fff;font-size:15px;font-weight:700;color:var(--s-ink);transition:background .15s,color .15s,border-color .15s}
.msc .msc-chip:hover{background:var(--s-navy);border-color:var(--s-navy);color:#fff}
.msc-sizes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 28px}
.msc .msc-size__h{display:inline-block;margin-bottom:8px;font-size:15px;font-weight:700;color:var(--s-navy);border-bottom:1.5px solid var(--s-gold)}
.msc a:focus-visible,.msc button:focus-visible{outline:2px solid var(--s-navy);outline-offset:2px;border-radius:8px}

@media (max-width:767px){
  .msc{margin:2px 0 18px}
  .msc .msc__tab{font-size:15px;padding:9px 11px 11px}
  .msc-cards li{flex-basis:120px}
  .msc .msc-card__n{font-size:14px}
  .msc .msc-arr{display:none}
  .msc-sizes{grid-template-columns:1fr}
  .msc .msc-chip{font-size:14px;padding:7px 12px}
}
@media (prefers-reduced-motion:reduce){.msc *{transition:none!important;scroll-behavior:auto!important}}
