/* site palette */
html:root {
    --bg: #0C151C;
    --surface: #152532;
    --surface-alt: #101D26;
    --text: #F2F4F5;
    --text-muted: #B0B9BF;
    --border: #2F3840;
    --primary: #EFB454;
    --primary-hover: #ECA42F;
    --on-primary: #111111;
    --primary-text: #EFB454;
    --accent: #4F82CA;
    --on-accent: #111111;
    --accent-text: #6793D1;
    --dark-band: #070B0E;
    --on-dark: #FFFFFF;
    --on-dark-muted: #B6BEC3;
    --brand-btn-bg: #111111;
    --brand-btn-text: #EFB454;
    --section-alt-bg: linear-gradient(199deg, #102635 0%, #10212D 50%, #101D26 100%);
    --dark-band-bg: linear-gradient(199deg, #091823 0%, #081118 50%, #070B0E 100%);
    --brand-band-bg: #EFB454;
    --hero-bg: linear-gradient(199deg, #082031 0%, #0B1A26 50%, #0C151C 100%);
    --on-hero: #F2F4F5;
    --footer-bg: linear-gradient(199deg, #091823 0%, #081118 50%, #070B0E 100%);
    --on-footer: #FFFFFF;
    --on-footer-muted: #B6BEC3;
}

/* /site palette */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: 'Onest', sans-serif;
    background-color: var(--bg, #0C151C);
    color: var(--text, #F2F4F5);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

.text-muted {
    color: var(--text-muted, #B0B9BF) !important;
}

.ef-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--primary, #EFB454);
    color: var(--on-primary, #111111);
    font-weight: 700;
    font-size: 0.95rem;
    padding: 0.75rem 1.5rem;
    border-radius: 4px;
    border: none;
    cursor: pointer;
    text-decoration: none;
    transition: all 300ms cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: 0 0 14px rgba(239, 180, 84, 0.45);
}

.ef-btn:hover {
    background-color: var(--primary-hover, #ECA42F);
    color: var(--on-primary, #111111);
    box-shadow: 0 0 24px rgba(239, 180, 84, 0.75), 0 0 8px rgba(239, 180, 84, 1);
    transform: translateY(-1px);
}

.ef-btn-alt {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    color: var(--primary-text, #EFB454);
    font-weight: 600;
    font-size: 0.95rem;
    padding: 0.75rem 1.5rem;
    border-radius: 4px;
    border: 1px solid var(--border, #2F3840);
    cursor: pointer;
    text-decoration: none;
    transition: all 300ms cubic-bezier(0.16, 1, 0.3, 1);
}

.ef-btn-alt:hover {
    background-color: var(--surface, #152532);
    border-color: var(--primary, #EFB454);
    color: var(--primary, #EFB454);
}

.ef-card {
    display: flex;
    flex-direction: column;
    background-color: var(--surface, #152532);
    color: var(--text, #F2F4F5);
    border: 1px solid var(--border, #2F3840);
    border-radius: 6px;
    padding: 1.25rem;
    box-shadow: none;
    transition: all 300ms cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
}

@media (min-width: 768px) {
    .ef-card {
        padding: 1.5rem;
    }
}

.ef-card:hover {
    border-color: var(--accent, #4F82CA);
    transform: translateY(-2px);
}

.ef-card .ef-btn,
.ef-card .ef-btn-alt {
    margin-top: auto;
}

.ef-media {
    width: 100%;
    aspect-ratio: 1 / 1;
    flex-shrink: 0;
    border-radius: 4px;
    border: 1px solid var(--border, #2F3840);
    overflow: hidden;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle, rgba(239, 180, 84, 0.12) 0%, rgba(21, 37, 50, 0) 70%);
}

.ef-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ef-eyebrow {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--primary-text, #EFB454);
    margin-bottom: 0.5rem;
}

.ef-title {
    font-size: clamp(1.875rem, 3.5vw, 2.75rem);
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--text, #F2F4F5);
    text-align: center;
    text-shadow: 0 0 20px rgba(239, 180, 84, 0.25);
}

.ef-badge {
    display: inline-flex;
    align-items: center;
    background-color: var(--primary, #EFB454);
    color: var(--on-primary, #111111);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 0.25rem 0.5rem;
    border-radius: 0px;
    box-shadow: 0 0 8px rgba(239, 180, 84, 0.4);
}

.ef-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 4px;
    background-color: var(--surface-alt, #101D26);
    color: var(--primary, #EFB454);
    border: 1px solid var(--border, #2F3840);
    flex-shrink: 0;
}

.ef-section {
    background-color: var(--bg, #0C151C);
    padding-top: clamp(4.5rem, 7vw, 7.5rem);
    padding-bottom: clamp(4.5rem, 7vw, 7.5rem);
}

.ef-section-alt {
    background: var(--section-alt-bg, #101D26);
    padding-top: clamp(4.5rem, 7vw, 7.5rem);
    padding-bottom: clamp(4.5rem, 7vw, 7.5rem);
}

.ef-section-dark {
    background: var(--dark-band-bg, #070B0E);
    color: var(--on-dark, #FFFFFF);
    padding-top: clamp(4.5rem, 7vw, 7.5rem);
    padding-bottom: clamp(4.5rem, 7vw, 7.5rem);
}

.ef-section-brand {
    background-color: var(--brand-band-bg, #EFB454);
    color: var(--on-primary, #111111);
    padding-top: clamp(4.5rem, 7vw, 7.5rem);
    padding-bottom: clamp(4.5rem, 7vw, 7.5rem);
}

.ef-section-brand .ef-btn {
    background-color: var(--brand-btn-bg, #111111);
    color: var(--brand-btn-text, #EFB454);
    box-shadow: 0 0 16px rgba(17, 17, 17, 0.8);
}

.ef-section-brand .ef-btn-alt {
    border-color: var(--on-primary, #111111);
    color: var(--on-primary, #111111);
}

.ef-section-dark,
.ef-on-dark {
    color: var(--on-dark, #FFFFFF);
}

.ef-section-dark h1,
.ef-section-dark h2,
.ef-section-dark h3,
.ef-section-dark .ef-title,
.ef-on-dark h1,
.ef-on-dark h2,
.ef-on-dark h3,
.ef-on-dark .ef-title {
    color: var(--on-dark, #FFFFFF);
}

.ef-section-dark .ef-eyebrow,
.ef-on-dark .ef-eyebrow {
    color: var(--primary, #EFB454);
}

.ef-section-dark p,
.ef-on-dark p {
    color: var(--on-dark-muted, #B6BEC3);
}

.ef-section-dark .ef-btn-alt,
.ef-on-dark .ef-btn-alt {
    border-color: var(--on-dark, #FFFFFF);
    color: var(--on-dark, #FFFFFF);
}

.ef-section-dark .ef-card,
.ef-on-dark .ef-card {
    background-color: var(--surface, #152532);
    color: var(--text, #F2F4F5);
    border-color: var(--border, #2F3840);
}

.ef-section-dark .ef-card p,
.ef-on-dark .ef-card p {
    color: var(--text-muted, #B0B9BF);
}

/* ===== header ===== */
.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    width: 100%;
    background-color: #0C151C;
    border-bottom: 1px solid #2F3840;
}

.site-header .h-18 {
    height: 4.5rem;
}

@media (max-width: 767px) {
    .site-header #js-mobile-nav-menu {
        background-color: #0C151C;
    }
}

/* ===== hero ===== */
.hero-section {
    position: relative;
    background: var(--hero-bg);
    color: var(--on-hero);
}

.hero-section .hero-radial-glow {
    background: radial-gradient(circle, rgba(239, 180, 84, 0.16) 0%, rgba(79, 130, 202, 0.08) 45%, rgba(12, 21, 28, 0) 70%);
}

.hero-section .hero-accent-text {
    color: var(--primary-text);
    text-shadow: 0 0 24px rgba(239, 180, 84, 0.35);
}

.hero-section .hero-primary-btn {
    box-shadow: 0 0 16px rgba(239, 180, 84, 0.45);
}

.hero-section .hero-primary-btn:hover {
    box-shadow: 0 0 24px rgba(239, 180, 84, 0.75);
}

@media (max-width: 767px) {
    .hero-section {
        min-height: auto;
    }
}

/* ===== new-arrivals ===== */
.ef-section .ef-card {
    min-height: 100%;
}

.ef-section .ef-card:hover {
    transform: translateY(-3px);
}

/* ===== deadline-promotions ===== */
.deadline-promos .promo-glow-text {
    text-shadow: 0 0 20px rgba(239, 180, 84, 0.25);
}

.deadline-promos .promo-stage {
    background: radial-gradient(circle, rgba(239, 180, 84, 0.12) 0%, rgba(21, 37, 50, 0.4) 70%);
}

.deadline-promos .promo-card {
    will-change: transform, border-color;
}

.deadline-promos .promo-card:hover {
    box-shadow: 0 8px 24px -6px rgba(0, 0, 0, 0.45);
}

.deadline-promos .addToCartBtn {
    box-shadow: 0 0 14px rgba(239, 180, 84, 0.35);
}

.deadline-promos .addToCartBtn:hover {
    box-shadow: 0 0 22px rgba(239, 180, 84, 0.65);
}

@media (max-width: 767px) {
    .deadline-promos .promo-card {
        margin-bottom: 0.5rem;
    }
}

/* ===== discount-subscription ===== */
.lab-discount-sub {
    position: relative;
}

.lab-discount-sub .lab-sub-radial-glow {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 480px;
    max-width: 90vw;
    height: 480px;
    background: radial-gradient(circle, rgba(239, 180, 84, 0.15) 0%, rgba(79, 130, 202, 0.08) 45%, rgba(7, 11, 14, 0) 70%);
    filter: blur(40px);
    pointer-events: none;
    z-index: 1;
}

.lab-discount-sub .lab-glow-text {
    color: #EFB454;
    text-shadow: 0 0 20px rgba(239, 180, 84, 0.45);
}

.lab-discount-sub .lab-input::placeholder {
    color: #838F98;
    opacity: 1;
}

.lab-discount-sub .lab-input:focus {
    border-color: #EFB454;
    box-shadow: 0 0 10px rgba(239, 180, 84, 0.3);
}

.lab-discount-sub .ef-btn {
    box-shadow: 0 0 14px rgba(239, 180, 84, 0.45);
}

.lab-discount-sub .ef-btn:hover {
    box-shadow: 0 0 22px rgba(239, 180, 84, 0.7);
}

.lab-discount-sub .lab-checkbox {
    accent-color: #EFB454;
}

@media (max-width: 767px) {
    .lab-discount-sub .lab-sub-form {
        width: 100%;
    }
}

/* ===== customer-qa ===== */
.customer-qa-block {
    background-color: var(--bg, #0C151C);
}

.customer-qa-block .js-qa-item.is-open {
    border-color: #EFB454;
}

.customer-qa-block .js-qa-item.is-open .js-qa-icon {
    transform: rotate(180deg);
    background-color: #EFB454;
    color: #111111;
}

.customer-qa-block .js-qa-item.is-hidden {
    display: none;
}

.customer-qa-block .js-qa-trigger:focus-visible {
    outline: 2px solid #EFB454;
    outline-offset: 2px;
}

/* ===== catalog-grid ===== */
.catalog-grid-block .catalog-glow-text {
    background: linear-gradient(135deg, #EFB454 0%, #ECA42F 50%, #4F82CA 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 14px rgba(239, 180, 84, 0.3));
}

.catalog-grid-block .catalog-card {
    position: relative;
    background-color: var(--surface);
    border-color: var(--border);
}

.catalog-grid-block .catalog-card:hover {
    border-color: var(--accent);
    transform: translateY(-2px);
}

.catalog-grid-block .catalog-glow-stage {
    background: radial-gradient(circle at center, rgba(239, 180, 84, 0.16) 0%, rgba(79, 130, 202, 0.08) 45%, rgba(21, 37, 50, 0) 72%);
}

.catalog-grid-block .catalog-card:hover .catalog-glow-stage {
    background: radial-gradient(circle at center, rgba(239, 180, 84, 0.25) 0%, rgba(79, 130, 202, 0.16) 50%, rgba(21, 37, 50, 0) 75%);
}

@media (max-width: 767px) {
    .catalog-grid-block .grid {
        grid-template-columns: 1fr;
    }
}

/* ===== blog-grid ===== */
.lab-blog-grid .lab-blog-glow {
    text-shadow: 0 0 20px rgba(239, 180, 84, 0.35);
}

.lab-blog-grid .lab-card {
    transition: border-color 0.3s cubic-bezier(0.16, 1, 0.3, 1), transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.lab-blog-grid .lab-card:hover {
    border-color: #4F82CA;
    transform: translateY(-2px);
}

.lab-blog-grid .lab-filter-btn.is-active {
    background-color: #EFB454;
    color: #111111;
    border-color: #EFB454;
    box-shadow: 0 0 12px rgba(239, 180, 84, 0.35);
}

.lab-blog-grid .lab-card .ef-btn {
    box-shadow: 0 0 14px rgba(239, 180, 84, 0.35);
}

.lab-blog-grid .lab-card .ef-btn:hover {
    box-shadow: 0 0 20px rgba(239, 180, 84, 0.6);
}

@media (max-width: 767px) {
    .lab-blog-grid .js-blog-cards-container {
        grid-template-columns: 1fr;
    }
}

/* ===== footer ===== */
.site-footer {
    background: linear-gradient(199deg, #091823 0%, #081118 50%, #070B0E 100%);
    font-family: 'Onest', sans-serif;
}

.site-footer__glow {
    background: radial-gradient(circle, rgba(239, 180, 84, 0.15) 0%, rgba(239, 180, 84, 0) 70%);
}

@media (max-width: 767px) {

    .site-footer a,
    .site-footer span,
    .site-footer p {
        word-break: break-word;
        overflow-wrap: anywhere;
    }
}

/* ===== PAGE: privacy ===== */
#privacy-content.policy-content { max-width: 960px; margin: 0 auto; padding: clamp(2rem, 5vw, 4rem) 1.5rem; color: var(--text, #F2F4F5); font-family: 'Onest', sans-serif; font-size: 1rem; line-height: 1.65; overflow-wrap: anywhere; hyphens: auto; } #privacy-content .policy-meta-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; margin-bottom: 2rem; padding-bottom: 1.25rem; border-bottom: 1px solid var(--border, #2F3840); } #privacy-content .policy-badge { display: inline-flex; align-items: center; padding: 0.25rem 0.65rem; background: var(--primary, #EFB454); color: var(--on-primary, #111111); font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; border-radius: 0px; box-shadow: 0 0 8px rgba(239, 180, 84, 0.35); } #privacy-content .policy-date { font-size: 0.875rem; color: var(--text-muted, #B0B9BF); font-weight: 500; } #privacy-content h2 { margin-top: 2.25rem; margin-bottom: 0.85rem; font-size: 16px; font-weight: 700; line-height: 1.3; color: var(--primary-text, #EFB454); border-left: 3px solid var(--primary, #EFB454); padding-left: 0.75rem; } @media (min-width: 768px) { #privacy-content h2 { font-size: 22px; margin-top: 2.75rem; margin-bottom: 1rem; } } #privacy-content p { margin-bottom: 1.15rem; color: var(--text, #F2F4F5); font-size: 0.95rem; line-height: 1.7; } @media (min-width: 768px) { #privacy-content p { font-size: 1rem; } } #privacy-content ul { list-style: disc; padding-left: 1.5rem; margin-bottom: 1.25rem; color: var(--text, #F2F4F5); } #privacy-content li { margin-bottom: 0.5rem; line-height: 1.6; font-size: 0.95rem; } @media (min-width: 768px) { #privacy-content li { font-size: 1rem; } } #privacy-content strong { color: #FFFFFF; font-weight: 600; } #privacy-content .policy-contact-card { background: var(--surface, #152532); border: 1px solid var(--border, #2F3840); border-radius: 6px; padding: 1.5rem; margin: 1.75rem 0; box-shadow: none; } #privacy-content .policy-contact-card p { margin-bottom: 0.5rem; } #privacy-content .policy-contact-card p:last-child { margin-bottom: 0; } #privacy-content .policy-link { color: var(--primary-text, #EFB454); text-decoration: underline; text-underline-offset: 3px; transition: color 0.2s ease, text-decoration-color 0.2s ease; } #privacy-content .policy-link:hover, #privacy-content .policy-link:focus { color: var(--primary-hover, #ECA42F); text-decoration-color: var(--primary-hover, #ECA42F); }

/* ===== PAGE: terms ===== */
#privacy-content { max-width: 980px; margin: 0 auto; padding: 36px 18px 72px; color: var(--text, #F2F4F5); font-family: 'Onest', sans-serif; line-height: 1.65; overflow-wrap: anywhere; hyphens: auto; } #privacy-content h2 { font-size: 16px; line-height: 1.28; font-weight: 700; color: var(--primary-text, #EFB454); margin-top: 32px; margin-bottom: 14px; letter-spacing: -0.01em; } #privacy-content h3 { font-size: 14px; line-height: 1.35; font-weight: 600; color: var(--text, #F2F4F5); margin-top: 22px; margin-bottom: 10px; } #privacy-content p { font-size: 15px; color: var(--text-muted, #B0B9BF); margin-bottom: 16px; } #privacy-content ul, #privacy-content ol { margin-bottom: 18px; padding-left: 22px; color: var(--text-muted, #B0B9BF); } #privacy-content li { font-size: 15px; margin-bottom: 8px; } #privacy-content a { color: var(--primary-text, #EFB454); text-decoration: underline; transition: color 0.25s ease; } #privacy-content a:hover, #privacy-content a:focus { color: var(--primary-hover, #ECA42F); } #privacy-content strong { color: var(--text, #F2F4F5); font-weight: 600; } @media (min-width: 768px) { #privacy-content { padding: 60px 24px 100px; } #privacy-content h2 { font-size: 24px; margin-top: 40px; margin-bottom: 16px; } #privacy-content h3 { font-size: 18px; margin-top: 26px; margin-bottom: 12px; } #privacy-content p, #privacy-content li { font-size: 16px; line-height: 1.7; } }

/* ===== PAGE: disclaimer ===== */
.policy-content { width: 100%; max-width: 1024px; margin: 0 auto; padding: 2rem 1rem 4rem; overflow-wrap: anywhere; hyphens: auto; color: var(--text, #F2F4F5); font-family: 'Onest', sans-serif; } .policy-content .policy-card { background: var(--surface, #152532); border: 1px solid var(--border, #2F3840); border-radius: 6px; padding: 1.5rem; } @media (min-width: 768px) { .policy-content .policy-card { padding: 3rem; } } .policy-content .policy-header-block { margin-bottom: 2rem; border-bottom: 1px solid var(--border, #2F3840); padding-bottom: 1.5rem; text-align: left; } .policy-content .ef-badge { display: inline-flex; align-items: center; background: var(--primary, #EFB454); color: var(--on-primary, #111111); font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; padding: 0.25rem 0.625rem; border-radius: 0px; margin-bottom: 1rem; box-shadow: 0 0 8px rgba(239, 180, 84, 0.4); } .policy-content .policy-title { font-size: 16px; line-height: 1.25; font-weight: 800; color: var(--text, #F2F4F5); margin-bottom: 0.75rem; letter-spacing: -0.02em; } @media (min-width: 768px) { .policy-content .policy-title { font-size: 30px; } } .policy-content .policy-highlight { color: var(--primary-text, #EFB454); text-shadow: 0 0 16px rgba(239, 180, 84, 0.35); } .policy-content .policy-date { font-size: 0.875rem; color: var(--text-muted, #B0B9BF); margin: 0; } .policy-content .policy-body { display: flex; flex-direction: column; gap: 2rem; } .policy-content .policy-section { display: flex; flex-direction: column; gap: 0.75rem; } .policy-content h3 { font-size: 14px; line-height: 1.3; font-weight: 700; color: var(--text, #F2F4F5); margin: 0; padding-top: 0.5rem; } @media (min-width: 768px) { .policy-content h3 { font-size: 20px; } } .policy-content p { font-size: 0.9375rem; line-height: 1.65; color: var(--text-muted, #B0B9BF); margin: 0; } .policy-content ul { list-style-type: disc; list-style-position: outside; padding-left: 1.25rem; margin: 0; display: flex; flex-direction: column; gap: 0.5rem; } .policy-content li { font-size: 0.9375rem; line-height: 1.6; color: var(--text-muted, #B0B9BF); } .policy-content .policy-contact-list { list-style: none; padding-left: 0; } .policy-content .policy-contact-list li { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem; } .policy-content strong { color: var(--text, #F2F4F5); font-weight: 600; } .policy-content .policy-link { color: var(--primary-text, #EFB454); text-decoration: underline; text-underline-offset: 3px; transition: color 0.2s ease, text-shadow 0.2s ease; } .policy-content .policy-link:hover, .policy-content .policy-link:focus { color: var(--primary-hover, #ECA42F); text-shadow: 0 0 8px rgba(239, 180, 84, 0.6); }

/* ===== PAGE: about ===== */
.about-block .about-highlight-glow{text-shadow:0 0 16px rgba(239,180,84,0.45);background:linear-gradient(135deg,#EFB454 0%,#F5CD84 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.about-block .about-stage-glow{background:radial-gradient(circle,rgba(79,130,202,0.25) 0%,rgba(79,130,202,0) 70%)}.about-block .about-cta-glow{background:radial-gradient(circle,rgba(239,180,84,0.15) 0%,rgba(239,180,84,0) 70%)}.about-block .about-tab-btn{background-color:var(--surface);border-color:var(--border);color:var(--text-muted)}.about-block .about-tab-btn:hover{border-color:var(--primary);color:var(--text)}.about-block .about-tab-btn.active{background-color:var(--primary);border-color:var(--primary);color:var(--on-primary);box-shadow:0 0 14px rgba(239,180,84,0.35)}.about-block .ef-btn:hover{background-color:var(--primary-hover);box-shadow:0 0 20px rgba(239,180,84,0.6)}.about-block .ef-btn-alt:hover{background-color:var(--surface);border-color:var(--primary);color:var(--primary-text)}

/* ===== PAGE: catalog ===== */
.catalog-block .catalog-editorial-grid:has(> .js-product-card ~ .js-product-card ~ .js-product-card ~ .js-product-card) > .catalog-editorial-tile {
  grid-row: span 2;
}

@media (max-width: 1023px) {
  .catalog-block .catalog-editorial-grid:has(> .js-product-card ~ .js-product-card ~ .js-product-card ~ .js-product-card) > .catalog-editorial-tile {
    grid-row: span 1;
    grid-column: span 2;
  }
}

@media (max-width: 767px) {
  .catalog-block .catalog-editorial-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .catalog-block .catalog-editorial-tile {
    grid-column: span 2;
    aspect-ratio: 4/3;
    min-height: auto;
  }
}

.catalog-block .js-product-card img {
  object-fit: contain;
  max-height: 190px;
}

/* ===== PAGE: blog ===== */
.blog-listing-flow .ef-card {
  background-color: var(--surface);
  border-color: var(--border);
}
.blog-listing-flow .ef-card:hover {
  border-color: var(--accent);
}
@media (max-width: 767px) {
  .blog-listing-flow .grid {
    grid-template-columns: 1fr;
  }
  .blog-listing-flow article {
    flex-direction: column !important;
  }
}

/* ===== PAGE: delivery ===== */
.delivery-info-section select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23B0B9BF' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
  background-position: right 0.65rem center;
  background-repeat: no-repeat;
  background-size: 1.25em 1.25em;
  padding-right: 2.25rem;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.delivery-info-section .js-faq-trigger[aria-expanded="true"] .js-faq-icon {
  transform: rotate(180deg);
}

@media (max-width: 767px) {
  .delivery-info-section .grid {
    grid-template-columns: 1fr;
  }
}

/* ===== PAGE: refound ===== */
.ef-section {
  background-color: var(--bg, #0C151C);
  color: var(--text, #F2F4F5);
}
.ef-card {
  background-color: var(--surface, #152532);
  border: 1px solid var(--border, #2F3840);
}
.ef-badge {
  background-color: var(--primary, #EFB454);
  color: var(--on-primary, #111111);
}
.js-faq-toggle {
  cursor: pointer;
}
.js-faq-toggle:focus {
  outline: none;
}

/* ===== PAGE: faq ===== */
.faq-content-block .faq-gradient-text { background: linear-gradient(135deg, #EFB454 0%, #4F82CA 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.faq-content-block .faq-tab-btn { background-color: #101D26; border-color: #2F3840; color: #B0B9BF; cursor: pointer; }
.faq-content-block .faq-tab-btn:hover { border-color: #EFB454; color: #EFB454; }
.faq-content-block .faq-tab-btn.active { background-color: #EFB454; border-color: #EFB454; color: #111111; box-shadow: 0 0 12px rgba(239, 180, 84, 0.35); }
.faq-content-block .js-faq-item { transition: border-color 0.25s ease, transform 0.25s ease; }
.faq-content-block .js-faq-item:hover { border-color: #4F82CA; }
.faq-content-block .js-faq-item.is-open { border-color: #EFB454; }
.faq-content-block .js-faq-item.is-open .faq-chevron-icon { transform: rotate(180deg); color: #EFB454; }
.faq-content-block .faq-cta-glow { position: absolute; right: -40px; top: -40px; width: 220px; height: 220px; background: radial-gradient(circle, rgba(239, 180, 84, 0.15) 0%, rgba(239, 180, 84, 0) 70%); filter: blur(20px); }

/* ===== PAGE: contact ===== */
.contact-block {
  position: relative;
}
.contact-block .contact-gradient-text {
  background: linear-gradient(135deg, #EFB454 0%, #ECA42F 50%, #6793D1 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 0 20px rgba(239, 180, 84, 0.25);
}
.contact-block .contact-info-card {
  transition: border-color 0.25s cubic-bezier(0.16, 1, 0.3, 1), transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
.contact-block .contact-info-card:hover {
  border-color: #4F82CA;
  transform: translateY(-2px);
}
.contact-block .contact-input::placeholder,
.contact-block .contact-textarea::placeholder {
  color: #727D85;
  opacity: 1;
}
.contact-block .contact-submit-btn {
  box-shadow: 0 0 14px rgba(239, 180, 84, 0.45);
}
.contact-block .contact-submit-btn:hover {
  box-shadow: 0 0 24px rgba(236, 164, 47, 0.75);
  transform: scale(1.02);
}
.contact-block .contact-map-wrapper iframe {
  width: 100%;
  height: 100%;
  border: 0;
  filter: contrast(1.05) brightness(0.9);
}
@media (max-width: 767px) {
  .contact-block h2 {
    font-size: 16px;
    hyphens: auto;
  }
  .contact-block h3 {
    font-size: 14px;
  }
  .contact-block p,
  .contact-block a {
    overflow-wrap: anywhere;
  }
}

/* ===== PAGE: cart ===== */
.cart-checkout-page .cart-shipping-option:has(input:checked) {
  border-color: #EFB454;
  background: rgba(239, 180, 84, 0.08);
}
.cart-checkout-page .cart-row-item {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: center;
  gap: 1rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
}
@media (max-width: 767px) {
  .cart-checkout-page .cart-row-item {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.75rem;
  }
}

.comment-card {
    position: relative;
    background-color: #152532;
    border: 1px solid #2F3840;
    border-radius: 6px;
}

.comment-avatar {
    width: 44px;
    height: 44px;
    min-width: 44px;
    border-radius: 9999px;
    object-fit: cover;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.875rem;
    line-height: 1;
}

.comment-action-btn {
    cursor: pointer;
    user-select: none;
}

.comment-reply-card {
    position: relative;
    background-color: #101D26;
    border: 1px solid #2F3840;
    border-left: 2px solid #4F82CA;
    border-radius: 6px;
}

.comment-avatar {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 9999px;
    object-fit: cover;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.8125rem;
    line-height: 1;
}

.comment-action-btn {
    cursor: pointer;
    user-select: none;
}


/* ===== PAGE TEMPLATE: catalog-items ===== */
.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    width: 100%;
    background-color: #0C151C;
    border-bottom: 1px solid #2F3840;
}

.site-header .h-18 {
    height: 4.5rem;
}

@media (max-width: 767px) {
    .site-header #js-mobile-nav-menu {
        background-color: #0C151C;
    }
}

.hero-section {
    position: relative;
    background: var(--hero-bg);
    color: var(--on-hero);
}

.hero-section .hero-radial-glow {
    background: radial-gradient(circle, rgba(239, 180, 84, 0.16) 0%, rgba(79, 130, 202, 0.08) 45%, rgba(12, 21, 28, 0) 70%);
}

.product-detail-scope .detail-heading-accent {
    border-left: 3px solid #EFB454;
}

.product-detail-scope .product-glow-circle {
    background: radial-gradient(circle, rgba(239, 180, 84, 0.22) 0%, rgba(79, 130, 202, 0.1) 45%, rgba(21, 37, 50, 0) 70%);
}

.product-detail-scope .comment-avatar {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.875rem;
    flex-shrink: 0;
}

.site-footer {
    background: linear-gradient(199deg, #091823 0%, #081118 50%, #070B0E 100%);
    font-family: 'Onest', sans-serif;
}

.site-footer__glow {
    background: radial-gradient(circle, rgba(239, 180, 84, 0.15) 0%, rgba(239, 180, 84, 0) 70%);
}

@media (max-width: 767px) {

    .site-footer a,
    .site-footer span,
    .site-footer p {
        word-break: break-word;
        overflow-wrap: anywhere;
    }

    .product-detail-scope .product-buy-box {
        margin-top: 1rem;
    }
}

/* ===== PAGE TEMPLATE: blog-posts ===== */
.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    width: 100%;
    background-color: #0C151C;
    border-bottom: 1px solid #2F3840;
}

.site-header .h-18 {
    height: 4.5rem;
}

@media (max-width: 767px) {
    .site-header #js-mobile-nav-menu {
        background-color: #0C151C;
    }
}

.hero-section {
    position: relative;
    background: var(--hero-bg);
    color: var(--on-hero);
}

.hero-section .hero-radial-glow {
    background: radial-gradient(circle, rgba(239, 180, 84, 0.16) 0%, rgba(79, 130, 202, 0.08) 45%, rgba(12, 21, 28, 0) 70%);
}

.blog-showcase-band .blog-stage-glow {
    background: radial-gradient(circle, rgba(239, 180, 84, 0.22) 0%, rgba(79, 130, 202, 0.1) 50%, transparent 70%);
}

.blog-cta-band .cta-radial-glow {
    background: radial-gradient(circle, rgba(239, 180, 84, 0.2) 0%, rgba(79, 130, 202, 0.1) 45%, transparent 70%);
}

.comment-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 14px;
    line-height: 1;
    flex-shrink: 0;
}

.comment-action-btn[data-liked="true"] {
    color: #EFB454 !important;
    border-color: #EFB454 !important;
}

.site-footer {
    background: linear-gradient(199deg, #091823 0%, #081118 50%, #070B0E 100%);
    font-family: 'Onest', sans-serif;
}

.site-footer__glow {
    background: radial-gradient(circle, rgba(239, 180, 84, 0.15) 0%, rgba(239, 180, 84, 0) 70%);
}

@media (max-width: 767px) {

    .site-footer a,
    .site-footer span,
    .site-footer p {
        word-break: break-word;
        overflow-wrap: anywhere;
    }
}

/* mobile-text-guard */
@media (max-width: 767px) {
  h1, h2, h3, h4, h5, h6, p, li, dt, dd, blockquote, figcaption, td, th, label {
    overflow-wrap: anywhere;
  }
  a, button, .btn {
    overflow-wrap: anywhere;
    white-space: normal;
  }
  img, video, iframe {
    max-width: 100%;
  }
}

/* FAQ labels remain readable on their gold background; cards size independently. */
.faq-content-block .ef-badge { color: var(--on-primary); }
.faq-content-block #js-faq-container { align-items: start; }
.faq-content-block .js-faq-item { min-height: 0; }
/* Keep the confirmation mark on its own centered row. */
.purchase-success-icon { display: flex; margin-left: auto; margin-right: auto; }