/* diplomatic.bar - Dopamine Maximalist Diplomatic Dossier */

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

:root{
    --midnight:#1C1A24;
    --parchment:#F2E8D5;
    --linen:#E8D5B7;
    --walnut:#3A322A;
    --gold:#C4956A;
    --burgundy:#6B2D3E;
    --olive:#5E6B4A;
    --brass:#8B7355;
    --champagne:#D4C09E;
}

body{
    background:var(--midnight);
    background-image:radial-gradient(ellipse at 50% 0%,#2A2435 0%,var(--midnight) 80%);
    color:var(--linen);
    font-family:'Libre Baskerville',serif;
    font-weight:400;
    font-size:clamp(1rem,1.8vw,1.2rem);
    line-height:1.75;
    letter-spacing:0.01em;
    overflow-x:hidden;
}

/* Section indicator seal */
.seal-indicator{
    position:fixed;
    bottom:24px;right:24px;
    z-index:50;
    width:48px;height:48px;
    background:var(--burgundy);
    border-radius:47% 53% 46% 54% / 49% 51% 48% 52%;
    box-shadow:0 2px 8px rgba(0,0,0,0.4),inset 0 1px 2px rgba(255,255,255,0.1);
    display:flex;align-items:center;justify-content:center;
    transition:transform 500ms cubic-bezier(0.34,1.56,0.64,1);
}

.seal-numeral{
    font-family:'Cormorant SC',serif;
    font-weight:600;
    font-size:0.85rem;
    letter-spacing:0.08em;
    color:var(--linen);
}

/* Procession sections */
.procession{
    position:relative;
    min-height:80vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:clamp(60px,10vh,120px) clamp(20px,4vw,40px);
}

.column{
    width:min(720px,90vw);
    margin:0 auto;
}

/* Background variants */
.dark-bg{background:var(--midnight)}
.light-bg{background:var(--parchment);color:var(--walnut)}

/* Guilloche watermark */
.guilloche::before{
    content:'';
    position:absolute;
    inset:0;
    background:
        repeating-linear-gradient(45deg,var(--brass) 0px,transparent 1px,transparent 8px),
        repeating-linear-gradient(-45deg,var(--brass) 0px,transparent 1px,transparent 8px),
        repeating-linear-gradient(90deg,var(--brass) 0px,transparent 1px,transparent 10px);
    opacity:0.04;
    pointer-events:none;
}

.g2::before{
    background:
        repeating-linear-gradient(45deg,var(--brass) 0px,transparent 1px,transparent 12px),
        repeating-linear-gradient(-45deg,var(--brass) 0px,transparent 1px,transparent 12px),
        repeating-linear-gradient(90deg,var(--brass) 0px,transparent 1px,transparent 14px);
}

/* Section numerals */
.section-numeral{
    position:absolute;
    left:calc(50% - min(360px,45vw) - 3rem);
    top:50%;
    transform:translateY(-50%);
    font-family:'Playfair Display',serif;
    font-weight:400;
    font-size:2rem;
    color:var(--brass);
}

.numeral-light{color:var(--brass)}

/* Hero section */
.hero-col{text-align:center}

.hero-inscription{
    font-family:'Playfair Display',serif;
    font-weight:400;
    letter-spacing:0.12em;
    line-height:1.1;
}

.hero-word-main{
    display:block;
    font-size:clamp(3rem,8vw,7rem);
    color:var(--linen);
}

.hero-dot{
    display:block;
    font-size:clamp(2rem,5vw,4rem);
    color:var(--gold);
    line-height:0.6;
}

.hero-word-tld{
    display:block;
    font-size:clamp(2.5rem,6vw,5rem);
    color:var(--linen);
}

.hero-subtitle{
    font-family:'Cormorant SC',serif;
    font-weight:600;
    font-size:clamp(0.75rem,1.2vw,0.9rem);
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--brass);
    margin-top:2rem;
}

.hero-rule{
    width:80%;
    height:1px;
    background:var(--gold);
    margin:2rem auto;
    opacity:0.6;
}

/* Section headings */
.section-heading{
    font-family:'Playfair Display',serif;
    font-weight:700;
    font-size:clamp(1.8rem,3.5vw,3rem);
    letter-spacing:0.06em;
    line-height:1.1;
    margin-bottom:2rem;
}

.text-light{color:var(--linen)}

.body-text{margin-bottom:1rem}

/* Icon sizes */
.icon-lg{
    width:96px;height:96px;
    display:block;
    margin:2rem auto;
}

.icon-md{width:48px;height:48px}

.icon-row{
    display:flex;
    justify-content:space-evenly;
    margin-top:2rem;
}

/* Icon draw animation */
.icon-draw path,.icon-draw circle,.icon-draw line{
    stroke-dasharray:400;
    stroke-dashoffset:400;
    transition:stroke-dashoffset 800ms ease-out;
}

.icon-draw.drawn path,.icon-draw.drawn circle,.icon-draw.drawn line{
    stroke-dashoffset:0;
}

/* Proclamation blocks */
.proclamation{
    border-top:3px solid var(--gold);
    padding-top:1.5rem;
    margin-bottom:2rem;
    opacity:0;
    transform:translateY(15px);
    transition:opacity 0.6s ease,transform 0.6s ease;
}

.proclamation.shown{
    opacity:1;
    transform:translateY(0);
}

/* Specimen cards */
.specimen-card{
    border:1px solid var(--brass);
    padding:clamp(24px,3vw,40px);
    margin-bottom:2rem;
    text-align:center;
    transition:border-color 300ms ease;
}

.specimen-card:hover{border-color:var(--gold)}
.specimen-card:hover .icon-lg{transform:scale(1.05);transition:transform 300ms cubic-bezier(0.34,1.56,0.64,1)}

.specimen-title{
    font-family:'Playfair Display',serif;
    font-weight:700;
    font-size:clamp(1.2rem,2vw,1.6rem);
    letter-spacing:0.04em;
    margin-bottom:1rem;
}

/* Accord text */
.accord-text{
    font-size:clamp(1rem,1.4vw,1.15rem);
    line-height:1.85;
}

.gold-em{
    color:var(--gold);
    font-weight:400;
}

/* Toast section */
.toast-col{text-align:center}

.toast-ensemble{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:1rem;
    margin-bottom:3rem;
}

.icon-toast{width:128px;height:128px}
.icon-sm-branch{width:64px;height:64px;opacity:0.6}

.toast-declaration{
    font-family:'Playfair Display',serif;
    font-weight:400;
    font-size:clamp(1.6rem,3vw,2.8rem);
    letter-spacing:0.04em;
    line-height:1.2;
    color:var(--walnut);
}

/* Colophon */
.colophon{text-align:center}

.colophon-domain{
    font-family:'Cormorant SC',serif;
    font-weight:600;
    font-size:clamp(0.85rem,1.2vw,1rem);
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--linen);
}

.colophon-seal{
    width:120px;height:120px;
    margin:2rem auto;
}

.colophon-seal svg{width:100%;height:100%}

.colophon-year{
    font-family:'Cormorant SC',serif;
    font-weight:600;
    font-size:clamp(0.8rem,1vw,0.9rem);
    letter-spacing:0.18em;
    color:var(--brass);
}

/* Ceremony rules */
.ceremony-rule{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:16px;
    padding:clamp(24px,4vh,48px) 0;
    max-width:min(432px,60%);
    margin:0 auto;
}

.rule-medal{width:48px;height:48px;flex-shrink:0}
.rule-line{flex:1;height:1px;background:var(--brass);opacity:0.5}

/* Reveal animations */
.reveal-up{
    opacity:0;
    transform:translateY(20px);
    transition:opacity 0.6s ease,transform 0.6s ease;
}

.reveal-up.shown{
    opacity:1;
    transform:translateY(0);
}

.reveal-scale{
    opacity:0;
    transform:scale(0.8);
    transition:opacity 0.5s ease,transform 0.5s cubic-bezier(0.34,1.56,0.64,1);
}

.reveal-scale.shown{
    opacity:1;
    transform:scale(1);
}

/* Responsive */
@media(max-width:768px){
    .section-numeral{
        position:static;
        display:block;
        text-align:center;
        margin-bottom:1rem;
        transform:none;
    }

    .icon-row{flex-wrap:wrap;gap:16px}

    .toast-ensemble{flex-direction:column}
    .icon-toast{width:96px;height:96px}
    .icon-sm-branch{width:40px;height:40px}

    .seal-indicator{
        bottom:12px;right:12px;
        width:36px;height:36px;
    }
}

@media(prefers-reduced-motion:reduce){
    .reveal-up,.reveal-scale,.proclamation{
        opacity:1;transform:none;transition:none;
    }
    .icon-draw path,.icon-draw circle,.icon-draw line{
        stroke-dashoffset:0;transition:none;
    }
    .seal-indicator{transition:none}
    .specimen-card .icon-lg{transition:none}
}