/* ============================================================
   MICHLOR — Subpage Shared CSS
   Wspólne style dla wszystkich podstron produktowych
   ============================================================ */

/* ══════════════════════════════════════════════════════════
   PAGE HERO BANNER
   ══════════════════════════════════════════════════════════ */

.mpage-hero {
    position:   relative;
    min-height: clamp(360px, 50vh, 560px);
    display:    flex;
    align-items: center;
    overflow:   clip; /* clip działa poprawnie z transform na iOS Safari */
    background: var(--color-bg-deep);
}

.mpage-hero__bg {
    position:       absolute;
    inset:          0;
    background:     linear-gradient(135deg, var(--color-bg) 0%, var(--color-bg-deep) 50%, #061e30 100%);
    z-index:        0;
}

/* Orb dekoracyjny — lewy */
.mpage-hero__bg::before {
    content:          '';
    position:         absolute;
    top:              -80px;
    left:             -80px;
    width:            500px;
    height:           500px;
    border-radius:    50%;
    background:       radial-gradient(circle, rgba(0, 180, 166, 0.12) 0%, transparent 65%);
    filter:           blur(60px);
    pointer-events:   none;
}

/* Orb dekoracyjny — prawy */
.mpage-hero__bg::after {
    content:          '';
    position:         absolute;
    bottom:           -60px;
    right:            -60px;
    width:            400px;
    height:           400px;
    border-radius:    50%;
    background:       radial-gradient(circle, rgba(14, 165, 233, 0.08) 0%, transparent 65%);
    filter:           blur(60px);
    pointer-events:   none;
}

.mpage-hero__inner {
    position:   relative;
    z-index:    1;
    max-width:  1280px;
    margin:     0 auto;
    padding:    clamp(4rem, 8vw, 7rem) clamp(1.5rem, 4vw, 3rem) clamp(3rem, 5vw, 5rem);
    width:      100%;
}

/* Wideo w tle hero (subpage) ──────────────────────────── */
.mpage-hero__video-wrap {
    position:   absolute;
    inset:      0;
    z-index:    0;
    overflow:   hidden;
}

.mpage-hero__video {
    width:       100%;
    height:      100%;
    object-fit:  cover;
    object-position: center center;
    filter:      brightness(0.62) saturate(0.85);
}

.mpage-hero__video-overlay {
    position:   absolute;
    inset:      0;
    background: linear-gradient(
        105deg,
        rgba(4, 16, 30, 0.72)  0%,
        rgba(4, 16, 30, 0.38) 55%,
        rgba(4, 16, 30, 0.18) 100%
    );
}

/* Hero split — tekst + obraz/grafika po prawej ─────────── */
.mpage-hero__inner--split {
    display:         grid;
    grid-template-columns: 1fr clamp(140px, 16vw, 240px);
    gap:             clamp(2rem, 5vw, 4rem);
    align-items:     flex-end;
}

/* Zapobiega overflow tekstu poza kolumnę gridu */
.mpage-hero__inner--split > :first-child {
    min-width: 0;
    overflow:  hidden;
}

.mpage-hero__side-img {
    display:         flex;
    align-items:     flex-end;
    justify-content: center;
    min-width:       0;
    padding-bottom:  1rem;
}

.mpage-hero__side-img img {
    width:         100%;
    height:        auto;
    display:       block;
    filter:        drop-shadow(0 12px 40px rgba(0,180,166,.2));
}


@media (max-width: 768px) {
    .mpage-hero__inner--split {
        grid-template-columns: 1fr;
    }
    .mpage-hero__side-img {
        display: none;
    }
}

.mpage-hero__breadcrumb {
    display:     flex;
    align-items: center;
    gap:         0.5rem;
    margin-bottom: 1.5rem;
    font-size:   0.8125rem;
    color:       var(--color-muted);
}

.mpage-hero__breadcrumb a {
    color:           var(--color-muted);
    text-decoration: none;
    transition:      color var(--transition-fast);
}

.mpage-hero__breadcrumb a:hover {
    color: var(--color-accent);
}

.mpage-hero__breadcrumb-sep {
    opacity: 0.4;
    font-size: 0.75rem;
}

.mpage-hero__overline {
    display:        inline-flex;
    align-items:    center;
    gap:            0.5rem;
    font-size:      0.72rem;
    font-weight:    500;
    letter-spacing: var(--letter-overline);
    text-transform: uppercase;
    color:          var(--color-accent);
    margin-bottom:  1.25rem;
    padding:        0.35rem 0.875rem;
    border:         1px solid var(--glass-border);
    border-radius:  var(--radius-pill);
    background:     var(--glass-bg);
}

.mpage-hero__title {
    font-family:    var(--font-heading);
    font-size:      clamp(2.25rem, 5vw, 4rem);
    font-weight:    800;
    letter-spacing: var(--letter-heading);
    color:          var(--color-text);
    line-height:    1.1;
    margin:         0 0 1.25rem;
    max-width:      700px;
}

.mpage-hero__title em {
    font-style:              italic;
    background:              linear-gradient(135deg, var(--color-accent) 0%, #0EA5E9 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip:         text;
}

.mpage-hero__sub {
    font-size:   1.0625rem;
    color:       var(--color-muted);
    line-height: var(--line-height-body);
    max-width:   580px;
    margin:      0 0 2rem;
}

.mpage-hero__cta-row {
    display:     flex;
    flex-wrap:   wrap;
    gap:         1rem;
    align-items: center;
}

/* ══════════════════════════════════════════════════════════
   SHARED BUTTONS
   ══════════════════════════════════════════════════════════ */

.mpage-btn {
    display:         inline-flex;
    align-items:     center;
    gap:             0.5rem;
    padding:         0.75rem 1.75rem;
    border-radius:   var(--radius-pill);
    font-family:     var(--font-body);
    font-size:       0.9375rem;
    font-weight:     500;
    text-decoration: none;
    transition:      background-color var(--transition-base),
                     color            var(--transition-base),
                     box-shadow       var(--transition-base),
                     transform        var(--transition-fast);
    cursor:          pointer;
    border:          none;
}

.mpage-btn--solid {
    background:  var(--color-accent);
    color:       var(--color-bg);
}

.mpage-btn--solid:hover {
    background:  var(--color-accent-glow);
    color:       var(--color-bg);
    box-shadow:  var(--glow-accent);
    transform:   translateY(-2px);
}

.mpage-btn--ghost {
    background:  var(--glass-bg);
    color:       var(--color-text);
    border:      1px solid var(--glass-border);
    backdrop-filter: var(--glass-blur);
}

.mpage-btn--ghost:hover {
    background:  rgba(0, 180, 166, 0.08);
    border-color: rgba(0, 180, 166, 0.35);
    color:       var(--color-text);
    transform:   translateY(-2px);
}

.mpage-btn--outline {
    background:  transparent;
    color:       var(--color-accent);
    border:      1px solid rgba(0, 180, 166, 0.4);
}

.mpage-btn--outline:hover {
    background:  rgba(0, 180, 166, 0.08);
    border-color: var(--color-accent);
    color:       var(--color-accent-glow);
    transform:   translateY(-2px);
}

/* ══════════════════════════════════════════════════════════
   SECTION WRAPPER
   ══════════════════════════════════════════════════════════ */

.mpage-section {
    padding: var(--space-lg) 0;
}

.mpage-section--alt {
    background: var(--color-bg-deep);
}

.mpage-section--dark {
    background: var(--color-bg);
}

.mpage-container {
    max-width: 1280px;
    margin:    0 auto;
    padding:   0 clamp(1.5rem, 4vw, 3rem);
}

.mpage-section-head {
    margin-bottom: clamp(2.5rem, 5vw, 4rem);
}

.mpage-section-head--center {
    text-align: center;
}

.mpage-overline {
    display:        inline-block;
    font-size:      0.72rem;
    font-weight:    500;
    letter-spacing: var(--letter-overline);
    text-transform: uppercase;
    color:          var(--color-accent);
    margin-bottom:  0.875rem;
    padding:        0.3rem 0.75rem;
    border:         1px solid var(--glass-border);
    border-radius:  var(--radius-pill);
    background:     var(--glass-bg);
}

.mpage-section-title {
    font-family:    var(--font-heading);
    font-size:      clamp(1.75rem, 3.5vw, 2.75rem);
    font-weight:    800;
    letter-spacing: var(--letter-heading);
    color:          var(--color-text);
    line-height:    1.15;
    margin:         0 0 1rem;
}

.mpage-section-lead {
    font-size:   1.0625rem;
    color:       var(--color-muted);
    line-height: var(--line-height-body);
    max-width:   600px;
    margin:      0;
}

.mpage-section-head--center .mpage-section-lead {
    margin: 0 auto;
}

/* ══════════════════════════════════════════════════════════
   FEATURE GRID (benefits / cechy)
   ══════════════════════════════════════════════════════════ */

.mpage-features {
    display:               grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap:                   1.5rem;
}

.mpage-feature-card {
    background:      var(--glass-bg);
    border:          1px solid var(--glass-border);
    border-radius:   var(--radius-md);
    padding:         1.75rem;
    backdrop-filter: var(--glass-blur);
    transition:      border-color var(--transition-base),
                     transform    var(--transition-base),
                     box-shadow   var(--transition-base);
}

.mpage-feature-card:hover {
    border-color: rgba(0, 180, 166, 0.35);
    transform:    translateY(-4px);
    box-shadow:   var(--shadow-card);
}

.mpage-feature-icon {
    width:         48px;
    height:        48px;
    border-radius: var(--radius-sm);
    background:    rgba(0, 180, 166, 0.1);
    border:        1px solid rgba(0, 180, 166, 0.2);
    display:       flex;
    align-items:   center;
    justify-content: center;
    color:         var(--color-accent);
    margin-bottom: 1.25rem;
    flex-shrink:   0;
}

.mpage-feature-title {
    font-family:    var(--font-heading);
    font-size:      1.0625rem;
    font-weight:    700;
    color:          var(--color-text);
    margin:         0 0 0.625rem;
    letter-spacing: var(--letter-heading);
}

.mpage-feature-desc {
    font-size:   0.9rem;
    color:       var(--color-muted);
    line-height: 1.65;
    margin:      0;
}

/* ══════════════════════════════════════════════════════════
   NAWIGACJA SERII — kotwice
   ══════════════════════════════════════════════════════════ */

.mpage-series-nav {
    background:  var(--color-bg-card);
    border-bottom: 1px solid var(--glass-border);
    position:    sticky;
    top:         70px;
    z-index:     50;
}

.mpage-series-nav .mpage-container {
    padding-top:    0;
    padding-bottom: 0;
}

.mpage-series-nav__list {
    display:         flex;
    align-items:     center;
    gap:             0;
    list-style:      none;
    margin:          0;
    padding:         0;
    overflow-x:      auto;
    scrollbar-width: none;
}

.mpage-series-nav__list::-webkit-scrollbar { display: none; }

.mpage-series-nav__link {
    display:         inline-flex;
    align-items:     center;
    gap:             0.5rem;
    padding:         1rem 1.5rem;
    font-size:       0.875rem;
    font-weight:     500;
    color:           var(--color-muted);
    text-decoration: none;
    border-bottom:   2px solid transparent;
    white-space:     nowrap;
    transition:      color var(--transition-fast),
                     border-color var(--transition-fast);
}

.mpage-series-nav__link span {
    font-size:   0.75rem;
    opacity:     0.6;
}

.mpage-series-nav__link:hover {
    color:        var(--color-text);
    border-color: rgba(0, 180, 166, 0.4);
}

/* ══════════════════════════════════════════════════════════
   SERIES BADGES (cechy serii)
   ══════════════════════════════════════════════════════════ */

.mpage-series-badges {
    display:    flex;
    flex-wrap:  wrap;
    gap:        0.5rem;
    margin-top: 1.25rem;
}

.mpage-series-badge {
    display:        inline-flex;
    align-items:    center;
    font-size:      0.75rem;
    font-weight:    500;
    letter-spacing: 0.04em;
    color:          var(--color-accent);
    background:     rgba(0, 180, 166, 0.08);
    border:         1px solid rgba(0, 180, 166, 0.22);
    border-radius:  var(--radius-pill);
    padding:        0.25rem 0.75rem;
}

.mpage-series-badge--gold {
    color:      #F59E0B;
    background: rgba(245, 158, 11, 0.08);
    border-color: rgba(245, 158, 11, 0.25);
}

/* ══════════════════════════════════════════════════════════
   SECTION CTA ROW
   ══════════════════════════════════════════════════════════ */

.mpage-section-cta {
    display:         flex;
    justify-content: center;
    margin-top:      2.5rem;
    padding-top:     2rem;
    border-top:      1px solid rgba(255, 255, 255, 0.05);
}

/* ══════════════════════════════════════════════════════════
   PRODUCT CARDS (serie produktów)
   ══════════════════════════════════════════════════════════ */

.mpage-products {
    display:               grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap:                   1.5rem;
}

.mpage-products--3col {
    grid-template-columns: repeat(3, 1fr);
}

.mpage-products--2col {
    grid-template-columns: repeat(2, 1fr);
    max-width: 960px;
    margin:    0 auto;
}

.mpage-product-card {
    background:      var(--glass-bg);
    border:          1px solid var(--glass-border);
    border-radius:   var(--radius-lg);
    overflow:        hidden;
    transition:      border-color var(--transition-base),
                     transform    var(--transition-base),
                     box-shadow   var(--transition-base);
    display:         flex;
    flex-direction:  column;
}

.mpage-product-card:hover {
    border-color: rgba(0, 180, 166, 0.4);
    transform:    translateY(-6px);
    box-shadow:   var(--shadow-card), var(--glow-accent);
}

/* Nowy wrapper dla zdjęcia (zastępuje .mpage-product-card__img jako kontener) */
.mpage-product-card__img-wrap {
    height:          220px;
    background:      linear-gradient(135deg, var(--color-bg-card) 0%, #0e2d48 100%);
    display:         flex;
    align-items:     center;
    justify-content: center;
    position:        relative;
    overflow:        hidden;
}

.mpage-product-card__img-wrap--fallback {
    background:   linear-gradient(135deg, rgba(0,180,166,0.06) 0%, #0e2d48 100%);
}

.mpage-product-card__img-wrap .mpage-product-card__img {
    max-height:  180px;
    max-width:   80%;
    object-fit:  contain;
    filter:      drop-shadow(0 8px 24px rgba(0, 180, 166, 0.2));
    transition:  transform var(--transition-base);
}

.mpage-product-card:hover .mpage-product-card__img-wrap .mpage-product-card__img {
    transform: scale(1.05);
}

/* Wskaźnik liczby osób */
.mpage-product-card__persons {
    position:        absolute;
    bottom:          0.75rem;
    left:            0.75rem;
    display:         inline-flex;
    align-items:     center;
    gap:             0.375rem;
    font-size:       0.72rem;
    font-weight:     500;
    color:           var(--color-muted);
    background:      rgba(4, 16, 30, 0.75);
    border:          1px solid rgba(255,255,255,0.08);
    border-radius:   var(--radius-pill);
    padding:         0.25rem 0.625rem;
    backdrop-filter: blur(8px);
}

/* Variant odznaki — złota */
.mpage-product-card__badge--gold {
    color:      var(--color-bg);
    background: #F59E0B;
}

/* Featured card (Refiner) */
.mpage-product-card--featured {
    border-color: rgba(0, 180, 166, 0.25);
}

/* Tabela specyfikacji */
.mpage-product-card__specs-table {
    width:           100%;
    border-collapse: collapse;
    margin:          0.5rem 0;
    font-size:       0.8125rem;
}

.mpage-product-card__specs-table th,
.mpage-product-card__specs-table td {
    padding:         0.4rem 0;
    vertical-align:  top;
    line-height:     1.4;
}

.mpage-product-card__specs-table th {
    color:        var(--color-muted);
    font-weight:  400;
    width:        55%;
    padding-right: 0.75rem;
    border-bottom: 1px solid rgba(255,255,255,0.04);
}

.mpage-product-card__specs-table td {
    color:        var(--color-text);
    font-weight:  500;
    border-bottom: 1px solid rgba(255,255,255,0.04);
}

.mpage-product-card__specs-table tr:last-child th,
.mpage-product-card__specs-table tr:last-child td {
    border-bottom: none;
}

/* CTA w karcie */
.mpage-product-card__cta {
    display:         inline-flex;
    align-items:     center;
    gap:             0.375rem;
    margin-top:      auto;
    padding:         0.625rem 1.25rem;
    font-size:       0.875rem;
    font-weight:     500;
    color:           var(--color-bg);
    background:      var(--color-accent);
    border-radius:   var(--radius-pill);
    text-decoration: none;
    transition:      background-color var(--transition-fast),
                     transform        var(--transition-fast);
    align-self:      flex-start;
}

.mpage-product-card__cta:hover {
    background: var(--color-accent-glow);
    color:      var(--color-bg);
    transform:  translateX(3px);
}

.mpage-product-card__img {
    height:          220px;
    background:      linear-gradient(135deg, var(--color-bg-card) 0%, #0e2d48 100%);
    display:         flex;
    align-items:     center;
    justify-content: center;
    position:        relative;
    overflow:        hidden;
}

.mpage-product-card__img img {
    max-height:  180px;
    max-width:   80%;
    object-fit:  contain;
    filter:      drop-shadow(0 8px 24px rgba(0, 180, 166, 0.2));
    transition:  transform var(--transition-base);
}

.mpage-product-card:hover .mpage-product-card__img img {
    transform: scale(1.05);
}

.mpage-product-card__img-placeholder {
    width:         80px;
    height:        80px;
    border-radius: var(--radius-md);
    background:    rgba(0, 180, 166, 0.08);
    border:        1px solid rgba(0, 180, 166, 0.15);
    display:       flex;
    align-items:   center;
    justify-content: center;
    color:         var(--color-accent);
    opacity:       0.6;
}

.mpage-product-card__badge {
    position:       absolute;
    top:            1rem;
    right:          1rem;
    font-size:      0.68rem;
    font-weight:    600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color:          var(--color-bg);
    background:     var(--color-accent);
    padding:        0.25rem 0.625rem;
    border-radius:  var(--radius-pill);
}

.mpage-product-card__body {
    padding:        1.5rem;
    flex:           1;
    display:        flex;
    flex-direction: column;
    gap:            0.625rem;
}

.mpage-product-card__title {
    font-family:    var(--font-heading);
    font-size:      1.125rem;
    font-weight:    700;
    color:          var(--color-text);
    margin:         0;
    letter-spacing: var(--letter-heading);
}

.mpage-product-card__desc {
    font-size:   0.875rem;
    color:       var(--color-muted);
    line-height: 1.65;
    margin:      0;
    flex:        1;
}

.mpage-product-card__specs {
    list-style:     none;
    margin:         0.5rem 0 0;
    padding:        0;
    display:        flex;
    flex-direction: column;
    gap:            0.375rem;
}

.mpage-product-card__spec {
    display:     flex;
    align-items: center;
    gap:         0.5rem;
    font-size:   0.8125rem;
    color:       var(--color-muted);
}

.mpage-product-card__spec::before {
    content:       '';
    width:         5px;
    height:        5px;
    border-radius: 50%;
    background:    var(--color-accent);
    flex-shrink:   0;
    opacity:       0.8;
}

/* ══════════════════════════════════════════════════════════
   HOW IT WORKS (kroki)
   ══════════════════════════════════════════════════════════ */

.mpage-steps {
    display:               grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap:                   2rem;
    counter-reset:         steps;
}

.mpage-step {
    position:   relative;
    text-align: center;
}

.mpage-step__num {
    font-family:    var(--font-heading);
    font-size:      3rem;
    font-weight:    800;
    letter-spacing: -0.05em;
    line-height:    1;
    background:     linear-gradient(135deg, var(--color-accent) 0%, #0EA5E9 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom:  0.75rem;
    display:        block;
}

.mpage-step__title {
    font-family:    var(--font-heading);
    font-size:      1rem;
    font-weight:    700;
    color:          var(--color-text);
    margin:         0 0 0.5rem;
}

.mpage-step__desc {
    font-size:   0.875rem;
    color:       var(--color-muted);
    line-height: 1.65;
    margin:      0;
}

/* ══════════════════════════════════════════════════════════
   INFO SPLIT (2 kolumny: tekst + lista)
   ══════════════════════════════════════════════════════════ */

.mpage-split {
    display:               grid;
    grid-template-columns: 1fr 1fr;
    gap:                   clamp(2rem, 6vw, 6rem);
    align-items:           center;
}

.mpage-split--reverse {
    direction: rtl;
}

.mpage-split--reverse > * {
    direction: ltr;
}

.mpage-split__visual {
    background:     linear-gradient(135deg, var(--color-bg-card) 0%, #0e2d48 100%);
    border-radius:  var(--radius-lg);
    border:         1px solid var(--glass-border);
    min-height:     340px;
    display:        flex;
    align-items:    center;
    justify-content: center;
    position:       relative;
    overflow:       hidden;
}

.mpage-split__visual-inner {
    display:  flex;
    flex-direction: column;
    align-items: center;
    gap:      1rem;
    color:    var(--color-accent);
    opacity:  0.5;
}

.mpage-split__checklist {
    list-style:     none;
    margin:         1.5rem 0 0;
    padding:        0;
    display:        flex;
    flex-direction: column;
    gap:            0.875rem;
}

.mpage-split__check {
    display:     flex;
    align-items: flex-start;
    gap:         0.875rem;
    font-size:   0.9375rem;
    color:       var(--color-text);
    line-height: 1.55;
}

.mpage-split__check-icon {
    width:         22px;
    height:        22px;
    border-radius: 50%;
    background:    rgba(0, 180, 166, 0.12);
    border:        1px solid rgba(0, 180, 166, 0.25);
    display:       flex;
    align-items:   center;
    justify-content: center;
    flex-shrink:   0;
    color:         var(--color-accent);
    margin-top:    0.1em;
}

/* ══════════════════════════════════════════════════════════
   STATS ROW (mini liczniki na podstronach)
   ══════════════════════════════════════════════════════════ */

.mpage-stats {
    display:               grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap:                   1px;
    background:            rgba(255, 255, 255, 0.05);
    border-radius:         var(--radius-md);
    overflow:              hidden;
    margin-top:            var(--space-md);
}

.mpage-stat {
    background: var(--color-bg-deep);
    padding:    2rem 1rem;
    text-align: center;
    overflow:   hidden;
}

.mpage-stat__val {
    font-family:    var(--font-heading);
    font-size:      clamp(1.25rem, 2.2vw, 2.25rem);
    font-weight:    800;
    letter-spacing: -0.04em;
    color:          var(--color-accent);
    display:        block;
    line-height:    1;
    margin-bottom:  0.375rem;
    white-space:    nowrap;
}

.mpage-stat__label {
    font-size:   0.8125rem;
    color:       var(--color-muted);
    line-height: 1.4;
}

/* ══════════════════════════════════════════════════════════
   TRUST BADGES / PARTNERZY
   ══════════════════════════════════════════════════════════ */

.mpage-trust {
    display:     flex;
    flex-wrap:   wrap;
    gap:         1rem;
    align-items: center;
    margin-top:  2rem;
}

.mpage-trust-badge {
    display:         flex;
    align-items:     center;
    gap:             0.625rem;
    padding:         0.5rem 1rem;
    background:      var(--glass-bg);
    border:          1px solid rgba(255, 255, 255, 0.08);
    border-radius:   var(--radius-pill);
    font-size:       0.8125rem;
    color:           var(--color-muted);
    backdrop-filter: var(--glass-blur);
}

.mpage-trust-badge svg {
    color:      var(--color-accent);
    flex-shrink: 0;
}

/* ══════════════════════════════════════════════════════════
   O NAS — DWA FILARY BIZNESU
   ══════════════════════════════════════════════════════════ */

.mon-pillars {
    display:               grid;
    grid-template-columns: 1fr 1fr;
    gap:                   1.5rem;
}

.mon-pillar {
    background:      var(--glass-bg);
    border:          1px solid var(--glass-border);
    border-radius:   var(--radius-lg);
    padding:         2rem;
    display:         flex;
    flex-direction:  column;
    gap:             1rem;
    backdrop-filter: var(--glass-blur);
    transition:      border-color var(--transition-base),
                     box-shadow   var(--transition-base);
}

.mon-pillar--accent {
    border-color:   rgba(0, 180, 166, 0.3);
    background:     rgba(0, 180, 166, 0.04);
}

.mon-pillar:hover {
    border-color: rgba(0, 180, 166, 0.4);
    box-shadow:   var(--shadow-card);
}

.mon-pillar__num {
    font-family:    var(--font-heading);
    font-size:      3rem;
    font-weight:    800;
    letter-spacing: -0.05em;
    line-height:    1;
    background:     linear-gradient(135deg, var(--color-accent) 0%, #0EA5E9 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.mon-pillar__icon {
    width:           52px;
    height:          52px;
    border-radius:   var(--radius-md);
    background:      rgba(0, 180, 166, 0.1);
    border:          1px solid rgba(0, 180, 166, 0.2);
    display:         flex;
    align-items:     center;
    justify-content: center;
    color:           var(--color-accent);
}

.mon-pillar__title {
    font-family:    var(--font-heading);
    font-size:      1.375rem;
    font-weight:    700;
    color:          var(--color-text);
    letter-spacing: var(--letter-heading);
    margin:         0;
}

.mon-pillar__desc {
    font-size:   0.9375rem;
    color:       var(--color-muted);
    line-height: var(--line-height-body);
    margin:      0;
}

.mon-pillar__list {
    list-style:  none;
    margin:      0;
    padding:     0;
    display:     flex;
    flex-direction: column;
    gap:         0.5rem;
    flex:        1;
}

.mon-pillar__list li {
    font-size:   0.875rem;
    color:       var(--color-muted);
    padding-left: 1rem;
    position:    relative;
}

.mon-pillar__list li::before {
    content:       '';
    position:      absolute;
    left:          0;
    top:           0.55em;
    width:         5px;
    height:        5px;
    border-radius: 50%;
    background:    var(--color-accent);
    opacity:       0.8;
}

@media (max-width: 768px) {
    .mon-pillars {
        grid-template-columns: 1fr;
    }
}

/* ══════════════════════════════════════════════════════════
   POLITYKA PRYWATNOŚCI
   ══════════════════════════════════════════════════════════ */

.mprivacy-layout {
    display:               grid;
    grid-template-columns: 260px 1fr;
    gap:                   3rem;
    align-items:           start;
}

/* Nawigacja boczna */
.mprivacy-toc {
    position:       sticky;
    top:            6rem;
    background:     var(--glass-bg);
    border:         1px solid var(--glass-border);
    border-radius:  var(--radius-lg);
    padding:        1.5rem;
    backdrop-filter: var(--glass-blur);
}

.mprivacy-toc__title {
    font-family:    var(--font-heading);
    font-size:      0.75rem;
    font-weight:    700;
    letter-spacing: var(--letter-overline);
    text-transform: uppercase;
    color:          var(--color-accent);
    margin:         0 0 1rem;
}

.mprivacy-toc__list {
    list-style:     none;
    margin:         0;
    padding:        0;
    counter-reset:  toc;
    display:        flex;
    flex-direction: column;
    gap:            0.125rem;
}

.mprivacy-toc__list li a {
    display:         flex;
    align-items:     flex-start;
    gap:             0.5rem;
    font-size:       0.8125rem;
    color:           var(--color-muted);
    text-decoration: none;
    padding:         0.4rem 0.5rem;
    border-radius:   var(--radius-sm);
    line-height:     1.4;
    transition:      color       var(--transition-fast),
                     background  var(--transition-fast);
    counter-increment: toc;
}

.mprivacy-toc__list li a::before {
    content:     counter(toc) ".";
    flex-shrink: 0;
    opacity:     0.45;
    font-size:   0.75rem;
    min-width:   1.25rem;
    margin-top:  0.05em;
}

.mprivacy-toc__list li a:hover {
    color:      var(--color-accent);
    background: rgba(0, 180, 166, 0.06);
}

/* Sekcje dokumentu */
.mprivacy-section {
    margin-bottom:  3rem;
    padding-bottom: 3rem;
    border-bottom:  1px solid rgba(255, 255, 255, 0.05);
}

.mprivacy-section:last-of-type {
    border-bottom: none;
}

.mprivacy-section__header {
    display:     flex;
    align-items: center;
    gap:         1rem;
    margin-bottom: 1.5rem;
}

.mprivacy-section__num {
    display:         flex;
    align-items:     center;
    justify-content: center;
    width:           40px;
    height:          40px;
    border-radius:   var(--radius-sm);
    background:      rgba(0, 180, 166, 0.1);
    border:          1px solid rgba(0, 180, 166, 0.2);
    font-family:     var(--font-heading);
    font-size:       1rem;
    font-weight:     700;
    color:           var(--color-accent);
    flex-shrink:     0;
}

.mprivacy-section__title {
    font-family:    var(--font-heading);
    font-size:      clamp(1.25rem, 2.5vw, 1.625rem);
    font-weight:    700;
    color:          var(--color-text);
    letter-spacing: var(--letter-heading);
    margin:         0;
    line-height:    1.2;
}

.mprivacy-section__body p {
    font-size:   0.9375rem;
    color:       var(--color-muted);
    line-height: var(--line-height-body);
    margin:      0 0 1.25rem;
}

.mprivacy-section__body p:last-child {
    margin-bottom: 0;
}

.mprivacy-section__body h3 {
    font-family:    var(--font-heading);
    font-size:      1.0625rem;
    font-weight:    700;
    color:          var(--color-text);
    letter-spacing: var(--letter-heading);
    margin:         1.75rem 0 0.75rem;
}

.mprivacy-section__body a {
    color:           var(--color-accent);
    transition:      color var(--transition-fast);
    text-underline-offset: 3px;
}

.mprivacy-section__body a:hover {
    color: var(--color-accent-glow);
}

/* Listy */
.mprivacy-list {
    margin:  0 0 1.25rem;
    padding: 0 0 0 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.mprivacy-list li {
    font-size:   0.9375rem;
    color:       var(--color-muted);
    line-height: 1.6;
    padding-left: 1.25rem;
    position:    relative;
}

.mprivacy-list li::before {
    content:       '';
    position:      absolute;
    left:          0;
    top:           0.6em;
    width:         5px;
    height:        5px;
    border-radius: 50%;
    background:    var(--color-accent);
    opacity:       0.8;
}

.mprivacy-list li strong {
    color: var(--color-text);
}

/* Box informacyjny */
.mprivacy-box {
    background:    rgba(0, 180, 166, 0.05);
    border:        1px solid rgba(0, 180, 166, 0.2);
    border-radius: var(--radius-md);
    padding:       1.25rem 1.5rem;
    font-size:     0.9rem;
    color:         var(--color-muted);
    line-height:   1.65;
    margin:        1.25rem 0;
}

.mprivacy-box strong {
    color:        var(--color-text);
    display:      block;
    margin-bottom: 0.25rem;
}

.mprivacy-box a {
    color: var(--color-accent);
}

.mprivacy-box--info {
    background: rgba(14, 165, 233, 0.05);
    border-color: rgba(14, 165, 233, 0.2);
}

/* Prawa grid */
.mprivacy-rights {
    display:        flex;
    flex-direction: column;
    gap:            1rem;
    margin:         1.25rem 0;
}

.mprivacy-right {
    display:     flex;
    gap:         1rem;
    align-items: flex-start;
    padding:     1.25rem;
    background:  var(--glass-bg);
    border:      1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-md);
}

.mprivacy-right__icon {
    width:           40px;
    height:          40px;
    border-radius:   var(--radius-sm);
    background:      rgba(0, 180, 166, 0.08);
    border:          1px solid rgba(0, 180, 166, 0.15);
    display:         flex;
    align-items:     center;
    justify-content: center;
    color:           var(--color-accent);
    flex-shrink:     0;
}

.mprivacy-right strong {
    display:        block;
    font-size:      0.9375rem;
    font-weight:    600;
    color:          var(--color-text);
    margin-bottom:  0.375rem;
}

.mprivacy-right p {
    font-size:   0.875rem;
    color:       var(--color-muted);
    line-height: 1.6;
    margin:      0 !important;
}

/* Tabela cookies */
.mprivacy-table-wrap {
    overflow-x:    auto;
    border-radius: var(--radius-md);
    border:        1px solid var(--glass-border);
    margin:        1.25rem 0;
}

.mprivacy-table {
    width:           100%;
    border-collapse: collapse;
    font-size:       0.875rem;
}

.mprivacy-table th {
    background:     var(--color-bg-card);
    color:          var(--color-text);
    font-weight:    600;
    padding:        0.75rem 1rem;
    text-align:     left;
    white-space:    nowrap;
    border-bottom:  1px solid var(--glass-border);
}

.mprivacy-table td {
    padding:        0.75rem 1rem;
    color:          var(--color-muted);
    vertical-align: top;
    border-bottom:  1px solid rgba(255, 255, 255, 0.04);
    line-height:    1.55;
}

.mprivacy-table td strong {
    color: var(--color-text);
}

.mprivacy-table tbody tr:last-child td {
    border-bottom: none;
}

.mprivacy-table tbody tr:nth-child(even) td {
    background: rgba(255, 255, 255, 0.02);
}

/* Responsive */
@media (max-width: 1024px) {
    .mprivacy-layout {
        grid-template-columns: 1fr;
    }

    .mprivacy-toc {
        position: static;
    }
}

@media (max-width: 640px) {
    .mprivacy-section__header {
        flex-direction: column;
        align-items:    flex-start;
        gap:            0.75rem;
    }
}

/* ══════════════════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
    .mpage-split {
        grid-template-columns: 1fr;
    }

    .mpage-split--reverse {
        direction: ltr;
    }

    .mpage-hero__cta-row {
        flex-direction: column;
        align-items:    stretch;
    }

    .mpage-btn {
        justify-content: center;
    }

    .mpage-steps {
        grid-template-columns: 1fr;
        gap:                   2.5rem;
    }
}

@media (max-width: 1100px) {
    .mpage-products--3col {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .mpage-series-nav {
        top: 60px;
    }

    .mpage-products--2col,
    .mpage-products--3col {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 540px) {
    .mpage-products {
        grid-template-columns: 1fr;
    }

    .mpage-features {
        grid-template-columns: 1fr;
    }

    .mpage-series-nav__link {
        padding: 0.875rem 1rem;
        font-size: 0.8125rem;
    }
}

/* ══════════════════════════════════════════════════════════
   USP PILLARS — .mpage-usps
   ══════════════════════════════════════════════════════════ */

.mpage-usps {
    display:               grid;
    grid-template-columns: repeat(4, 1fr);
    gap:                   1.5rem;
}

.mpage-usp {
    background:    rgba(255, 255, 255, 0.03);
    border:        1px solid var(--glass-border);
    border-radius: var(--radius-md);
    padding:       1.75rem 1.5rem;
    transition:    border-color var(--transition-fast), background var(--transition-fast);
}

.mpage-usp:hover {
    background:    rgba(0, 180, 166, 0.05);
    border-color:  rgba(0, 180, 166, 0.3);
}

.mpage-usp__icon {
    width:         48px;
    height:        48px;
    display:       flex;
    align-items:   center;
    justify-content: center;
    background:    rgba(0, 180, 166, 0.1);
    border-radius: var(--radius-sm);
    color:         var(--color-accent);
    margin-bottom: 1rem;
}

.mpage-usp__title {
    font-size:     1rem;
    font-weight:   600;
    color:         var(--color-text);
    margin:        0 0 0.5rem;
    line-height:   1.3;
}

.mpage-usp__desc {
    font-size:   0.875rem;
    color:       var(--color-muted);
    line-height: var(--line-height-body);
    margin:      0;
}

@media (max-width: 1024px) {
    .mpage-usps { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px) {
    .mpage-usps { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════
   COMPARISON TABLE — .mpage-compare-table
   ══════════════════════════════════════════════════════════ */

.mpage-compare-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: var(--radius-md);
    border: 1px solid var(--glass-border);
}

.mpage-compare-table {
    width:           100%;
    border-collapse: collapse;
    font-size:       0.875rem;
    min-width:       600px;
}

.mpage-compare-table thead th {
    background:    rgba(0, 180, 166, 0.08);
    color:         var(--color-text);
    font-weight:   600;
    padding:       0.875rem 1rem;
    text-align:    center;
    border-bottom: 1px solid var(--glass-border);
    white-space:   nowrap;
}

.mpage-compare-table thead th:first-child {
    text-align: left;
}

.mpage-compare-table tbody tr:nth-child(even) {
    background: rgba(255, 255, 255, 0.02);
}

.mpage-compare-table tbody th,
.mpage-compare-table tbody td {
    padding:       0.75rem 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    color:         var(--color-muted);
    text-align:    center;
}

.mpage-compare-table tbody th {
    text-align: left;
    font-weight: 500;
    color:       var(--color-text);
    white-space: nowrap;
}

.mpage-compare-table tbody tr:last-child th,
.mpage-compare-table tbody tr:last-child td {
    border-bottom: none;
}

.mpage-compare-table__featured {
    background:    rgba(0, 180, 166, 0.07) !important;
    color:         var(--color-accent) !important;
    font-weight:   600 !important;
    border-left:   1px solid rgba(0, 180, 166, 0.2);
    border-right:  1px solid rgba(0, 180, 166, 0.2);
}

/* ══════════════════════════════════════════════════════════
   COMPARE CHOICE — .mpage-compare-choice
   ══════════════════════════════════════════════════════════ */

.mpage-compare-choice {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.mpage-compare-choice__col {
    background:    rgba(255, 255, 255, 0.03);
    border:        1px solid var(--glass-border);
    border-radius: var(--radius-md);
    padding:       1.75rem;
}

.mpage-compare-choice__col--evo {
    border-color: rgba(0, 180, 166, 0.2);
}

.mpage-compare-choice__col--refiner {
    background:   rgba(0, 180, 166, 0.04);
    border-color: rgba(0, 180, 166, 0.35);
}

.mpage-compare-choice__col--comfort {
    border-color: rgba(0, 180, 166, 0.2);
}

.mpage-compare-choice__header {
    display:       flex;
    align-items:   center;
    gap:           0.75rem;
    margin-bottom: 1rem;
    color:         var(--color-accent);
}

.mpage-compare-choice__header h3 {
    font-size:   1rem;
    font-weight: 600;
    color:       var(--color-text);
    margin:      0;
}

.mpage-compare-choice__col ul {
    list-style: none;
    margin:     0;
    padding:    0;
    display:    flex;
    flex-direction: column;
    gap:        0.625rem;
}

.mpage-compare-choice__col li {
    font-size:   0.875rem;
    color:       var(--color-muted);
    padding-left: 1.25rem;
    position:    relative;
    line-height: 1.5;
}

.mpage-compare-choice__col li::before {
    content:  '✓';
    position: absolute;
    left:     0;
    color:    var(--color-accent);
    font-weight: 700;
}

@media (max-width: 768px) {
    .mpage-compare-choice { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════
   FAQ — .mpage-faq
   ══════════════════════════════════════════════════════════ */

.mpage-faq {
    display:        flex;
    flex-direction: column;
    gap:            0;
    max-width:      860px;
    margin:         0 auto;
}

.mpage-faq__item {
    border-bottom: 1px solid var(--glass-border);
    padding:       1.5rem 0;
}

.mpage-faq__item:last-child {
    border-bottom: none;
}

.mpage-faq__q {
    font-size:   1rem;
    font-weight: 600;
    color:       var(--color-text);
    margin:      0 0 0.75rem;
    line-height: 1.4;
}

.mpage-faq__a p {
    font-size:   0.9375rem;
    color:       var(--color-muted);
    line-height: var(--line-height-body);
    margin:      0;
}

.mpage-faq__a a {
    color:           var(--color-accent);
    text-decoration: none;
}

.mpage-faq__a a:hover {
    text-decoration: underline;
}

/* ══════════════════════════════════════════════════════════
   CTA BLOCK — .mpage-cta-block
   ══════════════════════════════════════════════════════════ */

.mpage-cta-block {
    text-align: center;
    max-width:  680px;
    margin:     0 auto;
}

.mpage-cta-block__title {
    font-family:    var(--font-heading);
    font-size:      clamp(1.5rem, 3vw, 2.25rem);
    font-weight:    700;
    color:          var(--color-text);
    margin:         0.5rem 0 1rem;
    line-height:    1.2;
    letter-spacing: -0.02em;
}

.mpage-cta-block__sub {
    font-size:   1rem;
    color:       var(--color-muted);
    line-height: var(--line-height-body);
    margin:      0 0 2rem;
}

.mpage-cta-block .mpage-hero__cta-row {
    justify-content: center;
}

/* ══════════════════════════════════════════════════════════
   REFINER DIAGRAM — .mpage-refiner-diagram
   ══════════════════════════════════════════════════════════ */

.mpage-refiner-diagram {
    display:        flex;
    flex-direction: column;
    gap:            0.75rem;
    padding:        1.5rem;
    background:     rgba(0, 180, 166, 0.04);
    border:         1px solid rgba(0, 180, 166, 0.2);
    border-radius:  var(--radius-md);
}

.mpage-refiner-layer {
    display:       flex;
    align-items:   center;
    gap:           1rem;
    padding:       1rem 1.25rem;
    border-radius: var(--radius-sm);
    border:        1px solid var(--glass-border);
}

.mpage-refiner-layer--ion {
    background: rgba(14, 165, 233, 0.06);
    color:      #38bdf8;
}

.mpage-refiner-layer--carbon {
    background: rgba(100, 116, 139, 0.1);
    color:      var(--color-muted);
}

.mpage-refiner-layer strong {
    display:     block;
    font-size:   0.875rem;
    font-weight: 600;
    color:       var(--color-text);
}

.mpage-refiner-layer span {
    font-size:  0.8125rem;
    color:      var(--color-muted);
    margin-top: 0.125rem;
    display:    block;
}

.mpage-refiner-result {
    display:        flex;
    align-items:    center;
    gap:            1rem;
    padding:        1rem 1.25rem;
    background:     rgba(0, 180, 166, 0.1);
    border:         1px solid rgba(0, 180, 166, 0.3);
    border-radius:  var(--radius-sm);
    color:          var(--color-accent);
}

.mpage-refiner-result strong {
    font-size:   0.875rem;
    font-weight: 600;
}

/* ══════════════════════════════════════════════════════════
   BADANIE WODY — obszary działania (.mbw-areas)
   ══════════════════════════════════════════════════════════ */

.mbw-areas {
    display:        flex;
    flex-direction: column;
    gap:            0.75rem;
    max-width:      860px;
    margin:         0 auto;
}

.mbw-area {
    display:       flex;
    align-items:   center;
    gap:           1rem;
    padding:       1rem 1.25rem;
    background:    rgba(255, 255, 255, 0.03);
    border:        1px solid var(--glass-border);
    border-radius: var(--radius-md);
    transition:    border-color var(--transition-fast);
}

.mbw-area--main {
    background:  rgba(0, 180, 166, 0.05);
    border-color: rgba(0, 180, 166, 0.3);
}

.mbw-area__icon {
    flex-shrink: 0;
    color:       var(--color-accent);
    opacity:     0.8;
}

.mbw-area__info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.mbw-area__info strong {
    font-size:   0.9375rem;
    font-weight: 600;
    color:       var(--color-text);
}

.mbw-area__info span {
    font-size: 0.8125rem;
    color:     var(--color-muted);
}

.mbw-area__tag {
    flex-shrink:   0;
    font-size:     0.75rem;
    font-weight:   600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color:         var(--color-accent);
    background:    rgba(0, 180, 166, 0.1);
    border:        1px solid rgba(0, 180, 166, 0.3);
    border-radius: var(--radius-pill);
    padding:       0.25rem 0.75rem;
}

/* ══════════════════════════════════════════════════════════
   BADANIE WODY — formularz layout (.mbw-form-*)
   ══════════════════════════════════════════════════════════ */

.mbw-form-layout {
    display:               grid;
    grid-template-columns: 1fr 1fr;
    gap:                   clamp(2rem, 5vw, 4rem);
    align-items:           start;
}

.mbw-form-wrap {
    background:    rgba(255, 255, 255, 0.03);
    border:        1px solid var(--glass-border);
    border-radius: var(--radius-lg);
    padding:       clamp(1.5rem, 3vw, 2.5rem);
}

.mbw-form__title {
    font-family:    var(--font-heading);
    font-size:      1.25rem;
    font-weight:    700;
    color:          var(--color-text);
    margin:         0 0 1.5rem;
    padding-bottom: 1rem;
    border-bottom:  1px solid var(--glass-border);
}

@media (max-width: 900px) {
    .mbw-form-layout {
        grid-template-columns: 1fr;
    }
}

/* ══════════════════════════════════════════════════
   TIMELINE — /o-nas/
   ══════════════════════════════════════════════════ */
.mon-timeline {
    position:   relative;
    max-width:  860px;
    margin:     0 auto;
    padding:    2rem 0;
}

/* Pionowa linia */
.mon-timeline::before {
    content:    '';
    position:   absolute;
    left:       50%;
    top:        0;
    bottom:     0;
    width:      2px;
    background: var(--glass-border);
    transform:  translateX(-50%);
}

.mon-timeline__item {
    position:   relative;
    width:      45%;
    margin-bottom: 2.5rem;
}

.mon-timeline__item--left  { margin-right: auto; text-align: right; }
.mon-timeline__item--right { margin-left:  auto; text-align: left;  }

/* Kropka na linii */
.mon-timeline__dot {
    position:     absolute;
    top:          1.25rem;
    width:        14px;
    height:       14px;
    border-radius: 50%;
    border:       3px solid var(--color-bg);
    box-shadow:   0 0 0 2px currentColor;
}

.mon-timeline__item--left  .mon-timeline__dot { right: -9.5%; }
.mon-timeline__item--right .mon-timeline__dot { left:  -9.5%; }

.mon-timeline__card {
    background:    var(--glass-bg);
    border:        1px solid var(--glass-border);
    border-radius: var(--radius-md);
    padding:       1.25rem 1.5rem;
    transition:    border-color .25s, transform .25s;
}

.mon-timeline__card:hover {
    border-color: var(--color-accent);
    transform:    translateY(-2px);
}

.mon-timeline__year {
    display:      block;
    font-family:  var(--font-heading);
    font-size:    1.75rem;
    font-weight:  800;
    line-height:  1;
    letter-spacing: -.04em;
    margin-bottom: .5rem;
}

.mon-timeline__title {
    font-family:  var(--font-heading);
    font-size:    1rem;
    font-weight:  700;
    color:        var(--color-text);
    margin:       0 0 .5rem;
}

.mon-timeline__desc {
    font-size:   .875rem;
    color:       var(--color-muted);
    line-height: var(--line-height-body);
    margin:      0;
}

@media (max-width: 700px) {
    .mon-timeline::before { left: 18px; }

    .mon-timeline__item,
    .mon-timeline__item--left,
    .mon-timeline__item--right {
        width:      calc(100% - 2.5rem); /* odjęcie margin-left żeby nie wylewać poza viewport */
        margin:     0 0 1.5rem 2.5rem;
        text-align: left;
    }

    .mon-timeline__item--left  .mon-timeline__dot,
    .mon-timeline__item--right .mon-timeline__dot {
        left:  -2rem;
        right: auto;
    }
}

/* ── Mobile Hero Font Fix ────────────────────────────────── */
@media (max-width: 768px) {
    .mpage-hero__title {
        font-size: clamp(1.75rem, 7vw, 2.25rem);
    }
    .mpage-hero__overline {
        white-space: normal;
        max-width:   calc(100vw - 3rem);
        line-height: 1.5;
    }
    .mpage-hero__cta-row {
        flex-direction: column;
    }
    .mpage-btn {
        width:           100%;
        justify-content: center;
    }
}

/* ══════════════════════════════════════════════════════════
   Gallery hint — mały pasek z linkiem do galerii
   Użycie: .mpage-gallery-hint na stronach zmiekczacze, filtry
   ══════════════════════════════════════════════════════════ */
.mpage-gallery-hint {
    margin-top:    2rem;
    text-align:    center;
    font-size:     .9rem;
    color:         var(--color-muted);
}

.mpage-gallery-hint__link {
    color:           var(--color-accent);
    text-decoration: none;
    font-weight:     600;
    margin-left:     .25rem;
    transition:      color var(--transition-fast);
}

.mpage-gallery-hint__link:hover {
    color: var(--color-accent-glow);
}