:root {
    --crm-color-gold: #c6a75e;
    --crm-color-forest: #1e3a34;
    --crm-color-sand: #e8d8c3;
    --crm-color-olive: #7b754c;

    --crm-color-cream: #f4e6d2;
    --crm-color-paper: #f0dfc8;
    --crm-color-ink: #1d342f;
    --crm-color-muted-ink: #2f4a45;
    --crm-color-line: rgba(198, 167, 93, 0.32);
    --crm-color-line-strong: rgba(198, 167, 93, 0.5);
    --crm-color-focus: rgba(198, 167, 93, 0.58);
    --crm-color-success: #2f6f50;
    --crm-color-error: #9c3a2f;

    --crm-font-display: 'Century Schoolbook', 'Playfair Display', Georgia, serif;
    --crm-font-ui: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --crm-radius-xs: 8px;
    --crm-radius-sm: 12px;
    --crm-radius-md: 18px;
    --crm-radius-lg: 24px;
    --crm-radius-pill: 999px;

    --crm-space-1: 0.25rem;
    --crm-space-2: 0.5rem;
    --crm-space-3: 0.75rem;
    --crm-space-4: 1rem;
    --crm-space-5: 1.5rem;
    --crm-space-6: 2rem;
    --crm-space-7: 2.75rem;

    --crm-shadow-soft: 0 12px 24px rgba(8, 20, 18, 0.3);
    --crm-shadow-md: 0 22px 46px rgba(8, 20, 18, 0.38);
    --crm-shadow-focus: 0 0 0 3px var(--crm-color-focus);

    --crm-pattern-size-lg: 64px;
    --crm-pattern-size-md: 44px;
    --crm-pattern-line-soft: rgba(198, 167, 93, 0.08);
    --crm-pattern-line-card: rgba(123, 117, 76, 0.09);
    --crm-pattern-dot: rgba(198, 167, 93, 0.12);

    --crm-ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
    --crm-transition-fast: 0.14s var(--crm-ease-out);
    --crm-transition-base: 0.22s var(--crm-ease-out);

    --crm-text-primary: var(--crm-color-ink);
    --crm-text-secondary: rgba(29, 52, 47, 0.84);
}

* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
}

body {
    position: relative;
    min-height: 100vh;
    color: var(--crm-color-sand);
    font-family: var(--crm-font-ui);
    line-height: 1.48;
    background:
        radial-gradient(circle at 13% -8%, rgba(198, 167, 93, 0.3), transparent 40%),
        radial-gradient(circle at 86% 118%, rgba(123, 117, 76, 0.26), transparent 46%),
        linear-gradient(145deg, #1a312d 0%, #29463f 48%, #223d37 100%);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body::before {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at calc(var(--crm-pattern-size-lg) / 2) calc(var(--crm-pattern-size-lg) / 2), var(--crm-pattern-dot) 0 2px, transparent 2px),
        linear-gradient(45deg, transparent 45%, var(--crm-pattern-line-soft) 45% 55%, transparent 55%),
        linear-gradient(-45deg, transparent 45%, var(--crm-pattern-line-soft) 45% 55%, transparent 55%);
    background-size: var(--crm-pattern-size-lg) var(--crm-pattern-size-lg), var(--crm-pattern-size-lg) var(--crm-pattern-size-lg), var(--crm-pattern-size-lg) var(--crm-pattern-size-lg);
    opacity: 0.3;
    z-index: -1;
}

body::after {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 50% 22%, rgba(233, 215, 194, 0.08), transparent 56%),
        radial-gradient(circle at 50% 110%, rgba(0, 0, 0, 0.12), transparent 52%),
        repeating-linear-gradient(90deg, transparent 0 120px, rgba(198, 167, 93, 0.028) 120px 121px, transparent 121px 240px);
    z-index: -2;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--crm-font-display);
    letter-spacing: 0.012em;
    margin: 0;
    color: var(--crm-color-olive);
}

p {
    margin: 0;
}

a {
    color: var(--crm-color-gold);
}

a:hover {
    color: var(--crm-color-sand);
}

button,
input,
select,
textarea {
    font: inherit;
}

:focus-visible {
    outline: 2px solid var(--crm-color-gold);
    outline-offset: 2px;
}

.crm-surface {
    border-radius: var(--crm-radius-md);
    border: 1px solid var(--crm-color-line);
    background:
        linear-gradient(168deg, rgba(245, 233, 214, 0.95) 0%, rgba(233, 215, 194, 0.88) 56%, rgba(198, 167, 93, 0.22) 100%),
        linear-gradient(45deg, transparent 47%, var(--crm-pattern-line-card) 47% 53%, transparent 53%),
        linear-gradient(-45deg, transparent 47%, var(--crm-pattern-line-card) 47% 53%, transparent 53%),
        radial-gradient(circle at 22px 22px, rgba(198, 167, 93, 0.08) 0 1.5px, transparent 1.5px);
    background-size: auto, var(--crm-pattern-size-md) var(--crm-pattern-size-md), var(--crm-pattern-size-md) var(--crm-pattern-size-md), var(--crm-pattern-size-md) var(--crm-pattern-size-md);
    box-shadow: var(--crm-shadow-soft), inset 0 1px 0 rgba(255, 255, 255, 0.42);
}

.crm-surface-elevated {
    border-radius: var(--crm-radius-lg);
    border: 1px solid rgba(198, 167, 93, 0.46);
    background:
        linear-gradient(170deg, rgba(247, 236, 219, 0.96) 0%, rgba(233, 215, 194, 0.9) 58%, rgba(198, 167, 93, 0.26) 100%),
        linear-gradient(45deg, transparent 47%, rgba(123, 117, 76, 0.1) 47% 53%, transparent 53%),
        linear-gradient(-45deg, transparent 47%, rgba(123, 117, 76, 0.1) 47% 53%, transparent 53%),
        radial-gradient(circle at 26px 26px, rgba(198, 167, 93, 0.12) 0 1.8px, transparent 1.8px);
    background-size: auto, 52px 52px, 52px 52px, 52px 52px;
    box-shadow: var(--crm-shadow-md), inset 0 1px 0 rgba(255, 255, 255, 0.46);
}

.crm-brand-lockup {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
}

.crm-brand-lockup-image {
    display: block;
    width: clamp(180px, 24vw, 300px);
    height: clamp(52px, 6.8vw, 72px);
    max-width: 100%;
    object-fit: cover;
    object-position: center;
    flex-shrink: 0;
}

.crm-brand-lockup--compact {
    max-width: 100%;
}

.crm-brand-lockup--compact .crm-brand-lockup-image {
    width: clamp(150px, 18vw, 232px);
    height: clamp(42px, 5.2vw, 56px);
    max-width: 100%;
}

.crm-status-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-height: 28px;
    padding: 0.15rem 0.7rem;
    border-radius: var(--crm-radius-pill);
    border: 1px solid rgba(198, 167, 93, 0.44);
    background: linear-gradient(180deg, rgba(255, 247, 236, 0.76) 0%, rgba(233, 215, 194, 0.6) 100%);
    color: var(--crm-color-forest);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.01em;
}

.crm-button-base {
    min-height: 42px;
    border-radius: var(--crm-radius-sm);
    border: 1px solid transparent;
    padding: 0.55rem 0.95rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    cursor: pointer;
    transition: transform var(--crm-transition-fast), box-shadow var(--crm-transition-fast), background-color var(--crm-transition-fast), border-color var(--crm-transition-fast), color var(--crm-transition-fast);
}

.crm-button-base:hover:not(:disabled) {
    transform: translateY(-1px);
}

.crm-button-base:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.crm-pill-input {
    border-radius: var(--crm-radius-sm);
    border: 1px solid rgba(198, 167, 93, 0.36);
    background:
        linear-gradient(180deg, rgba(251, 243, 232, 0.94) 0%, rgba(244, 231, 213, 0.88) 100%),
        repeating-linear-gradient(135deg, rgba(123, 117, 76, 0.04) 0 1px, transparent 1px 16px);
    color: var(--crm-text-primary);
    transition: border-color var(--crm-transition-fast), box-shadow var(--crm-transition-fast), background-color var(--crm-transition-fast);
}

.crm-pill-input:focus {
    border-color: var(--crm-color-gold);
    box-shadow: var(--crm-shadow-focus);
    background: rgba(255, 248, 237, 0.98);
    outline: none;
}

.crm-pill-input[readonly],
.crm-pill-input:disabled {
    background: rgba(233, 215, 194, 0.5);
    color: rgba(29, 52, 47, 0.84);
}

@keyframes crm-fade-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes crm-rise-in {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    body::before,
    body::after {
        opacity: 0.18;
    }
}
