/*
===========================================================
OTKF — PROFESJONALNA WERSJA MOBILE
Arkusz końcowy. Nie zmienia logiki strony.
===========================================================
*/

/* Zabezpieczenie całej strony przed przewijaniem w bok */
html,
body{
    width:100%;
    max-width:100%;
    overflow-x:clip !important;
}

.home-page-main,
.home-page-main > section,
.home-page-main .container,
.home-page-main .section-heading,
.home-page-main .news-grid,
.home-page-main .home-gallery-layout,
.home-page-main .benefit-grid,
.home-page-main .join-box,
.home-page-main .contact-layout,
.home-page-main .contact-grid,
.home-page-main .tfp-promo{
    min-width:0 !important;
    max-width:100%;
}

.home-page-main img,
.home-page-main video,
.home-page-main iframe{
    max-width:100% !important;
}

/* Nie pozwalamy dekoracjom wychodzić poza ekran */
.hero,
.partner-feature,
.news-section,
.home-gallery-pro,
.about-section,
.membership-section,
.contact-section{
    overflow-x:clip !important;
}

/* =========================================================
   MOBILE / TABLET
========================================================= */

@media (max-width: 760px){

    html{
        scroll-padding-top:72px;
    }

    body{
        font-size:15px;
    }

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

    .section{
        padding:70px 0 !important;
    }

    h2{
        font-size:clamp(34px, 10vw, 46px) !important;
        line-height:1.02 !important;
        letter-spacing:-.045em !important;
        overflow-wrap:anywhere;
    }

    .eyebrow{
        margin-bottom:13px !important;
        font-size:10px !important;
        letter-spacing:.13em !important;
    }

    .section-heading{
        display:flex !important;
        flex-direction:column !important;
        align-items:flex-start !important;
        gap:18px !important;
        margin-bottom:30px !important;
    }

    .section-heading p{
        margin-top:10px !important;
        font-size:14px !important;
        line-height:1.65 !important;
    }

    .section-link{
        display:inline-flex !important;
        min-height:42px !important;
        align-items:center !important;
        padding:0 14px !important;
        border:1px solid rgba(6,61,49,.12) !important;
        border-radius:11px !important;
        background:#fff !important;
        box-shadow:0 8px 20px rgba(5,43,34,.06) !important;
        font-size:12px !important;
        text-decoration:none !important;
    }

    /* -------------------------
       HEADER I STATUS
    ------------------------- */

    .header{
        width:100% !important;
    }

    .header-inner{
        min-height:68px !important;
    }

    .logo img{
        height:42px !important;
        width:auto !important;
    }

    .hamburger{
        width:42px !important;
        height:42px !important;
        flex:0 0 42px !important;
    }

    .court-status{
        position:relative !important;
        z-index:2 !important;
    }

    .court-status-inner{
        min-height:38px !important;
        padding:8px 0 !important;
        flex-wrap:nowrap !important;
        justify-content:center !important;
        gap:8px !important;
        font-size:11px !important;
        white-space:nowrap !important;
    }

    .court-status-inner span:last-child{
        display:none !important;
    }

    /* -------------------------
       HERO
    ------------------------- */

    .hero{
        min-height:auto !important;
        background-position:58% center !important;
    }

    .hero::after,
    .hero-noise{
        display:none !important;
    }

    .hero-layout{
        display:block !important;
        padding:58px 0 62px !important;
    }

    .hero-content{
        width:100% !important;
        max-width:100% !important;
    }

    .hero-title{
        max-width:100% !important;
        margin-bottom:20px !important;
        font-size:clamp(43px, 12.4vw, 58px) !important;
        line-height:.94 !important;
        letter-spacing:-.06em !important;
        overflow-wrap:normal !important;
        word-break:normal !important;
    }

    .hero-subtitle{
        max-width:34rem !important;
        font-size:15px !important;
        line-height:1.7 !important;
    }

    .hero-buttons{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:10px !important;
        margin-top:26px !important;
    }

    .hero-buttons .btn{
        width:100% !important;
        min-height:50px !important;
    }

    /* Na telefonie usuwamy poboczną kartę.
       Główne CTA jest czytelniejsze i strona jest krótsza. */
    .hero-card{
        display:none !important;
    }

    .hero-trust{
        display:grid !important;
        grid-template-columns:repeat(3, minmax(0,1fr)) !important;
        gap:8px !important;
        margin-top:30px !important;
        padding-top:20px !important;
    }

    .hero-trust div{
        min-width:0 !important;
    }

    .hero-trust strong{
        font-size:17px !important;
    }

    .hero-trust span{
        margin-top:5px !important;
        font-size:9px !important;
        line-height:1.35 !important;
        overflow-wrap:anywhere !important;
    }

    /* -------------------------
       TENNIS FINALS PRO
    ------------------------- */

    .partner-feature{
        padding:48px 0 !important;
        background:#f3f7f6 !important;
    }

    .partner-feature .tfp-promo{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:28px !important;
        width:100% !important;
        padding:26px 20px 22px !important;
        border-radius:22px !important;
        overflow:hidden !important;
    }

    .partner-feature .tfp-copy{
        width:100% !important;
        max-width:100% !important;
    }

    .partner-feature .tfp-brand-line{
        align-items:flex-start !important;
        flex-direction:column !important;
        gap:10px !important;
    }

    .partner-feature .tfp-brand-line img{
        width:154px !important;
        max-width:52vw !important;
    }

    .partner-feature .tfp-brand-line span{
        max-width:100% !important;
        white-space:normal !important;
        line-height:1.35 !important;
    }

    .partner-feature h2#partner-title{
        max-width:100% !important;
        margin-bottom:14px !important;
        font-size:clamp(36px, 11vw, 48px) !important;
        line-height:.98 !important;
        overflow-wrap:anywhere !important;
    }

    .partner-feature .tfp-lead{
        font-size:14px !important;
        line-height:1.65 !important;
    }

    .partner-feature .tfp-list{
        gap:9px !important;
    }

    .partner-feature .tfp-list li{
        padding-left:23px !important;
        font-size:13px !important;
        line-height:1.5 !important;
    }

    .partner-feature .tfp-actions{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:13px !important;
        margin-top:24px !important;
    }

    .partner-feature .tfp-actions .btn{
        width:100% !important;
    }

    .partner-feature .tfp-url-link{
        justify-self:start !important;
        font-size:13px !important;
    }

    .partner-feature .tfp-preview{
        width:100% !important;
        justify-content:center !important;
    }

    .partner-feature .tfp-screen-link{
        width:100% !important;
        max-width:100% !important;
        margin:0 !important;
    }

    .partner-feature .tfp-screen{
        width:100% !important;
        border-radius:15px !important;
        transform:none !important;
    }

    .partner-feature .tfp-screen-badge{
        left:10px !important;
        top:10px !important;
        padding:6px 9px !important;
        font-size:9px !important;
    }

    /* -------------------------
       AKTUALNOŚCI
    ------------------------- */

    .news-grid{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:14px !important;
    }

    .news-card{
        width:100% !important;
        border-radius:18px !important;
    }

    .news-card-featured .news-card-image{
        aspect-ratio:16/10 !important;
    }

    .news-card-featured h3{
        font-size:23px !important;
    }

    /* Kolejne newsy jako kompaktowe karty poziome */
    .news-card:not(.news-card-featured){
        display:grid !important;
        grid-template-columns:112px minmax(0,1fr) !important;
    }

    .news-card:not(.news-card-featured) .news-card-image{
        height:100% !important;
        min-height:145px !important;
        aspect-ratio:auto !important;
    }

    .news-card:not(.news-card-featured) .news-card-body{
        padding:17px 15px !important;
    }

    .news-card:not(.news-card-featured) h3{
        margin:7px 0 6px !important;
        font-size:17px !important;
    }

    .news-card:not(.news-card-featured) p{
        display:none !important;
    }

    .news-card:not(.news-card-featured) .news-read-more{
        margin-top:8px !important;
        font-size:11px !important;
    }

    .news-card:not(.news-card-featured) .news-badge{
        left:8px !important;
        top:8px !important;
        font-size:8px !important;
    }

    /* -------------------------
       GALERIA — KOMPAKTOWA
       1 duże + 2 małe, reszta w pełnej galerii
    ------------------------- */

    .home-gallery-pro{
        padding:70px 0 !important;
    }

    .home-gallery-layout{
        display:grid !important;
        grid-template-columns:repeat(2, minmax(0,1fr)) !important;
        grid-template-rows:290px 155px !important;
        gap:11px !important;
        width:100% !important;
    }

    .home-gallery-card{
        width:100% !important;
        height:auto !important;
        min-height:0 !important;
        border-radius:17px !important;
    }

    .home-gallery-card.featured{
        grid-column:1 / -1 !important;
        grid-row:1 !important;
        height:auto !important;
    }

    .home-gallery-card:nth-child(2),
    .home-gallery-card:nth-child(3){
        grid-row:2 !important;
    }

    /* Na homepage telefonu pokazujemy tylko 3 zdjęcia.
       Pełna galeria ma osobne stronicowanie. */
    .home-gallery-card:nth-child(n+4){
        display:none !important;
    }

    .home-gallery-overlay{
        left:14px !important;
        right:14px !important;
        bottom:13px !important;
    }

    .home-gallery-card h3{
        margin-top:6px !important;
        font-size:13px !important;
        line-height:1.25 !important;
    }

    .home-gallery-card.featured h3{
        font-size:21px !important;
    }

    .home-gallery-card:nth-child(2) h3,
    .home-gallery-card:nth-child(3) h3{
        display:none !important;
    }

    .home-gallery-tag{
        padding:5px 8px !important;
        font-size:8px !important;
    }

    /* -------------------------
       O NAS
    ------------------------- */

    .about-section{
        position:relative !important;
        z-index:1 !important;
        padding:72px 0 78px !important;
        margin:0 !important;
    }

    .about-intro{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:18px !important;
        margin-bottom:30px !important;
    }

    .about-intro p{
        font-size:14px !important;
        line-height:1.7 !important;
    }

    .benefit-grid{
        display:grid !important;
        grid-template-columns:repeat(2, minmax(0,1fr)) !important;
        gap:11px !important;
    }

    .benefit-card{
        min-height:180px !important;
        padding:18px 15px !important;
        border-radius:17px !important;
    }

    .benefit-number{
        top:14px !important;
        right:14px !important;
        font-size:10px !important;
    }

    .benefit-icon{
        width:40px !important;
        height:40px !important;
        margin-bottom:24px !important;
        border-radius:12px !important;
        font-size:18px !important;
    }

    .benefit-card h3{
        margin-bottom:8px !important;
        font-size:15px !important;
        line-height:1.25 !important;
    }

    .benefit-card p{
        font-size:11px !important;
        line-height:1.55 !important;
    }

    /* -------------------------
       CZŁONKOSTWO
       Bez nachodzenia na poprzednią sekcję
    ------------------------- */

    .membership-section{
        position:relative !important;
        z-index:2 !important;
        clear:both !important;
        width:100% !important;
        margin:0 !important;
        padding:64px 0 72px !important;
        background:#f4f7f6 !important;
        transform:none !important;
    }

    .membership-section::before{
        content:"" !important;
        position:absolute !important;
        left:0 !important;
        right:0 !important;
        top:0 !important;
        height:1px !important;
        background:rgba(6,61,49,.08) !important;
    }

    .membership-section .join-box{
        position:relative !important;
        inset:auto !important;
        top:auto !important;
        bottom:auto !important;
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:24px !important;
        width:100% !important;
        max-width:100% !important;
        min-height:0 !important;
        margin:0 !important;
        padding:28px 20px !important;
        border-radius:22px !important;
        transform:none !important;
        background:
            radial-gradient(circle at 95% 10%, rgba(55,196,150,.18), transparent 32%),
            linear-gradient(150deg,#033e31 0%,#075846 100%) !important;
        box-shadow:0 18px 45px rgba(4,49,39,.18) !important;
        overflow:hidden !important;
    }

    .membership-section .join-box::after{
        width:180px !important;
        height:180px !important;
        right:-100px !important;
        bottom:-100px !important;
        opacity:.55 !important;
    }

    .join-content,
    .join-download{
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;
    }

    .join-content h2{
        margin-bottom:14px !important;
        font-size:clamp(33px, 9.8vw, 43px) !important;
    }

    .join-content p{
        font-size:14px !important;
        line-height:1.65 !important;
    }

    .join-benefits{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:10px !important;
        margin-top:22px !important;
    }

    .join-benefits li{
        padding-left:23px !important;
        font-size:12px !important;
        line-height:1.45 !important;
    }

    .join-download{
        padding:22px 18px !important;
        border-radius:17px !important;
    }

    .document-icon{
        width:43px !important;
        height:43px !important;
        border-radius:12px !important;
        font-size:22px !important;
    }

    .join-download h3{
        margin:17px 0 7px !important;
        font-size:21px !important;
    }

    .join-download p{
        margin-bottom:18px !important;
        font-size:12px !important;
        line-height:1.55 !important;
    }

    .join-download .btn{
        width:100% !important;
        min-height:48px !important;
        padding:10px 14px !important;
        white-space:normal !important;
        text-align:center !important;
    }

    .join-download .text-link{
        margin-top:15px !important;
        text-align:center !important;
        overflow-wrap:anywhere !important;
    }

    /* -------------------------
       KONTAKT
    ------------------------- */

    .contact-section{
        padding:72px 0 !important;
    }

    .contact-layout{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:26px !important;
    }

    .contact-grid{
        display:grid !important;
        grid-template-columns:1fr 1fr !important;
        gap:10px !important;
    }

    .contact-card{
        min-width:0 !important;
        padding:18px 14px !important;
        border-radius:16px !important;
    }

    .contact-card .name{
        margin:7px 0 12px !important;
        font-size:15px !important;
        line-height:1.25 !important;
        overflow-wrap:anywhere !important;
    }

    .contact-card .phone{
        font-size:12px !important;
    }

    .contact-info-card{
        align-items:flex-start !important;
        gap:13px !important;
        padding:17px 14px !important;
        border-radius:16px !important;
    }

    .contact-info-card > div{
        min-width:0 !important;
    }

    .contact-info-card strong,
    .contact-info-card p{
        overflow-wrap:anywhere !important;
    }

    .contact-info-icon{
        width:42px !important;
        height:42px !important;
        flex:0 0 42px !important;
    }

    .contact-form-box{
        width:100% !important;
        padding:24px 18px !important;
        border-radius:18px !important;
    }

    .contact-form-box h3{
        margin-bottom:20px !important;
        font-size:24px !important;
    }

    .contact-form button{
        width:100% !important;
    }

    /* -------------------------
       STOPKA / COOKIE
    ------------------------- */

    .footer-grid{
        grid-template-columns:1fr !important;
        gap:32px !important;
    }

    .footer-bottom{
        flex-direction:column !important;
        gap:8px !important;
    }

    .cookieBox{
        max-height:calc(100vh - 28px) !important;
        overflow-y:auto !important;
    }
}

/* Bardzo małe telefony */
@media (max-width: 390px){

    .container{
        width:calc(100% - 20px) !important;
    }

    .hero-title{
        font-size:41px !important;
    }

    .hero-trust{
        grid-template-columns:1fr !important;
        gap:12px !important;
    }

    .hero-trust div{
        display:grid !important;
        grid-template-columns:52px 1fr !important;
        align-items:center !important;
        gap:8px !important;
    }

    .hero-trust span{
        margin:0 !important;
    }

    .benefit-grid{
        grid-template-columns:1fr !important;
    }

    .benefit-card{
        min-height:150px !important;
    }

    .contact-grid{
        grid-template-columns:1fr !important;
    }

    .home-gallery-layout{
        grid-template-rows:260px 135px !important;
    }
}


/* =========================================================
   DESKTOP — poprawka nachodzącej sekcji "Dołącz do OTKF"
   ========================================================= */

@media (min-width: 761px){

    .about-section{
        position:relative !important;
        z-index:1 !important;
        margin:0 !important;
        padding-bottom:112px !important;
        overflow:visible !important;
    }

    .membership-section{
        position:relative !important;
        z-index:2 !important;
        clear:both !important;
        width:100% !important;
        margin:0 !important;
        padding:96px 0 112px !important;
        background:#ffffff !important;
        transform:none !important;
        overflow:visible !important;
    }

    .membership-section .container{
        position:relative !important;
        z-index:2 !important;
    }

    .membership-section .join-box{
        position:relative !important;
        inset:auto !important;
        top:auto !important;
        right:auto !important;
        bottom:auto !important;
        left:auto !important;
        width:100% !important;
        margin:0 auto !important;
        transform:none !important;
    }
}


/* =========================================================
   WĄSKIE EKRANY — 24/7, 2 KORTY I OTKF W JEDNYM RZĘDZIE
   ========================================================= */

@media (max-width: 430px){

    .hero-trust{
        display:grid !important;
        grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
        gap:0 !important;
        width:100% !important;
        margin-top:26px !important;
        padding-top:0 !important;
        border-top:1px solid rgba(255,255,255,.18) !important;
    }

    .hero-trust div{
        min-width:0 !important;
        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;
        justify-content:center !important;
        gap:5px !important;
        padding:14px 5px 8px !important;
        text-align:center !important;
    }

    .hero-trust div:not(:last-child){
        border-right:1px solid rgba(255,255,255,.14) !important;
    }

    .hero-trust strong{
        width:100% !important;
        font-size:17px !important;
        line-height:1 !important;
        white-space:nowrap !important;
    }

    .hero-trust span{
        width:100% !important;
        margin:0 !important;
        font-size:8px !important;
        line-height:1.25 !important;
        white-space:normal !important;
        overflow-wrap:anywhere !important;
    }
}


/* =========================================================
   GALERIA PREMIUM — MOBILE
   ========================================================= */

@media(max-width:760px){

  .home-gallery-pro{
    padding:72px 0 !important;
  }

  .home-gallery-pro::before{
    display:none !important;
  }

  .home-gallery-heading{
    margin-bottom:27px !important;
  }

  .home-gallery-heading p{
    max-width:32rem !important;
  }

  .home-gallery-all-link{
    display:none !important;
  }

  .home-gallery-showcase{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    grid-template-rows:285px 145px !important;
    gap:10px !important;
  }

  .home-gallery-item{
    border-radius:17px !important;
  }

  .home-gallery-item:nth-child(1){
    grid-column:1/-1 !important;
    grid-row:1 !important;
  }

  .home-gallery-item:nth-child(2){
    display:block !important;
    grid-column:1 !important;
    grid-row:2 !important;
  }

  .home-gallery-item:nth-child(3),
  .home-gallery-item:nth-child(4){
    display:none !important;
  }

  .home-gallery-item:nth-child(5){
    display:flex !important;
    grid-column:2 !important;
    grid-row:2 !important;
  }

  .home-gallery-meta{
    left:14px !important;
    right:14px !important;
    bottom:13px !important;
  }

  .home-gallery-category{
    min-height:21px !important;
    padding:0 8px !important;
    margin-bottom:6px !important;
    font-size:7px !important;
  }

  .home-gallery-meta h3{
    font-size:13px !important;
  }

  .home-gallery-item--featured .home-gallery-meta h3{
    font-size:21px !important;
  }

  .home-gallery-item:nth-child(2) .home-gallery-meta h3,
  .home-gallery-item:nth-child(2) .home-gallery-meta time{
    display:none !important;
  }

  .home-gallery-zoom{
    display:none !important;
  }

  .home-gallery-more-content{
    padding:14px !important;
  }

  .home-gallery-more-content strong{
    font-size:25px !important;
  }

  .home-gallery-more-content span{
    margin-top:4px !important;
    font-size:8px !important;
  }

  .home-gallery-more-content b{
    margin-top:10px !important;
    font-size:9px !important;
    line-height:1.3 !important;
  }

  .home-gallery-desktop-count{
    display:none !important;
  }

  .home-gallery-mobile-count{
    display:block !important;
  }

  .home-gallery-mobile-action{
    display:block !important;
    margin-top:14px !important;
  }

  .home-gallery-mobile-action a{
    min-height:50px !important;
    display:grid !important;
    grid-template-columns:1fr auto auto !important;
    align-items:center !important;
    gap:10px !important;
    padding:0 15px 0 17px !important;
    border:1px solid rgba(6,61,49,.11) !important;
    border-radius:14px !important;
    color:#063d31 !important;
    background:#fff !important;
    box-shadow:0 10px 26px rgba(5,43,34,.06) !important;
    text-decoration:none !important;
    font-size:12px !important;
    font-weight:800 !important;
  }

  .home-gallery-mobile-action span{
    color:#7c8d87 !important;
    font-size:10px !important;
  }

  .home-gallery-mobile-action b{
    color:#ff6426 !important;
    font-size:17px !important;
  }

  .home-gallery-lightbox{
    padding:8px !important;
  }

  .home-gallery-lightbox-dialog{
    width:100% !important;
    height:calc(100vh - 16px) !important;
    grid-template-columns:48px minmax(0,1fr) 48px !important;
    grid-template-rows:58px minmax(0,1fr) !important;
    border-radius:18px !important;
  }

  .home-gallery-lightbox-topbar{
    padding:0 10px 0 15px !important;
  }

  .home-gallery-lightbox-topbar span{
    font-size:11px !important;
  }

  .home-gallery-lightbox-close{
    width:37px !important;
    height:37px !important;
  }

  .home-gallery-lightbox-nav{
    width:38px !important;
    height:44px !important;
    border-radius:12px !important;
    font-size:28px !important;
  }

  .home-gallery-lightbox-figure{
    padding:10px 0 18px !important;
  }

  .home-gallery-lightbox-figure img{
    max-height:calc(100vh - 150px) !important;
    border-radius:11px !important;
  }

  .home-gallery-lightbox-figure figcaption{
    padding:0 8px !important;
    font-size:11px !important;
  }
}

@media(max-width:390px){
  .home-gallery-showcase{
    grid-template-rows:250px 128px !important;
  }

  .home-gallery-item--featured .home-gallery-meta h3{
    font-size:19px !important;
  }
}


/* =========================================================
   TENNISFINALSPRO — MOBILE PREMIUM
   ========================================================= */

@media(max-width:760px){

  .tfpx-section{
    padding:48px 0 !important;
  }

  .tfpx-section::before{
    display:none !important;
  }

  .tfpx-card{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:23px !important;
    width:100% !important;
    padding:25px 19px 0 !important;
    border-radius:23px !important;
    overflow:hidden !important;
  }

  .tfpx-card::after{
    width:290px !important;
    height:290px !important;
    right:-170px !important;
    top:-110px !important;
  }

  .tfpx-copy{
    width:100% !important;
    max-width:100% !important;
    padding-bottom:0 !important;
  }

  .tfpx-topline{
    align-items:flex-start !important;
    flex-direction:column !important;
    gap:10px !important;
    margin-bottom:20px !important;
  }

  .tfpx-kicker,
  .tfpx-online{
    font-size:8px !important;
  }

  .tfpx-online{
    padding:7px 9px !important;
  }

  .tfpx-logo{
    width:155px !important;
    margin-bottom:20px !important;
  }

  .tfpx-copy h2{
    max-width:100% !important;
    font-size:clamp(39px,11.5vw,51px) !important;
    line-height:.94 !important;
    overflow-wrap:normal !important;
  }

  .tfpx-description{
    margin-top:19px !important;
    font-size:13px !important;
    line-height:1.67 !important;
  }

  .tfpx-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:9px !important;
    margin-top:23px !important;
  }

  .tfpx-primary,
  .tfpx-secondary{
    width:100% !important;
    min-height:49px !important;
  }

  .tfpx-offer{
    width:100% !important;
    min-height:72px !important;
    grid-template-columns:auto minmax(0,1fr) auto !important;
    gap:11px !important;
    padding:10px !important;
    border-radius:14px !important;
  }

  .tfpx-offer-price{
    min-width:53px !important;
    height:47px !important;
    font-size:14px !important;
  }

  .tfpx-offer-copy strong{
    font-size:11px !important;
    line-height:1.25 !important;
  }

  .tfpx-offer-copy small{
    display:none !important;
  }

  .tfpx-visual{
    width:100% !important;
    max-width:100% !important;
    padding-bottom:24px !important;
  }

  .tfpx-browser{
    width:100% !important;
    max-width:100% !important;
    border-radius:15px !important;
    transform:none !important;
  }

  .tfpx-browser:hover{
    transform:none !important;
  }

  .tfpx-browser-bar{
    height:33px !important;
    grid-template-columns:auto 1fr !important;
    padding:0 9px !important;
  }

  .tfpx-browser-open{
    display:none !important;
  }

  .tfpx-browser-address{
    font-size:8px !important;
    text-align:right !important;
  }

  .tfpx-otkf-live{
    width:calc(100% - 18px) !important;
    min-height:68px !important;
    gap:10px !important;
    margin:-15px auto 0 !important;
    padding:10px 12px !important;
    border-radius:14px !important;
  }

  .tfpx-otkf-live small{
    font-size:7px !important;
  }

  .tfpx-otkf-live strong{
    font-size:14px !important;
  }

  .tfpx-otkf-live em{
    font-size:8px !important;
  }

  .tfpx-modules{
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    margin-top:13px !important;
  }

  .tfpx-module{
    min-height:86px !important;
    grid-template-columns:1fr auto !important;
    grid-template-rows:auto auto !important;
    gap:5px 7px !important;
    padding:11px !important;
    border-radius:13px !important;
  }

  .tfpx-module-icon{
    grid-column:1 !important;
    width:31px !important;
    height:31px !important;
    border-radius:9px !important;
    font-size:14px !important;
  }

  .tfpx-live-icon{
    font-size:7px !important;
  }

  .tfpx-module > span:nth-child(2){
    grid-column:1 / -1 !important;
    grid-row:2 !important;
  }

  .tfpx-module strong{
    font-size:10px !important;
  }

  .tfpx-module small{
    font-size:7px !important;
  }

  .tfpx-module b{
    grid-column:2 !important;
    grid-row:1 !important;
    align-self:center !important;
  }

  .tfpx-stats{
    grid-template-columns:repeat(4,1fr) !important;
    margin:0 -19px !important;
  }

  .tfpx-stats > div{
    min-width:0 !important;
    min-height:69px !important;
    align-items:center !important;
    padding:10px 3px !important;
    text-align:center !important;
  }

  .tfpx-stats > div > strong{
    font-size:19px !important;
  }

  .tfpx-stats > div > span{
    margin-top:5px !important;
    font-size:6px !important;
  }

  .tfpx-stats-copy{
    grid-column:1 / -1 !important;
    min-height:62px !important;
    align-items:flex-start !important;
    padding:12px 19px !important;
    text-align:left !important;
  }

  .tfpx-stats-copy small{
    font-size:7px !important;
  }

  .tfpx-stats-copy strong{
    font-size:11px !important;
  }
}

@media(max-width:390px){
  .tfpx-card{
    padding-inline:16px !important;
  }

  .tfpx-copy h2{
    font-size:38px !important;
  }

  .tfpx-modules{
    grid-template-columns:1fr !important;
  }

  .tfpx-module{
    min-height:69px !important;
    grid-template-columns:auto 1fr auto !important;
    grid-template-rows:1fr !important;
  }

  .tfpx-module-icon{
    grid-column:1 !important;
    grid-row:1 !important;
  }

  .tfpx-module > span:nth-child(2){
    grid-column:2 !important;
    grid-row:1 !important;
  }

  .tfpx-module b{
    grid-column:3 !important;
    grid-row:1 !important;
  }

  .tfpx-stats{
    margin-inline:-16px !important;
  }
}


/* =========================================================
   TFP BEZ PLANSZY — MOBILE
   ========================================================= */

@media(max-width:760px){

  .tfpx-visual{
    display:flex !important;
    flex-direction:column !important;
    gap:13px !important;
    width:100% !important;
    padding:3px 0 24px !important;
  }

  .tfpx-visual-intro{
    padding:0 !important;
  }

  .tfpx-visual-intro > span{
    font-size:7px !important;
  }

  .tfpx-visual-intro h3{
    margin:9px 0 7px !important;
    font-size:25px !important;
    line-height:1.08 !important;
  }

  .tfpx-visual-intro p{
    font-size:11px !important;
  }

  .tfpx-otkf-live{
    width:100% !important;
    min-height:105px !important;
    margin:0 !important;
    padding:17px 15px !important;
    border-radius:16px !important;
  }

  .tfpx-otkf-live::after{
    right:8px !important;
    bottom:-7px !important;
    font-size:58px !important;
  }

  .tfpx-otkf-live .tfpx-live-dot{
    width:10px !important;
    height:10px !important;
    flex-basis:10px !important;
  }

  .tfpx-otkf-live small{
    font-size:7px !important;
  }

  .tfpx-otkf-live strong{
    font-size:19px !important;
  }

  .tfpx-otkf-live em{
    font-size:8px !important;
  }

  .tfpx-otkf-live b{
    width:38px !important;
    height:38px !important;
    border-radius:11px !important;
    font-size:19px !important;
  }

  .tfpx-modules{
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    margin-top:0 !important;
  }

  .tfpx-module{
    min-height:91px !important;
    padding:11px !important;
    border-radius:14px !important;
  }
}

@media(max-width:390px){
  .tfpx-modules{
    grid-template-columns:1fr !important;
  }

  .tfpx-module{
    min-height:68px !important;
  }
}