:root {
  --bg: #F6F2ED;
  --bg-alt: #EDE8E1;
  --text: #4E3F34;
  --text-light: #8A7968;
  --gold: #B89B4A;
  --gold-soft: rgba(184,155,74,0.12);
  --sage: rgba(126,155,110,0.9);
  --white-glass: rgba(255,255,255,0.55);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Quicksand',sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden;-webkit-font-smoothing:antialiased;line-height:1.8}
::selection{background:var(--gold-soft);color:var(--text)}

/* MARBLE */
body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0;
  background:
    radial-gradient(ellipse at 12% 8%,rgba(190,175,155,0.35) 0%,transparent 38%),
    radial-gradient(ellipse at 88% 20%,rgba(180,165,142,0.3) 0%,transparent 34%),
    radial-gradient(ellipse at 35% 52%,rgba(195,180,160,0.22) 0%,transparent 40%),
    radial-gradient(ellipse at 78% 72%,rgba(185,170,148,0.28) 0%,transparent 36%),
    radial-gradient(ellipse at 20% 88%,rgba(190,178,158,0.2) 0%,transparent 38%),
    linear-gradient(140deg,transparent 18%,rgba(182,168,148,0.1) 22%,transparent 26%),
    linear-gradient(140deg,transparent 44%,rgba(178,164,144,0.08) 47%,transparent 51%),
    linear-gradient(40deg,transparent 28%,rgba(172,158,136,0.06) 31%,transparent 35%),
    linear-gradient(40deg,transparent 56%,rgba(180,166,144,0.08) 59%,transparent 63%)}
body::after{content:'';position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1;opacity:0.06;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='5' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
nav,section,footer,.sec-alt,.beliefs-band,.page-hero{position:relative;z-index:2}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:200;padding:1rem 2.5rem;display:flex;justify-content:space-between;align-items:center;background:rgba(246,242,237,0.85);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);transition:all 0.4s}
nav.scrolled{padding:0.65rem 2.5rem;box-shadow:0 1px 18px rgba(78,63,52,0.05)}
.logo{text-decoration:none;font-family:'Lora',serif;font-size:1.4rem;font-weight:700;color:var(--text)}
.logo span{color:var(--gold);position:relative;top:0.06em}
.nav-links{display:flex;gap:1.6rem;list-style:none}
.nav-links a{font-size:0.75rem;font-weight:600;color:var(--text-light);text-decoration:none;letter-spacing:0.03em;transition:color 0.3s}
.nav-links a:hover{color:var(--gold)}
.mob{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:4px}
.mob span{display:block;width:22px;height:2px;background:var(--text-light);border-radius:2px}

/* HERO */
.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:8rem 2rem 5rem;position:relative;overflow:hidden;background:linear-gradient(180deg,#93968F 0%,#AAA99E 12%,#C2BFAF 28%,#D6D0C2 45%,var(--bg) 75%)}
.hero::before{content:'';position:absolute;top:-6%;left:50%;transform:translateX(-50%);width:460px;height:380px;background:radial-gradient(ellipse,rgba(255,245,200,0.65) 0%,rgba(220,200,130,0.4) 12%,rgba(184,155,74,0.25) 28%,rgba(184,155,74,0.08) 50%,transparent 70%);border-radius:50%;animation:sunP 7s ease-in-out infinite}
.hero::after{content:'';position:absolute;top:0;left:0;right:0;height:52%;pointer-events:none;background:radial-gradient(ellipse at 8% 12%,rgba(130,133,126,0.6) 0%,transparent 38%),radial-gradient(ellipse at 92% 8%,rgba(128,131,124,0.55) 0%,transparent 36%),radial-gradient(ellipse at 28% 4%,rgba(140,142,135,0.5) 0%,transparent 40%),radial-gradient(ellipse at 72% 6%,rgba(135,138,130,0.45) 0%,transparent 34%),radial-gradient(ellipse at 22% 28%,rgba(160,158,148,0.5) 0%,transparent 70%),radial-gradient(ellipse at 78% 22%,rgba(155,153,143,0.45) 0%,transparent 65%),radial-gradient(ellipse at 50% 16%,rgba(148,146,136,0.4) 0%,transparent 45%),radial-gradient(ellipse at 38% 40%,rgba(175,172,162,0.3) 0%,transparent 32%),radial-gradient(ellipse at 62% 38%,rgba(170,168,158,0.25) 0%,transparent 28%),radial-gradient(ellipse at 48% 20%,rgba(210,195,140,0.1) 0%,transparent 22%)}
.sun-rays{position:absolute;top:-8%;left:50%;transform:translateX(-50%);width:750px;height:750px;pointer-events:none;background:conic-gradient(from 0deg at 50% 30%,transparent 0deg,rgba(184,155,74,0.1) 7deg,transparent 14deg,transparent 28deg,rgba(200,175,90,0.08) 35deg,transparent 42deg,transparent 56deg,rgba(184,155,74,0.11) 62deg,transparent 70deg,transparent 88deg,rgba(195,170,85,0.07) 94deg,transparent 100deg,transparent 118deg,rgba(184,155,74,0.1) 124deg,transparent 130deg,transparent 148deg,rgba(200,175,90,0.08) 154deg,transparent 160deg,transparent 178deg,rgba(184,155,74,0.1) 184deg,transparent 190deg,transparent 208deg,rgba(195,170,85,0.07) 214deg,transparent 220deg,transparent 238deg,rgba(184,155,74,0.1) 244deg,transparent 250deg,transparent 268deg,rgba(200,175,90,0.06) 274deg,transparent 280deg,transparent 298deg,rgba(184,155,74,0.09) 304deg,transparent 310deg,transparent 328deg,rgba(195,170,85,0.07) 334deg,transparent 340deg,transparent 360deg);animation:raysR 100s linear infinite}
.sun-haze{position:absolute;top:3%;left:50%;transform:translateX(-50%);width:550px;height:260px;pointer-events:none;background:radial-gradient(ellipse,rgba(255,238,175,0.18) 0%,rgba(184,155,74,0.06) 40%,transparent 70%);animation:sunP 9s ease-in-out infinite reverse}
@keyframes sunP{0%,100%{opacity:0.85;transform:translateX(-50%) scale(1)}50%{opacity:1;transform:translateX(-50%) scale(1.05)}}
@keyframes raysR{from{transform:translateX(-50%) rotate(0)}to{transform:translateX(-50%) rotate(360deg)}}
.hero-content{position:relative;z-index:3}
.hero-cross{font-size:2rem;color:var(--gold);margin-bottom:1.5rem;opacity:0;animation:up .8s ease .2s forwards;text-shadow:0 0 25px rgba(184,155,74,0.25)}
.hero-logo{font-family:'Lora',serif;font-size:clamp(3rem,7vw,5.2rem);font-weight:700;color:var(--text);line-height:1;margin-bottom:0.5em;opacity:0;animation:up .8s ease .35s forwards}
.hero-logo span{color:var(--gold);position:relative;top:0.06em}
.hero-mission{font-family:'Lora',serif;font-size:clamp(0.92rem,1.6vw,1.08rem);font-style:italic;color:var(--text);max-width:540px;line-height:1.9;margin:0 auto 2.5rem;opacity:0;animation:up .8s ease .5s forwards}
.hero-verse{font-family:'Lora',serif;font-style:italic;font-size:0.95rem;color:var(--text);line-height:1.85;max-width:480px;margin:0 auto;opacity:0;animation:up .8s ease .65s forwards}
.hero-verse cite{display:block;margin-top:0.6rem;font-family:'Quicksand',sans-serif;font-style:normal;font-size:0.72rem;font-weight:700;color:var(--gold);letter-spacing:0.06em}
.scroll-h{position:absolute;bottom:2.5rem;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:0.5rem;opacity:0;animation:up .8s ease 1s forwards;z-index:3}
.scroll-h span{font-size:0.6rem;font-weight:700;text-transform:uppercase;letter-spacing:0.2em;color:var(--text-light)}
.scroll-dot{width:4px;height:4px;border-radius:50%;background:var(--gold);animation:pulse 2.5s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:0.3;transform:scale(0.8)}50%{opacity:1;transform:scale(1.4)}}
@keyframes up{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}

/* PAGE HERO */
.page-hero{padding:10rem 2rem 4rem;text-align:center;background:linear-gradient(180deg,rgba(147,150,143,0.3) 0%,var(--bg) 100%);position:relative;overflow:hidden}
.page-hero::before{content:'';position:absolute;top:-10%;left:50%;transform:translateX(-50%);width:400px;height:300px;background:radial-gradient(ellipse,rgba(255,245,200,0.3) 0%,rgba(184,155,74,0.1) 30%,transparent 65%);border-radius:50%}
.page-hero h1{font-family:'Lora',serif;font-size:clamp(2rem,4vw,2.8rem);font-weight:500;color:var(--text);margin-bottom:0.8rem;position:relative}
.page-hero p{font-family:'Lora',serif;font-style:italic;font-size:1rem;color:var(--text-light);max-width:500px;margin:0 auto;position:relative}

/* SECTIONS */
.sec{padding:5rem 2rem;max-width:680px;margin:0 auto}
.sec-alt{background:rgba(237,232,225,0.7)}
.sec-label{font-size:0.65rem;font-weight:700;text-transform:uppercase;letter-spacing:0.22em;color:var(--gold);margin-bottom:1.8rem}
h2{font-family:'Lora',serif;font-size:clamp(1.6rem,3vw,2.2rem);font-weight:500;line-height:1.35;color:var(--text);margin-bottom:1.5rem}
h3{font-family:'Lora',serif;font-size:1.15rem;font-weight:500;color:var(--text);margin-bottom:0.8rem;margin-top:2.5rem}
h3:first-child{margin-top:0}
p{margin-bottom:1.2rem;color:var(--text);font-size:0.95rem}
p.light{color:var(--text-light)}
p:last-child{margin-bottom:0}
.italic{font-family:'Lora',serif;font-style:italic;font-size:1.05rem;line-height:1.85;color:var(--text)}
.break-line{font-family:'Lora',serif;font-style:italic;font-size:1.1rem;color:var(--gold);text-align:center;margin:2.5rem 0}
.gold-divider{width:40px;height:1.5px;background:var(--gold);margin:2rem 0}
.verse-block{border-left:2px solid var(--gold);padding-left:1.5rem;margin:2rem 0}
.verse-block p{font-family:'Lora',serif;font-style:italic;font-size:0.95rem;line-height:1.8;margin-bottom:0.3rem}
.verse-block cite{font-family:'Quicksand',sans-serif;font-style:normal;font-size:0.72rem;font-weight:700;color:var(--gold);letter-spacing:0.05em}
a.text-link{color:var(--gold);text-decoration:none;font-weight:600;transition:opacity 0.3s}
a.text-link:hover{opacity:0.7}
.beliefs-band{padding:4rem 2rem;background:var(--sage);text-align:center}
.beliefs-band .sec-label{color:rgba(255,255,255,0.6)}
.beliefs-band h2{color:#fff;margin-bottom:2rem}
.beliefs-band p{font-family:'Lora',serif;font-style:italic;font-size:1.08rem;color:rgba(255,255,255,0.9);line-height:1.7;margin-bottom:0.6rem}

/* DAILY VERSE */
.verse-card-area{text-align:center;margin-top:1rem}
#dv{font-family:'Lora',serif;font-style:italic;font-size:clamp(1rem,2vw,1.2rem);line-height:1.85;color:var(--text);max-width:540px;margin:0 auto 1rem}
#dr{font-size:0.78rem;font-weight:700;color:var(--gold);letter-spacing:0.05em}
.vb{display:flex;justify-content:center;gap:0.8rem;margin-top:1.5rem}
.vb button{width:40px;height:40px;border-radius:50%;border:1.5px solid var(--bg-alt);background:var(--white-glass);color:var(--text-light);font-size:1rem;cursor:pointer;transition:all 0.3s;display:flex;align-items:center;justify-content:center}
.vb button:hover{border-color:var(--gold);color:var(--gold)}

/* JOURNAL */
.jform{margin:1.5rem 0 2rem;border-bottom:1px solid rgba(184,155,74,0.15);padding-bottom:2rem}
.jform .jd{font-size:0.68rem;font-weight:700;color:var(--gold);letter-spacing:0.12em;text-transform:uppercase;margin-bottom:1rem}
.jform textarea{width:100%;min-height:120px;border:none;outline:none;font-family:'Quicksand',sans-serif;font-size:0.95rem;line-height:1.8;color:var(--text);resize:vertical;background:transparent}
.jform textarea::placeholder{color:var(--text-light);opacity:0.5}
.jfoot{display:flex;justify-content:space-between;align-items:center;margin-top:1.2rem}
.jfoot select{padding:0.5rem 0.8rem;border:1px solid rgba(184,155,74,0.2);border-radius:8px;font-family:'Quicksand',sans-serif;font-size:0.82rem;color:var(--text-light);background:transparent;cursor:pointer;outline:none}
.btn{padding:0.6rem 1.6rem;background:var(--gold);color:#fff;border:none;border-radius:8px;font-family:'Quicksand',sans-serif;font-size:0.82rem;font-weight:600;cursor:pointer;transition:all 0.3s}
.btn:hover{opacity:0.85;transform:translateY(-1px)}
.jents{display:flex;flex-direction:column;gap:1.5rem}
.je{border-bottom:1px solid rgba(184,155,74,0.08);padding-bottom:1.5rem}
.jeh{display:flex;justify-content:space-between;align-items:center;margin-bottom:0.5rem}
.jed{font-size:0.68rem;font-weight:700;color:var(--gold);letter-spacing:0.06em;text-transform:uppercase}
.jem{font-size:1rem}
.jet{font-size:0.93rem;line-height:1.8}
.jedel{background:none;border:none;font-size:0.68rem;color:var(--text-light);opacity:0.4;cursor:pointer;margin-top:0.4rem;transition:opacity 0.3s}
.jedel:hover{opacity:1}

/* RESOURCES */
.resource-item{margin-bottom:1.5rem}
.resource-item a{font-family:'Lora',serif;font-size:1.05rem;font-weight:500;color:var(--text);text-decoration:none;transition:color 0.3s}
.resource-item a:hover{color:var(--gold)}
.resource-item a::after{content:' →';color:var(--gold);font-size:0.85rem}
.resource-item p{font-size:0.88rem;color:var(--text-light);margin-top:0.3rem;margin-bottom:0}

/* CONTACT */
.cf label{display:block;font-size:0.68rem;font-weight:700;color:var(--gold);letter-spacing:0.1em;text-transform:uppercase;margin-bottom:0.4rem;margin-top:1.2rem}
.cf label:first-child{margin-top:0}
.cf input,.cf textarea,.cf select{width:100%;padding:0.7rem 0;border:none;border-bottom:1px solid rgba(184,155,74,0.2);font-family:'Quicksand',sans-serif;font-size:0.95rem;color:var(--text);background:transparent;outline:none;transition:border-color 0.3s}
.cf input:focus,.cf textarea:focus,.cf select:focus{border-color:var(--gold)}
.cf input::placeholder,.cf textarea::placeholder{color:var(--text-light);opacity:0.4}
.cf textarea{min-height:80px;resize:vertical}
.cf .btn{width:100%;margin-top:2rem;padding:0.75rem}
.fs{display:none;text-align:center;padding:2rem 0;color:var(--gold);font-weight:600}

/* FOOTER */
footer{padding:4rem 2rem 3rem;background:var(--text);text-align:center}
.fl{font-family:'Lora',serif;font-size:1.5rem;font-weight:700;color:rgba(246,242,237,0.7);margin-bottom:0.8rem}
.fl span{color:var(--gold);position:relative;top:0.04em}
footer .ft{font-size:0.85rem;color:rgba(246,242,237,0.4);margin-bottom:1.5rem;line-height:1.6}
footer .fv{font-family:'Lora',serif;font-style:italic;font-size:0.88rem;color:rgba(246,242,237,0.25);max-width:400px;margin:0 auto 1.5rem;line-height:1.7}
footer .fd{font-size:0.68rem;font-weight:700;color:rgba(246,242,237,0.2);letter-spacing:0.14em;text-transform:uppercase}

@media(max-width:768px){
  nav{padding:0.8rem 1.5rem}
  .nav-links{display:none}
  .nav-links.open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:rgba(246,242,237,0.97);backdrop-filter:blur(28px);padding:1.2rem 1.5rem;gap:1rem;border-radius:0 0 16px 16px;box-shadow:0 4px 20px rgba(78,63,52,0.06)}
  .mob{display:flex}
  .hero{padding:7rem 1.5rem 5rem;min-height:auto}
  .page-hero{padding:8rem 1.5rem 3rem}
  .sec{padding:4rem 1.5rem}
  .jfoot{flex-direction:column;gap:1rem;align-items:stretch}
  .btn{text-align:center}
}
.reveal{opacity:0;transform:translateY(16px);transition:opacity 0.7s ease,transform 0.7s ease}
.reveal.vis{opacity:1;transform:translateY(0)}
