:root {
    --ground:#4A1F22;
    --ground-elevated:#582529;
    --ground-inset:#3B181A;
    --ground-deep:#2F1315;
    --ground-translucent:rgba(74, 31, 34, 0.94);
    --ground-glass:rgba(74, 31, 34, 0.82);

    --cream:#F7F2E8;
    --cream-muted:#D8CEBD;
    --cream-dim:#A89D8B;
    --cream-faint:rgba(247, 242, 232, 0.12);
    --cream-hairline:rgba(247, 242, 232, 0.18);
    --cream-solid-rule:#653336;

    --gold:#C99E32;
    --gold-hover:#DFB243;
    --gold-dim:#987621;
    --gold-faint:rgba(201, 158, 50, 0.14);

    --surface-error:#8B2024;
    --text-error:#FFB3B8;
    --surface-success:#1C3D28;
    --text-success:#B0E7C1;

    /* Typography tokens — Monospaced body mandate */
    --fesi-216:"Cinzel Decorative", 'Cinzel', serif;
    --font-heading:'Cinzel', serif;
    --fesi-75a:'Space Mono', monospace;
    --fesi-ec6:'Space Mono', monospace;

    /* Scroll padding for fixed header clearance */
    scroll-padding-top:100px;

    /* Fluid type scale via clamp() — safe from 320px up */
    --text-xs:clamp(0.72rem, 0.68rem + 0.2vw, 0.8rem);
    --text-sm:clamp(0.82rem, 0.78rem + 0.25vw, 0.92rem);
    --text-base:clamp(0.92rem, 0.88rem + 0.25vw, 1.02rem);
    --text-md:clamp(1.05rem, 0.98rem + 0.4vw, 1.2rem);
    --text-lg:clamp(1.25rem, 1.15rem + 0.6vw, 1.55rem);
    --text-xl:clamp(1.5rem, 1.35rem + 0.9vw, 1.95rem);
    --text-2xl:clamp(1.85rem, 1.6rem + 1.4vw, 2.6rem);
    --text-3xl:clamp(2.2rem, 1.85rem + 2vw, 3.4rem);
    --text-hero:clamp(2.4rem, 2rem + 2.8vw, 4.4rem);

    /* Leading and measures calibrated for monospace body copy */
    --lh-tight:1.18;
    --lh-heading:1.25;
    --lh-body:1.68;
    --lh-relaxed:1.8;
    --measure-prose:62ch;
    --measure-narrow:46ch;
    --measure-wide:74ch;

    /* Spatial rhythm tokens */
    --space-3xs:0.25rem;
    --space-2xs:0.5rem;
    --space-xs:0.75rem;
    --space-sm:1rem;
    --space-md:1.5rem;
    --space-lg:2.25rem;
    --space-xl:3.25rem;
    --space-2xl:4.5rem;
    --space-3xl:6.5rem;

    /* Shell gutters & containment */
    --shell-max:1320px;
    --shell-gutter:clamp(1.25rem, 3.6vw, 3.5rem);

    /* Geometry & borders — architectural, not pill/card */
    --radius-xs:1px;
    --radius-sm:2px;
    --radius-md:4px;
    --border-hairline:1px solid var(--cream-faint);
    --border-rule:1px solid var(--cream-hairline);
    --border-accent:1px solid var(--gold);
    --border-focus:2px solid var(--gold);

    /* Depth & shadow */
    --shadow-subtle:0 4px 18px rgba(20, 8, 9, 0.35);
    --shadow-raised:0 10px 30px rgba(15, 6, 7, 0.45);
    --shadow-elevated:0 18px 45px rgba(10, 4, 5, 0.55);

    /* Motion tokens — calibrated for GSAP ScrollSmoother and fine pointer affordances */
    --ease-out:cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in-out:cubic-bezier(0.65, 0, 0.35, 1);
    --dur-fast:140ms;
    --dur-med:220ms;
    --dur-slow:420ms;
}


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

html {
    font-size:16px;
    line-height:var(--lh-body);
    background-color:var(--ground);
    color:var(--cream);
    text-rendering:optimizeLegibility;

    -webkit-text-size-adjust:100%;
    -moz-tab-size:4;
    tab-size:4;
    scroll-behavior:smooth;
}

body {
    margin:0;
    padding:0;
    min-height:100vh;
    font-family:var(--fesi-75a);
    font-size:var(--text-base);
    font-weight:400;
    line-height:var(--lh-body);
    color:var(--cream);
    background-color:var(--ground);
    overflow-x:hidden;
    position:relative;
}

/* Images & embedded media */
img, picture, svg, video, canvas {
    display:block;

    max-width:100%;
    height:auto;
}

/* Form controls inherit typography from their parent, never body-resetting */
button, input, select, textarea {
    font:inherit;
    color:inherit;
    letter-spacing:inherit;
}

a {
    color:var(--cream);
    text-decoration-skip-ink:auto;
    text-decoration-color:var(--gold-dim);
    text-underline-offset:3px;
    transition:color var(--dur-fast) var(--ease-out),
                            text-decoration-color var(--dur-fast) var(--ease-out);
}

a:hover {
    color:var(--gold-hover);
    text-decoration-color:var(--gold-hover);
}

/* Accessible focus ring for all interactive elements */
:focus {
    outline:none;
}

:focus-visible {
    outline:var(--border-focus);
    outline-offset:3px;
}

button {
    background:none;
    border:none;
    cursor:pointer;
    text-align:left;
}

fieldset {
    margin:0;
    padding:0;
    border:none;
}


h1, h2, h3, h4, h5, h6 {
    margin:0 0 var(--space-xs) 0;
    font-family:var(--font-heading);
    font-weight:700;
    line-height:var(--lh-heading);
    color:var(--cream);
    letter-spacing:0.02em;
    word-break:break-word;
    overflow-wrap:break-word;
}

h1 {
    font-family:var(--fesi-216);
    font-size:var(--text-hero);
    line-height:var(--lh-tight);
    letter-spacing:0.015em;
    max-width:24ch;
}

h2 {
    font-size:var(--text-2xl);
    line-height:var(--lh-tight);
    letter-spacing:0.02em;
}

h3 {
    font-size:var(--text-xl);
    letter-spacing:0.02em;
}

h4 {
    font-size:var(--text-lg);
    font-weight:600;
}

p {
    margin:0 0 var(--space-md) 0;
    max-width:var(--measure-prose);
    color:var(--cream-muted);
}

p:last-child {
    margin-bottom:0;
}

strong, b {
    font-weight:700;
    color:var(--cream);
}

em, i {
    font-style:italic;
    color:var(--cream);
}

hr {
    border:none;
    border-top:var(--border-rule);
    margin:var(--space-xl) 0;
}

ul, ol {
    margin:0 0 var(--space-md) 0;
    padding-left:var(--space-lg);
    max-width:var(--measure-prose);
    color:var(--cream-muted);
}

li {
    margin-bottom:var(--space-2xs);
}

li:last-child {
    margin-bottom:0;
}

code, kbd, samp, pre {
    font-family:var(--fesi-ec6);
    font-size:0.9em;
}

blockquote {
    margin:var(--space-lg) 0;
    padding-left:var(--space-md);
    border-left:2px solid var(--gold);
    color:var(--cream);
    font-style:italic;
    max-width:var(--measure-wide);
}


/* Outer frame wrapper for ScrollSmoother integration */
#smooth-wrapper {
    position:relative;
    width:100%;
    overflow:hidden;
}

#smooth-content {
    position:relative;
    width:100%;
    min-height:100vh;
}

/* Standard structural shell */
.shell {
    width:100%;
    max-width:var(--shell-max);
    margin-left:auto;
    margin-right:auto;
    padding-left:var(--shell-gutter);
    padding-right:var(--shell-gutter);
    min-width:0;
}

.shell-fluid {
    width:100%;
    padding-left:var(--shell-gutter);
    padding-right:var(--shell-gutter);
    min-width:0;
}

/* Section baseline — edge-to-edge flow */
.section {
    position:relative;
    padding-top:clamp(3rem, 6vw, 6.5rem);
    padding-bottom:clamp(3rem, 6vw, 6.5rem);
    width:100%;
    border-bottom:var(--border-hairline);

    min-width:0;
}

.section-inset {
    background-color:var(--ground-inset);
}

.section-elevated {
    background-color:var(--ground-elevated);
}

.section-deep {
    background-color:var(--ground-deep);
}

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

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

.grid-three {
    display:grid;
    grid-template-columns:1fr;
    gap:var(--space-lg);
}

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

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

/* Strict accessible visually hidden utility */
.visually-hidden {
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0, 0, 0, 0) !important;
    white-space:nowrap !important;
    border:0 !important;
}

/* Honeypot fields specific to wiwie56.php handler */
.form-field-hp {
    position:absolute !important;
    left:-9999px !important;
    width:1px !important;
    height:1px !important;
    opacity:0 !important;
    pointer-events:none !important;
    tab-index:-1 !important;
}


.icon {
    display:inline-block;
    width:1.15em;
    height:1.15em;
    fill:currentColor;
    vertical-align:-0.15em;
    flex-shrink:0;
    transition:transform var(--dur-fast) var(--ease-out);
}


@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;
    }

    html {
        scroll-behavior:auto !important;
    }
}