/*
 * GotAScam — responsive overrides
 * Applied via html[data-device="desktop|mobile"] set by responsive.js
 *
 * Specificity: html[data-device="..."] .class = (1,0,1) which beats
 * plain .class rules AND overrides !important inside @media queries
 * when our own !important is present.
 */

/* ─────────────────────────────────────────────────────────────────
   DESKTOP — larger, more readable typography
   ───────────────────────────────────────────────────────────────── */

/* Force desktop nav layout even if viewport is narrow (dev tools, etc.) */
html[data-device="desktop"] .nav-center,
html[data-device="desktop"] .nav-links {
  display: flex !important;
}
html[data-device="desktop"] .nav-right {
  display: flex !important;
}
html[data-device="desktop"] .nav-hamburger {
  display: none !important;
}
html[data-device="desktop"] .mobile-menu {
  display: none !important;
}
html[data-device="desktop"] .desktop-only {
  display: block !important;
}

/* Nav links — was 11-14px, now a consistent 14px */
html[data-device="desktop"] .nav-links a,
html[data-device="desktop"] .nav-center a {
  font-size: 13px !important;
  letter-spacing: 1.4px !important;
}

/* Hero subtext */
html[data-device="desktop"] .hero-sub,
html[data-device="desktop"] .page-sub,
html[data-device="desktop"] .hs-text {
  font-size: 17px !important;
  line-height: 1.85 !important;
}

/* Step and section body copy — was 14px */
html[data-device="desktop"] .step-desc,
html[data-device="desktop"] .method-desc,
html[data-device="desktop"] .check-desc,
html[data-device="desktop"] .verdict-desc {
  font-size: 15px !important;
  line-height: 1.85 !important;
}

/* Pipeline stage descriptions — was 12px */
html[data-device="desktop"] .ps-desc {
  font-size: 14px !important;
  line-height: 1.8 !important;
}

/* Stat descriptions — was 13px */
html[data-device="desktop"] .stat-desc {
  font-size: 14px !important;
}

/* Feature list items — was 13.5px */
html[data-device="desktop"] .feature-list li {
  font-size: 15px !important;
  padding: 10px 0 !important;
}

/* Email note */
html[data-device="desktop"] .email-note {
  font-size: 13px !important;
}

/* Monospace micro-labels — was 9px, now 11px */
html[data-device="desktop"] .ps-label,
html[data-device="desktop"] .tier-eyebrow,
html[data-device="desktop"] .eyebrow-num,
html[data-device="desktop"] .step-tag,
html[data-device="desktop"] .ps-tag,
html[data-device="desktop"] .method-label,
html[data-device="desktop"] .check-label,
html[data-device="desktop"] .hs-stat-label {
  font-size: 11px !important;
  letter-spacing: 1.5px !important;
}

/* Tier notes and helper text — was 10px */
html[data-device="desktop"] .tier-note,
html[data-device="desktop"] .submit-hint,
html[data-device="desktop"] .footer-right,
html[data-device="desktop"] .footer-links a {
  font-size: 11px !important;
}

/* Tab buttons — was 10px */
html[data-device="desktop"] .tab {
  font-size: 11px !important;
  padding: 13px 22px !important;
}

/* Primary buttons — slightly larger on desktop */
html[data-device="desktop"] .btn {
  font-size: 12px !important;
  padding: 10px 24px !important;
}
html[data-device="desktop"] .btn-full {
  font-size: 13px !important;
  padding: 15px !important;
}

/* Textarea — slightly larger */
html[data-device="desktop"] textarea {
  font-size: 15px !important;
  height: 200px !important;
}

/* Results page — ai explanation and signal text */
html[data-device="desktop"] .ai-text,
html[data-device="desktop"] .signal-desc,
html[data-device="desktop"] .sig-title {
  font-size: 15px !important;
}
html[data-device="desktop"] .sig-label,
html[data-device="desktop"] .signal-label {
  font-size: 11px !important;
}

/* Pricing page */
html[data-device="desktop"] .price-period {
  font-size: 13px !important;
}


/* ─────────────────────────────────────────────────────────────────
   MOBILE — lock layout to mobile view regardless of viewport width
   ───────────────────────────────────────────────────────────────── */

html[data-device="mobile"] .nav-center,
html[data-device="mobile"] .nav-links,
html[data-device="mobile"] .nav-right,
html[data-device="mobile"] .desktop-only {
  display: none !important;
}
html[data-device="mobile"] .nav-hamburger {
  display: flex !important;
}