/* ============================================================================
 * R48 - uwaga klienta z 16.09.2026 (komentarz w ClickUp 869f1qk91)
 *
 * "Zostala jedna rzecz - brakuje buttonow podlinkowanych na 404."
 *
 * R47 odtworzyl na stronie 404 naglowek i trzy kafle, ale pominal czwarty rzad:
 * trzy pomaranczowe przyciski pod kaflami, prowadzace tam gdzie kafle. Na
 * produkcji to osobny fusion-builder-row, kilka kilobajtow nizej w HTML, wiec
 * przy przepisywaniu sekcji wypadl z pola widzenia.
 *
 * Konwencja rundy jak R39/R40/R43/R47: osobny arkusz ladowany OSTATNI, zeby
 * cala runde dalo sie cofnac jednym plikiem.
 * ========================================================================= */

/* ----------------------------------------------------------------------------
 * Przyciski pod kaflami 404.
 *
 * Wartosci zmierzone na zywej produkcji przy szerokosci okna 1440 px
 * (tools/r48-404/u5-przycisk-styl.mjs):
 *   wysokosc 42 px = 16 px interlinii + 2x11 px paddingu + 2x2 px obramowania
 *   padding 11px 23px, promien 12 px, Open Sans 13px/16px waga 400, bez wersalikow
 *   spoczynek: tlo #ea5b0c, tekst #ffffff, obramowanie 2 px #ffffff
 *   hover:     tlo #ffffff, tekst #ea5b0c, obramowanie 2 px #ea5b0c, przejscie 0,2 s
 *
 * Wyrownanie w pionie: na produkcji wszystkie trzy przyciski stoja w JEDNYM
 * rzedzie (y = 1098), mimo ze trzeci kafel jest o 6 px nizszy od pozostalych.
 * Odstep od dolu najwyzszego kafla wynosi 10 px, od nizszego 16 px. Dlatego
 * kafel jest kolumna rozciagnieta na wysokosc rzedu (align-items: stretch),
 * a przycisk dosuwamy do jej dolu przez margin-top: auto - wtedy rownanie
 * wychodzi samo, bez sztywnych wysokosci.
 * ------------------------------------------------------------------------- */
.chem-error-404__tiles {
    align-items: stretch;
}

.chem-error-404__tile {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.chem-error-404__tile-image {
    width: 100%;
    margin-bottom: 10px;
}

.chem-error-404 .chem-error-404__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    margin-top: auto;
    padding: 11px 23px;
    border: 2px solid #ffffff;
    border-radius: 12px;
    background: #ea5b0c;
    color: #ffffff;
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 16px;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    transition: all 0.2s;
}

.chem-error-404 .chem-error-404__button:hover,
.chem-error-404 .chem-error-404__button:focus {
    border-color: #ea5b0c;
    background: #ffffff;
    color: #ea5b0c;
    text-decoration: none;
}

@media (max-width: 767px) {
    /* w kolumnie margin-top: auto nie ma czego wyrownywac - zostaje sam odstep */
    .chem-error-404__tile-image { margin-bottom: 12px; }
}
