
:root{
  --background:oklch(0.08 0.02 300);
  --foreground:oklch(0.97 0.02 90);
  --card:oklch(0.12 0.03 300);
  --primary:oklch(0.85 0.17 90);
  --primary-foreground:oklch(0.08 0.02 300);
  --muted:oklch(0.18 0.03 300);
  --border:oklch(0.25 0.05 300 / 60%);
  --gold:oklch(0.85 0.17 90);
  --gold-soft:oklch(0.92 0.13 95);
  --royal:oklch(0.45 0.22 305);
  --royal-deep:oklch(0.28 0.18 305);
  --ink:oklch(0.06 0.01 300);
}
*{border-color:var(--border);box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--background);color:var(--foreground);font-family:'Inter',system-ui,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.5}
h1,h2,h3,h4{font-family:'Cinzel','Playfair Display',Georgia,serif;letter-spacing:-0.01em;margin:0}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:transparent;color:inherit}
.bg-gradient-royal{background-image:linear-gradient(135deg,var(--ink) 0%,var(--royal-deep) 55%,var(--royal) 100%)}
.bg-gradient-gold{background-image:linear-gradient(135deg,var(--gold-soft) 0%,var(--gold) 50%,oklch(0.65 0.18 70) 100%)}
.bg-gradient-hero{background-image:linear-gradient(135deg,oklch(0.06 0.01 300) 0%,oklch(0.18 0.12 305) 50%,oklch(0.3 0.18 305) 100%)}
.text-gradient-gold{background-image:linear-gradient(135deg,var(--gold-soft),var(--gold) 60%,oklch(0.7 0.18 75));-webkit-background-clip:text;background-clip:text;color:transparent}
.shadow-glow-gold{box-shadow:0 10px 40px -10px oklch(0.85 0.17 90 / 50%),0 0 0 1px oklch(0.85 0.17 90 / 20%)}
.shadow-glow-royal{box-shadow:0 20px 60px -20px oklch(0.45 0.22 305 / 60%)}

/* Header */
.site-header{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .3s,backdrop-filter .3s,border-color .3s;border-bottom:1px solid transparent}
.site-header.scrolled{background:oklch(0.08 0.02 300 / 0.85);backdrop-filter:blur(16px);border-bottom-color:var(--border)}
.header-inner{max-width:80rem;margin:0 auto;display:flex;align-items:center;gap:1rem;padding:.75rem 1rem}
.brand{display:flex;align-items:center;gap:.5rem}
.brand img{height:2.5rem;width:2.5rem;object-fit:contain}
.brand-name{display:none;font-size:.875rem;font-weight:600;letter-spacing:.2em}
.nav-desktop{margin-left:auto;display:none;align-items:center;gap:.25rem}
.nav-desktop a{padding:.5rem .75rem;border-radius:9999px;font-size:.875rem;font-weight:500;color:oklch(0.97 0.02 90 / 0.8);transition:color .2s}
.nav-desktop a:hover,.nav-desktop a.active{color:var(--primary)}
.brand-right{height:2.75rem;width:2.75rem;object-fit:contain;margin-left:auto}
.menu-btn{margin-left:.25rem;display:inline-flex;height:2.5rem;width:2.5rem;align-items:center;justify-content:center;border-radius:9999px;border:1px solid var(--border)}
.mobile-nav{display:none;border-top:1px solid var(--border);background:oklch(0.08 0.02 300 / 0.95);backdrop-filter:blur(16px)}
.mobile-nav.open{display:block}
.mobile-nav nav{max-width:80rem;margin:0 auto;display:flex;flex-direction:column;padding:.75rem 1rem}
.mobile-nav a{padding:.75rem;border-radius:.5rem;font-size:.875rem;font-weight:500;color:oklch(0.97 0.02 90 / 0.85)}
.mobile-nav a:hover{background:var(--muted)}
@media(min-width:640px){.brand-name{display:inline}.header-inner{padding:.75rem 1.5rem}.brand-right{margin-left:1rem}}
@media(min-width:1024px){.nav-desktop{display:flex}.menu-btn{display:none}.brand-right{margin-left:1rem}}

main{padding-top:5rem}
.container{max-width:80rem;margin:0 auto;padding:0 1rem}
@media(min-width:640px){.container{padding:0 1.5rem}}

/* Page hero */
.page-hero{position:relative;overflow:hidden}
.page-hero-overlay{position:absolute;inset:0;opacity:.3;background:radial-gradient(60% 60% at 80% 20%,oklch(0.85 0.17 90 / 0.35),transparent),radial-gradient(50% 50% at 10% 90%,oklch(0.45 0.22 305 / 0.4),transparent)}
.page-hero-inner{position:relative;max-width:80rem;margin:0 auto;padding:5rem 1rem}
.eyebrow{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.3em;color:var(--primary)}
.page-title{margin-top:.75rem;font-size:2.25rem;font-weight:700}
.page-sub{margin-top:1.25rem;max-width:42rem;color:oklch(0.97 0.02 90 / 0.8);font-size:1rem}
@media(min-width:640px){.page-hero-inner{padding:7rem 1.5rem}.page-title{font-size:3.75rem}.page-sub{font-size:1.125rem}}

/* Buttons */
.btn-gold{display:inline-flex;align-items:center;gap:.5rem;border-radius:9999px;background-image:linear-gradient(135deg,var(--gold-soft) 0%,var(--gold) 50%,oklch(0.65 0.18 70) 100%);color:var(--primary-foreground);padding:.875rem 1.75rem;font-size:.875rem;font-weight:600;box-shadow:0 10px 40px -10px oklch(0.85 0.17 90 / 50%),0 0 0 1px oklch(0.85 0.17 90 / 20%);transition:transform .2s}
.btn-gold:hover{transform:scale(1.02)}
.btn-outline{display:inline-flex;align-items:center;gap:.5rem;border-radius:9999px;border:1px solid oklch(0.85 0.17 90 / 0.4);padding:.875rem 1.75rem;font-size:.875rem;font-weight:600;color:var(--foreground);background:oklch(0.08 0.02 300 / 0.3);backdrop-filter:blur(8px);transition:background .2s}
.btn-outline:hover{background:oklch(0.85 0.17 90 / 0.1)}

/* Cards */
.card{border-radius:1.5rem;border:1px solid var(--border);background:var(--card);padding:1.5rem}
.card-hover{transition:transform .3s,box-shadow .3s}
.card-hover:hover{transform:translateY(-4px);box-shadow:0 10px 40px -10px oklch(0.85 0.17 90 / 50%),0 0 0 1px oklch(0.85 0.17 90 / 20%)}
.rounded-3xl{border-radius:1.5rem}
.rounded-2xl{border-radius:1rem}
.rounded-full{border-radius:9999px}
.border-1{border:1px solid var(--border)}

/* Grid helpers */
.grid{display:grid;gap:1.5rem}
.grid-2{grid-template-columns:1fr}
.grid-3{grid-template-columns:1fr}
.grid-4{grid-template-columns:1fr}
@media(min-width:640px){.grid-2,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(min-width:768px){.grid-3{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1024px){.grid-2{grid-template-columns:repeat(2,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}}

/* Hero (home) */
.hero{position:relative;margin-top:-5rem;min-height:100svh;overflow:hidden}
.hero img.bg{position:absolute;inset:0;height:100%;width:100%;object-fit:cover}
.hero .veil{position:absolute;inset:0;background:linear-gradient(135deg,oklch(0.06 0.01 300 / 0.95),oklch(0.28 0.18 305 / 0.7) 60%,oklch(0.45 0.22 305 / 0.4))}
.hero .glow{position:absolute;inset:0;background:radial-gradient(60% 50% at 70% 30%,oklch(0.85 0.17 90 / 0.25),transparent)}
.hero-inner{position:relative;max-width:80rem;margin:0 auto;padding:8rem 1rem 5rem;display:flex;flex-direction:column;justify-content:center;min-height:100svh}
.chip{display:inline-flex;align-items:center;gap:.5rem;border-radius:9999px;border:1px solid oklch(0.85 0.17 90 / 0.4);background:oklch(0.85 0.17 90 / 0.1);padding:.375rem 1rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.25em;color:var(--primary);width:max-content}
.hero h1{margin-top:1.5rem;max-width:56rem;font-size:2.25rem;font-weight:700;line-height:1.05}
.hero p.lead{margin-top:1.5rem;max-width:42rem;color:oklch(0.97 0.02 90 / 0.85);font-size:1rem}
.hero .ctas{margin-top:2.25rem;display:flex;flex-wrap:wrap;gap:.75rem}
.stat-grid{margin-top:4rem;max-width:48rem;display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.stat-card{border-radius:1rem;border:1px solid var(--border);background:oklch(0.08 0.02 300 / 0.3);backdrop-filter:blur(8px);padding:1rem}
.stat-card .v{font-size:1.25rem;font-weight:700}
.stat-card .l{margin-top:.25rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.2em;color:oklch(0.97 0.02 90 / 0.7)}
@media(min-width:640px){.hero h1{font-size:3.75rem}.hero p.lead{font-size:1.125rem}.stat-grid{grid-template-columns:repeat(4,1fr)}}
@media(min-width:1024px){.hero h1{font-size:4.5rem}}

/* Section heading */
.section{padding:6rem 1rem}
@media(min-width:640px){.section{padding:6rem 1.5rem}}
.section .inner{max-width:80rem;margin:0 auto}
.heading-c{max-width:42rem;margin:0 auto;text-align:center}
.heading-c h2{margin-top:.75rem;font-size:1.875rem;font-weight:700}
@media(min-width:640px){.heading-c h2{font-size:3rem}}
.kicker{margin-top:1rem;color:oklch(0.97 0.02 90 / 0.75)}

/* Footer */
.site-footer{position:relative;margin-top:6rem;border-top:1px solid var(--border)}
.footer-inner{max-width:80rem;margin:0 auto;display:grid;gap:2.5rem;padding:4rem 1rem;grid-template-columns:1fr}
@media(min-width:1024px){.footer-inner{grid-template-columns:repeat(4,1fr);padding:4rem 1.5rem}}
.footer-h{font-size:.875rem;font-weight:600;text-transform:uppercase;letter-spacing:.2em;color:var(--primary)}
.footer-list{margin-top:1rem;padding:0;list-style:none;display:flex;flex-direction:column;gap:.5rem;font-size:.875rem;color:oklch(0.97 0.02 90 / 0.8)}
.footer-list a:hover{color:var(--primary)}
.social{margin-top:1.25rem;display:flex;gap:.75rem}
.social a{display:grid;place-items:center;height:2.5rem;width:2.5rem;border-radius:9999px;border:1px solid var(--border);background:oklch(0.08 0.02 300 / 0.4);color:var(--primary);transition:background .2s,color .2s}
.social a:hover{background:var(--primary);color:var(--primary-foreground)}
.footer-bottom{border-top:1px solid var(--border)}
.footer-bottom-inner{max-width:80rem;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:.5rem;padding:1.25rem 1rem;font-size:.75rem;color:oklch(0.97 0.02 90 / 0.6)}
@media(min-width:640px){.footer-bottom-inner{flex-direction:row;padding:1.25rem 1.5rem}}

/* Misc */
.icon-tile{display:grid;place-items:center;height:3.5rem;width:3.5rem;border-radius:1rem;background-image:linear-gradient(135deg,var(--gold-soft) 0%,var(--gold) 50%,oklch(0.65 0.18 70) 100%);color:var(--primary-foreground)}
.icon-tile-sm{display:grid;place-items:center;height:3rem;width:3rem;border-radius:1rem;background-image:linear-gradient(135deg,var(--gold-soft) 0%,var(--gold) 50%,oklch(0.65 0.18 70) 100%);color:var(--primary-foreground)}
.muted{color:oklch(0.97 0.02 90 / 0.75)}
.muted-2{color:oklch(0.97 0.02 90 / 0.8)}
.text-primary{color:var(--primary)}
.input{width:100%;border-radius:1rem;border:1px solid var(--border);background:oklch(0.1 0.03 300);color:var(--foreground);padding:.75rem 1rem;font-size:.875rem;outline:none;font-family:inherit;transition:border-color .2s}
.input:focus{border-color:var(--primary)}
.field-label{margin-bottom:.5rem;display:block;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.2em;color:var(--primary)}
.field{display:block;margin-top:1rem}

/* Sermon/event cards image */
.aspect-video{aspect-ratio:16/9;overflow:hidden;position:relative}
.aspect-4-3{aspect-ratio:4/3;overflow:hidden}
.cover{height:100%;width:100%;object-fit:cover;transition:transform .7s}
.card-hover:hover .cover{transform:scale(1.05)}
.play-overlay{position:absolute;inset:0;background:linear-gradient(to top,oklch(0.06 0.01 300 / 0.9),transparent)}
.play-btn{position:absolute;inset:0;display:grid;place-items:center}
.play-btn span{display:grid;place-items:center;height:4rem;width:4rem;border-radius:9999px;background-image:linear-gradient(135deg,var(--gold-soft) 0%,var(--gold) 50%,oklch(0.65 0.18 70) 100%);color:var(--primary-foreground);box-shadow:0 10px 40px -10px oklch(0.85 0.17 90 / 50%);transition:transform .2s}
.card-hover:hover .play-btn span{transform:scale(1.1)}
