/*
Theme Name: Bravo Charlie
Theme URI: https://bravocharlie.io/
Author: Bravo Charlie
Description: Custom block theme for Bravo Charlie — AI-powered growth websites, lead generation, SEO and automation for local service businesses.
Version: 0.2.0
Requires at least: 6.6
Requires PHP: 8.0
Text Domain: bravo-charlie
*/

:root {
  --bc-ink: #0a0b0d;
  --bc-paper: #f7f7f4;
  --bc-muted: #70747c;
  --bc-line: rgba(10,11,13,.12);
  --bc-card: #ffffff;
  --bc-accent: #ff6a2a;
  --bc-accent-dark: #d94b10;
  --bc-radius: 24px;
  --bc-shadow: 0 24px 70px rgba(10,11,13,.09);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
a { text-underline-offset: .18em; }

.bc-shell { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.bc-section { padding: clamp(72px, 9vw, 128px) 0; }
.bc-kicker { font-size: .78rem; line-height: 1; letter-spacing: .16em; text-transform: uppercase; font-weight: 800; }
.bc-display { font-size: clamp(3.4rem, 8.2vw, 7.4rem); line-height: .91; letter-spacing: -.065em; font-weight: 760; margin: 0; }
.bc-h2 { font-size: clamp(2.4rem, 5vw, 4.75rem); line-height: .98; letter-spacing: -.05em; margin: 0; }
.bc-lede { font-size: clamp(1.08rem, 1.7vw, 1.35rem); line-height: 1.55; max-width: 690px; color: var(--bc-muted); }

.bc-button .wp-block-button__link,
.wp-block-button.bc-button .wp-block-button__link {
  border-radius: 999px;
  padding: 15px 24px;
  font-weight: 750;
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.bc-button .wp-block-button__link:hover,
.wp-block-button.bc-button .wp-block-button__link:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(10,11,13,.14); }

.bc-header-wrap { position: relative; z-index: 20; max-width:none !important; }
.bc-header { width: min(1180px, calc(100% - 40px)); max-width:1180px !important; margin: 18px auto 0; padding: 12px 14px 12px 18px; border: 1px solid var(--bc-line); border-radius: 999px; background: rgba(247,247,244,.86); backdrop-filter: blur(18px); box-shadow: 0 10px 34px rgba(10,11,13,.05); }
.bc-wordmark { display:inline-flex; align-items:center; gap:10px; letter-spacing: -.035em; font-weight: 900; font-size: 1.02rem; text-decoration: none; white-space:nowrap; }
.bc-wordmark-mark { width:30px; height:30px; border-radius:9px; display:grid; place-items:center; background:var(--bc-ink); color:#fff; font-size:.66rem; letter-spacing:.04em; }
.bc-wordmark:hover .bc-wordmark-mark { background:var(--bc-accent); color:var(--bc-ink); }
.bc-nav a { font-size: .92rem; font-weight: 650; text-decoration: none; }

.bc-hero { min-height: calc(100vh - 92px); display: flex; align-items: center; position: relative; padding: clamp(70px, 8vw, 110px) 0 80px; }
.bc-hero::before { content:""; position:absolute; inset: -160px -20vw auto auto; width: 54vw; height: 54vw; max-width: 760px; max-height: 760px; border-radius:50%; background: radial-gradient(circle, rgba(255,106,42,.18), rgba(255,106,42,0) 68%); pointer-events:none; }
.bc-hero-grid { display: grid; grid-template-columns: 1.12fr .88fr; gap: clamp(40px, 6vw, 84px); align-items: center; }
.bc-hero-copy { position:relative; z-index:2; }
.bc-hero-copy .bc-lede { margin: 26px 0 30px; }
.bc-eyebrow-row { display:flex; gap:10px; align-items:center; margin-bottom: 26px; }
.bc-pulse { width:9px; height:9px; border-radius:50%; background:var(--bc-accent); box-shadow:0 0 0 6px rgba(255,106,42,.12); }

.bc-flow { position:relative; min-height: 560px; display:flex; align-items:center; justify-content:center; }
.bc-flow-card { width:min(100%, 475px); border:1px solid rgba(255,255,255,.1); border-radius:32px; padding:20px; background:#111318; color:white; box-shadow: 0 36px 90px rgba(10,11,13,.22); transform: rotate(1.5deg); }
.bc-flow-top { display:flex; justify-content:space-between; align-items:center; padding: 4px 4px 16px; }
.bc-flow-dots { display:flex; gap:6px; }
.bc-flow-dots span { width:7px; height:7px; border-radius:50%; background:#424750; }
.bc-flow-label { font-size:.72rem; letter-spacing:.13em; text-transform:uppercase; color:#9ea5b1; font-weight:800; }
.bc-flow-step { display:grid; grid-template-columns:42px 1fr auto; gap:13px; align-items:center; padding:14px; border:1px solid rgba(255,255,255,.08); border-radius:18px; margin-top:10px; background:rgba(255,255,255,.035); transition: border-color .25s ease, transform .25s ease, background .25s ease; }
.bc-flow-step.is-active { border-color:rgba(255,106,42,.65); background:rgba(255,106,42,.09); transform: translateX(-6px); }
.bc-flow-icon { width:42px; height:42px; border-radius:13px; display:grid; place-items:center; background:#1c2027; color:#fff; font-weight:900; }
.bc-flow-step strong { display:block; font-size:.96rem; }
.bc-flow-step small { display:block; color:#9198a5; margin-top:3px; font-size:.76rem; }
.bc-flow-status { font-size:.7rem; color:#9ea5b1; }
.bc-flow-result { margin-top:12px; padding:17px; border-radius:20px; background:var(--bc-accent); color:#111; display:flex; justify-content:space-between; align-items:center; font-weight:850; }

.bc-proof-strip { border-top:1px solid var(--bc-line); border-bottom:1px solid var(--bc-line); padding:20px 0; }
.bc-proof-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.bc-proof-item { display:flex; align-items:center; gap:10px; color:#40444b; font-weight:680; font-size:.92rem; }
.bc-proof-item span { width:7px; height:7px; background:var(--bc-accent); border-radius:50%; flex:0 0 auto; }

.bc-problem-grid, .bc-service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:52px; }
.bc-card { background:var(--bc-card); border:1px solid var(--bc-line); border-radius:var(--bc-radius); padding:clamp(24px,3vw,36px); box-shadow:0 1px 0 rgba(10,11,13,.02); }
.bc-card-number { font-size:.76rem; color:var(--bc-accent-dark); font-weight:850; letter-spacing:.12em; text-transform:uppercase; }
.bc-card h3 { font-size:1.55rem; letter-spacing:-.035em; margin:42px 0 12px; }
.bc-card p { color:var(--bc-muted); margin:0; line-height:1.6; }

.bc-dark { background:#0c0e12; color:#f7f7f4; }
.bc-dark .bc-lede, .bc-dark p { color:#aeb4bf; }
.bc-dark .bc-card { background:#14171d; border-color:rgba(255,255,255,.09); box-shadow:none; }
.bc-dark .bc-card p { color:#9fa6b2; }
.bc-dark .bc-card-number { color:#ff8b5a; }

.bc-system { display:grid; grid-template-columns:.82fr 1.18fr; gap:clamp(48px,8vw,100px); align-items:start; }
.bc-system-list { border-top:1px solid rgba(255,255,255,.14); }
.bc-system-row { display:grid; grid-template-columns:56px 1fr; gap:16px; padding:24px 0; border-bottom:1px solid rgba(255,255,255,.14); }
.bc-system-row b { color:#ff8b5a; font-size:.8rem; }
.bc-system-row h3 { margin:0 0 6px; letter-spacing:-.025em; font-size:1.22rem; }
.bc-system-row p { margin:0; font-size:.94rem; }

.bc-demo { display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,6vw,78px); align-items:center; }
.bc-chat { max-width:520px; margin-left:auto; padding:18px; border-radius:28px; border:1px solid var(--bc-line); background:#fff; box-shadow:var(--bc-shadow); }
.bc-chat-head { display:flex; justify-content:space-between; align-items:center; padding:4px 3px 16px; border-bottom:1px solid var(--bc-line); font-size:.78rem; font-weight:800; }
.bc-message { max-width:85%; padding:13px 15px; border-radius:18px; margin:16px 0 0; font-size:.92rem; line-height:1.48; }
.bc-message.in { background:#f0f1ee; border-bottom-left-radius:6px; }
.bc-message.out { background:#111318; color:#fff; margin-left:auto; border-bottom-right-radius:6px; }
.bc-message-time { display:block; font-size:.65rem; opacity:.58; margin-top:7px; }
.bc-auto-note { margin-top:16px; border-radius:18px; background:rgba(255,106,42,.1); padding:13px 15px; color:#8d350f; font-size:.8rem; font-weight:750; }

.bc-work { border-radius:34px; overflow:hidden; background:linear-gradient(140deg,#111318 0%, #242832 100%); min-height:470px; padding:clamp(28px,5vw,58px); color:white; position:relative; }
.bc-work::after { content:""; position:absolute; right:-12%; bottom:-40%; width:60%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(255,106,42,.38),rgba(255,106,42,0) 66%); }
.bc-work-content { position:relative; z-index:2; max-width:600px; }
.bc-work h3 { font-size:clamp(2.2rem,4.4vw,4.5rem); line-height:.98; letter-spacing:-.05em; margin:100px 0 18px; }
.bc-work p { color:#b8bec8; max-width:530px; }

.bc-process-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin-top:54px; border-top:1px solid var(--bc-line); border-bottom:1px solid var(--bc-line); }
.bc-process-step { padding:34px 30px 38px 0; border-right:1px solid var(--bc-line); }
.bc-process-step + .bc-process-step { padding-left:30px; }
.bc-process-step:last-child { border-right:0; }
.bc-process-step b { color:var(--bc-accent-dark); font-size:.82rem; }
.bc-process-step h3 { margin:32px 0 10px; font-size:1.5rem; letter-spacing:-.035em; }
.bc-process-step p { color:var(--bc-muted); margin:0; }

.bc-cta { background:var(--bc-accent); color:#101114; border-radius:38px; padding:clamp(38px,7vw,78px); display:grid; grid-template-columns:1.2fr .8fr; gap:40px; align-items:end; }
.bc-cta h2 { max-width:790px; }
.bc-cta p { color:#4d250f; max-width:500px; }
.bc-cta-actions { display:flex; justify-content:flex-end; align-items:flex-end; }


.bc-audit-wrap { display:grid; grid-template-columns:.78fr 1.22fr; gap:clamp(36px,7vw,88px); align-items:start; }
.bc-audit-panel { background:#fff; border:1px solid var(--bc-line); border-radius:32px; padding:clamp(24px,4vw,44px); box-shadow:var(--bc-shadow); }
.bc-audit-form { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.bc-field { display:flex; flex-direction:column; gap:7px; }
.bc-field-full { grid-column:1 / -1; }
.bc-field label { font-size:.78rem; font-weight:800; letter-spacing:.02em; }
.bc-field input, .bc-field select, .bc-field textarea { width:100%; border:1px solid #d8dad6; background:#fbfbf9; color:var(--bc-ink); border-radius:14px; padding:14px 15px; font:inherit; outline:none; transition:border-color .2s ease, box-shadow .2s ease, background .2s ease; }
.bc-field textarea { min-height:120px; resize:vertical; }
.bc-field input:focus, .bc-field select:focus, .bc-field textarea:focus { border-color:var(--bc-accent); box-shadow:0 0 0 4px rgba(255,106,42,.11); background:#fff; }
.bc-audit-submit { grid-column:1 / -1; border:0; border-radius:999px; padding:16px 22px; background:var(--bc-ink); color:#fff; font:inherit; font-weight:800; cursor:pointer; transition:transform .2s ease, box-shadow .2s ease; }
.bc-audit-submit:hover { transform:translateY(-2px); box-shadow:0 14px 30px rgba(10,11,13,.16); }
.bc-form-note { grid-column:1 / -1; color:var(--bc-muted); font-size:.76rem; margin:0; line-height:1.5; }
.bc-form-status { margin:0 0 18px; padding:13px 15px; border-radius:14px; font-size:.9rem; font-weight:700; }
.bc-form-status.success { background:#edf8ef; color:#235e31; }
.bc-form-status.error { background:#fff1ed; color:#8d350f; }
.bc-hp { position:absolute !important; left:-9999px !important; width:1px !important; height:1px !important; overflow:hidden !important; }

.bc-footer { padding:44px 0 28px; border-top:1px solid var(--bc-line); }
.bc-footer-grid { display:grid; grid-template-columns:1fr auto; gap:30px; align-items:center; }
.bc-footer-small { margin-top:42px; display:flex; justify-content:space-between; gap:20px; color:var(--bc-muted); font-size:.78rem; }

@media (max-width: 900px) {
  .bc-header { border-radius:24px; }
  .bc-nav { display:none; }
  .bc-hero { min-height:auto; }
  .bc-hero-grid, .bc-system, .bc-demo, .bc-cta, .bc-audit-wrap { grid-template-columns:1fr; }
  .bc-flow { min-height:auto; }
  .bc-flow-card { transform:none; }
  .bc-problem-grid, .bc-service-grid { grid-template-columns:1fr; }
  .bc-proof-grid { grid-template-columns:1fr 1fr; }
  .bc-chat { margin:0; }
  .bc-cta-actions { justify-content:flex-start; }
}

@media (max-width: 620px) {
  .bc-shell { width:min(100% - 28px, 1180px); }
  .bc-header { width:min(100% - 20px, 1180px); margin-top:10px; padding:10px 12px 10px 15px; }
  .bc-display { font-size:clamp(3rem,16vw,4.6rem); }
  .bc-section { padding:72px 0; }
  .bc-proof-grid { grid-template-columns:1fr; }
  .bc-process-grid { grid-template-columns:1fr; }
  .bc-process-step, .bc-process-step + .bc-process-step { padding:26px 0; border-right:0; border-bottom:1px solid var(--bc-line); }
  .bc-process-step:last-child { border-bottom:0; }
  .bc-footer-grid, .bc-footer-small { grid-template-columns:1fr; display:grid; }
  .bc-flow-card { padding:14px; border-radius:24px; }
  .bc-audit-form { grid-template-columns:1fr; }
  .bc-field-full, .bc-audit-submit, .bc-form-note { grid-column:1; }
  .bc-flow-step { grid-template-columns:38px 1fr; }
  .bc-flow-status { display:none; }
}