/* ═══════════════════════════════════════════════════════════
   Alpenzaun Footer — [alpenzaun_footer]
   Dve sekcie: az-fl (main) + az-fd (bottom payments/social bar)
   ═══════════════════════════════════════════════════════════ */

/* ─── MAIN FOOTER ─── */
.az-fl {
    --az-red: #f04e23;
    --az-red2: #772008;
    --az-black: #141414;
    --az-khaki: #3d403a;
    --az-white: #fafafa;
    --az-steel: #9e9e9e;
    --az-line: rgba(20, 20, 20, .08);

    width: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Instrument Sans', system-ui, -apple-system, sans-serif;
    background: var(--az-white);
    color: var(--az-black);
    overflow: hidden;
    position: relative;
    display: block;
}
.az-fl * {
    box-sizing: border-box;
    font-style: normal !important;
    min-width: 0;
}

.az-fl-inner {
    width: 100%;
    max-width: 1650px;  /* zarovno s header_main + mega-menu */
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 2.5fr;
    gap: 80px;
    align-items: start;
    padding: 80px 0 50px;
}
@media (max-width: 1700px) {
    .az-fl-inner { padding-left: 24px; padding-right: 24px; }
}

/* ── BRAND column ── */
.az-fl-brand { min-width: 0; }
.az-fl-logo { display: inline-block; text-decoration: none; margin-bottom: 20px; }
.az-fl-logo img { max-width: 100%; height: auto; }
.az-fl-about {
    font-size: 14px;
    line-height: 1.6;
    color: var(--az-khaki);
    margin: 0 0 24px;
    overflow-wrap: anywhere;
}

/* ── Contact rows ── */
.az-fl-contact { display: flex; flex-direction: column; gap: 10px; }
.az-fl-contact-row {
    display: flex; align-items: center; gap: 12px;
    text-decoration: none; color: var(--az-black);
    padding: 8px 0;
    transition: color .25s;
    min-width: 0;
}
.az-fl-contact-row:hover:not(.az-fl-contact-row--static) { color: var(--az-red); }
.az-fl-contact-row:hover:not(.az-fl-contact-row--static) .az-fl-ci {
    background: var(--az-red); color: var(--az-white); border-color: var(--az-red);
}
.az-fl-ci {
    flex: 0 0 36px; width: 36px; height: 36px; border-radius: 10px;
    border: 1px solid var(--az-line); background: #fff; color: var(--az-khaki);
    display: flex; align-items: center; justify-content: center;
    transition: all .25s;
}
.az-fl-ci svg { width: 16px; height: 16px; }
.az-fl-ct { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1; }
.az-fl-cl {
    font-size: 11px; font-weight: 500; letter-spacing: .08em;
    text-transform: uppercase; color: var(--az-steel);
}
.az-fl-ct strong {
    font-size: 14px; font-weight: 600; letter-spacing: -.01em;
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* ── NAV columns (4) ── */
.az-fl-nav {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
    min-width: 0;
}
.az-fl-col { min-width: 0; }
.az-fl-heading {
    font-size: 13px; font-weight: 600; letter-spacing: .1em;
    text-transform: uppercase; color: var(--az-black);
    margin: 0 0 18px; padding-bottom: 14px;
    border-bottom: 1px solid var(--az-line);
    position: relative;
}
.az-fl-heading::after {
    content: ''; position: absolute; bottom: -1px; left: 0;
    width: 24px; height: 1px; background: var(--az-red);
}
.az-fl-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.az-fl-list a {
    font-size: 14px; color: var(--az-khaki);
    text-decoration: none; display: inline-flex; align-items: center; gap: 6px;
    transition: all .25s;
}
.az-fl-list a::before {
    content: ''; width: 0; height: 1px;
    background: var(--az-red); transition: width .25s;
}
.az-fl-list a:hover { color: var(--az-red); transform: translateX(2px); }
.az-fl-list a:hover::before { width: 12px; }

/* ── Responsive ── */
@media (max-width: 1080px) {
    .az-fl-inner { grid-template-columns: 1fr; gap: 50px; }
}
@media (max-width: 720px) {
    .az-fl-inner { gap: 40px; padding: 60px 24px 40px; }
    .az-fl-nav { grid-template-columns: 1fr 1fr; gap: 30px; }
}
@media (max-width: 480px) {
    .az-fl-inner { padding: 48px 18px 32px; gap: 32px; }
    .az-fl-ct strong { font-size: 13px; }
    .az-fl-list a { font-size: 13.5px; }
    .az-fl-about { font-size: 13.5px; }
}
@media (max-width: 380px) {
    .az-fl-nav { grid-template-columns: 1fr; gap: 24px; }
}

/* ═══════════════════════════════════════════════════════════
   BOTTOM BAR — copyright + payments + social
   ═══════════════════════════════════════════════════════════ */
.az-fd {
    --az-red: #f04e23;
    --az-red2: #772008;
    --az-black: #141414;
    --az-white: #fafafa;
    --az-steel: #9e9e9e;
    --az-line: rgba(250, 250, 250, .08);

    width: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Instrument Sans', system-ui, -apple-system, sans-serif;
    background: var(--az-black);
    color: var(--az-white);
    position: relative;
    display: block;
}
.az-fd * { box-sizing: border-box; font-style: normal !important; }
.az-fd-pay-item svg text { font-style: italic !important; }
.az-fd-pay-item--klarna svg text,
.az-fd-pay-item[title="Apple Pay"] svg text,
.az-fd-pay-item[title="Google Pay"] svg text { font-style: normal !important; }

/* Top accent line */
.az-fd::before {
    content: '';
    position: absolute; top: 0; left: 50%;
    transform: translateX(-50%);
    width: 120px; height: 2px;
    background: var(--az-red);
    border-radius: 0 0 4px 4px;
    z-index: 2;
}

.az-fd-inner {
    width: 100%;
    max-width: 1650px;  /* zarovno s header_main + mega-menu */
    margin: 0 auto;
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 60px;
    padding: 20px 0;
}
@media (max-width: 1700px) {
    .az-fd-inner { padding-left: 24px; padding-right: 24px; }
}

.az-fd-col { display: flex; align-items: center; gap: 20px; }
.az-fd-col--center {
    position: absolute;
    left: 50%; top: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}
.az-fd-col--left,
.az-fd-col--right { flex: 0 0 auto; max-width: 30%; }

.az-fd-label {
    font-size: 11px; font-weight: 600; letter-spacing: .1em;
    text-transform: uppercase; color: var(--az-steel); white-space: nowrap;
}
.az-fd-copy {
    margin: 0; font-size: 12px; color: var(--az-steel); white-space: nowrap; line-height: 1;
}

/* ── Payments ── */
.az-fd-pay {
    list-style: none; margin: 0; padding: 0;
    display: flex; gap: 6px; flex-wrap: wrap;
    justify-content: center; align-items: center;
}
.az-fd-pay-item {
    /* JEDNOTNÁ veľkosť pre všetky payment ikony — žiadne výnimky */
    width: 60px;
    height: 32px;
    background: #fff;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px 8px;
    transition: all .25s;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .04) inset;
}
.az-fd-pay-item:hover { transform: translateY(-2px); box-shadow: 0 6px 14px -4px rgba(240, 78, 35, .4); }
.az-fd-pay-item svg { width: 100%; height: 100%; display: block; }
/* Klarna — rovnaká veľkosť, len ružové pozadie */
.az-fd-pay-item--klarna {
    background: #FFB3C7 !important;
}
/* Wide modifier zachovaný pre kompatibilitu ale už nemá efekt */
.az-fd-pay-item--wide { width: 60px; }

/* ── Social ── */
.az-fd-social { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px; }
.az-fd-social a {
    display: flex; align-items: center; justify-content: center;
    width: 34px; height: 34px; border-radius: 9px;
    background: rgba(250, 250, 250, .05); border: 1px solid var(--az-line);
    color: var(--az-white); text-decoration: none; transition: all .25s;
}
.az-fd-social a:hover { background: var(--az-red); border-color: var(--az-red); transform: translateY(-2px); }
.az-fd-social svg { width: 14px; height: 14px; }

.az-fd-top {
    display: flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; border-radius: 50%;
    background: var(--az-red); color: var(--az-white);
    text-decoration: none; margin-left: 10px; transition: all .25s;
}
.az-fd-top:hover { background: var(--az-red2); transform: translateY(-3px); }
.az-fd-top svg { width: 16px; height: 16px; }

/* ── Responsive ── */
@media (max-width: 1180px) {
    .az-fd-inner { flex-direction: column; gap: 20px; min-height: auto; padding: 28px 20px; }
    .az-fd-col--center { position: static; transform: none; left: auto; top: auto; }
    .az-fd-col { justify-content: center; flex-wrap: wrap; max-width: 100%; }
    .az-fd-col--left,
    .az-fd-col--right { max-width: 100%; }
}
@media (max-width: 520px) {
    .az-fd-pay { gap: 4px; }
    .az-fd-pay-item { width: 42px; height: 28px; }
    .az-fd-pay-item--wide { width: 54px; }
    .az-fd-col--right .az-fd-label { display: none; }
}
