/*
Theme Name: John G Kimani Premium
Theme URI: https://johngkimani.com
Author: OpenAI
Description: A modern premium WordPress theme for John G. Kimani - The Realty Pastor.
Version: 4.0
License: GPLv2 or later
Text Domain: jgk-premium
*/

:root{
  --maroon:#7A1F32;
  --maroon-dark:#4B1020;
  --black:#111111;
  --charcoal:#1F1F1F;
  --gold:#C8A44D;
  --cream:#FAF7F0;
  --white:#FFFFFF;
  --muted:#6B6B6B;
  --gray:#EFEDE8;
  --green:#2E5E4E;
  --shadow:0 24px 70px rgba(17,17,17,.14);
  --radius:24px;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;color:var(--charcoal);background:var(--cream);line-height:1.65}
a{color:inherit;text-decoration:none} img{max-width:100%;height:auto}.container{width:min(var(--max),calc(100% - 40px));margin-inline:auto}.eyebrow{letter-spacing:.16em;text-transform:uppercase;font-weight:800;font-size:.76rem;color:var(--gold)}
.site-header{position:sticky;top:0;z-index:50;background:rgba(250,247,240,.88);backdrop-filter:blur(16px);border-bottom:1px solid rgba(31,31,31,.08)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 0}.brand{display:flex;align-items:center;gap:14px}.mark{width:48px;height:48px;border-radius:16px;background:linear-gradient(135deg,var(--maroon),var(--black));color:var(--gold);display:grid;place-items:center;font-family:Georgia,serif;font-weight:800;letter-spacing:.04em;box-shadow:0 14px 35px rgba(122,31,50,.25)}.brand-title{font-weight:900;font-size:1.05rem;line-height:1.05}.brand-sub{font-size:.74rem;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}.nav{display:flex;align-items:center;gap:22px;font-weight:700;font-size:.94rem}.nav a{opacity:.86}.nav a:hover{color:var(--maroon);opacity:1}.nav-cta{background:var(--maroon);color:white!important;padding:10px 16px;border-radius:999px;box-shadow:0 10px 24px rgba(122,31,50,.25)}
.hero{position:relative;overflow:hidden;background:radial-gradient(circle at 15% 15%, rgba(200,164,77,.22), transparent 28%),linear-gradient(135deg,var(--black) 0%,var(--maroon-dark) 55%,#19050A 100%);color:white}.hero:after{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to bottom,black,transparent)}.hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:1.06fr .94fr;gap:54px;align-items:center;min-height:730px;padding:76px 0}.hero h1{font-family:Georgia,serif;font-size:clamp(3.1rem,7vw,6.5rem);line-height:.9;margin:12px 0 22px;letter-spacing:-.06em}.hero-lead{font-size:1.28rem;max-width:650px;color:rgba(255,255,255,.85);margin:0 0 34px}.hero-actions{display:flex;flex-wrap:wrap;gap:14px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 20px;border-radius:999px;font-weight:900;border:1px solid transparent;transition:.2s ease}.btn-primary{background:var(--gold);color:#17120A}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 35px rgba(200,164,77,.28)}.btn-secondary{border-color:rgba(255,255,255,.22);color:white;background:rgba(255,255,255,.08)}.hero-card{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);border-radius:34px;padding:28px;box-shadow:var(--shadow);backdrop-filter:blur(16px)}.portrait-placeholder{height:430px;border-radius:28px;background:linear-gradient(155deg,rgba(250,247,240,.94),rgba(200,164,77,.45)),url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="800" height="900"><rect width="100%" height="100%" fill="%23f6efe0"/><circle cx="400" cy="265" r="105" fill="%237A1F32" opacity=".22"/><rect x="190" y="405" width="420" height="330" rx="170" fill="%23111111" opacity=".20"/><text x="400" y="820" text-anchor="middle" font-size="38" font-family="Georgia" fill="%237A1F32">Add Your Photo Here</text></svg>') center/cover;display:flex;align-items:flex-end;overflow:hidden}.photo-caption{width:100%;padding:22px;background:linear-gradient(transparent,rgba(0,0,0,.78));font-weight:800}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}.stat{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:16px}.stat strong{display:block;font-size:1.6rem;color:var(--gold);line-height:1}.stat span{font-size:.8rem;color:rgba(255,255,255,.72)}
.section{padding:92px 0}.section-title{font-family:Georgia,serif;font-size:clamp(2.2rem,4vw,4rem);line-height:1;margin:10px 0 18px;letter-spacing:-.045em}.section-lead{font-size:1.12rem;color:var(--muted);max-width:760px;margin:0}.intro-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:46px;align-items:start}.signature-card{background:white;border-radius:var(--radius);padding:32px;box-shadow:var(--shadow);border:1px solid rgba(31,31,31,.06)}.signature{font-family:Georgia,serif;font-size:2rem;color:var(--maroon);margin:20px 0 0}.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:38px}.pillar{background:white;border-radius:26px;padding:28px;box-shadow:0 18px 45px rgba(17,17,17,.07);border:1px solid rgba(31,31,31,.06);min-height:260px;transition:.2s}.pillar:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.icon{width:54px;height:54px;border-radius:18px;background:rgba(122,31,50,.10);display:grid;place-items:center;font-size:1.55rem;margin-bottom:18px}.pillar h3{font-family:Georgia,serif;font-size:1.55rem;margin:0 0 10px}.pillar p{color:var(--muted);margin:0 0 20px}.learn{font-weight:900;color:var(--maroon)}
.split-dark{background:var(--charcoal);color:white}.split-grid{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:center}.service-list{display:grid;gap:14px}.service-item{display:flex;gap:16px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);padding:18px;border-radius:18px}.service-item b{color:var(--gold)}.feature-panel{background:linear-gradient(135deg,var(--maroon),#260812);border-radius:34px;padding:34px;box-shadow:var(--shadow)}.feature-panel h3{font-family:Georgia,serif;font-size:2.4rem;line-height:1;margin:0 0 16px}.feature-panel p{color:rgba(255,255,255,.8)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:34px}.card{background:white;border-radius:26px;padding:28px;border:1px solid rgba(31,31,31,.06);box-shadow:0 18px 45px rgba(17,17,17,.07)}.card h3{font-family:Georgia,serif;font-size:1.6rem;line-height:1.1;margin:0 0 12px}.card p{color:var(--muted);margin:0}.quote{background:white;border-radius:34px;padding:42px;box-shadow:var(--shadow);border-left:7px solid var(--gold)}.quote p{font-family:Georgia,serif;font-size:2rem;line-height:1.25;margin:0 0 18px;color:var(--black)}.cta{background:linear-gradient(135deg,var(--maroon),var(--black));color:white;border-radius:38px;padding:54px;display:flex;align-items:center;justify-content:space-between;gap:30px;box-shadow:var(--shadow)}.cta h2{font-family:Georgia,serif;font-size:clamp(2.2rem,4vw,4rem);line-height:1;margin:0}.cta p{color:rgba(255,255,255,.78);max-width:560px}
.site-footer{background:#0F0F0F;color:white;padding:52px 0}.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:28px}.footer-grid h4{color:var(--gold);margin:0 0 12px}.footer-grid p,.footer-grid a{color:rgba(255,255,255,.72)}.copyright{border-top:1px solid rgba(255,255,255,.1);margin-top:34px;padding-top:22px;color:rgba(255,255,255,.55);font-size:.9rem}
.page-hero{background:linear-gradient(135deg,var(--charcoal),var(--maroon));color:white;padding:84px 0}.page-hero h1{font-family:Georgia,serif;font-size:clamp(2.7rem,6vw,5.2rem);line-height:.95;margin:12px 0}.content-wrap{background:white;border-radius:28px;padding:40px;margin-top:-40px;position:relative;z-index:3;box-shadow:var(--shadow)}
@media(max-width:900px){.nav{display:none}.hero-inner,.intro-grid,.split-grid{grid-template-columns:1fr}.hero-inner{min-height:auto;padding:60px 0}.pillars,.cards{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr}.cta{display:block}.portrait-placeholder{height:360px}}
@media(max-width:620px){.container{width:min(100% - 26px,var(--max))}.hero h1{font-size:3.5rem}.hero-lead{font-size:1.05rem}.pillars,.cards,.stats{grid-template-columns:1fr}.section{padding:66px 0}.cta{padding:34px}.quote p{font-size:1.45rem}.header-inner{padding:12px 0}.brand-title{font-size:.95rem}.mark{width:42px;height:42px}}


/* Version 3 compact landing portal */
body.home{overflow-x:hidden;}
.home .site-header{position:fixed;left:0;right:0;top:0;background:rgba(15,15,15,.52);border-bottom:1px solid rgba(255,255,255,.10);color:white;}
.home .brand-sub,.home .nav a{color:rgba(255,255,255,.76)}
.home .nav-cta{background:var(--gold);color:#17120A!important;}
.landing-main{min-height:100vh;background:radial-gradient(circle at 16% 20%,rgba(200,164,77,.30),transparent 28%),linear-gradient(135deg,#080708 0%,#4B1020 50%,#160308 100%);color:white;overflow:hidden;}
.landing-portal{min-height:calc(100vh - 0px);display:flex;align-items:center;padding:96px 0 26px;position:relative;}
.landing-portal:before{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(to bottom,black 45%,transparent 100%);}
.portal-inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) 250px;grid-template-areas:"copy profile" "pillars pillars";gap:26px;align-items:center;}
.portal-copy{grid-area:copy;}
.portal-copy h1{font-family:Georgia,serif;font-size:clamp(3.3rem,8.2vw,7.5rem);line-height:.88;margin:10px 0 18px;letter-spacing:-.07em;max-width:920px;}
.portal-lead{font-size:clamp(1.05rem,2vw,1.35rem);color:rgba(255,255,255,.82);margin:0 0 24px;max-width:760px;}
.portal-actions{display:flex;gap:12px;flex-wrap:wrap;}
.btn-ghost{border-color:rgba(255,255,255,.23);color:white;background:rgba(255,255,255,.08)}
.mini-profile{grid-area:profile;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);border-radius:26px;padding:18px;box-shadow:0 24px 70px rgba(0,0,0,.20);backdrop-filter:blur(16px);}
.mini-photo{height:190px;border-radius:20px;background:linear-gradient(180deg,rgba(0,0,0,.00),rgba(0,0,0,.18)),url('assets/images/john-g-kimani-portrait.jpg') center 28%/cover no-repeat;display:grid;place-items:end center;overflow:hidden;border:2px solid rgba(200,164,77,.85);box-shadow:0 16px 38px rgba(0,0,0,.28);}
.mini-photo span{display:none;}
.mini-profile strong{display:block;margin-top:14px;font-family:Georgia,serif;font-size:1.35rem;line-height:1.05;}
.mini-profile small{display:block;color:var(--gold);font-weight:800;margin-top:3px;}
.pillar-grid{grid-area:pillars;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:10px;}
.portal-pillar{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);border-radius:22px;padding:20px 18px;min-height:136px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 16px 45px rgba(0,0,0,.16);transition:.2s ease;}
.portal-pillar:hover{transform:translateY(-4px);background:rgba(255,255,255,.16);border-color:rgba(200,164,77,.50)}
.pillar-icon{font-size:1.7rem;line-height:1;}
.portal-pillar strong{font-family:Georgia,serif;font-size:1.36rem;line-height:1.05;margin-top:12px;}
.portal-pillar small{color:rgba(255,255,255,.70);font-weight:700;margin-top:7px;}
.home .site-footer{display:none;}
@media(max-height:760px) and (min-width:901px){.landing-portal{padding-top:82px}.portal-copy h1{font-size:clamp(3rem,7vw,6.2rem)}.mini-photo{height:150px}.portal-pillar{min-height:112px;padding:15px}.portal-pillar strong{font-size:1.18rem}.portal-lead{margin-bottom:18px}}
@media(max-width:900px){.home .site-header{position:sticky;background:var(--charcoal)}.landing-main{overflow:auto}.landing-portal{min-height:auto;padding:42px 0}.portal-inner{grid-template-columns:1fr;grid-template-areas:"copy" "profile" "pillars"}.mini-profile{display:flex;align-items:center;gap:14px}.mini-photo{height:86px;width:86px;flex:0 0 86px}.mini-photo span{font-size:.68rem;padding:7px}.pillar-grid{grid-template-columns:1fr 1fr}.portal-copy h1{font-size:4rem}}
@media(max-width:620px){.portal-copy h1{font-size:3.25rem}.pillar-grid{grid-template-columns:1fr}.portal-pillar{min-height:104px}.landing-portal{padding:30px 0}.portal-actions .btn{width:100%}}
