:root {
    --inner-hero-height: clamp(280px, 34dvh, 320px);
    --inner-hero-height-mobile: 240px;
    --inner-hero-gold: #e0c297;
    --inner-hero-muted: #9caab0;
    --inner-hero-line: #1b282d;
}

body .animated-hero,
body .archive-hero,
body .products-hero,
body .size-hero,
body .finish-hero,
body .single-hero {
    width: 100%;
    height: var(--inner-hero-height) !important;
    min-height: var(--inner-hero-height) !important;
    max-height: var(--inner-hero-height) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative;
    overflow: hidden;
    padding-block: 0 !important;
    border-bottom: 1px solid var(--inner-hero-line);
    box-sizing: border-box;
    text-align: center;
}

body .animated-hero__content,
body .archive-hero__content,
body .products-hero .hero-content,
body .size-hero .hero-content,
body .finish-hero .hero-content,
body .single-hero .hero-content {
    width: min(860px, calc(100% - 40px));
    max-width: 860px !important;
    position: relative;
    z-index: 3;
    margin-inline: auto;
    padding: 0 18px !important;
    box-sizing: border-box;
    text-align: center;
}

body .animated-hero__eyebrow,
body .archive-hero__eyebrow,
body .products-hero .hero-eyebrow,
body .size-hero .hero-eyebrow,
body .finish-hero .hero-eyebrow,
body .single-hero .hero-meta {
    margin: 0 0 8px !important;
    color: var(--inner-hero-gold) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.6 !important;
}

html[dir="ltr"] body .animated-hero__eyebrow,
html[dir="ltr"] body .archive-hero__eyebrow,
html[dir="ltr"] body .products-hero .hero-eyebrow,
html[dir="ltr"] body .size-hero .hero-eyebrow,
html[dir="ltr"] body .finish-hero .hero-eyebrow,
html[dir="ltr"] body .single-hero .hero-meta {
    letter-spacing: 0.16em !important;
    text-transform: uppercase;
}

body .animated-hero__title,
body .archive-hero__title,
body .products-hero .hero-title,
body .size-hero .hero-title,
body .finish-hero .hero-title,
body .single-hero .hero-title {
    display: block !important;
    max-width: 820px !important;
    margin: 0 auto 10px !important;
    color: #fff !important;
    font-size: clamp(32px, 4.5vw, 52px) !important;
    font-weight: 850 !important;
    line-height: 1.12 !important;
    text-align: center !important;
}

html[dir="rtl"] body .animated-hero__title,
html[dir="rtl"] body .archive-hero__title,
html[dir="rtl"] body .products-hero .hero-title,
html[dir="rtl"] body .size-hero .hero-title,
html[dir="rtl"] body .finish-hero .hero-title,
html[dir="rtl"] body .single-hero .hero-title {
    font-family: "Peyda", sans-serif !important;
    line-height: 1.4 !important;
}

html[dir="ltr"] body .animated-hero__title,
html[dir="ltr"] body .archive-hero__title,
html[dir="ltr"] body .products-hero .hero-title,
html[dir="ltr"] body .size-hero .hero-title,
html[dir="ltr"] body .finish-hero .hero-title,
html[dir="ltr"] body .single-hero .hero-title {
    font-family: "Barlow", sans-serif !important;
}

body .animated-hero__desc,
body .archive-hero__desc,
body .products-hero .hero-desc,
body .size-hero .hero-subtitle,
body .finish-hero .hero-subtitle {
    display: block !important;
    max-width: 640px !important;
    margin: 0 auto !important;
    color: var(--inner-hero-muted) !important;
    font-size: 14px !important;
    line-height: 1.8 !important;
    text-align: center !important;
}

body .animated-hero h1,
body .animated-hero p,
body .archive-hero h1,
body .archive-hero p,
body .products-hero h1,
body .products-hero p,
body .size-hero h1,
body .size-hero p,
body .finish-hero h1,
body .finish-hero p,
body .single-hero h1,
body .single-hero p {
    background: none !important;
    background-clip: border-box !important;
    -webkit-background-clip: border-box !important;
    -webkit-text-fill-color: currentColor !important;
    will-change: auto !important;
}

body .animated-hero h1:hover,
body .animated-hero p:hover,
body .archive-hero h1:hover,
body .archive-hero p:hover,
body .products-hero h1:hover,
body .products-hero p:hover,
body .size-hero h1:hover,
body .size-hero p:hover,
body .finish-hero h1:hover,
body .finish-hero p:hover,
body .single-hero h1:hover,
body .single-hero p:hover {
    transform: none !important;
    letter-spacing: inherit !important;
    text-shadow: none !important;
    filter: none !important;
}

@media (max-width: 680px) {
    body .animated-hero,
    body .archive-hero,
    body .products-hero,
    body .size-hero,
    body .finish-hero,
    body .single-hero {
        height: var(--inner-hero-height-mobile) !important;
        min-height: var(--inner-hero-height-mobile) !important;
        max-height: var(--inner-hero-height-mobile) !important;
    }

    body .animated-hero__content,
    body .archive-hero__content,
    body .products-hero .hero-content,
    body .size-hero .hero-content,
    body .finish-hero .hero-content,
    body .single-hero .hero-content {
        width: min(100% - 28px, 760px);
        padding-inline: 8px !important;
    }

    body .animated-hero__eyebrow,
    body .archive-hero__eyebrow,
    body .products-hero .hero-eyebrow,
    body .size-hero .hero-eyebrow,
    body .finish-hero .hero-eyebrow,
    body .single-hero .hero-meta {
        margin-bottom: 6px !important;
        font-size: 10.5px !important;
    }

    body .animated-hero__title,
    body .archive-hero__title,
    body .products-hero .hero-title,
    body .size-hero .hero-title,
    body .finish-hero .hero-title,
    body .single-hero .hero-title {
        margin-bottom: 7px !important;
        font-size: clamp(29px, 9vw, 38px) !important;
    }

    body .animated-hero__desc,
    body .archive-hero__desc,
    body .products-hero .hero-desc,
    body .size-hero .hero-subtitle,
    body .finish-hero .hero-subtitle {
        max-width: 540px !important;
        font-size: 12.5px !important;
        line-height: 1.75 !important;
    }
}