/* Civil Air Patrol Chaplain Corps — public site (staged for Firebase migration) */
:root{
  --blue:#001871; --navy:#0a1c6b; --charcoal:#3a3a3a; --gold:#FFCD00; --red:#EB1E1E; --formblue:#204ce5;
  --ink:#1a1a1a; --mut:#5a6172; --line:#e2e5ec; --bg:#ffffff; --panel:#f6f7fa;
  --maxw:940px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6}
img{max-width:100%;height:auto}
a{color:var(--blue)}

/* Header — matches capchaplain.com: navy bar, CAP wordmark, outbound nav, social */
.site-header{display:flex;align-items:center;gap:22px;background:var(--navy);color:#fff;padding:12px 22px;flex-wrap:wrap}
.site-header .brand{display:flex;align-items:center;text-decoration:none;flex-shrink:0}
.site-header .brand img{height:40px;width:auto;display:block}
.site-header .nav{display:flex;gap:22px;flex:1;flex-wrap:wrap;align-items:center}
.site-header .nav a{color:#fff;text-decoration:none;font-size:14px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:4px 0}
.site-header .nav a:hover{text-decoration:underline;text-underline-offset:5px}
.social{display:flex;gap:10px;align-items:center;flex-shrink:0}
.social a{display:inline-flex;width:30px;height:30px;align-items:center;justify-content:center;color:#fff;border:1px solid rgba(255,255,255,.55);border-radius:6px}
.social a:hover{background:rgba(255,255,255,.15)}
.social svg{width:15px;height:15px;fill:currentColor}

/* Layout */
.container{max-width:var(--maxw);margin:0 auto;padding:28px 18px 56px}
.center{text-align:center}

/* Landing hero */
.hero-title{text-align:center;font-size:clamp(22px,4vw,30px);font-weight:800;color:var(--ink);margin:8px 0 6px}
.hero-headline{text-align:center;font-size:clamp(22px,4.6vw,32px);font-weight:800;color:var(--red);margin:6px 0;line-height:1.25}
.hero-sub{text-align:center;font-size:clamp(18px,3.2vw,22px);font-weight:700;margin:4px 0}
.hero-blue{color:var(--blue)}

/* Video */
.video-wrap{position:relative;width:100%;max-width:760px;margin:22px auto;aspect-ratio:16/9;border-radius:12px;overflow:hidden;
  box-shadow:0 6px 24px rgba(0,24,113,.18);background:#000}
.video-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* Buttons */
.btn{display:inline-block;text-decoration:none;font-weight:700;border:none;border-radius:9px;padding:13px 26px;cursor:pointer;font-size:16px}
.btn-red{background:var(--red);color:#fff}
.btn-red:hover{background:#c81717}
.btn-blue{background:var(--formblue);color:#fff}
.btn-blue:hover{background:#1a3fc0}
.btn-blue[disabled]{opacity:.6;cursor:default}
.btn-wrap{text-align:center;margin:22px 0 30px}

/* FAQ accordions */
.faq{border:1px solid var(--line);border-radius:10px;margin:10px 0;overflow:hidden;background:#fff}
.faq>summary{list-style:none;cursor:pointer;background:var(--blue);color:#fff;font-weight:700;padding:14px 18px;font-size:16px;
  display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq>summary::-webkit-details-marker{display:none}
.faq>summary::after{content:"+";font-size:22px;line-height:1;color:var(--gold)}
.faq[open]>summary::after{content:"–"}
.faq>div{padding:16px 18px;color:var(--ink)}
.faq a{color:var(--formblue)}

/* Articles (Transmitter) */
.article{max-width:800px;margin:0 auto}
.article h1{color:var(--blue);font-size:clamp(24px,4vw,32px);margin:6px 0 4px;line-height:1.2}
.article .byline{color:var(--mut);font-weight:600;margin:0 0 18px}
.article h2{color:var(--blue);font-size:22px;margin:26px 0 8px;line-height:1.25}
.article p{margin:0 0 14px}
.article hr{border:0;border-top:2px solid var(--line);margin:30px 0}
.article figure{margin:16px 0;text-align:center}
.article figcaption{color:var(--mut);font-size:14px;margin-top:6px}
.article img.alignright{float:right;margin:6px 0 12px 20px;max-width:min(300px,42%)}
.article img.alignleft{float:left;margin:6px 20px 12px 0;max-width:min(300px,42%)}
.article .clear{clear:both}
.back-link{display:inline-block;margin:0 0 14px;font-weight:600;text-decoration:none}

/* Transmitter hub cards */
.lead{color:var(--mut);text-align:center;max-width:640px;margin:0 auto 26px}
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.issue-card{display:block;text-decoration:none;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px;
  transition:box-shadow .15s,border-color .15s}
.issue-card:hover{border-color:var(--blue);box-shadow:0 4px 16px rgba(0,24,113,.12)}
.issue-card .k{color:var(--blue);font-weight:800;font-size:18px;margin:0 0 6px}
.issue-card .d{color:var(--mut);font-size:14px}
.archive-note{text-align:center;margin:26px 0 0;color:var(--mut)}

/* Contact form */
.form-card{max-width:640px;margin:0 auto;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px}
.form-intro{text-align:center;color:var(--ink);margin:0 0 18px}
.field{margin:0 0 15px}
.field label{display:block;font-weight:700;color:var(--blue);font-size:14px;margin:0 0 5px}
.field .req{color:var(--red)}
.field .sub{font-weight:400;color:var(--mut);font-size:12.5px}
.field input,.field textarea{width:100%;padding:11px 12px;font-size:15px;border:1px solid #ccd2df;border-radius:8px;outline:none;background:#fff;font-family:inherit}
.field input:focus,.field textarea:focus{border-color:var(--formblue);box-shadow:0 0 0 3px rgba(32,76,229,.12)}
.field textarea{min-height:120px;resize:vertical}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hp{position:absolute;left:-5000px;width:1px;height:1px;overflow:hidden}
.banner{display:none;border-radius:9px;padding:13px 16px;margin:0 0 16px;font-size:15px}
.banner.ok{display:block;background:#e6f4ea;color:#14562a;border:1px solid #b7e0c3}
.banner.err{display:block;background:#fbe9e9;color:#7a1414;border:1px solid #f0b8b8}

/* Footer — charcoal bar, repeated nav + contact, matching capchaplain.com */
.site-footer{background:var(--charcoal);color:#fff;padding:26px 20px;text-align:center}
.foot-nav{display:flex;gap:26px;justify-content:center;flex-wrap:wrap;margin:0 0 16px}
.foot-nav a{color:#fff;text-decoration:underline;text-underline-offset:3px;font-size:15px;font-weight:600}
.foot-contact{font-size:15px;margin:0 0 10px}
.foot-contact a{color:#fff;text-decoration:underline}
.foot-copy{color:#bdbdbd;font-size:13px}

@media (max-width:640px){
  .site-header{gap:12px 16px;padding:12px 16px}
  .site-header .nav{order:3;flex-basis:100%;gap:14px 18px}
  .site-header .nav a{font-size:13px}
  .foot-nav{gap:16px}
}
@media (max-width:560px){
  .row2{grid-template-columns:1fr}
  .article img.alignleft,.article img.alignright{float:none;display:block;margin:14px auto;max-width:80%}
}