/* Shared phone layout. Existing desktop design and all public content stay available. */
.hero__mobile-intro,
.hero__quote-mobile { display: none; }
.popup__details > summary { display: none; }
.popup__details { display: grid; gap: 16px; }
.popup__details .popup__field + .popup__field { margin-top: 16px; }
.nav-service-toggle { display: none; }

@media (max-width: 768px) {
    :root { --space-2xl: 40px; --space-3xl: 48px; }
    body { font-size: 16px; }
    .container { padding-left: 20px; padding-right: 20px; }
    .section { padding-top: 32px; padding-bottom: 32px; }
    .section__title { font-size: 24px; line-height: 1.25; margin-bottom: 16px; }
    .section__subtitle { font-size: 16px; line-height: 1.55; margin-bottom: 24px; }
    .btn { min-height: 48px; white-space: normal; text-transform: none; letter-spacing: 0; }
    input:not([type="hidden"]), select, textarea { font-size: 16px; }
    summary { min-height: 44px; cursor: pointer; }
    :where(a, button, input, select, textarea, summary):focus-visible {
        outline: 3px solid var(--color-primary); outline-offset: 3px;
    }
    .breadcrumbs { padding: 8px 0; }
    .breadcrumbs__list { font-size: 12px; }
    .nav-list > li > a { text-align: left; min-height: 48px; padding: 12px 0; font-size: 17px; }
    .nav-list .has-mobile-submenu { display: grid; grid-template-columns: minmax(0, 1fr) 80px; align-items: center; }
    .nav-service-toggle { display: block; min-height: 44px; border: 1px solid var(--color-border); border-radius: 8px; background: #fff; color: var(--color-primary); font: inherit; font-size: 13px; cursor: pointer; }
    .nav-list .has-mobile-submenu .sub-menu { grid-column: 1 / -1; }
    .nav-list .has-mobile-submenu:not(.is-expanded) .sub-menu { display: none; }

    /* Text has a solid surface; the existing photograph supports it below the action. */
    #main-content .hero {
        display: flex; flex-direction: column; align-items: stretch;
        min-height: 0; height: auto; padding: 0;
        background: var(--color-bg-warm); color: var(--color-primary);
    }
    #main-content .hero__overlay, #main-content .hero::after { display: none; }
    #main-content .hero__inner {
        order: 1; width: 100%; max-width: 100%;
        padding: 28px 20px 24px; text-align: left;
    }
    #main-content .hero__title {
        max-width: 100%; color: var(--color-primary); text-shadow: none;
        font-size: clamp(26px, 7.2vw, 34px); line-height: 1.14;
        letter-spacing: -0.025em; margin: 0 0 16px;
    }
    #main-content .hero__subtitle {
        max-width: 100%; color: var(--color-text-light); opacity: 1;
        font-size: 16px; line-height: 1.55; text-shadow: none; margin: 0;
    }
    #main-content .hero__subtitle--full { display: none; }
    .hero__mobile-intro { display: block; }
    .hero__details { margin-top: 4px; color: var(--color-text-light); }
    .hero__details summary { display: list-item; padding: 10px 0; color: var(--color-primary); font-size: 14px; font-weight: 600; }
    .hero__details p { font-size: 16px; line-height: 1.6; margin: 8px 0; }
    #main-content .hero__actions { gap: 10px; margin: 20px 0 0; }
    #main-content .hero__actions .btn { border-radius: 10px; padding: 14px 16px; font-size: 16px; box-shadow: none; }
    #main-content .hero__quote-mobile { display: flex; }
    #main-content .hero__call { display: none; } /* Header and bottom bar retain the tracked number. */
    #main-content .hero__secondary-link { color: var(--color-primary); }
    #main-content .hero__bg, #main-content .hero__photo {
        order: 2; position: relative; inset: auto; transform: none;
        width: 100%; max-width: 100%; height: 160px; min-height: 0;
        object-fit: cover; object-position: center 40%; opacity: 1;
    }
    #main-content .hero--team .hero__photo { height: 180px; object-position: center 36%; }
    #main-content:has(.contact-quick) .hero__photo { display: none; }
    .hero-trust-badges { margin-top: 16px; gap: 8px; justify-content: flex-start; }
    .hero-trust-badges__item { color: var(--color-primary); border-color: var(--color-border); background: #fff; font-size: 12px; }
    .hero-trust-badges__icon { color: var(--color-primary); }
    body:has(.hero--home) .trust-bar, .hero--home .engagement-free-badge { display: none; }
    .hero .engagement-free-badge { margin-top: 12px; box-shadow: none; font-size: 13px; }
    .trust-bar { padding: 16px 0; }
    .trust-bar__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .trust-bar__item { font-size: 12px; line-height: 1.4; align-items: flex-start; }

    /* Service browsing is a readable list, with pictures beside the text. */
    .service-cards, .cards-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    .card--usluga, .service-card {
        display: grid; grid-template-columns: 80px minmax(0, 1fr);
        aspect-ratio: auto; min-height: 104px; border-radius: 12px;
        background: #fff; border: 1px solid var(--color-border-light); box-shadow: none;
    }
    .card--usluga .card__image, .service-card__img { position: relative; inset: auto; height: 100%; min-height: 104px; aspect-ratio: auto; }
    .card--usluga .card__image img, .service-card__img img { width: 100%; height: 100%; object-fit: cover; }
    .card--usluga .card__body, .service-card .service-card__body { padding: 14px; background: none; justify-content: center; }
    .card--usluga .card__title, .service-card__title { color: var(--color-primary); font-size: 17px; line-height: 1.3; margin-bottom: 6px; }
    .card--usluga .card__excerpt, .service-card__desc { color: var(--color-text-light); font-size: 14px; line-height: 1.5; opacity: 1; margin-bottom: 0; }
    .card--usluga .card__link, .service-card__link { display: none; }
    .cards-grid .card:not(.card--usluga) .card__body { padding: 16px; }
    .section--cities-for-service .cards-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .city-service-card .card__excerpt, .city-service-card .card__link { display: none; }
    .city-service-card .card__title { font-size: 16px; line-height: 1.4; margin: 0; }
    .cities-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
    .city-card { min-height: 104px; aspect-ratio: auto; border-radius: 10px; }
    .city-card__title { font-size: 18px; }
    .city-card__overlay { padding: 14px; }
    .city-card__count, .city-card__link { display: none; }
    .zalety-grid { grid-template-columns: 1fr; gap: 16px; }
    .zaleta-item { padding: 16px; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 6px 12px; text-align: left; }
    .zaleta-item__icon { grid-column: 1; grid-row: 1 / 3; width: 40px; height: 40px; }
    .zaleta-item__title, .zaleta-item__desc { grid-column: 2; margin: 0; }
    .zaleta-item__desc { font-size: 14px; line-height: 1.5; }
    .zaleta-item__icon { margin-bottom: 8px; }
    .faq__question { font-size: 16px; min-height: 52px; }
    .blog-article__meta { gap: 8px 12px; font-size: 12px; margin-bottom: 16px; }
    .blog-article__title { font-size: 27px; line-height: 1.2; margin-bottom: 20px; }
    .blog-article__hero { margin-bottom: 24px; }
    .blog-article__hero img { width: 100%; height: 180px; object-fit: cover; object-position: center 35%; border-radius: 12px; }
    .wysiwyg { font-size: 16px; line-height: 1.65; overflow-wrap: anywhere; }
    .quiz-banner, .diagnostyka-banner { padding: 18px; border-radius: 12px; box-shadow: none; background: var(--color-bg); border: 1px solid var(--color-border-light); }
    .quiz-banner .btn, .diagnostyka-banner .btn { background: #fff; border: 1px solid var(--color-primary); color: var(--color-primary); box-shadow: none; }
    .article-content, .blog-article__content, .page-content { overflow-wrap: anywhere; }
    .article-content p, .blog-article__content p { font-size: 16px; line-height: 1.65; }
    .footer-compact__links { gap: 4px 16px; }
    .footer-compact__links a, .footer-compact__links button { display: inline-flex; align-items: center; min-height: 44px; }

    /* One calm contact bar, with no competing promotional layers or keyboard overlap. */
    .engagement-bottom-cta { padding: 8px 12px calc(8px + env(safe-area-inset-bottom)); box-shadow: none; }
    .engagement-bottom-cta__call, .engagement-bottom-cta__btn { min-height: 48px; border-radius: 8px; padding: 10px 8px; box-shadow: none; }
    .engagement-bottom-cta__call { flex: 1.2; font-size: 12px; }
    .engagement-bottom-cta__btn { flex: 1; background: var(--color-accent); }
    .engagement-bottom-cta__text { font-size: 13px; line-height: 1.3; }
    body:has(.popup-overlay.is-active, .calc-modal.is-active, #followup-modal.is-active, .site-header__nav--open, input:focus, textarea:focus, select:focus) .engagement-bottom-cta { display: none; }

    /* Name and phone are the complete required path; optional information is expandable. */
    .popup-overlay { padding: 12px; align-items: center; }
    .popup-overlay .popup { border-radius: 16px; padding: 24px 20px; max-height: calc(100dvh - 24px); overflow-y: auto; }
    .popup__badge { display: none; }
    .popup__title { font-size: 23px; line-height: 1.25; padding-right: 24px; margin-bottom: 10px; text-align: left; }
    .popup__subtitle { margin-bottom: 20px; font-size: 14px; line-height: 1.5; text-align: left; }
    .popup__form { gap: 14px; }
    .popup__input { min-height: 48px; font-size: 16px; padding: 12px; border-radius: 8px; }
    .popup__details { display: block; }
    .popup__details > summary { display: list-item; color: var(--color-primary); padding: 12px 0; font-size: 14px; font-weight: 600; }
    .popup__details[open] > summary { margin-bottom: 8px; }
    .popup__submit { min-height: 50px; border-radius: 10px; box-shadow: none; text-transform: none; }
    .popup__privacy { font-size: 12px; line-height: 1.5; }

    /* Keep the wizard choices prominent inside a single flat surface. */
    .calc-modal { padding: 8px; }
    .calc-modal .calc-modal__dialog { padding: 14px 12px; border-radius: 12px; }
    #calc-hub-modal .calc-modal__panel { background-image: none; background-color: #fff; padding: 0; margin: 0; }
    .calc-modal__panel .section { padding: 0; }
    .calc-modal__panel .container { padding: 0; }
    .calc-modal__panel .calc-inline { padding: 12px 0 0; background: none; box-shadow: none; border: 0; border-radius: 0; }
    .calc-modal__panel .ci-calc { padding: 0; box-shadow: none; border-radius: 0; max-width: none; }
    .calc-modal__panel .calc-inline__heading { font-size: 18px; margin-bottom: 6px; }
    .calc-modal__panel .calc-inline__subheading { font-size: 13px; line-height: 1.45; color: var(--color-text-light); }
    .calc-modal__panel .ci-question { font-size: 17px; line-height: 1.4; margin-bottom: 12px; }
    .calc-modal__panel .ci-option { min-height: 52px; }
    .calc-modal__tab, .calc-modal__sub-tab { font-size: 13px; min-height: 44px; padding: 8px 10px; }
    .calc-hub { padding: 28px 0; }
    .calc-hub__badge { display: none; }
    .calc-hub__title { font-size: 24px; }
    .calc-hub__subtitle { font-size: 15px; }

    /* No reveal animations or invisible sections while a phone user scrolls. */
    .animate-on-scroll { opacity: 1; transform: none; transition: none; }
    .calc-modal, .calc-modal__dialog, .calc-modal__panel, .calc-modal__sub-panel { animation: none; }
}
