*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
    --parchment: #F5EDD6;
    --deep:      #1C1209;
    --gold:      #B8860B;
    --gold2:     #D4A520;
    --rust:      #7A3B1E;
    --muted:     #6B5B3E;
    --mid:       #D4C49A;
}

html, body {
    height: 100%;
    background: var(--parchment);
    color: var(--deep);
    font-family: 'Palatino Linotype', Georgia, serif;
}

/* Outer double frame — like the deck */
.frame-outer {
    position: fixed; inset: 0;
    border: 2px solid var(--gold);
    pointer-events: none;
    z-index: 50;
}
.frame-inner {
    position: fixed; inset: 10px;
    border: 0.5px solid var(--gold);
    pointer-events: none;
    z-index: 50;
}

/* Corner ornaments */
.corner {
    position: fixed;
    width: 28px; height: 28px;
    border-color: var(--gold);
    border-style: solid;
    opacity: 0;
    animation: fadeIn 1.5s ease 1.2s forwards;
    z-index: 51;
}
.corner-tl { top: 20px; left: 20px; border-width: 1.5px 0 0 1.5px; }
.corner-tr { top: 20px; right: 20px; border-width: 1.5px 1.5px 0 0; }
.corner-bl { bottom: 20px; left: 20px; border-width: 0 0 1.5px 1.5px; }
.corner-br { bottom: 20px; right: 20px; border-width: 0 1.5px 1.5px 0; }

.stage {
    position: relative;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 2.5rem; z-index: 1;
}

/* Top label */
.label {
    font-family: 'Palatino Linotype', Georgia, serif;
    font-size: 0.7rem;
    letter-spacing: 0.45em;
    text-transform: uppercase;
    color: var(--rust);
    margin-bottom: 1.8rem;
    opacity: 0;
    animation: fadeUp 1s ease 0.1s forwards;
}

/* Horizontal rule with gem */
.rule-wrap {
    display: flex; align-items: center;
    width: 100%; max-width: 560px;
    gap: 0.8rem;
    margin-bottom: 1.6rem;
    opacity: 0;
    animation: fadeUp 1s ease 0.2s forwards;
}
.rule-line { flex: 1; height: 1px; background: var(--gold); }
.gem { font-size: 0.75rem; color: var(--gold); }

/* Wordmark */
h1 {
    font-family: 'Palatino Linotype', Georgia, serif;
    font-weight: 400;
    font-size: clamp(4.5rem, 13vw, 8.5rem);
    letter-spacing: 0.12em;
    line-height: 1;
    text-transform: uppercase;
    color: var(--deep);
    opacity: 0;
    animation: fadeUp 1.1s ease 0.35s forwards;
    user-select: none;
}

h3 {
    margin-top: 1.5rem;
    margin-bottom: 0.75rem;
}

h4 {
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

/* Bottom rule */
.rule-wrap-bottom {
    display: flex; align-items: center;
    width: 100%; max-width: 560px;
    gap: 0.8rem;
    margin-top: 1.6rem;
    margin-bottom: 1.4rem;
    opacity: 0;
    animation: fadeUp 1s ease 0.55s forwards;
}

/* Tagline */
.tagline {
    font-family: Georgia, serif;
    font-size: clamp(1rem, 2.2vw, 1.25rem);
    font-style: italic;
    color: var(--rust);
    margin-bottom: 0.5rem;
    opacity: 0;
    animation: fadeUp 1s ease 0.7s forwards;
}

.subtitle {
    font-family: 'Palatino Linotype', Georgia, serif;
    font-size: clamp(0.75rem, 1.4vw, 0.88rem);
    letter-spacing: 0.2em;
    color: var(--muted);
    margin-bottom: 2.2rem;
    opacity: 0;
    animation: fadeUp 1s ease 0.85s forwards;
}

/* Footer */
.footer-note {
    position: fixed;
    bottom: 1.8rem;
    left: 50%; transform: translateX(-50%);
    font-family: 'Palatino Linotype', Georgia, serif;
    font-size: 0.62rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--muted);
    opacity: 0;
    animation: fadeUp 1s ease 1.3s forwards;
    white-space: nowrap;
}

.nav {
    color: var(--deep);
    display: flex;
    gap: 2rem;
    margin-top: 2rem;
}

a {
    color: var(--deep);
}

.imprint-wrap {
    width: 100%;
    max-width: 400px;
}

.privacy-wrap {
    width: 100%;
    max-width: 700px;
}

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn { to { opacity: 1; } }

@media (max-width: 480px) {
    .corner { display: none; }
}

ol {
    list-style-type: none
}