:root{--emerald:#075a42;
    --deep:#031f19;
    --navy:#08151b;
    --gold:#c4a66a;
    --gold2:#e5d1a0;
    --ivory:#f6f0e2;
    --paper:#fffdf8;
    --ink:#17201c;
    --muted:#66716b;
    --line:#ddd5c5}
*{box-sizing:border-box}

html{scroll-behavior:smooth}

body{margin:0;background:var(--ivory);
    color:var(--ink);
    font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Arial;line-height:1.65}

.texture{background-image:radial-gradient(circle at 15% 20%,#ffffff12 0 1px,transparent 1px),radial-gradient(circle at 80% 70%,#0000000b 0 1px,transparent 1px);
    background-size:17px 17px,23px 23px}

.texture-dark{background-image:radial-gradient(circle at 20% 30%,#ffffff10 0 1px,transparent 1px),linear-gradient(135deg,#ffffff04 25%,transparent 25% 50%,#ffffff04 50% 75%,transparent 75%);
    background-size:19px 19px,42px 42px}

.topbar{font-size:12px;background:#02140f;color:#dfe9e3;
    padding:7px 5%;
    display:flex;
    justify-content:space-between;
    gap:15px;
    flex-wrap:wrap}

.nav{position:sticky;
    top:0;
    z-index:20;
    background:#071c17e8;
    backdrop-filter:blur(16px);
    border-bottom:1px solid #ffffff12;
    padding:12px 5%;
    display:flex;
    gap:8px;
    align-items:center;
    flex-wrap:wrap}.brand{font-family:Georgia,serif;color:#fff;
        text-decoration:none;
        font-size:20px;
        font-weight:700;
        margin-right:auto}
 

   
.nav a{color:#e8efe9;
    text-decoration:none;
    padding:8px 11px;
    border:1px solid transparent;
    border-radius:999px;
    font-size:13px}
    
.nav a:hover{border-color:#c4a66a66;color:#fff}

.hero{min-height:78vh;
    padding:12vh 7%;
    display:grid;
    align-items:center;color:#fff;background:radial-gradient(circle at 75% 20%,#b89a6130,transparent 30%),linear-gradient(120deg,#021a14,#075a42 55%,#0b473a);position:relative;overflow:hidden}
    
.hero:after{
    content:"";
    position:absolute;
    inset:0;
    opacity:.45;
    background-image:repeating-linear-gradient(45deg,#ffffff04 0 1px,transparent 1px 11px);
    pointer-events:none}
    
.hero>*{
    position:relative;
    z-index:1}.eyebrow{color:var(--white);
    letter-spacing:.19em;text-transform:uppercase;font-size:11px;font-weight:800}
    
.hero h1{
    font-family:Georgia,serif;
    font-weight:500;
    font-size:clamp(48px,7.5vw,104px);
    line-height:.96;
    max-width:1050px;
    margin:16px 0}
    
.hero p{
    max-width:760px;
    font-size:20px;color:#e3eee8}
    
.btn{
    display:inline-block;border:0;background:var(--gold);
    color:#07110d;
    text-decoration:none;
    font-weight:800;padding:12px 18px;border-radius:8px;cursor:pointer}

.btn.ghost{
    background:transparent;
    color:#fff;
    border:1px solid #ffffff35}
        
.section{
    max-width:1320px;
    margin:auto;
    padding:90px 6%}
    
.section h2{
    font:500 clamp(34px,4vw,62px)/1.05 Georgia,serif;margin:12px 0 24px}

.lead{
    font-size:19px;max-width:820px;color:#4d5b54}

.grid{
    display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:18px}

.card{
    background:var(--paper);
    border:1px solid var(--line);
    padding:24px;border-radius:18px;
    box-shadow:0 18px 50px #17201c0b}
    
.dark{
    background:var(--deep);
    color:#f5f2e9;max-width:none}
    
.dark>*{
    max-width:1200px;margin-left:auto;margin-right:auto}

.dark .card{background:#0b2b23;border-color:#ffffff16;color:#eef4ef}

.stats{
    display:grid;
    grid-template-columns:repeat(4,1fr);gap:1px;
    background:#17201c0b;margin-top:36px}

.stat{
    background: #04db7b4f;
    padding:25px}

.stat strong{
    font:600 38px Georgia}

.timeline{
    border-left:1px solid #c4a66a88;
    padding-left:30px}

.timeline article{
    position:relative;
    margin:0 0 32px}

.timeline article:before{
    content:"";
    position:absolute;
    left:-36px;
    top:7px;
    width:11px;
    height:11px;
    background:var(--gold);
    border-radius:50%;
    box-shadow:0 0 0 5px #c4a66a20}

    .media{width:100%;
        aspect-ratio:4/3;
        object-fit:cover;
        border-radius:12px;
        background:#d9d1c1}
        
    .tools{
        background:#061b16;
        border:1px solid #c4a66a55;
        color:#fff;border-radius:24px;
        padding:34px;
        background-image:radial-gradient(circle at 80% 10%,#c4a66a18,transparent 28%),radial-gradient(circle at 10% 90%,#0a7a5b18,transparent 32%)}
        
    .tool-row{
        display:flex;
        gap:10px;
        flex-wrap:wrap}
        
    .quiz-q{
        margin:18px 0;
        padding:20px;
        border:1px solid #ffffff16;
        border-radius:14px;
        background:#ffffff05}
        
    .quiz-opt{
        display:block;
        width:100%;
        text-align:left;
        margin:8px 0;
        background:#ffffff08;
        color:#fff;
        border:1px solid #ffffff16;
        padding:11px;
        border-radius:9px;
        cursor:pointer}
        
    .quiz-opt:hover{
        border-color:#c4a66a}
        
    .notice{
        padding:12px 15px;
        border-left:3px solid var(--gold);
        background:#c4a66a12}
        
    .footer{
        background:#02110d;
        color:#d8e3dd;
        padding:55px 6%
    }
        
    .footer-grid{
        max-width:1200px;
        margin:auto;
        display:grid;
        grid-template-columns:2fr 1fr 1fr;gap:35px}
        
    form.card input,form.card textarea,form.card select,input,textarea,select{width:100%;padding:12px;margin:5px 0 12px;border:1px solid #cfc6b5;border-radius:9px;background:#fff;color:#17201c}textarea{min-height:110px;resize:vertical}.map{width:100%;height:360px;border:0;border-radius:18px}.small{font-size:13px;color:var(--muted)}@media(max-width:800px){.stats{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr}.brand{width:100%}.nav{position:relative}.section{padding:60px 5%}.hero{padding:70px 6%}}

.method-pick{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:14px 0}.method-pick label{cursor:pointer}.method-pick input{position:absolute;opacity:0;width:0}.method-pick span{display:block;text-align:center;padding:14px;border:1px solid #ffffff22;border-radius:12px;font-weight:700}.method-pick input:checked+span{border-color:var(--gold);background:#c4a66a22}.method-pick input:focus-visible+span{outline:2px solid var(--gold)}
.acct{display:flex;gap:16px;align-items:center;padding:16px;margin:12px 0;border:1px solid #ffffff22;border-radius:14px;cursor:pointer;flex-wrap:wrap}.acct:has(input:checked){border-color:var(--gold);background:#c4a66a14}.acct input{width:auto;margin:0}.acct div{flex:1;min-width:200px}.acct code{background:#ffffff14;padding:2px 6px;border-radius:6px;word-break:break-all}.acct .cp{padding:3px 10px;font-size:12px}.qr{width:130px;height:130px;object-fit:contain;background:#fff;border-radius:10px;padding:6px}#donationForm{margin-top:22px;border-top:1px solid #ffffff22;padding-top:18px}