/* public/css/audit-tool.css — Free Marketing Audit interactive scorer: Direction G pearl + gold styling */

.audit-page { background: #FFFEF9; min-height: 100vh; }

/* ── Hero ───────────────────────────────────────────────────── */
.audit-hero { background: #1A1A2E; padding: 80px 0 64px; position: relative; }
.audit-hero-inner { max-width: 1100px; margin: 0 auto; padding: 0 32px; display: flex; align-items: flex-start; gap: 64px; }
.audit-hero-text { flex: 1 1 560px; }
.audit-hero-sidebar { flex: 0 0 220px; text-align: center; padding-top: 8px; }
.audit-label { font-family: 'Jost', sans-serif; font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: #C9A96E; font-weight: 600; margin: 0 0 16px; }
.audit-h1 { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 48px; font-weight: 400; color: #FFFEF9; margin: 0 0 16px; line-height: 1.1; }
.audit-subhead { font-family: 'Jost', sans-serif; font-size: 16px; line-height: 1.7; color: rgba(255,254,249,0.75); margin: 0 0 24px; }
.audit-meta-row { display: flex; gap: 24px; flex-wrap: wrap; }
.audit-meta-item { font-family: 'Jost', sans-serif; font-size: 12px; color: rgba(255,254,249,0.5); letter-spacing: 0.05em; }
.audit-meta-item strong { color: #C9A96E; }
.audit-portrait-img { width: 140px; height: 140px; object-fit: cover; border-radius: 50%; border: 2px solid rgba(201,169,110,0.4); display: block; margin: 0 auto 12px; filter: grayscale(100%); }
.audit-portrait-caption { font-family: 'Jost', sans-serif; font-size: 12px; color: rgba(255,254,249,0.5); line-height: 1.5; }
.audit-portrait-cred { font-family: 'Jost', sans-serif; font-size: 11px; color: #C9A96E; font-style: italic; margin-top: 8px; line-height: 1.5; }

/* ── Progress bar ───────────────────────────────────────────── */
.audit-progress-wrap { background: #F5F0E8; padding: 16px 0; position: sticky; top: 0; z-index: 10; border-bottom: 1px solid #E8DCC4; }
.audit-progress-inner { max-width: 760px; margin: 0 auto; padding: 0 32px; }
.audit-progress-text { font-family: 'Jost', sans-serif; font-size: 12px; color: #999; margin-bottom: 8px; display: flex; justify-content: space-between; }
.audit-progress-bar-bg { height: 4px; background: rgba(201,169,110,0.2); border-radius: 2px; overflow: hidden; }
.audit-progress-bar-fill { height: 4px; background: #C9A96E; border-radius: 2px; transition: width 0.4s ease; }

/* ── Form container ─────────────────────────────────────────── */
.audit-form-wrap { max-width: 760px; margin: 0 auto; padding: 48px 32px 80px; }

/* ── Step card ──────────────────────────────────────────────── */
.audit-step { display: none; animation: audit-fadein 0.25s ease; }
.audit-step.is-active { display: block; }
@keyframes audit-fadein { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
.audit-step-cat { font-family:'Jost',sans-serif; font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:#C9A96E; font-weight:600; margin-bottom:8px; }
.audit-step-q { font-family:'Cormorant Garamond',Georgia,serif; font-size:28px; font-weight:400; color:#1A1A2E; margin:0 0 24px; line-height:1.25; }

/* ── Radio pill options ─────────────────────────────────────── */
.audit-options { display: flex; flex-direction: column; gap: 10px; }
.audit-option input[type="radio"] { position: absolute; opacity: 0; width: 0; height: 0; }
.audit-option label { display:flex; align-items:center; gap:16px; padding:16px 20px; border:1.5px solid #E8DCC4; border-radius:10px; cursor:pointer; background:#fff; font-family:'Jost',sans-serif; font-size:15px; color:#2C2C3E; transition:border-color 0.15s,background 0.15s; }
.audit-option label:hover { border-color:#C9A96E; background:#FDFAF4; }
.audit-option input[type="radio"]:checked + label { border-color:#C9A96E; background:#F5F0E8; color:#1A1A2E; font-weight:500; }
.audit-option-dot { width:18px; height:18px; border-radius:50%; border:2px solid #E8DCC4; flex-shrink:0; transition:border-color 0.15s,background 0.15s; }
.audit-option input[type="radio"]:checked + label .audit-option-dot { border-color:#C9A96E; background:#C9A96E; box-shadow:inset 0 0 0 3px #F5F0E8; }

/* ── Contact step ───────────────────────────────────────────── */
.audit-contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
.audit-contact-full { grid-column:1 / -1; }
.audit-field-label { display:block; font-family:'Jost',sans-serif; font-size:12px; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:#999; margin-bottom:6px; }
.audit-field-input, .audit-field-select { width:100%; box-sizing:border-box; padding:12px 14px; font-family:'Jost',sans-serif; font-size:14px; color:#1A1A2E; border:1.5px solid #E8DCC4; border-radius:8px; background:#fff; outline:none; transition:border-color 0.15s; appearance:none; }
.audit-field-input:focus, .audit-field-select:focus { border-color:#C9A96E; }

/* ── Nav buttons ─────────────────────────────────────────────── */
.audit-nav { display:flex; justify-content:space-between; align-items:center; margin-top:32px; gap:16px; }
.audit-btn-back { padding:12px 24px; background:transparent; border:1.5px solid #E8DCC4; border-radius:8px; font-family:'Jost',sans-serif; font-size:13px; font-weight:600; letter-spacing:0.08em; color:#999; cursor:pointer; transition:border-color 0.15s,color 0.15s; }
.audit-btn-back:hover { border-color:#C9A96E; color:#1A1A2E; }
.audit-btn-next { padding:14px 40px; background:#1A1A2E; border:none; border-radius:8px; font-family:'Jost',sans-serif; font-size:13px; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:#C9A96E; cursor:pointer; transition:background 0.15s; }
.audit-btn-next:hover { background:#2C2C3E; }
.audit-btn-submit { padding:14px 40px; background:#C9A96E; border:none; border-radius:8px; font-family:'Jost',sans-serif; font-size:13px; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:#1A1A2E; cursor:pointer; transition:background 0.15s; }
.audit-btn-submit:hover { background:#d4b46e; }
.audit-btn-submit:disabled, .audit-btn-next:disabled { opacity:0.5; cursor:not-allowed; }
.audit-step-error { font-family:'Jost',sans-serif; font-size:13px; color:#c62828; margin-top:12px; min-height:20px; }

/* ── Results ────────────────────────────────────────────────── */
.audit-results { display:none; }
.audit-results.is-visible { display:block; animation:audit-fadein 0.35s ease; }
.audit-score-hero { background:#1A1A2E; border-radius:16px; padding:48px 32px; text-align:center; margin-bottom:32px; }
.audit-score-label { font-family:'Jost',sans-serif; font-size:11px; letter-spacing:0.2em; text-transform:uppercase; color:#C9A96E; margin-bottom:12px; }
.audit-score-num { font-family:'Cormorant Garamond',Georgia,serif; font-size:96px; font-weight:300; line-height:1; margin-bottom:8px; }
.audit-score-num.score-red { color:#ef5350; } .audit-score-num.score-yellow { color:#FFA726; } .audit-score-num.score-green { color:#66BB6A; }
.audit-score-caption { font-family:'Jost',sans-serif; font-size:14px; color:rgba(255,254,249,0.5); }
.audit-breakdown-title, .audit-fixes-title { font-family:'Cormorant Garamond',Georgia,serif; font-size:24px; font-weight:400; color:#1A1A2E; margin:0 0 20px; }
.audit-category-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:40px; }
.audit-cat-card { background:#fff; border:1.5px solid #E8DCC4; border-radius:12px; padding:20px; }
.audit-cat-name { font-family:'Jost',sans-serif; font-size:11px; letter-spacing:0.15em; text-transform:uppercase; color:#999; margin-bottom:8px; }
.audit-cat-score { font-family:'Cormorant Garamond',Georgia,serif; font-size:36px; font-weight:300; line-height:1; margin-bottom:8px; }
.audit-cat-score.score-red { color:#ef5350; } .audit-cat-score.score-yellow { color:#FFA726; } .audit-cat-score.score-green { color:#66BB6A; }
.audit-cat-bar-bg { height:4px; background:rgba(201,169,110,0.15); border-radius:2px; overflow:hidden; }
.audit-cat-bar-fill { height:4px; border-radius:2px; }
.audit-cat-bar-fill.score-red { background:#ef5350; } .audit-cat-bar-fill.score-yellow { background:#FFA726; } .audit-cat-bar-fill.score-green { background:#66BB6A; }
.audit-cat-traffic { font-family:'Jost',sans-serif; font-size:11px; font-weight:600; margin-top:6px; }
.audit-cat-traffic.score-red { color:#c62828; } .audit-cat-traffic.score-yellow { color:#e65100; } .audit-cat-traffic.score-green { color:#2e7d32; }
.audit-fix-card { background:#F5F0E8; border-radius:12px; padding:24px; margin-bottom:12px; }
.audit-fix-cat { font-family:'Jost',sans-serif; font-size:11px; letter-spacing:0.15em; text-transform:uppercase; color:#C9A96E; font-weight:600; margin-bottom:8px; }
.audit-fix-text { font-family:'Jost',sans-serif; font-size:14px; line-height:1.7; color:#1A1A2E; margin:0; }
.audit-results-cta { background:#C9A96E; border-radius:16px; padding:40px 32px; text-align:center; margin-top:40px; }
.audit-results-cta h2 { font-family:'Cormorant Garamond',Georgia,serif; font-size:32px; font-weight:400; color:#1A1A2E; margin:0 0 8px; }
.audit-results-cta p { font-family:'Jost',sans-serif; font-size:15px; color:rgba(26,26,46,0.7); margin:0 0 24px; }
.audit-results-cta-btn { display:inline-block; background:#1A1A2E; color:#C9A96E; padding:16px 48px; border-radius:8px; text-decoration:none; font-family:'Jost',sans-serif; font-size:13px; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; transition:background 0.15s; }
.audit-results-cta-btn:hover { background:#2C2C3E; }
.audit-report-note { font-family:'Jost',sans-serif; font-size:13px; color:rgba(26,26,46,0.55); margin-top:16px; font-style:italic; }

/* ── Responsive ─────────────────────────────────────────────── */
@media(max-width:768px){
  .audit-hero-inner{flex-direction:column;gap:32px;padding:0 20px;}
  .audit-hero-sidebar{order:-1;display:flex;align-items:center;gap:16px;text-align:left;}
  .audit-portrait-img{width:72px;height:72px;flex-shrink:0;margin:0;}
  .audit-h1{font-size:34px;}
  .audit-category-grid{grid-template-columns:1fr;}
  .audit-contact-grid{grid-template-columns:1fr;}
  .audit-contact-full{grid-column:1;}
  .audit-score-num{font-size:72px;}
  .audit-form-wrap{padding:32px 20px 64px;}
  .audit-hero{padding:48px 0 40px;}
  .audit-progress-inner{padding:0 20px;}
}