/* ============================================================
   Mount Vernon Washington Stake — site stylesheet
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@200;300;400;500;600;700&family=Mulish:wght@300;400;500;600&display=swap');

:root{
  --bg:        #f3efe6;
  --bg-soft:   #efe9dd;
  --bg-tan:    #c1ad8e;
  --ink:       #2e2d2b;
  --soft:      #5d5b57;
  --faint:     #8a857c;
  --line:      #ded8ca;
  --accent:    #6e6249;
  --white:     #ffffff;
  --maxw:      1000px;
  --font-display: 'Jost', 'Century Gothic', 'Futura', sans-serif;
  --font-body:    'Mulish', 'Helvetica Neue', Arial, sans-serif;
}
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; font-size:16px; }
body{ font-family:var(--font-body); font-weight:400; font-size:1rem; line-height:1.75; color:var(--ink); background:var(--bg); -webkit-font-smoothing:antialiased; }
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
h1,h2,h3,h4,h5{ font-family:var(--font-display); font-weight:300; line-height:1.18; color:var(--ink); }
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 24px; }

.site-header{ position:sticky; top:0; z-index:120; background:var(--bg); border-bottom:1px solid rgba(0,0,0,0.04); }
.header-inner{ max-width:var(--maxw); margin:0 auto; padding:22px 24px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand{ line-height:1; }
.brand-main{ display:block; font-family:var(--font-display); font-weight:400; font-size:1.85rem; letter-spacing:0.06em; color:var(--ink); text-transform:uppercase; }
.brand-sub{ display:block; font-family:var(--font-display); font-weight:300; font-size:1.05rem; letter-spacing:0.34em; color:var(--ink); text-transform:uppercase; margin-top:4px; padding-left:2px; }

.nav{ display:flex; align-items:center; gap:6px; }
.nav > li{ position:relative; }
.nav > li > a, .nav > li > .navtop{ display:block; cursor:pointer; font-family:var(--font-display); font-weight:300; font-size:1.02rem; letter-spacing:0.01em; color:var(--ink); padding:10px 16px; background:none; border:none; transition:color .2s; }
.nav > li > a:hover, .nav > li > .navtop:hover{ color:var(--accent); }
.dropdown{ position:absolute; top:calc(100% + 4px); left:0; min-width:230px; background:var(--white); border:1px solid var(--line); box-shadow:0 14px 34px rgba(0,0,0,0.10); opacity:0; visibility:hidden; transform:translateY(-6px); transition:all .2s ease; padding:8px 0; z-index:30; }
.has-menu:hover .dropdown, .has-menu:focus-within .dropdown{ opacity:1; visibility:visible; transform:translateY(0); }
.dropdown li a{ display:block; padding:9px 22px; font-family:var(--font-display); font-weight:300; font-size:0.95rem; color:var(--ink); transition:background .15s,color .15s; }
.dropdown li a:hover{ background:var(--bg-soft); color:var(--accent); }
.burger{ display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px; }
.burger span{ width:26px; height:2px; background:var(--ink); display:block; }
.mobile{ display:none; position:fixed; inset:0; z-index:200; background:var(--bg); overflow-y:auto; padding:24px; }
.mobile.open{ display:block; }
.mobile-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:28px; }
.mobile-close{ background:none; border:none; font-size:2rem; line-height:1; cursor:pointer; color:var(--ink); }
.mobile a{ display:block; font-family:var(--font-display); font-weight:300; font-size:1.3rem; padding:11px 0; border-bottom:1px solid var(--line); color:var(--ink); }
.mobile .sub{ font-size:0.78rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--faint); padding:18px 0 4px; border:none; }

.btn{ display:inline-block; font-family:var(--font-display); font-weight:300; font-size:0.95rem; letter-spacing:0.04em; padding:11px 26px; cursor:pointer; border:1px solid currentColor; background:none; transition:all .2s; }
.btn-ghost-light{ color:#fff; border-color:rgba(255,255,255,0.85); }
.btn-ghost-light:hover{ background:rgba(255,255,255,0.16); }
.btn-dark{ color:var(--ink); border-color:var(--ink); }
.btn-dark:hover{ background:var(--ink); color:var(--bg); }

.hero{ position:relative; max-width:var(--maxw); margin:0 auto; min-height:400px; display:flex; align-items:center; overflow:hidden; }
.hero-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.hero-shade{ position:absolute; inset:0; background:linear-gradient(90deg, rgba(243,236,222,0.97) 0%, rgba(244,231,205,0.92) 38%, rgba(244,231,205,0.52) 58%, rgba(244,231,205,0) 76%); }
.hero-inner{ position:relative; z-index:2; padding:44px 40px; max-width:470px; }
.hero-welcome{ font-family:var(--font-display); font-weight:300; font-size:1.5rem; color:#5b4d35; margin-bottom:4px; }
.hero-title{ font-family:var(--font-display); font-weight:600; font-size:clamp(2rem,4.5vw,3.2rem); line-height:1.04; color:#0e3a33; letter-spacing:0.01em; text-transform:uppercase; }
.hero-inner .btn{ margin-top:24px; }

.section{ padding:64px 0; }
.section-tight{ padding:40px 0; }
.center{ text-align:center; }
.eyebrow{ font-family:var(--font-display); font-weight:400; font-size:0.72rem; letter-spacing:0.24em; text-transform:uppercase; color:var(--accent); display:block; margin-bottom:14px; }
.lede{ max-width:760px; }
.section h2{ font-size:clamp(1.6rem,3.4vw,2.4rem); margin-bottom:14px; }
.section h3{ font-size:1.4rem; }
.section p{ margin-bottom:1em; color:var(--ink); }
.section p:last-child{ margin-bottom:0; }
.muted{ color:var(--soft); }
.rule{ width:46px; height:1px; background:var(--accent); margin:18px 0 26px; }
.rule.center{ margin-left:auto; margin-right:auto; }
.split{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }

.page-banner{ max-width:var(--maxw); margin:0 auto; }
.page-banner img{ width:100%; height:380px; object-fit:cover; }
.page-title{ font-size:clamp(2rem,5vw,3rem); font-weight:300; }
.page-title.upper{ text-transform:uppercase; letter-spacing:0.04em; }

.events{ max-width:760px; }
.events .month{ font-family:var(--font-display); font-weight:500; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent); margin:22px 0 8px; font-size:0.95rem; }
.events .ev{ padding:9px 0; border-bottom:1px solid var(--line); font-size:0.98rem; color:var(--soft); }
.events .ev b{ color:var(--ink); font-weight:600; }

.info-block{ text-align:center; max-width:760px; margin:0 auto; }
.info-block h2{ font-weight:300; margin:44px 0 8px; }
.info-block .big{ font-size:1.5rem; font-weight:300; color:var(--ink); }
.info-block a{ color:var(--accent); }
.schedule-grid{ display:grid; grid-template-columns:1fr 1fr; gap:8px 40px; max-width:560px; margin:14px auto 0; text-align:center; }
.schedule-grid div{ font-size:1.2rem; font-weight:300; color:var(--ink); padding:6px 0; }
.schedule-grid .lbl{ font-weight:500; color:var(--soft); font-size:0.95rem; letter-spacing:0.04em; }

.buildings{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:40px; }
.building{ text-align:center; }
.building img{ width:100%; height:220px; object-fit:cover; margin-bottom:18px; }
.building h2{ font-size:1.45rem; font-weight:300; margin-bottom:8px; }
.building p{ color:var(--soft); margin:0; line-height:1.6; }
.building .map-embed{ margin-top:16px; aspect-ratio:4/3; }

.map-embed{ width:100%; max-width:760px; margin:42px auto 0; aspect-ratio:16/9; border:1px solid var(--line); background:var(--bg-soft); }
.map-embed iframe{ width:100%; height:100%; border:0; display:block; }
.duration-note{ font-size:0.95rem; color:var(--soft); margin-top:16px; font-style:italic; }

.tiles{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
.tiles a{ background:var(--bg); padding:24px 26px; transition:background .15s; }
.tiles a:hover{ background:var(--white); }
.tiles a .t{ font-family:var(--font-display); font-size:1.1rem; font-weight:400; color:var(--ink); }
.tiles a .d{ font-size:0.88rem; color:var(--soft); margin-top:4px; display:block; }

.cform{ max-width:520px; }
.cform label{ display:block; font-size:0.85rem; color:var(--soft); margin:14px 0 5px; letter-spacing:0.02em; }
.cform input,.cform textarea{ width:100%; padding:11px 13px; border:1px solid var(--line); background:var(--white); font-family:var(--font-body); font-size:0.95rem; color:var(--ink); outline:none; }
.cform input:focus,.cform textarea:focus{ border-color:var(--accent); }
.cform button{ margin-top:20px; }

.event-feature{ display:grid; grid-template-columns:minmax(0,360px) 1fr; gap:48px; align-items:start; max-width:920px; margin:0 auto; }
.event-poster{ width:100%; border:1px solid var(--line); box-shadow:0 8px 28px rgba(0,0,0,0.10); }
.event-meta .when{ font-family:var(--font-display); font-size:1.3rem; font-weight:300; color:var(--ink); margin:0; }
.event-badges{ display:flex; flex-wrap:wrap; gap:10px; margin:20px 0 22px; }
.event-badge{ font-family:var(--font-display); font-size:0.82rem; letter-spacing:0.03em; color:var(--accent); border:1px solid var(--line); padding:6px 14px; background:var(--white); }
.flyer-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; max-width:760px; margin:8px auto 0; align-items:start; }
.flyer-row figure{ max-width:none; margin:0; }
.flyer-row img{ width:100%; border:1px solid var(--line); box-shadow:0 4px 18px rgba(0,0,0,0.08); }
.flyer-row figcaption{ font-family:var(--font-display); font-size:0.85rem; letter-spacing:0.04em; text-transform:uppercase; color:var(--soft); margin-top:10px; text-align:center; }

.faq-wrap{ max-width:760px; margin:0 auto; border:1px solid var(--line); background:var(--white); }
.faq-wrap > summary{ cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:18px; padding:18px 22px; font-family:var(--font-display); font-weight:400; font-size:1.12rem; color:var(--ink); }
.faq-wrap > summary::-webkit-details-marker{ display:none; }
.faq-wrap > summary::after{ content:"\203A"; font-size:1.6rem; line-height:1; color:var(--accent); transform:rotate(90deg); transition:transform .2s ease; flex-shrink:0; }
.faq-wrap[open] > summary::after{ transform:rotate(-90deg); }
.faq-body{ padding:4px 22px 10px; border-top:1px solid var(--line); }
.faq-body .faq-q{ padding:16px 0; border-bottom:1px solid var(--line); }
.faq-body .faq-q:last-child{ border-bottom:none; }
.faq-body .faq-q h4{ font-family:var(--font-display); font-weight:400; font-size:1.05rem; color:var(--ink); text-transform:none; letter-spacing:0; margin-bottom:5px; text-align:left; }
.faq-body .faq-q p{ color:var(--soft); margin:0; font-size:0.95rem; text-align:left; }

#faq{ scroll-margin-top:90px; }
.cal-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:30px 48px; max-width:900px; margin:0 auto; }
.cal-grid .events{ max-width:none; }

.bulletin{ max-width:560px; margin:0 auto; }
.bulletin img{ width:100%; display:block; border:1px solid var(--line); box-shadow:0 8px 28px rgba(0,0,0,0.10); }
.ward-events{ max-width:620px; margin:0 auto; }
.ward-socials{ display:flex; gap:18px; justify-content:center; margin-top:6px; }
.ward-socials a{ width:48px; height:48px; border:1px solid var(--line); display:inline-flex; align-items:center; justify-content:center; color:var(--soft); transition:color .2s, border-color .2s; }
.ward-socials a:hover{ color:var(--accent); border-color:var(--accent); }
.ward-socials svg{ width:22px; height:22px; }
.calendly-wrap{ max-width:760px; margin:0 auto; }
.calendly-inline-widget{ border:1px solid var(--line); background:var(--white); min-width:320px; }

.video-facade{ position:relative; display:block; width:100%; max-width:760px; margin:0 auto; aspect-ratio:16/9; border:1px solid var(--line); background:#000; overflow:hidden; }
.video-facade img{ width:100%; height:100%; object-fit:cover; display:block; transition:opacity .25s; }
.video-facade:hover img{ opacity:0.82; }
.video-facade .play-btn{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:72px; height:50px; background:rgba(20,20,20,0.72); border-radius:12px; display:flex; align-items:center; justify-content:center; transition:background .2s; }
.video-facade:hover .play-btn{ background:#c4302b; }
.video-facade .play-btn svg{ width:26px; height:26px; fill:#fff; margin-left:3px; }

.site-footer{ background:#092824; border-top:none; padding:54px 0 30px; text-align:center; }
.footer-name{ font-family:var(--font-display); font-weight:400; letter-spacing:0.2em; text-transform:uppercase; font-size:1.1rem; color:#ffffff; margin-bottom:18px; }
.socials{ display:flex; gap:18px; justify-content:center; margin-bottom:24px; }
.socials a{ width:30px; height:30px; display:inline-flex; align-items:center; justify-content:center; color:rgba(255,255,255,0.72); transition:color .2s; }
.socials a:hover{ color:#ffffff; }
.disclaimer{ max-width:680px; margin:0 auto 14px; font-size:0.8rem; color:rgba(255,255,255,0.55); line-height:1.6; }
.disclaimer a{ color:rgba(255,255,255,0.78); }
.copyright{ font-size:0.78rem; color:rgba(255,255,255,0.45); letter-spacing:0.02em; }

.to-top{ position:fixed; right:22px; bottom:22px; z-index:150; width:46px; height:46px; border-radius:50%; background:#092824; color:#fff; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 16px rgba(0,0,0,0.22); opacity:0; visibility:hidden; transform:translateY(10px); transition:opacity .25s, transform .25s, background .2s; }
.to-top.show{ opacity:1; visibility:visible; transform:translateY(0); }
.to-top:hover{ background:#0e3a33; }
.to-top svg{ width:22px; height:22px; stroke:#fff; }

.bg-tan{ background:var(--bg-tan); }
.bg-tan h2, .bg-tan h3, .bg-tan .page-title{ color:#2c2418; }
.bg-tan .muted{ color:#463b29; }
.bg-tan p{ color:#33291b; }
.bg-tan .eyebrow, .bg-tan .ref{ color:#5b4d35; }
.bg-tan .rule{ background:#5b4d35; }
.bg-tan .event-badge{ background:rgba(255,255,255,0.45); border-color:#a8916b; color:#5b4d35; }
.bg-tan .faq-wrap{ border-color:#a8916b; }

:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; }

@media (max-width:860px){
  .nav{ display:none; }
  .burger{ display:flex; }
  .split{ grid-template-columns:1fr; gap:32px; }
  .hero{ min-height:300px; }
  .brand-main{ font-size:1.5rem; }
  .brand-sub{ font-size:0.9rem; letter-spacing:0.28em; }
  .page-banner img{ height:260px; }
  .event-feature{ grid-template-columns:1fr; gap:28px; max-width:420px; }
}
@media (max-width:760px){
  .flyer-row{ grid-template-columns:1fr; max-width:340px; }
}
@media (max-width:480px){
  .hero-inner{ padding:36px 22px; }
  .schedule-grid{ grid-template-columns:1fr; }
}

/* restored / new */
.nv-item{ max-width:760px; margin:0 auto 52px; }
.nv-item:last-child{ margin-bottom:0; }
.nv-item h3{ font-size:1.5rem; font-weight:300; margin-bottom:20px; }
.nv-item .muted{ max-width:600px; margin:0 auto 22px; }
.video-embed{ width:100%; max-width:760px; margin:0 auto; aspect-ratio:16/9; border:1px solid var(--line); background:#000; }
.video-embed iframe{ width:100%; height:100%; border:0; display:block; }
.quote{ font-family:var(--font-display); font-weight:300; }
.title-logo{ display:flex; align-items:center; gap:14px; }
.title-logo img{ height:1.5em; width:auto; flex-shrink:0; }
.center .title-logo, .title-logo.center{ justify-content:center; }
.bulletin, .ward-events, .calendly-wrap{ margin-top:14px; }
.org-intro{ align-items:flex-start; }
.org-intro .org-logo{ text-align:center; padding-top:4px; }
.org-intro .org-logo img{ width:100%; max-width:180px; margin:0 auto; display:block; }
@media (max-width:860px){ .org-intro .org-logo img{ max-width:150px; } }

/* hero theme content */
.hero-quote{ font-family:var(--font-display); font-weight:300; font-size:clamp(1.9rem,4vw,2.8rem); color:#0e3a33; line-height:1.14; margin:4px 0 0; }
.hero-ref{ font-family:var(--font-display); font-weight:400; font-size:0.78rem; letter-spacing:0.2em; text-transform:uppercase; color:#5b4d35; margin:10px 0 0; }
.hero-text{ font-family:var(--font-body); font-size:0.97rem; color:#3a3326; line-height:1.65; margin-top:16px; }