@import url("/assets/css/mindvision-department-hero.css");

/* Mindvision Editorial Department — Drinkware master template
   Visual target: approved Drinkware mock-up
*/

:root {
    --mv-navy: #092a55;
    --mv-navy-dark: #061f43;
    --mv-teal: #0f9da1;
    --mv-teal-bright: #12bbb7;
    --mv-blue-soft: #eef6fb;
    --mv-warm: #fbf8f3;
    --mv-border: #e1e7ec;
    --mv-copy: #314158;
    --mv-muted: #6e7d8f;
    --mv-white: #ffffff;
    --mv-radius: 12px;
    --mv-shadow: 0 12px 34px rgba(9, 42, 85, .08);
}

.mv-editorial-department {
    overflow: hidden;
    color: var(--mv-copy);
    background: #fff;
    font-family: "Poppins", sans-serif;
}

.mv-editorial-department *,
.mv-editorial-department *::before,
.mv-editorial-department *::after {
    box-sizing: border-box;
}

.mv-dt-shell {
    width: min(1280px, calc(100% - 48px));
    margin-inline: auto;
}

.mv-dt-section {
    padding: 28px 0;
}

.mv-dt-heading {
    margin-bottom: 18px;
}

.mv-dt-heading--center {
    text-align: center;
}

.mv-dt-heading h2,
.mv-dt-guidance-card h2,
.mv-dt-featured h2,
.mv-dt-concierge h2 {
    margin: 0;
    color: var(--mv-navy);
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    letter-spacing: -.025em;
}

.mv-dt-heading h2 {
    font-size: clamp(1.45rem, 2.2vw, 2rem);
}

.mv-dt-eyebrow {
    display: flex;
    gap: 8px;
    align-items: center;
    margin: 0 0 8px;
    color: var(--mv-teal);
    font-size: .73rem;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.mv-dt-eyebrow--center,
.mv-dt-heading--center .mv-dt-eyebrow {
    justify-content: center;
}

.mv-dt-button {
    display: inline-flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 20px;
    border: 1px solid transparent;
    border-radius: 7px;
    text-decoration: none;
    font-size: .88rem;
    font-weight: 600;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.mv-dt-button:hover {
    transform: translateY(-2px);
}

.mv-dt-button--primary {
    color: #fff;
    background: var(--mv-teal);
    box-shadow: 0 10px 22px rgba(15, 157, 161, .22);
}

.mv-dt-button--secondary {
    color: var(--mv-navy);
    background: #fff;
    border-color: var(--mv-navy);
}

.mv-dt-button--light {
    color: var(--mv-navy);
    background: #fff;
}

/* Hero */
.mv-dt-hero {
    position: relative;
    min-height: 286px;
    overflow: hidden;
    background: #f4f5f5;
}

.mv-dt-breadcrumb {
    position: relative;
    z-index: 4;
    display: flex;
    gap: 8px;
    align-items: center;
    min-height: 34px;
    padding-top: 10px;
    color: #75808b;
    font-size: .72rem;
}

.mv-dt-breadcrumb a {
    display: inline-flex;
    gap: 6px;
    align-items: center;
    color: inherit;
    text-decoration: none;
}

.mv-dt-breadcrumb svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.mv-dt-hero__grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, .85fr) minmax(500px, 1.25fr);
    min-height: 252px;
    align-items: stretch;
}

.mv-dt-hero__copy {
    position: relative;
    z-index: 3;
    align-self: center;
    max-width: 520px;
    padding: 20px 0 34px;
}

.mv-dt-hero__eyebrow {
    gap: 9px;
    margin-bottom: 9px;
}

.mv-dt-hero__eyebrow-icon {
    display: inline-flex;
    width: 27px;
    height: 27px;
    align-items: center;
    justify-content: center;
    color: var(--mv-teal);
}

.mv-dt-hero__eyebrow-icon .mv-department-icon {
    width: 24px;
    height: 24px;
    stroke-width: 1.55;
}


.mv-dt-hero__copy p:not(.mv-dt-eyebrow) {
    max-width: 470px;
    margin: 0 0 18px;
    color: var(--mv-copy);
    font-size: .88rem;
    line-height: 1.62;
}

.mv-dt-hero__button {
    white-space: nowrap;
}

.mv-dt-hero__visual {
    position: absolute;
    z-index: 0;
    top: -34px;
    right: calc((100vw - min(1280px, calc(100vw - 48px))) / -2);
    bottom: 0;
    left: 38%;
    min-height: 286px;
    overflow: hidden;
}

.mv-dt-hero__visual::before {
    position: absolute;
    z-index: 2;
    inset: 0;
    content: "";
    background: linear-gradient(90deg, #f4f5f5 0%, rgba(244,245,245,.98) 8%, rgba(244,245,245,.84) 18%, rgba(244,245,245,.46) 32%, rgba(244,245,245,.12) 47%, rgba(244,245,245,0) 62%);
    pointer-events: none;
}

.mv-dt-hero__visual img {
    width: 100%;
    height: 100%;
    min-height: 286px;
    object-fit: cover;
    object-position: center;
}

/* Purpose cards */
.mv-dt-purpose {
    background: var(--mv-department-accent-light);
}

.mv-dt-purpose__grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 14px;
}

.mv-dt-purpose-card {
    display: flex;
    min-height: 218px;
    flex-direction: column;
    padding: 22px 18px 16px;
    color: var(--mv-navy);
    text-decoration: none;
    background: #f6faf8;
    border: 1px solid var(--mv-border);
    border-radius: var(--mv-radius);
    box-shadow: 0 7px 20px rgba(9, 42, 85, .035);
    transition: transform .2s ease, box-shadow .2s ease;
}

.mv-dt-purpose-card:nth-child(2) { background: #f3f7fc; }
.mv-dt-purpose-card:nth-child(3) { background: #f4faf6; }
.mv-dt-purpose-card:nth-child(4) { background: #f7f5fb; }
.mv-dt-purpose-card:nth-child(5) { background: #fff9ec; }
.mv-dt-purpose-card:nth-child(6) { background: #fff4f1; }

.mv-dt-purpose-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--mv-shadow);
}

.mv-dt-purpose-card__icon {
    display: flex;
    width: 45px;
    height: 45px;
    align-items: center;
    justify-content: center;
    margin-bottom: 14px;
    color: var(--mv-teal);
}

.mv-department-icon {
    width: 31px;
    height: 31px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.mv-dt-purpose-card strong {
    min-height: 48px;
    margin-bottom: 8px;
    font-size: .98rem;
    line-height: 1.35;
}

.mv-dt-purpose-card > span:not(.mv-dt-purpose-card__icon) {
    color: var(--mv-copy);
    font-size: .74rem;
    line-height: 1.0rem;
}

.mv-dt-purpose-card b {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: auto;
    color: var(--mv-navy);
    font-size: 0;
}

.mv-dt-purpose-card b svg,
.mv-dt-collection-card__label svg,
.mv-dt-campaign-card > svg {
    width: 18px;
    height: 18px;
}

/* Collections */
.mv-dt-collections__grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 14px;
}

.mv-dt-collection-card {
    overflow: hidden;
    color: var(--mv-navy);
    text-decoration: none;
    background: #fff;
    border: 1px solid var(--mv-border);
    border-radius: var(--mv-radius);
    transition: transform .2s ease, box-shadow .2s ease;
}

.mv-dt-collection-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--mv-shadow);
}

.mv-dt-collection-card__image {
    display: block;
    height: 165px;
    overflow: hidden;
    background: linear-gradient(#f7f7f4 0 70%, #e4c9a9 70%);
}

.mv-dt-collection-card__image img {
    width: 100%;
    height: 100%;
    padding: 18px;
    object-fit: contain;
}

.mv-dt-collection-card__label {
    display: flex;
    min-height: 46px;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    border-top: 1px solid var(--mv-border);
}

.mv-dt-collection-card__label strong {
    font-size: .84rem;
}

/* Trust strip */
.mv-dt-trust {
    padding: 13px 0 20px;
}

.mv-dt-trust .mv-dt-shell {
    padding: 14px 20px;
    background: #fbfcfc;
    border: 1px solid #edf0f2;
    border-radius: 10px;
}

.mv-dt-trust__grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.mv-dt-trust__item {
    display: flex;
    gap: 12px;
    min-height: 50px;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    border-right: 1px solid #dde3e8;
    color: var(--mv-navy);
}

.mv-dt-trust__item:last-child {
    border-right: 0;
}

.mv-dt-trust__item .mv-department-icon {
    width: 30px;
    height: 30px;
}

.mv-dt-trust__item span {
    max-width: 125px;
    font-size: .74rem;
    font-weight: 600;
    line-height: 1.35;
}

/* Featured products */
.mv-dt-featured__panel {
    display: grid;
    grid-template-columns: 310px minmax(0, 1fr);
    overflow: hidden;
    padding: 0;
    background: #fff;
    border: 1px solid var(--mv-border);
    border-radius: var(--mv-radius);
    box-shadow: 0 10px 26px rgba(9,42,85,.045);
}

.mv-dt-featured__intro {
    padding: 28px 24px;
    background: linear-gradient(135deg, #f5f8fc, #fff);
    border-right: 1px solid var(--mv-border);
}

.mv-dt-featured__intro h2 {
    margin-bottom: 12px;
    font-size: 1.5rem;
}

.mv-dt-featured__intro > p:not(.mv-dt-eyebrow) {
    margin: 0 0 22px;
    color: var(--mv-copy);
    font-size: .82rem;
    line-height: 1.65;
}

.mv-dt-featured__grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.mv-dt-product-card {
    position: relative;
    display: flex;
    min-height: 250px;
    flex-direction: column;
    padding: 18px 14px;
    color: var(--mv-navy);
    text-decoration: none;
    background: #fff;
    border-right: 1px solid var(--mv-border);
}

.mv-dt-product-card:last-child {
    border-right: 0;
}

.mv-dt-product-card__tag {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 1;
    min-height: 18px;
    padding: 2px 7px;
    color: #fff;
    background: #22a96b;
    border-radius: 99px;
    font-size: .62rem;
    font-weight: 700;
}

.mv-dt-product-card__tag:empty {
    display: none;
}

.mv-editorial-department .mv-dt-product-card__tag {
    z-index: 3;
}


.mv-dt-product-card__image {
    display: flex;
    height: 130px;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
}

.mv-dt-product-card__image img {
    max-width: 86%;
    max-height: 118px;
    object-fit: contain;
}

.mv-dt-product-card strong {
    margin-bottom: 4px;
    font-size: .78rem;
    line-height: 1.35;
}

.mv-dt-product-card > span:last-child {
    color: var(--mv-muted);
    font-size: .68rem;
}

/* Guidance */
.mv-dt-guidance__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.mv-dt-guidance-card {
    position: relative;
    min-height: 235px;
    padding: 28px;
    overflow: hidden;
    color: var(--mv-navy);
    text-decoration: none;
    border: 1px solid var(--mv-border);
    border-radius: var(--mv-radius);
}

.mv-dt-guidance-card--guide {
    background: linear-gradient(110deg, #f4f9fd 0%, #eaf4fb 100%);
}

.mv-dt-guidance-card--ideas {
    background: linear-gradient(110deg, #f4fbfb 0%, #fff 100%);
}

.mv-dt-guidance-card__icon {
    position: absolute;
    top: 24px;
    left: 24px;
    color: var(--mv-teal);
}

.mv-dt-guidance-card .mv-dt-eyebrow,
.mv-dt-guidance-card h2,
.mv-dt-guidance-card > p:not(.mv-dt-eyebrow),
.mv-dt-guidance-card > b,
.mv-dt-guidance-links {
    margin-left: 0;
}

.mv-dt-guidance-card h2 {
    max-width: 420px;
    margin-bottom: 10px;
    padding-top: 22px;
    font-size: 1.35rem;
}

.mv-dt-guidance-card > p:not(.mv-dt-eyebrow) {
    max-width: 470px;
    margin-bottom: 18px;
    font-size: .79rem;
    line-height: 1.65;
}

.mv-dt-guidance-card > b {
    display: inline-flex;
    gap: 10px;
    align-items: center;
    padding: 10px 15px;
    border: 1px solid var(--mv-navy);
    border-radius: 6px;
    font-size: .75rem;
}

.mv-dt-guidance-links {
    position: absolute;
    top: 28px;
    right: 22px;
    width: 45%;
}

.mv-dt-guidance-links a {
    display: flex;
    min-height: 36px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
    padding: 7px 12px;
    color: var(--mv-navy);
    text-decoration: none;
    background: #fff;
    border: 1px solid var(--mv-border);
    border-radius: 6px;
    font-size: .73rem;
    font-weight: 600;
}

/* Campaign add-ons */
.mv-dt-campaign__grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
}

.mv-dt-campaign-card {
    position: relative;
    display: grid;
    min-height: 120px;
    grid-template-rows: 1fr auto;
    overflow: hidden;
    color: var(--mv-navy);
    text-decoration: none;
    background: #fff;
    border: 1px solid var(--mv-border);
    border-radius: 8px;
}

.mv-dt-campaign-card > span {
    display: flex;
    min-height: 82px;
    align-items: center;
    justify-content: center;
    background: #fbfbfa;
}

.mv-dt-campaign-card img {
    max-width: 88%;
    max-height: 76px;
    object-fit: contain;
}

.mv-dt-campaign-card strong {
    padding: 9px 12px;
    font-size: .74rem;
}

.mv-dt-campaign-card > svg {
    position: absolute;
    right: 10px;
    bottom: 9px;
}

/* Concierge is intentionally compact; footer follows immediately */
.mv-dt-concierge {
    padding: 22px 0;
    color: #fff;
    background: linear-gradient(90deg, var(--mv-teal), #07878e);
}

.mv-dt-concierge__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mv-dt-concierge h2 {
    color: #fff;
    font-size: 1.35rem;
}

.mv-dt-concierge p {
    margin: 6px 0 0;
    color: rgba(255,255,255,.85);
    font-size: .8rem;
}

/* Responsive */
@media (max-width: 1100px) {
    .mv-dt-purpose__grid,
    .mv-dt-collections__grid,
    .mv-dt-campaign__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .mv-dt-featured__panel {
        grid-template-columns: 260px minmax(0,1fr);
    }

    .mv-dt-featured__grid {
        grid-template-columns: repeat(3, minmax(0,1fr));
    }

    .mv-dt-product-card:nth-child(n+4) {
        display: none;
    }
}

@media (max-width: 820px) {
    .mv-dt-shell {
        width: min(100% - 30px, 720px);
    }

    .mv-dt-hero {
        min-height: 0;
    }

    .mv-dt-hero__grid {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .mv-dt-hero__copy {
        max-width: 560px;
        padding: 24px 0 32px;
    }

    .mv-dt-hero__visual {
        top: -34px;
        right: -15px;
        bottom: 0;
        left: 31%;
        min-height: 100%;
        margin: 0;
        opacity: .58;
    }

    .mv-dt-hero__visual::before {
        background: linear-gradient(90deg, #f4f5f5 0%, rgba(244,245,245,.97) 30%, rgba(244,245,245,.62) 58%, rgba(244,245,245,.18) 82%, rgba(244,245,245,0) 100%);
    }

    .mv-dt-hero__visual img {
        min-height: 100%;
    }

    .mv-dt-trust__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .mv-dt-trust__item {
        justify-content: flex-start;
        border: 0;
    }

    .mv-dt-featured__panel,
    .mv-dt-guidance__grid {
        grid-template-columns: 1fr;
    }

    .mv-dt-featured__intro {
        border-right: 0;
        border-bottom: 1px solid var(--mv-border);
    }

    .mv-dt-guidance-links {
        position: static;
        width: auto;
        margin-top: 16px;
    }
}

@media (max-width: 560px) {
    .mv-dt-purpose__grid,
    .mv-dt-collections__grid,
    .mv-dt-campaign__grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .mv-dt-purpose-card {
        min-height: 190px;
    }

    .mv-dt-featured__grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .mv-dt-product-card:nth-child(3) {
        display: none;
    }

    .mv-dt-concierge__inner {
        gap: 20px;
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Purpose cards refinement */
.mv-dt-purpose__heading .mv-dt-eyebrow {
    gap: 10px;
}

.mv-dt-purpose__eyebrow-icon {
    display: inline-flex;
    width: 24px;
    height: 24px;
    align-items: center;
    justify-content: center;
    color: var(--mv-teal);
}

.mv-dt-purpose__eyebrow-icon .mv-department-icon {
    width: 22px;
    height: 22px;
    stroke-width: 1.6;
}

.mv-dt-purpose__heading h2 {
    font-size: clamp(1.3rem, 1.8vw, 1.6rem);
}

.mv-dt-purpose-card {
    padding: 28px 22px 20px;
}

.mv-dt-purpose-card__icon {
    width: 72px;
    height: 72px;
    margin-bottom: 18px;
}

.mv-dt-purpose-card__icon .mv-department-icon {
    width: 56px;
    height: 56px;
    stroke-width: 1.45;
}

.mv-dt-purpose-card strong {
    margin-bottom: 0px;
    font-size: 1.0rem;
    line-height: 1.0;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 10px;
}



/* Collections refinement */
.mv-dt-collections__heading .mv-dt-eyebrow{
 display:flex;gap:10px;justify-content:center;align-items:center;
}
.mv-dt-collections__eyebrow-icon{
 display:inline-flex;width:24px;height:24px;color:var(--mv-teal);
}
.mv-dt-collections__eyebrow-icon .mv-department-icon{
 width:22px;height:22px;stroke-width:1.6;
}
.mv-dt-collections__heading h2{
 font-size:clamp(1.3rem,1.8vw,1.6rem);
}

/* Featured products / reassurance strip refinement */
.mv-dt-trust__heading {
    gap: 10px;
    margin-bottom: 14px;
}

.mv-dt-trust__heading-icon {
    display: inline-flex;
    width: 26px;
    height: 26px;
    align-items: center;
    justify-content: center;
    color: var(--mv-teal);
}

.mv-dt-trust__heading-icon .mv-department-icon {
    width: 24px;
    height: 24px;
    stroke-width: 1.6;
}

.mv-dt-trust__item .mv-department-icon {
    width: 45px;
    height: 45px;
    stroke-width: 1.5;
}

.mv-dt-trust__item span {
    max-width: 165px;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.3;
}

/* Guidance / featured products refinement */
.mv-dt-featured__eyebrow {
    gap: 10px;
}

.mv-dt-featured__eyebrow-icon {
    display: inline-flex;
    width: 24px;
    height: 24px;
    align-items: center;
    justify-content: center;
    color: var(--mv-teal);
}

.mv-dt-featured__eyebrow-icon .mv-department-icon {
    width: 22px;
    height: 22px;
    stroke-width: 1.6;
}

.mv-dt-featured__intro h2 {
    font-size: 1.2rem;
}

.mv-dt-featured__intro .mv-dt-button .mv-icon--arrow,
.mv-dt-featured__intro .mv-dt-button svg {
    width: 1rem;
    height: 1rem;
    flex: 0 0 1rem;
}
.mv-dt-concierge .mv-icon--arrow,
.mv-dt-concierge svg {
    width: 1rem;
    height: 1rem;
    flex: 0 0 1rem;
}

.mv-dt-product-card__code {
    display: block;
    margin-top: 2px;
    color: var(--mv-muted);
    font-size: .67rem;
    line-height: 1.35;
}

.mv-dt-product-card__price {
    display: block;
    margin-top: 5px;
    color: var(--mv-navy);
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.3;
}

/* Guidance cards final refinement */
.mv-dt-guidance-card {
    isolation: isolate;
}

.mv-dt-guidance-card__eyebrow {
    position: relative;
    z-index: 3;
    display: flex;
    gap: 9px;
    align-items: center;
    margin-bottom: 9px;
}

.mv-dt-guidance-card__eyebrow-icon {
    display: inline-flex;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    align-items: center;
    justify-content: center;
    color: var(--mv-teal);
}

.mv-dt-guidance-card__eyebrow-icon .mv-department-icon {
    width: 22px;
    height: 22px;
    stroke-width: 1.6;
}

.mv-dt-guidance-card--guide {
    background:
        linear-gradient(
            90deg,
            #f4f9fd 0%,
            rgba(244,249,253,.98) 36%,
            rgba(244,249,253,.78) 53%,
            rgba(244,249,253,.18) 75%,
            rgba(244,249,253,0) 100%
        ),
        var(--mv-guidance-image, linear-gradient(110deg, #f4f9fd 0%, #eaf4fb 100%));
    background-position: center, right center;
    background-repeat: no-repeat;
    background-size: cover, auto 100%;
}

.mv-dt-guidance-card--guide::after {
    position: absolute;
    z-index: -1;
    inset: 0;
    content: "";
    background: linear-gradient(90deg, rgba(244,249,253,.98) 0 43%, transparent 78%);
    pointer-events: none;
}

.mv-dt-guidance-card--guide h2,
.mv-dt-guidance-card--guide > p:not(.mv-dt-eyebrow),
.mv-dt-guidance-card--guide .mv-dt-guidance-card__button {
    position: relative;
    z-index: 3;
    max-width: 54%;
}

.mv-dt-guidance-card h2 {
    padding-top: 0;
}

.mv-dt-guidance-card__button {
    display: inline-flex;
    gap: 9px;
    align-items: center;
}

.mv-dt-guidance-card__button .mv-icon--arrow,
.mv-dt-guidance-card__button svg,
.mv-dt-guidance-link__arrow .mv-icon--arrow,
.mv-dt-guidance-link__arrow svg {
    width: 1rem;
    height: 1rem;
    flex: 0 0 1rem;
}

.mv-dt-guidance-links a {
    gap: 10px;
}

.mv-dt-guidance-link__arrow {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
}

@media (max-width: 820px) {
    .mv-dt-guidance-card--guide {
        background:
            linear-gradient(90deg, #f4f9fd 0%, rgba(244,249,253,.96) 55%, rgba(244,249,253,.5) 100%),
            var(--mv-guidance-image, linear-gradient(110deg, #f4f9fd 0%, #eaf4fb 100%));
        background-position: center, right center;
        background-repeat: no-repeat;
        background-size: cover, auto 100%;
    }

    .mv-dt-guidance-card--guide h2,
    .mv-dt-guidance-card--guide > p:not(.mv-dt-eyebrow),
    .mv-dt-guidance-card--guide .mv-dt-guidance-card__button {
        max-width: 68%;
    }
}

@media (max-width: 560px) {
    .mv-dt-guidance-card--guide {
        background:
            linear-gradient(90deg, rgba(244,249,253,.98), rgba(244,249,253,.82)),
            var(--mv-guidance-image, linear-gradient(110deg, #f4f9fd 0%, #eaf4fb 100%));
        background-position: center, 72% center;
        background-size: cover, auto 100%;
    }

    .mv-dt-guidance-card--guide h2,
    .mv-dt-guidance-card--guide > p:not(.mv-dt-eyebrow),
    .mv-dt-guidance-card--guide .mv-dt-guidance-card__button {
        max-width: 100%;
    }
}



/* Guidance cards locked refinements */
.mv-dt-guidance-card > p:not(.mv-dt-eyebrow) {
    max-width: 270px;
    margin-bottom: 18px;
    font-size: .79rem;
    line-height: 1.65;
}

.mv-dt-guidance-links {
    position: absolute;
    top: 14px;
    right: 22px;
    width: 45%;
}

.mv-dt-guidance-card__eyebrow {
    padding-top: 5px;
}


/* Product grid lock */
.mv-dt-heading{
 display:flex;
 flex-direction:column;
 align-items:center;
}
.mv-dt-heading .mv-dt-eyebrow,
.mv-dt-heading-icon{
 display:inline-flex;
 align-items:center;
 justify-content:center;
}
.mv-dt-heading h2{
 font-size:clamp(1.0rem,2.2vw,1.4rem);
 font-weight:500;
 letter-spacing:-.025em;
}
.mv-dt-guidance-card h2,
.mv-dt-featured h2,
.mv-dt-concierge h2{
 font-weight:500;
}
.mv-dt-campaign-card img{
 max-width:100%;
 max-height:100%;
 width:100%;
 height:100%;
 object-fit:contain;
}
/* Concierge heading */

.mv-dt-concierge__eyebrow-icon {
    width: 38px;
    height: 38px;
}

.mv-dt-concierge__eyebrow-icon .mv-department-icon {
    width: 38px;
    height: 38px;
    stroke-width: 1.5;
}
/* Mindvision Editorial Experience v1.1 additions.
   Append this file to the end of mindvision-editorial-department.css. */

.mv-dt-purpose__grid {
    display: grid;
    grid-template-columns: repeat(var(--mv-purpose-columns, 3), minmax(0, 1fr));
    gap: 1.25rem;
}
.mv-dt-purpose-card { height: 100%; transition: transform .22s ease, box-shadow .22s ease; }
.mv-dt-purpose-card:hover { transform: translateY(-4px); }

.mv-dt-collection-card,
.mv-dt-product-card { transition: transform .22s ease, box-shadow .22s ease; }
.mv-dt-collection-card:hover,
.mv-dt-product-card:hover { transform: translateY(-4px); }
.mv-dt-collection-card__image { aspect-ratio: 4 / 3; overflow: hidden; }
.mv-dt-collection-card__image img,
.mv-dt-product-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.mv-dt-collection-card:hover img,
.mv-dt-product-card:hover img { transform: scale(1.035); }

.mv-dt-carousel { position: relative; min-width: 0; }
.mv-dt-featured__grid {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 4.5rem) / 5);
    gap: 1.125rem;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    scrollbar-width: none;
    padding: .35rem .15rem .75rem;
}
.mv-dt-featured__grid::-webkit-scrollbar { display: none; }
.mv-dt-product-card { scroll-snap-align: start; min-width: 0; }
.mv-dt-product-card > b { margin-top: auto; color: var(--mv-department-accent, #12bbb7); }
.mv-dt-carousel__button {
    position: absolute;
    z-index: 3;
    top: 50%;
    width: 2.75rem;
    height: 2.75rem;
    border: 0;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(39,56,74,.16);
    color: #27384a;
    font-size: 1.8rem;
    line-height: 1;
    transform: translateY(-50%);
}
.mv-dt-carousel__button--prev { left: -1.25rem; }
.mv-dt-carousel__button--next { right: -1.25rem; }
.mv-dt-carousel__button:hover { color: var(--mv-department-accent, #12bbb7); }

@media (max-width: 1199.98px) {
    .mv-dt-purpose__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mv-dt-featured__grid { grid-auto-columns: calc((100% - 2.25rem) / 3); }
}
@media (max-width: 767.98px) {
    .mv-dt-purpose__grid { grid-template-columns: 1fr; }
    .mv-dt-featured__grid { grid-auto-columns: minmax(78%, 1fr); }
    .mv-dt-carousel__button { display: none; }
    .mv-dt-hero__title-primary,
    .mv-dt-hero__title-secondary { text-wrap: balance; }
}
@media (prefers-reduced-motion: reduce) {
    .mv-dt-purpose-card,
    .mv-dt-collection-card,
    .mv-dt-product-card,
    .mv-dt-collection-card__image img,
    .mv-dt-product-card__image img { transition: none; }
}

/* ================================================================
   Mindvision Editorial Experience v1.1.1 stabilisation
   Locks arrow dimensions and restores reliable icon/text spacing.
   ================================================================ */

/* Shared CTA and inline-link spacing: never depend on HTML whitespace. */
.mv-editorial-department .mv-dt-button,
.mv-editorial-department .mv-dt-purpose-card b,
.mv-editorial-department .mv-dt-collection-card__label,
.mv-editorial-department .mv-dt-product-card > b,
.mv-editorial-department .mv-dt-guidance-links a,
.mv-editorial-department .mv-dt-campaign-card {
    gap: 10px !important;
    column-gap: 10px !important;
}

.mv-editorial-department .mv-dt-button {
    gap: 12px !important;
    column-gap: 12px !important;
}

/* Lock every editorial arrow so global SVG/icon rules cannot enlarge it. */
.mv-editorial-department .mv-icon--arrow,
.mv-editorial-department .mv-dt-button > svg,
.mv-editorial-department .mv-dt-purpose-card b > svg,
.mv-editorial-department .mv-dt-collection-card__label > svg,
.mv-editorial-department .mv-dt-product-card > b > svg,
.mv-editorial-department .mv-dt-guidance-links a > svg,
.mv-editorial-department .mv-dt-campaign-card > svg,
.mv-editorial-department .mv-dt-concierge .mv-dt-button > svg {
    display: inline-block !important;
    width: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
    height: 16px !important;
    min-height: 16px !important;
    max-height: 16px !important;
    flex: 0 0 16px !important;
    margin: 0 !important;
    font-size: 16px !important;
    line-height: 1 !important;
}

/* Slightly larger arrows are retained only on large campaign tiles. */
.mv-editorial-department .mv-dt-campaign-card > svg {
    width: 18px !important;
    min-width: 18px !important;
    max-width: 18px !important;
    height: 18px !important;
    min-height: 18px !important;
    max-height: 18px !important;
    flex-basis: 18px !important;
}

/* Structural spacing between confidence icons and their labels. */
.mv-editorial-department .mv-dt-trust__item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    column-gap: 12px !important;
}

.mv-editorial-department .mv-dt-trust__item .mv-department-icon {
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    flex: 0 0 30px !important;
    margin: 0 !important;
}

.mv-editorial-department .mv-dt-trust__item > span {
    display: block !important;
    margin: 0 !important;
}

/* Keep purpose and guidance icons independent of broad SVG rules. */
.mv-editorial-department .mv-dt-purpose-card__icon,
.mv-editorial-department .mv-dt-guidance-card__icon {
    flex: 0 0 auto !important;
}

.mv-editorial-department .mv-dt-purpose-card__icon .mv-department-icon {
    width: 31px !important;
    min-width: 31px !important;
    max-width: 31px !important;
    height: 31px !important;
    min-height: 31px !important;
    max-height: 31px !important;
}

/* Carousel controls use text chevrons, not content-link arrow sizing. */
.mv-editorial-department .mv-dt-carousel__button {
    font-size: 1.8rem !important;
}


/* ================================================================
   Mindvision Editorial Experience v1.2 — Editorial Design System
   Shared section headings, dependable icons and guidance indentation.
   ================================================================ */

/* Reusable section heading: icon and copy are separate layout columns. */
.mv-editorial-department .mv-dt-heading--with-icon {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 16px !important;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.mv-editorial-department .mv-dt-heading--with-icon .mv-dt-heading__icon,
.mv-editorial-department .mv-dt-featured__heading-icon,
.mv-editorial-department .mv-dt-trust__heading-icon,
.mv-editorial-department .mv-dt-concierge__icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    flex: 0 0 46px !important;
    border-radius: 50%;
    color: var(--mv-department-accent, #ffffff);
    background: var(--mv-department-accent-soft);
}

.mv-editorial-department .mv-dt-heading--with-icon .mv-department-icon,
.mv-editorial-department .mv-dt-featured__heading-icon .mv-department-icon,
.mv-editorial-department .mv-dt-trust__heading-icon .mv-department-icon,
.mv-editorial-department .mv-dt-concierge__icon .mv-department-icon {
    display: block !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
    margin: 0 !important;
}

.mv-editorial-department .mv-dt-heading__copy {
    min-width: 0;
}

.mv-editorial-department .mv-dt-heading--center .mv-dt-heading__copy {
    text-align: center;
}

/* Guidance cards: the icon gets its own column and can never cover text. */
.mv-editorial-department .mv-dt-guidance-card {
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) !important;
    column-gap: 18px !important;
    align-items: start !important;
}

.mv-editorial-department .mv-dt-guidance-card__icon {
    grid-column: 1 !important;
    grid-row: 1 !important;
    position: static !important;
    inset: auto !important;
    margin: 0 !important;
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
}

.mv-editorial-department .mv-dt-guidance-card__icon .mv-department-icon {
    width: 25px !important;
    min-width: 25px !important;
    max-width: 25px !important;
    height: 25px !important;
    min-height: 25px !important;
    max-height: 25px !important;
}

.mv-editorial-department .mv-dt-guidance-card__content {
    grid-column: 2 !important;
    min-width: 0;
}

.mv-editorial-department .mv-dt-guidance-card__content > :first-child {
    margin-top: 0 !important;
}

/* Recommendation heading uses the same icon/copy relationship. */
.mv-editorial-department .mv-dt-featured__heading {
    display: flex !important;
    align-items: flex-start !important;
    gap: 14px !important;
    margin-bottom: 1rem;
}

.mv-editorial-department .mv-dt-featured__heading h2,
.mv-editorial-department .mv-dt-featured__heading p {
    margin-left: 0 !important;
}

/* Trust heading remains compact while restoring its icon. */
.mv-editorial-department .mv-dt-trust__heading {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    margin-bottom: 1.25rem;
}

.mv-editorial-department .mv-dt-trust__heading-icon {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    flex-basis: 38px !important;
}

.mv-editorial-department .mv-dt-trust__heading-icon .mv-department-icon {
    width: 20px !important;
    min-width: 20px !important;
    max-width: 20px !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
}

.mv-editorial-department .mv-dt-trust__heading .mv-dt-eyebrow {
    margin: 0 !important;
}

/* Concierge heading/icon alignment. */
.mv-editorial-department .mv-dt-concierge__copy {
    display: flex !important;
    align-items: flex-start !important;
    gap: 16px !important;
    min-width: 0;
}

.mv-editorial-department .mv-dt-concierge__copy .mv-dt-eyebrow {
    margin-top: 0 !important;
}

@media (max-width: 767.98px) {
    .mv-editorial-department .mv-dt-heading--with-icon {
        gap: 12px !important;
    }

    .mv-editorial-department .mv-dt-heading--with-icon .mv-dt-heading__icon,
    .mv-editorial-department .mv-dt-featured__heading-icon,
    .mv-editorial-department .mv-dt-concierge__icon {
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        flex-basis: 40px !important;
    }

    .mv-editorial-department .mv-dt-guidance-card {
        grid-template-columns: 42px minmax(0, 1fr) !important;
        column-gap: 14px !important;
    }

    .mv-editorial-department .mv-dt-guidance-card__icon {
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
    }
}

/* ================================================================
   Mindvision Editorial Experience — Build 001
   Controlled live-page refinements for /category/drinkware
   ================================================================ */

/* Centre the shared heading icon and copy vertically. */
.mv-editorial-department .mv-dt-heading--with-icon {
    align-items: center !important;
    justify-content: center !important;
}

/* Keep carousel controls above cards and outside the clipped panel edge. */
.mv-editorial-department .mv-dt-featured__panel {
    overflow: visible;
}

.mv-editorial-department .mv-dt-carousel {
    position: relative;
    z-index: 5;
}

.mv-editorial-department .mv-dt-carousel__button {
    z-index: 50 !important;
    isolation: isolate;
}

.mv-editorial-department .mv-dt-carousel__button--next {
    right: -1.25rem;
}

/* Use the actual number of journey cards: six cards remain on one row,
   while four cards naturally expand to one quarter of the available width. */
@media (min-width: 1200px) {
    .mv-editorial-department .mv-dt-purpose__grid {
        grid-template-columns: repeat(var(--mv-purpose-columns, 6), minmax(0, 1fr)) !important;
        gap: 14px !important;
    }
}

/* Larger journey-card icons. */
.mv-editorial-department .mv-dt-purpose-card__icon .mv-department-icon {
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
}

/* Larger Buying Guide and Need Inspiration icons. */
.mv-editorial-department .mv-dt-guidance-card__icon {
    width: 60px !important;
    min-width: 60px !important;
    height: 60px !important;
}

.mv-editorial-department .mv-dt-guidance-card__icon .mv-department-icon {
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
}

.mv-editorial-department .mv-dt-guidance-card {
    grid-template-columns: 60px minmax(0, 1fr) !important;
}

/* Reserve the right-hand side of Need Inspiration for its link buttons,
   preventing the heading and introductory text from running underneath. */
@media (min-width: 821px) {
    .mv-editorial-department .mv-dt-guidance-card--ideas .mv-dt-guidance-card__content {
        padding-right: 50%;
    }

    .mv-editorial-department .mv-dt-guidance-card--ideas .mv-dt-guidance-card__content h2,
    .mv-editorial-department .mv-dt-guidance-card--ideas .mv-dt-guidance-card__content > p {
        max-width: 100%;
    }
}

@media (max-width: 820px) {
    .mv-editorial-department .mv-dt-guidance-card {
        grid-template-columns: 54px minmax(0, 1fr) !important;
    }

    .mv-editorial-department .mv-dt-guidance-card__icon {
        width: 54px !important;
        min-width: 54px !important;
        height: 54px !important;
    }

    .mv-editorial-department .mv-dt-guidance-card--ideas .mv-dt-guidance-card__content {
        padding-right: 0;
    }
}

/* Publishing Centre v1.3: reserve sufficient space for the right-hand links. */
@media (min-width: 821px) {
    .mv-editorial-department .mv-dt-guidance-card--ideas .mv-dt-guidance-card__content {
        padding-right: 60%;
    }
}

/* ================================================================
   Mindvision Publishing Centre v1.5 — catalogue and carousel fixes
   ================================================================ */

/* Make the four “What are you trying to achieve?” icons impossible for
   broad site SVG rules to hide or collapse. */
.mv-editorial-department .mv-dt-purpose-card__icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    min-height: 56px !important;
}
.mv-editorial-department .mv-dt-purpose-card__icon svg {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    stroke: currentColor !important;
    fill: none !important;
}

/* Five visible recommendations on wide screens, with every additional
   product remaining in the horizontal scroll. Flex sizing is used here to
   prevent older grid declarations from expanding all eight items at once. */
.mv-editorial-department .mv-dt-featured__grid {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 18px !important;
    overflow-x: auto !important;
    min-width: 0 !important;
}
.mv-editorial-department .mv-dt-featured__grid > .mv-dt-product-card {
    flex: 0 0 calc((100% - 72px) / 5) !important;
    width: calc((100% - 72px) / 5) !important;
    max-width: calc((100% - 72px) / 5) !important;
}
@media (max-width: 1199.98px) {
    .mv-editorial-department .mv-dt-featured__grid > .mv-dt-product-card {
        flex-basis: calc((100% - 36px) / 3) !important;
        width: calc((100% - 36px) / 3) !important;
        max-width: calc((100% - 36px) / 3) !important;
    }
}
@media (max-width: 767.98px) {
    .mv-editorial-department .mv-dt-featured__grid > .mv-dt-product-card {
        flex-basis: 82% !important;
        width: 82% !important;
        max-width: 82% !important;
    }
}

/* ================================================================
   Mindvision Publishing Centre v1.6 — production polish
   ================================================================ */

/* Catalogue photography is contained rather than cropped. The pale surround
   and very soft edge veil help supplier JPEGs with solid white backgrounds
   blend into the card without affecting transparent product artwork. */
.mv-editorial-department .mv-dt-collection-card__image,
.mv-editorial-department .mv-dt-product-card__image {
    position: relative;
    overflow: hidden;
    background: #f5f6f7;
}

.mv-editorial-department .mv-dt-collection-card__image img,
.mv-editorial-department .mv-dt-product-card__image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background-color: #fff;
    transition: transform .35s ease;
}

.mv-editorial-department .mv-dt-collection-card__image img {
    padding: 6px;
}

.mv-editorial-department .mv-dt-collection-card__image::after,
.mv-editorial-department .mv-dt-product-card__image::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background:
        linear-gradient(to right, rgba(245,246,247,.34), transparent 8%, transparent 92%, rgba(245,246,247,.34)),
        linear-gradient(to bottom, rgba(245,246,247,.34), transparent 8%, transparent 92%, rgba(245,246,247,.34));
}

.mv-editorial-department .mv-dt-collection-card:hover img,
.mv-editorial-department .mv-dt-product-card:hover img {
    transform: scale(1.035);
}


/* ================================================================
   Mindvision Publishing Centre v1.7 — catalogue intelligence polish
   ================================================================ */



/* Softer blend for collection and product photography. This intentionally
   replaces the stronger v1.6 edge veil while retaining contained imagery. */
.mv-editorial-department .mv-dt-collection-card__image,
.mv-editorial-department .mv-dt-product-card__image {
    position: relative;
    overflow: hidden;
    background: #f5f6f7;
    box-shadow: 1px 0 20px 0 #f5f6f7;
}

.mv-editorial-department .mv-dt-collection-card__image::after,
.mv-editorial-department .mv-dt-product-card__image::after {
    background:
        linear-gradient(to right, rgba(245,246,247,.20), transparent 5%, transparent 95%, rgba(245,246,247,.20)),
        linear-gradient(to bottom, rgba(245,246,247,.20), transparent 5%, transparent 95%, rgba(245,246,247,.20));
}

/* Complete Your Campaign images receive the same restrained blend. The
   pseudo-element fades white-background supplier images towards transparent
   at the card edge without blurring the product itself. */
.mv-editorial-department .mv-dt-campaign-card > span {
    position: relative;
    overflow: hidden;
    background: #f5f6f7;
    box-shadow: 1px 0 20px 0 #f5f6f7;
}

.mv-editorial-department .mv-dt-campaign-card > span::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background:
        linear-gradient(to right, rgba(245,246,247,.72), transparent 14%, transparent 86%, rgba(245,246,247,.72)),
        linear-gradient(to bottom, rgba(245,246,247,.58), transparent 14%, transparent 86%, rgba(245,246,247,.58));
}

.mv-editorial-department .mv-dt-campaign-card img {
    position: relative;
    z-index: 1;
    max-width: 92%;
    max-height: 82px;
    object-fit: contain;
}


/* ================================================================
   Mindvision Publishing Centre v1.7.1 — maintenance polish
   ================================================================ */

/* Guided Route icons use a dedicated class so broad site SVG rules cannot
   collapse or hide them during later template refinements. */
.mv-editorial-department .mv-dt-purpose-card__icon {
    position: relative;
    z-index: 2;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 58px !important;
    min-width: 58px !important;
    height: 58px !important;
    min-height: 58px !important;
    overflow: visible !important;
    color: var(--mv-primary, #12BBB7);
}

.mv-editorial-department .mv-dt-purpose-card__icon .mv-dt-route-icon {
    position: relative !important;
    z-index: 3 !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    overflow: visible !important;
    stroke: currentColor !important;
    stroke-width: 1.7 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    fill: none !important;
}

/* Softer white edge blend for Curated Collections and Mindvision Recommends. */
.mv-editorial-department .mv-dt-collection-card__image img,
.mv-editorial-department .mv-dt-product-card__image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background-color: #fff;
    transition: transform .35s ease;
    box-shadow: 0 0 20px 20px #fff;
}

/* The image shadow now provides the blend, so the older veil is disabled. */
.mv-editorial-department .mv-dt-collection-card__image::after,
.mv-editorial-department .mv-dt-product-card__image::after {
    display: none;
}



/* Complete Your Campaign favours a clear, readable crop rather than a veil. */
.mv-editorial-department .mv-dt-campaign-card > span::after {
    display: none;
}

.mv-editorial-department .mv-dt-campaign-card img {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    object-fit: cover;
}

/* ================================================================
   Mindvision Category Theme Engine RC1
   The department accent supplied by the category content now carries
   consistently through the full page rather than appearing only in the hero.
   ================================================================ */
.mv-editorial-department {
    --mv-teal: var(--mv-department-accent, #12bbb7);
    --mv-teal-bright: var(--mv-department-accent, #12bbb7);
    --mv-primary: var(--mv-department-accent, #12bbb7);
}

.mv-editorial-department .mv-dt-eyebrow,
.mv-editorial-department .mv-dt-hero__eyebrow-icon,
.mv-editorial-department .mv-dt-purpose__eyebrow-icon,
.mv-editorial-department .mv-dt-collections__eyebrow-icon,
.mv-editorial-department .mv-dt-featured__eyebrow-icon,
.mv-editorial-department .mv-dt-guidance-card__eyebrow-icon,
.mv-editorial-department .mv-dt-trust__heading-icon,
.mv-editorial-department .mv-dt-concierge__eyebrow-icon {
    color: var(--mv-department-accent, #12bbb7);
}

.mv-editorial-department .mv-dt-button--primary {
    color: var(--mv-department-accent-contrast, #fff);
    background: var(--mv-department-accent, #12bbb7);
    box-shadow: 0 10px 22px color-mix(in srgb, var(--mv-department-accent, #12bbb7) 28%, transparent);
}

/* Guided Route: the clearest expression of each department's identity. */
.mv-editorial-department .mv-dt-purpose-card,
.mv-editorial-department .mv-dt-purpose-card:nth-child(n) {
    color: var(--mv-department-accent-contrast, #fff);
    background: var(--mv-department-accent, #12bbb7);
    border-color: var(--mv-department-accent-dark, #0f9da1);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--mv-department-accent, #12bbb7) 16%, transparent);
}

.mv-editorial-department .mv-dt-purpose-card:hover {
    box-shadow: 0 15px 32px color-mix(in srgb, var(--mv-department-accent, #12bbb7) 25%, transparent);
}

.mv-editorial-department .mv-dt-purpose-card__icon,
.mv-editorial-department .mv-dt-purpose-card__icon .mv-dt-route-icon,
.mv-editorial-department .mv-dt-purpose-card strong,
.mv-editorial-department .mv-dt-purpose-card > span:not(.mv-dt-purpose-card__icon),
.mv-editorial-department .mv-dt-purpose-card b {
    color: var(--mv-department-accent-contrast, #fff) !important;
}

/* Curated collections and product recommendations retain white product space,
   with the category colour used for navigation and emphasis. */
.mv-editorial-department .mv-dt-collection-card,
.mv-editorial-department .mv-dt-product-card,
.mv-editorial-department .mv-dt-campaign-card {
    border-color: var(--mv-department-accent-soft, #dff7f6);
}

.mv-editorial-department .mv-dt-collection-card__label {
    border-top-color: var(--mv-department-accent-soft, #dff7f6);
    box-shadow: inset 0 3px 0 var(--mv-department-accent, #12bbb7);
}

.mv-editorial-department .mv-dt-collection-card__label svg,
.mv-editorial-department .mv-dt-campaign-card > svg,
.mv-editorial-department .mv-dt-product-card > b,
.mv-editorial-department .mv-dt-carousel__button:hover {
    color: var(--mv-department-accent, #12bbb7);
}

.mv-editorial-department .mv-dt-featured__panel {
    border-color: var(--mv-department-accent-soft, #dff7f6);
}

.mv-editorial-department .mv-dt-featured__intro {
    background: linear-gradient(135deg, var(--mv-department-accent-light, #eefafa), #fff 78%);
    border-right-color: var(--mv-department-accent-soft, #dff7f6);
}

.mv-editorial-department .mv-dt-product-card__tag {
    color: var(--mv-department-accent-contrast, #fff);
    background: var(--mv-department-accent, #12bbb7);
}

/* Buying guidance uses two levels of the same category palette. */
.mv-editorial-department .mv-dt-guidance-card--guide {
    background: linear-gradient(110deg, var(--mv-department-accent-light, #eefafa), #fff 100%);
    border-color: var(--mv-department-accent-soft, #dff7f6);
}

.mv-editorial-department .mv-dt-guidance-card--ideas {
    background: linear-gradient(110deg, var(--mv-department-accent-soft, #dff7f6), #fff 100%);
    border-color: var(--mv-department-accent-soft, #dff7f6);
}

.mv-editorial-department .mv-dt-guidance-card__button,
.mv-editorial-department .mv-dt-guidance-links a {
    border-color: var(--mv-department-accent-soft, #dff7f6);
}

.mv-editorial-department .mv-dt-guidance-card__button:hover,
.mv-editorial-department .mv-dt-guidance-links a:hover {
    color: var(--mv-department-accent-dark, #0f9da1);
    border-color: var(--mv-department-accent, #12bbb7);
}

/* Confidence and concierge moments close the page in the department colour. */
.mv-editorial-department .mv-dt-trust .mv-dt-shell {
    background: var(--mv-department-accent-light, #eefafa);
    border-color: var(--mv-department-accent-soft, #dff7f6);
}

.mv-editorial-department .mv-dt-trust__item {
    border-right-color: var(--mv-department-accent-soft, #dff7f6);
}

.mv-editorial-department .mv-dt-trust__item .mv-department-icon {
    color: var(--mv-department-accent, #12bbb7);
}

.mv-editorial-department .mv-dt-concierge {
    color: var(--mv-department-accent-contrast, #fff);
    background: linear-gradient(90deg, var(--mv-department-accent, #12bbb7), var(--mv-department-accent-dark, #0f9da1));
}

.mv-editorial-department .mv-dt-concierge h2,
.mv-editorial-department .mv-dt-concierge p,
.mv-editorial-department .mv-dt-concierge .mv-dt-eyebrow {
    color: var(--mv-department-accent-contrast, #fff);
}

@supports not (color: color-mix(in srgb, #000 50%, #fff)) {
    .mv-editorial-department .mv-dt-button--primary,
    .mv-editorial-department .mv-dt-purpose-card,
    .mv-editorial-department .mv-dt-purpose-card:nth-child(n) {
        box-shadow: 0 10px 24px rgba(9, 42, 85, .12);
    }
}
/* Font Awesome journey icons.
   Existing SVG icons remain supported during migration. */
.mv-editorial-department
.mv-dt-purpose-card__icon
.mv-department-icon.fa-solid,
.mv-editorial-department
.mv-dt-purpose-card__icon
.mv-department-icon.fa-regular {
    position: relative !important;
    z-index: 3 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;

    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;

    visibility: visible !important;
    opacity: 1 !important;

    font-size: 31px !important;
    line-height: 1 !important;

    color: currentColor !important;
}

/* Full department subcategory directory */
.mv-dt-subcategories {
    background: #fff;
}

.mv-dt-subcategories__grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 14px;
}

.mv-dt-subcategory-card {
    position: relative;
    display: flex;
    min-height: 92px;
    flex-direction: column;
    justify-content: center;
    padding: 18px 46px 18px 20px;
    border: 1px solid #e2e7eb;
    border-radius: 8px;
    background: #fff;
    color: #092a55;
    text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.mv-dt-subcategory-card:hover {
    transform: translateY(-2px);
    border-color: var(--mv-department-accent);
    box-shadow: 0 8px 22px rgba(9, 42, 85, .09);
    color: #092a55;
}

.mv-dt-subcategory-card__name {
    font-weight: 600;
    line-height: 1.3;
}

.mv-dt-subcategory-card__count {
    margin-top: 5px;
    color: #6b7785;
    font-size: 12px;
}

.mv-dt-subcategory-card__arrow {
    position: absolute;
    top: 50%;
    right: 18px;
    transform: translateY(-50%);
    color: var(--mv-department-accent);
}

@media (max-width: 1200px) {
    .mv-dt-subcategories__grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .mv-dt-subcategories__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .mv-dt-subcategory-card {
        min-height: 82px;
        padding: 15px 38px 15px 15px;
    }
}

@media (max-width: 480px) {
    .mv-dt-subcategories__grid {
        grid-template-columns: 1fr;
    }
}

/* Frozen representative images for department subcategories */
.mv-dt-subcategory-card.has-image {
    display: grid;
    grid-template-rows: auto 1fr;
    min-height: 0;
    padding: 0;
    overflow: hidden;
    border-radius: 10px;
    background: #fff;
}

.mv-dt-subcategory-card__image {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #f5f7f8;
}

.mv-dt-subcategory-card__image img {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    object-fit: cover;
    object-position: center;
    transition: transform .25s ease;
}

.mv-dt-subcategory-card.has-image:hover .mv-dt-subcategory-card__image img {
    transform: scale(1.025);
}

.mv-dt-subcategory-card.has-image .mv-dt-subcategory-card__name {
    display: block;
    padding: 17px 48px 0 20px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
}

.mv-dt-subcategory-card.has-image .mv-dt-subcategory-card__count {
    display: block;
    margin: 4px 0 0;
    padding: 0 48px 18px 20px;
    color: #6b7785;
    font-size: 13px;
}

.mv-dt-subcategory-card.has-image .mv-dt-subcategory-card__arrow {
    top: auto;
    right: 18px;
    bottom: 24px;
    transform: none;
}

@media (max-width: 767px) {
    .mv-dt-subcategory-card.has-image {
        min-height: 0;
        padding: 0;
    }

    .mv-dt-subcategory-card__image {
        height: auto;
        aspect-ratio: 1 / 1;
    }

    .mv-dt-subcategory-card.has-image .mv-dt-subcategory-card__name {
        padding: 15px 42px 0 15px;
    }

    .mv-dt-subcategory-card.has-image .mv-dt-subcategory-card__count {
        padding: 0 42px 15px 15px;
    }

    .mv-dt-subcategory-card.has-image .mv-dt-subcategory-card__arrow {
        right: 14px;
        bottom: 21px;
    }
}