/*
 * ============================================================
 * BigDIAMOND — The Silent Curator
 * Premium / Quiet Luxury Design System
 * ============================================================
 *
 * Brand direction:
 * - Deep Forest
 * - Warm Ivory
 * - Champagne Gold
 * - Warm Ink
 * - Stone neutrals
 *
 * Typography:
 * - Playfair Display — editorial / luxury
 * - Manrope — navigation / body / interface
 *
 * Principles:
 * - less weight
 * - more whitespace
 * - subtle contrast
 * - restrained gold
 * - no loud hover states
 * - no oversized UI
 *
 * This file is the global source of truth for BigDIAMOND tokens.
 * ============================================================
 */


/* ============================================================
   1. FONTS
   ============================================================ */

@font-face {
    font-family: "Manrope";
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url("../fonts/manrope-latin-ext-400-700.woff2") format("woff2");
    unicode-range:
        U+0100-02BA,
        U+02BD-02C5,
        U+02C7-02CC,
        U+02CE-02D7,
        U+02DD-02FF,
        U+0304,
        U+0308,
        U+0329,
        U+1D00-1DBF,
        U+1E00-1E9F,
        U+1EF2-1EFF,
        U+2020,
        U+20A0-20AB,
        U+20AD-20C0,
        U+2113,
        U+2C60-2C7F,
        U+A720-A7FF;
}

@font-face {
    font-family: "Manrope";
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url("../fonts/manrope-latin-400-700.woff2") format("woff2");
    unicode-range:
        U+0000-00FF,
        U+0131,
        U+0152-0153,
        U+02BB-02BC,
        U+02C6,
        U+02DA,
        U+02DC,
        U+0304,
        U+0308,
        U+0329,
        U+2000-206F,
        U+20AC,
        U+2122,
        U+2191,
        U+2193,
        U+2212,
        U+2215,
        U+FEFF,
        U+FFFD;
}

@font-face {
    font-family: "Playfair Display";
    font-style: normal;
    font-weight: 500 700;
    font-display: swap;
    src: url("../fonts/playfair-display-latin-ext-500-700.woff2") format("woff2");
    unicode-range:
        U+0100-02BA,
        U+02BD-02C5,
        U+02C7-02CC,
        U+02CE-02D7,
        U+02DD-02FF,
        U+0304,
        U+0308,
        U+0329,
        U+1D00-1DBF,
        U+1E00-1E9F,
        U+1EF2-1EFF,
        U+2020,
        U+20A0-20AB,
        U+20AD-20C0,
        U+2113,
        U+2C60-2C7F,
        U+A720-A7FF;
}

@font-face {
    font-family: "Playfair Display";
    font-style: normal;
    font-weight: 500 700;
    font-display: swap;
    src: url("../fonts/playfair-display-latin-500-700.woff2") format("woff2");
    unicode-range:
        U+0000-00FF,
        U+0131,
        U+0152-0153,
        U+02BB-02BC,
        U+02C6,
        U+02DA,
        U+02DC,
        U+0304,
        U+0308,
        U+0329,
        U+2000-206F,
        U+20AC,
        U+2122,
        U+2191,
        U+2193,
        U+2212,
        U+2215,
        U+FEFF,
        U+FFFD;
}


/* ============================================================
   2. GLOBAL TOKENS
   ============================================================ */

:root {

    /* ========================================================
       BRAND — DEEP FOREST
       ======================================================== */

    --bd-primary: #0F342A;
    --bd-primary-deep: #09271F;
    --bd-primary-darkest: #071F19;

    --bd-primary-container: #315247;
    --bd-primary-soft: #47665B;

    --bd-on-primary: #FBF9F5;


    /* ========================================================
       GOLD — CHAMPAGNE / ANTIQUE
       ======================================================== */

    --bd-secondary: #B8924F;

    --bd-gold: #B8924F;
    --bd-gold-light: #CAA969;
    --bd-gold-soft: #DDC99E;

    --bd-gold-ink: #806131;
    --bd-gold-deep: #765722;


    /* ========================================================
       SURFACES — WARM IVORY
       ======================================================== */

    --bd-surface: #F7F4EE;

    --bd-surface-bright: #FBF9F5;
    --bd-surface-lowest: #FFFDF9;

    --bd-surface-low: #F2EEE8;
    --bd-surface-container: #ECE6DC;

    --bd-surface-high: #E6DED2;
    --bd-surface-highest: #DED4C6;

    --bd-surface-panel: #FBF9F5;


    /* ========================================================
       EDITORIAL SURFACES
       ======================================================== */

    --bd-nude: #E9DDD3;
    --bd-champagne: #DED0C1;
    --bd-stone-surface: #EAE4DA;


    /* ========================================================
       TEXT
       ======================================================== */

    --bd-text: #242925;
    --bd-text-strong: #17241F;

    --bd-text-soft: #424944;

    --bd-muted: #666B67;
    --bd-muted-light: #858A86;


    /* ========================================================
       OUTLINES / BORDERS
       ======================================================== */

    --bd-outline: #96958E;
    --bd-outline-variant: #D8D2C8;

    --bd-border: #E8E3DB;
    --bd-border-soft: #EFEAE3;
    --bd-border-strong: #D8D2C8;


    /* ========================================================
       TYPOGRAPHY FAMILIES
       ======================================================== */

    --bd-serif:
        "Playfair Display",
        Georgia,
        "Times New Roman",
        serif;

    --bd-font-display:
        var(--bd-serif);

    --bd-sans:
        "Manrope",
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;


    /* ========================================================
       FONT WEIGHTS
       ======================================================== */

    --bd-weight-regular: 400;

    --bd-weight-medium: 500;

    --bd-weight-semibold: 600;

    --bd-weight-bold: 700;

    --bd-weight-serif-display: 500;
    --bd-weight-serif-heading: 500;
    --bd-weight-serif-small: 600;

    --bd-weight-nav: 600;
    --bd-weight-button: 600;


    /* ========================================================
       TYPOGRAPHY SCALE
       ======================================================== */

    --bd-size-display:
        clamp(50px, 5.15vw, 80px);

    --bd-size-h1:
        clamp(46px, 4.65vw, 72px);

    --bd-size-h2:
        clamp(38px, 3.5vw, 56px);

    --bd-size-h3:
        clamp(28px, 2.4vw, 38px);

    --bd-size-h4:
        clamp(22px, 1.7vw, 28px);

    --bd-size-body-lg:
        clamp(17px, 1.15vw, 19px);

    --bd-size-body:
        16px;

    --bd-size-body-sm:
        14px;

    --bd-size-caption:
        13px;

    --bd-size-eyebrow:
        11px;

    --bd-size-button:
        11px;

    --bd-size-nav:
        11px;


    /* ========================================================
       LINE HEIGHTS
       ======================================================== */

    --bd-leading-display: 0.98;

    --bd-leading-h1: 1;

    --bd-leading-h2: 1.04;

    --bd-leading-h3: 1.12;

    --bd-leading-h4: 1.2;

    --bd-leading-body-lg: 1.72;

    --bd-leading-body: 1.72;

    --bd-leading-small: 1.6;


    /* ========================================================
       TRACKING
       ======================================================== */

    --bd-tracking-display: -0.042em;

    --bd-tracking-heading: -0.028em;

    --bd-tracking-small-heading: -0.015em;

    --bd-tracking-body: -0.008em;

    --bd-tracking-nav: 0.13em;

    --bd-tracking-eyebrow: 0.18em;

    --bd-tracking-button: 0.14em;


    /* ========================================================
       SPACING SCALE
       ======================================================== */

    --bd-space-3xs: 4px;

    --bd-space-2xs: 8px;

    --bd-space-xs: 12px;

    --bd-space-sm: 16px;

    --bd-space-md: 24px;

    --bd-space-lg: 32px;

    --bd-space-xl: 48px;

    --bd-space-2xl: 64px;

    --bd-space-3xl: 80px;

    --bd-space-4xl: 96px;

    --bd-space-5xl: 128px;

    --bd-space-6xl: 160px;


    /* ========================================================
       LAYOUT
       ======================================================== */

    --bd-max: 1504px;

    --bd-content: 1376px;

    --bd-reading: 68ch;

    --bd-reading-narrow: 56ch;

    --bd-gutter:
        clamp(22px, 4.45vw, 68px);

    --bd-grid-gap:
        clamp(20px, 2vw, 32px);

    --bd-section-gap:
        clamp(88px, 9vw, 144px);

    --bd-section-gap-lg:
        clamp(112px, 11vw, 176px);


    /* ========================================================
       RADIUS
       ======================================================== */

    --bd-radius: 2px;

    --bd-radius-lg: 4px;


    /* ========================================================
       MOTION
       ======================================================== */

    --bd-ease:
        cubic-bezier(0.22, 1, 0.36, 1);

    --bd-ease-out:
        cubic-bezier(0, 0, 0.2, 1);

    --bd-duration-fast: 220ms;

    --bd-duration: 360ms;

    --bd-duration-slow: 520ms;


    /* ========================================================
       SHADOWS
       ======================================================== */

    --bd-shadow-xs:
        0 1px 2px rgba(15, 52, 42, 0.025);

    --bd-shadow-sm:
        0 10px 32px rgba(15, 52, 42, 0.045);

    --bd-shadow-md:
        0 22px 64px rgba(15, 52, 42, 0.065);


    /* ========================================================
       SEMANTIC ALIASES
       ======================================================== */

    --bd-background:
        var(--bd-surface);

    --bd-card:
        var(--bd-surface-panel);

    --bd-heading:
        var(--bd-primary);

    --bd-link:
        var(--bd-primary);

    --bd-link-hover:
        var(--bd-gold-ink);

    --bd-focus:
        var(--bd-gold);

    --bd-button-bg:
        var(--bd-primary);

    --bd-button-bg-hover:
        var(--bd-primary-deep);

    --bd-button-text:
        var(--bd-on-primary);

    --bd-disabled:
        #A6A8A3;

    --bd-disabled-surface:
        #EEEAE4;
}


/* ============================================================
   3. GLOBAL FOUNDATION
   ============================================================ */

.bd-global-header {
    color:
        var(--bd-text);

    background:
        var(--bd-surface);

    font-family:
        var(--bd-sans);

    font-size:
        var(--bd-size-body);

    font-weight:
        var(--bd-weight-regular);

    line-height:
        var(--bd-leading-body);

    letter-spacing:
        var(--bd-tracking-body);

    -webkit-font-smoothing:
        antialiased;

    -moz-osx-font-smoothing:
        grayscale;
}


/* ============================================================
   4. PARAGRAPHS
   ============================================================ */

.bd-global-header p {
    max-width:
        var(--bd-reading);

    margin-top:
        0;

    margin-bottom:
        1.25em;

    color:
        var(--bd-text-soft);

    font-family:
        var(--bd-sans);

    font-weight:
        400;

    line-height:
        var(--bd-leading-body);
}

.bd-global-header p:last-child {
    margin-bottom:
        0;
}


/* ============================================================
   5. HEADINGS
   ============================================================ */

.bd-global-header :where(
    h1,
    h2,
    h3,
    h4,
    h5,
    h6
) {
    margin-top:
        0;

    color:
        var(--bd-heading);

    font-family:
        var(--bd-serif);

    text-wrap:
        balance;

    -webkit-font-smoothing:
        antialiased;
}


/* H1 */

.bd-global-header h1 {
    margin-bottom:
        0.42em;

    font-size:
        var(--bd-size-h1);

    font-weight:
        var(--bd-weight-serif-display);

    letter-spacing:
        var(--bd-tracking-display);

    line-height:
        var(--bd-leading-h1);
}


/* H2 */

.bd-global-header h2 {
    margin-bottom:
        0.5em;

    font-size:
        var(--bd-size-h2);

    font-weight:
        var(--bd-weight-serif-heading);

    letter-spacing:
        var(--bd-tracking-heading);

    line-height:
        var(--bd-leading-h2);
}


/* H3 */

.bd-global-header h3 {
    margin-bottom:
        0.55em;

    font-size:
        var(--bd-size-h3);

    font-weight:
        var(--bd-weight-serif-heading);

    letter-spacing:
        -0.022em;

    line-height:
        var(--bd-leading-h3);
}


/* H4 */

.bd-global-header h4 {
    margin-bottom:
        0.6em;

    font-size:
        var(--bd-size-h4);

    font-weight:
        var(--bd-weight-serif-small);

    letter-spacing:
        var(--bd-tracking-small-heading);

    line-height:
        var(--bd-leading-h4);
}


/* H5 / H6 */

.bd-global-header :where(
    h5,
    h6
) {
    margin-bottom:
        0.65em;

    font-family:
        var(--bd-sans);

    font-weight:
        600;

    letter-spacing:
        0.04em;

    line-height:
        1.35;
}


/* ============================================================
   6. DISPLAY TYPOGRAPHY
   ============================================================ */

.bd-display {
    max-width:
        13ch;

    color:
        var(--bd-primary);

    font-family:
        var(--bd-serif);

    font-size:
        var(--bd-size-display);

    font-weight:
        var(--bd-weight-serif-display);

    letter-spacing:
        var(--bd-tracking-display);

    line-height:
        var(--bd-leading-display);

    text-wrap:
        balance;
}


/* ============================================================
   7. SECTION HEADLINE
   ============================================================ */

.bd-headline {
    max-width:
        17ch;

    color:
        var(--bd-primary);

    font-family:
        var(--bd-serif);

    font-size:
        var(--bd-size-h2);

    font-weight:
        var(--bd-weight-serif-heading);

    letter-spacing:
        var(--bd-tracking-heading);

    line-height:
        var(--bd-leading-h2);

    text-wrap:
        balance;
}


/* ============================================================
   8. HERO / LARGE BODY
   ============================================================ */

.bd-body-lg {
    max-width:
        590px;

    color:
        var(--bd-muted);

    font-family:
        var(--bd-sans);

    font-size:
        var(--bd-size-body-lg);

    font-weight:
        400;

    letter-spacing:
        -0.01em;

    line-height:
        var(--bd-leading-body-lg);
}


/* ============================================================
   9. EYEBROW
   ============================================================ */

.bd-eyebrow {
    color:
        var(--bd-gold-ink);

    font-family:
        var(--bd-sans);

    font-size:
        var(--bd-size-eyebrow);

    font-weight:
        600;

    letter-spacing:
        var(--bd-tracking-eyebrow);

    line-height:
        1.4;

    text-transform:
        uppercase;
}


/* ============================================================
   10. KICKER
   ============================================================ */

.bd-kicker {
    color:
        var(--bd-primary-container);

    font-family:
        var(--bd-sans);

    font-size:
        11px;

    font-weight:
        600;

    letter-spacing:
        0.15em;

    line-height:
        1.45;

    text-transform:
        uppercase;
}


/* ============================================================
   11. LINKS
   ============================================================ */

.bd-global-header
a:where(
    :not(.wp-element-button)
    :not(.bd-btn)
    :not(.bd-button)
) {
    color:
        var(--bd-link);

    font-weight:
        inherit;

    text-decoration-color:
        rgba(184, 146, 79, 0.42);

    text-decoration-thickness:
        1px;

    text-underline-offset:
        0.2em;

    transition:
        color
        var(--bd-duration-fast)
        var(--bd-ease-out),

        text-decoration-color
        var(--bd-duration-fast)
        var(--bd-ease-out);
}

.bd-global-header
a:where(
    :not(.wp-element-button)
    :not(.bd-btn)
    :not(.bd-button)
):hover {
    color:
        var(--bd-link-hover);

    text-decoration-color:
        var(--bd-gold);
}


/* ============================================================
   12. ACCESSIBILITY / FOCUS
   ============================================================ */

.bd-global-header :where(
    a,
    button,
    input,
    select,
    textarea,
    summary
):focus-visible {
    outline:
        2px solid
        var(--bd-focus);

    outline-offset:
        4px;
}


/* ============================================================
   13. FORM CONTROLS
   ============================================================ */

.bd-global-header :where(
    button,
    input,
    select,
    textarea
) {
    border-radius:
        var(--bd-radius);

    font-family:
        var(--bd-sans);

    font-size:
        15px;
}


/* ============================================================
   14. IMAGES
   ============================================================ */

.bd-global-header img {
    box-shadow:
        none;
}

/* bd_minimalizm_icon() (inc/helpers.php) emits <svg class="bd-icon"> with no
   width/height attributes. Any call site that forgets to size it (or whose
   sizing CSS is scoped to a narrower viewport) would otherwise render the
   icon at its intrinsic 24x24 viewBox scale blown up to the parent's font
   size — this cheap default keeps every future bd-icon usage safely sized
   unless a more specific rule overrides it. */
.bd-icon {
    width:
        1em;

    height:
        1em;
}


/* ============================================================
   15. CLASSIC ROUTE OFFSET
   ============================================================ */

.bd-global-header:not(.bd-minimalizm-front):not(.bd-commerce):not(.bd-minimalizm-contact) .site-content {
    padding-top:
        80px;
}


/* ============================================================
   16. PREMIUM GLASS NAVIGATION
   ============================================================ */

/* Background lives on ::before, not the real element — backdrop-filter on a
   real ancestor creates a new containing block for its position:fixed
   descendants (Chrome/Safari), which broke the mini-cart panel fixed inside
   this nav. See bigdiamond-components.css .bd-nav::before for the same fix. */
.bd-glass-nav::before {
    content:
        "";

    position:
        absolute;

    inset:
        0;

    z-index:
        -1;

    background:
        rgba(251, 249, 245, 0.94);

    border-bottom:
        1px solid
        rgba(216, 210, 200, 0.58);

    box-shadow:
        0 1px 0
        rgba(15, 52, 42, 0.015);

    backdrop-filter:
        blur(18px)
        saturate(115%);

    -webkit-backdrop-filter:
        blur(18px)
        saturate(115%);

    pointer-events:
        none;
}


/* Navigation typography */

.bd-glass-nav :where(
    .main-navigation a,
    .menu a,
    nav a
) {
    font-family:
        var(--bd-sans);

    font-size:
        var(--bd-size-nav);

    font-weight:
        var(--bd-weight-nav);

    letter-spacing:
        var(--bd-tracking-nav);

    line-height:
        1;

    text-transform:
        uppercase;
}


/* ============================================================
   17. GOLD EDITORIAL RULE
   ============================================================ */

.bd-gold-rule {
    display:
        block;

    width:
        40px;

    height:
        1px;

    margin-block:
        var(--bd-space-md)
        var(--bd-space-lg);

    border:
        0;

    background:
        var(--bd-gold);
}


/* ============================================================
   18. BUTTON SYSTEM — BASE
   ============================================================ */

.bd-btn,
.bd-button {
    position:
        relative;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        auto;

    min-width:
        0;

    min-height:
        52px;

    padding:
        0
        27px;

    border:
        1px solid
        transparent;

    border-radius:
        var(--bd-radius);

    box-shadow:
        none;

    font-family:
        var(--bd-sans);

    font-size:
        var(--bd-size-button);

    font-weight:
        var(--bd-weight-button);

    letter-spacing:
        var(--bd-tracking-button);

    line-height:
        1;

    text-align:
        center;

    text-decoration:
        none;

    text-transform:
        uppercase;

    white-space:
        nowrap;

    cursor:
        pointer;

    -webkit-tap-highlight-color:
        transparent;

    transition:
        color
        260ms
        var(--bd-ease),

        background-color
        260ms
        var(--bd-ease),

        border-color
        260ms
        var(--bd-ease),

        opacity
        260ms
        var(--bd-ease);
}


/* ============================================================
   19. PRIMARY CTA
   ============================================================ */

.bd-btn--primary,
.bd-button--primary {
    color:
        var(--bd-on-primary);

    background:
        var(--bd-primary);

    border-color:
        var(--bd-primary);

    box-shadow:
        none;
}


/*
 * Ultra-premium hover:
 * only a subtle transition to deeper forest.
 *
 * No gold border.
 * No glow.
 * No scaling.
 * No visible movement.
 */

.bd-btn--primary:hover,
.bd-button--primary:hover {
    color:
        var(--bd-on-primary);

    background:
        var(--bd-primary-deep);

    border-color:
        var(--bd-primary-deep);

    box-shadow:
        none;
}


/* Active */

.bd-btn--primary:active,
.bd-button--primary:active {
    color:
        var(--bd-on-primary);

    background:
        var(--bd-primary-darkest);

    border-color:
        var(--bd-primary-darkest);
}


/* Focus */

.bd-btn--primary:focus-visible,
.bd-button--primary:focus-visible {
    outline:
        2px solid
        var(--bd-gold);

    outline-offset:
        4px;
}


/* ============================================================
   20. SECONDARY CTA — TEXT / EDITORIAL
   ============================================================ */

/*
 * Secondary CTA intentionally avoids a large outlined box.
 *
 * Example:
 *
 * ZOBACZ KOLEKCJĘ
 * ──────────────
 *
 * No arrow.
 */

.bd-btn--secondary,
.bd-button--secondary {
    position:
        relative;

    width:
        auto;

    min-width:
        0;

    /* Text treatment does not reduce the 44px pointer target. */
    min-height:
        44px;

    padding:
        12px
        1px
        11px;

    color:
        var(--bd-primary);

    background:
        transparent;

    border:
        0;

    border-radius:
        0;

    box-shadow:
        none;

    overflow:
        visible;
}


/* Decorative gold hairline */

.bd-btn--secondary::after,
.bd-button--secondary::after {
    content:
        "";

    position:
        absolute;

    left:
        0;

    bottom:
        4px;

    width:
        100%;

    height:
        1px;

    background:
        var(--bd-gold);

    transform:
        scaleX(0.34);

    transform-origin:
        left center;

    transition:
        transform
        360ms
        var(--bd-ease),

        background-color
        260ms
        var(--bd-ease);
}


/*
 * Secondary hover:
 * very subtle antique-gold text
 * + hairline expands.
 */

.bd-btn--secondary:hover,
.bd-button--secondary:hover {
    color:
        var(--bd-gold-ink);

    background:
        transparent;

    border-color:
        transparent;

    box-shadow:
        none;
}

.bd-btn--secondary:hover::after,
.bd-button--secondary:hover::after {
    background:
        var(--bd-gold);

    transform:
        scaleX(1);
}


/* Active */

.bd-btn--secondary:active,
.bd-button--secondary:active {
    color:
        var(--bd-gold-deep);
}


/* Focus */

.bd-btn--secondary:focus-visible,
.bd-button--secondary:focus-visible {
    outline:
        2px solid
        var(--bd-gold);

    outline-offset:
        5px;
}


/* ============================================================
   21. OPTIONAL OUTLINE CTA
   ============================================================ */

/*
 * For locations where a true secondary rectangular button
 * is required outside of the homepage hero.
 *
 * Do NOT use as the default hero secondary CTA.
 */

.bd-btn--outline,
.bd-button--outline {
    color:
        var(--bd-primary);

    background:
        transparent;

    border-color:
        rgba(15, 52, 42, 0.72);
}

.bd-btn--outline:hover,
.bd-button--outline:hover {
    color:
        var(--bd-primary);

    background:
        rgba(15, 52, 42, 0.035);

    border-color:
        var(--bd-primary);
}


/* ============================================================
   22. DISABLED BUTTONS
   ============================================================ */

.bd-btn:disabled,
.bd-button:disabled,
.bd-btn[aria-disabled="true"],
.bd-button[aria-disabled="true"] {
    color:
        var(--bd-disabled);

    background:
        var(--bd-disabled-surface);

    border-color:
        var(--bd-border);

    opacity:
        1;

    cursor:
        not-allowed;

    pointer-events:
        none;
}


/* ============================================================
   23. CTA GROUP
   ============================================================ */

.bd-actions,
.bd-hero__actions {
    display:
        flex;

    align-items:
        center;

    flex-wrap:
        wrap;

    gap:
        clamp(
            28px,
            3vw,
            48px
        );
}


/* ============================================================
   24. HOMEPAGE HERO CTA ADAPTER
   ============================================================ */

/*
 * The homepage PHP already uses:
 *
 * .bd-hero__actions
 * .bd-btn--primary
 * .bd-btn--ghost
 *
 * This adapter deliberately works with those existing classes.
 * No HTML/PHP change is required.
 *
 * Visual hierarchy:
 * - primary = compact Deep Forest button
 * - ghost   = editorial text action with a restrained gold hairline
 *
 * No arrows, no glow, no scale, no gold primary hover.
 */

.bd-global-header .bd-hero__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap:
        clamp(
            28px,
            2.8vw,
            44px
        );
}


/* Lock hero buttons against older page-specific button geometry. */

.bd-global-header .bd-hero__actions .bd-btn {
    flex: 0 0 auto;

    width: auto;
    max-width: none;
    min-width: 0;

    margin: 0;

    box-shadow: none;
    filter: none;
    transform: none;

    text-decoration: none;
}


/* ------------------------------------------------------------
   HERO PRIMARY — UMÓW KONSULTACJĘ
   ------------------------------------------------------------ */

.bd-global-header .bd-hero__actions .bd-btn--primary {
    min-height: 52px;

    padding:
        0
        27px;

    color: var(--bd-on-primary);

    background: var(--bd-primary);

    border:
        1px solid
        var(--bd-primary);

    border-radius: var(--bd-radius);

    box-shadow: none;
    filter: none;
    transform: none;
}


/* Remove legacy decorative layers from older hero button CSS. */

.bd-global-header .bd-hero__actions .bd-btn--primary::before,
.bd-global-header .bd-hero__actions .bd-btn--primary::after {
    content: none;
    display: none;
}


/*
 * Ultra-premium hover:
 * only a controlled Deep Forest shift.
 */

.bd-global-header .bd-hero__actions .bd-btn--primary:hover {
    color: var(--bd-on-primary);

    background: var(--bd-primary-deep);

    border-color: var(--bd-primary-deep);

    box-shadow: none;
    filter: none;
    transform: none;
}


.bd-global-header .bd-hero__actions .bd-btn--primary:active {
    color: var(--bd-on-primary);

    background: var(--bd-primary-darkest);

    border-color: var(--bd-primary-darkest);

    box-shadow: none;
    filter: none;
    transform: none;
}


.bd-global-header .bd-hero__actions .bd-btn--primary:focus-visible {
    outline:
        2px solid
        var(--bd-gold);

    outline-offset: 4px;
}


/* ------------------------------------------------------------
   HERO GHOST — ZOBACZ KOLEKCJE
   ------------------------------------------------------------ */

/*
 * Existing .bd-btn--ghost becomes a quiet editorial CTA.
 * The rectangular outline is removed entirely in CSS.
 */

.bd-global-header .bd-hero__actions .bd-btn--ghost {
    position: relative;

    width: auto;
    max-width: none;
    min-width: 0;
    min-height: 44px;

    padding:
        11px
        1px
        10px;

    color: var(--bd-primary);

    background: transparent;

    border: 0;
    border-radius: 0;

    box-shadow: none;
    filter: none;
    transform: none;

    overflow: visible;
}


/* Explicitly remove legacy icon/arrow/decorative ::before content. */

.bd-global-header .bd-hero__actions .bd-btn--ghost::before {
    content: none;
    display: none;
}


/* Champagne-gold micro-accent. */

.bd-global-header .bd-hero__actions .bd-btn--ghost::after {
    content: "";

    position: absolute;

    left: 1px;
    bottom: 3px;

    width:
        calc(100% - 2px);

    height: 1px;

    background: var(--bd-gold);

    transform:
        scaleX(0.30);

    transform-origin:
        left center;

    transition:
        transform
        420ms
        var(--bd-ease),

        background-color
        260ms
        var(--bd-ease);
}


/*
 * Hover remains forest; gold stays a micro-accent only.
 * This is intentionally quieter than changing the whole label to gold.
 */

.bd-global-header .bd-hero__actions .bd-btn--ghost:hover {
    color: var(--bd-primary-deep);

    background: transparent;

    border-color: transparent;

    box-shadow: none;
    filter: none;
    transform: none;
}


.bd-global-header .bd-hero__actions .bd-btn--ghost:hover::after {
    background: var(--bd-gold-ink);

    transform:
        scaleX(1);
}


.bd-global-header .bd-hero__actions .bd-btn--ghost:active {
    color: var(--bd-primary-darkest);

    background: transparent;

    box-shadow: none;
    transform: none;
}


.bd-global-header .bd-hero__actions .bd-btn--ghost:focus-visible {
    outline:
        2px solid
        var(--bd-gold);

    outline-offset: 5px;
}


/* ============================================================
   25. SECTION SPACING
   ============================================================ */

.bd-section {
    padding-block:
        var(--bd-section-gap);
}

.bd-section--large {
    padding-block:
        var(--bd-section-gap-lg);
}


/* ============================================================
   26. CONTENT RHYTHM
   ============================================================ */

/* Eyebrow → heading */

.bd-section
> :where(
    .bd-eyebrow,
    .bd-kicker
)
+ :where(
    h1,
    h2,
    h3,
    .bd-display,
    .bd-headline
) {
    margin-top:
        var(--bd-space-md);
}


/* Heading → paragraph */

.bd-section
:where(
    h1,
    h2,
    h3,
    .bd-display,
    .bd-headline
)
+ :where(
    p,
    .bd-body-lg
) {
    margin-top:
        var(--bd-space-lg);
}


/* Paragraph → actions */

.bd-section
:where(
    p,
    .bd-body-lg
)
+ :where(
    .bd-btn,
    .bd-button,
    .bd-actions
) {
    margin-top:
        var(--bd-space-lg);
}


/* ============================================================
   27. TONAL SECTIONS
   ============================================================ */

.bd-tonal {
    background:
        var(--bd-surface-low);
}

.bd-tonal-nude {
    background:
        var(--bd-nude);
}

.bd-tonal-champagne {
    background:
        var(--bd-champagne);
}


/* Dark atelier/editorial section */

.bd-tonal-dark {
    color:
        var(--bd-on-primary);

    background:
        var(--bd-primary-deep);
}

.bd-tonal-dark :where(
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .bd-display,
    .bd-headline
) {
    color:
        var(--bd-on-primary);
}

.bd-tonal-dark :where(
    p,
    .bd-body-lg
) {
    color:
        rgba(251, 249, 245, 0.72);
}


/* ============================================================
   28. BORDERS
   ============================================================ */

.bd-hairline {
    border:
        1px solid
        var(--bd-border);
}

.bd-hairline-strong {
    border:
        1px solid
        var(--bd-border-strong);
}


/* ============================================================
   29. VERTICAL TEXT
   ============================================================ */

.bd-vertical-text {
    writing-mode:
        vertical-rl;

    text-orientation:
        mixed;
}


/* ============================================================
   30. SELECTION
   ============================================================ */

.bd-global-header ::selection {
    color:
        var(--bd-primary-deep);

    background:
        rgba(202, 169, 105, 0.32);
}


/* ============================================================
   31. OPTIONAL PREMIUM SCROLLBAR
   ============================================================ */

@supports selector(::-webkit-scrollbar) {

    .bd-global-header::-webkit-scrollbar {
        width:
            10px;
    }

    .bd-global-header::-webkit-scrollbar-track {
        background:
            var(--bd-surface);
    }

    .bd-global-header::-webkit-scrollbar-thumb {
        background:
            var(--bd-outline-variant);

        border:
            3px solid
            var(--bd-surface);

        border-radius:
            10px;
    }

    .bd-global-header::-webkit-scrollbar-thumb:hover {
        background:
            var(--bd-outline);
    }
}


/* ============================================================
   32. TABLET
   ============================================================ */

@media (max-width: 1024px) {

    :root {

        --bd-section-gap:
            clamp(
                80px,
                9vw,
                112px
            );

        --bd-section-gap-lg:
            clamp(
                96px,
                11vw,
                136px
            );
    }


    .bd-display {
        max-width:
            14ch;
    }

}


/* ============================================================
   33. MOBILE
   ============================================================ */

@media (max-width: 680px) {

    :root {

        --bd-grid-gap:
            18px;

        --bd-gutter:
            20px;

        --bd-section-gap:
            72px;

        --bd-section-gap-lg:
            88px;
    }


    .bd-global-header {
        font-size:
            15px;

        line-height:
            1.68;
    }


    /* Display */

    .bd-display {
        max-width:
            12ch;

        font-size:
            clamp(
                42px,
                12vw,
                56px
            );

        font-weight:
            500;

        letter-spacing:
            -0.038em;

        line-height:
            1;
    }


    /* Section heading */

    .bd-headline {
        max-width:
            15ch;

        font-size:
            clamp(
                34px,
                9.5vw,
                46px
            );

        line-height:
            1.04;
    }


    /* Large body */

    .bd-body-lg {
        max-width:
            100%;

        font-size:
            16px;

        line-height:
            1.7;
    }


    /* Eyebrow */

    .bd-eyebrow {
        font-size:
            10px;

        letter-spacing:
            0.17em;
    }


    /* Buttons */

    .bd-btn,
    .bd-button {
        min-height:
            48px;

        padding-inline:
            21px;

        font-size:
            10px;

        letter-spacing:
            0.12em;
    }


    /*
     * Secondary remains a text CTA, but preserves the 44px pointer target.
     */

    .bd-btn--secondary,
    .bd-button--secondary {
        min-height:
            44px;

        padding:
            11px
            1px
            10px;
    }


    /* Existing homepage ghost CTA uses the same compact editorial treatment. */

    .bd-global-header .bd-hero__actions .bd-btn--ghost {
        min-height: 44px;

        padding:
            10px
            1px
            9px;

        font-size: 10px;

        letter-spacing: 0.12em;
    }


    .bd-global-header .bd-hero__actions .bd-btn--primary {
        min-height: 48px;

        padding-inline: 21px;

        font-size: 10px;

        letter-spacing: 0.12em;
    }


    .bd-actions,
    .bd-hero__actions {
        gap:
            20px
            28px;
    }

}


/* ============================================================
   34. VERY SMALL MOBILE
   ============================================================ */

@media (max-width: 420px) {

    .bd-actions {
        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            20px;
    }


    .bd-btn--primary,
    .bd-button--primary {
        width:
            auto;
    }



    .bd-global-header .bd-hero__actions .bd-btn--primary,
    .bd-global-header .bd-hero__actions .bd-btn--ghost {
        width: auto;
    }

}


/* ============================================================
   35. REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

    html {
        scroll-behavior:
            auto !important;
    }


    .bd-global-header *,
    .bd-global-header *::before,
    .bd-global-header *::after {
        animation-duration:
            0.01ms !important;

        animation-iteration-count:
            1 !important;

        scroll-behavior:
            auto !important;

        transition-duration:
            0.01ms !important;

        transition-delay:
            0ms !important;
    }



    .bd-btn--secondary::after,
    .bd-button--secondary::after,
    .bd-global-header .bd-hero__actions .bd-btn--ghost::after {
        transition: none !important;
    }


    .bd-will-reveal,
    .bd-revealed,
    .bd-global-header [data-parallax] {
        opacity:
            1 !important;

        transform:
            none !important;
    }

}