/*
Theme Name: CFC Adaline
Description: Editorial financial-confidence theme for Creating Financial Confidence. Adaline-inspired aesthetic with cream canvas, forest green, amber, and terracotta. Fraunces serif, Inter body, JetBrains Mono labels. Standalone WordPress theme.
Author: Creating Financial Confidence
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.9
Tags: editorial, custom-colors, custom-menu, full-width-template, threaded-comments
*/

/* ============================================
   Design tokens — Adaline-inspired
============================================ */
:root{
  --canvas:#fbfdf6;
  --ink:#0a1d08;
  --mist:#c5ccb6;
  --stone:#e0e5d5;
  --valley:#203b14;
  --amber:#4a3212;
  --forest-dew:#d7e8b5;
  --deep-earth:#31200b;
  --terracotta:#b86a52;
  --terracotta-soft:#f1d9ce;
  --blush-cream:#f5ebe2;

  --serif:'Fraunces', Georgia, serif;
  --sans:'Inter', ui-sans-serif, system-ui, sans-serif;
  --mono:'JetBrains Mono', ui-monospace, monospace;

  --t-caption:12px;
  --t-bodysm:14px;
  --t-body:18px;
  --t-large:32px;
  --t-display:56px;
  --t-hero:80px;

  --sp-8:8px; --sp-16:16px; --sp-24:24px; --sp-32:32px;
  --sp-48:48px; --sp-64:64px; --sp-96:96px; --sp-128:128px;

  --r-img:8px; --r-btn:20px; --r-pill:9999px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--canvas); color:var(--ink);
  font-family:var(--sans); font-size:var(--t-body);
  line-height:1.55; -webkit-font-smoothing:antialiased;
  letter-spacing:-0.01em;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
.container{max-width:1280px;margin:0 auto;padding:0 var(--sp-32)}
.container-narrow{max-width:880px;margin:0 auto;padding:0 var(--sp-32)}

/* ============ NAV ============ */
nav.site{
  position:sticky; top:0; z-index:50;
  background:rgba(251,253,246,0.85);
  backdrop-filter:saturate(140%) blur(12px);
  -webkit-backdrop-filter:saturate(140%) blur(12px);
  border-bottom:1px solid var(--stone);
}
.nav-inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:var(--sp-16) var(--sp-32);
  max-width:1400px; margin:0 auto;
}
.nav-brand{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-weight:500;font-size:18px;letter-spacing:-0.02em}
.nav-brand .leaf{
  width:28px;height:28px;border-radius:50%;
  background:var(--valley); display:grid; place-items:center; color:var(--canvas);
  font-family:var(--serif); font-style:italic; font-size:14px;
}
.nav-links{display:flex;align-items:center;gap:var(--sp-24)}
.nav-links a{font-size:var(--t-bodysm);color:var(--ink);opacity:.85;transition:color .2s,opacity .2s}
.nav-links a:hover,.nav-links a.active{color:var(--valley);opacity:1}
.nav-cta-ghost{
  padding:10px 20px;border:1px solid var(--stone);
  border-radius:var(--r-btn); font-size:var(--t-bodysm);
  transition:all .2s;
}
.nav-cta-ghost:hover{border-color:var(--valley);color:var(--valley)}
.nav-cta-fill{
  background:var(--amber); color:var(--canvas);
  padding:10px 20px; border-radius:var(--r-btn);
  font-size:var(--t-bodysm); font-weight:500;
  transition:transform .15s, background .2s;
}
.nav-cta-fill:hover{background:var(--deep-earth);transform:translateY(-1px);color:var(--canvas)}

/* ============ HERO (homepage) ============ */
.hero{padding:var(--sp-96) 0 var(--sp-128)}
.hero-grid{
  display:grid; grid-template-columns: 1.1fr 0.9fr;
  gap:var(--sp-96); align-items:center;
}
.eyebrow{
  font-family:var(--mono); font-size:var(--t-caption);
  text-transform:uppercase; letter-spacing:0.08em;
  color:var(--valley);
  display:inline-flex; align-items:center; gap:10px;
  margin-bottom:var(--sp-32);
}
.eyebrow::before{content:"";width:24px;height:1px;background:var(--valley)}
h1.hero-title{
  font-family:var(--serif); font-size:var(--t-hero);
  line-height:1.02; font-weight:400; letter-spacing:-0.035em;
  color:var(--ink); margin-bottom:var(--sp-32);
}
h1.hero-title em{font-style:italic;font-weight:500;color:var(--valley)}
.hero-sub{
  font-size:20px; line-height:1.55;
  color:var(--ink); opacity:0.78;
  max-width:520px; margin-bottom:var(--sp-48);
}
.hero-ctas{display:flex;gap:var(--sp-16);align-items:center;flex-wrap:wrap}
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:14px 26px; border-radius:var(--r-btn);
  font-size:var(--t-bodysm); font-weight:500;
  transition:all .2s; cursor:pointer; border:none;
  font-family:var(--sans); text-decoration:none;
}
.btn-primary{background:var(--amber);color:var(--canvas)}
.btn-primary:hover{background:var(--deep-earth);transform:translateY(-1px);color:var(--canvas)}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--canvas)}
.btn-terracotta{background:var(--terracotta);color:var(--canvas)}
.btn-terracotta:hover{background:#9c5240;transform:translateY(-1px);color:var(--canvas)}
.btn .arrow{transition:transform .2s}
.btn:hover .arrow{transform:translateX(3px)}

.hero-visual{
  position:relative; aspect-ratio:4/5;
  border-radius:var(--r-img); overflow:hidden;
  background:linear-gradient(135deg, var(--forest-dew), var(--terracotta-soft));
  box-shadow: rgba(99, 143, 61, 0.1) 0px 0px 0px 1px;
}
.hero-visual img{width:100%; height:100%; object-fit:cover; filter:saturate(0.95) contrast(1.02)}
.hero-badge{
  position:absolute; bottom:24px; left:24px;
  background:var(--canvas);
  padding:14px 18px; border-radius:var(--r-btn);
  font-family:var(--mono); font-size:var(--t-caption);
  text-transform:uppercase; letter-spacing:0.08em;
  color:var(--valley);
  border:1px solid var(--stone);
}

/* ============ PAGE HERO (subpages) ============ */
.page-hero{
  padding:var(--sp-96) 0 var(--sp-64);
  border-bottom:1px solid var(--stone);
}
.page-hero h1{
  font-family:var(--serif); font-size:64px; font-weight:400;
  line-height:1.05; letter-spacing:-0.035em;
  max-width:880px; margin:var(--sp-24) 0;
}
.page-hero h1 em{font-style:italic;color:var(--valley);font-weight:500}
.page-hero .lead{
  font-size:20px; opacity:0.75; line-height:1.55;
  max-width:640px;
}

/* ============ VALUES STRIP ============ */
.values-strip{
  border-top:1px solid var(--stone);
  border-bottom:1px solid var(--stone);
  padding:var(--sp-48) 0; background:var(--canvas);
}
.values-grid{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:var(--sp-48); align-items:start;
}
.value-item .num{
  font-family:var(--mono); font-size:var(--t-caption);
  color:var(--valley); letter-spacing:0.08em;
  margin-bottom:var(--sp-16); display:block;
}
.value-item h4{
  font-family:var(--serif); font-weight:500; font-size:20px;
  letter-spacing:-0.02em; margin-bottom:8px;
}
.value-item p{font-size:var(--t-bodysm); color:var(--ink); opacity:0.7; line-height:1.5}

/* ============ SECTION SHARED ============ */
section.block{padding:var(--sp-128) 0}
.section-label{
  font-family:var(--mono); font-size:var(--t-caption);
  color:var(--valley); text-transform:uppercase; letter-spacing:0.08em;
  margin-bottom:var(--sp-24);
  display:inline-flex; align-items:center; gap:10px;
}
.section-label::before{content:"";width:24px;height:1px;background:var(--valley)}
.section-title{
  font-family:var(--serif); font-size:var(--t-display);
  font-weight:400; line-height:1.05; letter-spacing:-0.03em;
  max-width:780px; margin-bottom:var(--sp-24);
}
.section-title em{font-style:italic;color:var(--valley);font-weight:500}
.section-sub{
  font-size:20px; color:var(--ink); opacity:0.72;
  max-width:620px; margin-bottom:var(--sp-64); line-height:1.5;
}

/* ============ FEATURE CARDS ============ */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-24)}
.feature-card{
  background:var(--canvas); border:1px solid var(--stone);
  border-radius:var(--r-img); padding:var(--sp-32);
  transition:border-color .25s, transform .25s;
}
.feature-card:hover{border-color:var(--valley); transform:translateY(-2px)}
.feature-card .step{
  font-family:var(--mono); font-size:var(--t-caption);
  color:var(--valley); letter-spacing:0.08em; margin-bottom:var(--sp-24);
  display:flex; align-items:center; gap:10px;
}
.feature-card .step .dot{
  width:8px;height:8px;border-radius:50%;background:var(--terracotta);
}
.feature-card h3{
  font-family:var(--serif); font-weight:500; font-size:24px;
  letter-spacing:-0.02em; margin-bottom:var(--sp-16); line-height:1.15;
}
.feature-card p{font-size:var(--t-bodysm); color:var(--ink); opacity:0.72; line-height:1.6}

/* ============ EDITORIAL SPLIT ============ */
.editorial{padding:var(--sp-128) 0; background:var(--blush-cream)}
.editorial-grid{
  display:grid; grid-template-columns:0.9fr 1.1fr;
  gap:var(--sp-96); align-items:center;
}
.editorial-img{
  aspect-ratio:4/5; border-radius:var(--r-img);
  overflow:hidden; background:var(--terracotta-soft);
}
.editorial-img img{width:100%;height:100%;object-fit:cover;filter:saturate(0.93)}
.editorial-text .pullquote{
  font-family:var(--serif); font-size:36px; line-height:1.2;
  letter-spacing:-0.03em; font-weight:400; font-style:italic;
  margin:var(--sp-32) 0; color:var(--ink);
}
.editorial-text .pullquote::before{content:"\201C"; color:var(--terracotta); margin-right:6px}
.editorial-text .signature{
  font-family:var(--mono); font-size:var(--t-bodysm); color:var(--valley);
  letter-spacing:0.05em; text-transform:uppercase;
}

/* ============ DARK CTA BLOCK ============ */
.hero-cta{
  background:var(--ink); color:var(--canvas);
  border-radius:var(--r-img);
  padding:var(--sp-96) var(--sp-64);
  display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-64); align-items:center;
  margin:var(--sp-128) auto;
}
.hero-cta .section-label{color:var(--forest-dew)}
.hero-cta .section-label::before{background:var(--forest-dew)}
.hero-cta h2{
  font-family:var(--serif); font-size:48px; line-height:1.05;
  letter-spacing:-0.03em; font-weight:400;
}
.hero-cta h2 em{font-style:italic;color:var(--forest-dew);font-weight:500}
.hero-cta p{opacity:0.75; font-size:18px; margin:var(--sp-24) 0 var(--sp-32); max-width:480px}
.cta-stats{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-32)}
.cta-stat .num{
  font-family:var(--serif); font-size:60px; font-weight:400;
  letter-spacing:-0.04em; color:var(--forest-dew); line-height:1;
}
.cta-stat .label{
  font-family:var(--mono); font-size:var(--t-caption);
  text-transform:uppercase; letter-spacing:0.08em;
  opacity:0.75; margin-top:8px; display:block;
}

/* ============ GUIDE CARDS ============ */
.guides-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-24);margin-top:var(--sp-48)}
.guide-card{
  border:1px solid var(--stone); border-radius:var(--r-img);
  overflow:hidden; background:var(--canvas);
  transition:all .25s; display:flex; flex-direction:column;
}
.guide-card:hover{border-color:var(--valley); transform:translateY(-3px)}
.guide-cover{
  aspect-ratio:5/3;
  background:linear-gradient(135deg, var(--forest-dew), var(--blush-cream));
  display:grid; place-items:center;
  font-family:var(--serif); font-size:40px; color:var(--valley);
  font-style:italic; padding:0 24px; text-align:center;
}
.guide-card.tone-warm .guide-cover{
  background:linear-gradient(135deg, var(--terracotta-soft), var(--blush-cream));
  color:var(--terracotta);
}
.guide-card.tone-neutral .guide-cover{
  background:linear-gradient(135deg, var(--stone), var(--forest-dew));
  color:var(--ink);
}
.guide-body{padding:var(--sp-24);display:flex;flex-direction:column;flex:1}
.guide-body .kicker{
  font-family:var(--mono); font-size:11px; letter-spacing:0.1em;
  text-transform:uppercase; color:var(--valley); margin-bottom:12px;
}
.guide-body h4{
  font-family:var(--serif); font-weight:500; font-size:22px;
  letter-spacing:-0.02em; margin-bottom:10px; line-height:1.2;
}
.guide-body p{font-size:var(--t-bodysm); opacity:0.7; line-height:1.5; margin-bottom:var(--sp-16); flex:1}
.guide-body .read{
  font-size:var(--t-bodysm); color:var(--valley); font-weight:500;
  display:inline-flex; align-items:center; gap:6px;
}

/* ============ NEWSLETTER ============ */
.newsletter{
  text-align:center; padding:var(--sp-128) 0;
  border-top:1px solid var(--stone);
}
.newsletter .section-label{justify-content:center;text-align:center}
.newsletter h2{
  font-family:var(--serif); font-size:var(--t-display);
  font-weight:400; line-height:1.05; letter-spacing:-0.03em;
  max-width:720px; margin:0 auto var(--sp-24);
}
.newsletter h2 em{font-style:italic;color:var(--terracotta);font-weight:500}
.newsletter p{font-size:18px; opacity:0.72; max-width:520px; margin:0 auto var(--sp-48)}
.newsletter-form{
  display:flex; gap:var(--sp-8); max-width:480px; margin:0 auto;
  background:var(--canvas); border:1px solid var(--stone);
  border-radius:var(--r-btn); padding:6px;
}
.newsletter-form input{
  flex:1; border:none; background:transparent; padding:12px 18px;
  font-family:var(--sans); font-size:var(--t-bodysm); color:var(--ink);
  outline:none;
}
.newsletter-form input::placeholder{color:var(--mist);opacity:1}

/* ============ FOOTER ============ */
footer.site{
  background:var(--ink); color:var(--canvas);
  padding:var(--sp-96) 0 var(--sp-48);
  margin-top:var(--sp-64);
}
.footer-grid{
  display:grid; grid-template-columns:2fr 1fr 1fr 1fr;
  gap:var(--sp-64); margin-bottom:var(--sp-64);
}
.footer-brand h3{
  font-family:var(--serif); font-weight:400; font-size:28px;
  letter-spacing:-0.02em; margin-bottom:var(--sp-16);
}
.footer-brand h3 em{font-style:italic;color:var(--forest-dew)}
.footer-brand p{opacity:0.65; font-size:var(--t-bodysm); max-width:340px; line-height:1.6}
.footer-col h5{
  font-family:var(--mono); font-size:var(--t-caption); letter-spacing:0.08em;
  text-transform:uppercase; opacity:0.55; margin-bottom:var(--sp-24);
}
.footer-col a{
  display:block; font-size:var(--t-bodysm); opacity:0.85;
  margin-bottom:12px; transition:opacity .2s, color .2s;
}
.footer-col a:hover{opacity:1; color:var(--forest-dew)}
.footer-bottom{
  border-top:1px solid rgba(251,253,246,0.12);
  padding-top:var(--sp-32);
  display:flex; justify-content:space-between; align-items:center;
  font-size:var(--t-caption); opacity:0.55; font-family:var(--mono);
  letter-spacing:0.05em;
}

.disclaimer{
  background:var(--canvas); padding:var(--sp-24) 0;
  border-top:1px solid var(--stone);
  font-family:var(--mono); font-size:11px;
  text-align:center; color:var(--ink); opacity:0.55;
  letter-spacing:0.05em; text-transform:uppercase;
}

/* ============ ABOUT-SPECIFIC ============ */
.long-prose{max-width:720px;margin:0 auto;padding:var(--sp-96) var(--sp-32)}
.long-prose p{font-size:19px;line-height:1.7;margin-bottom:var(--sp-32);color:var(--ink);opacity:0.85}
.long-prose p.lead{font-size:24px;font-family:var(--serif);font-weight:400;letter-spacing:-0.02em;opacity:1;line-height:1.4}
.long-prose h3{font-family:var(--serif);font-size:32px;font-weight:500;letter-spacing:-0.025em;margin:var(--sp-48) 0 var(--sp-24);line-height:1.2}

/* ============ GUTENBERG BLOCK BRIDGE ============
   Maps WP block default classes to the Adaline aesthetic
   so existing page content renders well without rewriting.
============================================ */

/* Page wrapper for editor content */
main.site-main{padding:var(--sp-48) 0 var(--sp-96)}
main.site-main .entry-content{
  max-width:880px; margin:0 auto; padding:0 var(--sp-32);
}
main.site-main .entry-content > .alignwide{max-width:1100px; margin-left:auto; margin-right:auto}
main.site-main .entry-content > .alignfull{
  width:100vw; max-width:none;
  margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
  padding:var(--sp-64) var(--sp-32);
}

/* Headings inside content */
main.site-main h1{
  font-family:var(--serif); font-size:64px; font-weight:400;
  line-height:1.05; letter-spacing:-0.035em;
  margin:0 0 var(--sp-32);
}
main.site-main h2{
  font-family:var(--serif); font-size:40px; font-weight:400;
  line-height:1.1; letter-spacing:-0.025em;
  margin:var(--sp-48) 0 var(--sp-24);
}
main.site-main h3{
  font-family:var(--serif); font-size:28px; font-weight:500;
  line-height:1.2; letter-spacing:-0.02em;
  margin:var(--sp-32) 0 var(--sp-16);
}
main.site-main h4{
  font-family:var(--serif); font-size:22px; font-weight:500;
  line-height:1.25; margin:var(--sp-24) 0 var(--sp-16);
}
main.site-main p{margin:0 0 var(--sp-24); font-size:var(--t-body); line-height:1.65}
main.site-main ul, main.site-main ol{margin:0 0 var(--sp-24); padding-left:var(--sp-24)}
main.site-main li{margin-bottom:var(--sp-8); line-height:1.6}
main.site-main strong{font-weight:600; color:var(--valley)}
main.site-main em{font-style:italic; color:var(--valley)}
main.site-main a{
  color:var(--valley); text-decoration:underline;
  text-decoration-color:var(--mist); text-underline-offset:4px;
  transition:text-decoration-color .2s;
}
main.site-main a:hover{text-decoration-color:var(--valley)}

/* Eyebrow paragraphs (we use the className "eyebrow" widely) */
main.site-main p.eyebrow,
main.site-main .has-text-align-center.eyebrow{
  display:inline-block; font-family:var(--mono); font-size:var(--t-caption);
  text-transform:uppercase; letter-spacing:0.14em; color:var(--terracotta);
  font-weight:600; opacity:1; margin-bottom:var(--sp-16);
  text-decoration:none; padding:0;
}

/* Map WP buttons to the Adaline pill style */
main.site-main .wp-block-buttons{margin:var(--sp-24) 0; gap:var(--sp-16)}
main.site-main .wp-block-button__link,
.wp-block-button__link{
  background:var(--amber) !important; color:var(--canvas) !important;
  padding:14px 26px !important; border-radius:var(--r-btn) !important;
  font-family:var(--sans) !important; font-size:var(--t-bodysm) !important;
  font-weight:500 !important; transition:all .2s !important;
  border:none !important; letter-spacing:0;
  text-decoration:none !important;
}
main.site-main .wp-block-button__link:hover,
.wp-block-button__link:hover{
  background:var(--deep-earth) !important; color:var(--canvas) !important;
  transform:translateY(-1px);
}
main.site-main .is-style-outline .wp-block-button__link,
.is-style-outline .wp-block-button__link{
  background:transparent !important; color:var(--ink) !important;
  border:1px solid var(--ink) !important;
}
main.site-main .is-style-outline .wp-block-button__link:hover,
.is-style-outline .wp-block-button__link:hover{
  background:var(--ink) !important; color:var(--canvas) !important;
}

/* Lists style polish */
main.site-main .wp-block-list{padding-left:var(--sp-24)}

/* Columns */
main.site-main .wp-block-columns{margin:var(--sp-48) 0; gap:var(--sp-32)}

/* Quote */
main.site-main blockquote{
  border-left:3px solid var(--terracotta); padding-left:var(--sp-24);
  margin:var(--sp-32) 0; font-family:var(--serif); font-style:italic;
  font-size:24px; line-height:1.4; color:var(--ink); opacity:0.9;
}

/* Audit form (already styled inline in the block, do nothing) */
.cfc-audit { /* leave the inline styles in the audit alone */ }

/* ============ RESPONSIVE ============ */
@media (max-width:960px){
  :root{ --t-hero:48px; --t-display:38px }
  .hero-grid, .editorial-grid, .hero-cta, .footer-grid{
    grid-template-columns:1fr; gap:var(--sp-48);
  }
  .values-grid{grid-template-columns:1fr 1fr; gap:var(--sp-32)}
  .card-grid, .guides-grid{grid-template-columns:1fr;gap:var(--sp-16)}
  .nav-links a:not(.nav-cta-fill):not(.nav-cta-ghost){display:none}
  section.block, .hero{padding:var(--sp-64) 0}
  .hero-cta{padding:var(--sp-48) var(--sp-32);margin:var(--sp-64) auto}
  .container{padding:0 var(--sp-24)}
  .page-hero h1{font-size:42px}
  .long-prose p{font-size:17px}
  .long-prose p.lead{font-size:22px}
  main.site-main h1{font-size:42px}
  main.site-main h2{font-size:30px}
  main.site-main h3{font-size:24px}
}