/* Free Marketing Audit page — layout, form, animation */
:root { --fa-navy:#1e3a6e; --fa-navy-2:#16305c; --fa-ink:#0f172a; --fa-muted:#4b6190; --fa-line:#c9d6ee; --fa-soft:#f4f7fc; --fa-accent:#3B82F6; }
.ar-fa { max-width:1180px; margin:0 auto; padding:48px 22px 72px; color:var(--fa-ink); }
.ar-fa-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:56px; align-items:start; }
.ar-fa-eyebrow { font-size:13px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:#6b82b0; margin:0 0 18px; }
.ar-fa-title { font-family:var(--arf-font-heading, "Oswald", Impact, "Arial Narrow", sans-serif); font-weight:600; font-size:clamp(2.6rem,6vw,4.6rem); line-height:.98; text-transform:uppercase; color:var(--fa-navy); margin:0 0 22px; letter-spacing:.005em; }
.ar-fa-lead { font-size:1.12rem; line-height:1.7; color:#4b6190; margin:0 0 30px; max-width:520px; }
.ar-fa-points { list-style:none; margin:0; padding:0; display:grid; gap:20px; }
.ar-fa-points li { position:relative; padding-left:20px; }
.ar-fa-points li::before { content:""; position:absolute; left:0; top:.6em; width:6px; height:6px; border-radius:50%; background:var(--fa-navy); }
.ar-fa-points strong { display:block; color:var(--fa-navy); font-size:1.02rem; margin-bottom:2px; }
.ar-fa-points span { color:var(--fa-muted); line-height:1.6; }

.ar-fa-card { background:#fff; border:1px solid #e3eaf6; border-radius:22px; padding:34px 30px; box-shadow:0 24px 60px -24px rgba(30,58,110,.22); }
.ar-fa-form { display:grid; gap:18px; }
.ar-fa-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.ar-fa-form label { display:grid; gap:6px; font-size:14px; font-weight:600; color:var(--fa-navy); }
.ar-fa-form input[type=text], .ar-fa-form input[type=email], .ar-fa-form input[type=tel], .ar-fa-form select, .ar-fa-form textarea {
  width:100%; padding:13px 14px; border:1.5px solid var(--fa-line); border-radius:12px; background:#fff; font-family:inherit,system-ui,sans-serif; font-size:15px; line-height:1.4; color:var(--fa-ink);
  transition:border-color .25s, box-shadow .25s; box-sizing:border-box;
}
.ar-fa-form input::placeholder, .ar-fa-form textarea::placeholder { color:#9fb2d4; }
.ar-fa-form input:focus, .ar-fa-form select:focus, .ar-fa-form textarea:focus { outline:none; border-color:var(--fa-accent); box-shadow:0 0 0 4px rgba(59,130,246,.14); }
.ar-fa-form select { appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--fa-navy) 50%),linear-gradient(135deg,var(--fa-navy) 50%,transparent 50%); background-position:calc(100% - 20px) 55%,calc(100% - 14px) 55%; background-size:6px 6px,6px 6px; background-repeat:no-repeat; padding-right:38px; }
.ar-fa-form textarea { resize:vertical; min-height:110px; }
.ar-fa-full { display:block; }
.ar-fa-form fieldset { border:0; padding:0; margin:0; min-width:0; }
.ar-fa-form legend { font-size:14px; font-weight:600; color:var(--fa-navy); margin-bottom:10px; padding:0; }
.ar-fa-chips { display:flex; flex-wrap:wrap; gap:8px; }
.ar-fa-chip { position:relative; display:inline-flex !important; cursor:pointer; }
.ar-fa-chip input { position:absolute; opacity:0; pointer-events:none; }
.ar-fa-chip span { display:inline-block; padding:9px 14px; border:1.5px solid var(--fa-line); border-radius:999px; font-size:13.5px; font-weight:500; color:var(--fa-navy); background:#fff; transition:all .25s var(--fa-ease, cubic-bezier(.2,.7,.2,1)); }
.ar-fa-chip:hover span { border-color:var(--fa-navy); transform:translateY(-1px); }
.ar-fa-chip input:checked + span { background:var(--fa-navy); border-color:var(--fa-navy); color:#fff; }
.ar-fa-chip input:focus-visible + span { box-shadow:0 0 0 4px rgba(59,130,246,.25); }

.ar-fa-submit { margin-top:6px; width:100%; padding:17px 22px; border:0; border-radius:999px; background:var(--fa-navy); color:#fff; font-size:16px; font-weight:700; cursor:pointer; box-shadow:0 14px 30px -10px rgba(30,58,110,.55); transition:transform .3s cubic-bezier(.2,.7,.2,1), background .3s, box-shadow .3s; }
.ar-fa-submit:hover { background:var(--fa-navy-2); transform:translateY(-2px); box-shadow:0 18px 36px -10px rgba(30,58,110,.6); }
.ar-fa-submit:disabled { opacity:.6; cursor:wait; transform:none; }
.ar-fa-status { margin:0; min-height:1.2em; font-size:14px; color:#b42318; }
.ar-fa-status.ok { color:#067647; }
.ar-fa-done { text-align:center; padding:30px 10px; }
.ar-fa-done h2 { color:var(--fa-navy); margin:0 0 10px; font-size:1.5rem; }
.ar-fa-done p { color:var(--fa-muted); margin:0; line-height:1.6; }
.ar-fa-hp { position:absolute !important; left:-10000px !important; width:1px; height:1px; overflow:hidden; }

/* Entrance (scroll-driven; falls back to visible) */
@supports (animation-timeline: view()) {
  .ar-fa-rise { animation:ar-fa-up linear both; animation-timeline:view(); animation-range:entry 0% cover 30%; }
}
@keyframes ar-fa-up { from { opacity:0; translate:0 36px; } to { opacity:1; translate:0 0; } }

/* Mobile: single column, full-width card, larger tap targets */
@media (max-width: 900px) {
  .ar-fa-grid { grid-template-columns:1fr; gap:36px; }
  .ar-fa-lead { max-width:none; }
}
@media (max-width: 600px) {
  .ar-fa { padding:28px 16px 56px; }
  .ar-fa-card { padding:24px 18px; border-radius:18px; }
  .ar-fa-row { grid-template-columns:1fr; }
  .ar-fa-form input, .ar-fa-form select, .ar-fa-form textarea { font-size:16px; padding:14px; }
  .ar-fa-chip span { padding:10px 14px; font-size:14px; }
}
@media (prefers-reduced-motion: reduce) {
  .ar-fa-rise, .ar-fa-submit, .ar-fa-chip span { animation:none !important; transition:none !important; }
}
