:root {
    --color-primary: #8c4f00;
    --color-primary-container: #f7941e;
    --color-on-primary: #fff;
    --color-background: #faf9f6;
    --color-surface: #faf9f6;
    --color-on-surface: #1a1c1a;
    --color-on-surface-variant: #544435;
    --color-secondary: #5f5e5e;
    --color-tertiary: #725a3b;
    --color-outline: #877363;
    --color-outline-variant: #dac2af;
    --color-error: #ba1a1a;
    --color-surface-container-lowest: #fff;
    --color-surface-container-low: #f4f3f1;
    --color-surface-container: #efeeeb;
    --color-surface-container-high: #e9e8e5;
    --color-surface-container-highest: #e3e2e0;
    --color-surface-dim: #dbdad7;
    --color-surface-variant: #e3e2e0;

    --font-heading: 'Roboto Mono', Georgia, serif;
    --font-nav: 'Inconsolata', 'Roboto Mono', monospace;
    --font-serif: Georgia, 'Times New Roman', serif;
    --font-body: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --font-signature: 'Caveat', cursive;

    --fs-xs: 0.75rem;
    --fs-sm: 0.875rem;
    --fs-base: 1rem;
    --fs-md: 1.125rem;
    --fs-lg: 1.25rem;
    --fs-xl: 1.5rem;
    --fs-2xl: 1.875rem;
    --fs-3xl: 2.25rem;
    --fs-4xl: 3rem;
    --fs-5xl: 3.75rem;
    --fs-h1: clamp(2rem, 4vw, 2.75rem);
    --fs-h2: clamp(1.375rem, 2.2vw, 1.75rem);
    --fs-h3: clamp(1.0625rem, 1.6vw, 1.25rem);
    --fs-h2-section: clamp(1.75rem, 3.5vw, 2.5rem);

    --lh-tight: 1.1;
    --lh-snug: 1.25;
    --lh-normal: 1.5;
    --lh-relaxed: 1.9;

    --color-body-muted: color-mix(in srgb, var(--color-on-surface) 85%, transparent);
    --color-gold-tint: #ffd70059;

    --ls-tight: -0.01em;
    --ls-normal: 0;
    --ls-wide: 0.05em;
    --ls-wider: 0.15em;
    --ls-widest: 0.3em;

    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-7: 1.75rem;
    --space-8: 2rem;
    --space-9: 2.25rem;
    --space-10: 2.5rem;
    --space-11: 2.75rem;
    --space-12: 3rem;
    --space-13: 3.25rem;
    --space-14: 3.5rem;
    --space-15: 3.75rem;
    --space-16: 4rem;

    /* Reference only. Media queries still use static px values. */
    --bp-sm: 640px;
    --bp-md: 768px;
    --bp-lg: 1024px;
    --bp-xl: 1280px;
}

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

html {
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    font-family: var(--font-body);
    color: var(--color-on-surface);
    background-color: var(--color-background);
    line-height: 1.9;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    font-family: var(--font-heading);
}

p {
    margin-top: 0;
}

/* Default prose links in main content; header/nav/CTA keep their own rules */
:where(.site-main) a {
    color: var(--color-primary-container);
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: color 0.2s ease, text-decoration-color 0.2s ease;
}

:where(.site-main) a:hover,
:where(.site-main) a:focus-visible {
    color: var(--color-primary);
}

img,
svg {
    display: block;
    max-width: 100%;
    height: auto;
}

/* WP-004: Header */
.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.skip-link {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10001;
    transform: translateY(-140%);
    background-color: var(--color-background);
    color: var(--color-primary);
    font-family: var(--font-body);
    font-size: var(--fs-sm);
    letter-spacing: var(--ls-wide);
    text-transform: uppercase;
    text-decoration: none;
    padding: var(--space-3) var(--space-4);
}

.skip-link:focus-visible {
    transform: translateY(0);
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.site-header {
    /* HDR-001 shared header tokens */
    --header-pad-block: clamp(var(--space-4), 2.5vw, var(--space-8));
    --header-pad-block-bottom: clamp(0.8rem, 2vw, 1.6rem);
    --header-pad-block-compact: clamp(var(--space-2), 1.5vw, var(--space-5)); /* used by HDR-005 */
    --header-pad-inline: clamp(var(--space-4), 4vw, var(--space-12));
    --header-trans-fast: 200ms ease-out;
    --header-trans-base: 220ms ease-out;
    --header-trans-layout: 280ms cubic-bezier(.22, .61, .36, 1);
    --header-trans-compact: 320ms cubic-bezier(.22, .61, .36, 1); /* used by HDR-005 */
    --header-trans-spring: 220ms cubic-bezier(.22, .61, .36, 1); /* used by HDR-006 */
    --header-trans-accordion: 260ms ease-out; /* used by HDR-009 */
    --header-trans-scroll-fade: 640ms cubic-bezier(.16, 1, .3, 1); /* Q2 dialogue 2026-05-14 */
    position: fixed; /* §6.3a-fix 2026-05-14: header always fixed, no position flip */
    top: 0;
    left: 0;
    z-index: 1000;
    width: 100%;
    color: var(--color-on-primary);
    transition:
        background-color var(--header-trans-scroll-fade),
        box-shadow var(--header-trans-scroll-fade),
        color var(--header-trans-scroll-fade);
}

.site-header.is-scrolled {
    /* §6.3a 2026-05-14: scroll-state painted; supersedes HDR-004 transparent stance */
    background-color: var(--color-background);
    box-shadow: 0 6px 32px rgba(26, 28, 26, 0.06);
    color: var(--color-on-surface);
}

.site-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(var(--space-6), 2.5vw, var(--space-12));
    max-width: 1920px;
    margin: 0 auto;
    padding: var(--header-pad-block) var(--header-pad-inline) var(--header-pad-block-bottom);
    border-bottom: 1px solid #f7941e4a;
    transition: padding var(--header-trans-scroll-fade);
}

.site-header__logo {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(14.5rem, 38vw);
}

.site-header__logo .custom-logo-link {
    display: inline-flex;
}

.site-header__logo .custom-logo {
    width: auto;
    max-height: clamp(4.2rem, 10.8vw, 6rem);
    margin-inline: auto;
    transition: max-height var(--header-trans-scroll-fade);
}

.site-header__brand {
    display: inline-block;
    margin-inline: auto;
    color: inherit;
    font-family: var(--font-heading);
    font-size: clamp(var(--fs-lg), 2.2vw, var(--fs-2xl));
    text-decoration: none;
    letter-spacing: var(--ls-tight);
}

.site-header.is-scrolled .site-header__inner {
    padding-top: calc(var(--header-pad-block) / 3);
    padding-bottom: calc(var(--header-pad-block) / 3 * 0.8);
}

.site-header.is-scrolled .site-header__logo .custom-logo {
    max-height: clamp(3.4rem, 8.6vw, 6rem);
}

.site-header__content {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    width: min(85vw, 360px);
    padding-top: max(var(--space-6), env(safe-area-inset-top));
    padding-right: var(--space-4);
    padding-bottom: var(--space-6);
    padding-left: var(--space-4);
    gap: var(--space-4);
    overflow-y: auto;
    background-color: color-mix(in srgb, var(--color-on-surface) 88%, transparent);
    transform: translateX(100%);
    transition: transform 320ms cubic-bezier(.22, .61, .36, 1);
    z-index: 1100;
    visibility: hidden;
    min-width: 0;
}

.site-header__topbar {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: var(--space-4);
}

.site-header__editorial {
    display: none;
}

.site-header__topbar-actions {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: var(--space-3);
}

.site-header__instagram {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.75rem;
    min-height: 2.75rem;
    line-height: 1;
    color: inherit;
    text-decoration: none;
}

.site-header__instagram-icon {
    width: 2.5rem;
    height: 2.5rem;
    display: block;
    fill: currentColor;
}

.site-header__cta-wrap {
    display: flex;
    width: 100%;
}

.site-header__cta-menu {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: 0;
    margin: 0;
    list-style: none;
}

/* HDR-008: CTA flying shadow */
.site-header__cta-menu .menu-item > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: var(--space-2) var(--space-4);
    border-radius: 0.125rem;
    font-family: var(--font-body);
    font-size: var(--fs-xs);
    font-weight: 500;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: var(--ls-widest);
    box-shadow: 0 0 0 0 rgba(26, 28, 26, 0);
    transform: translate(0, 0);
    transition: transform var(--header-trans-layout), box-shadow var(--header-trans-layout), color var(--header-trans-fast), background-color var(--header-trans-fast), border-color var(--header-trans-fast);
}

.site-header__cta-menu .menu-item:nth-child(1) > a {
    color: var(--color-on-primary);
    background-color: var(--color-primary-container);
    border: 1px solid var(--color-primary-container);
}

.site-header__cta-menu .menu-item:nth-child(2) > a {
    color: #000;
    background-color: var(--color-primary-container);
    border: 1px solid var(--color-primary-container);
}

.site-header__cta-menu .menu-item:nth-child(3) {
    order: -1;
}

.site-header__cta-menu .menu-item:nth-child(3) > a {
    position: relative;
    min-width: 2.75rem;
    color: transparent;
    background-color: #0c0a09;
    border: 1px solid var(--color-primary-container);
}

.site-header__cta-menu .menu-item:nth-child(3) > a::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 1.35rem;
    height: 1.35rem;
    background-color: var(--color-primary-container);
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23000' stroke-width='1.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M2.25 6.75c0 8.284 6.716 15 15 15h2.25a2.25 2.25 0 0 0 2.25-2.25v-1.372c0-.516-.351-.966-.852-1.091l-4.423-1.106c-.44-.11-.902.055-1.173.417l-.97 1.293c-.282.376-.769.542-1.21.38a12.035 12.035 0 0 1-7.143-7.143c-.162-.441.004-.928.38-1.21l1.293-.97c.363-.271.527-.734.417-1.173L6.963 3.102a1.125 1.125 0 0 0-1.091-.852H4.5A2.25 2.25 0 0 0 2.25 4.5v2.25Z'/%3E%3C/svg%3E");
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23000' stroke-width='1.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M2.25 6.75c0 8.284 6.716 15 15 15h2.25a2.25 2.25 0 0 0 2.25-2.25v-1.372c0-.516-.351-.966-.852-1.091l-4.423-1.106c-.44-.11-.902.055-1.173.417l-.97 1.293c-.282.376-.769.542-1.21.38a12.035 12.035 0 0 1-7.143-7.143c-.162-.441.004-.928.38-1.21l1.293-.97c.363-.271.527-.734.417-1.173L6.963 3.102a1.125 1.125 0 0 0-1.091-.852H4.5A2.25 2.25 0 0 0 2.25 4.5v2.25Z'/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
}

/* Buzz Out (Hover.css, Ian Lunn) — auto-plays on Learn to Sew after 100px scroll */
@keyframes altbes-buzz-out {
    10% {
        transform: translateX(3px) rotate(2deg);
    }

    20% {
        transform: translateX(-3px) rotate(-2deg);
    }

    30% {
        transform: translateX(3px) rotate(2deg);
    }

    40% {
        transform: translateX(-3px) rotate(-2deg);
    }

    50% {
        transform: translateX(2px) rotate(1deg);
    }

    60% {
        transform: translateX(-2px) rotate(-1deg);
    }

    70% {
        transform: translateX(2px) rotate(1deg);
    }

    80% {
        transform: translateX(-2px) rotate(-1deg);
    }

    90% {
        transform: translateX(1px) rotate(0);
    }

    100% {
        transform: translateX(-1px) rotate(0);
    }
}

.site-header__cta-menu .menu-item > a:hover,
.site-header__cta-menu .menu-item > a:focus-visible {
    box-shadow: -10px 10px 28px rgba(26, 28, 26, 0.22);
    transform: translate(3px, -3px);
}

.site-header__cta-menu a[href*="learn-to-sew"].is-buzz-out-playing {
    animation: altbes-buzz-out 0.75s linear 1;
}

.site-header__cta-menu .menu-item > a:active {
    box-shadow: 0 4px 12px rgba(26, 28, 26, 0.15);
    transform: translate(0, 0);
    transition: transform var(--header-trans-fast), box-shadow var(--header-trans-fast);
}

.site-header__phone {
    display: inline-flex;
    align-items: center;
    color: inherit;
    font-family: var(--font-body);
    font-size: var(--fs-sm);
    font-weight: 500;
    letter-spacing: var(--ls-wide);
    text-decoration: none;
    text-transform: uppercase;
    width: 100%;
}

.site-nav__row {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.site-nav {
    width: 100%;
    border-top: 0;
}

.site-nav__list {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    list-style: none;
    margin: 0;
    padding: 0;
}

.site-nav__list.is-open {
    transform: none;
}

.site-nav__list li > a {
    display: block;
    color: inherit;
    font-family: var(--font-nav);
    font-size: clamp(var(--fs-base), 2.2vw, var(--fs-lg));
    text-decoration: none;
    line-height: var(--lh-snug);
    padding-bottom: var(--space-1);
    border-bottom: 2px solid transparent;
}

.site-nav__list :is(.current-menu-item, .current-menu-ancestor, .current-menu-parent, .current_page_item, .current_page_parent, .current_page_ancestor) > a {
    color: var(--color-primary-container);
    border-bottom-color: var(--color-primary-container);
}

.site-nav__list > .menu-item > a {
    position: relative;
    transition: color var(--header-trans-fast);
}

.site-nav__list > .menu-item > a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: currentColor;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform var(--header-trans-base);
}

.site-nav__list > .menu-item:not(:is(.current-menu-item, .current-menu-ancestor, .current-menu-parent, .current_page_item, .current_page_parent, .current_page_ancestor)) > a:hover,
.site-nav__list > .menu-item:not(:is(.current-menu-item, .current-menu-ancestor, .current-menu-parent, .current_page_item, .current_page_parent, .current_page_ancestor)) > a:focus-visible {
    color: var(--color-primary-container);
}

.site-nav__list > .menu-item:not(:is(.current-menu-item, .current-menu-ancestor, .current-menu-parent, .current_page_item, .current_page_parent, .current_page_ancestor)) > a:hover::after,
.site-nav__list > .menu-item:not(:is(.current-menu-item, .current-menu-ancestor, .current-menu-parent, .current_page_item, .current_page_parent, .current_page_ancestor)) > a:focus-visible::after,
.site-nav__list > :is(.current-menu-item, .current-menu-ancestor, .current-menu-parent, .current_page_item, .current_page_parent, .current_page_ancestor) > a::after {
    transform: scaleX(1);
}

.site-nav__list > :is(.current-menu-item, .current-menu-ancestor, .current-menu-parent, .current_page_item, .current_page_parent, .current_page_ancestor) > a {
    border-bottom-color: transparent;
}

.site-nav__list > .menu-item-has-children {
    position: relative;
    padding-right: calc(var(--space-8) + var(--space-2));
}

.site-nav__list > .menu-item-has-children > .sub-menu {
    max-height: 0;
    overflow: hidden;
    list-style: none;
    margin: 0;
    padding: 0 0 0 var(--space-3);
    transition: max-height var(--header-trans-accordion);
}

.site-nav__list > .menu-item-has-children.is-open > .sub-menu {
    max-height: 24rem;
}

.site-nav__list > li#menu-item-279 > .sub-menu > li > a {
    padding-top: var(--space-3);
    padding-bottom: var(--space-3);
}

.site-nav__list > li#menu-item-279 > .sub-menu > li:not(:last-child) > a {
    border-bottom: 1px solid color-mix(in srgb, #fff 22%, transparent);
}

.site-nav__sub-toggle {
    position: absolute;
    top: 0;
    right: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    transition: transform var(--header-trans-accordion);
}

.site-nav__sub-toggle::before {
    content: "\25BE";
    font-size: var(--fs-sm);
    line-height: 1;
}

.site-nav__list > .menu-item-has-children.is-open > .site-nav__sub-toggle {
    transform: rotate(180deg);
}

.site-nav__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-end;
    min-width: 2.75rem;
    min-height: 2.75rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font-size: var(--fs-2xl);
    line-height: 1;
}

.site-nav__toggle {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    gap: var(--space-2);
    min-width: 2.75rem;
    min-height: 2.75rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
}

.site-nav__toggle-bar {
    display: block;
    width: 1.75rem;
    height: 2px;
    background-color: currentColor;
}

body.is-open {
    overflow: hidden;
}

body.is-open .site-header__content {
    transform: translateX(0);
    visibility: visible;
}

.site-nav__backdrop {
    position: fixed;
    inset: 0;
    z-index: 1099;
    background: rgba(26, 28, 26, 0.45);
    opacity: 0;
    pointer-events: none;
    transition: opacity 280ms ease-out;
}

body.is-open .site-nav__backdrop {
    opacity: 1;
    pointer-events: auto;
}

@media (max-width: 1279px) {
    .site-header.is-scrolled .site-header__editorial {
        max-height: 0;
        opacity: 0;
    }
}

.site-header a:focus-visible,
.site-header button:focus-visible,
.site-header input:focus-visible,
.site-header select:focus-visible,
.site-header textarea:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

@media (min-width: 768px) {
    .site-header__inner {
        align-items: flex-start;
    }

    .site-header__logo {
        align-self: flex-start;
        margin-top: calc(-1 * var(--header-pad-block));
        height: var(--logo-height, clamp(4.2rem, 10.8vw, 6rem));
        width: auto;
        max-width: min(14.5rem, 28vw);
        justify-content: flex-start;
        align-items: flex-start;
        transition: margin var(--header-trans-scroll-fade);
    }

    .site-header.is-scrolled .site-header__logo {
        padding-top: 10px;
        margin: 0;
    }

    .site-header__logo .custom-logo-link {
        display: flex;
        align-items: flex-start;
        height: 100%;
    }

    .site-header__logo .custom-logo {
        height: 100%;
        max-height: none;
        width: auto;
        max-width: 100%;
        margin-top: 4px;
        margin-inline: 0;
        object-fit: contain;
        object-position: left top;
    }

    .site-header__content {
        position: static;
        display: flex;
        flex: 1 1 auto;
        width: auto;
        padding: 0;
        overflow: visible;
        background: transparent;
        transform: none;
        transition: none;
        visibility: visible;
        z-index: auto;
    }

    .site-header__topbar {
        flex-wrap: wrap;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: var(--space-3) var(--space-5);
        order: 1;
    }

    .site-header__editorial {
        display: block;
        flex: 1 1 100%;
        margin: 0;
        color: inherit;
        font-family: var(--font-heading);
        font-size: var(--fs-sm);
        font-style: italic;
        line-height: var(--lh-snug);
        max-height: 6rem;
        overflow: hidden;
        opacity: 1;
        transition: max-height var(--header-trans-scroll-fade), opacity var(--header-trans-scroll-fade);
    }

    .site-header__topbar-actions {
        flex: 1 1 100%;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: var(--space-3) var(--space-4);
    }

    .site-header__cta-wrap {
        width: auto;
    }

    .site-header__cta-menu {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .site-header__cta-menu .menu-item > a {
        width: auto;
    }

    .site-nav__row {
        position: relative;
        align-items: flex-start;
        justify-content: space-between;
        flex-direction: row;
        gap: var(--space-4);
        order: 2;
    }

    .site-nav {
        padding-top: var(--space-4);
        border-top: 1px solid color-mix(in srgb, var(--color-on-primary) 30%, transparent);
    }

    .site-header.is-scrolled .site-nav {
        padding-top: calc(var(--space-4) / 2);
    }

    .site-nav__list {
        position: static;
        flex-direction: row;
        align-items: center;
        gap: var(--space-6);
        background-color: transparent;
        transform: none;
        opacity: 1;
        pointer-events: auto;
        visibility: visible;
        padding: 0;
        transition: none;
    }

    .site-header.is-scrolled .site-header__cta-menu .menu-item:nth-child(3) > a {
        border: 1px solid var(--color-primary-container);
    }

    .site-header .site-nav__list > .menu-item-has-children {
        position: relative;
        padding-right: 0;
    }

    .site-header .site-nav__list > .menu-item-has-children > .sub-menu {
        position: absolute;
        top: calc(100% + var(--space-2));
        left: 0;
        z-index: 10;
        min-width: 12rem;
        margin: 0;
        padding: var(--space-2);
        list-style: none;
        border-radius: var(--radius-md, 0.5rem);
        background-color: var(--color-background);
        color: var(--color-on-surface);
        box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
        opacity: 0;
        visibility: hidden;
        transform: translateY(-4px);
        pointer-events: none;
        transition:
            opacity var(--header-trans-spring),
            transform var(--header-trans-spring),
            visibility 0s linear var(--header-trans-spring),
            pointer-events 0s linear var(--header-trans-spring);
        max-height: none;
        overflow: visible;
    }

    /* Bug-101 fix */
    .site-header .site-nav__list > .menu-item-has-children > .sub-menu::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 100%;
        height: var(--space-2);
        background: transparent;
    }

    .site-header .site-nav__list > .menu-item-has-children:hover > .sub-menu,
    .site-header .site-nav__list > .menu-item-has-children:focus-within > .sub-menu,
    .site-header .site-nav__list > .menu-item-has-children.is-open > .sub-menu {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
        pointer-events: auto;
        transition:
            opacity var(--header-trans-spring),
            transform var(--header-trans-spring),
            visibility 0s linear 0s,
            pointer-events 0s linear 0s;
    }

    .site-header .site-nav__list > .menu-item-has-children > .sub-menu > li > a {
        display: block;
        padding: var(--space-2) var(--space-3);
        border-bottom-color: transparent;
        color: var(--color-on-surface);
        font-family: var(--font-nav);
        font-size: var(--fs-sm);
        letter-spacing: var(--ls-normal);
        text-transform: none;
        white-space: nowrap;
    }

    .site-header .site-nav__list > li#menu-item-279 > .sub-menu > li > a {
        padding-top: var(--space-4);
        padding-bottom: var(--space-4);
    }

    .site-header .site-nav__list > li#menu-item-279 > .sub-menu > li:not(:last-child) > a {
        border-bottom: 1px solid color-mix(in srgb, #fff 22%, transparent);
    }

    .site-header .site-nav__list > .menu-item-has-children > .sub-menu > li > a:hover,
    .site-header .site-nav__list > .menu-item-has-children > .sub-menu > li > a:focus-visible {
        color: var(--color-primary-container);
    }

    .site-header .site-nav__list > .menu-item-has-children > .sub-menu :is(.current-menu-item, .current-menu-ancestor, .current-menu-parent, .current_page_item, .current_page_parent, .current_page_ancestor) > a {
        color: var(--color-primary-container);
        border-bottom-color: var(--color-primary-container);
    }

    .site-nav__toggle {
        display: none;
    }

    .site-nav__close,
    .site-nav__sub-toggle,
    .site-nav__backdrop {
        display: none;
    }

    .site-header__phone {
        width: auto;
    }
}

@media (min-width: 1280px) {
    .site-header__topbar {
        flex-wrap: nowrap;
    }

    .site-header__editorial {
        flex: 1 1 auto;
    }

    .site-header__topbar-actions {
        flex: 0 1 auto;
        justify-content: flex-end;
    }
}

/* HDR-010: consolidated reduced-motion overrides */
@media (prefers-reduced-motion: reduce) {
    .site-header,
    .site-header__inner,
    .site-header__logo .custom-logo,
    .site-header__editorial,
    .site-header__content,
    .site-header__cta-menu .menu-item > a,
    .site-nav__list > .menu-item > a,
    .site-nav__list > .menu-item > a::after,
    .site-nav__list > .menu-item-has-children > .sub-menu,
    .site-nav__sub-toggle,
    .site-nav__backdrop,
    .site-header .site-nav__list > .menu-item-has-children > .sub-menu {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }

    .site-header .site-nav__list > .menu-item-has-children > .sub-menu,
    .site-header .site-nav__list > .menu-item-has-children:hover > .sub-menu,
    .site-header .site-nav__list > .menu-item-has-children:focus-within > .sub-menu,
    .site-header .site-nav__list > .menu-item-has-children.is-open > .sub-menu {
        transform: none;
    }

    .site-header__content,
    body.is-open .site-header__content {
        transform: none;
    }

    .site-header__cta-menu .menu-item > a,
    .site-header__cta-menu .menu-item > a:hover,
    .site-header__cta-menu .menu-item > a:focus-visible,
    .site-header__cta-menu .menu-item > a:active,
    .site-header__cta-menu a[href*="learn-to-sew"].is-buzz-out-playing {
        animation: none;
    }

    .site-nav__list > .menu-item > a::after {
        transition: none;
    }
}

/* WP-004.1: Front-page hero slot (widget area for plugin carousels) */
.site-front-hero {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0;
}

.site-front-hero__bib-badge {
    position: absolute;
    top: calc(var(--site-header-height, clamp(5rem, 10vw, 8rem)) + var(--space-3));
    right: var(--header-pad-inline, clamp(1rem, 4vw, 3rem));
    z-index: 900;
    pointer-events: auto;
}

.site-front-hero__bib-badge-link {
    display: block;
    color: inherit;
    text-decoration: none;
}

.site-front-hero__bib-badge-image {
    display: block;
    width: clamp(5rem, 14vw, 12.5rem);
    height: auto;
    border: 0;
}

.site-front-hero__bib-badge-caption {
    display: block;
    margin-top: var(--space-2);
    font-family: var(--font-body);
    font-size: var(--fs-xs);
    line-height: 1.25;
    letter-spacing: var(--ls-wide);
    text-align: center;
    text-transform: uppercase;
    color: var(--color-on-primary);
    text-shadow: 0 1px 8px rgba(26, 28, 26, 0.45);
}

.site-front-hero__bib-badge-caption-line {
    display: block;
}

@media (max-width: 767px) {
    .site-front-hero__bib-badge {
        transform: translateX(20%);
    }

    .site-front-hero__bib-badge-caption {
        font-size: calc(var(--fs-xs) * 0.6);
    }
}

.site-front-hero__widget {
    margin: 0;
    padding: 0;
}

.site-front-hero__widget > .widget-title {
    display: none;
}

/* WP-005a: Home → Intro */
.home-intro {
    padding: clamp(4rem, 6vw, 8rem) clamp(1.25rem, 4vw, 3rem);
    background: linear-gradient(
        to bottom,
        var(--color-gold-tint) 0%,
        var(--color-gold-tint) 87.5%,
        var(--color-surface-container-lowest) 100%
    );
}

.home-intro__container {
    max-width: 1720px;
    margin: 0 auto;
}

.home-intro__columns {
    display: grid;
    grid-template-columns: 1fr;
    align-items: start;
    gap: clamp(2rem, 4vw, 4rem);
}

.home-intro__text {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.home-intro__eyebrow,
.home-intro__partners-eyebrow {
    margin: 0;
    font-family: var(--font-body);
    font-size: var(--fs-sm);
    letter-spacing: var(--ls-widest);
    text-transform: uppercase;
    color: var(--color-on-surface-variant);
}

.home-intro__heading {
    font-family: var(--font-heading);
    font-size: clamp(2rem, 4vw, 3.25rem);
    line-height: var(--lh-tight);
    color: var(--color-on-surface);
}

.home-intro__subheading {
    margin: 0;
    font-family: var(--font-body);
    font-size: clamp(var(--fs-md), 1.5vw, var(--fs-lg));
    line-height: 1.9;
    color: var(--color-body-muted);
}

.home-intro__body p {
    margin: 0;
    font-size: clamp(1rem, 1.2vw, 1.25rem);
    line-height: 1.9;
    color: var(--color-body-muted);
    font-weight: 300;
}

.home-intro__body p + p {
    margin-top: var(--space-6);
}

.home-intro__media {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
    align-items: start;
}

.home-intro__image {
    margin: 0;
    overflow: hidden;
    background: var(--color-surface-container-lowest);
}

.home-intro__image-img {
    width: 100%;
    height: auto;
    display: block;
    box-shadow: 0 18px 42px color-mix(in srgb, var(--color-outline-variant) 24%, transparent);
}

.home-intro__awards {
    margin: 0;
    padding: 0;
    list-style: none;
}

.home-intro__awards {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.home-intro__award {
    width: clamp(6rem, 11vw, 8.8125rem);
    aspect-ratio: 1 / 1;
}

.home-intro__award-link {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    padding: var(--space-2);
    background: transparent;
    border: 1px solid var(--color-on-surface);
    text-decoration: none;
}

.home-intro__award-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    max-height: 100%;
}

.home-intro__partners {
    margin-top: clamp(3rem, 6vw, 6rem);
    padding-top: clamp(2rem, 4vw, 4rem);
}

.home-intro__partners-eyebrow {
    text-align: center;
    margin-bottom: var(--space-10);
    font-size: clamp(var(--fs-md), 1.6vw, var(--fs-xl));
    letter-spacing: var(--ls-wider);
    color: var(--color-on-surface);
}

.home-intro__partners-shortcode {
    width: 100%;
    margin: 0;
    padding: 0;
}

.home-intro__partners-shortcode > * {
    margin: 0;
}

/* CAR-002: Partners carousel */
.home-intro__partners-carousel {
    --partner-logo-height: 100px;
    --partners-track-gap: 4px;
    --partners-tick-distance: 100px;
    --partners-dots-gap: 0.375rem;
    --partners-dots-margin-top: 0.5rem;
    width: 100%;
}

.home-intro__partners-viewport {
    width: 100%;
    overflow: hidden;
}

.home-intro__partners-dots {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: var(--partners-dots-gap);
    margin: var(--partners-dots-margin-top) 0 0;
    padding: 0;
    list-style: none;
}

.home-intro__partners-dot {
    width: 0.375rem;
    height: 0.375rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: color-mix(in srgb, var(--color-on-surface) 30%, transparent);
    cursor: pointer;
    transition: background-color var(--header-trans-fast), transform var(--header-trans-fast);
}

.home-intro__partners-dot:hover,
.home-intro__partners-dot:focus-visible {
    background: color-mix(in srgb, var(--color-primary-container) 65%, transparent);
    outline: none;
}

.home-intro__partners-dot:focus-visible {
    box-shadow: 0 0 0 1px var(--color-primary-container);
}

.home-intro__partners-dot.is-active {
    background: var(--color-primary-container);
    transform: scale(1.2);
}

.home-intro__partners-carousel.is-static .home-intro__partners-dots {
    display: none;
}

.home-intro__partners-track {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: var(--partners-track-gap);
    will-change: transform;
}

.home-intro__partners-track.is-animating {
    transition: transform 500ms ease;
}

.home-intro__partner {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.home-intro__partner-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    height: var(--partner-logo-height);
    line-height: 0;
    text-decoration: none;
}

.home-intro__partner-image {
    display: block;
    flex-shrink: 0;
    width: auto;
    height: var(--partner-logo-height);
    max-height: var(--partner-logo-height);
    max-width: none;
    object-fit: contain;
    object-position: center;
    filter: grayscale(100%);
    opacity: 0.7;
    transition: filter 500ms ease, opacity 500ms ease;
}

.home-intro__partner-link:hover .home-intro__partner-image,
.home-intro__partner-link:focus-visible .home-intro__partner-image {
    filter: grayscale(0);
    opacity: 1;
}

@media (min-width: 768px) {
    .home-intro__partners-carousel {
        --partners-track-gap: 6px;
        --partners-dots-gap: 0.5625rem;
        --partners-dots-margin-top: 0.75rem;
    }

    .home-intro__partners-dot {
        width: 0.5625rem;
        height: 0.5625rem;
    }
}

@media (max-width: 767px) {
    .site-header__instagram {
        align-self: flex-start;
        justify-content: flex-start;
    }

    .home-intro__partners-carousel {
        --partner-logo-height: 72px;
        --partners-track-gap: 4px;
        --partners-tick-distance: 100px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .home-intro__partners-track.is-animating {
        transition: none;
    }

    .home-intro__partner-image {
        transition: none;
    }
}

/* WP-005b: Home → Services */
.home-services {
    padding: clamp(4rem, 6vw, 8rem) clamp(1.25rem, 4vw, 3rem);
    background: var(--color-surface-container-lowest);
}

.home-services__container {
    max-width: 1720px;
    margin: 0 auto;
}

.home-services__columns {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(2rem, 4vw, 4rem);
    align-items: start;
}

@media (min-width: 1024px) {
    .home-services__columns {
        /*
         * `minmax(0, 1fr)` forces strictly equal 50/50 columns. Without the
         * minmax(0,…) fallback, intrinsic min-content of slider plugin markup
         * (e.g. Smart Slider 3) can blow up the left column.
         */
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }
}

.home-services__media {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    width: 100%;
    min-width: 0;
}

.home-services__slider {
    position: relative;
    width: 100%;
    min-height: 280px;
    border-radius: 0.5rem;
    overflow: hidden;
    background: var(--color-surface-container);
    box-shadow: 0 8px 30px color-mix(in srgb, var(--color-on-surface) 8%, transparent);
}

.home-services__slider > * {
    margin: 0;
}

/*
 * Defensive override for Smart Slider 3 "Full width" mode (data-responsive="fullwidth").
 * The plugin uses <ss3-force-full-width> to break out of the parent container and stretch
 * to body width, which collapses height inside our two-column layout. Force the wrapper to
 * stay inside its slot so the slider sizes correctly relative to our container.
 */
.home-services__slider ss3-force-full-width {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    left: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.home-services__slider .n2-section-smartslider {
    width: 100% !important;
    max-width: 100% !important;
}

.home-services__text {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    min-width: 0;
}

.home-services__eyebrow {
    font-family: var(--font-body);
    text-transform: uppercase;
    letter-spacing: var(--ls-widest);
    font-size: var(--fs-sm);
    color: var(--color-on-surface-variant);
    margin: 0;
}

.home-services__heading {
    font-family: var(--font-heading);
    font-size: var(--fs-h2-section);
    line-height: var(--lh-tight);
    color: var(--color-on-surface);
    margin: 0;
}

.home-services__subheading {
    font-family: var(--font-body);
    font-size: clamp(1rem, 1.2vw, 1.125rem);
    line-height: var(--lh-snug);
    color: var(--color-on-surface-variant);
    margin: 0;
}

.home-services__body {
    font-family: var(--font-body);
    font-size: clamp(1rem, 1.1vw, 1.125rem);
    line-height: 1.9;
    color: var(--color-body-muted);
}

.home-services__body p {
    margin: 0 0 var(--space-4);
    font-weight: 300;
}

.home-services__body ul,
.home-services__body ol {
    padding-left: 1.5rem;
    margin: 0 0 var(--space-4);
}

.home-services__body li {
    margin-bottom: var(--space-2);
    line-height: var(--lh-relaxed);
}

.home-services__body li::marker {
    color: color-mix(in srgb, var(--color-primary) 70%, transparent);
}

.home-services__body h3,
.home-services__body h4 {
    font-family: var(--font-heading);
    color: var(--color-on-surface);
    margin: var(--space-6) 0 var(--space-3);
}

.home-services__body h3 {
    font-size: var(--fs-h3);
}

@media (max-width: 767px) {
    .home-intro__awards {
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: space-between;
        gap: var(--space-2);
    }

    .home-intro__award {
        flex: 1 1 0;
        width: auto;
        min-width: 0;
    }
}

@media (min-width: 768px) {
    .home-intro__media {
        grid-template-columns: 1fr auto;
        gap: var(--space-8);
    }
}

@media (min-width: 1024px) {
    .home-intro__columns {
        grid-template-columns: 1.1fr 0.9fr;
    }
}

/* WP-005c: Home → Gallery */
.home-gallery {
    padding: clamp(4rem, 6vw, 8rem) clamp(1.25rem, 4vw, 3rem);
    background: linear-gradient(
        to bottom,
        var(--color-surface-container-lowest) 0%,
        var(--color-gold-tint) 12.5%,
        var(--color-gold-tint) 87.5%,
        var(--color-surface-container-lowest) 100%
    );
    border-top: 1px solid color-mix(in srgb, var(--color-on-surface) 6%, transparent);
    position: relative;
    z-index: 1;
}

.home-gallery__container {
    max-width: 1720px;
    margin: 0 auto;
}

.home-gallery__header {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    margin-bottom: clamp(2rem, 3vw, 3rem);
    text-align: center;
}

.home-gallery__eyebrow {
    font-family: var(--font-body);
    text-transform: uppercase;
    letter-spacing: var(--ls-widest);
    font-size: var(--fs-sm);
    color: var(--color-on-surface-variant);
    margin: 0;
}

.home-gallery__heading {
    font-family: var(--font-heading);
    font-size: var(--fs-h2-section);
    line-height: var(--lh-tight);
    color: var(--color-on-surface);
    margin: 0;
}

.home-gallery__subheading {
    font-family: var(--font-body);
    font-size: clamp(1rem, 1.2vw, 1.125rem);
    line-height: var(--lh-snug);
    color: var(--color-on-surface-variant);
    margin: 0 auto;
    max-width: 60ch;
}

.home-gallery__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
    list-style: none;
    margin: 0;
    padding: 0;
}

@media (min-width: 640px) {
    .home-gallery__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 768px) {
    .home-gallery__grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.home-gallery__item {
    margin: 0;
    padding: 0;
}

.home-gallery__figure {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    border-radius: 0.25rem;
    box-shadow: 0 8px 24px color-mix(in srgb, var(--color-on-surface) 12%, transparent);
    margin: 0;
    background: var(--color-surface-container);
}

.home-gallery__image {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    transition: transform 700ms ease;
}

.home-gallery__figure:hover .home-gallery__image,
.home-gallery__figure:focus-within .home-gallery__image {
    transform: scale(1.06);
}

.home-gallery__overlay {
    position: absolute;
    inset: 0;
    background: color-mix(in srgb, var(--color-on-surface) 0%, transparent);
    transition: background-color 500ms ease;
    pointer-events: none;
}

.home-gallery__figure:hover .home-gallery__overlay,
.home-gallery__figure:focus-within .home-gallery__overlay {
    background: color-mix(in srgb, var(--color-on-surface) 18%, transparent);
}

@media (prefers-reduced-motion: reduce) {
    .home-intro__partners-track.is-animating,
    .home-intro__partner-image,
    .home-gallery__image,
    .home-gallery__overlay {
        transition: none;
    }

    .home-gallery__figure:hover .home-gallery__image,
    .home-gallery__figure:focus-within .home-gallery__image {
        transform: none;
    }
}

/* WP-005d: Home → Philosophy */
.home-philosophy {
    padding: clamp(4rem, 6vw, 8rem) clamp(1.25rem, 4vw, 3rem);
    background: var(--color-surface-container-lowest);
    border-top: 1px solid color-mix(in srgb, var(--color-on-surface) 6%, transparent);
    position: relative;
    z-index: 1;
}

.home-philosophy__container {
    max-width: 1720px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: clamp(2.5rem, 4vw, 4rem);
}

/*
 * Full-width section header (eyebrow + H2 heading) — sticky at the top of
 * the section so the title stays in view throughout the right-column scroll.
 */
.home-philosophy__section-head {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

@media (min-width: 1024px) {
    .home-philosophy__section-head {
        position: sticky;
        top: 5.5rem; /* clears the ~80 px fixed header + breathing room */
        z-index: 2;
        background: var(--color-surface-container-lowest);
        padding-bottom: var(--space-6);
    }
}

.home-philosophy__eyebrow {
    font-family: var(--font-body);
    text-transform: uppercase;
    letter-spacing: var(--ls-widest);
    font-size: var(--fs-sm);
    color: var(--color-primary);
    font-weight: 600;
    margin: 0;
}

.home-philosophy__heading {
    font-family: var(--font-heading);
    font-size: calc(var(--fs-h2-section) - 2px);
    line-height: var(--lh-tight);
    color: var(--color-on-surface);
    margin: 0;
}

/* Two-column body below the section header */
.home-philosophy__columns {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(3rem, 5vw, 6rem);
    align-items: start;
}

@media (min-width: 1024px) {
    .home-philosophy__columns {
        grid-template-columns: 2fr 3fr;
    }
}

/*
 * Left column — sticky on desktop so the subheading / decorative rule
 * stays visible while the right-column list scrolls past.
 */
.home-philosophy__sticky {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

@media (min-width: 1024px) {
    .home-philosophy__sticky {
        position: sticky;
        top: 14rem; /* below the sticky section-head */
    }
}

.home-philosophy__subheading {
    font-family: var(--font-body);
    font-size: clamp(1.2rem, 1.44vw, 1.35rem);
    line-height: calc(var(--lh-snug) * 1.5);
    color: var(--color-on-surface-variant);
    margin: 0;
}

.home-philosophy__rule {
    display: none;
    width: 4rem;
    height: 1px;
    background: color-mix(in srgb, var(--color-on-surface) 25%, transparent);
}

@media (min-width: 1024px) {
    .home-philosophy__rule {
        display: block;
    }
}

/* Right column — numbered advantage list */
.home-philosophy__list {
    display: flex;
    flex-direction: column;
    gap: clamp(3rem, 5vw, 5rem);
}

.home-philosophy__list--empty {
    display: none;
}

.home-philosophy__item {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

@media (max-width: 767px) {
    .home-philosophy__item {
        display: grid;
        grid-template-columns: auto 1fr;
        column-gap: var(--space-4);
        row-gap: var(--space-4);
        align-items: start;
    }

    .home-philosophy__checkbox {
        grid-column: 1;
        grid-row: 1;
        width: auto;
    }
}

@media (min-width: 768px) {
    .home-philosophy__item {
        flex-direction: row;
        gap: clamp(2rem, 4vw, 3.5rem);
        align-items: flex-start;
    }

    .home-philosophy__item-body {
        padding-top: 0.5rem;
    }
}

.home-philosophy__checkbox {
    flex-shrink: 0;
    box-sizing: border-box;
    --philosophy-check-bg: var(--color-background);
    --philosophy-check-size: 50px;
    --philosophy-check-color: var(--color-on-surface);
}

.home-philosophy__checkbox input[type="checkbox"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.home-philosophy__checkbox .check-box {
    height: var(--philosophy-check-size);
    width: var(--philosophy-check-size);
    background-color: transparent;
    border: calc(var(--philosophy-check-size) * 0.1) solid var(--color-on-surface);
    border-radius: 5px;
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    cursor: default;
    user-select: none;
}

.home-philosophy__checkbox .check-box::before,
.home-philosophy__checkbox .check-box::after {
    box-sizing: border-box;
    position: absolute;
    height: 0;
    width: calc(var(--philosophy-check-size) * 0.12);
    background-color: var(--philosophy-check-color);
    display: inline-block;
    transform-origin: left top;
    border-radius: 5px;
    content: "";
    transition: opacity 0.5s ease, background-color 0.2s ease;
}

.home-philosophy__checkbox .check-box::before {
    top: calc(var(--philosophy-check-size) * 0.72);
    left: calc(var(--philosophy-check-size) * 0.41);
    box-shadow: 0 0 0 calc(var(--philosophy-check-size) * 0.05) var(--philosophy-check-bg);
    transform: rotate(-135deg);
}

.home-philosophy__checkbox .check-box::after {
    top: calc(var(--philosophy-check-size) * 0.37);
    left: calc(var(--philosophy-check-size) * 0.05);
    transform: rotate(-45deg);
}

.home-philosophy__checkbox .check-box.checked {
    border-color: var(--philosophy-check-color);
}

.home-philosophy__checkbox .check-box.checked::after {
    height: calc(var(--philosophy-check-size) / 2);
    animation: home-philosophy-check-bottom 0.2s ease 0s forwards;
}

.home-philosophy__checkbox .check-box.checked::before {
    height: calc(var(--philosophy-check-size) * 1.2);
    animation: home-philosophy-check-top 0.4s ease 0s forwards;
}

.home-philosophy__item:hover .home-philosophy__checkbox,
.home-philosophy__item:focus-within .home-philosophy__checkbox,
.home-philosophy__item:active .home-philosophy__checkbox {
    --philosophy-check-color: var(--color-primary-container);
}

.home-philosophy__item:hover .home-philosophy__checkbox .check-box,
.home-philosophy__item:focus-within .home-philosophy__checkbox .check-box,
.home-philosophy__item:active .home-philosophy__checkbox .check-box {
    border-color: var(--color-primary-container);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-primary-container) 35%, transparent);
}

@keyframes home-philosophy-check-bottom {
    from {
        height: 0;
    }

    to {
        height: calc(var(--philosophy-check-size) / 2);
    }
}

@keyframes home-philosophy-check-top {
    0% {
        height: 0;
    }

    50% {
        height: 0;
    }

    100% {
        height: calc(var(--philosophy-check-size) * 1.2);
    }
}

.home-philosophy__item-body {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    min-width: 0;
}

.home-philosophy__item-title {
    font-family: var(--font-heading);
    font-size: var(--fs-h3);
    line-height: var(--lh-tight);
    color: var(--color-on-surface);
    margin: 0;
    letter-spacing: -0.01em;
}

.home-philosophy__item-text {
    font-family: var(--font-body);
    font-size: clamp(1.1rem, 1.21vw, 1.2375rem);
    line-height: 1.9;
    color: var(--color-body-muted);
}

.home-philosophy__item-text p {
    margin: 0 0 var(--space-4);
    font-weight: 300;
}

.home-philosophy__item-text p:last-child {
    margin-bottom: 0;
}

@media (max-width: 767px) {
    .home-philosophy__item-body {
        display: contents;
        padding: 0;
        gap: 0;
    }

    .home-philosophy__item-title {
        grid-column: 2;
        grid-row: 1;
        align-self: center;
        padding-left: 4px;
        text-align: left;
    }

    .home-philosophy__item-text {
        grid-column: 1 / -1;
        grid-row: 2;
        padding-left: 4px;
        text-align: left;
    }
}

@media (prefers-reduced-motion: reduce) {
    .home-philosophy__checkbox .check-box.checked::before,
    .home-philosophy__checkbox .check-box.checked::after {
        animation: none;
    }

    .home-philosophy__checkbox .check-box,
    .home-philosophy__checkbox .check-box::before,
    .home-philosophy__checkbox .check-box::after {
        transition: none;
    }
}

/* WP-005e: Home → Press Mentions */
.home-press {
    padding: clamp(4rem, 6vw, 8rem) clamp(1.25rem, 4vw, 3rem);
    background: linear-gradient(
        to bottom,
        var(--color-surface-container-lowest) 0%,
        var(--color-gold-tint) 12.5%,
        var(--color-gold-tint) 100%
    );
    border-top: 1px solid color-mix(in srgb, var(--color-on-surface) 6%, transparent);
    position: relative;
    z-index: 1;
}

.home-press__container {
    max-width: 1720px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: clamp(2.5rem, 4vw, 4rem);
}

.home-press__header {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.home-press__eyebrow {
    font-family: var(--font-body);
    text-transform: uppercase;
    letter-spacing: var(--ls-widest);
    font-size: var(--fs-sm);
    color: var(--color-on-surface-variant);
    margin: 0;
}

.home-press__heading {
    font-family: var(--font-heading);
    font-size: var(--fs-h2-section);
    line-height: var(--lh-tight);
    color: var(--color-on-surface);
    margin: 0;
}

.home-press__subheading {
    font-family: var(--font-body);
    font-size: clamp(1rem, 1.2vw, 1.125rem);
    line-height: var(--lh-snug);
    color: var(--color-on-surface-variant);
    margin: 0;
    max-width: 60ch;
}

/* Card grid */
.home-press__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8, 2rem);
    list-style: none;
    margin: 0;
    padding: 0;
}

@media (min-width: 640px) {
    .home-press__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .home-press__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.home-press__item {
    margin: 0;
    padding: 0;
}

.home-press__card {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--color-surface-container-lowest);
    border-bottom: 1px solid color-mix(in srgb, var(--color-on-surface) 8%, transparent);
    box-shadow: 0 4px 16px color-mix(in srgb, var(--color-on-surface) 8%, transparent);
    border-radius: 0.25rem;
    overflow: hidden;
    transition: box-shadow 300ms ease, transform 300ms ease, border-color 300ms ease;
}

.home-press__card:hover,
.home-press__card:focus-within {
    border-color: var(--color-primary);
    box-shadow: 0 8px 32px color-mix(in srgb, var(--color-on-surface) 14%, transparent);
    transform: translateY(-4px);
}

/* Featured image */
.home-press__image-link {
    display: block;
    overflow: hidden;
}

.home-press__image-wrap {
    overflow: hidden;
    width: 100%;
    height: 350px;
    position: relative;
    background: var(--color-surface-container-lowest);
}

.home-press__image {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: auto;
    height: 100%;
    max-width: none;
    object-fit: none;
    transition: none;
}

/* Card body */
.home-press__card-body {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    padding: var(--space-6) var(--space-6) var(--space-6);
    flex: 1;
}

.home-press__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
}

.home-press__source {
    font-family: var(--font-body);
    font-size: var(--fs-sm);
    text-transform: uppercase;
    letter-spacing: var(--ls-widest);
    color: var(--color-on-surface-variant);
    font-weight: 500;
}

.home-press__date {
    font-family: var(--font-body);
    font-size: var(--fs-sm);
    color: var(--color-on-surface-variant);
    white-space: nowrap;
}

.home-press__title {
    font-family: var(--font-heading);
    font-size: var(--fs-h3);
    line-height: var(--lh-tight);
    color: var(--color-on-surface);
    margin: 0;
    letter-spacing: -0.01em;
}

.home-press__title-link {
    color: inherit;
    text-decoration: none;
    transition: color 300ms ease;
}

.home-press__title-link:hover,
.home-press__title-link:focus-visible {
    color: var(--color-primary);
}

.home-press__excerpt {
    font-family: var(--font-body);
    font-size: clamp(0.9rem, 1vw, 1rem);
    line-height: 1.9;
    color: var(--color-body-muted);
    margin: 0;
    font-weight: 300;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Overflow items (4+) — hidden by default; revealed when grid has .is-expanded */
.home-press__grid [data-press-hidden] {
    display: none;
}

.home-press__grid.is-expanded [data-press-hidden] {
    display: block;
}

/* "Show all / Show less" CTA */
.home-press__cta {
    display: flex;
    justify-content: center;
    padding-top: var(--space-6);
}

.home-press__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-family: var(--font-body);
    font-size: var(--fs-base);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: var(--ls-widest);
    color: var(--color-on-surface);
    text-decoration: none;
    background: transparent;
    border: 1px solid var(--color-on-surface);
    padding: var(--space-3) var(--space-8);
    cursor: pointer;
    transition: color 300ms ease, border-color 300ms ease, background-color 300ms ease;
}

.home-press__btn:hover,
.home-press__btn:focus-visible {
    color: var(--color-primary);
}

@media (prefers-reduced-motion: reduce) {
    .home-press__image,
    .home-press__card,
    .home-press__title-link,
    .home-press__btn {
        transition: none;
    }

    .home-press__card:hover,
    .home-press__card:focus-within {
        transform: none;
    }
}

/* =========================================================
   WP-006: Footer
   ========================================================= */
.site-footer {
    background: #0c0a09;
    color: #a8a29e;
    padding-top: clamp(3rem, 6vw, 6rem);
    padding-bottom: clamp(1.5rem, 3vw, 3rem);
    font-family: var(--font-sans);
    font-size: 0.875rem;
    line-height: 1.6;
}

.site-footer__inner {
    max-width: 1920px;
    margin-inline: auto;
    padding-inline: clamp(1.5rem, 3vw, 3rem);
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(2.5rem, 4vw, 4rem);
}

@media (min-width: 1024px) {
    .site-footer__inner {
        grid-template-columns: 1fr 1fr;
    }
}

.site-footer__left {
    display: flex;
    flex-direction: column;
    gap: clamp(1.5rem, 3vw, 2.5rem);
}

.site-footer__brand {
    display: block;
}

.site-footer__brand--text {
    font-family: var(--font-serif);
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    color: #fafaf9;
    letter-spacing: 0.1em;
}

.site-footer__brand--logo img {
    display: block;
    max-height: 5rem;
    width: auto;
    /* Invert logo to white for dark background if needed */
    filter: brightness(0) invert(1);
}

.site-footer__brand--logo a {
    display: inline-block;
    line-height: 0;
}

.site-footer__info {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(1.5rem, 3vw, 3rem);
}

@media (min-width: 640px) {
    .site-footer__info {
        grid-template-columns: 1fr 1fr;
    }
}

.site-footer__col {
    display: flex;
    flex-direction: column;
    gap: var(--space-6, 1.5rem);
}

.site-footer__section-label {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--color-primary);
    margin: 0 0 var(--space-4, 1rem);
}

.site-footer__address,
.site-footer__phone,
.site-footer__email {
    margin: 0;
    color: #d6d3d1;
}

.site-footer__phone a,
.site-footer__email a {
    color: inherit;
    text-decoration: none;
}

.site-footer__phone a:hover,
.site-footer__phone a:focus-visible,
.site-footer__email a:hover,
.site-footer__email a:focus-visible {
    color: var(--color-primary);
    text-decoration: underline;
}

.site-footer__sitemap-link {
    color: var(--color-primary-container);
    text-decoration: none;
}

.site-footer__sitemap-link:hover,
.site-footer__sitemap-link:focus-visible {
    color: var(--color-primary);
    text-decoration: underline;
}

.site-footer__brand--logo a {
    color: inherit;
    text-decoration: none;
}

.site-footer__hours-block {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.site-footer__hours {
    list-style: none;
    margin: 0;
    padding: 0;
}

.site-footer__hours-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    padding-bottom: 0.375rem;
    margin-top: 0.5rem;
    border-bottom: 1px solid #292524;
}

.site-footer__hours-row:first-child {
    margin-top: 0;
}

.site-footer__hours-row:last-child {
    border-bottom: none;
}

.site-footer__hours-day {
    color: #a8a29e;
    white-space: nowrap;
}

.site-footer__hours-time {
    color: #e7e5e4;
    text-align: right;
}

.site-footer__hours-note {
    margin: var(--space-4, 1rem) 0 0;
    color: #a8a29e;
    font-size: var(--fs-sm);
    line-height: var(--lh-snug);
}

.site-footer__transport p {
    margin: 0;
    color: #a8a29e;
}

.site-footer__copyright {
    margin-top: auto;
    padding-top: var(--space-8, 2rem);
    border-top: 1px solid #292524;
    color: #78716c;
    font-size: 0.75rem;
    letter-spacing: 0.08em;
}

.site-footer__copyright p {
    margin: 0;
}

.site-footer__copyright p + p {
    margin-top: 0.5rem;
}

.site-footer__right {
    position: relative;
    min-height: 400px;
}

@media (min-width: 1024px) {
    .site-footer__right {
        min-height: 500px;
    }
}

.site-footer__map {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: inherit;
    overflow: hidden;
}

.site-footer__map iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    filter: grayscale(1) contrast(1.1) opacity(0.85);
}

.site-footer__map-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    background: color-mix(in srgb, var(--color-primary) 5%, transparent);
    mix-blend-mode: overlay;
}

.site-footer__visit {
    position: absolute;
    bottom: 1.5rem;
    right: 1.5rem;
    z-index: 2;
    background: #0c0a09;
    padding: 1.25rem 1.5rem;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.6);
}

.site-footer__visit-label {
    font-weight: 700;
    font-size: 1.0625rem;
    letter-spacing: -0.02em;
    color: var(--color-primary-container);
    text-transform: uppercase;
    margin: 0;
}

.site-footer__visit-subtitle {
    font-size: 0.6875rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #78716c;
    margin: 0.25rem 0 0;
}

@media (prefers-reduced-motion: reduce) {
    :where(.site-main) a,
    .site-footer__phone a,
    .site-footer__email a,
    .site-footer__sitemap-link {
        transition: none;
    }
}

/* =========================================================
   WP-007: Inner page — solid header modifier
   ========================================================= */

.site-header--solid {
    color: var(--color-on-surface);
}

/* Ensure nav links are readable on solid bg (CTA menu keeps its own colors) */
.site-header--solid .site-nav__list a,
.site-header--solid .site-header__instagram,
.site-header--solid .site-header__editorial,
.site-header--solid .site-header__phone {
    color: var(--color-on-surface);
}

.site-header--solid .site-header__cta-menu a[href*="learn-to-sew"],
.site-header.is-scrolled .site-header__cta-menu a[href*="learn-to-sew"] {
    color: #000;
}

.site-header--solid .site-header__cta-menu .menu-item:nth-child(3) > a,
.site-header.is-scrolled .site-header__cta-menu .menu-item:nth-child(3) > a {
    color: transparent;
    background-color: #0c0a09;
    border-color: var(--color-primary-container);
}

/* Bug-102 fix */
@media (max-width: 767px) {
    .site-header--solid .site-header__content,
    .site-header--solid .site-header__content .site-nav__list a,
    .site-header--solid .site-header__content .site-header__instagram,
    .site-header--solid .site-header__content .site-header__editorial,
    .site-header--solid .site-header__content .site-header__phone {
        color: var(--color-on-primary);
    }

    .site-header--solid .site-header__content .site-header__cta-menu a[href*="learn-to-sew"] {
        color: #000;
    }

    .site-header--solid .site-header__content .site-header__cta-menu .menu-item:nth-child(3) > a {
        color: transparent;
        background-color: #0c0a09;
        border-color: var(--color-primary-container);
    }
}

/* Active nav — same color and underline as hover, overrides solid-header link colors */
.site-header--solid .site-nav__list :is(.current-menu-item, .current-menu-ancestor, .current-menu-parent, .current_page_item, .current_page_parent, .current_page_ancestor) > a {
    color: var(--color-primary-container);
    border-bottom-color: var(--color-primary-container);
}

.site-header--solid .site-nav__list > :is(.current-menu-item, .current-menu-ancestor, .current-menu-parent, .current_page_item, .current_page_parent, .current_page_ancestor) > a {
    border-bottom-color: transparent;
}

@media (max-width: 767px) {
    .site-header--solid .site-header__content .site-nav__list :is(.current-menu-item, .current-menu-ancestor, .current-menu-parent, .current_page_item, .current_page_parent, .current_page_ancestor) > a {
        color: var(--color-primary-container);
        border-bottom-color: var(--color-primary-container);
    }

    .site-header--solid .site-header__content .site-nav__list > :is(.current-menu-item, .current-menu-ancestor, .current-menu-parent, .current_page_item, .current_page_parent, .current_page_ancestor) > a {
        border-bottom-color: transparent;
    }
}

/* =========================================================
   WP-007: Inner page — layout
   ========================================================= */

/* Offset for fixed header height */
.page-wrap {
    padding-top: clamp(5rem, 10vw, 8rem);
}

/* Page banner — breadcrumbs band */
.page-banner {
    background: var(--color-surface-container-lowest);
    border-bottom: 1px solid var(--color-surface-container);
    padding-block: clamp(2rem, 4vw, 4rem);
}

.page-banner__inner {
    max-width: 1280px;
    margin-inline: auto;
    padding-inline: clamp(1.5rem, 4vw, 3rem);
}

/* Breadcrumbs slot */
.page-breadcrumbs {
    margin-bottom: 0;
    font-size: 0.8125rem;
    color: var(--color-on-surface-muted, #6b7280);
}

.page-breadcrumbs .widget {
    display: inline;
}

/* Main content area */
.page-content {
    padding-block: clamp(1.75rem, 3.5vw, 3.5rem) clamp(2.5rem, 5vw, 5rem);
}

.page-content__inner {
    max-width: 900px;
    margin-inline: auto;
    padding-inline: clamp(1.5rem, 4vw, 3rem);
}

@media (max-width: 767px) {
    .page-content__inner {
        padding-inline: clamp(0.75rem, 2vw, 1.5rem);
    }
}

.page-article__body h1 {
    margin: 30px 0 15px;
    font-size: var(--fs-h1);
    line-height: var(--lh-tight);
}

/* Page article typography */
.page-article__body {
    font-family: var(--font-sans);
    font-size: 1rem;
    line-height: 1.75;
    color: var(--color-on-surface);
}

.page-article__body h2,
.page-article__body h3,
.page-article__body h4 {
    font-family: var(--font-heading);
    font-weight: 400;
    margin-top: 2em;
    margin-bottom: 0.75em;
    line-height: 1.25;
    color: var(--color-on-surface);
}

.page-article__body h2 { font-size: var(--fs-h2); }
.page-article__body h3 { font-size: var(--fs-h3); }

.page-article__body p {
    margin-top: 0;
    margin-bottom: 1.25em;
}

/* About page closing signature: "Respectfully," + "Zlata Ksen" */
.page-article__body p.preFade.fadeIn:has(em),
.page-article__body p.preFade.fadeIn:has(+ p.preFade.fadeIn em),
.page-article__body p:has(+ h2:last-child),
.page-article__body p + h2:last-child {
    font-family: var(--font-signature);
    font-size: 2.5em;
    line-height: 1.35;
}

.page-article__body p.preFade.fadeIn em {
    font-family: inherit;
    font-style: normal;
    font-weight: 400;
    font-size: inherit;
    line-height: inherit;
}

.page-article__body ul,
.page-article__body ol {
    padding-left: 1.5rem;
    margin-bottom: 1.25em;
}

.page-article__body li {
    margin-bottom: 0.375em;
}

.page-article__body blockquote {
    border-left: 3px solid var(--color-primary);
    margin-left: 0;
    padding-left: 1.25rem;
    color: var(--color-on-surface-muted, #6b7280);
    font-style: italic;
}

.page-article__body img {
    max-width: 100%;
    height: auto;
    border-radius: 0.25rem;
}

/* Tables — light row rules only; hover = golden text */
.page-article__body .wp-block-table {
    margin-top: 1.5rem;
    margin-bottom: 2rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.page-article__body .wp-block-table table {
    margin: 0;
}

.page-article__body table {
    width: 100%;
    min-width: min(100%, 36rem);
    border-collapse: collapse;
    font-size: 0.9375rem;
    line-height: 1.5;
    background: transparent;
    border: none;
}

.page-article__body thead th {
    font-family: var(--font-serif);
    font-weight: 600;
    font-size: 0.8125rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-align: left;
    color: var(--color-on-surface);
    background: transparent;
    border-bottom: 1px solid color-mix(in srgb, var(--color-outline) 55%, transparent);
    padding: 0.75rem 1rem 0.625rem;
    transition: color 0.15s ease;
}

.page-article__body tbody th {
    font-weight: 600;
    text-align: left;
    padding: 0.625rem 1rem;
    border-bottom: 1px solid color-mix(in srgb, var(--color-outline) 45%, transparent);
    vertical-align: top;
    background: transparent;
}

.page-article__body td {
    padding: 0.625rem 1rem;
    border-bottom: 1px solid color-mix(in srgb, var(--color-outline) 45%, transparent);
    vertical-align: top;
    background: transparent;
    transition: color 0.15s ease;
}

.page-article__body tbody tr:hover td,
.page-article__body tbody tr:hover th {
    color: var(--color-primary);
}

.page-article__body thead tr:hover th {
    color: var(--color-primary);
}

.page-article__body td:last-child,
.page-article__body th:last-child {
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.page-article__body td:first-child,
.page-article__body th:first-child {
    text-align: left;
}

@media (max-width: 639px) {
    .page-article__body table {
        font-size: 0.875rem;
    }

    .page-article__body td,
    .page-article__body th {
        padding: 0.5rem 0.75rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .page-article__body td,
    .page-article__body thead th {
        transition: none;
    }
}

/* =========================================================
   Wide editorial layout — all static WordPress pages (body.page-altbes-wide)
   Max-width 1080, banner, typography, price-style tables & .price-grid.
   body.page-price-layout — fixed nav dock + extra content end padding.
   body.page-wedding-dresses-layout — single-column .price-grid on that page.
   ========================================================= */

.page-altbes-wide .page-wrap {
    background: linear-gradient(
        185deg,
        color-mix(in srgb, var(--color-outline-variant) 18%, var(--color-background)) 0%,
        var(--color-background) min(32rem, 55vw),
        var(--color-background) 100%
    );
}

.page-altbes-wide .page-banner {
    background: transparent;
    border-bottom: none;
    padding-block: clamp(1rem, 2.5vw, 1.75rem);
}

.page-altbes-wide .page-banner__inner {
    max-width: 1080px;
}

.page-altbes-wide .page-content {
    padding-block: clamp(1.225rem, 2.8vw, 2.45rem) clamp(1.75rem, 4vw, 3.5rem);
}

.page-altbes-wide .page-content__inner {
    max-width: 1080px;
}

.page-price-layout .page-content__inner {
    /* Keep text clear of the fixed right navigation tab / panel */
    padding-inline-end: max(clamp(1.5rem, 4vw, 3rem), 2.75rem);
}

@media (max-width: 767px) {
    .page-price-layout .page-content__inner {
        padding-inline: clamp(0.75rem, 2vw, 1.5rem);
    }
}

@media (min-width: 768px) {
    .page-price-layout .page-content__inner {
        padding-inline-end: max(clamp(1.5rem, 4vw, 3rem), 3.5rem);
    }
}

.page-altbes-wide .page-article__body {
    font-family: var(--font-body);
    font-size: 1.0625rem;
    line-height: 1.78;
    color: color-mix(in srgb, var(--color-on-surface-variant) 88%, var(--color-on-surface));
}

/* Lead intro */
.page-altbes-wide .page-article__body > p:first-of-type {
    max-width: 52ch;
    margin-bottom: clamp(2rem, 5vw, 3rem);
    padding-left: clamp(1rem, 2vw, 1.25rem);
    border-left-width: 3px;
    border-left-style: solid;
    border-left-color: #b8874f;
    border-left-color: color-mix(in srgb, var(--color-primary) 55%, var(--color-outline-variant));
    font-size: 1.125rem;
    line-height: 1.68;
    color: color-mix(in srgb, var(--color-on-surface) 82%, var(--color-on-surface-variant));
}

/* Smooth scroll; fixed right “Price navigation” dock (see block 1 HTML) */
html:has(body.page-altbes-wide) {
    scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
    html:has(body.page-altbes-wide) {
        scroll-behavior: auto;
    }
}

body.page-altbes-wide {
    /* Extra 50px so anchor targets sit slightly below the header band */
    scroll-padding-top: calc(50px + clamp(7.5rem, 20vh, 11rem));
}

/* Fixed right edge: vertical label; <details> + assets/js/price-nav-dock.js (outside click closes) */
.page-price-layout .price-nav-dock {
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 92;
    max-height: 100dvh;
    box-sizing: border-box;
    padding-right: max(0px, env(safe-area-inset-right, 0px));
}

.page-price-layout .price-nav-dock__details {
    display: flex;
    flex-direction: row-reverse;
    align-items: stretch;
    max-height: inherit;
}

.page-price-layout .price-nav-dock__trigger {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-width: 2.75rem;
    max-width: 2.75rem;
    margin: 0;
    padding: 0.65rem 0.25rem;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    cursor: pointer;
    font-family: var(--font-heading);
    font-size: 0.5625rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #000000;
    background: #ffe450;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid color-mix(in srgb, var(--color-outline-variant) 45%, transparent);
    border-right: none;
    border-radius: 0.65rem 0 0 0.65rem;
    box-shadow:
        -4px 4px 20px color-mix(in srgb, var(--color-on-surface) 8%, transparent),
        -2px 0 12px color-mix(in srgb, var(--color-on-surface) 5%, transparent);
    transition:
        color 0.15s ease,
        background-color 0.15s ease;
}

.page-price-layout .price-nav-dock__trigger::-webkit-details-marker {
    display: none;
}

.page-price-layout .price-nav-dock__trigger::marker {
    content: "";
}

.page-price-layout .price-nav-dock__trigger:hover,
.page-price-layout .price-nav-dock__trigger:focus-visible {
    color: #000000;
    background-color: #ffe450;
    outline: none;
}

.page-price-layout .price-nav-dock__details[open] .price-nav-dock__trigger {
    color: #000000;
    border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-outline-variant));
}

.page-price-layout .price-nav-dock__panel {
    box-sizing: border-box;
    min-width: min(13.5rem, calc(100vw - 4rem));
    max-width: min(14.5rem, calc(100vw - 4rem));
    max-height: min(62vh, 22rem);
    padding: 0.4rem 0.45rem 0.45rem 0.55rem;
    overflow-y: auto;
    margin: 0;
    background: color-mix(in srgb, var(--color-background) 96%, transparent);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid color-mix(in srgb, var(--color-outline-variant) 42%, transparent);
    border-right: none;
    border-radius: 0.5rem 0 0 0.5rem;
    box-shadow:
        -6px 6px 24px color-mix(in srgb, var(--color-on-surface) 10%, transparent);
}

.page-price-layout .price-nav-dock__list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
}

.page-price-layout .price-nav-dock__list a {
    display: block;
    padding: 0.28rem 0.38rem;
    font-size: 0.625rem;
    font-weight: 600;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    text-decoration: none;
    color: color-mix(in srgb, var(--color-on-surface) 76%, transparent);
    border-radius: 0.25rem;
    transition: color 0.45s ease;
}

.page-price-layout .price-nav-dock__list a:hover,
.page-price-layout .price-nav-dock__list a:focus-visible {
    color: var(--color-primary);
    transition: color 0.12s ease;
    outline: none;
}

@media (max-width: 767px) {
    .page-price-layout .price-nav-dock {
        top: auto;
        bottom: max(1rem, env(safe-area-inset-bottom, 0px));
        transform: none;
        right: max(0px, env(safe-area-inset-right, 0px));
    }

    .page-price-layout .price-nav-dock__details {
        flex-direction: column-reverse;
        align-items: flex-end;
    }

    .page-price-layout .price-nav-dock__trigger {
        writing-mode: horizontal-tb;
        max-width: none;
        min-width: auto;
        width: auto;
        padding: 0.45rem 0.85rem;
        border-right: 1px solid color-mix(in srgb, var(--color-outline-variant) 45%, transparent);
        border-radius: 2rem;
        box-shadow:
            0 4px 16px color-mix(in srgb, var(--color-on-surface) 10%, transparent);
    }

    .page-price-layout .price-nav-dock__panel {
        margin-bottom: 0.35rem;
        border-right: 1px solid color-mix(in srgb, var(--color-outline-variant) 42%, transparent);
        border-radius: 0.65rem;
        max-height: min(50vh, 18rem);
    }
}

/* Legacy inline TOC (optional past HTML) */
.page-altbes-wide .price-toc {
    margin: 0 0 clamp(1.25rem, 3vw, 2rem);
}

.page-altbes-wide .page-article__body h2[id] {
    scroll-margin-top: calc(50px + clamp(7.5rem, 20vh, 11rem));
}

.page-altbes-wide .price-addendum[id] {
    scroll-margin-top: calc(50px + clamp(7.5rem, 20vh, 11rem));
}

/* Section headings — default spacing on wide pages */
.page-altbes-wide .page-article__body h2 {
    margin-top: 2em;
    margin-bottom: 1rem;
    padding-bottom: 0;
    border-bottom: none;
    font-family: var(--font-heading);
    font-size: var(--fs-h2);
    font-weight: 600;
    letter-spacing: var(--ls-tight);
    text-transform: none;
    color: color-mix(in srgb, var(--color-on-surface) 72%, transparent);
}

.page-price-layout .page-article__body h2 {
    letter-spacing: var(--ls-wider);
    text-transform: uppercase;
}

.page-altbes-wide .page-article__body > h2:first-of-type,
.page-altbes-wide .page-article__body h2:first-of-type {
    margin-top: 0;
}

/* Two-column category grid (paste .price-grid + .price-section in Custom HTML block 2) */
.page-altbes-wide .price-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(1.25rem, 3vw, 2rem);
    margin-top: 0.5rem;
    margin-bottom: clamp(2rem, 4vw, 2.75rem);
    min-width: 0;
}

@media (min-width: 768px) {
    .page-altbes-wide .price-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    /* Wedding dresses page: same markup as Price but single column */
    .page-wedding-dresses-layout .price-grid {
        grid-template-columns: 1fr;
    }
}

/* Card wrapper: Core table block or loose Custom HTML tables (not .price-grid / .price-addendum) */
.page-altbes-wide .page-article__body .wp-block-table,
.page-altbes-wide .page-article__body .wp-block-html:has(table):not(:has(.price-addendum)):not(:has(.price-grid)) {
    margin-top: 0.5rem;
    margin-bottom: clamp(2rem, 4vw, 2.75rem);
    padding: clamp(0.5rem, 1.5vw, 0.75rem);
    border-radius: 0.875rem;
    background: color-mix(in srgb, var(--color-surface-container-lowest) 94%, transparent);
    border: 1px solid color-mix(in srgb, var(--color-outline-variant) 42%, transparent);
    box-shadow:
        0 1px 2px color-mix(in srgb, var(--color-on-surface) 4%, transparent),
        0 12px 36px color-mix(in srgb, var(--color-on-surface) 5%, transparent);
}

.page-price-layout .page-article__body .price-grid .price-section > h2,
.page-wedding-dresses-layout .page-article__body .price-grid .price-section > h2,
.page-altbes-wide .page-article__body .price-grid .price-section > h2 {
    margin-top: 10px;
    margin-bottom: 1rem;
    font-size: var(--fs-h2);
    width: 100%;
    text-align: center;
}

@media (min-width: 768px) {
    .page-price-layout .page-article__body .price-grid .price-section > h2,
    .page-wedding-dresses-layout .page-article__body .price-grid .price-section > h2,
    .page-altbes-wide .page-article__body .price-grid .price-section > h2 {
        display: block;
        min-height: 70px;
        padding-top: 1.35rem;
        text-align: center;
    }
}

/* Category blocks: card chrome */
.page-altbes-wide .price-grid .price-section {
    margin: 8px 4px;
    padding: 20px 12px;
    border-radius: 0.875rem;
    background: #fff;
    border: none;
    box-shadow:
        0 1px 2px color-mix(in srgb, var(--color-on-surface) 4%, transparent),
        0 8px 24px color-mix(in srgb, var(--color-on-surface) 8%, transparent);
    transition: box-shadow 0.25s ease;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.page-altbes-wide .price-grid .price-section:hover {
    box-shadow:
        0 2px 8px color-mix(in srgb, var(--color-primary-container) 25%, transparent),
        0 12px 36px color-mix(in srgb, var(--color-primary-container) 40%, transparent);
}

.page-altbes-wide .page-article__body table {
    font-size: 1rem;
    line-height: 1.58;
}

.page-altbes-wide .page-article__body thead th {
    font-family: var(--font-heading);
    font-weight: 600;
    font-size: 0.6875rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    padding: 0.5rem 1rem 0.75rem;
    border-bottom: 1px solid color-mix(in srgb, var(--color-outline) 28%, transparent);
    color: color-mix(in srgb, var(--color-on-surface) 52%, transparent);
}

.page-altbes-wide .page-article__body tbody th {
    padding: 0.8125rem 1rem;
    font-weight: 400;
    border-bottom: 1px solid color-mix(in srgb, var(--color-outline) 22%, transparent);
}

.page-altbes-wide .page-article__body td {
    padding: 0.8125rem 1rem;
    border-bottom: 1px solid color-mix(in srgb, var(--color-outline) 22%, transparent);
}

.page-altbes-wide .page-article__body tbody tr {
    transition:
        background-color 0.2s ease,
        color 0.2s ease;
}

.page-altbes-wide .page-article__body tbody tr:hover {
    background-color: color-mix(in srgb, var(--color-primary) 6%, transparent);
}

.page-altbes-wide .page-article__body td:first-child {
    color: color-mix(in srgb, var(--color-on-surface) 86%, var(--color-on-surface-variant));
    font-weight: 400;
}

.page-altbes-wide .page-article__body td:last-child {
    font-weight: 600;
    font-size: 1.0625rem;
    letter-spacing: 0.02em;
    color: color-mix(in srgb, var(--color-on-surface) 92%, transparent);
}

.page-altbes-wide .page-article__body tbody tr:hover td:first-child,
.page-altbes-wide .page-article__body tbody tr:hover td:last-child,
.page-altbes-wide .page-article__body tbody tr:hover th {
    color: var(--color-primary);
}

/* Price grid: row hover = text color only; slower color return when pointer leaves */
.page-altbes-wide .price-grid .price-section tbody tr:hover {
    background-color: transparent;
}

.page-altbes-wide .price-grid .price-section tbody tr {
    transition: none;
}

.page-altbes-wide .price-grid .price-section tbody th,
.page-altbes-wide .price-grid .price-section tbody td {
    transition: color 0.55s ease;
}

.page-altbes-wide .price-grid .price-section tbody tr:hover th,
.page-altbes-wide .price-grid .price-section tbody tr:hover td {
    transition: color 0.12s ease;
    color: var(--color-primary);
}

.page-altbes-wide .page-article__body tbody tr:last-child th,
.page-altbes-wide .page-article__body tbody tr:last-child td {
    border-bottom: none;
}

/* Manual HTML: additional charges & policies */
.page-altbes-wide .price-addendum {
    margin-top: clamp(3rem, 8vw, 5.5rem);
    padding: clamp(1.75rem, 4vw, 2.75rem);
    border-radius: 1rem;
    background: linear-gradient(
        168deg,
        color-mix(in srgb, var(--color-surface-container-low) 100%, var(--color-surface-container-lowest)) 0%,
        var(--color-surface-container-lowest) 55%
    );
    border: 1px solid color-mix(in srgb, var(--color-outline-variant) 48%, transparent);
    box-shadow:
        0 1px 3px color-mix(in srgb, var(--color-on-surface) 6%, transparent),
        0 16px 48px color-mix(in srgb, var(--color-on-surface) 6%, transparent);
}

.page-altbes-wide .price-addendum h2 {
    margin-top: 0;
    margin-bottom: 1.35rem;
    padding-bottom: 0;
    border-bottom: none;
    font-family: var(--font-heading);
    font-size: var(--fs-h2);
    font-weight: 500;
    letter-spacing: var(--ls-tight);
    text-transform: none;
    color: var(--color-on-surface);
    display: block;
}

.page-price-layout .price-addendum h2 {
    text-transform: uppercase;
    letter-spacing: var(--ls-wider);
    font-weight: 600;
}

.page-altbes-wide .price-addendum table {
    margin-bottom: 1.35rem;
}

.page-altbes-wide .price-addendum .price-addendum__notes {
    font-size: 0.9375rem;
    line-height: 1.72;
    color: color-mix(in srgb, var(--color-on-surface-variant) 94%, var(--color-on-surface));
}

.page-altbes-wide .price-addendum .price-addendum__notes p {
    margin-top: 0;
    margin-bottom: 1em;
}

.page-altbes-wide .price-addendum .price-addendum__notes p:last-child {
    margin-bottom: 0;
}

@media (max-width: 639px) {
    .page-altbes-wide .page-article__body .wp-block-table,
    .page-altbes-wide .page-article__body .wp-block-html:has(table):not(:has(.price-addendum)):not(:has(.price-grid)) {
        padding: 0.375rem;
        border-radius: 0.625rem;
    }

    .page-altbes-wide .page-article__body table {
        font-size: 0.9375rem;
    }

    .page-altbes-wide .page-article__body td,
    .page-altbes-wide .page-article__body tbody th,
    .page-altbes-wide .page-article__body thead th {
        padding-left: 0.25rem;
        padding-right: 0.25rem;
    }

    .page-altbes-wide .price-addendum {
        padding: 1.35rem 1.15rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .page-altbes-wide .page-article__body tbody tr {
        transition: none;
    }

    .page-altbes-wide .price-grid .price-section tbody th,
    .page-altbes-wide .price-grid .price-section tbody td,
    .page-price-layout .price-nav-dock__list a {
        transition: none;
    }
}

/* Multi-page post navigation */
.page-links {
    margin-top: 2rem;
    padding-top: 1rem;
    border-top: 1px solid var(--color-surface-container);
    font-size: 0.875rem;
}