/* =============================================================
   LOVEU | Home 02 Product Categories V1 (2026-10-15)
   Scoped to body.loveu-site + .loveu-categories.
   Common Header, Hero, future modules and Bootstrap grid unchanged.
   ============================================================= */
body.loveu-site .loveu-categories {
    background: var(--loveu-paper, #fff);
    padding-block: clamp(3.6rem, 6vw, 6.25rem);
}
body.loveu-site .loveu-categories__grid {
    justify-content: center;
}
body.loveu-site .loveu-categories__column {
    min-width: 0;
}
body.loveu-site .loveu-categories__card {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    width: 100%;
    aspect-ratio: 263 / 321;
    max-height: 540px;
    overflow: hidden;
    background: #233d59;
    color: #fff;
    text-align: center;
    text-decoration: none;
    border-radius: 0;
    transition: box-shadow .25s ease;
}
body.loveu-site a.loveu-categories__card { cursor: pointer; }
body.loveu-site .loveu-categories__card--pending { cursor: default; }
body.loveu-site .loveu-categories__photo {
    position: absolute;
    inset: 0;
    z-index: -2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    transition: transform .5s ease;
}
/* Reference-only images are crops from the supplied page mockup.
   Zoom them to keep the sample captions outside the visible card; real CMS
   product photos always keep their true scale and normal object-fit ratio. */
body.loveu-site .loveu-categories__photo.is-reference-image {
    transform: scale(1.65);
    transform-origin: center top;
}
body.loveu-site a.loveu-categories__card:hover .loveu-categories__photo.is-reference-image,
body.loveu-site a.loveu-categories__card:focus-visible .loveu-categories__photo.is-reference-image {
    transform: scale(1.70);
}
body.loveu-site .loveu-categories__shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(to bottom,
        rgba(7,17,32,.02) 0%,
        rgba(7,17,32,.10) 40%,
        rgba(7,17,32,.78) 67%,
        rgba(7,17,32,.96) 100%);
    transition: background .3s ease;
}
body.loveu-site .loveu-categories__body {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
    padding: 0 1rem clamp(1.65rem, 3vw, 2.5rem);
    pointer-events: none;
}
body.loveu-site .loveu-categories__name {
    display: flex;
    flex-direction: column;
    gap: .08rem;
    color: #fff;
    font: 600 clamp(1.08rem, 1.55vw, 1.45rem)/1.36 var(--loveu-font);
    letter-spacing: .005em;
    text-transform: uppercase;
    text-shadow: 0 2px 10px rgba(0,0,0,.25);
    margin-bottom: 1.35rem;
}
body.loveu-site .loveu-categories__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: min(170px, 78%);
    min-height: 2.65rem;
    padding: .65rem 1.2rem;
    background: rgba(12,18,29,.74);
    color: #fff;
    font: 500 .82rem/1.5 var(--loveu-font);
    letter-spacing: .005em;
    transition: background .25s ease, transform .25s ease;
}
body.loveu-site a.loveu-categories__card:hover,
body.loveu-site a.loveu-categories__card:focus-visible { box-shadow: 0 14px 32px rgba(18,45,86,.13); }
body.loveu-site a.loveu-categories__card:hover .loveu-categories__photo,
body.loveu-site a.loveu-categories__card:focus-visible .loveu-categories__photo { transform: scale(1.055); }
body.loveu-site a.loveu-categories__card:hover .loveu-categories__cta,
body.loveu-site a.loveu-categories__card:focus-visible .loveu-categories__cta { background: var(--loveu-navy, #10336d); transform: translateY(-2px); }
body.loveu-site a.loveu-categories__card:focus-visible { outline: 3px solid var(--loveu-navy, #10336d); outline-offset: 3px; }
@media (min-width:576px) and (max-width:767.98px) {
    body.loveu-site .loveu-categories__column:last-child { margin-inline: auto; }
    body.loveu-site .loveu-categories__name { font-size: 1.04rem; }
}
@media (max-width:575.98px) {
    body.loveu-site .loveu-categories { padding-block: 3rem; }
    body.loveu-site .loveu-categories__card { aspect-ratio: 1 / 1.03; max-height: 445px; }
    body.loveu-site .loveu-categories__body { padding-bottom: 2.25rem; }
    body.loveu-site .loveu-categories__name { font-size: 1.23rem; margin-bottom: 1.1rem; }
    body.loveu-site .loveu-categories__cta { min-height: 2.5rem; }
}
@media (prefers-reduced-motion:reduce) {
    body.loveu-site .loveu-categories__card,
    body.loveu-site .loveu-categories__photo,
    body.loveu-site .loveu-categories__cta { transition: none; }
}