/* ========================================
   witch-trial.com - styles.css
   Palette:
     Burnt Parchment:  #1A1510
     Aged Cream:       #F0E8D8
     Brass Oxide:      #8B7355
     Ink Dark:         #1A1714
     Blood Seal:       #8B2020
     Cold Stone:       #10121A
     Tarnished Silver: #6B6860
     Chalk White:      #F8F7F4
   Fonts: Cormorant Garamond 700, Crimson Text 400/i, Oswald 600
======================================== */

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

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Crimson Text', Georgia, serif;
    font-weight: 400;
    color: #1A1714;
    background: #1A1510;
    line-height: 1.7;
    font-size: 1.05rem;
    overflow-x: hidden;
}

h1, h2, h3 {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-weight: 700;
}

.court-header,
.exhibit-stamp,
.speaker-label,
.record-footer {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.75rem;
}

/* ---- FADE IN ---- */

.fade-in {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.fade-in.in-view {
    opacity: 1;
    transform: translateY(0);
}

/* ---- SVG PATH DRAW ---- */

.draw-path {
    stroke-dasharray: 300;
    stroke-dashoffset: 300;
    transition: stroke-dashoffset 1.5s ease;
}

.in-view .draw-path {
    stroke-dashoffset: 0;
}

/* ---- ACCUSATION SECTION ---- */

.accusation {
    min-height: 100vh;
    background: #1A1510;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: 4rem 2rem;
}

.flourish-frame {
    position: absolute;
    inset: 2rem;
    pointer-events: none;
}

.flourish {
    position: absolute;
    width: 120px;
    height: 120px;
}

.flourish.top-left { top: 0; left: 0; }
.flourish.top-right { top: 0; right: 0; }
.flourish.bottom-left { bottom: 0; left: 0; }
.flourish.bottom-right { bottom: 0; right: 0; }

.accusation-content {
    text-align: center;
    max-width: 700px;
    position: relative;
    z-index: 1;
}

.court-header {
    color: #8B7355;
    font-size: 0.85rem;
    margin-bottom: 0.5rem;
    letter-spacing: 0.15em;
}

.accusation-title {
    font-size: clamp(2.5rem, 6vw, 4.5rem);
    color: #F0E8D8;
    margin-bottom: 1rem;
    letter-spacing: 0.03em;
}

.rule-solid {
    height: 1px;
    background: rgba(139, 115, 85, 0.4);
    max-width: 400px;
    margin: 1.5rem auto;
}

.accusation-text {
    color: #F0E8D8;
    opacity: 0.85;
    font-size: 1.05rem;
    line-height: 1.8;
    margin-bottom: 1.5rem;
    text-align: justify;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

/* ---- WAX SEAL ---- */

.wax-seal {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 35%, #a83030, #8B2020 50%, #6b1818);
    margin: 2rem auto 0;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.4), 0 4px 12px rgba(0, 0, 0, 0.3);
}

.seal-monogram {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    color: rgba(240, 232, 216, 0.6);
    font-size: 1.2rem;
    letter-spacing: 0.1em;
}

/* ---- DISSOLVING RULES ---- */

.dissolving-rule {
    padding: 1rem 2rem;
    background: #1A1510;
}

.dissolving-rule svg {
    width: 100%;
    height: 2px;
    display: block;
}

.dissolving-2 { background: #1A1510; }

.dissolving-3,
.dissolving-4,
.dissolving-5 {
    max-width: 800px;
    margin: 0 auto;
    padding: 0.5rem 0;
    background: transparent;
}

/* ---- EVIDENCE SECTION ---- */

.evidence {
    background: #1A1510;
    padding: clamp(4rem, 6vw, 6rem) 2rem;
    min-height: 120vh;
}

.section-title {
    font-size: clamp(2rem, 5vw, 4rem);
    color: #F0E8D8;
    text-align: center;
    margin-bottom: 3rem;
}

.evidence-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 20px;
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
}

.exhibit {
    background: #F0E8D8;
    padding: 2rem;
    position: relative;
    box-shadow: 0 1px 3px rgba(26, 21, 16, 0.12), 0 1px 2px rgba(26, 21, 16, 0.08);
}

.exhibit-1 { grid-column: 1 / span 5; transform: rotate(-1.5deg); }
.exhibit-2 { grid-column: 6 / span 5; transform: rotate(2deg); margin-top: 2rem; }
.exhibit-3 { grid-column: 3 / span 4; transform: rotate(1deg); }
.exhibit-4 { grid-column: 7 / span 5; transform: rotate(-2.5deg); margin-top: -1rem; }
.exhibit-5 { grid-column: 1 / span 5; transform: rotate(1.5deg); }
.exhibit-6 { grid-column: 5 / span 6; transform: rotate(-1deg); margin-top: 1rem; }

.exhibit-stamp {
    display: inline-block;
    border: 2px solid #8B2020;
    color: #8B2020;
    padding: 0.2rem 0.6rem;
    transform: rotate(-3deg);
    margin-bottom: 1rem;
    font-size: 0.7rem;
}

.exhibit-title {
    font-size: 1.2rem;
    color: #1A1714;
    margin-bottom: 0.75rem;
}

.exhibit-text {
    color: #1A1714;
    font-size: 0.95rem;
    line-height: 1.65;
}

/* ---- TESTIMONY SECTION ---- */

.testimony {
    padding: clamp(4rem, 6vw, 6rem) 2rem;
    min-height: 120vh;
}

.testimony-title {
    margin-bottom: 3rem;
}

.testimony-block {
    max-width: 800px;
    margin: 0 auto;
    padding: clamp(3rem, 5vw, 5rem);
}

.testimony-dark {
    background: #1A1510;
}

.testimony-cold {
    background: #10121A;
}

.speaker-label {
    display: block;
    color: #8B7355;
    margin-bottom: 1rem;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
}

.testimony-quote {
    font-family: 'Crimson Text', Georgia, serif;
    font-style: italic;
    font-size: clamp(1.1rem, 2vw, 1.4rem);
    color: #F0E8D8;
    line-height: 1.7;
    border-left: 2px solid #8B7355;
    padding-left: 1.5rem;
}

/* ---- VERDICT SECTION ---- */

.verdict {
    background: #1A1510;
    padding: clamp(4rem, 6vw, 8rem) 2rem;
    min-height: 80vh;
    position: relative;
    overflow: hidden;
}

.verdict-content {
    max-width: 800px;
    margin: 0 auto;
    position: relative;
}

.guilty-stamp {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(12deg);
    z-index: 2;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.6s ease;
}

.guilty-stamp.visible {
    opacity: 1;
}

.guilty-stamp span {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: clamp(4rem, 10vw, 8rem);
    color: rgba(139, 32, 32, 0.6);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border: 6px solid rgba(139, 32, 32, 0.4);
    padding: 0.5rem 2rem;
    display: block;
}

.verdict-title {
    font-size: clamp(2rem, 4vw, 3.5rem);
    color: #F0E8D8;
    margin-bottom: 2rem;
}

.verdict-formal {
    color: #F0E8D8;
    opacity: 0.8;
    font-size: 1.1rem;
    line-height: 1.7;
    text-align: justify;
    margin-bottom: 3rem;
}

.verdict-counter {
    position: relative;
    z-index: 3;
}

.counter-text {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    color: #F0E8D8;
    font-size: 0.95rem;
    line-height: 1.6;
    margin-bottom: 1.5rem;
    letter-spacing: 0.02em;
    text-align: left;
}

/* ---- INK SPLATTERS ---- */

.ink-splatter {
    position: absolute;
    pointer-events: none;
}

.splatter-1 {
    width: 30px;
    height: 30px;
    top: 20%;
    right: 10%;
}

.splatter-2 {
    width: 25px;
    height: 25px;
    bottom: 15%;
    left: 8%;
}

/* ---- TORN EDGE ---- */

.torn-edge {
    height: 40px;
    background: #F8F7F4;
    clip-path: polygon(0% 80%, 2% 40%, 5% 70%, 8% 30%, 11% 60%, 14% 20%, 17% 55%, 20% 35%, 23% 65%, 26% 25%, 29% 50%, 32% 40%, 35% 70%, 38% 20%, 41% 55%, 44% 30%, 47% 60%, 50% 15%, 53% 50%, 56% 35%, 59% 65%, 62% 25%, 65% 55%, 68% 40%, 71% 70%, 74% 20%, 77% 50%, 80% 35%, 83% 65%, 86% 25%, 89% 55%, 92% 30%, 95% 60%, 98% 40%, 100% 70%, 100% 100%, 0% 100%);
    position: relative;
    z-index: 1;
}

/* ---- THE RECORD (MODERN FOOTER) ---- */

.record {
    background: #F8F7F4;
    padding: clamp(4rem, 6vw, 6rem) 2rem;
    min-height: 60vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.record-content {
    max-width: 650px;
    text-align: center;
}

.record-title {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 1.5rem;
    color: #1A1714;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 1.5rem;
}

.rule-clean {
    height: 1px;
    background: rgba(26, 23, 20, 0.15);
    max-width: 300px;
    margin: 1.5rem auto;
}

.record-text {
    color: #1A1714;
    font-size: 1rem;
    line-height: 1.7;
    margin-bottom: 1.5rem;
}

.record-footer {
    color: #6B6860;
    font-size: 0.75rem;
    margin-top: 1.5rem;
}

/* ---- RESPONSIVE ---- */

@media (max-width: 900px) {
    .evidence-grid {
        grid-template-columns: 1fr;
    }

    .exhibit {
        grid-column: 1 !important;
        transform: rotate(0deg) !important;
        margin-top: 0 !important;
    }

    .flourish-frame {
        inset: 1rem;
    }

    .flourish {
        width: 80px;
        height: 80px;
    }
}

@media (max-width: 600px) {
    .guilty-stamp span {
        font-size: 3rem;
        padding: 0.3rem 1rem;
        border-width: 4px;
    }
}

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