/* =============================================================================
   ANTRANS - HOME LAYER
   Restrained enhancement layer loaded AFTER main.css, scoped to body.home.
   Goal: a calm, editorial, agency-built feel - no aurora blobs, gradient text,
   floating chips or sheen sweeps. Subtle depth + the route map only.
   Brand: trust navy (#0D1F35 / #0D5195) + amber (#F2C94C).
   ============================================================================= */

body.home {
    --wow-amber:      #F2C94C;
    --wow-amber-soft: #F2C94C;
    --ease-fluid:     cubic-bezier(0.22, 1, 0.36, 1);

    /* Clean neutral surfaces (no beige); warmth lives in accents only */
    --warm-bg:       #FFFFFF;  /* pure white base            */
    --warm-alt:      #F5F6F8;  /* clean neutral light grey   */
    --warm-border:   #E6E9EE;  /* neutral hairline           */
    --shadow-sm:  0 2px 8px  rgba(120, 84, 38, 0.08);
    --shadow-md:  0 8px 24px rgba(120, 78, 30, 0.10);
    --shadow-lg:  0 16px 44px rgba(120, 72, 24, 0.14);
    --shadow-xl:  0 28px 70px rgba(110, 66, 22, 0.16);
}

/* =============================================================================
   0. WARM, LIGHTER SURFACES
   ============================================================================= */
body.home { background: var(--warm-bg); }

/* Alternating sections → warm ivory instead of cool grey-blue */
body.home .section--alt {
    background: var(--warm-alt);
}

/* Light-surface cards get a warm hairline */
body.home .offer-card,
body.home .news-card {
    border-color: var(--warm-border);
}

/* =============================================================================
   1. HERO - real fleet photo, single column text
   ============================================================================= */
body.home .hero {
    background: #0a1c30;
}

/* Photo hero: full-width text, no second column */
body.home .hero--photo .hero__inner { grid-template-columns: 1fr; }
body.home .hero--photo .hero__text { max-width: 660px; }

/* Strong gradient over the photo + a warm amber glow low-right */
body.home .hero--photo .hero__overlay {
    background:
        linear-gradient(100deg, rgba(8,20,34,0.92) 0%, rgba(8,20,34,0.60) 46%, rgba(8,20,34,0.28) 100%),
        radial-gradient(85% 75% at 92% 102%, rgba(242, 201, 76,0.24) 0%, transparent 58%),
        linear-gradient(0deg, rgba(8,20,34,0.62) 0%, transparent 45%);
}

/* Subtitle a touch brighter on the photo */
body.home .hero__subtitle { color: rgba(255,255,255,0.88); }

/* Scroll cue - mouse icon at bottom centre of the hero */
body.home .hero__scroll-cue {
    position: absolute;
    left: 50%;
    bottom: 1.6rem;
    transform: translateX(-50%);
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.45rem;
    color: rgba(255,255,255,0.65);
    font-size: 0.7rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    text-decoration: none;
    transition: color var(--transition-base);
}
body.home .hero__scroll-cue:hover { color: #fff; }
body.home .hero__scroll-cue .mouse {
    width: 22px;
    height: 36px;
    border: 2px solid rgba(255,255,255,0.45);
    border-radius: 12px;
    position: relative;
}
body.home .hero__scroll-cue .mouse::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 6px;
    width: 3px;
    height: 7px;
    margin-left: -1.5px;
    border-radius: 2px;
    background: var(--wow-amber-soft);
    animation: wowScroll 1.8s ease-in-out infinite;
}
@media (max-width: 768px) {
    body.home .hero__scroll-cue { display: none; }
}

/* =============================================================================
   1b. ROUTE MAP SECTION - two-column: map + directions list
   ============================================================================= */
body.home .map-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    gap: clamp(2rem, 5vw, 4.5rem);
    align-items: center;
}
body.home .map-layout__visual { min-width: 0; }
body.home .map-layout .hero__map-svg {
    width: 100%;
    max-width: 460px;
    margin-inline: auto;
    display: block;
    filter: drop-shadow(0 16px 44px rgba(0,0,0,0.45));
}

body.home .map-section .section-header--left {
    text-align: left;
    margin: 0 0 var(--space-md);
    max-width: none;
}
body.home .map-section .section-header--left p {
    margin-left: 0;
    margin-right: 0;
    max-width: 46ch;
}

/* Directions as a clean stacked list (replaces centered cards) */
body.home .route-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}
body.home .route-list__item {
    display: flex;
    gap: 1.1rem;
    padding: 1.35rem 0;
    border-top: 1px solid rgba(255,255,255,0.12);
}
body.home .route-list__item:last-child { border-bottom: 1px solid rgba(255,255,255,0.12); }
body.home .route-list__icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: rgba(242, 201, 76,0.12);
    border: 1px solid rgba(242, 201, 76,0.3);
    color: var(--wow-amber-soft);
    transition: transform var(--transition-base), background var(--transition-base), border-color var(--transition-base);
}
body.home .route-list__item:hover .route-list__icon {
    transform: translateX(3px);
    background: rgba(242, 201, 76,0.2);
    border-color: rgba(242, 201, 76,0.55);
}
body.home .route-list__title {
    font-family: var(--font-display);
    font-size: 1.3rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 0.3rem;
}
body.home .route-list__desc {
    font-size: var(--text-small);
    color: rgba(255,255,255,0.66);
    line-height: 1.6;
    margin: 0;
}

@media (max-width: 900px) {
    body.home .map-layout { grid-template-columns: 1fr; gap: var(--space-md); }
    body.home .map-layout__visual { order: -1; }
}

/* Route network: gentle flowing dashes (the one effect that reads as a map) */
body.home .hero__map-svg .map-route {
    stroke-dasharray: 5 9;
    animation: wowRouteFlow 1.6s linear infinite;
}
body.home .hero__map-svg .map-route:nth-child(2) { animation-duration: 1.9s; }
body.home .hero__map-svg .map-route:nth-child(3) { animation-duration: 2.1s; }
body.home .hero__map-svg .map-route:nth-child(4) { animation-duration: 1.8s; }
body.home .hero__map-svg .map-route:nth-child(5) { animation-duration: 2.2s; }
body.home .hero__map-svg .map-route:nth-child(6) { animation-duration: 2.4s; }

/* Soft pulsing hub at Poland */
body.home .hero__map-svg .map-hub__pulse {
    transform-box: fill-box;
    transform-origin: center;
    animation: wowHubPulse 3s ease-out infinite;
}

/* "Konwój" - glowing parcels travelling the routes (logistics easter egg) */
body.home .hero__map-svg .map-convoy {
    filter: drop-shadow(0 0 4px rgba(242, 201, 76,0.9));
}

/* =============================================================================
   2. SECTION EYEBROWS (small label above headings)
   ============================================================================= */
body.home .section-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    font-family: var(--font-body);
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--color-accent-ink);
    margin-bottom: 0.85rem;
}
body.home .section-eyebrow::before {
    content: "";
    width: 34px;
    height: 3px;
    border-radius: 2px;
    /* road-marking dashes (subtle logistics nod) */
    background: repeating-linear-gradient(90deg, var(--color-accent) 0 7px, transparent 7px 12px);
}
body.home .map-section .section-eyebrow,
body.home .career-teaser .section-eyebrow { color: var(--wow-amber-soft); }

/* =============================================================================
   3. CARDS - simple lift, no gradient-border glow
   ============================================================================= */
body.home .offer-card {
    transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base);
}
body.home .offer-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}
/* Checklist bullets in brand navy instead of green */
body.home .offer-card__list li::before { background-color: var(--color-primary); }

body.home .route-card__flag {
    color: var(--wow-amber-soft);
    display: inline-flex;
}
body.home .route-card__flag svg { display: block; }

body.home .group-card {
    transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base);
}
body.home .group-card:hover {
    transform: translateY(-3px);
    border-color: rgba(242, 201, 76,0.35);
}
body.home .group-card:hover .group-card__link { gap: 0.6rem; }
body.home .group-card__link { transition: gap var(--transition-base); }

body.home .usp-item {
    transition: transform var(--transition-base), box-shadow var(--transition-base), border-left-color var(--transition-base);
}
body.home .usp-item:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-sm);
    border-left-color: var(--wow-amber);
}
body.home .usp-item__icon { color: var(--color-primary); transition: color var(--transition-base); }
body.home .usp-item:hover .usp-item__icon { color: var(--wow-amber); }

body.home .news-card { transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base); }
body.home .news-card:hover { border-color: rgba(242, 201, 76,0.30); }
body.home .news-card__more { transition: gap var(--transition-base); }
body.home .news-card:hover .news-card__more { gap: 0.55rem; }

/* =============================================================================
   4. STATS SECTION - real fleet photo behind a deep navy wash
   ============================================================================= */
body.home .stats-section {
    background: linear-gradient(135deg, var(--color-primary-dark), var(--color-primary));
}
body.home .stats-section--photo {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}
body.home .stats-section__bg {
    position: absolute;
    inset: 0;
    z-index: -1;
}
body.home .stats-section__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 30%;
}
body.home .stats-section--photo::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        radial-gradient(70% 95% at 100% 0%, rgba(242, 201, 76,0.30) 0%, transparent 55%),
        linear-gradient(135deg, rgba(7,18,32,0.94), rgba(13,81,149,0.80));
}

/* =============================================================================
   5. CAREER TEASER - real photo + subtle warm glow
   ============================================================================= */
body.home .career-teaser {
    position: relative;
    overflow: hidden;
}
body.home .career-teaser::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(58% 80% at 88% 18%, rgba(242, 201, 76,0.16) 0%, transparent 62%);
    pointer-events: none;
}
body.home .career-teaser > .container { position: relative; z-index: 1; }
body.home .career-teaser__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 4/3;
    border-radius: var(--radius-lg);
}

/* CTA arrows "drive off" on hover */
body.home .btn svg { transition: transform var(--transition-base); }
body.home .btn:hover svg { transform: translateX(3px); }

/* =============================================================================
   ANIMATIONS (map only)
   ============================================================================= */
@keyframes wowRouteFlow {
    to { stroke-dashoffset: -14; }
}
@keyframes wowHubPulse {
    0%   { transform: scale(1);   opacity: 0.85; }
    70%  { transform: scale(2.2); opacity: 0; }
    100% { transform: scale(2.2); opacity: 0; }
}
@keyframes wowScroll {
    0%   { opacity: 0; transform: translateY(0); }
    40%  { opacity: 1; }
    100% { opacity: 0; transform: translateY(12px); }
}

/* =============================================================================
   REDUCED MOTION
   ============================================================================= */
@media (prefers-reduced-motion: reduce) {
    body.home .hero__map-svg .map-route,
    body.home .hero__map-svg .map-hub__pulse { animation: none; }
    body.home .hero__map-svg .map-convoy { display: none; }
    body.home .hero__scroll-cue .mouse::before { animation: none; }
}