/*
Theme Name: Jason Flynn
Theme URI: https://jasontheflynn.com
Author: Jason Flynn (built in Cowork)
Description: Personal-brand theme for jasontheflynn.com. AI + real estate. Navy/orange brand system, Montserrat + Inter + Playfair, dark default with light toggle. Home, Bio, Testimonials, Contact, Newsletter, and the Notebook blog.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: jasontheflynn
*/

:root {
  --orange-500:#F28C28; --orange-600:#D9761A; --orange-100:#FDEBD6;
  --navy-900:#0F1A2E; --navy-800:#162238; --navy-700:#1E2D48; --navy-600:#2A3B5A; --navy-500:#3E5175; --navy-400:#6B7B9A;
  --font-display:"Montserrat",ui-sans-serif,system-ui,sans-serif;
  --font-body:"Inter",ui-sans-serif,system-ui,sans-serif;
  --font-serif:"Playfair Display",Georgia,serif;
  --maxw:1120px;
  --r-md:4px; --r-lg:8px; --r-xl:12px; --r-2xl:16px; --r-pill:999px;
}
/* DARK (default) */
[data-theme="dark"]{
  --bg:var(--navy-800); --bg-hero:var(--navy-900); --card:var(--navy-700);
  --border:var(--navy-600); --fg:#FFFFFF; --fg-body:#C7D1E1; --fg-muted:#6B7B9A;
  --nav-bg:rgba(15,26,46,.82); --btn-ghost-border:var(--navy-600);
  --shadow:0 20px 48px rgba(0,0,0,.45);
}
/* LIGHT */
[data-theme="light"]{
  --bg:#F9FAFB; --bg-hero:#FFFFFF; --card:#FFFFFF;
  --border:#E6E7E8; --fg:#0F1A2E; --fg-body:#33414F; --fg-muted:#6D6E71;
  --nav-bg:rgba(255,255,255,.86); --btn-ghost-border:#C7C9CC;
  --shadow:0 12px 32px rgba(15,26,46,.10);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg); color:var(--fg-body);
  font-family:var(--font-body); line-height:1.65; -webkit-font-smoothing:antialiased;
  transition:background .3s ease,color .3s ease;
}
img{max-width:100%;height:auto}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px}
.eyebrow{font-family:var(--font-display);font-weight:700;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--orange-500);display:inline-block}
.rule{width:40px;height:3px;background:var(--orange-500);border:0;margin:16px 0 20px}
h1,h2,h3,h4{font-family:var(--font-display);color:var(--fg);letter-spacing:-.02em;line-height:1.1}
a{color:inherit;text-decoration:none}

/* NAV */
.site-nav{position:sticky;top:0;z-index:50;backdrop-filter:blur(10px);background:var(--nav-bg);border-bottom:1px solid var(--border)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:66px}
.wordmark{font-family:var(--font-display);font-weight:800;font-size:19px;letter-spacing:-.02em;color:var(--fg)}
.wordmark .at{color:var(--orange-500)}
.nav-links{display:flex;align-items:center;gap:28px}
.nav-links a.link{font-family:var(--font-display);font-weight:600;font-size:14px;color:var(--fg-body);transition:color .15s}
.nav-links a.link:hover{color:var(--orange-500)}
.btn{font-family:var(--font-display);font-weight:700;font-size:12.5px;letter-spacing:.03em;padding:11px 18px;border-radius:var(--r-md);cursor:pointer;border:0;display:inline-block;transition:all .15s ease}
.btn-primary{background:var(--orange-500);color:var(--navy-900)}
.btn-primary:hover{background:var(--orange-600)}
.btn-ghost{background:transparent;border:1.5px solid var(--btn-ghost-border);color:var(--fg)}
.btn-ghost:hover{border-color:var(--orange-500);color:var(--orange-500)}
.toggle{width:38px;height:38px;border-radius:var(--r-md);border:1px solid var(--border);background:transparent;color:var(--fg);cursor:pointer;font-size:15px;display:grid;place-items:center}
.toggle:hover{border-color:var(--orange-500)}

/* HERO */
.hero{background:var(--bg-hero);border-bottom:1px solid var(--border);position:relative;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.35fr .9fr;gap:56px;align-items:center;padding:84px 0 88px}
.hero h1{font-weight:800;font-size:clamp(38px,5.2vw,60px);margin-bottom:22px}
.br-mobile{display:none}
@media(max-width:600px){.br-mobile{display:inline}}
.hero .lede{font-size:18px;max-width:34ch;color:var(--fg-body);margin-bottom:30px}
.signup{display:flex;gap:10px;max-width:440px}
.signup input{flex:1;padding:14px 16px;border-radius:var(--r-md);border:1px solid var(--border);background:var(--card);color:var(--fg);font-family:var(--font-body);font-size:15px}
.signup input::placeholder{color:var(--fg-muted)}
.signup input:focus{outline:2px solid var(--orange-500);outline-offset:1px}
.signup .btn-primary{white-space:nowrap;padding:14px 20px}
.signup-note{font-size:12.5px;color:var(--fg-muted);margin-top:12px}
.signup-note b{color:var(--fg-body);font-weight:600}
.headshot{position:relative;aspect-ratio:4/5;border-radius:var(--r-2xl);overflow:hidden;background:linear-gradient(155deg,var(--navy-700),var(--navy-900));border:1px solid var(--border);display:grid;place-items:center;box-shadow:var(--shadow)}
[data-theme="light"] .headshot{background:linear-gradient(155deg,#EDF0F5,#DDE3EC)}
.headshot .hs-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2}
.headshot .ph{text-align:center;color:var(--fg-muted);font-size:13px;padding:0 24px;line-height:1.5}
.headshot .ph svg{width:52px;height:52px;opacity:.5;margin-bottom:10px}
.headshot .badge{position:absolute;left:16px;bottom:16px;z-index:3;background:var(--orange-500);color:var(--navy-900);font-family:var(--font-display);font-weight:700;font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:6px 12px;border-radius:var(--r-pill)}

/* SECTION SHELL */
.blk{padding:76px 0;border-bottom:1px solid var(--border)}
.sec-head{margin-bottom:38px;max-width:640px}
.sec-head h2{font-weight:800;font-size:clamp(26px,3.4vw,36px);margin-top:10px}
.sec-head p{margin-top:12px;color:var(--fg-body);font-size:16px}

/* VIDEOS / POST CARDS */
.videos{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.vcard{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:transform .2s ease,border-color .2s;display:block}
.vcard:hover{transform:translateY(-3px);border-color:var(--orange-500)}
.vthumb{aspect-ratio:16/9;background:linear-gradient(135deg,var(--navy-700),var(--navy-900));display:grid;place-items:center;position:relative;overflow:hidden}
[data-theme="light"] .vthumb{background:linear-gradient(135deg,#E6EAF1,#CFD7E4)}
.vthumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.play{width:52px;height:52px;border-radius:50%;background:var(--orange-500);display:grid;place-items:center;position:relative;z-index:2}
.play svg{width:20px;height:20px;fill:var(--navy-900);margin-left:3px}
.vbody{padding:16px 18px 20px}
.vbody .vlabel{font-family:var(--font-display);font-weight:700;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange-500)}
.vbody h3{font-size:16px;font-weight:700;margin:9px 0 6px;letter-spacing:-.01em;line-height:1.25;color:var(--fg)}
.vbody .vmeta{font-size:12px;color:var(--fg-muted)}

/* ABOUT + HUB */
.about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:start}
.about p{font-size:17px;color:var(--fg-body);margin-bottom:16px;max-width:52ch}
.about .serif{font-family:var(--font-serif);font-style:italic;font-size:21px;color:var(--fg);margin:6px 0 22px;line-height:1.4}
.about .accent-line{font-family:var(--font-serif);font-weight:700;font-size:21px;color:var(--orange-500);max-width:52ch;margin:6px 0 20px;line-height:1.45}
.hub{background:var(--card);border:1px solid var(--border);border-radius:var(--r-xl);padding:26px}
.hub h3{font-size:13px;font-family:var(--font-display);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-muted);margin-bottom:8px}
.hub-list{display:flex;flex-direction:column}
.hub-item{display:flex;align-items:center;gap:14px;padding:14px 4px;border-bottom:1px solid var(--border)}
.hub-item:last-child{border-bottom:0}
.hub-item:hover .hub-name{color:var(--orange-500)}
.hub-ico{width:34px;height:34px;border-radius:var(--r-md);background:var(--navy-900);display:grid;place-items:center;flex-shrink:0}
.hub-ico svg{width:18px;height:18px;fill:#fff}
.hub-name{font-family:var(--font-display);font-weight:600;font-size:15px;color:var(--fg);transition:color .15s}
.hub-sub{font-size:12px;color:var(--fg-muted);margin-left:auto}

/* TESTIMONIALS */
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.tcard{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);padding:24px}
.stars{color:var(--orange-500);font-size:14px;letter-spacing:2px;margin-bottom:12px}
.tcard p{font-size:14.5px;color:var(--fg-body);margin-bottom:16px}
.tperson{display:flex;align-items:center;gap:11px}
.tavatar{width:36px;height:36px;border-radius:50%;background:var(--navy-600);display:grid;place-items:center;font-family:var(--font-display);font-weight:700;font-size:13px;color:#fff}
.tperson .tn{font-family:var(--font-display);font-weight:700;font-size:13px;color:var(--fg)}
.tperson .tr{font-size:11.5px;color:var(--fg-muted)}
.t-foot{margin-top:30px;font-size:13.5px;color:var(--fg-muted)}
.t-foot a{color:var(--orange-500);font-weight:600}

/* FAQ */
.faq{max-width:760px}
.faq-item{border-bottom:1px solid var(--border)}
.faq-q{width:100%;text-align:left;background:transparent;border:0;cursor:pointer;padding:20px 0;font-family:var(--font-display);font-weight:600;font-size:17px;color:var(--fg);display:flex;justify-content:space-between;gap:20px;align-items:center}
.faq-q .pm{color:var(--orange-500);font-size:22px;flex-shrink:0;transition:transform .2s}
.faq-item.open .pm{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .28s ease}
.faq-a p{padding:0 0 22px;color:var(--fg-body);font-size:15.5px;max-width:64ch}
.faq-a a{color:var(--orange-500);font-weight:600}

/* CTA band */
.cta{background:var(--navy-900);border-bottom:1px solid var(--border)}
.cta .wrap{padding:66px 32px;text-align:center}
.cta .eyebrow{color:var(--orange-500)}
.cta h2{color:#fff;font-weight:800;font-size:clamp(26px,3.4vw,38px);margin:12px auto 14px;max-width:18ch}
.cta p{color:#C7D1E1;max-width:48ch;margin:0 auto 26px}
.cta .signup{margin:0 auto}
.cta .signup input{background:var(--navy-700);border-color:var(--navy-600);color:#fff}

/* PAGE (generic content) */
.page-hero{background:var(--bg-hero);border-bottom:1px solid var(--border);padding:64px 0 48px}
.page-hero h1{font-weight:800;font-size:clamp(32px,4.4vw,48px);margin-top:12px}
.page-hero p.sub{margin-top:14px;color:var(--fg-body);font-size:17px;max-width:60ch}
.content{padding:64px 0}
.prose{max-width:720px;font-size:16.5px;color:var(--fg-body)}
.prose h2{font-size:26px;margin:34px 0 12px;color:var(--fg)}
.prose h3{font-size:19px;margin:26px 0 8px;color:var(--fg)}
.prose p{margin-bottom:16px}
.prose ul,.prose ol{margin:0 0 16px 22px}
.prose li{margin-bottom:7px}
.prose a{color:var(--orange-500);font-weight:600}
.prose img{border-radius:var(--r-lg);margin:20px 0}
.prose blockquote{font-family:var(--font-serif);font-style:italic;font-size:20px;color:var(--fg);border-left:3px solid var(--orange-500);padding-left:20px;margin:22px 0}

/* BIO */
.bio-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:52px;align-items:start}
.bio-photo{position:relative;aspect-ratio:4/5;border-radius:var(--r-2xl);overflow:hidden;background:linear-gradient(155deg,var(--navy-700),var(--navy-900));border:1px solid var(--border);display:grid;place-items:center}
[data-theme="light"] .bio-photo{background:linear-gradient(155deg,#EDF0F5,#DDE3EC)}
.bio-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bio-photo .ph{color:var(--fg-muted);font-size:13px;text-align:center;padding:0 20px}
.dl-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.bio-block{margin-bottom:30px}
.bio-block .eyebrow{margin-bottom:8px}
.copyfield{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);padding:16px 18px;font-size:15px;color:var(--fg-body);margin-top:8px;position:relative}
.copyfield p{margin-bottom:10px}
.copyfield p:last-child{margin-bottom:0}
.topics{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.topic{background:var(--card);border:1px solid var(--border);border-radius:var(--r-pill);padding:7px 14px;font-size:13px;font-family:var(--font-display);font-weight:600;color:var(--fg)}

/* CONTACT FORM */
.form-wrap{max-width:620px}
.form-row{margin-bottom:16px;display:flex;flex-direction:column;gap:6px}
.form-row label{font-family:var(--font-display);font-weight:600;font-size:13px;color:var(--fg)}
.form-row input,.form-row select,.form-row textarea{padding:13px 15px;border-radius:var(--r-md);border:1px solid var(--border);background:var(--card);color:var(--fg);font-family:var(--font-body);font-size:15px;width:100%}
.form-row textarea{min-height:150px;resize:vertical}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{outline:2px solid var(--orange-500);outline-offset:1px}
.notice{padding:14px 18px;border-radius:var(--r-lg);margin-bottom:24px;font-size:15px}
.notice-ok{background:rgba(46,158,94,.14);border:1px solid #2E9E5E;color:var(--fg)}
.notice-err{background:rgba(200,16,46,.14);border:1px solid #C8102E;color:var(--fg)}

/* NOTEBOOK list */
.nb-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px}
.nb-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:transform .2s,border-color .2s}
.nb-card:hover{transform:translateY(-3px);border-color:var(--orange-500)}
.nb-thumb{aspect-ratio:16/9;background:linear-gradient(135deg,var(--navy-700),var(--navy-900));position:relative;overflow:hidden}
.nb-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.nb-body{padding:20px 22px 24px}
.nb-body .vlabel{font-family:var(--font-display);font-weight:700;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange-500)}
.nb-body h2{font-size:20px;margin:9px 0 8px;line-height:1.25}
.nb-body p{font-size:14.5px;color:var(--fg-body);margin-bottom:10px}
.nb-body .vmeta{font-size:12px;color:var(--fg-muted)}
.nb-empty{background:var(--card);border:1px dashed var(--border);border-radius:var(--r-lg);padding:40px;text-align:center;color:var(--fg-muted)}

/* SINGLE */
.single-hero{max-width:760px;margin:0 auto;padding:56px 0 24px}
.single-hero h1{font-size:clamp(30px,4vw,44px);font-weight:800;margin:12px 0 14px}
.single-hero .vmeta{font-size:13px;color:var(--fg-muted)}
.video-embed{max-width:900px;margin:0 auto 8px;aspect-ratio:16/9;border-radius:var(--r-xl);overflow:hidden;border:1px solid var(--border)}
.video-embed iframe{width:100%;height:100%;border:0}
.single-body{max-width:720px;margin:0 auto}
.sub-inline{max-width:720px;margin:48px auto 0;background:var(--card);border:1px solid var(--border);border-radius:var(--r-xl);padding:32px;text-align:center}
.sub-inline h3{font-size:22px;font-weight:800;margin-bottom:8px}
.sub-inline p{color:var(--fg-body);margin-bottom:20px}
.sub-inline .signup{margin:0 auto}

/* PAGINATION */
.pagination{display:flex;gap:10px;justify-content:center;margin-top:44px;flex-wrap:wrap}
.pagination .page-numbers{font-family:var(--font-display);font-weight:600;font-size:14px;padding:9px 14px;border:1px solid var(--border);border-radius:var(--r-md);color:var(--fg-body)}
.pagination .page-numbers.current{background:var(--orange-500);color:var(--navy-900);border-color:var(--orange-500)}
.pagination a.page-numbers:hover{border-color:var(--orange-500);color:var(--orange-500)}

/* KIT placeholder */
.kit-placeholder{background:var(--card);border:1px dashed var(--orange-500);border-radius:var(--r-lg);padding:20px;font-size:13.5px;color:var(--fg-muted);max-width:440px}
.cta .kit-placeholder{margin:0 auto;text-align:left}

/* FOOTER */
.site-footer{background:var(--bg)}
.foot{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:40px 0;flex-wrap:wrap}
.foot .fl{display:flex;gap:22px;flex-wrap:wrap}
.foot .fl a{font-size:13.5px;color:var(--fg-muted)}
.foot .fl a:hover{color:var(--orange-500)}
.socials{display:flex;gap:10px}
.socials a{width:36px;height:36px;border-radius:var(--r-md);border:1px solid var(--border);display:grid;place-items:center}
.socials a:hover{border-color:var(--orange-500)}
.socials svg{width:17px;height:17px;fill:var(--fg-body)}
.socials a:hover svg{fill:var(--orange-500)}
.copy{font-size:12.5px;color:var(--fg-muted);padding-bottom:34px}

@media(max-width:880px){
  .hero-grid{grid-template-columns:1fr;gap:36px;padding:56px 0 60px}
  .headshot{max-width:320px}
  .videos,.tgrid,.nb-grid{grid-template-columns:1fr}
  .about-grid,.bio-grid{grid-template-columns:1fr;gap:34px}
  .nav-links .link{display:none}
}

/* ---------------- Kit (ConvertKit) form — branded to match ---------------- */
.formkit-form{max-width:460px}
.cta .formkit-form,.content .formkit-form{margin:0 auto}
.formkit-form .formkit-fields{display:flex;gap:10px;flex-wrap:nowrap;margin:0}
.formkit-form .formkit-field{flex:1 1 auto;margin:0}
.formkit-form .formkit-input{width:100%;padding:14px 16px;border-radius:var(--r-md);border:1px solid var(--border);background:var(--card);color:var(--fg);font-family:var(--font-body);font-size:15px;line-height:1.4}
.formkit-form .formkit-input::placeholder{color:var(--fg-muted);opacity:1}
.formkit-form .formkit-input:focus{outline:2px solid var(--orange-500);outline-offset:1px;border-color:var(--orange-500)}
.formkit-form .formkit-submit{position:relative;overflow:hidden;margin:0;border:0;background:var(--orange-500);border-radius:var(--r-md);font-family:var(--font-display);font-weight:700;font-size:12.5px;letter-spacing:.03em;color:var(--navy-900);cursor:pointer;white-space:nowrap}
.formkit-form .formkit-submit>span{display:block;padding:14px 20px}
.formkit-form .formkit-submit:hover{background:var(--orange-600)}
.formkit-form .formkit-alert{margin:0 0 12px;padding:12px 14px;border-radius:var(--r-md);font-size:13.5px;list-style:none}
.formkit-form .formkit-alert:empty{display:none}
.formkit-form .formkit-alert-error{background:rgba(200,16,46,.14);border:1px solid #C8102E;color:var(--fg)}
.formkit-form .formkit-alert-success{background:rgba(46,158,94,.14);border:1px solid #2E9E5E;color:var(--fg);margin:12px 0 0}
.formkit-form .formkit-spinner{display:flex;position:absolute;top:0;left:0;right:0;margin:0 auto;height:0;width:0;overflow:hidden;transition:all .2s}
.formkit-form .formkit-spinner>div{width:10px;height:10px;margin:auto;background:var(--navy-900);border-radius:100%;display:inline-block;opacity:.5}
.formkit-form .formkit-submit[data-active] .formkit-spinner{height:100%;width:44px}
.formkit-form .formkit-submit[data-active] .formkit-spinner~span{opacity:0}
.cta .formkit-form .formkit-input{background:var(--navy-700);border-color:var(--navy-600);color:#fff}
@media(max-width:520px){.formkit-form .formkit-fields{flex-wrap:wrap}.formkit-form .formkit-submit{flex:1 0 100%}}

/* Screen-reader-only text (gives icon/image-only links an accessible name) */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}