/* Thriving Ministries — static rebuild (no tracking, self-hosted fonts) */
@font-face{font-family:"Playfair Display";src:url(fonts/PlayfairDisplay-latin_latin-ext-regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Playfair Display";src:url(fonts/PlayfairDisplay-latin_latin-ext-700.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Playfair Display";src:url(fonts/PlayfairDisplay-latin_latin-ext-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Source Sans Pro";src:url(fonts/SourceSansPro-latin_latin-ext-regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Source Sans Pro";src:url(fonts/SourceSansPro-latin_latin-ext-700.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Source Sans Pro";src:url(fonts/SourceSansPro-latin_latin-ext-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Source Sans Pro";src:url(fonts/SourceSansPro-latin_latin-ext-700italic.woff2) format("woff2");font-weight:700;font-style:italic;font-display:swap}

:root{
  --light:#dce5e5;      /* palette light */
  --dark:#454545;       /* palette dark */
  --black:#000;
  --accent1:#114927;
  --accent2:#295f3f;    /* Send button */
  --accent3:#4f8466;
  --nav-active:#67da96;
  --muted-on-dark:#d6d6d6;
  --slant:clamp(40px,7.5vw,100px);
  --serif:"Playfair Display",Georgia,"Times New Roman",serif;
  --sans:"Source Sans Pro","Source Sans 3","Segoe UI",Arial,Helvetica,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--light);color:var(--dark);font-family:var(--sans);font-size:16px;line-height:1.35}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2{font-family:var(--serif);line-height:1.45;margin:0 0 .6em}
h1{font-size:clamp(30px,4vw,37px)}
h2{font-size:clamp(28px,3.6vw,36px)}
.bold{font-weight:700}
.regular{font-weight:400}
p{margin:0 0 1em}
ul{margin:0 0 1em;padding-left:30px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;background:#fff;color:#000;padding:8px 12px;z-index:10}

/* ---------- layout ---------- */
.container{width:100%;max-width:800px;margin:0 auto;padding:0 20px}
.container.wide{max-width:960px}
.narrow{max-width:400px}
section{position:relative}

/* ---------- header ---------- */
.site-header{background:var(--dark);color:#fff}
.site-header .bar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:16px 28px}
.logo img{width:197px;height:auto}
.nav{display:flex;gap:4px;margin:0;padding:0;list-style:none}
.nav a{display:block;padding:8px 10px;text-decoration:none;color:#fff;font-size:16px;border-bottom:2px solid transparent}
.nav a:hover{color:var(--nav-active)}
.nav a[aria-current="page"]{color:var(--nav-active);border-bottom-color:var(--nav-active)}

/* ---------- slanted bands ---------- */
/* wrapper paints the colours above/below the slant; inner band is clipped */
.band-wrap{background:linear-gradient(to bottom,var(--top,var(--dark)) 50%,var(--bottom,var(--light)) 50%)}
.band{clip-path:polygon(0 var(--slant),100% 0,100% calc(100% - var(--slant)),0 100%);padding:calc(var(--slant) + 40px) 0 calc(var(--slant) + 50px)}
.band-dark{background:var(--dark);color:#fff}
.band-dark p{color:var(--muted-on-dark)}
.photo-band{background-color:var(--dark);background-size:cover;background-position:center;color:#fff}
.photo-band p{color:#f0f0f0}
.hero-home{background-image:linear-gradient(rgba(69,69,69,.7),rgba(69,69,69,.7)),url(hero-jesus.jpg);min-height:520px;display:flex;align-items:center}
.hero-about{background-image:linear-gradient(rgba(69,69,69,.7),rgba(69,69,69,.7)),url(about-church.jpg)}
.hero-home h1{font-weight:700;color:#fff}
.hero-home p{max-width:400px}

/* contact page: dark slant under header */
.header-slant{height:var(--slant);background:var(--dark);clip-path:polygon(0 0,100% 0,100% 0,0 100%)}

/* ---------- buttons ---------- */
.btn{display:inline-block;padding:7px 8px;border-radius:6px;text-decoration:none;font-size:16px;line-height:1.2;border:1px solid transparent}
.btn-light{background:#fff;color:#454545}
.btn-dark{background:#000;color:#fff}
.btn:hover{filter:brightness(.92)}
.btn-row{margin-top:4px}
.btn-center{text-align:center;max-width:400px}

/* ---------- content sections ---------- */
.section-light{padding:60px 0 70px}
.facts ul{font-size:16px}
.cite{padding-left:44px;margin:18px 0 26px}
.cite p{margin:0}
.thrive-graphic{max-width:72%;margin:50px 0 46px}
.service + .service{margin-top:56px}
.service p{max-width:400px}
.service .btn-center{margin-top:6px}

.split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.network{padding:60px 0 60px}
.network .img-col img{width:100%;max-width:448px;margin-left:auto}
.network p{max-width:360px}

/* about */
.about-grid{display:grid;grid-template-columns:minmax(0,310px) 140px;gap:20px;align-items:start}
.about-grid img{width:140px;height:140px;object-fit:cover}
.mission{padding:30px 0 120px}
.mission .container{max-width:800px}

/* ---------- contact / forms ---------- */
.contact-black{background:#000;color:#fff;padding:90px 0 120px}
.contact-black .split{align-items:start}
.contact-black .logo-big{width:307px;max-width:100%;margin-top:6px}
.form label{display:block;font-size:15px;margin:0 0 6px}
.form .field{margin-bottom:22px}
.form input[type=text],.form input[type=email],.form textarea{width:100%;font:inherit;color:inherit;background:transparent;border:2px solid currentColor;border-radius:6px;padding:10px 12px;opacity:.95}
.form input{height:46px}
.form textarea{height:226px;resize:vertical}
.form input:focus,.form textarea:focus{outline:2px solid var(--nav-active);outline-offset:1px}
.form .note{font-size:15px;margin:-4px 0 14px}
.form .err{display:none;color:#e57373;font-size:14px;margin-top:4px}
.form .field.invalid .err{display:block}
.form .field.invalid input,.form .field.invalid textarea{border-color:#e57373}
.form button{width:100%;height:40px;border:0;border-radius:3px;background:var(--accent2);color:#fff;font:inherit;cursor:pointer}
.form button:hover{background:var(--accent1)}
.form button[disabled]{opacity:.7;cursor:wait}
.form .status{margin-top:14px;font-size:15px;min-height:1em}
.form .status.ok{color:var(--nav-active)}
.form .status.bad{color:#e57373}
.contact-light .form .status.ok{color:var(--accent2)}
.contact-light .form .status.bad,.contact-light .form .err{color:#b3261e}
.contact-light .form .field.invalid input,.contact-light .form .field.invalid textarea{border-color:#b3261e}
.hp{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}

.contact-light{padding:44px 0 90px}
.contact-head{display:flex;align-items:center;gap:60px;flex-wrap:wrap;margin-bottom:30px}
.contact-head h1{margin:0}
.contact-head img{width:240px}
.contact-light hr{border:0;border-top:2px solid var(--dark);margin:60px 0 30px}
.contact-light .graphic{max-width:903px}
.form-pad{padding:0 6px}

/* ---------- footer ---------- */
.site-footer{background:var(--dark);color:#e6e6e6;text-align:center;padding:36px 20px 40px;font-size:14px}
.site-footer p{margin:0}

/* ---------- responsive ---------- */
@media (max-width:767px){
  .site-header .bar{padding:12px 16px}
  .logo img{width:160px}
  .split{grid-template-columns:1fr}
  .network .img-col img{margin:0 auto}
  .thrive-graphic{max-width:100%}
  .hero-home{min-height:440px}
  .about-grid{grid-template-columns:1fr}
  .contact-head{gap:20px}
  .contact-black{padding:60px 0 70px}
  .cite{padding-left:24px}
}
.band-wrap.light-both{--top:var(--light);--bottom:var(--light)}
.band-wrap.to-black{--bottom:#000}
.section-light h1,.section-light h2,.network h2,.mission h2,.contact-light h1{color:#000}
@media (max-width:767px){h1 br,h2 br{display:none}}
