
/* IT-BALON.CZ v358 – mobile section repair pack
   Slider v357 remains untouched; this stylesheet is loaded after page inline CSS. */

@media (max-width: 900px) {
  /* Unify mobile sections: no decorative empty stripes to the right of labels */
  body .section-kicker,
  body .badge,
  body .eyebrow,
  body .case-label {
    width: auto !important;
    max-width: max-content !important;
    min-width: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
    white-space: normal !important;
  }

  body .section-kicker::before,
  body .section-kicker::after,
  body .badge::before,
  body .badge::after,
  body .eyebrow::before,
  body .eyebrow::after,
  body .case-label::before,
  body .case-label::after {
    content: none !important;
    display: none !important;
  }

  body .page-hero,
  body .section,
  body .section-sm {
    overflow-x: clip !important;
  }

  body .page-hero-copy,
  body .page-hero .container,
  body .section-head,
  body .section-head.compact,
  body .portal-content,
  body .launch-copy,
  body .support-hero .page-hero-copy,
  body .references-hero-v290 .page-hero-copy,
  body .services-hero-v290 .page-hero-copy,
  body .contact-hero-v290 .page-hero-copy,
  body .about-hero-v290 .page-hero-copy {
    text-align: center !important;
  }

  body .page-hero-actions,
  body .launch-actions,
  body .portal-actions,
  body .creative-actions {
    justify-content: center !important;
  }

  /* Homepage – Klientský portál preview: remove vertical cramped stats */
  body .portal-section {
    padding-top: 42px !important;
    padding-bottom: 34px !important;
  }

  body .portal-grid {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }

  body .portal-preview {
    max-width: 390px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 18px !important;
    border-radius: 28px !important;
  }

  body .portal-preview .stats,
  body .portal-preview .stat,
  body .stats {
    gap: 10px !important;
  }

  body .portal-preview .stats {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
  }

  body .portal-preview .stat {
    min-height: 78px !important;
    padding: 12px 10px !important;
    border-radius: 18px !important;
  }

  body .portal-preview .ticket-table,
  body .ticket-table.compact-table {
    border-radius: 18px !important;
    overflow: hidden !important;
  }

  body .portal-content .section-copy {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Homepage – Dvě značky: remove empty air, make logo cards intentional */
  body .dual-brands-section {
    padding-top: 34px !important;
    padding-bottom: 38px !important;
    margin-top: 0 !important;
  }

  body .dual-brands-head {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    margin: 0 auto 18px !important;
    text-align: center !important;
  }

  body .dual-brands-head .section-copy {
    max-width: 36ch !important;
    margin: 0 auto !important;
  }

  body .dual-brand-grid {
    margin-top: 16px !important;
    gap: 16px !important;
  }

  body .dual-brand-card {
    padding: 22px 18px !important;
    border-radius: 26px !important;
    gap: 14px !important;
  }

  body .dual-brand-logo-wrap {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  body .dual-brand-copy p {
    max-width: 34ch !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Homepage – Services intro and launch block: reduce odd empty spaces */
  body .services-section {
    padding-top: 38px !important;
    padding-bottom: 38px !important;
  }

  body .home-services-head {
    gap: 12px !important;
    margin-bottom: 22px !important;
  }

  body .launch-section {
    padding-top: 40px !important;
    padding-bottom: 42px !important;
  }

  body .launch-grid {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }

  body .launch-checklist,
  body .launch-service-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    border-radius: 28px !important;
    padding: 18px !important;
  }

  body .launch-checklist article,
  body .launch-service-grid article {
    min-height: 0 !important;
    padding: 18px !important;
    text-align: center !important;
    align-items: center !important;
  }

  body .launch-checklist article span,
  body .launch-service-grid article span {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Services page – hero panel + support desk visual without huge outer blanks */
  body .services-hero-v290 .page-hero-grid,
  body .support-hero-grid,
  body .references-hero-v290 .page-hero-grid,
  body .contact-hero-v290 .page-hero-grid,
  body .about-hero-v290 .page-hero-grid {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }

  body .services-hero-v290 .service-hero-panel--compact {
    max-width: 380px !important;
    min-height: 0 !important;
    padding: 22px !important;
    margin: 0 auto !important;
    border-radius: 28px !important;
  }

  body .services-hero-v290 .service-hero-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  body .services-hero-v290 .service-hero-grid span {
    min-height: 78px !important;
    border-radius: 18px !important;
  }

  body .service-detail-section {
    padding-top: 42px !important;
    padding-bottom: 42px !important;
  }

  body .service-detail-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  body .service-detail-copy {
    text-align: center !important;
  }

  body .service-side,
  body .service-side--support {
    padding: 0 !important;
    margin: 0 auto !important;
    width: 100% !important;
  }

  body .service-visual,
  body .service-visual--support {
    min-height: 250px !important;
    max-width: 300px !important;
    margin: 0 auto 16px !important;
    padding: 28px 22px !important;
    border-radius: 30px !important;
  }

  body .service-side-points {
    gap: 14px !important;
  }

  body .service-side-points article {
    min-height: 0 !important;
    padding: 18px !important;
    text-align: center !important;
  }

  /* Support page – mobile dashboard/demo cards */
  body .support-panel--pro {
    min-height: 0 !important;
    padding: 18px !important;
    border-radius: 28px !important;
  }

  body .support-status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body .support-dashboard-head,
  body .support-ticket-flow,
  body .support-ticket-list > div,
  body .support-status-grid > div {
    border-radius: 18px !important;
  }

  body .support-highlight-grid,
  body .support-model-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  body .support-card,
  body .support-model-card,
  body .support-process-copy,
  body .support-process-panel,
  body .support-remote-copy,
  body .support-network-card {
    padding: 20px !important;
    text-align: center !important;
  }

  /* Reference page – case studies and featured card tags */
  body .reference-hero-panel {
    min-height: 0 !important;
    padding: 22px !important;
    border-radius: 28px !important;
    text-align: center !important;
  }

  body .reference-tabs--pro,
  body .reference-category-jump {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  body .case-grid-v21 {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  body .case-card,
  body .case-featured-v21.featured {
    padding: 22px 18px !important;
    border-radius: 28px !important;
    text-align: center !important;
  }

  body .case-featured-v21.featured h3,
  body .case-card h3 {
    font-size: clamp(1.55rem, 7vw, 2rem) !important;
    line-height: 1.08 !important;
  }

  body .case-preview-window {
    padding: 16px !important;
    border-radius: 22px !important;
    margin: 18px 0 !important;
  }

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

  body .window-stats b {
    display: flex !important;
    width: 100% !important;
    min-height: 42px !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 14px !important;
  }

  body .case-featured-v21 .case-tags,
  body .case-tags {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-top: 18px !important;
  }

  body .case-featured-v21 .case-tags span,
  body .case-tags span {
    width: 100% !important;
    min-height: 42px !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 10px 8px !important;
    border-radius: 16px !important;
  }

  body .reference-results,
  body .reference-logo-wall,
  body .reference-quote-section {
    padding-top: 38px !important;
    padding-bottom: 38px !important;
  }

  body .result-card,
  body .reference-category-card,
  body .reference-client-card,
  body .reference-quote-card,
  body .reference-creative-card {
    text-align: center !important;
  }

  /* About page – numbered process cards no longer leave empty right side */
  body .about-think-grid,
  body .about-number-grid,
  body .about-value-grid,
  body .about-stack-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  body .about-think-card {
    display: grid !important;
    grid-template-columns: 58px 1fr !important;
    column-gap: 16px !important;
    row-gap: 6px !important;
    align-items: center !important;
    min-height: 0 !important;
    padding: 20px !important;
    text-align: left !important;
  }

  body .about-think-card::before,
  body .about-think-card::after {
    content: none !important;
    display: none !important;
  }

  body .about-think-card span {
    grid-row: 1 / span 2 !important;
    grid-column: 1 !important;
    margin: 0 !important;
    width: 56px !important;
    height: 56px !important;
  }

  body .about-think-card strong,
  body .about-think-card small {
    grid-column: 2 !important;
    max-width: none !important;
  }

  body .about-stack {
    padding-top: 42px !important;
    padding-bottom: 42px !important;
  }

  body .about-stack-card {
    text-align: center !important;
  }

  body .about-stack-card .section-title {
    max-width: none !important;
    font-size: clamp(1.6rem, 7vw, 2.15rem) !important;
    line-height: 1.12 !important;
    text-wrap: balance !important;
  }

  body .about-stack-tags {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    padding: 16px !important;
  }

  body .about-stack-tags span {
    justify-content: center !important;
    text-align: center !important;
    min-height: 72px !important;
  }

  /* Contact page – map should not become a huge blank white rectangle on mobile */
  body .contact-page-grid,
  body .contact-business-grid,
  body .contact-method-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  body .contact-page-form-card--pro,
  body .contact-page-map-card,
  body .contact-page-map,
  body .contact-page-cards article,
  body .contact-method-grid article {
    border-radius: 24px !important;
    text-align: center !important;
  }

  body .contact-page-map-card {
    padding: 16px !important;
  }

  body .contact-page-map iframe,
  body .contact-map-preview iframe {
    min-height: 260px !important;
    height: 260px !important;
    display: block !important;
  }

  body .contact-map-preview {
    min-height: 260px !important;
  }
}

@media (max-width: 430px) {
  body .portal-preview {
    max-width: calc(100vw - 28px) !important;
  }

  body .case-featured-v21 .case-tags,
  body .case-tags,
  body .about-stack-tags {
    grid-template-columns: 1fr !important;
  }

  body .service-visual,
  body .service-visual--support {
    max-width: 282px !important;
  }

  body .contact-page-map iframe,
  body .contact-map-preview iframe {
    min-height: 230px !important;
    height: 230px !important;
  }
}


/* ===== IT-BALON.CZ v359: mobile section cleanup after screenshot pass ===== */
@media (max-width: 900px) {
  body .section-kicker,
  body .section-eyebrow,
  body .badge,
  body .eyebrow,
  body .case-label,
  body .service-label,
  body .support-label,
  body [class*="kicker"],
  body [class*="badge"] {
    width: auto !important;
    max-width: max-content !important;
    min-width: 0 !important;
    display: inline-flex !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 8px 14px !important;
    border-radius: 999px !important;
    white-space: normal !important;
    text-align: center !important;
  }

  body .section-kicker::before,
  body .section-kicker::after,
  body .section-eyebrow::before,
  body .section-eyebrow::after,
  body .badge::before,
  body .badge::after,
  body .eyebrow::before,
  body .eyebrow::after,
  body .case-label::before,
  body .case-label::after,
  body .service-label::before,
  body .service-label::after,
  body .support-label::before,
  body .support-label::after,
  body [class*="kicker"]::before,
  body [class*="kicker"]::after,
  body [class*="badge"]::before,
  body [class*="badge"]::after {
    content: none !important;
    display: none !important;
  }

  body .services-section {
    padding-top: 18px !important;
    padding-bottom: 30px !important;
    margin-top: 0 !important;
  }

  body .home-services-head {
    margin-top: 0 !important;
    margin-bottom: 18px !important;
    gap: 10px !important;
  }

  body .portal-section {
    padding-top: 30px !important;
    padding-bottom: 18px !important;
    margin-bottom: 0 !important;
  }

  body .portal-section::before,
  body .portal-section::after,
  body .dual-brands-section::before,
  body .dual-brands-section::after,
  body .services-section::before,
  body .services-section::after {
    content: none !important;
    display: none !important;
  }

  body .portal-grid,
  body .portal-content {
    gap: 18px !important;
  }

  body .portal-actions {
    margin-bottom: 0 !important;
  }

  body .dual-brands-section {
    padding-top: 20px !important;
    padding-bottom: 28px !important;
    margin-top: 0 !important;
  }

  body .dual-brands-head {
    margin-bottom: 14px !important;
  }

  body .portal-preview .stats,
  body .stats {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    width: 100% !important;
    align-items: stretch !important;
  }

  body .portal-preview .stat,
  body .stats .stat {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 86px !important;
    padding: 14px 10px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    border-radius: 18px !important;
  }

  body .dual-brand-card {
    grid-template-columns: 1fr !important;
    text-align: center !important;
    padding: 24px 20px !important;
  }

  body .dual-brand-logo-wrap {
    width: 142px !important;
    height: 142px !important;
    margin: 0 auto 8px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 999px !important;
    overflow: visible !important;
  }

  body .dual-brand-logo-wrap img {
    width: 142px !important;
    height: 142px !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 auto !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  body .dual-brand-copy h3 {
    margin-top: 4px !important;
  }

  body .service-detail-section,
  body .support-highlights,
  body .support-how,
  body .support-model-section,
  body .references-page-section,
  body .reference-results,
  body .reference-logo-wall,
  body .reference-quote-section,
  body .about-stack,
  body .about-process,
  body .contact-page-section,
  body .contact-map-section {
    padding-top: 34px !important;
    padding-bottom: 34px !important;
    min-height: 0 !important;
  }

  body .service-side,
  body .service-side--support,
  body .service-visual,
  body .service-visual--support,
  body .support-process-panel,
  body .support-dashboard-panel,
  body .support-ticket-panel,
  body .reference-hero-panel,
  body .case-preview-window,
  body .about-stack-card {
    max-width: calc(100vw - 28px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  body .service-visual,
  body .service-visual--support {
    min-height: 0 !important;
    padding: 28px 20px !important;
    border-radius: 28px !important;
  }

  body .service-visual h3,
  body .service-visual--support h3,
  body .service-visual .section-title,
  body .service-visual--support .section-title {
    max-width: 100% !important;
    font-size: clamp(1.45rem, 6.2vw, 2rem) !important;
    line-height: 1.12 !important;
    text-align: center !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
  }

  body .service-side-points,
  body .support-highlight-grid,
  body .support-model-grid {
    gap: 14px !important;
  }

  body .support-pill--progress,
  body .pill.blue,
  body .ticket-status--progress,
  body .status-progress,
  body .is-progress .pill {
    background: linear-gradient(90deg, #22d3ee 0%, #38bdf8 100%) !important;
    color: #063347 !important;
    border: 0 !important;
  }

  body .support-ticket-list > div {
    padding: 16px !important;
    gap: 10px !important;
  }

  body .case-featured-v21.featured,
  body .case-card {
    overflow: hidden !important;
  }

  body .case-preview-window {
    padding: 16px !important;
    border-radius: 22px !important;
  }

  body .case-preview-window .window-stats,
  body .window-stats {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    width: 100% !important;
  }

  body .case-preview-window .window-stats b,
  body .window-stats b {
    width: 100% !important;
    min-height: 42px !important;
    border-radius: 999px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 8px 12px !important;
  }

  body .case-tags,
  body .case-featured-v21 .case-tags,
  body .about-stack-tags {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    width: 100% !important;
  }

  body .case-tags span,
  body .case-featured-v21 .case-tags span,
  body .about-stack-tags span {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 10px 8px !important;
    line-height: 1.18 !important;
  }

  body .reference-logo-wall:empty,
  body .reference-logo-wall .container:empty,
  body .logos-row:empty,
  body .logo-wall-v21:empty {
    display: none !important;
  }

  body .reference-logo-wall {
    min-height: 0 !important;
  }

  body .about-stack-card {
    padding: 26px 20px !important;
    border-radius: 28px !important;
    text-align: center !important;
  }

  body .about-stack-card .section-title,
  body .about-stack-card h2,
  body .about-stack-card h3 {
    max-width: 100% !important;
    text-align: center !important;
    font-size: clamp(1.55rem, 7vw, 2.1rem) !important;
    line-height: 1.12 !important;
  }

  body .about-think-card {
    grid-template-columns: 64px 1fr !important;
    text-align: left !important;
  }

  body .about-think-card span {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
  }

  body .contact-page-map-card,
  body .contact-page-map,
  body .contact-map-preview,
  body .map-card,
  body [class*="map"] {
    min-height: 0 !important;
  }

  body .contact-page-map-card::before,
  body .contact-page-map-card::after,
  body .contact-page-map::before,
  body .contact-page-map::after,
  body .contact-map-preview::before,
  body .contact-map-preview::after {
    content: none !important;
    display: none !important;
  }

  body .contact-page-map iframe,
  body .contact-map-preview iframe,
  body iframe[src*="maps"],
  body iframe[src*="google"] {
    width: 100% !important;
    min-height: 230px !important;
    height: 230px !important;
    border-radius: 22px !important;
  }
}

@media (max-width: 430px) {
  body .dual-brand-logo-wrap,
  body .dual-brand-logo-wrap img {
    width: 132px !important;
    height: 132px !important;
  }

  body .portal-section,
  body .dual-brands-section,
  body .service-detail-section,
  body .support-highlights,
  body .references-page-section,
  body .reference-results,
  body .reference-logo-wall,
  body .about-stack,
  body .contact-map-section {
    padding-top: 28px !important;
    padding-bottom: 28px !important;
  }

  body .case-tags,
  body .case-featured-v21 .case-tags,
  body .about-stack-tags {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
