/* Brandon C. Ricks — static rebuild of brandoncricks.com
   Design tokens taken from the live site's built CSS:
   parchment #F7F4EF, charcoal #1C1B19, gold #B08D3E, dark section #151412. */

:root {
  --parchment: #F7F4EF;
  --parchment-dark: #EFEAE1;
  --card: #FBF9F6;
  --charcoal: #1C1B19;
  --charcoal-mid: #2E2D29;
  --dark-section: #151412;
  --slate-text: #6F6D66;
  --gold: #B08D3E;
  --gold-light: #C7A45E;
  --border: #DED9D0;
  --muted-light: #DAD7D2;
  --font-display: "Playfair Display", Georgia, serif;
  --font-body: "Source Serif 4", Georgia, serif;
  --font-mono: "DM Mono", "Courier New", monospace;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: var(--font-body);
  background: var(--parchment);
  color: var(--charcoal);
  line-height: 1.7;
  font-size: 1.05rem;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block; }

a { color: inherit; }

.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }

/* ---------- type helpers ---------- */
.font-display { font-family: var(--font-display); }
.label-tag {
  font-family: var(--font-mono);
  font-size: .65rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--gold);
  display: block;
}
.gold-rule { background: var(--gold); width: 3rem; height: 1.5px; display: block; border: 0; }
.gold-rule.center { margin-left: auto; margin-right: auto; }
h1, h2, h3 { font-family: var(--font-display); font-weight: 700; line-height: 1.15; letter-spacing: -.02em; }
h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); }
.section-lede { color: var(--slate-text); font-size: .95rem; line-height: 1.8; }

/* ---------- buttons ---------- */
.btn-primary, .btn-outline, .btn-outline-light {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .875rem 2rem;
  font-family: var(--font-mono); font-size: .75rem;
  letter-spacing: .1em; text-transform: uppercase;
  text-decoration: none; border: 1px solid var(--charcoal);
  transition: background-color .2s, color .2s, border-color .2s;
  cursor: pointer; background: none;
}
.btn-primary { background: var(--charcoal); color: var(--parchment); }
.btn-primary:hover { background: var(--gold); border-color: var(--gold); color: #fff; }
.btn-outline { color: var(--charcoal); background: transparent; }
.btn-outline:hover { background: var(--charcoal); color: var(--parchment); }
.btn-outline-light { color: var(--muted-light); border-color: rgba(221, 217, 208, .4); background: transparent; }
.btn-outline-light:hover { border-color: var(--gold); color: var(--gold-light); }
.link-underline { text-decoration: none; position: relative; }
.link-underline:hover { color: var(--gold); }

/* ---------- header ---------- */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  background: rgba(247, 244, 239, .97);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(184, 150, 62, .25);
  transition: border-color .3s;
}
.site-header .container { display: flex; align-items: center; justify-content: space-between; height: 64px; }
.brand { font-family: var(--font-display); font-weight: 700; font-size: 1.05rem; letter-spacing: -.01em; color: var(--charcoal); text-decoration: none; }
.main-nav { display: flex; align-items: center; gap: 28px; }
.main-nav a {
  font-family: var(--font-mono); font-size: .65rem; letter-spacing: .12em;
  text-transform: uppercase; text-decoration: none; color: var(--slate-text);
  padding-bottom: 2px; border-bottom: 1px solid transparent;
  transition: color .2s;
}
.main-nav a:hover { color: var(--charcoal); }
.main-nav a.active { color: var(--gold); border-bottom-color: var(--gold); }
.main-nav .btn-outline-light { display: none; }
.nav-cta { margin-left: 8px; }
.menu-toggle { display: none; background: none; border: 0; cursor: pointer; padding: 8px; }
.menu-toggle span { display: block; width: 20px; height: 1px; background: var(--charcoal); margin: 5px 0; transition: transform .2s; }
.mobile-nav { display: none; background: rgba(247, 244, 239, .99); border-bottom: 1px solid rgba(184, 150, 62, .2); }
.mobile-nav.open { display: block; }
.mobile-nav a {
  display: block; padding: 6px 0;
  font-family: var(--font-mono); font-size: .7rem; letter-spacing: .12em;
  text-transform: uppercase; text-decoration: none; color: var(--charcoal);
}
main { padding-top: 64px; }

/* ---------- sections ---------- */
section { padding: 96px 0; }
.section-dark { background: var(--dark-section); color: var(--muted-light); }
.section-dark h2, .section-dark h1 { color: #F2EFE9; }
.section-dark .section-lede { color: #A8A49C; }
.split { display: grid; grid-template-columns: 1fr; gap: 48px; }
@media (min-width: 1024px) {
  .split { grid-template-columns: 4fr 8fr; gap: 64px; }
  .split-narrow { grid-template-columns: 5fr 7fr; }
}

/* hero */
.hero { background: #000; color: #F2EFE9; min-height: 92vh; display: flex; align-items: flex-end; padding: 64px 0; }
.hero .label-tag { color: var(--gold-light); font-size: .75rem; margin-bottom: 24px; }
.hero h1 { font-size: clamp(2.5rem, 6vw, 4.2rem); line-height: 1.1; color: #F2EFE9; margin-bottom: 16px; max-width: 900px; }
.hero .subtitle { font-family: var(--font-display); font-style: italic; font-size: clamp(1.1rem, 2vw, 1.4rem); line-height: 1.5; margin-bottom: 16px; color: #E8E4DC; }
.hero p.lede { color: #A8A49C; font-size: 1.15rem; line-height: 1.7; max-width: 600px; margin-bottom: 40px; }
.hero .actions { display: flex; flex-wrap: wrap; gap: 16px; }
.hero .btn-primary { background: #F7F4EF; color: #1C1B19; border-color: #F7F4EF; }
.hero .btn-primary:hover { background: var(--gold); border-color: var(--gold); color: #fff; }
.hero .btn-outline-light { border-color: rgba(218, 215, 210, .5); }

/* page hero (inner pages) */
.page-hero { background: var(--dark-section); color: #F2EFE9; padding: 96px 0 80px; }
.page-hero h1 { font-size: clamp(2.5rem, 5vw, 4rem); color: #F2EFE9; margin: 24px 0 20px; max-width: 800px; }
.page-hero p.lede { color: #A8A49C; font-size: 1.05rem; line-height: 1.7; max-width: 520px; }

/* tiers */
.tier-list { display: flex; flex-direction: column; gap: 32px; }
.tier { display: flex; gap: 24px; padding-bottom: 32px; border-bottom: 1px solid var(--parchment-dark); }
.tier:last-child { border-bottom: 0; padding-bottom: 0; }
.tier-num { font-family: var(--font-display); font-weight: 700; font-size: 2rem; color: var(--gold); line-height: 1.2; min-width: 2.5rem; }
.tier h3 { font-size: 1.2rem; margin-bottom: 4px; }
.tier .tier-tag { font-family: var(--font-body); font-size: .9rem; color: var(--slate-text); margin-bottom: 8px; }
.tier p { font-size: .95rem; color: var(--slate-text); line-height: 1.8; }
.tier ul { list-style: none; margin-top: 12px; }
.tier ul li { font-size: .95rem; color: var(--charcoal); padding: 3px 0 3px 18px; position: relative; }
.tier ul li::before { content: "—"; position: absolute; left: 0; color: var(--gold); }

/* numbered rows */
.num-row { display: flex; align-items: flex-start; gap: 24px; padding: 24px 0; border-bottom: 1px solid var(--border); }
.num-row:last-child { border-bottom: 0; }
.num-row .num { font-family: var(--font-mono); font-size: .65rem; letter-spacing: .12em; color: var(--gold); padding-top: 6px; min-width: 2rem; }
.num-row h3 { font-size: 1.15rem; margin-bottom: 4px; }
.num-row p { font-size: .95rem; color: var(--slate-text); line-height: 1.8; }

/* dark checklist */
.check-list { list-style: none; margin-bottom: 40px; }
.check-list li { display: flex; align-items: flex-start; gap: 16px; padding: 12px 0; font-size: 1.1rem; color: #D8D4CC; }
.check-list li::before { content: "—"; color: var(--gold); font-weight: 700; flex-shrink: 0; }
.belief { border-left: 4px solid var(--gold); padding-left: 24px; margin-top: 8px; }
.belief .label-tag { font-size: .8rem; margin-bottom: 8px; }
.belief p { font-size: 1rem; color: #C6C2B9; line-height: 1.7; }

/* about / image + text */
.about-grid { display: grid; grid-template-columns: 1fr; gap: 48px; align-items: center; }
@media (min-width: 1024px) { .about-grid { grid-template-columns: 5fr 7fr; } }
.portrait { width: 100%; height: 500px; object-fit: contain; background: #000; }
.portrait-480 { height: 480px; }
.about-copy p { margin-bottom: 24px; line-height: 1.8; }
.about-copy p:last-child { margin-bottom: 32px; }

/* image grid */
.img-grid { display: grid; grid-template-columns: 1fr; gap: 32px; }
@media (min-width: 768px) { .img-grid { grid-template-columns: 1fr 1fr; } }
.img-grid img { width: 100%; height: 380px; object-fit: contain; background: #000; }
.section-dark 
/* keynotes */
.keynote-list { list-style: none; }
.keynote-list li { display: flex; align-items: flex-start; gap: 12px; padding: 8px 0; font-size: 1.05rem; }
.keynote-list li::before { content: "—"; color: var(--gold); font-weight: 700; }
.topic-grid { display: grid; grid-template-columns: 1fr; gap: 32px; margin-top: 8px; }
@media (min-width: 768px) { .topic-grid { grid-template-columns: 1fr 1fr; } }
.topic h3 { font-size: 1.15rem; margin-bottom: 6px; }
.topic p { font-size: .95rem; color: var(--slate-text); line-height: 1.8; }

/* testimonials */
.testimonials { text-align: center; background: var(--parchment-dark); }
.testimonials h2 { max-width: 700px; margin: 24px auto 64px; }
.testi-grid { display: grid; grid-template-columns: 1fr; gap: 48px; text-align: left; }
@media (min-width: 768px) { .testi-grid { grid-template-columns: 1fr 1fr; } }
.testi blockquote { font-family: var(--font-display); font-size: 1.15rem; line-height: 1.6; margin-bottom: 16px; }
.testi blockquote::before { content: "\201C"; }
.testi blockquote::after { content: "\201D"; }
.testi cite { font-family: var(--font-mono); font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--gold); font-style: normal; }

/* CTA band */
.cta-band { text-align: center; }
.cta-band h2 { max-width: 700px; margin: 24px auto; }
.cta-band .actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; margin-top: 32px; }

/* FAQ */
.faq { border-top: 1px solid var(--border); }
.faq-item { padding: 28px 0; border-bottom: 1px solid var(--border); }
.faq-item h3 { font-size: 1.15rem; margin-bottom: 10px; }
.faq-item p { color: var(--slate-text); line-height: 1.8; max-width: 800px; }

/* legal pages */
.legal-list { max-width: 800px; }
.legal-item { display: flex; align-items: flex-start; gap: 24px; padding: 32px 0; border-bottom: 1px solid var(--border); }
.legal-item .num { font-family: var(--font-mono); font-size: .65rem; letter-spacing: .12em; color: var(--gold); padding-top: 8px; min-width: 2rem; }
.legal-item h2 { font-size: 1.15rem; margin-bottom: 8px; }
.legal-item p { color: var(--slate-text); line-height: 1.8; }

/* contact */
.contact-grid { display: grid; grid-template-columns: 1fr; gap: 48px; }
@media (min-width: 1024px) { .contact-grid { grid-template-columns: 4fr 8fr; } }
.contact-side p { color: var(--slate-text); line-height: 1.8; font-size: .9rem; margin-bottom: 32px; }
.contact-side .side-links { display: flex; flex-direction: column; gap: 16px; }
.contact-side .side-links .label-tag { font-size: .55rem; color: var(--gold); margin-bottom: 4px; }
.contact-side .side-links a { font-size: .95rem; text-decoration: none; color: var(--charcoal); }
.contact-side .side-links a:hover { color: var(--gold); }
.form-card { background: var(--parchment-dark); border: 3px solid var(--gold); padding: 40px; }
.form-row { display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 640px) { .form-row.two { grid-template-columns: 1fr 1fr; } }
.form-field { margin-bottom: 24px; }
.form-field label {
  display: block; font-family: var(--font-mono); font-size: .6rem;
  letter-spacing: .12em; text-transform: uppercase; color: var(--slate-text);
  margin-bottom: 8px;
}
.form-field input, .form-field select, .form-field textarea {
  width: 100%; padding: 12px 16px; font-family: var(--font-body); font-size: .95rem;
  background: var(--parchment-dark); border: 1px solid #DDD8CF; color: var(--charcoal);
  outline: none; border-radius: 0; appearance: none;
}
.form-field textarea { resize: none; min-height: 140px; }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus { border-color: var(--gold); }
.form-field input:disabled, .form-field select:disabled, .form-field textarea:disabled { opacity: .6; }
.hp { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.form-note { font-size: .85rem; color: var(--slate-text); margin-top: 16px; }
.form-note.error { color: #9B2C2C; }
.form-success { text-align: left; }
.form-success h3 { font-size: 1.5rem; margin-bottom: 12px; }
.form-success p { color: var(--slate-text); line-height: 1.8; margin-bottom: 24px; }

/* callout card (Production Masterminds, about page) */
.callout { background: #26241F; color: #DAD7D2; padding: 32px 40px; }
.callout h2 { color: #F2EFE9; margin-bottom: 12px; }
.callout p { color: #B9B5AC; line-height: 1.8; margin-bottom: 24px; }
.exp-card { border: 3px solid var(--gold); padding: 24px; margin-top: 24px; }
.exp-card .label-tag { font-size: .6rem; margin-bottom: 12px; }
.exp-card ul { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 4px 16px; }
.exp-card ul li { font-size: .95rem; padding: 2px 0; }
.quote-block { text-align: center; padding: 32px 0; }
.quote-block blockquote { font-family: var(--font-display); font-size: clamp(1.4rem, 2.5vw, 2rem); line-height: 1.4; margin-bottom: 12px; }
.quote-block blockquote::before { content: "\201C"; }
.quote-block blockquote::after { content: "\201D"; }
.quote-block p { color: var(--slate-text); }

/* footer */
.site-footer { background: var(--dark-section); color: #A8A49C; padding: 64px 0 0; }
.site-footer .footer-grid { display: grid; grid-template-columns: 1fr; gap: 48px; padding-bottom: 48px; }
@media (min-width: 768px) { .site-footer .footer-grid { grid-template-columns: repeat(4, 1fr); } }
.site-footer h3 { font-size: 1.1rem; color: #EDE9E2; margin-bottom: 12px; }
.site-footer .label-tag { margin-bottom: 16px; }
.site-footer p { font-size: .9rem; line-height: 1.8; color: #9C978D; }
.site-footer ul { list-style: none; }
.site-footer ul li { padding: 2px 0; }
.site-footer ul a { font-size: .9rem; color: #C9C5BC; text-decoration: none; transition: color .2s; }
.site-footer ul a:hover { color: #E8B64C; }
.site-footer .footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, .08);
  padding: 24px 0; display: flex; flex-direction: column; gap: 16px;
  font-family: var(--font-mono); font-size: .65rem; letter-spacing: .1em;
  color: #6E6A61;
}
@media (min-width: 768px) { .site-footer .footer-bottom { flex-direction: row; justify-content: space-between; align-items: center; } }

/* 404 */
.notfound { text-align: center; padding: 160px 0; }
.notfound h1 { font-size: clamp(3rem, 8vw, 6rem); }
.notfound h2 { margin: 16px 0; }
.notfound p { color: var(--slate-text); margin-bottom: 32px; }

@media (max-width: 1023px) {
  .main-nav { display: none; }
  .menu-toggle { display: block; }
  section { padding: 64px 0; }
}

.img-grid--4col { gap: 24px; }
.img-grid--4col img { height: 300px; }
@media (min-width: 1024px) { .img-grid--4col { grid-template-columns: repeat(4, 1fr); } }
