:root{
  --color-gold:#D4AF37;
  --color-deep:#1A3A52;
  --color-cafe:#3D3935;
  --color-text:#2C2420;
  --color-text-secondary:#5B524C;
  --color-white:#FFFFFF;
  --color-light-bg:#F7F4EF;
  --color-mist:#E8EBF0;
  --shadow-sm:0 6px 18px rgba(44,36,32,.08);
  --shadow-md:0 12px 30px rgba(44,36,32,.12);
  --radius:14px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:"Lato",system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  font-size:16px;
  line-height:1.7;
  color:var(--color-text);
  background:linear-gradient(180deg,#ffffff 0%,#fbfaf7 55%,#f6f7fb 100%);
}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto;display:block}
.container{width:min(1100px,92%);margin:0 auto}

/* Header */
.main-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid rgba(212,175,55,.25)}
.navbar{padding:.75rem 0}
.nav-container{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.logo{display:flex;align-items:center;gap:.75rem;min-width:0}
.logo img{width:64px;height:64px;object-fit:contain}
.logo-text{font-family:"Cormorant Garamond",serif;font-weight:700;letter-spacing:.3px;font-size:1.4rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.nav-menu{list-style:none;display:flex;gap:1rem;align-items:center;margin:0;padding:0}
.nav-menu a{padding:.55rem .7rem;border-radius:999px;color:var(--color-cafe);font-weight:600;font-size:.95rem}
.nav-menu a.active{background:rgba(212,175,55,.16);color:var(--color-deep)}
.btn-nav{background:var(--color-deep);color:#fff !important}
.btn-nav:hover{text-decoration:none;filter:brightness(1.05)}

.mobile-menu-toggle{display:none;background:transparent;border:0;padding:.25rem;cursor:pointer}
.mobile-menu-toggle span{display:block;width:26px;height:2px;background:var(--color-cafe);margin:6px 0;border-radius:2px}

/* Hero */
.hero{position:relative;min-height:72vh;display:flex;align-items:center;background-image:var(--page-bg);background-size:cover;background-position:center;}
.hero-overlay{position:absolute;inset:0;background:
  radial-gradient(1100px 500px at 20% 10%, rgba(212,175,55,.22), transparent 60%),
  radial-gradient(900px 520px at 80% 20%, rgba(26,58,82,.25), transparent 60%),
  linear-gradient(135deg, rgba(15,47,69,.75) 0%, rgba(35,53,75,.72) 45%, rgba(47,39,68,.74) 100%);
  opacity:1;
}
.hero-content{position:relative;color:#fff;padding:5rem 0 4rem;text-align:center}
.hero-title{font-family:"Cormorant Garamond",serif;font-size:3rem;line-height:1.1;margin:0 0 1rem}
.hero-subtitle{max-width:900px;margin:0 auto 1.8rem;color:rgba(255,255,255,.92);font-size:1.1rem}
.hero-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.hero-scroll{position:absolute;left:50%;bottom:1.25rem;transform:translateX(-50%);color:rgba(255,255,255,.8)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.85rem 1.15rem;border-radius:999px;font-weight:700;border:2px solid transparent;text-decoration:none}
.btn:hover{text-decoration:none}
.btn-primary{background:var(--color-gold);color:#1d1a15}
.btn-secondary{background:transparent;border-color:rgba(255,255,255,.75);color:#fff}

/* Sections */
.section-title{font-family:"Cormorant Garamond",serif;font-size:2.1rem;margin:0 0 1rem;color:var(--color-deep);text-align:center}
.section-subtitle{text-align:center;margin:-.35rem auto 2.2rem;max-width:800px;color:var(--color-text-secondary)}

.intro-section{padding:4rem 0}
.intro-content{max-width:900px;margin:0 auto}
.intro-text p{margin:.9rem 0}
.lead-text{font-size:1.15rem;color:var(--color-cafe)}
.closing-text{margin-top:1.2rem}

.services-preview{padding:4rem 0;background:linear-gradient(180deg, rgba(232,235,240,.55), rgba(247,244,239,.35))}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.service-card{background:rgba(255,255,255,.9);border:1px solid rgba(212,175,55,.20);border-radius:var(--radius);padding:1.4rem;box-shadow:var(--shadow-sm)}
.service-icon{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:rgba(212,175,55,.15);color:var(--color-deep);font-size:1.25rem;margin-bottom:.9rem}
.service-card h3{margin:.2rem 0 .5rem;color:var(--color-deep)}
.service-card p{margin:0 0 .9rem;color:var(--color-text-secondary)}
.link-arrow{color:var(--color-deep);font-weight:700}

.values-section{padding:4rem 0}
.values-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.value-card{background:rgba(255,255,255,.92);border:1px solid rgba(26,58,82,.10);border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow-sm)}
.value-card h3{margin:.2rem 0 .5rem;color:var(--color-deep)}
.value-card p{margin:0;color:var(--color-text-secondary)}

.cta-section{padding:4rem 0;background:linear-gradient(135deg, rgba(212,175,55,.14), rgba(26,58,82,.08))}
.cta-content{text-align:center;max-width:850px;margin:0 auto}
.cta-content h2{font-family:"Cormorant Garamond",serif;color:var(--color-deep);font-size:2.2rem;margin:0 0 .8rem}
.cta-content p{margin:0 auto 1.4rem;color:var(--color-text-secondary)}
.cta-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

/* Page header */
.page-header{padding:3.25rem 0 2.5rem;position:relative;text-align:center;background-image:var(--page-bg);background-size:cover;background-position:center;}
.page-header::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg, rgba(255,255,255,.88), rgba(255,255,255,.72));}
.page-header > .container{position:relative}
.page-header h1{font-family:"Cormorant Garamond",serif;font-size:2.7rem;margin:0 0 .5rem;color:var(--color-deep)}
.page-header p{margin:0 auto;max-width:900px;color:var(--color-text-secondary)}

/* Service list */
.services-section{padding:4rem 0}
.bg-light{background:rgba(247,244,239,.65)}
.service-list{display:grid;gap:1rem;max-width:950px;margin:2.5rem auto 0}
.service-item{background:rgba(255,255,255,.92);border:1px solid rgba(212,175,55,.18);border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow-sm)}
.service-item h3{margin:0 0 .5rem;color:var(--color-deep)}
.service-item p{margin:.35rem 0;color:var(--color-text-secondary)}

/* Bulletin board */
.board-intro{max-width:900px;margin:0 auto 2rem;color:var(--color-text-secondary)}
.bulletin-board{max-width:1100px;margin:0 auto}
.board-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.board-item{background:rgba(255,255,255,.92);border:1px dashed rgba(26,58,82,.25);border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow-sm)}
.board-category{display:inline-block;background:rgba(212,175,55,.18);color:var(--color-deep);padding:.25rem .6rem;border-radius:999px;font-weight:800;font-size:.8rem;margin-bottom:.5rem}
.board-item h3{margin:.3rem 0 .5rem;color:var(--color-deep)}
.board-meta{display:grid;gap:.35rem;margin-top:.8rem;color:var(--color-text-secondary);font-size:.95rem}
.board-meta i{color:var(--color-gold);margin-right:.4rem}

/* Form */
.form-section{padding:4rem 0}
.form-container{max-width:720px;margin:2rem auto 0;background:rgba(255,255,255,.92);border:1px solid rgba(212,175,55,.18);border-radius:var(--radius);padding:1.5rem;box-shadow:var(--shadow-md)}
.form-group{display:grid;gap:.45rem;margin-bottom:1rem}
label{font-weight:800;color:var(--color-deep)}
input,select,textarea{font:inherit;padding:.8rem .9rem;border-radius:12px;border:1px solid rgba(44,36,32,.2);background:#fff}
textarea{min-height:160px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:3px solid rgba(212,175,55,.35);border-color:rgba(212,175,55,.8)}
.form-submit{margin-top:1.25rem}

/* Video embed */
.video-section{padding:4rem 0;background:var(--color-white)}
.video-frame{max-width:900px;margin:0 auto;background:var(--color-mist);padding:1rem;border-radius:16px;box-shadow:var(--shadow-md)}
.video-aspect{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:12px}
.video-aspect iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* Footer */
.main-footer{padding:3.5rem 0 2.25rem;background:linear-gradient(180deg,#122a3a,#0d2230)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:1.5rem}
.footer-logo{width:70px;height:70px;object-fit:contain;margin-bottom:.75rem}
.main-footer, .main-footer a{color:rgba(255,255,255,.92)}
.footer-tagline{color:rgba(255,255,255,.75);margin:.5rem 0 1rem}
.social-links{display:flex;gap:.75rem}
.social-links a{width:40px;height:40px;border-radius:999px;display:grid;place-items:center;background:rgba(255,255,255,.08)}
.social-links a:hover{text-decoration:none;background:rgba(212,175,55,.22)}
.footer-column h4{margin:.15rem 0 .75rem;color:#fff}
.footer-links,.footer-contact{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.footer-links a:hover,.footer-contact a:hover{text-decoration:underline}
.btn-donate{margin-top:1rem;background:rgba(212,175,55,.95);color:#1d1a15;border-radius:999px;padding:.75rem 1rem;display:inline-flex;gap:.5rem;font-weight:900}
.btn-donate:hover{text-decoration:none;filter:brightness(1.05)}
.footer-bottom{margin-top:2.25rem;padding-top:1.25rem;border-top:1px solid rgba(255,255,255,.12);text-align:center;color:rgba(255,255,255,.72)}

/* Watermark background */
.watermark{position:fixed;inset:0;pointer-events:none;opacity:.055;background-repeat:no-repeat;background-position:center;background-size:min(70vh,560px);filter:grayscale(10%)}
.watermark{background-image:url("../images/logo.png")}

/* Responsive */
@media (max-width: 980px){
  .services-grid{grid-template-columns:1fr}
  .values-grid{grid-template-columns:repeat(2,1fr)}
  .board-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr}
}
@media (max-width: 820px){
  .nav-menu{position:fixed;top:74px;right:16px;left:16px;background:rgba(255,255,255,.97);border:1px solid rgba(212,175,55,.25);border-radius:16px;box-shadow:var(--shadow-md);padding:1rem;display:none;flex-direction:column;align-items:stretch}
  .nav-menu.open{display:flex}
  .nav-menu a{display:block}
  .mobile-menu-toggle{display:block}
  .logo-text{font-size:1.25rem}
  .hero-title{font-size:2.4rem}
}
@media (max-width: 520px){
  .logo img{width:54px;height:54px}
  .hero-content{padding:4.25rem 0 3.5rem}
}

@media (prefers-reduced-motion: reduce){
  *{scroll-behavior:auto !important;transition:none !important;animation:none !important}
}