:root {
    --sa-white: #ffffff;
    --sa-surface: #ffffff;
    --sa-surface-soft: #f7f7f8;
    --sa-surface-deep: #f2f2f4;

    --sa-ink: #1d1d1f;
    --sa-ink-soft: #4b4b50;
    --sa-muted: #6e6e73;

    /* Refined royal-gold: cleaner, less mustard/brown. */
    --sa-gold: #c8a84e;
    --sa-gold-deep: #8f711f;
    --sa-gold-bright: #ead37a;
    --sa-gold-glint: #fff4bd;

    --sa-line: rgba(29, 29, 31, 0.075);

    --sa-paper: #ffffff;
    --sa-cocoa: #343436;
    --sa-champagne: #ead37a;
    --sa-rose: #d6c27e;
    --sa-rose-gold: #d6c27e;

    --sa-container: 1440px;
    --sa-content: 1180px;

    --sa-pad: 18px;
    --sa-header: 66px;

    --sa-display:
        "Avenir Next",
        Avenir,
        "Helvetica Neue",
        "Segoe UI",
        Helvetica,
        Arial,
        sans-serif;

    --sa-sans:
        "Avenir Next",
        Avenir,
        "Helvetica Neue",
        "Segoe UI",
        Helvetica,
        Arial,
        sans-serif;

    --sa-serif: var(--sa-display);

    --sa-gold-shimmer:
        linear-gradient(
            105deg,
            #7f6216 0%,
            #b8902d 20%,
            #ead37a 43%,
            #fff4bd 51%,
            #d4b451 63%,
            #9a781d 82%,
            #7f6216 100%
        );

    --sa-transition: 180ms ease;
}

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

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

body {
    margin: 0;
    background: #ffffff;
    color: var(--sa-ink);
    font-family: var(--sa-sans);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.55;
    letter-spacing: -0.006em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body.sa-menu-open {
    overflow: hidden;
}

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

img { height: auto; }
a { color: inherit; text-decoration: none; }
button,
input,
select,
textarea { font: inherit; }
button { cursor: pointer; }

.sa-main {
    min-height: 60vh;
    background: #ffffff;
}

.sa-content {
    width: min(calc(100% - (var(--sa-pad) * 2)), var(--sa-content));
    margin: 52px auto 76px;
}

.sa-content h1 {
    font-family: var(--sa-display);
    font-size: clamp(38px, 8vw, 66px);
    font-weight: 520;
    line-height: 0.98;
    letter-spacing: -0.048em;
}

.sa-button {
    min-height: 48px;
    padding: 0 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(29, 29, 31, 0.09);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.9);
    color: var(--sa-ink);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    font-size: 11px;
    font-weight: 650;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    transition: transform var(--sa-transition), background var(--sa-transition);
}

.sa-button:hover {
    transform: translateY(-1px);
    background: #ffffff;
}

@media (min-width: 768px) {
    :root { --sa-pad: 30px; }
}

@media (min-width: 1100px) {
    :root {
        --sa-pad: 48px;
        --sa-header: 78px;
    }
}