.fonts-loading {
            opacity: 0;
        }

        .fonts-loaded {
            opacity: 1;
            transition: opacity 0.3s ease;
        }

:root {
            
            --bg: #EFE9E0;
            --paper: #F7F3ED;
            --paperWarm: #F4EFE6;
            --paperLight: #FAF8F5;
            --surface: #D8C6B8;
            --ink: #191717;
            --inkSoft: #4A3B35;
            --accent: #CFB1A0;
            --accent2: #B58C72;
            --accent2Hover: #A67C64;
            --wash: rgba(207, 177, 160, 0.18);
            --washLight: rgba(207, 177, 160, 0.08);
            --hairline: rgba(181, 140, 114, 0.2);

            
            --font-serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
            --font-sans: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

            
            --space-xs: 0.5rem;
            --space-sm: 0.75rem;
            --space-md: 1rem;
            --space-lg: 1.5rem;
            --space-xl: 2rem;
            --space-2xl: 3rem;
            --space-3xl: 4rem;

            
            --radius-sm: 8px;
            --radius-md: 16px;
            --radius-lg: 28px;
            --radius-full: 9999px;
        }

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

        html {
            font-size: 16px;
            scroll-behavior: smooth;
        }

        body {
            font-family: var(--font-sans);
            background-color: var(--bg);
            color: var(--ink);
            min-height: 100vh;
            display: flex;
            flex-direction: column;
            line-height: 1.8;
            overflow-x: hidden;
            position: relative;
        }

        
        body::before {
            content: '';
            position: fixed;
            inset: 0;
            pointer-events: none;
            z-index: 1000;
            opacity: 0.055;
            mix-blend-mode: multiply;
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.7' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
        }

        :focus-visible {
            outline: 2px solid var(--accent2);
            outline-offset: 3px;
        }

        
        .watercolor-tl {
            position: fixed;
            top: 8%;
            left: 5%;
            width: 40vw;
            max-width: 420px;
            height: auto;
            opacity: 0.35;
            pointer-events: none;
            z-index: 0;
            filter: blur(0.5px);
            animation: breathe 16s ease-in-out infinite;
        }

        .watercolor-br {
            position: fixed;
            bottom: 8%;
            right: 4%;
            width: 38vw;
            max-width: 400px;
            height: auto;
            opacity: 0.32;
            pointer-events: none;
            z-index: 0;
            filter: blur(0.5px);
            animation: breathe 20s ease-in-out infinite reverse;
        }

        @keyframes breathe {

            0%,
            100% {
                opacity: 0.32;
                transform: scale(1);
            }

            50% {
                opacity: 0.42;
                transform: scale(1.02);
            }
        }

        
        .container {
            flex: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: var(--space-lg);
            position: relative;
            z-index: 1;
        }

        
        .card {
            background: linear-gradient(180deg,
                    rgba(255, 255, 255, 0.45) 0%,
                    var(--paperLight) 2%,
                    var(--paper) 18%,
                    var(--paper) 82%,
                    var(--paperWarm) 98%,
                    rgba(220, 200, 180, 0.12) 100%);
            border-radius: var(--radius-lg);
            border: 1px solid rgba(181, 140, 114, 0.18);
            box-shadow:
                0 1px 1px rgba(25, 23, 23, 0.008),
                0 2px 4px rgba(25, 23, 23, 0.012),
                0 6px 14px rgba(25, 23, 23, 0.025),
                0 16px 36px rgba(181, 140, 114, 0.04),
                0 32px 64px rgba(181, 140, 114, 0.035),
                inset 0 2px 0 rgba(255, 255, 255, 0.9),
                inset 0 -2px 6px rgba(181, 140, 114, 0.045),
                inset 2px 0 6px rgba(181, 140, 114, 0.02),
                inset -2px 0 6px rgba(181, 140, 114, 0.02);
            max-width: 580px;
            width: 100%;
            padding: var(--space-2xl) var(--space-xl);
            text-align: center;
            position: relative;
            overflow: hidden;
            animation: cardIn 0.9s cubic-bezier(0.22, 1, 0.36, 1) forwards;
        }

        .card::before {
            content: '';
            position: absolute;
            inset: 0;
            pointer-events: none;
            opacity: 0.035;
            mix-blend-mode: multiply;
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='cardnoise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.95' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23cardnoise)'/%3E%3C/svg%3E");
            border-radius: inherit;
        }

        @keyframes cardIn {
            from {
                opacity: 0;
                transform: translateY(10px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        
        .card-header {
            margin-bottom: var(--space-lg);
        }

        .brand-logo {
            width: auto;
            height: clamp(70px, 14vw, 100px);
            object-fit: contain;
        }

        
        .main-title {
            font-family: var(--font-serif);
            font-size: clamp(1.5rem, 4vw, 2rem);
            font-weight: 300;
            color: var(--ink);
            margin-bottom: var(--space-xs);
            letter-spacing: 0.035em;
            line-height: 1.35;
        }

        .subtitle {
            font-family: var(--font-serif);
            font-size: clamp(0.95rem, 2.5vw, 1.1rem);
            font-style: italic;
            color: var(--inkSoft);
            margin-bottom: var(--space-xl);
        }

        
        .contact-form {
            text-align: left;
        }

        .form-group {
            margin-bottom: var(--space-lg);
        }

        .form-label {
            display: block;
            font-family: var(--font-sans);
            font-size: 0.8125rem;
            font-weight: 500;
            color: var(--inkSoft);
            text-transform: uppercase;
            letter-spacing: 0.1em;
            margin-bottom: var(--space-xs);
        }

        .form-input,
        .form-textarea {
            width: 100%;
            padding: 0.85rem 1rem;
            font-family: var(--font-sans);
            font-size: 1rem;
            border: 1px solid rgba(181, 140, 114, 0.25);
            border-radius: var(--radius-sm);
            background: rgba(255, 255, 255, 0.7);
            color: var(--ink);
            transition: border-color 0.25s, box-shadow 0.25s, background 0.25s;
            line-height: 1.5;
        }

        .form-input:focus,
        .form-textarea:focus {
            outline: none;
            border-color: var(--accent2);
            background: rgba(255, 255, 255, 0.95);
            box-shadow: 0 0 0 3px rgba(181, 140, 114, 0.12);
        }

        .form-input::placeholder,
        .form-textarea::placeholder {
            color: var(--surface);
        }

        .form-textarea {
            min-height: 140px;
            resize: vertical;
        }

        
        .hp-field {
            position: absolute;
            left: -9999px;
            top: -9999px;
            opacity: 0;
            height: 0;
            width: 0;
            pointer-events: none;
        }

        
        .turnstile-container {
            display: flex;
            justify-content: center;
            margin: var(--space-lg) 0;
        }

        
        .btn-submit {
            width: 100%;
            height: 52px;
            padding: 0 var(--space-lg);
            border-radius: var(--radius-full);
            font-family: var(--font-sans);
            font-size: 0.9375rem;
            font-weight: 500;
            cursor: pointer;
            transition: all 0.25s cubic-bezier(0.22, 1, 0.36, 1);
            background: linear-gradient(180deg,
                    rgba(195, 155, 130, 1) 0%,
                    var(--accent2) 12%,
                    var(--accent2) 88%,
                    rgba(160, 120, 95, 1) 100%);
            color: white;
            border: none;
            box-shadow:
                0 1px 2px rgba(181, 140, 114, 0.12),
                0 2px 6px rgba(181, 140, 114, 0.1),
                0 6px 16px rgba(181, 140, 114, 0.12),
                inset 0 1px 0 rgba(255, 255, 255, 0.2),
                inset 0 -1px 0 rgba(0, 0, 0, 0.08);
        }

        .btn-submit:hover {
            background: linear-gradient(180deg,
                    rgba(185, 145, 120, 1) 0%,
                    var(--accent2Hover) 12%,
                    var(--accent2Hover) 88%,
                    rgba(150, 110, 85, 1) 100%);
            transform: translateY(-1px);
            box-shadow:
                0 2px 4px rgba(181, 140, 114, 0.14),
                0 4px 10px rgba(181, 140, 114, 0.12),
                0 10px 24px rgba(181, 140, 114, 0.14),
                inset 0 1px 0 rgba(255, 255, 255, 0.25),
                inset 0 -1px 0 rgba(0, 0, 0, 0.1);
        }

        
        .back-link {
            display: block;
            text-align: center;
            margin-top: var(--space-lg);
            font-family: var(--font-serif);
            font-size: 0.9375rem;
            font-style: italic;
            color: var(--inkSoft);
            text-decoration: none;
            opacity: 0.7;
            transition: opacity 0.2s, color 0.2s;
        }

        .back-link:hover {
            opacity: 1;
            color: var(--accent2);
        }

        
        .site-footer {
            text-align: center;
            padding: var(--space-lg);
            font-family: var(--font-serif);
            font-size: 0.8125rem;
            font-style: italic;
            color: var(--inkSoft);
            opacity: 0.55;
            position: relative;
            z-index: 1;
        }

        
        @media (max-width: 640px) {
            .container {
                padding: var(--space-md);
                padding-top: var(--space-xl);
                align-items: flex-start;
            }

            .card {
                padding: var(--space-xl) var(--space-lg);
                border-radius: var(--radius-md);
            }

            .watercolor-tl,
            .watercolor-br {
                opacity: 0.2;
            }
        }

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

            .watercolor-tl,
            .watercolor-br,
            .card {
                animation: none !important;
            }
        }