* { box-sizing: border-box; }
body {
    margin: 0;
    min-height: 100vh;
    min-height: 100svh;
    display: grid;
    place-items: center;
    padding: 24px 16px;
    background: #f4f5f1;
    color: #192428;
    font-family: system-ui, sans-serif;
}
main {
    width: min(100%, 32rem);
    border-top: 6px solid #ffdc00;
    background: white;
    padding: clamp(24px, 6vw, 48px);
    border-radius: 8px;
    box-shadow: 0 8px 32px #17272b0d;
}
.brand { display: block; width: 108px; height: auto; }
h1 { margin: 32px 0 8px; font-size: clamp(1.65rem, 6vw, 2.4rem); line-height: 1.12; letter-spacing: -.04em; }
p { margin: 0 0 24px; color: #4e5b60; }
.stores { display: grid; gap: 12px; }
.stores a {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border: 1px solid #d5dadd;
    border-radius: 6px;
    color: inherit;
    font-weight: 600;
    text-decoration: none;
}
.stores a:hover { background: #fffbea; border-color: #9b8611; }
.stores a:focus-visible { outline: 3px solid #285b85; outline-offset: 3px; }
.stores img { display: block; width: 142px; height: auto; max-width: 100%; }
@media (max-width: 360px) {
    .stores a { grid-template-columns: 1fr; justify-items: center; }
}
