
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=DM+Sans:wght@300;400;500&display=swap');
:root{
  --navy:#1B2B4B;--navy-deep:#0F1C33;--gold:#C4983A;
  --gold-light:#E8C97A;--gold-pale:#F5EDD6;--cream:#FAF7F2;
  --muted:#6B7A8D;--border:rgba(27,43,75,0.12);
  --col:820px;
  --sec-v:4rem;
  --sec-h:4rem;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'DM Sans',sans-serif;background:var(--cream);color:var(--navy);font-size:16px;line-height:1.75;}
a{text-decoration:none;}
img{max-width:100%;display:block;}

/* NAV */
.nav{background:var(--navy);padding:0 var(--sec-h);display:flex;align-items:center;justify-content:space-between;height:60px;position:sticky;top:0;z-index:100;}
.nav-brand{font-family:'Cormorant Garamond',serif;font-size:14px;font-weight:500;color:var(--gold-light);letter-spacing:.14em;text-transform:uppercase;}
.nav-links{display:flex;gap:1.75rem;list-style:none;}
.nav-links a{font-size:11px;color:rgba(255,255,255,.6);letter-spacing:.08em;text-transform:uppercase;}
.nav-links a:hover{color:var(--gold-light);}

/* SHARED — every section gets same vertical rhythm */
.sec{padding:var(--sec-v) var(--sec-h);}
.sec-inner{max-width:var(--col);margin:0 auto;}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--gold);color:#0F1C33;font-size:12px;font-weight:600;letter-spacing:.06em;padding:12px 28px;border-radius:2px;cursor:pointer;border:none;text-transform:uppercase;}
.btn:hover{background:var(--gold-light);}

/* LABELS & RULES */
.sec-label{font-size:10px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:.75rem;display:block;}
.rule{width:36px;height:2px;background:var(--gold);margin:1.5rem auto 0;border-radius:1px;}

/* HERO */
.hero{background:var(--navy-deep);padding:5rem var(--sec-h) 4rem;text-align:center;}
.hero-tag{font-size:10px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:1.25rem;}
.hero h1{font-family:'Cormorant Garamond',serif;font-size:50px;font-weight:500;color:#fff;line-height:1.1;max-width:520px;margin:0 auto 1.25rem;}
.hero h1 em{font-style:italic;color:var(--gold-light);}
.hero-sub{font-size:15px;font-weight:300;color:rgba(255,255,255,.58);max-width:480px;margin:0 auto 2rem;line-height:1.8;}
.hero-divider{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:3rem;opacity:.22;}
.hero-divider span{width:40px;height:1px;background:var(--gold);}
.hero-logo-wrap{width:100px;height:100px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;overflow:hidden;padding:6px;}
.hero-logo{width:88px;height:88px;object-fit:contain;}
.hero-brand-name{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:500;color:#fff;letter-spacing:.18em;text-transform:uppercase;margin-bottom:.75rem;line-height:1;}
.hero-brand-divider{width:1px;height:32px;background:rgba(196,152,58,.32);margin:0 auto .875rem;}

/* MISSION */
.mission-sec{background:#fff;}
.mission-inner{max-width:var(--col);margin:0 auto;text-align:center;}
.mission-inner h2{font-family:'Cormorant Garamond',serif;font-size:34px;font-weight:500;color:var(--navy);line-height:1.25;margin-bottom:1rem;}
.mission-inner p{font-size:16px;color:var(--muted);line-height:1.85;font-weight:300;max-width:620px;margin:0 auto;}

/* VIDEO */
.video-sec{background:var(--cream);}
.video-inner{max-width:var(--col);margin:0 auto;}
.video-split{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;margin-bottom:2rem;}
.video-split h2{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:500;color:var(--navy);line-height:1.25;margin-top:.4rem;}
.video-split p{font-size:15px;color:var(--muted);line-height:1.85;font-weight:300;}
.video-wrap{max-width:460px;margin:0 auto;}
.video-frame{border-radius:6px;overflow:hidden;background:var(--navy-deep);}
.video-frame video{width:100%;display:block;}
.video-cap{text-align:center;margin-top:.75rem;}
.video-cap strong{font-size:13px;font-weight:500;color:var(--navy);display:block;}
.video-cap span{font-size:10px;color:var(--muted);letter-spacing:.07em;text-transform:uppercase;}

/* ENTITIES */
.pillars-sec{background:var(--navy);}
.pillars-hdr{text-align:center;margin-bottom:2rem;}
.pillars-hdr h2{font-family:'Cormorant Garamond',serif;font-size:30px;font-weight:500;color:#fff;margin-top:.4rem;}
.pillar-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:rgba(196,152,58,.12);border:1px solid rgba(196,152,58,.12);border-radius:4px;overflow:hidden;max-width:var(--col);margin:0 auto;}
.p-card{background:var(--navy-deep);padding:1.5rem 1rem;text-align:center;transition:background .2s;}
.p-card:hover{background:rgba(196,152,58,.07);}
.p-icon{font-size:18px;color:var(--gold);margin-bottom:.5rem;display:block;}
.p-name{font-size:12px;font-weight:500;color:#fff;letter-spacing:.04em;line-height:1.35;display:block;margin-bottom:.2rem;}
.p-status{font-size:9px;letter-spacing:.09em;text-transform:uppercase;padding:2px 6px;border-radius:20px;display:inline-block;margin-top:.3rem;}
.s-active{background:rgba(196,152,58,.14);color:var(--gold);}
.s-building{background:rgba(255,255,255,.07);color:rgba(255,255,255,.38);}
.s-horizon{background:rgba(255,255,255,.04);color:rgba(255,255,255,.22);}

/* LEADERSHIP */
.leadership-sec{background:#fff;}
.leadership-hdr{text-align:center;margin-bottom:2rem;}
.leadership-hdr h2{font-family:'Cormorant Garamond',serif;font-size:30px;font-weight:500;color:var(--navy);margin-top:.4rem;}
.leader-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;max-width:var(--col);margin:0 auto;}
.l-card{padding:1.5rem 1.25rem;border:.5px solid var(--border);border-radius:4px;text-align:center;background:var(--cream);}
.l-init{width:42px;height:42px;border-radius:50%;background:var(--gold-pale);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:16px;font-weight:600;color:var(--gold);margin:0 auto .65rem;}
.l-name{font-size:13px;font-weight:500;color:var(--navy);display:block;line-height:1.3;}
.l-badge{display:inline-block;margin-top:4px;font-size:9px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;background:var(--navy);color:var(--gold-light);padding:2px 8px;border-radius:20px;}
.l-role{font-size:11px;color:var(--muted);display:block;margin-top:4px;line-height:1.4;}

/* QUOTES CAROUSEL */
.quotes-sec{background:var(--cream);}
.quotes-inner{max-width:var(--col);margin:0 auto;}
.carousel-track{overflow:hidden;border-radius:6px;}
.carousel-slides{display:flex;transition:transform .42s ease;}
.q-slide{min-width:100%;display:flex;justify-content:center;}
.q-slide img{width:100%;max-width:560px;border-radius:6px;box-shadow:0 6px 24px rgba(27,43,75,.1);}
.carousel-controls{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:1.25rem;}
.c-btn{width:36px;height:36px;border-radius:50%;border:.5px solid var(--border);background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--navy);font-size:20px;line-height:1;}
.c-btn:hover{background:var(--gold-pale);border-color:var(--gold);color:var(--gold);}
.c-dots{display:flex;gap:7px;align-items:center;}
.c-dot{width:6px;height:6px;border-radius:50%;background:var(--border);cursor:pointer;border:none;padding:0;}
.c-dot.active{background:var(--gold);}

/* JOIN */
.join-sec{background:var(--navy);}
.join-inner{max-width:520px;margin:0 auto;text-align:center;}
.join-inner h2{font-family:'Cormorant Garamond',serif;font-size:34px;font-weight:500;color:#fff;line-height:1.2;margin-top:.4rem;margin-bottom:.875rem;}
.join-inner > p{font-size:15px;color:rgba(255,255,255,.5);line-height:1.8;margin-bottom:1.5rem;}
.join-form{display:flex;flex-direction:column;gap:.625rem;}
.join-form input{width:100%;padding:12px 16px;border:.5px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);border-radius:2px;font-size:14px;color:#fff;outline:none;font-family:'DM Sans',sans-serif;}
.join-form input::placeholder{color:rgba(255,255,255,.3);}
.join-form input:focus{border-color:var(--gold);}
.join-form select{width:100%;padding:12px 16px;border:.5px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);border-radius:2px;font-size:14px;color:rgba(255,255,255,.6);outline:none;appearance:none;cursor:pointer;font-family:'DM Sans',sans-serif;}
.join-form select option{background:var(--navy);}
.join-form select:focus{border-color:var(--gold);}
.join-submit{background:var(--gold);color:#0F1C33;font-size:12px;font-weight:600;letter-spacing:.06em;padding:13px;border-radius:2px;border:none;cursor:pointer;text-transform:uppercase;width:100%;}
.join-submit:hover{background:var(--gold-light);}
.join-privacy{font-size:11px;color:rgba(255,255,255,.22);margin-top:.5rem;}

/* CLOSING */
.closing-sec{background:var(--navy-deep);}
.closing-inner{max-width:var(--col);margin:0 auto;text-align:center;}
.closing-inner blockquote{font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:400;font-style:italic;color:rgba(255,255,255,.85);line-height:1.55;margin-bottom:1.25rem;}
.closing-inner cite{font-size:10px;font-style:normal;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-weight:500;}

/* FOOTER */
.footer{background:var(--navy-deep);padding:2rem var(--sec-h);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;border-top:.5px solid rgba(255,255,255,.07);}
.footer-brand{font-family:'Cormorant Garamond',serif;font-size:13px;font-weight:500;color:var(--gold-light);letter-spacing:.1em;text-transform:uppercase;}
.footer-sub{font-size:10px;color:rgba(255,255,255,.28);margin-top:2px;font-style:italic;font-family:'Cormorant Garamond',serif;}
.footer-links{display:flex;gap:1.25rem;list-style:none;}
.footer-links a{font-size:10px;color:rgba(255,255,255,.32);letter-spacing:.06em;text-transform:uppercase;}
.footer-links a:hover{color:var(--gold);}

/* ENTITY PAGES */
.ep-hero{background:var(--navy-deep);padding:3.5rem var(--sec-h) 3rem;}
.ep-hero-tag{font-size:9px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);background:rgba(196,152,58,.12);padding:3px 10px;border-radius:20px;display:inline-block;margin-bottom:1rem;}
.ep-hero h1{font-family:'Cormorant Garamond',serif;font-size:44px;font-weight:500;color:#fff;line-height:1.1;margin-bottom:.5rem;}
.ep-hero h1 em{font-style:italic;color:var(--gold-light);}
.ep-tagline{font-size:12px;color:rgba(255,255,255,.42);letter-spacing:.12em;text-transform:uppercase;}
.ep-section{padding:var(--sec-v) var(--sec-h);max-width:900px;margin:0 auto;}
.ep-section h2{font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:500;color:var(--navy);margin:.4rem 0 .875rem;}
.ep-section p{font-size:15px;color:var(--muted);line-height:1.85;font-weight:300;max-width:600px;}
.cta-bar{background:var(--navy);padding:2.5rem var(--sec-h);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;}
.cta-bar p{font-family:'Cormorant Garamond',serif;font-size:22px;font-style:italic;color:rgba(255,255,255,.78);}
.ep-nav-back{font-size:11px;color:rgba(255,255,255,.42);letter-spacing:.05em;text-transform:uppercase;display:flex;align-items:center;gap:5px;}
.ep-nav-back:hover{color:var(--gold-light);}
.cs-badge{font-size:10px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;background:rgba(196,152,58,.15);color:var(--gold);padding:4px 12px;border-radius:20px;display:inline-block;margin-bottom:1.25rem;}

/* ============================================
   MOBILE RESPONSIVE — 768px and below
   ============================================ */
@media (max-width: 768px) {

  :root {
    --sec-v: 3rem;
    --sec-h: 1.25rem;
    --col: 100%;
  }

  /* NAV */
  .nav { padding: 0 1.25rem; height: 54px; }
  .nav-brand { font-size: 11px; letter-spacing: .08em; }
  .nav-links { gap: 1rem; }
  .nav-links a { font-size: 10px; letter-spacing: .04em; }

  /* HERO */
  .hero { padding: 3.5rem 1.25rem 3rem; }
  .hero-logo-wrap { width: 80px; height: 80px; }
  .hero-logo { width: 68px; height: 68px; }
  .hero-brand-name { font-size: 16px; letter-spacing: .12em; }
  .hero-brand-divider { height: 24px; margin: 0 auto .75rem; }
  .hero-tag { font-size: 9px; }
  .hero h1 { font-size: 36px; max-width: 100%; }
  .hero-sub { font-size: 14px; max-width: 100%; }
  .hero-divider { margin-top: 2rem; }

  /* MISSION */
  .mission-inner h2 { font-size: 26px; }
  .mission-inner p { font-size: 15px; }

  /* VIDEO */
  .video-split {
    grid-template-columns: 1fr;
    gap: 1.25rem;
    margin-bottom: 1.5rem;
  }
  .video-split h2 { font-size: 22px; }
  .video-wrap { max-width: 100%; }

  /* ENTITY GRID — 2 columns on mobile */
  .pillar-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .pillars-hdr h2 { font-size: 24px; }
  .p-card { padding: 1.1rem .75rem; }
  .p-icon { font-size: 16px; }
  .p-name { font-size: 11px; }

  /* LEADERSHIP — 2 columns on mobile */
  .leader-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .leadership-hdr h2 { font-size: 24px; }
  .l-card { padding: 1.1rem .75rem; }
  .l-name { font-size: 12px; }
  .l-role { font-size: 10px; }

  /* QUOTES */
  .q-slide img { max-width: 100%; }
  .quotes-inner { padding: 0; }

  /* JOIN */
  .join-inner h2 { font-size: 26px; }
  .join-inner > p { font-size: 14px; }
  .join-form input,
  .join-form select { font-size: 16px; } /* prevents iOS zoom */

  /* CLOSING */
  .closing-inner blockquote { font-size: 20px; }

  /* FOOTER */
  .footer {
    flex-direction: column;
    align-items: flex-start;
    gap: .75rem;
    padding: 2rem 1.25rem;
  }
  .footer-links { gap: 1rem; }

  /* ENTITY PAGES */
  .ep-hero { padding: 2.5rem 1.25rem 2rem; text-align: center; }
  .ep-hero h1 { font-size: 34px; }
  .ep-section { padding: 2.5rem 1.25rem; }
  .ep-section p { max-width: 100%; }
  .ep-section h2 { font-size: 22px; }
  .cta-bar {
    flex-direction: column;
    text-align: center;
    padding: 2rem 1.25rem;
  }
  .cta-bar p { font-size: 18px; }

  /* ENTITY PAGE GRIDS */
  .prog-grid { grid-template-columns: 1fr !important; }
  .aud-grid { grid-template-columns: 1fr !important; }
  .item-list { grid-template-columns: 1fr !important; }
  .pillars-list { grid-template-columns: 1fr !important; }
  .serve-grid { grid-template-columns: 1fr !important; }
  .programs-grid { grid-template-columns: 1fr 1fr !important; }

  /* CHURCH GIRLY logo in hero */
  .cg-logo-wrap { width: 90px; height: 90px; }
  .cg-logo-wrap img { width: 80px; height: 80px; }

  /* EP STATS row */
  .ep-stats { gap: 1.25rem; flex-wrap: wrap; }
  .ep-stat .n { font-size: 24px; }
}

/* ============================================
   SMALL MOBILE — 420px and below
   ============================================ */
@media (max-width: 420px) {
  .nav-links { gap: .75rem; }
  .nav-links a { font-size: 9px; }
  .hero h1 { font-size: 30px; }
  .hero-brand-name { font-size: 13px; }
  .pillar-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .leader-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .ep-hero h1 { font-size: 28px; }
  .closing-inner blockquote { font-size: 18px; }
}
