/* custom.css: Carolina Apparel's own styles. Loads last. */

.site-logo { width: auto; height: 4.25rem; }
.site-logo--footer { height: 6rem; }
.site-nav-shop { white-space: nowrap; }
@media (max-width: 639px) { .site-nav-shop { display: none; } }

/* Home hero: the store photo under a navy wash */
.site-hero {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: flex-end;
    min-height: max(88svh, 40rem);
    padding-block: 11rem 4rem;
    color: #fff;
    background: var(--color-secondary-base);
    overflow: clip;
}
.site-hero-img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.site-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(to top, color-mix(in oklab, var(--color-secondary-base) 90%, transparent) 20%, color-mix(in oklab, var(--color-secondary-base) 55%, transparent) 55%, color-mix(in oklab, var(--color-secondary-base) 10%, transparent));
}
.site-hero-body { width: 100%; }
.site-hero-title { max-width: 18ch; margin: 0; color: #fff; font-size: clamp(2.5rem, 1.6rem + 3.8vw, 5rem); line-height: 1.02; }
.site-hero-lead { max-width: 40rem; margin: 1.25rem 0 2rem; font-size: 1.25rem; line-height: 1.5; color: #ffffffd9; }

/* Category tiles */
.site-tiles { display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 0; padding: 0; list-style: none; }
@media (min-width: 1024px) { .site-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.site-tile { position: relative; display: block; overflow: hidden; border-radius: .75rem; color: #fff; }
.site-tile img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; transition: transform .4s ease; }
.site-tile:hover img { transform: scale(1.04); }
.site-tile-text { position: absolute; inset: auto 0 0; display: grid; gap: .15rem; padding: 3rem 1rem 1rem; background: linear-gradient(to top, color-mix(in oklab, var(--color-secondary-base) 90%, transparent), transparent); }
.site-tile-text strong { font-size: 1.25rem; }
.site-tile-text span { font-size: .9375rem; color: #ffffffd9; }

.site-photo { display: block; width: 100%; height: auto; border-radius: .75rem; }
.site-photo--wide { max-height: 30rem; object-fit: cover; }
.site-brands { display: block; width: 100%; max-width: 32rem; height: auto; margin-inline: auto; }

.site-map { min-height: 24rem; overflow: hidden; border-radius: .75rem; }
.site-map iframe { display: block; width: 100%; height: 100%; min-height: 24rem; border: 0; }

.site-prose { max-width: 46rem; font-size: 1.0625rem; line-height: 1.7; }
.site-prose h2 { margin: 2rem 0 .5rem; font-size: 1.5rem; }
.site-prose h2:first-child { margin-top: 0; }
.site-prose p { margin: 0 0 1rem; }
.site-prose ul { margin: 0 0 1rem; padding-left: 1.25rem; list-style: disc; }

.site-footer-title { margin: 0 0 1rem; font-family: inherit; font-size: 1rem; font-weight: 600; line-height: 1.5; color: #fff; }

.site-hero .eyebrow { color: #fff; }

/* Form spam trap: hidden from people, visible to robots */
.site-trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.site-form-error { margin: 0; font-weight: 600; color: #b42318; }