/*
Theme Name: PRONET Serwis
Theme URI: https://pronet-serwis.pl/
Author: PRONET-SERWIS
Description: Modern local telecom WordPress theme for PRONET-SERWIS.
Version: 0.1.0
Requires at least: 6.0
Tested up to: 6.5
Text Domain: pronet-serwis
*/

:root {
    --pronet-navy: #061638;
    --pronet-blue: #0f4aa8;
    --pronet-cyan: #25b7ff;
    --pronet-orange: #ff6b1a;
    --pronet-soft: #f5f8ff;
    --pronet-border: #e1e8f5;
    --pronet-muted: #67748a;
    --pronet-green: #2abf7a;
    --container: 1320px;
}

* {
    box-sizing: border-box;
}

body {
    background: #fbfcff;
    color: var(--pronet-navy);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    margin: 0;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    height: auto;
    max-width: 100%;
}

.container {
    margin: 0 auto;
    max-width: var(--container);
    padding: 0 24px;
}

.site-header {
    background: rgba(255, 255, 255, 0.98);
    border-bottom: 1px solid rgba(225, 232, 245, 0.75);
    position: sticky;
    top: 0;
    z-index: 100;
}

.site-header__inner {
    align-items: center;
    display: flex;
    gap: 22px;
    min-height: 66px;
}

.brand {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    font-weight: 900;
    gap: 9px;
    letter-spacing: -0.03em;
}

.brand__mark {
    display: grid;
    height: 42px;
    place-items: center;
    position: relative;
    width: 42px;
}

.brand__mark span {
    border: 2px solid var(--pronet-blue);
    border-radius: 999px;
    height: 13px;
    position: absolute;
    transform-origin: center;
    width: 38px;
}

.brand__mark span:nth-child(2) {
    border-color: var(--pronet-orange);
    transform: rotate(45deg);
}

.brand__mark span:nth-child(3) {
    transform: rotate(90deg);
}

.brand__mark span:nth-child(4) {
    border-color: var(--pronet-orange);
    transform: rotate(135deg);
}

.brand__name {
    display: grid;
    line-height: 1;
}

.brand__name strong {
    color: var(--pronet-orange);
    font-size: 20px;
    letter-spacing: 0.02em;
}

.brand__name small {
    color: var(--pronet-navy);
    font-size: 14px;
    letter-spacing: 0.36em;
}

.custom-logo-link {
    align-items: center;
    display: inline-flex;
}

.custom-logo {
    display: block;
    height: 50px;
    object-fit: contain;
    width: auto;
}

.main-navigation {
    flex: 1;
}

.main-navigation ul {
    align-items: center;
    display: flex;
    gap: 17px;
    justify-content: center;
    list-style: none;
    margin: 0;
    padding: 0;
}

.main-navigation a {
    align-items: center;
    color: var(--pronet-muted);
    display: inline-flex;
    color: var(--pronet-navy);
    font-size: 12px;
    font-weight: 750;
    gap: 8px;
    padding: 24px 0 20px;
    position: relative;
}

.main-navigation li:first-child a::after {
    background: var(--pronet-blue);
    border-radius: 999px;
    bottom: 12px;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
}

.main-navigation li:nth-child(2) a::before { content: "⌁"; color: var(--pronet-blue); font-size: 17px; }
.main-navigation li:nth-child(3) a::before { content: "▭"; color: var(--pronet-blue); font-size: 17px; }
.main-navigation li:nth-child(4) a::before { content: "▯"; color: var(--pronet-blue); font-size: 17px; }
.main-navigation li:nth-child(5) a::before { content: "⌖"; color: var(--pronet-blue); font-size: 17px; }

.main-navigation a:hover {
    color: var(--pronet-blue);
}

.header-actions {
    align-items: center;
    display: flex;
    gap: 18px;
}

.phone-link {
    color: var(--pronet-navy);
    display: grid;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.1;
    padding-left: 24px;
    position: relative;
    white-space: nowrap;
}

.phone-link::before {
    content: "☎";
    color: var(--pronet-blue);
    font-size: 18px;
    left: 0;
    position: absolute;
    top: 4px;
}

.phone-link span {
    color: var(--pronet-muted);
}

.phone-link strong {
    color: var(--pronet-navy);
    font-size: 14px;
}

.button,
.wp-block-button__link {
    background: var(--pronet-orange);
    border-radius: 8px;
    color: #ffffff;
    display: inline-flex;
    font-size: 13px;
    font-weight: 850;
    justify-content: center;
    padding: 11px 20px;
}

.button::after {
    content: "›";
    font-size: 18px;
    line-height: 0.8;
    margin-left: 10px;
}

.button--header {
    border-radius: 10px;
}

.button--ghost {
    background: #ffffff;
    border: 1px solid var(--pronet-border);
    color: var(--pronet-blue);
}

.section {
    padding: 26px 0;
}

.section--soft {
    background: var(--pronet-soft);
}

.section-heading {
    margin: 0 auto 18px;
    max-width: 780px;
    text-align: center;
}

.eyebrow {
    color: var(--pronet-orange);
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0.13em;
    margin: 0 0 12px;
    text-transform: uppercase;
}

h1,
h2,
h3 {
    letter-spacing: -0.04em;
    line-height: 1.08;
}

h1 {
    font-size: clamp(40px, 4.6vw, 58px);
    margin: 0 0 13px;
}

h2 {
    font-size: clamp(25px, 2.8vw, 32px);
    margin: 0 0 8px;
}

h3 {
    font-size: 24px;
}

p {
    color: var(--pronet-muted);
    line-height: 1.7;
}

.hero {
    background:
        radial-gradient(circle at 72% 36%, rgba(37, 183, 255, 0.23), transparent 24%),
        linear-gradient(90deg, #ffffff 0%, #ffffff 42%, #f2f8ff 42%, #ffffff 100%);
    overflow: hidden;
    padding: 18px 0 0;
}

.hero__grid {
    align-items: center;
    display: grid;
    gap: 6px;
    grid-template-columns: 0.82fr 1.18fr;
    min-height: 280px;
}

.hero__content {
    padding: 46px 0 68px;
}

.hero__lead {
    color: #24324d;
    font-size: 16px;
    line-height: 1.45;
    max-width: 560px;
}

.hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 22px;
}

.hero__image {
    align-self: end;
    min-height: 300px;
    position: relative;
}

.hero-visual {
    background:
        radial-gradient(circle at 70% 20%, rgba(37, 183, 255, 0.22), transparent 26%),
        linear-gradient(135deg, #ffffff 0%, #eef8ff 100%);
    border-radius: 26px 26px 0 0;
    bottom: 0;
    box-shadow: inset 0 -1px 0 rgba(225, 232, 245, 0.8);
    height: 300px;
    left: 0;
    overflow: hidden;
    position: absolute;
    right: 0;
}

.hero-visual::before {
    background: #ffffff;
    border-radius: 999px;
    bottom: 0;
    content: "";
    height: 92px;
    left: 9%;
    position: absolute;
    right: 15%;
}

.hero-visual__screen {
    background: linear-gradient(145deg, #061638, #174980);
    border: 7px solid #ffffff;
    border-radius: 8px;
    box-shadow: 0 18px 45px rgba(7, 27, 58, 0.14);
    height: 88px;
    position: absolute;
    right: 9%;
    top: 28px;
    width: 150px;
}

.hero-visual__screen::after {
    background: linear-gradient(135deg, #8ed8ff 0%, #f7fbff 45%, #357ec8 46%, #9fd7ff 100%);
    border-radius: 4px;
    content: "";
    inset: 9px;
    position: absolute;
}

.hero-visual__sofa {
    background: #ead9c8;
    border-radius: 44px 44px 20px 20px;
    bottom: 48px;
    height: 78px;
    left: 14%;
    position: absolute;
    right: 23%;
}

.hero-visual__family {
    bottom: 104px;
    display: flex;
    gap: 18px;
    left: 22%;
    position: absolute;
}

.hero-visual__family span {
    background: #f3c4a5;
    border-radius: 999px 999px 18px 18px;
    height: 94px;
    position: relative;
    width: 62px;
}

.hero-visual__family span::before {
    background: #6f452d;
    border-radius: 999px;
    content: "";
    height: 46px;
    left: 8px;
    position: absolute;
    top: -22px;
    width: 46px;
}

.hero-visual__family span:nth-child(2) {
    background: #d6edf7;
    height: 112px;
    width: 70px;
}

.hero-visual__family span:nth-child(3) {
    background: #ffffff;
    height: 76px;
    margin-top: 26px;
    width: 52px;
}

.hero-visual__family span:nth-child(4) {
    background: #f6ede5;
    height: 86px;
    margin-top: 16px;
    width: 56px;
}

.hero-visual__laptop {
    background: #dbe8f7;
    border: 9px solid #ffffff;
    border-radius: 12px;
    bottom: 62px;
    box-shadow: 0 18px 36px rgba(7, 27, 58, 0.12);
    height: 84px;
    left: 42%;
    position: absolute;
    width: 172px;
}

.checker-wrap {
    margin-top: -34px;
    position: relative;
    z-index: 5;
}

.checker-wrap .pronet-checker {
    border-radius: 16px;
    box-shadow: 0 22px 70px rgba(7, 27, 58, 0.11) !important;
    margin: 0 auto 10px !important;
    max-width: 1140px;
    padding: 19px 22px !important;
}

.checker-wrap .pronet-checker__header {
    align-items: center;
    display: grid !important;
    gap: 10px;
    grid-template-columns: 56px minmax(240px, 1fr);
    margin: 0 !important;
}

.checker-wrap .pronet-checker__header::before {
    align-items: center;
    border: 2px solid #dce7f7;
    border-radius: 999px;
    color: var(--pronet-blue);
    content: "⌖";
    display: flex;
    font-size: 28px;
    height: 46px;
    justify-content: center;
    width: 46px;
}

.checker-wrap .pronet-checker__eyebrow,
.checker-wrap .pronet-checker__header p {
    display: none !important;
}

.checker-wrap .pronet-checker h2 {
    font-size: 17px !important;
    line-height: 1.25;
    margin: 0 !important;
}

.checker-wrap .pronet-checker__form {
    border: 0 !important;
    box-shadow: none !important;
    gap: 12px;
    grid-template-columns: 1.12fr 1.12fr 0.64fr auto;
    padding: 0 !important;
}

.checker-wrap .pronet-checker {
    align-items: center;
    display: grid !important;
    gap: 24px;
    grid-template-columns: 0.92fr 1.9fr;
}

.checker-wrap .pronet-checker label span {
    font-size: 11px !important;
    font-weight: 650;
}

.checker-wrap .pronet-checker input {
    border-radius: 4px !important;
    font-size: 13px !important;
    min-height: 36px !important;
    padding: 8px 10px !important;
}

.checker-wrap .pronet-checker button {
    border-radius: 7px !important;
    min-height: 38px !important;
    padding: 9px 26px !important;
}

.packages-grid,
.news-grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.trust-grid {
    align-items: center;
    display: grid;
    gap: 22px;
    grid-template-columns: 0.85fr repeat(4, 1fr);
}

.package-card,
.trust-card,
.news-card,
.project-card {
    background: #ffffff;
    border: 1px solid var(--pronet-border);
    border-radius: 12px;
    box-shadow: 0 10px 34px rgba(7, 27, 58, 0.05);
    padding: 26px;
}

.package-card {
    min-height: 246px;
    padding: 28px 24px 20px;
    position: relative;
    text-align: center;
}

.package-card--featured {
    border-color: rgba(255, 107, 26, 0.45);
}

.package-badge {
    background: var(--pronet-orange);
    border-radius: 0 0 7px 7px;
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
    left: 24px;
    padding: 5px 12px;
    position: absolute;
    top: 0;
}

.package-card__icon,
.trust-card__icon {
    align-items: center;
    background: transparent;
    border-radius: 0;
    color: var(--pronet-blue);
    display: flex;
    height: 50px;
    justify-content: center;
    margin: 0 auto 12px;
    width: 50px;
}

.package-card__icon svg,
.trust-card__icon svg {
    fill: none;
    height: 30px;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
    width: 30px;
}

.price {
    color: var(--pronet-orange);
    font-size: 16px;
    font-weight: 950;
    letter-spacing: -0.04em;
    margin: 6px 0 10px;
}

.price strong {
    font-size: 32px;
}

.price span {
    color: var(--pronet-orange);
    font-size: 13px;
    font-weight: 800;
}

.feature-list {
    color: var(--pronet-muted);
    display: grid;
    gap: 6px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.feature-list li {
    font-size: 13px;
}

.package-card h3 {
    font-size: 15px;
    margin: 0;
}

.feature-list li::before {
    color: var(--pronet-green);
    content: "✓";
    font-weight: 900;
    margin-right: 8px;
}

.card-link {
    align-items: center;
    border: 1px solid #b8c7dd;
    border-radius: 7px;
    color: var(--pronet-navy);
    display: inline-flex;
    font-size: 12px;
    font-weight: 800;
    justify-content: center;
    margin-top: 13px;
    min-width: 154px;
    padding: 8px 12px;
}

.card-link::after {
    content: "›";
    margin-left: 14px;
}

.coverage-strip {
    padding: 10px 0 8px;
}

.coverage-card {
    align-items: center;
    background: #f0f5ff;
    border: 1px solid #e0e9f8;
    border-radius: 12px;
    display: grid;
    gap: 22px;
    grid-template-columns: 0.33fr 0.67fr;
    min-height: 128px;
    overflow: hidden;
    padding: 20px 30px;
}

.coverage-card h2 {
    font-size: 22px;
}

.coverage-card p {
    font-size: 13px;
    line-height: 1.45;
    margin: 0 0 10px;
}

.coverage-card a {
    color: var(--pronet-blue);
    font-size: 13px;
    font-weight: 850;
}

.coverage-map {
    background: transparent;
    border: 0;
    border-radius: 0;
    min-height: 108px;
    overflow: hidden;
    padding: 0;
    position: relative;
}

.coverage-map__shape {
    background: rgba(20, 108, 255, 0.14);
    border: 2px solid rgba(20, 108, 255, 0.24);
    border-radius: 45% 55% 40% 60%;
    height: 96px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%) rotate(-8deg);
    width: 520px;
}

.pin {
    background: var(--pronet-orange);
    border: 4px solid #ffffff;
    border-radius: 999px;
    box-shadow: 0 8px 20px rgba(245, 130, 32, 0.3);
    height: 15px;
    position: absolute;
    width: 15px;
}

.pin small {
    color: var(--pronet-navy);
    font-size: 11px;
    font-weight: 750;
    left: 18px;
    position: absolute;
    top: -1px;
    white-space: nowrap;
}

.pin--one { left: 34%; top: 40%; }
.pin--two { left: 50%; top: 23%; }
.pin--three { left: 46%; top: 66%; }
.pin--four { left: 67%; top: 57%; }

.project-band {
    background: #ffffff;
    color: var(--pronet-navy);
    padding: 18px 0;
}

.project-band p {
    color: var(--pronet-muted);
}

.project-grid {
    align-items: center;
    display: grid;
    gap: 44px;
    background: #ffffff;
    border: 1px solid var(--pronet-border);
    border-radius: 12px;
    box-shadow: 0 10px 34px rgba(7, 27, 58, 0.05);
    grid-template-columns: 1.2fr 0.8fr;
    padding: 26px;
}

.project-logos {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    margin-bottom: 26px;
}

.project-logos img {
    background: #ffffff;
    border-radius: 18px;
    border: 1px solid var(--pronet-border);
    height: 58px;
    padding: 12px;
}

.stats {
    display: grid;
    gap: 18px;
    grid-template-columns: 1fr;
    margin-top: 0;
}

.stat {
    background: var(--pronet-soft);
    border: 1px solid var(--pronet-border);
    border-radius: 12px;
    padding: 14px 18px;
}

.stat strong {
    color: var(--pronet-navy);
    display: block;
    font-size: 20px;
}

.section--tight {
    padding-bottom: 18px;
    padding-top: 18px;
}

.why-title h2 {
    font-size: 24px;
    margin: 0;
}

.trust-card {
    align-items: center;
    background: transparent;
    border: 0;
    box-shadow: none;
    display: grid;
    gap: 12px;
    grid-template-columns: 46px 1fr;
    padding: 0;
}

.trust-card__icon {
    height: 42px;
    margin: 0;
    width: 42px;
}

.trust-card__icon svg {
    height: 26px;
    width: 26px;
}

.trust-card h3 {
    font-size: 14px;
    margin: 0 0 3px;
}

.trust-card p {
    font-size: 12px;
    line-height: 1.35;
    margin: 0;
}

.home-bottom {
    padding-top: 14px;
}

.bottom-grid {
    align-items: start;
    display: grid;
    gap: 22px;
    grid-template-columns: 1fr 1fr 1.06fr;
}

.panel {
    background: #ffffff;
    border: 1px solid var(--pronet-border);
    border-radius: 12px;
    box-shadow: 0 10px 34px rgba(7, 27, 58, 0.05);
    padding: 22px;
}

.panel__head {
    align-items: center;
    display: flex;
    gap: 14px;
    justify-content: space-between;
    margin-bottom: 16px;
}

.panel h2,
.panel__head h2 {
    font-size: 18px;
    margin: 0;
}

.panel__head a,
.read-more {
    color: var(--pronet-blue);
    font-size: 12px;
    font-weight: 850;
}

.news-list {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(3, 1fr);
}

.news-card {
    padding: 0;
}

.news-thumb,
.news-thumb-img {
    background: linear-gradient(135deg, #0f4aa8, #25b7ff);
    border-radius: 8px;
    display: block;
    height: 92px;
    margin-bottom: 10px;
    object-fit: cover;
    width: 100%;
}

.news-card div:not(.news-thumb) {
    padding: 0 2px 4px;
}

.news-card h3 {
    font-size: 13px;
    letter-spacing: -0.02em;
    line-height: 1.25;
    margin: 4px 0 8px;
}

.news-card time {
    color: var(--pronet-orange);
    font-size: 11px;
    font-weight: 850;
}

.faq-list {
    display: grid;
    gap: 10px;
}

.faq-list details {
    border-bottom: 1px solid var(--pronet-border);
    padding: 8px 0 10px;
}

.faq-list summary {
    color: var(--pronet-navy);
    cursor: pointer;
    font-size: 13px;
    font-weight: 800;
}

.faq-list p {
    font-size: 12px;
    margin: 8px 0 0;
}

.contact-panel p {
    font-size: 13px;
}

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

.contact-panel textarea {
    grid-column: 1 / -1;
    min-height: 74px;
}

.contact-panel input,
.contact-panel textarea {
    border: 1px solid var(--pronet-border);
    border-radius: 7px;
    font: inherit;
    font-size: 12px;
    padding: 10px;
}

.contact-panel button {
    background: #ffffff;
    border: 1px solid #9eb0c9;
    border-radius: 7px;
    color: var(--pronet-navy);
    cursor: pointer;
    font-weight: 850;
    grid-column: 1 / -1;
    padding: 10px;
}

.site-main {
    min-height: 60vh;
}

.content-page {
    padding: 48px 0 80px;
}

.content-page::before {
    background: linear-gradient(90deg, #ffffff, #f1f6ff);
    content: "";
    display: block;
    height: 140px;
    margin: -48px 0 44px;
}

.content-page article {
    background: #ffffff;
    border: 1px solid var(--pronet-border);
    border-radius: 16px;
    box-shadow: 0 12px 34px rgba(7, 27, 58, 0.05);
    margin: -144px auto 0;
    max-width: 960px;
    padding: 38px;
}

.site-footer {
    background: #06152d;
    color: #ffffff;
    padding: 30px 0;
}

.site-footer p,
.site-footer a {
    color: rgba(255, 255, 255, 0.76);
}

.footer-grid {
    display: grid;
    gap: 34px;
    grid-template-columns: 1.2fr repeat(3, 1fr);
}

@media (max-width: 980px) {
    .site-header__inner,
    .main-navigation ul,
    .header-actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .hero__grid,
    .coverage-card,
    .project-grid,
    .footer-grid,
    .bottom-grid {
        grid-template-columns: 1fr;
    }

    .packages-grid,
    .trust-grid,
    .news-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .checker-wrap .pronet-checker,
    .checker-wrap .pronet-checker__form {
        grid-template-columns: 1fr;
    }

    .news-list {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .section {
        padding: 64px 0;
    }

    .packages-grid,
    .trust-grid,
    .news-grid,
    .stats {
        grid-template-columns: 1fr;
    }
}

/* Production homepage tuning: closer to the approved PRONET mockup. */
.home .site-header,
.front-page .site-header {
    box-shadow: 0 1px 0 rgba(6, 22, 56, 0.06);
}

.home .site-header__inner,
.front-page .site-header__inner {
    min-height: 56px;
}

.home .container,
.front-page .container {
    max-width: 1280px;
}

.home .custom-logo,
.front-page .custom-logo {
    height: 42px;
}

.home .brand__mark,
.front-page .brand__mark {
    height: 34px;
    width: 34px;
}

.home .brand__mark span,
.front-page .brand__mark span {
    height: 11px;
    width: 31px;
}

.home .brand__name strong,
.front-page .brand__name strong {
    font-size: 16px;
}

.home .brand__name small,
.front-page .brand__name small {
    font-size: 11px;
}

.home .main-navigation a,
.front-page .main-navigation a {
    font-size: 11px;
    padding: 20px 0 17px;
}

.home .header-actions,
.front-page .header-actions {
    gap: 12px;
}

.home .phone-link,
.front-page .phone-link {
    font-size: 10px;
}

.home .phone-link strong,
.front-page .phone-link strong {
    font-size: 12px;
}

.home .button,
.front-page .button {
    border-radius: 7px;
    font-size: 11px;
    padding: 9px 16px;
}

.home .hero,
.front-page .hero {
    background:
        linear-gradient(90deg, #ffffff 0%, #ffffff 41.5%, rgba(237, 248, 255, 0.94) 41.5%, #ffffff 100%),
        radial-gradient(circle at 69% 34%, rgba(37, 183, 255, 0.18), transparent 28%);
    padding-top: 0;
}

.home .hero__grid,
.front-page .hero__grid {
    grid-template-columns: 0.78fr 1.22fr;
    min-height: 265px;
}

.home .hero__content,
.front-page .hero__content {
    padding: 43px 0 62px;
}

.home h1,
.front-page h1 {
    font-size: clamp(38px, 4.15vw, 54px);
    line-height: 1.03;
    margin-bottom: 12px;
    max-width: 540px;
}

.home .hero__lead,
.front-page .hero__lead {
    font-size: 13px;
    line-height: 1.55;
    max-width: 500px;
}

.home .hero__actions,
.front-page .hero__actions {
    gap: 10px;
    margin-top: 17px;
}

.home .hero__image,
.front-page .hero__image {
    min-height: 265px;
}

.home .hero-visual,
.front-page .hero-visual {
    background:
        radial-gradient(circle at 77% 28%, rgba(37, 183, 255, 0.18), transparent 24%),
        linear-gradient(135deg, #ffffff 0%, #edf8ff 100%);
    border-radius: 22px 22px 0 0;
    height: 265px;
}

.home .hero-visual__screen,
.front-page .hero-visual__screen {
    height: 74px;
    right: 7%;
    top: 26px;
    width: 132px;
}

.home .hero-visual__sofa,
.front-page .hero-visual__sofa {
    bottom: 40px;
    height: 70px;
    left: 17%;
    right: 22%;
}

.home .hero-visual__family,
.front-page .hero-visual__family {
    bottom: 93px;
    gap: 15px;
    left: 24%;
}

.home .hero-visual__family span,
.front-page .hero-visual__family span {
    height: 78px;
    width: 50px;
}

.home .hero-visual__family span::before,
.front-page .hero-visual__family span::before {
    height: 37px;
    top: -18px;
    width: 37px;
}

.home .hero-visual__family span:nth-child(2),
.front-page .hero-visual__family span:nth-child(2) {
    height: 92px;
    width: 56px;
}

.home .hero-visual__family span:nth-child(3),
.front-page .hero-visual__family span:nth-child(3) {
    height: 62px;
    width: 43px;
}

.home .hero-visual__family span:nth-child(4),
.front-page .hero-visual__family span:nth-child(4) {
    height: 70px;
    width: 46px;
}

.home .hero-visual__laptop,
.front-page .hero-visual__laptop {
    bottom: 52px;
    height: 67px;
    left: 43%;
    width: 144px;
}

.home .checker-wrap,
.front-page .checker-wrap {
    margin-top: -31px;
}

.home .checker-wrap .pronet-checker,
.front-page .checker-wrap .pronet-checker {
    border-radius: 12px;
    max-width: 1060px;
    padding: 16px 20px !important;
}

.home .checker-wrap .pronet-checker h2,
.front-page .checker-wrap .pronet-checker h2 {
    font-size: 14px !important;
}

.home .checker-wrap .pronet-checker__header,
.front-page .checker-wrap .pronet-checker__header {
    grid-template-columns: 45px minmax(210px, 1fr);
}

.home .checker-wrap .pronet-checker__header::before,
.front-page .checker-wrap .pronet-checker__header::before {
    font-size: 20px;
    height: 36px;
    width: 36px;
}

.home .checker-wrap .pronet-checker label span,
.front-page .checker-wrap .pronet-checker label span {
    font-size: 9px !important;
}

.home .checker-wrap .pronet-checker input,
.front-page .checker-wrap .pronet-checker input {
    min-height: 32px !important;
}

.home .checker-wrap .pronet-checker button,
.front-page .checker-wrap .pronet-checker button {
    min-height: 34px !important;
}

.home #pakiety,
.front-page #pakiety {
    padding-top: 25px;
}

.home .section-heading--compact,
.front-page .section-heading--compact {
    margin-bottom: 16px;
}

.home .section-heading--compact h2,
.front-page .section-heading--compact h2 {
    font-size: 25px;
}

.home .section-heading--compact p,
.front-page .section-heading--compact p {
    font-size: 12px;
    margin: 0;
}

.home .packages-grid,
.front-page .packages-grid {
    gap: 18px;
}

.home .package-card,
.front-page .package-card {
    min-height: 220px;
    padding: 25px 22px 18px;
}

.home .package-card__icon,
.front-page .package-card__icon {
    height: 42px;
    margin-bottom: 9px;
    width: 42px;
}

.home .package-card__icon svg,
.front-page .package-card__icon svg {
    height: 25px;
    width: 25px;
}

.home .package-card h3,
.front-page .package-card h3 {
    font-size: 13px;
}

.home .price strong,
.front-page .price strong {
    font-size: 28px;
}

.home .feature-list li,
.front-page .feature-list li {
    font-size: 11px;
}

.home .card-link,
.front-page .card-link {
    font-size: 11px;
    margin-top: 10px;
    min-width: 130px;
    padding: 7px 10px;
}

.home .coverage-strip,
.front-page .coverage-strip {
    padding-top: 6px;
}

.home .coverage-card,
.front-page .coverage-card {
    min-height: 112px;
    padding: 17px 26px;
}

.home .project-band,
.front-page .project-band,
.home .section--tight,
.front-page .section--tight,
.home .home-bottom,
.front-page .home-bottom {
    padding-top: 12px;
}