/* Jiayi ceremonial gold campaign — opulent red products v3. */
:root {
    --jiayi-wine: #76161b;
    --jiayi-wine-deep: #4b090d;
    --jiayi-gold: #c6944a;
    --jiayi-gold-light: #ead7ad;
    --jiayi-ivory: #fffaf0;
    --jiayi-surface: #fffdf8;
    --jiayi-border: #e1d5c5;
}

.site-header--ceremonial {
    background: var(--jiayi-surface);
    color: var(--jiayi-wine);
    border-bottom: 1px solid var(--jiayi-border);
}

.site-header--ceremonial .site-header__inner {
    min-height: 76px;
}

.brand-link {
    min-height: 52px;
    display: inline-flex;
    align-items: center;
}

.brand-link img {
    width: 168px;
    height: auto;
}

.site-header--ceremonial .header-help {
    color: var(--jiayi-wine);
}

.theme-ceremonial-gold .checkout-steps .is-current {
    color: var(--jiayi-wine);
}

.theme-ceremonial-gold .checkout-steps .is-current .checkout-steps__number {
    border-color: var(--jiayi-wine);
    background: var(--jiayi-wine);
}

        .filter-defs {
            position: absolute;
            width: 0;
            height: 0;
            overflow: hidden;
        }

        .ceremonial-hero {
            --temple-red: #76120f;
            --temple-red-deep: #3b0605;
            --temple-red-rich: #8f1712;
            --gold-deep: #8f5c18;
            --gold: #c6944a;
            --gold-bright: #e4c56f;
            --gold-pale: #f7e5ae;
            --ivory: #fff3d6;
            --red: #a51d18;
            --red-deep: #6f100e;
            --page-width: 1480px;
            --ease-out: cubic-bezier(.2, .72, .2, 1);
            position: relative;
            isolation: isolate;
            min-height: 650px;
            overflow: hidden;
            border-bottom: 5px solid var(--gold-deep);
            background-color: var(--temple-red-deep);
            color: var(--ivory);
        }

        .hero__backdrop {
            position: absolute;
            z-index: -5;
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: 52% center;
            filter: saturate(.96) contrast(1.07) brightness(.8);
        }

        .ceremonial-hero::before {
            content: "";
            position: absolute;
            z-index: -4;
            inset: 0;
            background:
                linear-gradient(90deg, rgba(59, 6, 5, .9) 0%, rgba(118, 18, 15, .76) 34%, rgba(143, 23, 18, .26) 58%, rgba(36, 2, 2, .2) 100%),
                linear-gradient(180deg, rgba(37, 1, 1, .14) 0%, transparent 42%, rgba(33, 1, 1, .58) 100%);
        }

        .ceremonial-hero::after {
            content: "";
            position: absolute;
            z-index: 12;
            right: -16%;
            bottom: -88%;
            width: 86%;
            height: 116%;
            border-radius: 50%;
            background: radial-gradient(ellipse, rgba(255, 229, 123, .12) 0%, transparent 65%);
            pointer-events: none;
        }

        .hero__glimmer {
            position: absolute;
            z-index: 11;
            top: -30%;
            bottom: -30%;
            left: -38%;
            width: 16%;
            pointer-events: none;
            background: linear-gradient(90deg, transparent, rgba(255, 245, 201, .22), transparent);
            filter: blur(12px);
            opacity: 0;
            transform: skewX(-18deg);
            animation: ceremonial-glimmer 8s var(--ease-out) infinite 1.4s;
        }

        .hero__frame,
        .hero__frame::before,
        .hero__frame::after {
            position: absolute;
            pointer-events: none;
        }

        .hero__frame {
            z-index: 10;
            inset: 16px;
            border: 1px solid rgba(255, 232, 150, .76);
            box-shadow:
                inset 0 0 0 4px rgba(47, 23, 0, .38),
                inset 0 0 0 5px rgba(214, 169, 63, .34),
                0 0 0 1px rgba(82, 37, 0, .38);
        }

        .hero__frame::before {
            content: "";
            inset: 9px;
            border: 1px solid rgba(214, 169, 63, .3);
        }

        .hero__frame::after {
            content: "";
            top: -5px;
            left: 50%;
            width: 92px;
            height: 12px;
            border: 1px solid var(--gold-bright);
            background: linear-gradient(90deg, transparent 0 10%, var(--gold-deep) 10% 13%, var(--gold-bright) 13% 48%, var(--red) 48% 52%, var(--gold-bright) 52% 87%, var(--gold-deep) 87% 90%, transparent 90%);
            clip-path: polygon(0 50%, 14% 0, 43% 0, 50% 40%, 57% 0, 86% 0, 100% 50%, 86% 100%, 57% 100%, 50% 60%, 43% 100%, 14% 100%);
            transform: translateX(-50%);
        }

        .frame-corner {
            position: absolute;
            z-index: 13;
            width: 68px;
            height: 68px;
            pointer-events: none;
        }

        .frame-corner::before,
        .frame-corner::after {
            content: "";
            position: absolute;
            background: linear-gradient(90deg, var(--gold-deep), var(--gold-pale), var(--gold-deep));
            box-shadow: 0 0 8px rgba(255, 225, 112, .35);
        }

        .frame-corner::before { width: 62px; height: 3px; }
        .frame-corner::after { width: 3px; height: 62px; }
        .frame-corner--tl { top: 13px; left: 13px; }
        .frame-corner--tr { top: 13px; right: 13px; transform: scaleX(-1); }
        .frame-corner--bl { bottom: 13px; left: 13px; transform: scaleY(-1); }
        .frame-corner--br { right: 13px; bottom: 13px; transform: scale(-1); }
        .frame-corner::before,
        .frame-corner::after { top: 0; left: 0; }

        .hero__inner {
            position: relative;
            z-index: 2;
            width: min(calc(100% - 88px), var(--page-width));
            min-height: 650px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: minmax(430px, .82fr) minmax(720px, 1.38fr);
            align-items: stretch;
        }

        .hero__copy {
            position: relative;
            z-index: 6;
            align-self: center;
            padding: 54px 24px 54px 0;
        }

        .hero__plaque {
            position: relative;
            width: min(100%, 555px);
            padding: 48px 44px 44px;
            border: 1px solid rgba(246, 218, 125, .74);
            background:
                linear-gradient(135deg, rgba(118, 18, 15, .96), rgba(59, 6, 5, .98) 68%),
                var(--temple-red-deep);
            box-shadow:
                inset 0 0 0 5px rgba(49, 3, 3, .82),
                inset 0 0 0 6px rgba(198, 148, 74, .38),
                inset 0 0 45px rgba(24, 0, 0, .28),
                0 22px 52px rgba(35, 0, 0, .44);
            clip-path: polygon(18px 0, calc(100% - 18px) 0, 100% 18px, 100% calc(100% - 18px), calc(100% - 18px) 100%, 18px 100%, 0 calc(100% - 18px), 0 18px);
        }

        .hero__plaque::before,
        .hero__plaque::after {
            content: "";
            position: absolute;
            pointer-events: none;
        }

        .hero__plaque::before {
            inset: 14px;
            border: 1px solid rgba(214, 169, 63, .26);
            clip-path: polygon(10px 0, calc(100% - 10px) 0, 100% 10px, 100% calc(100% - 10px), calc(100% - 10px) 100%, 10px 100%, 0 calc(100% - 10px), 0 10px);
        }

        .hero__plaque::after {
            top: -11px;
            left: 50%;
            width: 148px;
            height: 22px;
            border: 1px solid var(--gold-bright);
            background: linear-gradient(90deg, var(--gold-deep), var(--gold-pale) 45%, var(--red) 45% 55%, var(--gold-pale) 55%, var(--gold-deep));
            clip-path: polygon(0 50%, 18% 0, 40% 0, 50% 46%, 60% 0, 82% 0, 100% 50%, 82% 100%, 60% 100%, 50% 54%, 40% 100%, 18% 100%);
            transform: translateX(-50%);
            box-shadow: 0 2px 14px rgba(255, 216, 92, .2);
        }

        .hero__eyebrow {
            position: relative;
            margin: 0 0 17px;
            display: flex;
            align-items: center;
            gap: 14px;
            color: var(--gold-bright);
            font-size: 14px;
            font-weight: 700;
            letter-spacing: .32em;
        }

        .hero__eyebrow::before,
        .hero__eyebrow::after {
            content: "";
            height: 1px;
            background: linear-gradient(90deg, transparent, var(--gold-bright));
        }

        .hero__eyebrow::before { width: 34px; }
        .hero__eyebrow::after {
            width: 68px;
            background: linear-gradient(90deg, var(--gold-bright), transparent);
        }

        .hero__heading {
            position: relative;
            margin: 0;
            padding-bottom: 26px;
            display: flex;
            align-items: center;
            gap: 20px;
        }

        .hero__heading::after {
            content: "";
            position: absolute;
            bottom: 0;
            left: 0;
            width: min(100%, 388px);
            height: 5px;
            background:
                radial-gradient(circle at 50%, var(--red) 0 3px, transparent 4px),
                linear-gradient(90deg, transparent, var(--gold-deep) 10%, var(--gold-bright) 35% 65%, var(--gold-deep) 90%, transparent);
            background-repeat: no-repeat;
            background-size: 15px 5px, 100% 1px;
            background-position: center, center;
        }

        .hero__title {
            position: relative;
            color: var(--gold-bright);
            background: linear-gradient(180deg, #fff3b7 2%, #e9c461 34%, #fff0a2 52%, #b97e1f 82%, #f2d67a 100%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            font-family: "DFKai-SB", "BiauKai", "Noto Serif TC", serif;
            font-size: clamp(68px, 5.25vw, 90px);
            font-weight: 700;
            line-height: .98;
            letter-spacing: .035em;
            filter: drop-shadow(0 3px 0 rgba(75, 35, 0, .64)) drop-shadow(0 9px 18px rgba(0, 0, 0, .28));
            text-wrap: pretty;
            white-space: nowrap;
        }

        .hero__seal {
            position: relative;
            width: 76px;
            height: 76px;
            flex: 0 0 76px;
            display: grid;
            place-items: center;
            border: 2px solid var(--gold-pale);
            background:
                linear-gradient(135deg, rgba(255, 255, 255, .08), transparent 45%),
                var(--red);
            color: var(--ivory);
            font-family: "DFKai-SB", "BiauKai", serif;
            font-size: 23px;
            line-height: 1.05;
            letter-spacing: .14em;
            box-shadow:
                inset 0 0 0 4px var(--red),
                inset 0 0 0 5px rgba(255, 244, 216, .68),
                inset 0 0 22px rgba(80, 0, 0, .22),
                0 10px 24px rgba(0, 0, 0, .34);
            transform: rotate(-5deg);
        }

        .hero__seal::after {
            content: "";
            position: absolute;
            inset: 8px;
            border: 1px solid rgba(255, 241, 183, .52);
        }

        .hero__seal span { transform: translateX(2px); }

        .hero__lead {
            margin: 24px 0 0;
            color: var(--ivory);
            font-family: "DFKai-SB", "BiauKai", "Noto Serif TC", serif;
            font-size: clamp(22px, 1.9vw, 27px);
            font-weight: 600;
            letter-spacing: .16em;
            text-shadow: 0 2px 9px rgba(0, 0, 0, .44);
            text-wrap: pretty;
        }

        .hero__action {
            min-height: 50px;
            margin-top: 30px;
            padding: 12px 24px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 18px;
            border: 1px solid var(--gold-pale);
            border-radius: 2px;
            background: linear-gradient(180deg, #fff0ad 0%, #d9ad43 100%);
            color: var(--temple-red-deep);
            font-weight: 800;
            letter-spacing: .04em;
            text-decoration: none;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, .66), 0 12px 28px rgba(0, 0, 0, .3);
            transition: color 180ms var(--ease-out), background 180ms var(--ease-out), transform 180ms var(--ease-out), box-shadow 180ms var(--ease-out);
        }

        .hero__action span {
            width: 25px;
            height: 25px;
            display: inline-grid;
            place-items: center;
            border: 1px solid rgba(59, 6, 5, .56);
            border-radius: 50%;
            font-family: Georgia, serif;
            font-size: 17px;
            line-height: 1;
            transition: transform 180ms var(--ease-out);
        }

        .hero__action:hover {
            background: linear-gradient(180deg, #fff6cd 0%, #edcc70 100%);
            transform: translateY(-3px);
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75), 0 17px 34px rgba(0, 0, 0, .34);
        }

        .hero__action:hover span { transform: translateX(3px); }
        .hero__action:active { transform: translateY(0); }

        .hero__stage {
            position: relative;
            min-width: 0;
            min-height: 650px;
        }

        .hero__stage::after {
            content: "";
            position: absolute;
            z-index: 1;
            right: 0;
            bottom: 31px;
            width: min(49vw, 710px);
            height: 46px;
            border-radius: 50%;
            background: rgba(36, 0, 0, .66);
            filter: blur(16px);
        }

        .hero__product-aura {
            position: absolute;
            z-index: 2;
            top: 50%;
            right: -1%;
            width: min(52vw, 760px);
            aspect-ratio: 1.2;
            border: 2px solid rgba(243, 218, 125, .76);
            border-radius: 50%;
            background:
                radial-gradient(ellipse at 52% 46%, rgba(143, 23, 18, .98) 0%, rgba(90, 11, 8, .99) 52%, rgba(38, 2, 2, .99) 76%),
                var(--temple-red-deep);
            box-shadow:
                inset 0 0 0 9px rgba(47, 3, 3, .8),
                inset 0 0 0 11px rgba(198, 148, 74, .38),
                inset 0 0 86px rgba(20, 0, 0, .58),
                0 0 0 8px rgba(55, 4, 4, .58),
                0 0 0 10px rgba(198, 148, 74, .28),
                0 18px 58px rgba(30, 0, 0, .62),
                0 0 84px rgba(228, 197, 111, .22);
            transform: translateY(-50%);
        }

        .hero__product-aura::before,
        .hero__product-aura::after {
            content: "";
            position: absolute;
            pointer-events: none;
        }

        .hero__product-aura::before {
            inset: 26px;
            border: 1px solid rgba(243, 218, 125, .34);
            border-radius: 50%;
            background:
                radial-gradient(circle at 50% 50%, rgba(255, 234, 145, .14), transparent 62%),
                repeating-conic-gradient(from 0deg, rgba(246, 218, 122, .16) 0deg 1deg, transparent 1deg 15deg);
            opacity: .8;
        }

        .hero__product-aura::after {
            inset: 8% 12%;
            border-radius: 50%;
            background: radial-gradient(ellipse, rgba(255, 236, 151, .22), transparent 68%);
        }

        .stage-ornament {
            position: absolute;
            z-index: 4;
            right: 1%;
            bottom: 27px;
            width: min(49vw, 710px);
            height: 24px;
            border-top: 2px solid rgba(255, 226, 122, .68);
            background: linear-gradient(90deg, transparent, rgba(100, 43, 0, .72) 18%, rgba(237, 191, 74, .2) 50%, rgba(100, 43, 0, .72) 82%, transparent);
            clip-path: polygon(0 45%, 9% 0, 33% 36%, 50% 0, 67% 36%, 91% 0, 100% 45%, 91% 100%, 50% 52%, 9% 100%);
        }

        .gold-product {
            position: absolute;
            z-index: 6;
            margin: 0;
            transform-origin: 50% 70%;
            transition: transform 220ms var(--ease-out);
        }

        .gold-product img {
            display: block;
            width: 100%;
            height: auto;
            object-fit: contain;
            filter: url(#knockout-white);
        }

        .gold-product--main { --product-mask: url("../assets/jiayi-brand/hero-mask-main-v1.png"); }
        .gold-product--wealth { --product-mask: url("../assets/jiayi-brand/hero-mask-wealth-v1.png"); }
        .gold-product--peach { --product-mask: url("../assets/jiayi-brand/hero-mask-peach-v1.png"); }

@supports ((-webkit-mask-image: linear-gradient(#000, #000)) or (mask-image: linear-gradient(#000, #000))) {
    .gold-product img {
        filter: none;
        -webkit-mask-image: var(--product-mask);
        mask-image: var(--product-mask);
        -webkit-mask-position: 0 0;
        mask-position: 0 0;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-size: 100% 100%;
        mask-size: 100% 100%;
        -webkit-mask-mode: alpha;
        mask-mode: alpha;
    }
}

        .gold-product--main {
            z-index: 9;
            top: 73px;
            right: -2%;
            width: min(50vw, 720px);
            height: auto;
            aspect-ratio: 1024 / 680;
            transform: rotate(.25deg);
        }

        .gold-product--wealth {
            z-index: 7;
            top: 35px;
            left: -1%;
            width: 224px;
            height: auto;
            aspect-ratio: 1024 / 680;
            border: 1px solid rgba(243, 218, 125, .55);
            border-radius: 50%;
            overflow: hidden;
            background: radial-gradient(circle, rgba(143, 23, 18, .96), rgba(59, 6, 5, .98) 72%);
            box-shadow: inset 0 0 0 5px rgba(49, 3, 3, .78), 0 12px 30px rgba(30, 0, 0, .54);
            transform: rotate(-6deg);
        }

        .gold-product--peach {
            z-index: 7;
            bottom: 44px;
            left: 2%;
            width: 200px;
            height: auto;
            aspect-ratio: 1024 / 680;
            border: 1px solid rgba(243, 218, 125, .5);
            border-radius: 50%;
            overflow: hidden;
            background: radial-gradient(circle, rgba(143, 23, 18, .96), rgba(59, 6, 5, .98) 72%);
            box-shadow: inset 0 0 0 5px rgba(49, 3, 3, .78), 0 12px 30px rgba(30, 0, 0, .54);
            transform: rotate(7deg);
        }

        .hero__stage:hover .gold-product--main {
            transform: rotate(0deg) translateY(-5px) scale(1.01);
        }

        .hero__stage:hover .gold-product--wealth { transform: rotate(-4deg) translateY(-2px); }
        .hero__stage:hover .gold-product--peach { transform: rotate(5deg) translateY(-2px); }


#catalog-title { scroll-margin-top: 24px; }

        @keyframes ceremonial-glimmer {
            0%, 13% { left: -38%; opacity: 0; }
            18% { opacity: .72; }
            38% { left: 116%; opacity: 0; }
            100% { left: 116%; opacity: 0; }
        }

        @media (max-width: 1240px) {
            .hero__inner {
                grid-template-columns: minmax(360px, .8fr) minmax(0, 1.2fr);
            }

            .hero__plaque { width: 100%; padding-right: 32px; padding-left: 32px; }
            .hero__heading { gap: 14px; }
            .hero__title { font-size: clamp(54px, 5vw, 66px); }
            .hero__seal { width: 58px; height: 58px; flex-basis: 58px; font-size: 18px; }
            .hero__product-aura { right: -4%; width: 590px; }
            .gold-product--main { top: 110px; right: -4%; width: 550px; height: auto; }
            .gold-product--wealth { top: 45px; left: -1%; width: 150px; }
            .gold-product--peach { bottom: 52px; left: 0; width: 145px; }
        }

        @media (max-width: 1080px) {
            .ceremonial-hero { min-height: 920px; }

            .hero__backdrop {
                object-position: 62% center;
                filter: saturate(.92) contrast(1.08) brightness(.72);
            }

            .ceremonial-hero::before {
                background:
                    linear-gradient(180deg, rgba(59, 6, 5, .94) 0%, rgba(118, 18, 15, .8) 43%, rgba(91, 10, 8, .3) 68%, rgba(35, 1, 1, .62) 100%),
                    linear-gradient(90deg, rgba(143, 23, 18, .3), rgba(59, 6, 5, .1) 64%);
            }

            .hero__frame { inset: 12px; }
            .frame-corner { width: 54px; height: 54px; }
            .frame-corner::before { width: 48px; }
            .frame-corner::after { height: 48px; }

            .hero__inner {
                width: min(calc(100% - 44px), 760px);
                min-height: 920px;
                grid-template-columns: 1fr;
                grid-template-rows: auto 485px;
            }

            .hero__copy {
                padding: 50px 22px 4px;
                text-align: center;
            }

            .hero__plaque {
                width: min(100%, 590px);
                margin: 0 auto;
                padding: 40px 34px 36px;
                background: linear-gradient(145deg, rgba(118, 18, 15, .97), rgba(59, 6, 5, .98) 72%);
            }

            .hero__eyebrow,
            .hero__heading { justify-content: center; }

            .hero__heading::after {
                left: 50%;
                transform: translateX(-50%);
            }

            .hero__action { margin-top: 25px; }
            .hero__stage { min-height: 485px; }

            .hero__product-aura {
                top: 50%;
                right: 50%;
                width: 570px;
                transform: translate(50%, -50%);
            }

            .hero__stage::after {
                right: 50%;
                bottom: 21px;
                width: 510px;
                transform: translateX(50%);
            }

            .stage-ornament {
                right: 50%;
                bottom: 26px;
                width: 520px;
                transform: translateX(50%);
            }

            .gold-product--main {
                top: 47px;
                right: 50%;
                width: 540px;
                height: auto;
                transform: translateX(50%) rotate(.2deg);
            }

            .gold-product--wealth {
                top: 35px;
                left: 0;
                width: 176px;
                height: auto;
            }

            .gold-product--peach {
                right: 0;
                bottom: 23px;
                left: auto;
                width: 166px;
                height: auto;
            }

            .hero__stage:hover .gold-product--main {
                transform: translateX(50%) rotate(0deg) translateY(-4px) scale(1.008);
            }
        }

        @media (max-width: 620px) {
            .ceremonial-hero { min-height: 850px; }

            .hero__backdrop {
                object-position: center;
                filter: saturate(1.06) contrast(1.04) brightness(.68);
            }

            .hero__frame { inset: 8px; }
            .hero__frame::before { inset: 6px; }
            .frame-corner { display: none; }

            .hero__inner {
                width: calc(100% - 24px);
                min-height: 850px;
                grid-template-rows: auto 385px;
            }

            .hero__copy { padding: 38px 6px 0; }

            .hero__plaque {
                padding: 34px 18px 30px;
                clip-path: polygon(13px 0, calc(100% - 13px) 0, 100% 13px, 100% calc(100% - 13px), calc(100% - 13px) 100%, 13px 100%, 0 calc(100% - 13px), 0 13px);
            }

            .hero__plaque::before { inset: 10px; }
            .hero__plaque::after { width: 116px; height: 18px; }

            .hero__eyebrow {
                margin-bottom: 13px;
                gap: 8px;
                font-size: 12px;
                letter-spacing: .2em;
            }

            .hero__eyebrow::before,
            .hero__eyebrow::after { width: 25px; }

            .hero__heading {
                gap: 13px;
                padding-bottom: 20px;
            }

            .hero__title {
                font-size: clamp(43px, 13.3vw, 58px);
                letter-spacing: .015em;
            }

            .hero__seal {
                width: 56px;
                height: 56px;
                flex-basis: 56px;
                font-size: 17px;
            }

            .hero__lead {
                margin-top: 19px;
                font-size: 18px;
                letter-spacing: .09em;
            }

            .hero__action {
                width: min(100%, 250px);
                min-height: 48px;
                margin-top: 21px;
            }

            .hero__stage { min-height: 385px; }

            .hero__product-aura {
                width: min(94vw, 368px);
                aspect-ratio: 1.08;
            }

            .hero__stage::after {
                bottom: 13px;
                width: 330px;
            }

            .stage-ornament {
                bottom: 16px;
                width: 338px;
            }

            .gold-product--main {
                top: 67px;
                width: min(90vw, 340px);
                height: auto;
            }

            .gold-product--wealth {
                top: 35px;
                left: -2%;
                width: 106px;
                height: auto;
            }

            .gold-product--peach {
                right: -2%;
                bottom: 24px;
                width: 108px;
                height: auto;
            }
        }

        @media (max-width: 380px) {
            .hero__copy { padding-top: 32px; }
            .hero__title { font-size: 43px; }
            .hero__seal { width: 52px; height: 52px; flex-basis: 52px; }
        }

@media (max-width: 760px) {
    .site-header--ceremonial .site-header__inner { min-height: 64px; }
    .brand-link img { width: 132px; }
}

@media (max-width: 390px) {
    .site-header--ceremonial .site-header__inner { gap: 12px; }
    .brand-link img { width: 124px; }
    .site-header--ceremonial .header-help {
        display: inline;
        flex: 0 0 auto;
        font-size: 12px;
        white-space: nowrap;
    }
}

@media (max-width: 340px) {
    .brand-link img { width: 110px; }
    .site-header--ceremonial .header-help { font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
    .hero__glimmer { animation: none; }
}