/* ═══════════════════════════════════════════════════════════════
   Protean Minds theme — form and tool pages (signup, login,
   onboarding, reset, GMB audit, SEO audit). Loaded after
   pm-theme.css.

   On these pages --primary is used for text, borders and focus as
   often as for fills, and amber text on cream is unreadable. So, as
   on the parent site, the working colour is ink navy, and amber is
   kept for the one main action per screen.
   ═══════════════════════════════════════════════════════════════ */
:root {
  --primary: var(--pm-ink);
  --primary-dark: #000;
  --primary-light: var(--pm-cream);
  --ink: var(--pm-ink);
  --ink-2: var(--pm-ink-2);
  --muted: var(--pm-muted);
  --line: var(--pm-sand-line);
  --white: #fff;
}

/* the one main action: amber pill, ink text */
.btn-submit, .btn-next, .ga-btn-primary, .ga-btn-nav, .sa-btn-primary, .ga-form-submit {
  background: var(--pm-amber) !important; color: var(--pm-ink) !important;
  border-radius: 999px !important; font-family: var(--pm-display); font-weight: 600;
  box-shadow: 0 10px 26px -14px rgba(246,180,25,.8);
}
.btn-submit:hover, .btn-next:hover, .ga-btn-primary:hover:not(:disabled), .ga-btn-nav:hover {
  background: var(--pm-amber-hi) !important; opacity: 1; transform: none;
  box-shadow: 0 14px 30px -14px rgba(246,180,25,.9);
}
.btn-back, .btn-google, .ga-btn-ghost-sm { border-radius: 999px; }
.btn-google { border-width: 1px; border-color: var(--pm-sand-line); }
.btn-google:hover { border-color: var(--pm-ink); box-shadow: none; }

/* ── Auth split layout ── */
.auth-left { background: var(--pm-navy); }
.auth-left::after {
  content: ''; position: absolute; width: 520px; height: 520px; right: -180px; top: -160px;
  border-radius: 50%; background: rgba(20,63,88,.85); filter: blur(110px); pointer-events: none;
}
.auth-left::before { background-image: radial-gradient(rgba(255,255,255,.035) 1px, transparent 1px); }
.auth-brand-icon, .onboard-brand-icon {
  background: var(--pm-amber); color: var(--pm-ink); border-radius: 50%;
  font-family: var(--pm-display); font-weight: 800; box-shadow: 0 0 0 4px rgba(246,180,25,.16);
}
.auth-brand span, .onboard-brand { font-family: var(--pm-display); }
.auth-brand .brand-text b { color: #fff; font-weight: 700; font-size: 1.15rem; }
.onboard-brand .brand-text b { font-weight: 700; color: #fff; }
.auth-headline { font-family: var(--pm-display); font-weight: 700; letter-spacing: -.035em; font-size: clamp(1.9rem, 3.4vw, 2.6rem); }
.auth-headline em {
  font-family: var(--pm-serif); font-style: italic; font-weight: 400;
  background: none; -webkit-text-fill-color: var(--pm-amber); color: var(--pm-amber);
}
.auth-subtext { color: var(--pm-on-dark); }
.auth-feat { color: rgba(255,255,255,.85); }
.auth-feat-icon { background: rgba(246,180,25,.12); border-radius: 50%; }
.auth-feat-icon svg { color: var(--pm-amber); }
.auth-testimonial { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.1); border-radius: 18px; }
.auth-testi-avatar { background: var(--pm-steel) !important; color: var(--pm-amber); }

.auth-right { background: var(--pm-cream); }
.auth-form-header h1 { font-family: var(--pm-display); font-weight: 700; letter-spacing: -.03em; color: var(--pm-ink); }
.auth-form-header p a, .form-checkbox label a { color: var(--pm-ink); text-decoration: underline; text-underline-offset: 3px; }
.input-wrap input, .onboard-form input, .onboard-form select {
  background: #fff; border: 1px solid var(--pm-sand-line); border-radius: 14px;
}
.input-wrap input:focus, .onboard-form input:focus, .onboard-form select:focus {
  border-color: var(--pm-ink); box-shadow: 0 0 0 3px rgba(246,180,25,.28); background: #fff;
}
.onboard-form .input-prefix span { background: var(--pm-cream); border-width: 1px; border-color: var(--pm-sand-line); border-radius: 14px 0 0 14px; }
.onboard-form .input-prefix input { border-radius: 0 14px 14px 0; }
.divider::before, .divider::after { background: var(--pm-sand-line); }

/* ── Onboarding ── */
.onboarding-page { background: var(--pm-cream); }
.onboard-topbar { background: var(--pm-navy); border-bottom-color: var(--pm-line-dk); color: #fff; }
.onboard-step-indicator { color: var(--pm-on-dark); }
.onboard-card { border-radius: 28px; box-shadow: 0 40px 80px -50px rgba(6,20,29,.5); border: 1px solid var(--pm-sand-line); }
.progress-steps { border-bottom-color: var(--pm-sand-line); }
.step-panel-header h2 { font-family: var(--pm-display); font-weight: 700; letter-spacing: -.02em; }
.step-panel-header .step-icon-big { background: var(--pm-navy); border-radius: 50%; }
.step-panel-header .step-icon-big svg { color: var(--pm-amber); }
.plan-card { border-width: 1px; border-color: var(--pm-sand-line); border-radius: 20px; }
.plan-card.selected { background: var(--pm-cream); }
.plan-price { font-family: var(--pm-display); font-weight: 700; color: var(--pm-ink); }
.plan-badge.popular { background: #fdf3d6; color: var(--pm-amber-ink); }

/* ── GMB audit ── */
.ga-hero, .ga-top .ga-hero { background: var(--pm-navy); }
.ga-glow-1 { background: var(--pm-steel); opacity: .9; }
.ga-glow-2 { background: var(--pm-amber); opacity: .08; }
.ga-hero h1 { font-family: var(--pm-display); font-weight: 700; letter-spacing: -.035em; }
/* "Google" in the headline is the accent word */
.ga-g {
  font-family: var(--pm-serif); font-style: italic; font-weight: 400;
  background: none !important; -webkit-text-fill-color: var(--pm-amber); color: var(--pm-amber);
}
.ga-prog-bar span { background: var(--pm-amber); }
.ga-score-card, .ga-cta { background: var(--pm-navy); }
.ga-verdict, .ga-trial, .ga-emailme { background: var(--pm-cream); border-color: var(--pm-sand-line); }
.ga-tips-list li::before { background: var(--pm-navy); color: var(--pm-amber); }
.ga-logo-icon { background: var(--pm-amber); color: var(--pm-ink); border-radius: 50%; }
.ga-footer { background: var(--pm-navy); color: rgba(255,255,255,.5); }
.ga-form-3 select option { background: var(--pm-navy-2); }

/* ── SEO audit ── */
.sa-header { background: var(--pm-navy); border-bottom-color: var(--pm-line-dk); }
.sa-hero { background: var(--pm-navy); }
.sa-input:focus { border-color: var(--pm-amber); }
.sa-logo-icon { background: var(--pm-amber); color: var(--pm-ink); border-radius: 50%; }
.sa-step.active { color: var(--pm-ink); border-color: var(--pm-ink); background: var(--pm-cream); }
.sa-btn-outline:hover { background: var(--pm-ink); }
.sa-footer { background: var(--pm-navy); }
.sa-footer-cta { color: var(--pm-amber); }
.sa-hero-badge { background: rgba(255,255,255,.05); border-color: var(--pm-line-dk); color: var(--pm-amber); }
.sa-hero-title { font-family: var(--pm-display); font-weight: 700; letter-spacing: -.035em; }
.sa-hero-sub { color: var(--pm-on-dark); }
.sa-input { border-radius: 999px; padding-left: 2.8rem; }

/* ── Reset password (its own inline styles load after this file) ── */
html body:has(.reset-card) { background: var(--pm-cream); }
body .reset-card { border-radius: 28px; border: 1px solid var(--pm-sand-line); box-shadow: 0 40px 80px -50px rgba(6,20,29,.5); }
body .reset-brand { font-family: var(--pm-display); font-weight: 700; color: var(--pm-ink); }
body .reset-card h1 { font-family: var(--pm-display); color: var(--pm-ink); letter-spacing: -.02em; }
body .reset-card .form-input { border: 1px solid var(--pm-sand-line); border-radius: 14px; }
body .reset-card .form-input:focus { border-color: var(--pm-ink); box-shadow: 0 0 0 3px rgba(246,180,25,.28); }
body .reset-card .btn-go { background: var(--pm-amber); color: var(--pm-ink); border-radius: 999px; font-family: var(--pm-display); }

/* ── GMB audit explainer: what it is, what it checks, how it scores, FAQ ── */
.ga-suite-head h2 { font-family: var(--pm-display); font-weight: 700; letter-spacing: -.03em; }
.ga-recent-head h2 { font-family: var(--pm-display); font-weight: 700; letter-spacing: -.02em; font-size: 1.25rem; margin: 0 0 .35rem; }
.ga-learn { background: var(--pm-cream); padding: clamp(3.5rem, 6vw, 5.5rem) 1.25rem; }
.ga-learn-inner { max-width: 960px; margin: 0 auto; }
.ga-learn h2 {
  font-family: var(--pm-display); font-weight: 700; letter-spacing: -.03em; color: var(--pm-ink);
  font-size: clamp(1.6rem, 3vw, 2.2rem); line-height: 1.15; margin: clamp(2.75rem, 5vw, 3.75rem) 0 .75rem; text-wrap: balance;
}
.ga-learn-lead { color: var(--pm-muted); font-size: 1.02rem; line-height: 1.7; margin: 0 0 1.5rem; max-width: 62ch; }
.ga-answer {
  background: var(--pm-navy); color: var(--pm-on-dark); border-radius: 26px; padding: clamp(1.5rem, 3vw, 2.25rem);
  border-left: 5px solid var(--pm-amber);
}
.ga-answer h2 { color: #fff; margin-top: 0; }
.ga-answer p { margin: 0; font-size: 1.08rem; line-height: 1.75; max-width: 66ch; }
.ga-checks { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: .75rem; }
.ga-checks div { background: #fff; border: 1px solid var(--pm-sand-line); border-radius: 18px; padding: 1rem 1.1rem; }
.ga-checks b { display: flex; align-items: center; gap: .5rem; font-family: var(--pm-display); font-weight: 600; color: var(--pm-ink); }
.ga-checks b::before { content: "✓"; color: var(--pm-amber-ink); font-weight: 800; }
.ga-checks span { display: block; margin-top: .35rem; font-size: .88rem; line-height: 1.55; color: var(--pm-muted); }
.ga-versus { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; }
.ga-versus div { background: #fff; border: 1px solid var(--pm-sand-line); border-radius: 20px; padding: 1.2rem 1.3rem; }
.ga-versus div:first-child { border-top: 3px solid var(--pm-amber); }
.ga-versus b { font-family: var(--pm-display); font-weight: 600; color: var(--pm-ink); font-size: 1.05rem; }
.ga-versus p { margin: .45rem 0 0; color: var(--pm-ink-2); line-height: 1.65; font-size: .93rem; }
.ga-versus a { color: var(--pm-ink); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.ga-faq { display: grid; gap: .6rem; }
.ga-faq-item { background: #fff; border: 1px solid var(--pm-sand-line); border-radius: 16px; overflow: hidden; }
.ga-faq-item summary {
  cursor: pointer; list-style: none; padding: 1rem 1.2rem; font-family: var(--pm-display); font-weight: 600; color: var(--pm-ink);
  display: flex; justify-content: space-between; gap: 1rem; align-items: center;
}
.ga-faq-item summary::-webkit-details-marker { display: none; }
.ga-faq-item summary::after { content: "+"; font-size: 1.3rem; font-weight: 400; color: var(--pm-amber-ink); flex-shrink: 0; transition: transform .25s ease; }
.ga-faq-item[open] summary::after { transform: rotate(45deg); }
.ga-faq-item[open] { border-color: var(--pm-ink); }
.ga-faq-item summary:focus-visible { outline: 2px solid var(--pm-amber); outline-offset: -2px; }
.ga-faq-item p { margin: 0; padding: 0 1.2rem 1.1rem; color: var(--pm-ink-2); line-height: 1.7; font-size: .94rem; }
.ga-learn-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: 2.5rem; }
.ga-learn-cta span { color: var(--pm-muted); font-size: .9rem; }
@media (max-width: 640px) { .ga-versus { grid-template-columns: 1fr; } }

/* the explainer is split around "What you get when you connect": the
   second half picks up where the suite leaves off, without a double gap */
.ga-learn-2 { padding-top: 0; }
.ga-learn-2 .ga-learn-inner > h2:first-child { margin-top: clamp(2.5rem, 4vw, 3.25rem); }

/* ── "What you get when you connect": a full-width navy band ──
   Breaks out of the 1100px landing wrapper to run edge to edge, with the
   heading in a column that stays in view beside six feature cards. */
.ga-landing .ga-suite {
  margin: 0 calc(50% - 50vw); padding: clamp(3.5rem, 6vw, 5.5rem) 1.25rem;
  background: var(--pm-navy); border: 0; border-radius: 0; box-shadow: none; color: var(--pm-on-dark);
  position: relative; overflow: hidden;
}
.ga-landing .ga-suite::before {
  content: ""; position: absolute; width: 640px; height: 640px; right: -220px; top: -260px; border-radius: 50%;
  background: rgba(20,63,88,.85); filter: blur(120px); pointer-events: none;
}
.ga-suite-wrap {
  position: relative; max-width: 1240px; margin: 0 auto;
  display: grid; grid-template-columns: minmax(260px, .8fr) minmax(0, 2fr); gap: clamp(2rem, 4vw, 3.5rem); align-items: start;
}
.ga-suite-intro { position: sticky; top: calc(var(--nav-offset, 70px) + 1.5rem); }
.ga-suite-eyebrow {
  display: inline-flex; align-items: center; gap: .5rem; font-size: .72rem; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: rgba(255,255,255,.6);
}
.ga-suite-eyebrow::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--pm-amber); box-shadow: 0 0 0 4px rgba(246,180,25,.18); }
.ga-suite-intro h2 {
  margin: .9rem 0 .9rem; font-family: var(--pm-display); font-weight: 700; color: #fff;
  font-size: clamp(1.8rem, 3vw, 2.5rem); line-height: 1.1; letter-spacing: -.035em; text-wrap: balance;
}
.ga-suite-intro > p { margin: 0 0 1.5rem; font-size: 1rem; line-height: 1.7; color: var(--pm-on-dark); }
.ga-landing .ga-suite .ga-suite-note {
  text-align: left; margin: 1.75rem 0 0; padding: 1.1rem 0 0; max-width: none;
  border-top: 1px solid var(--pm-line-dk); font-size: .84rem; color: rgba(255,255,255,.55);
}

.ga-landing .ga-suite-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.ga-landing .ga-suite-group {
  background: rgba(255,255,255,.04); border: 1px solid var(--pm-line-dk); border-radius: 22px; padding: 1.4rem 1.4rem 1.5rem;
  transition: border-color .3s ease, background .3s ease, transform .3s ease;
}
.ga-landing .ga-suite-group:hover { border-color: rgba(246,180,25,.45); background: rgba(246,180,25,.05); transform: translateY(-3px); }
.ga-landing .ga-suite-group h3 {
  display: flex; align-items: center; gap: .75rem; margin: 0 0 1rem;
  font-family: var(--pm-display); font-weight: 600; font-size: 1.08rem; color: #fff; letter-spacing: -.01em; line-height: 1.25;
}
.ga-landing .ga-suite-group h3 svg {
  width: 40px; height: 40px; flex-shrink: 0; padding: 10px; border-radius: 50%;
  background: var(--pm-amber); color: var(--pm-ink); stroke-width: 2.2;
}
.ga-landing .ga-suite-group ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .55rem; }
.ga-landing .ga-suite-group li { position: relative; padding-left: 1.3rem; font-size: .88rem; line-height: 1.55; color: rgba(255,255,255,.78); }
.ga-landing .ga-suite-group li::before {
  content: "✓"; position: absolute; left: 0; top: 0; width: auto; height: auto; border-radius: 0;
  background: none; opacity: 1; color: var(--pm-amber); font-weight: 800; font-size: .85rem;
}
.ga-landing .ga-suite-group em.soon { color: var(--pm-amber); font-style: normal; font-weight: 600; font-size: .82em; }
@media (prefers-reduced-motion: reduce) { .ga-landing .ga-suite-group:hover { transform: none; } }
@media (max-width: 900px) {
  .ga-suite-wrap { grid-template-columns: 1fr; }
  .ga-suite-intro { position: static; }
}
@media (max-width: 600px) { .ga-landing .ga-suite-grid { grid-template-columns: 1fr; } }