/* FIX: strona ma html{font-size:62.5%} (rem=10px) — przywracamy 16px na home */
html { font-size: 100% !important; }

/* ============================================================
   home.css — distinctive redesign strony głównej gdzie-paczka.pl
   Kierunek: industrial / shipping-terminal. Żółć InPost + grafit
   + ciepły papier + akcent koralowy. Scope: .gp-home, .home-hero
   ============================================================ */

:root {
    --h-ink:    #16150F;   /* grafit / prawie czerń */
    --h-ink-2:  #2a281f;
    --h-paper:  #F4F5F7;   /* ciepły papier */
    --h-paper-2:#E7EAEF;
    --h-yellow: #FFD400;   /* żółć paczkomatu */
    --h-yellow-d:#E8BE00;
    --h-coral:  #FF4D2E;   /* akcent energii */
    --h-muted:  #76715F;
    --h-line:   rgba(22,21,15,.12);
    --h-mono:   "Space Mono", ui-monospace, "SFMono-Regular", monospace;
    --h-disp:   "Bricolage Grotesque", "Hanken Grotesk", sans-serif;
    --h-body:   "Hanken Grotesk", -apple-system, sans-serif;
}

/* ---------- baza ---------- */
body { background: var(--h-paper); }
.gp-home, .home-hero { font-family: var(--h-body); color: var(--h-ink); }
.gp-home { max-width: 1180px; }
.gp-home h1,.gp-home h2,.gp-home h3,.home-hero h1 {
    font-family: var(--h-disp);
    font-weight: 800;
    letter-spacing: -.025em;
    line-height: 1.02;
}

/* eyebrow / etykieta sekcji (jak na liście przewozowej) */
.gp-eyebrow {
    font-family: var(--h-mono);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--h-muted);
    display: inline-flex; align-items: center; gap: .6rem;
    margin: 0 0 1rem;
}
.gp-eyebrow::before {
    content: ""; width: 26px; height: 2px; background: var(--h-coral);
}
.gp-section { padding: 64px 0 8px; }
.gp-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 28px; flex-wrap: wrap; }
.gp-section-head h2 { font-size: clamp(1.7rem, 3.4vw, 2.5rem); margin: 0; }
.gp-section-head .gp-more {
    font-family: var(--h-mono); font-size: .8rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: .08em; text-decoration: none; color: var(--h-ink);
    border-bottom: 2px solid var(--h-yellow); padding-bottom: 2px; white-space: nowrap;
}
.gp-section-head .gp-more:hover { border-color: var(--h-coral); }

/* ============================================================
   HERO — terminal paczkomatu
   ============================================================ */
.home-hero {
    background: var(--h-ink);
    color: var(--h-paper);
    border-radius: 0 0 32px 32px;
    position: relative;
    overflow: hidden;
    padding: 56px 0 64px;
    margin-bottom: 8px;
}
/* grid "drzwiczek" + grain */
.home-hero::before {
    content:""; position:absolute; inset:0;
    background-image:
       linear-gradient(rgba(255,212,0,.05) 1px, transparent 1px),
       linear-gradient(90deg, rgba(255,212,0,.05) 1px, transparent 1px);
    background-size: 46px 46px;
    mask-image: radial-gradient(120% 100% at 80% 0%, #000 30%, transparent 75%);
}
.home-hero::after {
    content:""; position:absolute; inset:0; opacity:.5; pointer-events:none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.4'/%3E%3C/svg%3E");
    mix-blend-mode: overlay;
}
.home-hero .container { position: relative; z-index: 2; }
.home-hero-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 40px; align-items: center; }

.home-hero-badge {
    font-family: var(--h-mono); font-size: .72rem; font-weight: 700; letter-spacing: .2em;
    text-transform: uppercase; color: var(--h-yellow);
    display: inline-flex; align-items:center; gap:.6rem; margin-bottom: 1.4rem;
}
.home-hero-badge::before{ content:""; width:8px;height:8px;border-radius:50%; background:var(--h-yellow); box-shadow:0 0 0 4px rgba(255,212,0,.18); }

.home-hero-title {
    font-size: clamp(2.5rem, 6vw, 4.4rem);
    color: var(--h-paper);
    margin: 0 0 1.1rem;
}
.home-hero-title em {
    font-style: normal; color: var(--h-ink);
    background: var(--h-yellow);
    padding: 0 .14em; border-radius: 6px;
    box-decoration-break: clone; -webkit-box-decoration-break: clone;
}
.home-hero-sub { font-size: 1.12rem; color: rgba(242,238,228,.74); max-width: 30em; margin: 0 0 2rem; }

/* search terminal */
.home-hero .home-search {
    background: var(--h-paper);
    border-radius: 18px;
    padding: 14px;
    box-shadow: 0 30px 60px -20px rgba(0,0,0,.6);
    display: grid; grid-template-columns: 1fr auto; gap: 10px;
}
.home-hero #search-input {
    height: 58px; border: none; border-radius: 12px;
    background: #fff; color: var(--h-ink);
    padding: 0 1rem 0 3rem; font-size: 1.04rem; font-family: var(--h-body);
    box-shadow: inset 0 0 0 1px var(--h-line);
}
.home-hero #search-input::placeholder { color: #9a9588; }
.home-hero .home-search-field { position: relative; }
.home-hero .home-search-field > .bi {
    position: absolute; left: 1rem; top: 50%; transform: translateY(-50%);
    color: var(--h-coral); font-size: 1.2rem; z-index: 2;
}
.home-hero #find-nearest {
    height: 58px; border: none; border-radius: 12px; padding: 0 1.4rem;
    font-family: var(--h-disp); font-weight: 800; font-size: 1rem; letter-spacing: -.01em;
    background: var(--h-yellow); color: var(--h-ink);
    display: inline-flex; align-items: center; gap: .5rem;
    transition: transform .12s, background .12s;
}
.home-hero #find-nearest:hover { background: #ffdf3a; transform: translateY(-2px); }

/* autocomplete (Algolia) w hero — kompaktowy, brandowany dropdown */
.home-hero .algolia-autocomplete { width: 100%; display: block !important; }
.home-hero .algolia-autocomplete .aa-input { width: 100%; }
.home-hero .algolia-autocomplete .aa-dropdown-menu {
    width: 100%;
    background: #fff;
    border: 1px solid var(--h-line);
    border-radius: 14px;
    box-shadow: 0 24px 50px -16px rgba(0,0,0,.45);
    margin-top: 10px;
    padding: 6px;
    max-height: 340px;
    overflow-y: auto;
    z-index: 50;
}
.home-hero .algolia-autocomplete .aa-suggestion {
    padding: 14px 16px;
    border-radius: 10px;
    cursor: pointer;
    color: var(--h-ink);
    font-size: 1.08rem;
    line-height: 1.35;
    border: none;
    transition: background .12s;
}
.home-hero .algolia-autocomplete .aa-suggestion:hover,
.home-hero .algolia-autocomplete .aa-suggestion.aa-cursor { background: var(--h-paper-2); }
.home-hero .algolia-autocomplete .aa-suggestion strong {
    font-family: var(--h-mono); font-weight: 700; font-size: .98rem;
    color: var(--h-coral); margin-right: .5rem;
}
.home-hero .aa-empty { padding: 14px; color: var(--h-muted); font-size: .9rem; }

.home-hero-stats { display: flex; gap: 28px; margin-top: 1.8rem; flex-wrap: wrap; }
.home-hero-stats .num { font-family: var(--h-mono); font-size: 1.5rem; font-weight: 700; color: var(--h-yellow); line-height: 1; }
.home-hero-stats .lbl { font-size: .82rem; color: rgba(242,238,228,.6); text-transform: uppercase; letter-spacing: .08em; margin-top: .3rem; }

/* dekoracyjny panel "lockera" po prawej */
.home-hero-locker { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.home-hero-locker span {
    aspect-ratio: 3/4; border-radius: 10px;
    background: linear-gradient(180deg, #232118, #1b1a13);
    box-shadow: inset 0 0 0 1px rgba(255,212,0,.10);
    position: relative;
}
.home-hero-locker span::after {
    content:""; position:absolute; right:8px; top:50%; transform:translateY(-50%);
    width:5px; height:18px; border-radius:3px; background: rgba(255,212,0,.25);
}
.home-hero-locker span.on { background: var(--h-yellow); box-shadow: 0 14px 30px -8px rgba(255,212,0,.5); }
.home-hero-locker span.on::after { background: var(--h-ink); }
.home-hero-locker span.on::before {
    content:"\F3FE"; font-family:"bootstrap-icons"; position:absolute; inset:0;
    display:flex; align-items:center; justify-content:center; font-size:1.6rem; color:var(--h-ink);
}

/* ============================================================
   KARTY MIAST (popularne)
   ============================================================ */
.gp-city-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.gp-city-card {
    background: #fff; border: 1px solid var(--h-line); border-radius: 18px;
    padding: 22px 22px 14px; transition: transform .16s, box-shadow .16s, border-color .16s;
    display: flex; flex-direction: column;
}
.gp-city-card:hover { transform: translateY(-4px); box-shadow: 0 20px 40px -22px rgba(22,21,15,.4); border-color: transparent; }
.gp-city-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.gp-city-card h3 { font-size: 1.35rem; margin: 0; }
.gp-city-card .gp-count {
    font-family: var(--h-mono); font-size: .76rem; font-weight: 700;
    background: var(--h-ink); color: var(--h-yellow); padding: .25rem .6rem; border-radius: 999px;
}
.gp-city-card .gp-pkt { font-size: .92rem; padding: .35rem 0; border-top: 1px dashed var(--h-line); }
.gp-city-card .gp-pkt a { color: var(--h-ink); text-decoration: none; display: flex; gap: .5rem; }
.gp-city-card .gp-pkt a:hover { color: var(--h-coral); }
.gp-city-card .gp-pkt strong { font-family: var(--h-mono); font-size: .82rem; color: var(--h-coral); }
.gp-city-card .gp-city-all {
    margin-top: auto; padding-top: 12px;
    font-family: var(--h-mono); font-size: .78rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: .06em; text-decoration: none; color: var(--h-ink);
    display: inline-flex; align-items: center; gap: .4rem;
}
.gp-city-card .gp-city-all:hover { gap: .7rem; color: var(--h-coral); }

/* ============================================================
   ARTYKUŁY (editorial)
   ============================================================ */
.gp-home .gp-articles .card { border:1px solid var(--h-line); border-radius:18px; box-shadow:none; }
.gp-home .gp-articles .card:hover { box-shadow: 0 22px 44px -26px rgba(22,21,15,.45); transform: translateY(-4px); }
.gp-home .gp-articles .card-img-top { border-radius: 0; }
.gp-home .gp-articles .card-title a { color: var(--h-ink); font-family: var(--h-disp); font-weight: 700; }
.gp-home .gp-articles .card-title a:hover { color: var(--h-coral); }

/* ============================================================
   WOJEWÓDZTWA — panel kontrolny
   ============================================================ */
.gp-woj-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.gp-woj {
    display: block; text-decoration: none; color: var(--h-ink);
    background: #fff; border: 1px solid var(--h-line); border-radius: 14px;
    padding: 16px 16px 14px; transition: background .14s, color .14s, transform .14s;
    position: relative; overflow: hidden;
}
.gp-woj::before {
    content: attr(data-n); position: absolute; top: 10px; right: 12px;
    font-family: var(--h-mono); font-size: .7rem; color: var(--h-muted); opacity: .7;
}
.gp-woj b { font-family: var(--h-disp); font-weight: 700; font-size: 1.02rem; display: block; }
.gp-woj small { color: var(--h-muted); font-size: .8rem; }
.gp-woj:hover { background: var(--h-yellow); color: var(--h-ink); transform: translateY(-3px); }
.gp-woj:hover small { color: var(--h-ink-2); }
.gp-woj:hover::before { color: var(--h-ink-2); opacity: 1; }

/* ============================================================
   TOP MIASTA — chipy z licznikiem mono
   ============================================================ */
.gp-toplist { display: flex; flex-wrap: wrap; gap: 10px; }
.gp-chip {
    display: inline-flex; align-items: center; gap: .55rem; text-decoration: none;
    background: #fff; border: 1px solid var(--h-line); border-radius: 999px;
    padding: .5rem .65rem .5rem 1rem; color: var(--h-ink); font-weight: 600; font-size: .94rem;
    transition: border-color .14s, transform .14s;
}
.gp-chip:hover { transform: translateY(-2px); border-color: var(--h-coral); color: var(--h-ink); }
.gp-chip .c { font-family: var(--h-mono); font-size: .76rem; font-weight: 700; background: var(--h-yellow); color: var(--h-ink); padding: .12rem .5rem; border-radius: 999px; }

/* ============================================================
   O SERWISIE
   ============================================================ */
.gp-about {
    background: var(--h-ink); color: var(--h-paper); border-radius: 24px;
    padding: 40px; display: grid; grid-template-columns: auto 1fr; gap: 28px; align-items: center;
    margin-top: 8px;
}
.gp-about .mark { font-family: var(--h-disp); font-weight: 800; font-size: 3rem; color: var(--h-yellow); line-height: 1; }
.gp-about p { margin: 0; color: rgba(242,238,228,.78); font-size: 1.02rem; line-height: 1.7; }

/* ---------- responsywność ---------- */
@media (max-width: 900px) {
    .home-hero-grid { grid-template-columns: 1fr; }
    .home-hero-locker { display: none; }
    .gp-city-grid { grid-template-columns: 1fr; }
    .gp-woj-grid { grid-template-columns: repeat(2, 1fr); }
    .home-hero .home-search { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .gp-about { grid-template-columns: 1fr; padding: 28px; text-align: left; }
}

/* ============================================================
   READABILITY — większe, czytelne fonty (cała strona główna)
   ============================================================ */
.gp-home { font-size: 1.125rem; }                 /* 18px baza */
.gp-home p, .gp-home a, .gp-home li { font-size: 1.0625rem; }

.gp-eyebrow { font-size: .92rem; letter-spacing: .18em; }
.gp-section-head h2 { font-size: clamp(2rem, 3.6vw, 2.9rem); }
.gp-section-head .gp-more { font-size: .98rem; }

/* karty miast */
.gp-city-card h3 { font-size: 1.6rem; }
.gp-city-card .gp-count { font-size: .92rem; padding: .35rem .75rem; }
.gp-city-card .gp-pkt { font-size: 1.08rem; padding: .5rem 0; }
.gp-city-card .gp-pkt strong { font-size: .98rem; }
.gp-city-card .gp-city-all { font-size: .95rem; }

/* hero */
.home-hero-badge { font-size: .9rem; }
.home-hero-sub { font-size: 1.28rem; }
.home-hero #search-input { font-size: 1.18rem; height: 62px; }
.home-hero #find-nearest { font-size: 1.15rem; height: 62px; }
.home-hero-stats .num { font-size: 1.9rem; }
.home-hero-stats .lbl { font-size: .95rem; }

/* autocomplete */
.home-hero .algolia-autocomplete .aa-suggestion { font-size: 1.15rem; padding: 15px 18px; }
.home-hero .algolia-autocomplete .aa-suggestion strong { font-size: 1.02rem; }

/* województwa */
.gp-woj { padding: 20px 18px 18px; }
.gp-woj b { font-size: 1.2rem; }
.gp-woj small { font-size: .98rem; }
.gp-woj::before { font-size: .82rem; }

/* ranking chipy */
.gp-chip { font-size: 1.08rem; padding: .6rem .7rem .6rem 1.1rem; }
.gp-chip .c { font-size: .9rem; }

/* artykuły */
.gp-home .gp-articles .card-title { font-size: 1.2rem; }
.gp-home .gp-articles .card-text { font-size: 1rem !important; }

/* o serwisie */
.gp-about p { font-size: 1.2rem; }
.gp-about .mark { font-size: 3.6rem; }

/* ============================================================
   READABILITY v2 — DUŻO większe fonty + szerszy layout
   ============================================================ */
.gp-home { max-width: 1340px; font-size: 1.25rem; }
.gp-home p, .gp-home a, .gp-home li { font-size: 1.18rem; }

.gp-eyebrow { font-size: 1.02rem !important; }
.gp-section-head h2 { font-size: clamp(2.4rem, 4vw, 3.4rem) !important; }
.gp-section-head .gp-more { font-size: 1.08rem !important; }

.gp-city-card { padding: 28px 26px 18px; }
.gp-city-card h3 { font-size: 2rem !important; }
.gp-city-card .gp-count { font-size: 1.05rem !important; padding: .4rem .85rem !important; }
.gp-city-card .gp-pkt { font-size: 1.22rem !important; padding: .6rem 0 !important; }
.gp-city-card .gp-pkt strong { font-size: 1.1rem !important; }
.gp-city-card .gp-city-all { font-size: 1.05rem !important; }

.home-hero-title { font-size: clamp(2.8rem, 6vw, 5rem) !important; }
.home-hero-sub { font-size: 1.45rem !important; }
.home-hero #search-input { font-size: 1.3rem !important; height: 66px !important; }
.home-hero #find-nearest { font-size: 1.25rem !important; height: 66px !important; }
.home-hero-stats .num { font-size: 2.3rem !important; }
.home-hero-stats .lbl { font-size: 1.02rem !important; }
.home-hero-badge { font-size: 1rem !important; }

.home-hero .algolia-autocomplete .aa-suggestion { font-size: 1.25rem !important; padding: 17px 20px !important; }
.home-hero .algolia-autocomplete .aa-suggestion strong { font-size: 1.12rem !important; }

.gp-woj b { font-size: 1.35rem !important; }
.gp-woj small { font-size: 1.06rem !important; }
.gp-woj::before { font-size: .9rem !important; }

.gp-chip { font-size: 1.2rem !important; padding: .7rem .8rem .7rem 1.2rem !important; }
.gp-chip .c { font-size: 1rem !important; }

.gp-home .gp-articles .card-title { font-size: 1.4rem !important; }
.gp-home .gp-articles .card-text { font-size: 1.12rem !important; }

.gp-about p { font-size: 1.35rem !important; }
.gp-about .mark { font-size: 4.2rem !important; }
