/*
Theme Name: Velocity Capital
Theme URI: https://velocitycapital.ai
Author: Velocity Capital
Description: Custom theme for Velocity Capital — financial education firm teaching the Velocity System (the Rockefeller Method, velocity banking, tax strategy). Public marketing + education front end with a LearnDash-ready course area. Self-contained, no page builder required. LearnDash (3.0 template, Focus Mode) is installed separately and renders lesson pages; this theme styles the public pages, the course catalog/landing, and brands the LearnDash course area via the hooks at the bottom of this file.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: Proprietary
Text Domain: velocitycapital
*/

/* ==========================================================================
   VELOCITY CAPITAL — DESIGN TOKENS
   Benchmark: Paradigm Life / BetterWealth — trust-forward financial education.
   Tone (from the Production Playbook "Moving Parts" standard): calm, expensive,
   trustworthy. "Quietly. On purpose. Built to last." No hype, no neon.
   Palette: warm bone paper, deep evergreen anchor, restrained bronze accent.
   (Deliberately NOT navy/gold — that's reserved elsewhere.)
   ========================================================================== */

:root {
  --vc-evergreen:   #16352B;  /* deep, serious anchor */
  --vc-evergreen-2: #214A3C;
  --vc-moss:        #4A6B5C;  /* muted secondary */
  --vc-bronze:      #B08542;  /* restrained warm accent */
  --vc-bronze-dk:   #8E6A30;
  --vc-bone:        #F5F1E8;  /* warm paper bg */
  --vc-cream:       #FBF8F1;
  --vc-white:       #FFFFFF;
  --vc-ink:         #1C2521;  /* near-black warm */
  --vc-stone:       #5E6863;  /* body-muted text */
  --vc-line:        #E2DBCB;

  --vc-display: "Fraunces", Georgia, "Times New Roman", serif; /* serious humanist serif */
  --vc-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --vc-step--1: clamp(0.84rem, 0.81rem + 0.14vw, 0.92rem);
  --vc-step-0:  clamp(1rem, 0.97rem + 0.18vw, 1.09rem);
  --vc-step-1:  clamp(1.25rem, 1.14rem + 0.5vw, 1.55rem);
  --vc-step-2:  clamp(1.7rem, 1.4rem + 1.3vw, 2.5rem);
  --vc-step-3:  clamp(2.3rem, 1.8rem + 2.4vw, 3.8rem);
  --vc-step-4:  clamp(2.9rem, 2.1rem + 3.6vw, 4.9rem);

  --vc-maxw: 1180px;
  --vc-gutter: clamp(1.2rem, 4vw, 3rem);
  --vc-radius: 10px;
  --vc-shadow: 0 14px 44px rgba(22,53,43,.12);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin:0; font-family: var(--vc-body); font-size: var(--vc-step-0); line-height:1.65; color: var(--vc-ink); background: var(--vc-bone); -webkit-font-smoothing: antialiased; }

h1,h2,h3,h4 { font-family: var(--vc-display); font-weight:500; line-height:1.1; margin:0 0 .45em; color: var(--vc-evergreen); letter-spacing:-0.01em; }
h1 { font-size: var(--vc-step-4); }
h2 { font-size: var(--vc-step-3); }
h3 { font-size: var(--vc-step-1); }
p { margin:0 0 1.2em; max-width:66ch; }
a { color: var(--vc-bronze-dk); text-decoration:none; }
a:hover { text-decoration:underline; }
img { max-width:100%; height:auto; display:block; }

.vc-wrap { max-width: var(--vc-maxw); margin-inline:auto; padding-inline: var(--vc-gutter); }

.vc-eyebrow { text-transform:uppercase; letter-spacing:.2em; font-size: var(--vc-step--1); font-weight:600; color: var(--vc-bronze-dk); display:inline-block; margin-bottom:1rem; }

.vc-btn { display:inline-block; font-weight:600; font-size: var(--vc-step-0); padding:.9rem 1.9rem; border-radius:6px; border:1.5px solid var(--vc-evergreen); background: var(--vc-evergreen); color:#fff; cursor:pointer; transition: background .16s, transform .16s, box-shadow .16s; }
.vc-btn:hover { background: var(--vc-evergreen-2); text-decoration:none; transform: translateY(-1px); box-shadow: var(--vc-shadow); }
.vc-btn--bronze { background: var(--vc-bronze); border-color: var(--vc-bronze); color: var(--vc-ink); }
.vc-btn--bronze:hover { background: var(--vc-bronze-dk); border-color: var(--vc-bronze-dk); color:#fff; }
.vc-btn--ghost { background:transparent; color: var(--vc-evergreen); }
.vc-btn--ghost:hover { background: var(--vc-evergreen); color:#fff; }
.vc-btn--light { background:#fff; color: var(--vc-evergreen); border-color:#fff; }

/* Header */
.vc-header { position:sticky; top:0; z-index:50; background: rgba(251,248,241,.9); backdrop-filter: blur(8px); border-bottom:1px solid var(--vc-line); }
.vc-header__inner { display:flex; align-items:center; justify-content:space-between; min-height:74px; }
.vc-brand { font-family: var(--vc-display); font-weight:600; font-size:1.5rem; color: var(--vc-evergreen); letter-spacing:-.01em; }
.vc-brand b { color: var(--vc-bronze-dk); font-weight:600; }
.vc-nav { display:flex; gap:1.7rem; align-items:center; }
.vc-nav a { color: var(--vc-ink); font-weight:500; }
.vc-nav a:hover { color: var(--vc-bronze-dk); text-decoration:none; }
.vc-nav__cta { background: var(--vc-evergreen); color:#fff !important; padding:.55rem 1.2rem; border-radius:6px; }
.vc-nav__cta:hover { background: var(--vc-evergreen-2); }
.vc-burger { display:none; background:none; border:0; cursor:pointer; flex-direction:column; gap:5px; padding:8px; }
.vc-burger span { width:26px; height:2px; background: var(--vc-evergreen); display:block; }

/* Hero */
.vc-hero { background:
   radial-gradient(900px 480px at 78% -8%, rgba(74,107,92,.16), transparent),
   linear-gradient(180deg, var(--vc-cream), var(--vc-bone)); padding: clamp(3.5rem,8vw,6.5rem) 0; }
.vc-hero h1 { max-width:15ch; }
.vc-hero__lede { font-size: var(--vc-step-1); color: var(--vc-stone); max-width:50ch; margin-bottom:1.8rem; }
.vc-hero__actions { display:flex; gap:.9rem; flex-wrap:wrap; }
.vc-hero__trust { margin-top:2.4rem; padding-top:1.6rem; border-top:1px solid var(--vc-line); display:flex; gap:1.6rem 2.4rem; flex-wrap:wrap; color: var(--vc-stone); font-size: var(--vc-step--1); }

/* Sections */
.vc-section { padding: clamp(3.5rem,8vw,6rem) 0; }
.vc-section--green { background: var(--vc-evergreen); color: var(--vc-bone); }
.vc-section--green h2, .vc-section--green h3 { color:#fff; }
.vc-section--cream { background: var(--vc-cream); }
.vc-section__head { max-width:62ch; margin-bottom:2.8rem; }
.vc-section__head p { color: var(--vc-stone); font-size: var(--vc-step-1); }
.vc-section--green .vc-section__head p { color: var(--vc-bone); }

/* Cards */
.vc-grid { display:grid; gap:1.4rem; }
.vc-grid--3 { grid-template-columns: repeat(3,1fr); }
.vc-grid--2 { grid-template-columns: repeat(2,1fr); }
.vc-card { background: var(--vc-white); border:1px solid var(--vc-line); border-radius: var(--vc-radius); padding:2rem 1.8rem; transition: transform .18s, box-shadow .18s; }
.vc-card:hover { transform: translateY(-3px); box-shadow: var(--vc-shadow); }
.vc-card h3 { color: var(--vc-evergreen); }
.vc-card p { color: var(--vc-stone); margin-bottom:0; }
.vc-card__k { font-family: var(--vc-display); font-size: var(--vc-step-2); color: var(--vc-bronze-dk); line-height:1; display:block; margin-bottom:.4rem; }

/* Phase / step rows (the Velocity System phases) */
.vc-phases { display:grid; grid-template-columns: repeat(4,1fr); gap:1.4rem; }
.vc-phase { border-top:2px solid var(--vc-bronze); padding-top:1.1rem; }
.vc-phase__n { font-family: var(--vc-display); font-size: var(--vc-step-2); color: var(--vc-bronze-dk); line-height:1; }
.vc-phase h3 { color: var(--vc-evergreen); font-size: var(--vc-step-1); margin-top:.4rem; }
.vc-phase p { color: var(--vc-stone); font-size: var(--vc-step--1); }
.vc-section--green .vc-phase h3 { color:#fff; }
.vc-section--green .vc-phase p { color: var(--vc-bone); }

/* ----- Education hub: series + lessons (public landing; LearnDash renders the real course later) ----- */
.vc-series { margin-bottom:2.4rem; }
.vc-series__head { display:flex; align-items:baseline; gap:1rem; margin-bottom:1rem; border-bottom:1px solid var(--vc-line); padding-bottom:.6rem; }
.vc-series__num { font-family: var(--vc-display); color: var(--vc-bronze-dk); font-size: var(--vc-step-1); }
.vc-series__title { font-family: var(--vc-display); color: var(--vc-evergreen); font-size: var(--vc-step-1); margin:0; }
.vc-lessons { display:grid; grid-template-columns: repeat(3,1fr); gap:1rem; }
.vc-lesson { background: var(--vc-white); border:1px solid var(--vc-line); border-radius: var(--vc-radius); padding:1.3rem; display:flex; flex-direction:column; gap:.5rem; }
.vc-lesson__tag { font-size: var(--vc-step--1); text-transform:uppercase; letter-spacing:.12em; color: var(--vc-moss); font-weight:600; }
.vc-lesson__title { font-family: var(--vc-display); color: var(--vc-evergreen); font-size: 1.1rem; line-height:1.2; }
.vc-lesson__meta { font-size: var(--vc-step--1); color: var(--vc-stone); margin-top:auto; }

/* LearnDash placeholder banner — clearly marks where the live course area drops in */
.vc-ld-placeholder { border:2px dashed var(--vc-moss); border-radius: var(--vc-radius); background: rgba(74,107,92,.06); padding:2rem; text-align:center; color: var(--vc-moss); }
.vc-ld-placeholder strong { color: var(--vc-evergreen); }

/* Responsive 16:9 video wrapper (from the Production Playbook; used for Vimeo embeds) */
.vc-video-wrap { position:relative; padding-bottom:56.25%; height:0; overflow:hidden; border-radius: var(--vc-radius); background: var(--vc-evergreen); }
.vc-video-wrap iframe { position:absolute; top:0; left:0; width:100%; height:100%; border:0; }

/* Forms (strategy call / guide download) */
.vc-form { background: var(--vc-white); border:1px solid var(--vc-line); border-radius: var(--vc-radius); padding: clamp(1.6rem,4vw,2.6rem); box-shadow: var(--vc-shadow); }
.vc-form__row { display:grid; gap:1.1rem; margin-bottom:1.1rem; }
.vc-form__row--2 { grid-template-columns:1fr 1fr; }
.vc-field label { display:block; font-weight:600; font-size: var(--vc-step--1); margin-bottom:.35rem; color: var(--vc-ink); }
.vc-field input, .vc-field select, .vc-field textarea { width:100%; padding:.8rem .9rem; border:1px solid var(--vc-line); border-radius:8px; font:inherit; background: var(--vc-cream); color: var(--vc-ink); }
.vc-field input:focus, .vc-field select:focus, .vc-field textarea:focus { outline:2px solid var(--vc-moss); border-color: var(--vc-moss); }
.vc-form__note { font-size: var(--vc-step--1); color: var(--vc-stone); }
.vc-form__status { padding:1rem; border-radius:8px; margin-bottom:1rem; display:none; }
.vc-form__status.is-ok { display:block; background:#E6F4EA; color:#1E5631; border:1px solid #1E5631; }
.vc-form__status.is-err { display:block; background:#FCEBEA; color:#8A1C12; border:1px solid #8A1C12; }

/* Footer */
.vc-footer { background: var(--vc-evergreen); color: var(--vc-bone); padding: clamp(3rem,6vw,4.5rem) 0 2rem; }
.vc-footer__grid { display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:2rem; margin-bottom:2.4rem; }
.vc-footer h4 { color:#fff; font-size: var(--vc-step-0); font-family: var(--vc-body); font-weight:700; }
.vc-footer a { color: var(--vc-bone); display:block; margin-bottom:.5rem; }
.vc-footer a:hover { color: var(--vc-bronze); }
.vc-footer__partners { border-top:1px solid rgba(255,255,255,.16); border-bottom:1px solid rgba(255,255,255,.16); padding:1.5rem 0; margin-bottom:1.5rem; }
.vc-footer__partners-label { text-transform:uppercase; letter-spacing:.14em; font-size: var(--vc-step--1); font-weight:700; color: var(--vc-bronze); margin-bottom:.5rem; }
.vc-footer__legal { font-size: var(--vc-step--1); color: rgba(245,241,232,.74); line-height:1.7; }

@media (max-width:900px){
  .vc-grid--3,.vc-phases,.vc-lessons{ grid-template-columns:1fr 1fr; }
  .vc-footer__grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .vc-nav{ display:none; }
  .vc-burger{ display:flex; }
  .vc-nav.is-open{ display:flex; position:absolute; top:74px; left:0; right:0; flex-direction:column; background: var(--vc-cream); padding:1.2rem var(--vc-gutter); gap:1rem; border-bottom:1px solid var(--vc-line); }
  .vc-grid--3,.vc-grid--2,.vc-phases,.vc-lessons,.vc-form__row--2{ grid-template-columns:1fr; }
}
@media (prefers-reduced-motion: reduce){ *{ animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{ outline:3px solid var(--vc-bronze); outline-offset:2px; }

/* ==========================================================================
   LEARNDASH BRAND HOOKS — INERT UNTIL LEARNDASH IS INSTALLED
   --------------------------------------------------------------------------
   These selectors only match once the LearnDash plugin is active (it outputs
   the .learndash-wrapper container and Focus Mode markup). Until then they do
   nothing. They brand the LearnDash 3.0 template + Focus Mode to match the site.
   NOTE: some Focus Mode internals are version-specific — verify these against
   the installed LearnDash version once the plugin is live (see README).
   ========================================================================== */
.learndash-wrapper {
  --ld-color-primary: var(--vc-evergreen);   /* LearnDash 3.0 honors these CSS vars */
  --ld-color-secondary: var(--vc-bronze);
  font-family: var(--vc-body);
}
.learndash-wrapper .ld-button,
.learndash-wrapper .learndash-wrapper .ld-button { background: var(--vc-evergreen); border-color: var(--vc-evergreen); border-radius:6px; }
.learndash-wrapper .ld-button:hover { background: var(--vc-evergreen-2); }
.learndash-wrapper h1, .learndash-wrapper h2, .learndash-wrapper h3 { font-family: var(--vc-display); color: var(--vc-evergreen); }
/* Focus Mode header bar accent */
.learndash-wrapper .ld-focus-header { background: var(--vc-evergreen); }
.learndash-wrapper .ld-focus-sidebar { flex-basis: 350px; } /* documented Focus Mode sidebar width */
.learndash-wrapper .ld-progress .ld-progress-bar { background: var(--vc-bronze); }