/* ================================================================
   Community Fellowship Church Kanyariri — style.css
   Font: DM Sans ONLY (no Playfair Display)
   Strategy: Mobile-first, CSS variables for all spacing/grids
   Breakpoints: 360 | 480 | 576 | 768 | 992 | 1200
   ================================================================ */

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
img  { max-width: 100%; height: auto; display: block; }

/* ── CSS Variables — phone base, overridden at each breakpoint ── */
:root {
  /* Brand colours */
  --blue:     #137feb;
  --purple:   #d675ff;
  --light:    #c9e6f2;
  --navy:     #0a2a4a;
  --dark:     #0d2d5c;
  --plum:     #3a1060;
  --offwhite: #f4f9fd;
  --muted:    #556070;
  --border:   #d8edf8;
  --text:     #1a1a2e;

  /* Section padding — grows at each breakpoint */
  --sp-v:  2rem;      /* main vertical */
  --sp-v2: 1.5rem;    /* secondary */
  --sp-v3: 1rem;      /* tight */
  --sp-v4: 1.25rem;   /* medium */
  --sp-h:  1rem;      /* horizontal */

  /* Gaps */
  --gap-lg: 1.25rem;
  --gap-md: 1rem;

  /* Responsive grid columns */
  --cols-2:  1fr;
  --cols-3:  1fr;
  --cols-4:  repeat(2,1fr);
  --cols-1a: 1fr;
}
@media(min-width:480px) {
  :root { --sp-v:2.25rem; --sp-v2:1.75rem; --sp-v3:1.25rem; --sp-h:1.2rem;
          --gap-lg:1.5rem; --gap-md:1.25rem; }
}
@media(min-width:576px) {
  :root { --sp-v:2.75rem; --sp-v2:2rem; --sp-v3:1.5rem; --sp-v4:1.75rem; --sp-h:1.5rem;
          --gap-lg:2rem; --gap-md:1.5rem; --cols-3:repeat(2,1fr); }
}
@media(min-width:768px) {
  :root { --sp-v:3.5rem; --sp-v2:2.5rem; --sp-v3:1.75rem; --sp-v4:2.25rem; --sp-h:3%;
          --gap-lg:2.5rem; --gap-md:2rem; --cols-2:1fr 1fr; --cols-1a:1fr auto; }
}
@media(min-width:992px) {
  :root { --sp-v:5rem; --sp-v2:4rem; --sp-v3:2rem; --sp-v4:3rem; --sp-h:5%;
          --gap-lg:4rem; --gap-md:2.5rem; --cols-3:repeat(3,1fr); --cols-4:repeat(4,1fr); }
}

/* ── Base typography — DM Sans only ── */
body {
  font-family: 'DM Sans', sans-serif;
  font-size: 15px;
  color: var(--text);
  background: #fff;
  overflow-x: hidden;
  line-height: 1.65;
  padding-top: 92px;
}
@media(min-width:480px) { body { font-size:16px; padding-top:96px; } }
@media(min-width:768px) { body { padding-top:86px; } }

h1,h2,h3,h4,h5,h6 {
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  line-height: 1.15;
}
p { margin-bottom: 0; }
a { color: inherit; }

/* ── Utilities ── */
.inner         { max-width: 1200px; margin: 0 auto; }
.section-label { display:inline-block; color:var(--blue); font-size:.67rem;
                 font-weight:700; letter-spacing:.18em; text-transform:uppercase; margin-bottom:.4rem; }
.section-title { font-size:clamp(1.35rem,4vw,2.4rem); font-weight:700;
                 color:var(--navy); line-height:1.14; margin-bottom:.5rem; }
.section-title em { font-style:normal; color:var(--purple); }
.section-sub   { color:var(--muted); font-size:clamp(.84rem,2vw,.98rem); line-height:1.85; }

/* ================================================================
   HEADER
   ================================================================ */
.cfc-header {
  position: fixed; top:0; left:0; right:0; z-index:1000;
  background: rgba(10,42,74,.97);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(201,230,242,.12);
  box-shadow: 0 2px 20px rgba(0,0,0,.25);
}
/* Row 1 */
.cfc-header-top {
  display: flex; align-items:center; justify-content:space-between;
  padding: .42rem .85rem; gap:.5rem;
}
@media(min-width:576px){ .cfc-header-top { padding:.48rem 1.4rem; } }
@media(min-width:992px){ .cfc-header-top { padding:.52rem 3rem; } }

.cfc-logo-link {
  display:flex; align-items:center; gap:.5rem;
  text-decoration:none; min-width:0; flex:1; overflow:hidden;
}
.cfc-nav-logo {
  height:32px; width:32px; object-fit:contain;
  background:white; border-radius:6px; padding:2px; flex-shrink:0;
}
@media(min-width:480px){ .cfc-nav-logo { height:38px; width:38px; } }
@media(min-width:768px){ .cfc-nav-logo { height:44px; width:44px; } }

.cfc-brand-text  { display:flex; flex-direction:column; min-width:0; }
.cfc-brand-main  { font-family:'DM Sans',sans-serif; font-weight:700;
                   font-size:clamp(.72rem,3vw,1.06rem); color:#fff;
                   white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.18; }
.cfc-brand-sub   { font-family:'DM Sans',sans-serif; font-weight:600;
                   font-size:clamp(.52rem,1.4vw,.66rem); color:var(--light);
                   white-space:nowrap; letter-spacing:.07em; text-transform:uppercase;
                   line-height:1; margin-top:2px; }

.cfc-visit-btn {
  display:inline-block; flex-shrink:0;
  background:linear-gradient(135deg,var(--blue),var(--purple));
  color:white!important; padding:.32rem .78rem; border-radius:50px;
  font-family:'DM Sans',sans-serif; font-size:clamp(.66rem,1.8vw,.84rem);
  font-weight:700; text-decoration:none; white-space:nowrap;
  transition:opacity .2s,transform .2s;
}
.cfc-visit-btn:hover { opacity:.88; transform:translateY(-1px); }

/* Row 2 */
.cfc-nav-row {
  display:flex; align-items:center;
  overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none;
  padding:0 .4rem; border-top:1px solid rgba(255,255,255,.07);
  -webkit-mask-image:linear-gradient(to right,transparent,black 6%,black 94%,transparent);
  mask-image:linear-gradient(to right,transparent,black 6%,black 94%,transparent);
}
.cfc-nav-row::-webkit-scrollbar { display:none; }
@media(min-width:768px){
  .cfc-nav-row { padding:0 3rem; overflow:visible;
                 -webkit-mask-image:none; mask-image:none; }
}
.cfc-nav-link {
  display:inline-flex; flex-direction:column; align-items:center;
  color:rgba(255,255,255,.68); text-decoration:none;
  font-family:'DM Sans',sans-serif; font-size:clamp(.68rem,1.8vw,.84rem);
  font-weight:600; padding:.4rem .55rem; border-radius:7px;
  white-space:nowrap; flex-shrink:0; transition:color .2s,background .2s;
}
.cfc-nav-link:hover { color:var(--light); background:rgba(255,255,255,.09); }
.cfc-nav-link.active { color:#fff!important; background:rgba(255,255,255,.12); }
.cfc-nav-link.active::after {
  content:''; display:block; width:14px; height:2px;
  background:var(--blue); border-radius:2px; margin-top:2px;
}
@media(min-width:768px){ .cfc-nav-link { font-size:.84rem; padding:.5rem .88rem; } }

/* ================================================================
   BUTTONS
   ================================================================ */
.btn-primary, .btn-secondary, .btn-white {
  display:inline-block; padding:.65rem 1.3rem; border-radius:50px;
  font-family:'DM Sans',sans-serif; font-weight:700;
  font-size:clamp(.82rem,2vw,.93rem); text-decoration:none;
  cursor:pointer; border:none; text-align:center; white-space:nowrap;
  transition:transform .2s,box-shadow .2s,opacity .2s;
}
.btn-primary  { background:linear-gradient(135deg,var(--blue),var(--purple));
                color:#fff!important; box-shadow:0 5px 18px rgba(19,127,235,.28); }
.btn-primary:hover  { transform:translateY(-2px); box-shadow:0 10px 26px rgba(19,127,235,.4); }
.btn-secondary{ background:rgba(255,255,255,.12); border:1.5px solid rgba(255,255,255,.32);
                color:#fff!important; }
.btn-secondary:hover { background:rgba(255,255,255,.22); }
.btn-white    { background:white; color:var(--navy)!important; }
.btn-white:hover { transform:translateY(-2px); box-shadow:0 6px 18px rgba(0,0,0,.14); }

/* ================================================================
   HERO (home)
   ================================================================ */
.hero {
  min-height:100svh;
  background:linear-gradient(155deg,var(--navy) 0%,var(--dark) 45%,var(--plum) 100%);
  display:flex; align-items:center; justify-content:center;
  text-align:center; padding:5rem 1rem 4rem;
  position:relative; overflow:hidden;
}
.hero-orb { position:absolute; border-radius:50%; filter:blur(70px); opacity:.18;
            animation:cfcFloat 9s ease-in-out infinite; pointer-events:none; }
.orb1 { width:clamp(150px,35vw,400px); height:clamp(150px,35vw,400px);
        background:var(--blue); top:-80px; left:-80px; }
.orb2 { width:clamp(120px,28vw,300px); height:clamp(120px,28vw,300px);
        background:var(--purple); bottom:-60px; right:-60px; animation-delay:-4.5s; }
@keyframes cfcFloat {
  0%,100% { transform:translateY(0) scale(1); }
  50%     { transform:translateY(-20px) scale(1.04); }
}
.hero-content { position:relative; z-index:2; width:100%; max-width:820px; margin:0 auto; }

/* Hero logo — responsive, not fixed px */
.hero-logo {
  height:clamp(72px,14vw,118px); width:clamp(72px,14vw,118px);
  object-fit:contain; background:rgba(255,255,255,.95); border-radius:50%;
  padding:7px; box-shadow:0 8px 40px rgba(0,0,0,.35); margin:0 auto;
}

.hero-badge {
  display:inline-flex; align-items:center;
  background:rgba(201,230,242,.1); border:1px solid rgba(201,230,242,.22);
  color:var(--light); padding:.24rem .7rem; border-radius:50px;
  font-size:clamp(.57rem,1.7vw,.68rem); font-weight:700; letter-spacing:.09em;
  margin:.8rem 0 .62rem; animation:fadeUp .8s .1s ease both;
}
.hero h1 {
  font-size:clamp(1.5rem,5.5vw,4rem); color:white; line-height:1.1;
  margin-bottom:.75rem; animation:fadeUp .8s .2s ease both;
}
.hero h1 em { font-style:normal; color:var(--light); }
@media(max-width:380px){ .hero h1 br { display:none; } }

.hero-motto {
  font-style:italic; font-weight:600; font-size:clamp(.78rem,1.9vw,.98rem);
  color:rgba(201,230,242,.85); margin-bottom:.38rem; animation:fadeUp .8s .3s ease both;
}
.hero-motto cite { display:block; font-size:.66rem; font-style:normal;
                   color:rgba(255,255,255,.33); margin-top:.16rem; }
.hero p {
  font-size:clamp(.82rem,1.9vw,.97rem); color:rgba(255,255,255,.72);
  line-height:1.85; max-width:520px; margin:0 auto 1.3rem;
  animation:fadeUp .8s .36s ease both;
}
.hero-btns { display:flex; gap:.6rem; justify-content:center; flex-wrap:wrap;
             animation:fadeUp .8s .44s ease both; }
@media(max-width:360px){ .hero-btns { flex-direction:column; align-items:center; }
  .hero-btns a { width:100%; max-width:240px; } }
@keyframes fadeUp { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }

.scroll-hint {
  position:absolute; bottom:1.3rem; left:50%; transform:translateX(-50%);
  z-index:2; display:flex; flex-direction:column; align-items:center; gap:.26rem;
  cursor:pointer; text-decoration:none; transition:opacity .4s;
}
.scroll-hint span { font-size:.5rem; letter-spacing:.2em; color:rgba(255,255,255,.3); text-transform:uppercase; }
.scroll-arrow {
  width:30px; height:30px; border:2px solid rgba(255,255,255,.2); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  animation:scrollBounce 1.8s ease-in-out infinite;
}
.scroll-arrow::after {
  content:''; width:7px; height:7px;
  border-right:2px solid rgba(255,255,255,.55); border-bottom:2px solid rgba(255,255,255,.55);
  transform:rotate(45deg) translate(-2px,-2px);
}
@keyframes scrollBounce { 0%,100%{transform:translateY(0);opacity:.5;} 50%{transform:translateY(7px);opacity:1;} }

/* ================================================================
   PAGE HERO (inner pages)
   ================================================================ */
.page-hero {
  background:linear-gradient(150deg,var(--navy) 0%,var(--dark) 55%,var(--plum) 100%);
  padding:2rem 1rem; text-align:center; position:relative; overflow:hidden;
}
.page-hero::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at 50% 110%,rgba(19,127,235,.16),transparent 65%);
  pointer-events:none;
}
.page-hero-content { position:relative; z-index:2; max-width:680px; margin:0 auto; }
.page-badge {
  display:inline-block; background:rgba(201,230,242,.1); border:1px solid rgba(201,230,242,.2);
  color:var(--light); padding:.22rem .7rem; border-radius:50px;
  font-size:clamp(.57rem,1.7vw,.65rem); font-weight:700; letter-spacing:.1em; margin-bottom:.58rem;
}
.page-hero h1 { font-size:clamp(1.45rem,5vw,2.9rem); color:white; line-height:1.12; margin-bottom:.52rem; }
.page-hero h1 em { font-style:normal; color:var(--light); }
.page-hero p  { font-size:clamp(.82rem,1.9vw,.97rem); color:rgba(255,255,255,.72); line-height:1.85; }
@media(min-width:576px){ .page-hero { padding:2.5rem 1.5rem; } }
@media(min-width:768px){ .page-hero { padding:3.2rem 2rem; } }

/* ================================================================
   SCRIPTURE BANNER
   ================================================================ */
.scripture-banner {
  background:linear-gradient(135deg,var(--navy),var(--plum));
  border-radius:13px; padding:1.15rem 1rem; text-align:center; color:white;
}
@media(min-width:576px){ .scripture-banner { border-radius:16px; padding:1.65rem 1.4rem; } }
.scripture-banner blockquote { font-style:italic; font-weight:600;
  font-size:clamp(.84rem,2.1vw,1.18rem); line-height:1.75; color:var(--light); margin-bottom:.45rem; }
.scripture-banner cite { font-size:.74rem; color:rgba(255,255,255,.4); }

/* ================================================================
   SHARED GRID HELPERS
   ================================================================ */
.cfc-2col-grid {
  display:grid; grid-template-columns:1fr; gap:1.4rem; align-items:start;
}
@media(min-width:768px){ .cfc-2col-grid { grid-template-columns:1fr 1fr; gap:2.8rem; } }
@media(min-width:1024px){ .cfc-2col-grid { gap:3.8rem; } }

.cfc-3col-grid {
  display:grid; grid-template-columns:1fr; gap:.92rem;
}
@media(min-width:576px){ .cfc-3col-grid { grid-template-columns:repeat(2,1fr); gap:1.05rem; } }
@media(min-width:900px){ .cfc-3col-grid { grid-template-columns:repeat(3,1fr); gap:1.25rem; } }

/* ================================================================
   HOME — Service cards
   ================================================================ */
.services-grid { display:grid; grid-template-columns:1fr; gap:.85rem; }
@media(min-width:480px){ .services-grid { grid-template-columns:repeat(2,1fr); } }
@media(min-width:900px){ .services-grid { grid-template-columns:repeat(3,1fr); } }

.service-card {
  border-radius:13px; padding:1.1rem; border:1.5px solid var(--border);
  background:white; transition:transform .2s,box-shadow .2s;
}
.service-card:hover { transform:translateY(-3px); box-shadow:0 10px 28px rgba(19,127,235,.1); }
.service-card.featured {
  background:linear-gradient(135deg,var(--navy),var(--plum)); border-color:transparent; color:white;
}
.service-tag  { display:inline-block; font-size:.6rem; font-weight:700; letter-spacing:.1em;
                text-transform:uppercase; background:var(--light); color:var(--navy);
                padding:.14rem .5rem; border-radius:50px; margin-bottom:.6rem; }
.service-card.featured .service-tag { background:rgba(255,255,255,.18); color:white; }
.service-day  { font-size:.66rem; color:var(--blue); font-weight:700; letter-spacing:.07em; }
.service-card.featured .service-day { color:var(--light); }
.service-name { font-weight:700; font-size:1rem; color:var(--navy); margin:.12rem 0; }
.service-card.featured .service-name { color:white; }
.service-time { font-size:1.18rem; font-weight:700; color:var(--purple); }
.service-card.featured .service-time { color:var(--light); }
.service-desc { font-size:.79rem; color:var(--muted); line-height:1.58; margin-top:.26rem; }
.service-card.featured .service-desc { color:rgba(255,255,255,.72); }

/* Home events list */
.events-list { display:flex; flex-direction:column; gap:.65rem; }
.event-item  { background:var(--offwhite); border-radius:11px; padding:.75rem .85rem;
               display:flex; align-items:center; gap:.7rem; transition:box-shadow .2s; }
.event-item:hover { box-shadow:0 4px 16px rgba(19,127,235,.1); }
.event-date-box { background:linear-gradient(135deg,var(--blue),var(--purple));
                  border-radius:9px; padding:.4rem .5rem; text-align:center; color:white;
                  flex-shrink:0; min-width:42px; }
.event-date-box .month { font-size:.5rem; text-transform:uppercase; letter-spacing:.1em; opacity:.85; }
.event-date-box .day   { font-weight:700; font-size:1.3rem; line-height:1; }
.event-info    { flex:1; min-width:0; }
.event-info h4 { font-weight:700; font-size:.86rem; color:var(--navy); }
@media(min-width:480px){ .event-info h4 { font-size:.9rem; } }
.event-info p  { font-size:.76rem; color:var(--muted); line-height:1.42; }
.event-time    { font-size:.73rem; color:var(--purple); font-weight:700; white-space:nowrap;
                 flex-shrink:0; display:none; }
@media(min-width:480px){ .event-time { display:block; } }

/* ================================================================
   FILTER BAR
   ================================================================ */
.filter-bar { display:flex; flex-wrap:wrap; gap:.3rem; margin-bottom:1.1rem; }
.filter-btn {
  padding:.27rem .65rem; border-radius:50px; border:1.5px solid var(--border);
  background:white; color:var(--text); font-family:'DM Sans',sans-serif;
  font-size:.73rem; font-weight:600; cursor:pointer; transition:all .2s;
}
.filter-btn:hover, .filter-btn.active { background:var(--blue); color:white; border-color:var(--blue); }

/* ================================================================
   SERMONS
   ================================================================ */
.sermons-grid { display:grid; grid-template-columns:1fr; gap:.95rem; }
@media(min-width:576px){ .sermons-grid { grid-template-columns:repeat(2,1fr); } }
@media(min-width:900px){ .sermons-grid { grid-template-columns:repeat(3,1fr); } }

.sermon-card { border-radius:13px; overflow:hidden; background:white;
               box-shadow:0 3px 12px rgba(0,0,0,.07); transition:transform .2s,box-shadow .2s; }
.sermon-card:hover { transform:translateY(-4px); box-shadow:0 14px 30px rgba(19,127,235,.12); }
.sermon-thumb { height:110px; display:flex; align-items:center; justify-content:center; font-size:2rem; }
.t1{background:linear-gradient(135deg,var(--navy),var(--blue))}
.t2{background:linear-gradient(135deg,var(--purple),#8a2be2)}
.t3{background:linear-gradient(135deg,var(--blue),var(--purple))}
.t4{background:linear-gradient(135deg,var(--dark),var(--blue))}
.t5{background:linear-gradient(135deg,var(--purple),var(--light))}
.t6{background:linear-gradient(135deg,var(--navy),var(--purple))}
.sermon-body   { padding:.85rem .95rem 1rem; }
.sermon-series { font-size:.6rem; color:var(--blue); font-weight:700;
                 letter-spacing:.1em; text-transform:uppercase; margin-bottom:.24rem; }
.sermon-title  { font-weight:700; font-size:.9rem; color:var(--navy);
                 margin-bottom:.24rem; line-height:1.3; }
.sermon-meta   { font-size:.69rem; color:#999; margin-bottom:.7rem; }
.sermon-actions{ display:flex; gap:.45rem; flex-wrap:wrap; }
.s-btn  { font-size:.7rem; font-weight:700; padding:.28rem .72rem; border-radius:50px;
          text-decoration:none; transition:all .2s; font-family:'DM Sans',sans-serif; }
.s-watch  { background:var(--blue); color:white; }
.s-watch:hover  { background:#0d65c8; }
.s-listen { background:var(--offwhite); color:var(--purple); border:1px solid var(--border); }
.s-listen:hover { background:var(--light); }

/* Featured sermon/event — stacks on mobile, 2-col on tablet+ */
.feat-sermon, .feat-event {
  background:linear-gradient(135deg,var(--navy),var(--plum));
  border-radius:15px; padding:1.3rem 1rem; color:white;
  display:grid; grid-template-columns:1fr;
  gap:1.1rem; align-items:center; margin-bottom:1.5rem;
}
@media(min-width:768px){
  .feat-sermon { grid-template-columns:1fr 1fr; padding:2.3rem; gap:1.8rem; border-radius:19px; }
  .feat-event  { grid-template-columns:1fr auto; padding:2.3rem; gap:1.6rem; border-radius:19px; }
}
.feat-sermon h3, .feat-event h3 { font-weight:700; font-size:clamp(1.1rem,3vw,1.75rem); margin-bottom:.58rem; }
.feat-label, .feat-badge { display:inline-block; background:var(--light); color:var(--navy);
  font-size:.62rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  padding:.17rem .6rem; border-radius:50px; margin-bottom:.68rem; }
.feat-meta { display:flex; gap:.85rem; flex-wrap:wrap; margin-bottom:.9rem; }
.feat-meta span { font-size:.77rem; color:rgba(255,255,255,.6); }
.feat-sermon p, .feat-event p { color:rgba(255,255,255,.72); line-height:1.85;
  margin-bottom:.95rem; font-size:clamp(.81rem,1.8vw,.94rem); }
.watch-btn, .feat-btn { background:white; color:var(--navy); padding:.6rem 1.3rem;
  border-radius:50px; font-weight:700; font-size:.83rem; text-decoration:none;
  transition:transform .2s; display:inline-block; }
.watch-btn:hover, .feat-btn:hover { transform:translateY(-2px); }
/* Hide date/thumb block on phones, show on tablet+ */
.feat-thumb, .feat-date { display:none; }
@media(min-width:768px){ .feat-thumb { display:flex; } .feat-date { display:block; } }
.feat-thumb { background:rgba(255,255,255,.1); border-radius:12px; height:180px;
              align-items:center; justify-content:center; font-size:3.6rem;
              border:1px solid rgba(255,255,255,.12); }
.feat-date  { background:rgba(255,255,255,.12); border-radius:13px; padding:1.3rem 1rem;
              text-align:center; min-width:105px; border:1px solid rgba(255,255,255,.14); }
.feat-date .mo { font-size:.7rem; text-transform:uppercase; letter-spacing:.1em; opacity:.72; margin-bottom:.18rem; }
.feat-date .dy { font-weight:700; font-size:2.9rem; line-height:1; color:var(--light); }
.feat-date .yr { font-size:.66rem; opacity:.46; margin-top:.18rem; }

/* Sermon series */
.series-grid { display:grid; grid-template-columns:1fr; gap:.92rem; margin-top:1.4rem; }
@media(min-width:576px){ .series-grid { grid-template-columns:repeat(2,1fr); } }
@media(min-width:900px){ .series-grid { grid-template-columns:repeat(3,1fr); } }
.series-card { border-radius:14px; overflow:hidden; box-shadow:0 3px 11px rgba(0,0,0,.07);
               transition:transform .2s; }
.series-card:hover { transform:translateY(-4px); }
.s-img  { height:110px; display:flex; align-items:center; justify-content:center; font-size:2.2rem; }
.s-info { background:white; padding:.92rem 1rem; }
.s-info h4 { font-weight:700; font-size:.9rem; margin-bottom:.2rem; color:var(--navy); }
.s-info p  { font-size:.73rem; color:var(--muted); }
.pod-box { background:linear-gradient(135deg,var(--navy),var(--plum)); color:white;
           text-align:center; border-radius:15px; padding:1.6rem 1rem; margin-top:1.6rem; }
@media(min-width:576px){ .pod-box { padding:2.2rem 1.6rem; border-radius:18px; } }
.pod-box h3 { font-weight:700; font-size:clamp(1.1rem,3vw,1.55rem); margin-bottom:.62rem; }
.pod-box p  { color:rgba(255,255,255,.72); max-width:425px; margin:0 auto 1.3rem;
              line-height:1.85; font-size:clamp(.79rem,1.8vw,.93rem); }
.pod-btns   { display:flex; gap:.58rem; justify-content:center; flex-wrap:wrap; }
.pod-btn    { background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.22);
              color:white; padding:.48rem 1rem; border-radius:50px; font-weight:700;
              font-size:.78rem; text-decoration:none; transition:background .2s; }
.pod-btn:hover { background:rgba(255,255,255,.24); }

/* ================================================================
   EVENTS PAGE
   ================================================================ */
.event-card {
  background:var(--offwhite); border-radius:12px; padding:.8rem .86rem;
  display:grid; grid-template-columns:48px 1fr;
  gap:.75rem; align-items:center;
  border:1.5px solid transparent; margin-bottom:.75rem; transition:box-shadow .2s;
}
@media(min-width:576px){
  .event-card { grid-template-columns:72px 1fr auto; padding:1.2rem 1.3rem; gap:1.1rem; border-radius:14px; }
}
.event-card:hover { box-shadow:0 5px 18px rgba(19,127,235,.1); border-color:var(--border); }
.ev-date { background:linear-gradient(135deg,var(--blue),var(--purple));
           border-radius:10px; padding:.5rem .4rem; text-align:center; color:white; }
@media(min-width:576px){ .ev-date { border-radius:12px; padding:.6rem .52rem; } }
.ev-date .mo { font-size:.52rem; text-transform:uppercase; letter-spacing:.1em; opacity:.85; }
.ev-date .dy { font-weight:700; font-size:1.45rem; line-height:1; }
@media(min-width:576px){ .ev-date .dy { font-size:1.8rem; } }
.ev-tag { display:inline-block; font-size:.59rem; font-weight:700;
          letter-spacing:.07em; text-transform:uppercase; padding:.14rem .5rem; border-radius:50px; margin-bottom:.3rem; }
.tag-worship  { background:#dce8ff; color:var(--blue); }
.tag-prayer   { background:#ead5f5; color:var(--purple); }
.tag-outreach { background:#d5f0e8; color:#1a7a50; }
.tag-special  { background:#fff0d5; color:#8a5a00; }
.event-card h4 { font-weight:700; font-size:.86rem; color:var(--navy); margin-bottom:.17rem; }
.event-card p  { font-size:.77rem; color:var(--muted); line-height:1.48; margin-bottom:.28rem; }
.ev-tl  { display:flex; gap:.82rem; flex-wrap:wrap; }
.ev-tl span { font-size:.71rem; color:#999; }
.rsvp-btn { background:var(--blue); color:white; padding:.44rem .98rem;
            border-radius:50px; font-size:.74rem; font-weight:700;
            text-decoration:none; white-space:nowrap; display:none; transition:background .2s; }
@media(min-width:576px){ .rsvp-btn { display:block; } }
.rsvp-btn:hover { background:#0d65c8; }

.month-grid { display:grid; grid-template-columns:1fr; gap:.9rem; margin-top:1.4rem; }
@media(min-width:576px){ .month-grid { grid-template-columns:repeat(2,1fr); } }
@media(min-width:900px){ .month-grid { grid-template-columns:repeat(3,1fr); } }
.month-card { background:white; border-radius:12px; padding:1.1rem; box-shadow:0 3px 10px rgba(0,0,0,.06); }
.month-card h4 { font-weight:700; font-size:.93rem; margin-bottom:.7rem; color:var(--navy); }
.me      { display:flex; gap:.6rem; align-items:flex-start; padding:.4rem 0; border-bottom:1px solid #f0f0f8; }
.me:last-child { border-bottom:none; }
.me-dot  { width:6px; height:6px; border-radius:50%; background:var(--blue); margin-top:7px; flex-shrink:0; }
.me span { font-size:.77rem; color:#555; line-height:1.4; }
.me strong { display:block; font-size:.69rem; color:var(--purple); }

/* ================================================================
   GIVE PAGE
   ================================================================ */
.give-grid { display:grid; grid-template-columns:1fr; gap:1.8rem; }
@media(min-width:900px){ .give-grid { grid-template-columns:1fr 1.1fr; gap:var(--gap-lg); } }

.verse-box { background:linear-gradient(135deg,var(--navy),var(--plum));
             border-radius:13px; padding:1.2rem 1rem; color:white; margin-top:1.35rem; }
@media(min-width:576px){ .verse-box { border-radius:15px; padding:1.6rem 1.35rem; } }
.verse-box blockquote { font-style:italic; font-weight:600;
  font-size:clamp(.84rem,1.9vw,1rem); line-height:1.75; margin-bottom:.58rem; color:var(--light); }
.verse-box cite { font-size:.74rem; color:rgba(255,255,255,.46); }

.give-form { background:white; border-radius:15px; padding:1.15rem; box-shadow:0 8px 30px rgba(0,0,0,.08); }
@media(min-width:480px){ .give-form { padding:1.65rem; border-radius:17px; } }
@media(min-width:768px){ .give-form { padding:2.15rem; } }
.give-form h3 { font-weight:700; font-size:clamp(1rem,2.4vw,1.28rem); margin-bottom:.95rem; color:var(--navy); }

.freq-tabs { display:flex; gap:.27rem; background:var(--offwhite); border-radius:10px; padding:.18rem; margin-bottom:.92rem; }
.freq-tab  { flex:1; padding:.38rem .16rem; border:none; border-radius:8px; background:transparent;
             font-family:'DM Sans',sans-serif; font-size:.77rem; font-weight:700;
             cursor:pointer; color:#999; transition:all .2s; }
.freq-tab.active { background:white; color:var(--navy); box-shadow:0 2px 8px rgba(0,0,0,.08); }

.amt-label { font-size:.77rem; font-weight:700; color:var(--navy); margin-bottom:.55rem; display:block; }
.amt-grid  { display:grid; grid-template-columns:repeat(2,1fr); gap:.5rem; margin-bottom:.85rem; }
@media(min-width:480px){ .amt-grid { grid-template-columns:repeat(4,1fr); } }
.amount-btn { padding:.56rem .36rem; border-radius:9px; border:1.5px solid var(--border);
              background:white; color:var(--text); font-size:.8rem; font-weight:700;
              cursor:pointer; font-family:'DM Sans',sans-serif; transition:all .2s; text-align:center; width:100%; }
.amount-btn:hover { border-color:var(--blue); color:var(--blue); }
.amount-btn.active { background:var(--blue); color:white; border-color:var(--blue); }
.give-submit { width:100%; background:linear-gradient(135deg,var(--blue),var(--purple));
               color:white; border:none; padding:.82rem; border-radius:10px;
               font-size:.9rem; font-weight:700; cursor:pointer;
               font-family:'DM Sans',sans-serif; transition:opacity .2s,transform .2s; margin-top:.36rem; }
.give-submit:hover { opacity:.92; transform:translateY(-1px); }

.impact-grid { display:grid; grid-template-columns:1fr; gap:.92rem; margin-top:1.4rem; }
@media(min-width:576px){ .impact-grid { grid-template-columns:repeat(2,1fr); } }
@media(min-width:900px){ .impact-grid { grid-template-columns:repeat(3,1fr); } }
.impact-card { border-radius:14px; padding:1.3rem 1rem; text-align:center; }
.ic1 { background:linear-gradient(135deg,var(--offwhite),var(--light)); }
.ic2 { background:linear-gradient(135deg,#ead5f5,#f3e8ff); }
.ic3 { background:linear-gradient(135deg,var(--light),#dce8ff); }
.impact-icon { font-size:1.85rem; margin-bottom:.68rem; }
.impact-card h4 { font-weight:700; font-size:.95rem; margin-bottom:.33rem; color:var(--navy); }
.impact-card p  { font-size:.81rem; color:var(--muted); line-height:1.65; }

.ways-grid { display:grid; grid-template-columns:1fr; gap:.92rem; margin-top:1.4rem; }
@media(min-width:576px){ .ways-grid { grid-template-columns:repeat(2,1fr); } }
@media(min-width:900px){ .ways-grid { grid-template-columns:repeat(3,1fr); } }
.way-card  { background:white; border-radius:14px; padding:1.3rem 1.12rem; box-shadow:0 3px 9px rgba(0,0,0,.06); }
.way-icon  { width:41px; height:41px; border-radius:10px;
             background:linear-gradient(135deg,var(--blue),var(--purple));
             display:flex; align-items:center; justify-content:center;
             font-size:1.05rem; margin-bottom:.72rem; }
.way-card h4 { font-weight:700; margin-bottom:.33rem; color:var(--navy); font-size:.88rem; }
.way-card p  { font-size:.8rem; color:var(--muted); line-height:1.65; }

/* ================================================================
   CONTACT PAGE
   ================================================================ */
.contact-grid { display:grid; grid-template-columns:1fr; gap:1.8rem; }
@media(min-width:900px){ .contact-grid { grid-template-columns:1fr 1.2fr; gap:3.2rem; } }

.info-card { background:var(--offwhite); border-radius:11px; padding:.88rem;
             display:flex; align-items:flex-start; gap:.7rem; margin-bottom:.65rem; }
.info-icon { width:37px; height:37px; min-width:37px; border-radius:9px; flex-shrink:0;
             background:linear-gradient(135deg,var(--blue),var(--purple));
             display:flex; align-items:center; justify-content:center; font-size:.92rem; }
.info-card h4 { font-weight:700; margin-bottom:.13rem; font-size:.84rem; color:var(--navy); }
.info-card p, .info-card a { font-size:.79rem; color:var(--muted); line-height:1.6; text-decoration:none; }
.info-card a { color:var(--blue); }
.info-card a:hover { text-decoration:underline; }

.st-box { background:linear-gradient(135deg,var(--navy),var(--plum));
          border-radius:12px; padding:1.2rem; color:white; margin-top:1.15rem; }
.st-box h4  { font-weight:700; font-size:.92rem; margin-bottom:.76rem; }
.st-row     { display:flex; justify-content:space-between; align-items:center;
              padding:.42rem 0; border-bottom:1px solid rgba(255,255,255,.1); font-size:.8rem; }
.st-row:last-child { border-bottom:none; }
.st-row .dy { color:rgba(255,255,255,.58); }
.st-row .sn { color:rgba(255,255,255,.8); }
.st-row .tm { color:var(--light); font-weight:700; }

.cf-form { background:white; border-radius:15px; padding:1.15rem; box-shadow:0 8px 30px rgba(0,0,0,.08); }
@media(min-width:480px){ .cf-form { padding:1.65rem; border-radius:17px; } }
@media(min-width:768px){ .cf-form { padding:2.15rem; border-radius:19px; } }
.cf-form h3  { font-weight:700; font-size:clamp(1rem,2.4vw,1.35rem); margin-bottom:.28rem; color:var(--navy); }
.cf-form .sub{ font-size:.79rem; color:var(--muted); margin-bottom:1.2rem; line-height:1.6; }

.map-placeholder { background:linear-gradient(135deg,var(--offwhite),var(--light));
  border-radius:13px; height:225px; display:flex; align-items:center;
  justify-content:center; flex-direction:column; gap:.6rem; margin-top:1.35rem;
  border:2px dashed rgba(19,127,235,.22); text-align:center; padding:1.35rem; }
@media(min-width:576px){ .map-placeholder { height:285px; } }
.map-placeholder p     { color:var(--blue); font-weight:700; font-size:.86rem; }
.map-placeholder small { color:#999; font-size:.74rem; }

.visit-banner { background:linear-gradient(135deg,var(--navy),var(--plum)); color:white;
                text-align:center; border-radius:15px; padding:1.6rem 1rem; max-width:820px; margin:0 auto; }
@media(min-width:576px){ .visit-banner { padding:2.3rem 1.6rem; border-radius:18px; } }
.visit-banner h3 { font-weight:700; font-size:clamp(1.2rem,3vw,1.78rem); margin-bottom:.6rem; }
.visit-banner h3 em { font-style:normal; color:var(--light); }
.visit-banner p  { color:rgba(255,255,255,.72); max-width:410px; margin:0 auto 1.3rem;
                   line-height:1.85; font-size:clamp(.79rem,1.8vw,.93rem); }
.vsteps   { display:flex; gap:.9rem; justify-content:center; flex-wrap:wrap; margin-bottom:1.3rem; }
.vstep    { display:flex; align-items:center; gap:.46rem; font-size:.8rem; color:rgba(255,255,255,.82); }
.vstep-num{ width:23px; height:23px; border-radius:50%; background:var(--light);
            color:var(--navy); font-weight:700; font-size:.71rem;
            display:flex; align-items:center; justify-content:center; flex-shrink:0; }
@media(max-width:479px){ .vsteps { flex-direction:column; align-items:flex-start; padding-left:.4rem; } }

/* ================================================================
   SALVATION PAGE
   ================================================================ */
.sal-grid { display:grid; grid-template-columns:1fr; gap:1.8rem; }
@media(min-width:900px){ .sal-grid { grid-template-columns:1fr 1fr; gap:3.2rem; } }

.scripture-card { background:var(--offwhite); border-radius:11px; padding:1rem;
                  margin-bottom:.9rem; border-left:4px solid var(--blue); }
.scripture-card .ref { font-size:.66rem; color:var(--blue); font-weight:700;
                       letter-spacing:.1em; text-transform:uppercase; margin-bottom:.26rem; }
.scripture-card p { color:var(--muted); line-height:1.85; font-size:.83rem; font-style:italic; margin-bottom:0; }

.prayer-box { background:linear-gradient(135deg,var(--navy),var(--plum));
              border-radius:15px; padding:1.4rem 1rem; color:white; text-align:center; }
@media(min-width:576px){ .prayer-box { padding:2rem 1.6rem; border-radius:17px; } }
.prayer-box h3  { font-weight:700; font-size:clamp(1.05rem,3vw,1.52rem); margin-bottom:1rem; color:var(--light); }
.prayer-text    { color:rgba(255,255,255,.88); line-height:2; font-size:clamp(.8rem,1.9vw,.95rem);
                  font-style:italic; margin-bottom:.7rem; }
.amen           { font-weight:700; color:var(--light); font-style:normal; font-size:.98rem;
                  display:block; margin-top:.46rem; }
.step-card      { background:white; border-radius:13px; padding:.9rem; box-shadow:0 3px 11px rgba(0,0,0,.07);
                  margin-bottom:.9rem; display:flex; gap:.8rem; align-items:flex-start; }
@media(min-width:480px){ .step-card { padding:1.3rem 1.4rem; } }
.step-num       { width:33px; height:33px; min-width:33px; border-radius:50%;
                  background:linear-gradient(135deg,var(--blue),var(--purple));
                  color:white; font-weight:700; font-size:.83rem;
                  display:flex; align-items:center; justify-content:center; }
.step-card h4   { font-weight:700; margin-bottom:.28rem; color:var(--navy); font-size:.86rem; }
.step-card p    { font-size:.81rem; color:var(--muted); line-height:1.75; margin-bottom:0; }

/* Next steps cards */
.next-step-card { background:white; border-radius:14px; padding:1.2rem 1rem;
                  box-shadow:0 3px 11px rgba(0,0,0,.06); }
.next-step-card .ns-icon { font-size:1.85rem; margin-bottom:.68rem; }
.next-step-card h4 { font-weight:700; margin-bottom:.4rem; color:var(--navy); font-size:.88rem; }
.next-step-card p  { font-size:.81rem; color:var(--muted); line-height:1.65; margin:0; }

/* ================================================================
   ABOUT PAGE
   ================================================================ */
/* Leaders preview */
.lp-grid { display:grid; grid-template-columns:1fr; gap:.72rem; margin-bottom:1.4rem; }
@media(min-width:480px){ .lp-grid { grid-template-columns:repeat(3,1fr); gap:.88rem; } }
.lp-card { background:white; border-radius:14px; padding:1rem .75rem; text-align:center;
           box-shadow:0 3px 10px rgba(0,0,0,.05); transition:transform .2s; }
.lp-card:hover { transform:translateY(-4px); }
.lp-avatar { width:48px; height:48px; border-radius:50%; display:flex; align-items:center;
             justify-content:center; font-size:1.3rem; margin:0 auto .58rem; }
.lp-name   { font-weight:700; font-size:.8rem; color:var(--navy); margin-bottom:.14rem; line-height:1.3; }
.lp-role   { font-size:.66rem; color:var(--muted); line-height:1.3; }
.lp-badge  { display:inline-block; background:linear-gradient(135deg,var(--blue),var(--purple));
             color:white; font-size:.57rem; font-weight:700; padding:.11rem .46rem;
             border-radius:50px; letter-spacing:.06em; margin-bottom:.3rem; }

/* About 2-col */
.about-grid { display:grid; grid-template-columns:1fr; gap:1.5rem; align-items:start; }
@media(min-width:800px){ .about-grid { grid-template-columns:1fr 1fr; gap:2.5rem; } }
@media(min-width:1024px){ .about-grid { gap:3.5rem; } }

/* Stats 2x2 inside navy card */
.stats-2col { display:grid; grid-template-columns:repeat(2,1fr); gap:.58rem; margin-top:1rem; }

/* Vision/Mission */
.vm-grid { display:grid; grid-template-columns:1fr; gap:1rem; margin-top:1.4rem; }
@media(min-width:600px){ .vm-grid { grid-template-columns:repeat(2,1fr); } }
.vm-card { border-radius:15px; padding:1.35rem; color:white; }
@media(min-width:576px){ .vm-card { padding:1.9rem; border-radius:19px; } }
.vm-card h3 { font-weight:700; font-size:1.02rem; margin-bottom:.6rem; color:var(--light); }
.vm-card p  { color:rgba(255,255,255,.78); line-height:1.85; font-size:.86rem; margin:0; }

/* Core values */
.values-grid { display:grid; grid-template-columns:1fr; gap:.78rem; margin-top:1.35rem; }
@media(min-width:480px){ .values-grid { grid-template-columns:repeat(2,1fr); } }
.value-card { background:white; border-radius:13px; padding:1.05rem;
              border-left:4px solid var(--blue); box-shadow:0 2px 9px rgba(0,0,0,.06); }
.value-card .vi { font-size:1.3rem; margin-bottom:.36rem; }
.value-card h4  { font-weight:700; margin-bottom:.26rem; font-size:.86rem; color:var(--navy); }
.value-card p   { font-size:.8rem; color:var(--muted); line-height:1.6; margin:0; }

/* Timeline */
.tl-wrap { position:relative; padding-left:1.9rem; margin-top:1.9rem; }
.tl-wrap::before { content:''; position:absolute; left:7px; top:6px; bottom:6px;
                   width:3px; background:linear-gradient(to bottom,var(--blue),var(--purple)); border-radius:3px; }
.tl-item { position:relative; padding-bottom:1.9rem; }
.tl-item:last-child { padding-bottom:0; }
.tl-dot  { position:absolute; left:-1.9rem; top:4px; width:15px; height:15px; border-radius:50%;
           background:linear-gradient(135deg,var(--blue),var(--purple));
           border:3px solid white; box-shadow:0 0 0 2px var(--blue); }
.tl-year { font-size:.68rem; font-weight:700; color:var(--blue); letter-spacing:.12em;
           text-transform:uppercase; margin-bottom:.26rem; }
.tl-item h4 { font-weight:700; font-size:clamp(.92rem,2.1vw,1.06rem); margin-bottom:.35rem; color:var(--navy); }
.tl-item p  { font-size:.83rem; color:var(--muted); line-height:1.75; margin:0; }

/* Quotes */
.q-card { background:var(--offwhite); border-radius:12px; padding:.95rem .95rem .95rem 1.15rem;
          border-left:4px solid var(--purple); margin-bottom:.82rem; }
.q-card p    { font-style:italic; color:var(--navy); line-height:1.85; font-size:.84rem; margin-bottom:.36rem; }
.q-card cite { font-size:.7rem; color:var(--muted); font-style:normal; }

/* Impact items */
.impact-item { background:white; border-radius:12px; padding:.95rem;
               display:flex; gap:.8rem; align-items:flex-start;
               box-shadow:0 2px 9px rgba(0,0,0,.06); margin-bottom:.82rem; }
.imp-icon    { width:40px; height:40px; min-width:40px; border-radius:9px; flex-shrink:0;
               background:linear-gradient(135deg,var(--blue),var(--purple));
               display:flex; align-items:center; justify-content:center; font-size:.98rem; }
.impact-item h4 { font-weight:700; margin-bottom:.2rem; color:var(--navy); font-size:.86rem; }
.impact-item p  { font-size:.8rem; color:var(--muted); line-height:1.65; margin:0; }

/* ================================================================
   LEADERS PAGE
   ================================================================ */
.leaders-intro { max-width:680px; margin:0 auto; text-align:center; }
.leaders-grid  { display:grid; grid-template-columns:1fr; gap:1rem; margin-top:1.8rem; }
@media(min-width:576px){ .leaders-grid { grid-template-columns:repeat(2,1fr); } }
@media(min-width:900px){ .leaders-grid { grid-template-columns:repeat(3,1fr); } }

.leader-card { background:white; border-radius:16px; overflow:hidden;
               box-shadow:0 4px 16px rgba(0,0,0,.07); border:1.5px solid var(--border);
               transition:transform .2s,box-shadow .2s; display:flex; flex-direction:column; }
.leader-card:hover { transform:translateY(-4px); box-shadow:0 14px 34px rgba(19,127,235,.12); }
.leader-card.founder { border-color:rgba(19,127,235,.25); }
.leader-avatar { height:110px; display:flex; align-items:center; justify-content:center;
                 font-size:2.85rem; background:linear-gradient(135deg,var(--navy),var(--plum)); position:relative; }
.leader-avatar::after { content:''; position:absolute; bottom:0; left:0; right:0;
                        height:26px; background:white; clip-path:ellipse(55% 100% at 50% 100%); }
.leader-card.founder .leader-avatar { background:linear-gradient(135deg,var(--blue),var(--purple)); }
.leader-body  { padding:.8rem 1rem 1.06rem; flex:1; display:flex; flex-direction:column; }
.leader-name  { font-weight:700; font-size:.95rem; color:var(--navy); margin-bottom:.12rem; }
.leader-role  { font-size:.64rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
                color:var(--blue); margin-bottom:.7rem; }
.leader-bio   { font-size:.8rem; color:var(--muted); line-height:1.72; margin-bottom:.8rem; flex:1; }
.leader-quote { font-style:italic; font-size:.76rem; color:var(--navy);
                border-left:3px solid var(--purple); padding-left:.7rem;
                line-height:1.6; margin-bottom:.8rem; }
.leader-tags  { display:flex; flex-wrap:wrap; gap:.3rem; }
.leader-tag   { font-size:.6rem; font-weight:700; padding:.15rem .48rem; border-radius:50px;
                background:var(--offwhite); color:var(--navy); border:1px solid var(--border); }

.breadcrumb-bar { background:var(--offwhite); border-bottom:1px solid var(--border);
                  padding:.5rem 1rem; font-size:.73rem; color:var(--muted); }
.breadcrumb-bar a { color:var(--blue); text-decoration:none; }
.breadcrumb-bar a:hover { text-decoration:underline; }
@media(min-width:768px){ .breadcrumb-bar { padding:.5rem 5%; } }

.vision-box { background:linear-gradient(135deg,var(--navy),var(--plum));
              border-radius:15px; padding:1.6rem 1.2rem; color:white; text-align:center; margin-top:1.85rem; }
@media(min-width:576px){ .vision-box { padding:2.2rem 1.85rem; border-radius:17px; } }
.vision-box h3 { font-weight:700; font-size:clamp(1.1rem,3vw,1.72rem); color:var(--light); margin-bottom:.62rem; }
.vision-box p  { color:rgba(255,255,255,.74); max-width:480px; margin:0 auto 1.25rem;
                 line-height:1.85; font-size:clamp(.79rem,1.8vw,.9rem); }

/* ================================================================
   FORMS (shared across contact, give)
   ================================================================ */
.form-group { margin-bottom:.85rem; }
.form-group label { display:block; font-size:.75rem; font-weight:700; color:var(--navy); margin-bottom:.26rem; }
.form-group input, .form-group select, .form-group textarea {
  width:100%; padding:.62rem .8rem; border:1.5px solid var(--border);
  border-radius:9px; font-family:'DM Sans',sans-serif; font-size:.85rem;
  color:var(--text); background:white; outline:none;
  transition:border-color .2s,box-shadow .2s;
  -webkit-appearance:none; appearance:none;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  border-color:var(--blue); box-shadow:0 0 0 3px rgba(19,127,235,.11);
}
.form-group textarea { min-height:90px; resize:vertical; }
.form-row { display:grid; grid-template-columns:1fr; gap:.82rem; }
@media(min-width:480px){ .form-row { grid-template-columns:1fr 1fr; } }
.submit-btn { width:100%; background:linear-gradient(135deg,var(--blue),var(--purple));
              color:white; border:none; padding:.8rem; border-radius:10px;
              font-size:.9rem; font-weight:700; cursor:pointer;
              font-family:'DM Sans',sans-serif; transition:opacity .2s,transform .2s; }
.submit-btn:hover { opacity:.92; transform:translateY(-1px); }
.success-msg { display:none; background:#e8f5e9; border:1px solid #a5d6a7; color:#2e7d32;
               border-radius:9px; padding:.8rem; text-align:center; margin-top:.8rem;
               font-weight:700; font-size:.82rem; }

/* ================================================================
   FOOTER
   ================================================================ */
.cfc-footer { background:var(--navy); color:rgba(255,255,255,.5); }
.cfc-footer .container { max-width:1200px; margin:0 auto;
                         padding:2.1rem 1rem 0; }
@media(min-width:576px){ .cfc-footer .container { padding:2.8rem 1.5rem 0; } }
@media(min-width:992px){ .cfc-footer .container { padding:3.8rem 5% 0; } }

.cfc-footer-logo  { height:42px; width:42px; object-fit:contain; background:white;
                    border-radius:8px; padding:2px; flex-shrink:0; }
.cfc-footer-title { font-family:'DM Sans',sans-serif; font-weight:700;
                    color:white; font-size:.9rem; line-height:1.3; }
.cfc-footer-sub   { font-size:.57rem; letter-spacing:.1em; text-transform:uppercase;
                    color:rgba(255,255,255,.28); }
.cfc-footer-text  { font-size:.77rem; line-height:1.75; }
.cfc-footer-motto { font-style:italic; font-weight:600; color:var(--light);
                    font-size:.75rem; line-height:1.65; margin-top:.6rem; }
.cfc-footer-ref   { font-style:normal; font-size:.66rem; color:rgba(255,255,255,.28); }
.cfc-footer-heading { font-size:.65rem; font-weight:700; letter-spacing:.14em;
                      text-transform:uppercase; color:white; margin-bottom:.7rem; }
.cfc-footer-links   { list-style:none; padding:0; margin:0; }
.cfc-footer-links li { margin-bottom:.34rem; font-size:.77rem; }
.cfc-footer-links a  { color:rgba(255,255,255,.46); text-decoration:none; transition:color .2s; }
.cfc-footer-links a:hover { color:var(--light); }
.cfc-footer-divider   { border-color:rgba(255,255,255,.1); margin:0; }
.cfc-footer-copy      { font-size:.68rem; padding:.8rem 0; text-align:center; }
.cfc-social-btn { width:28px; height:28px; border-radius:6px; background:rgba(255,255,255,.1);
                  color:white; display:inline-flex; align-items:center; justify-content:center;
                  font-size:.82rem; text-decoration:none; transition:background .2s; }
.cfc-social-btn:hover  { background:rgba(255,255,255,.2); color:white; }
.cfc-service-pill { background:rgba(255,255,255,.08); border-radius:9px; padding:.56rem;
                    font-size:.74rem; color:rgba(255,255,255,.7); line-height:1.8; }
.cfc-service-pill strong { color:var(--light); }
.text-cfc-light { color:var(--light)!important; }

/* ================================================================
   VERY SMALL SCREENS ≤ 360px
   ================================================================ */
@media(max-width:360px){
  body { font-size:14px; }
  .cfc-brand-main { font-size:.68rem; }
  .hero h1, .page-hero h1 { font-size:1.38rem; }
  .section-title { font-size:1.26rem; }
  .btn-primary,.btn-secondary,.btn-white { padding:.56rem 1.05rem; font-size:.79rem; }
  .give-form, .cf-form { padding:.9rem; }
  .lp-grid { grid-template-columns:repeat(2,1fr); }
}
