:root {
  --bg: #080b14;
  --bg-soft: #0d1120;
  --surface: rgba(18, 24, 43, 0.78);
  --surface-strong: #12182b;
  --surface-light: #171f36;
  --text: #f7f8fc;
  --muted: #9ba6bc;
  --muted-2: #6f7b94;
  --line: rgba(255, 255, 255, 0.09);
  --primary: #8b5cf6;
  --primary-2: #5eead4;
  --primary-3: #60a5fa;
  --success: #4ade80;
  --warning: #fbbf24;
  --radius: 22px;
  --radius-small: 14px;
  --shadow: 0 30px 80px rgba(0, 0, 0, 0.35);
  --container: 1180px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-width: 320px;
  color: var(--text);
  background:
    radial-gradient(circle at 20% 0%, rgba(139, 92, 246, 0.13), transparent 32%),
    radial-gradient(circle at 85% 8%, rgba(94, 234, 212, 0.08), transparent 26%),
    var(--bg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
  overflow-x: hidden;
}

button,
input {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
}

button {
  color: inherit;
}

.container {
  width: min(calc(100% - 36px), var(--container));
  margin-inline: auto;
}

.section {
  position: relative;
  padding: 104px 0;
}

.section-tight {
  padding-top: 32px;
}

.page-glow {
  position: fixed;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  filter: blur(130px);
  opacity: 0.12;
  pointer-events: none;
  z-index: -1;
}

.glow-one {
  top: 6%;
  left: -180px;
  background: var(--primary);
}

.glow-two {
  right: -190px;
  top: 44%;
  background: var(--primary-2);
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  border-bottom: 1px solid transparent;
  background: rgba(8, 11, 20, 0.72);
  backdrop-filter: blur(20px);
  transition: border-color 0.25s ease, background 0.25s ease;
}

.site-header.scrolled {
  border-color: var(--line);
  background: rgba(8, 11, 20, 0.9);
}

.nav-wrap {
  min-height: 76px;
  display: flex;
  align-items: center;
  gap: 28px;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  font-size: 18px;
  font-weight: 750;
  letter-spacing: -0.03em;
  white-space: nowrap;
}

.brand strong {
  color: var(--primary-2);
}

.main-nav {
  display: flex;
  align-items: center;
  gap: 26px;
  margin-left: auto;
}

.main-nav a {
  color: var(--muted);
  font-size: 14px;
  font-weight: 600;
  transition: color 0.2s ease;
}

.main-nav a:hover {
  color: var(--text);
}

.desktop-cta {
  margin-left: 10px;
}

.menu-button {
  display: none;
  margin-left: auto;
  width: 42px;
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
}

.menu-button span {
  width: 18px;
  height: 2px;
  border-radius: 2px;
  background: var(--text);
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: 0 22px;
  border: 1px solid transparent;
  border-radius: 13px;
  font-weight: 750;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.button:hover {
  transform: translateY(-2px);
}

.button-small {
  min-height: 42px;
  padding-inline: 17px;
  font-size: 14px;
}

.button-primary {
  background: linear-gradient(135deg, var(--primary), #6d5dfc);
  color: white;
  box-shadow: 0 14px 32px rgba(124, 92, 246, 0.28);
}

.button-primary:hover {
  box-shadow: 0 18px 42px rgba(124, 92, 246, 0.4);
}

.button-outline {
  border-color: var(--line);
  background: rgba(255, 255, 255, 0.035);
}

.button-outline:hover {
  border-color: rgba(139, 92, 246, 0.55);
  background: rgba(139, 92, 246, 0.08);
}

.button-ghost {
  color: var(--muted);
  background: transparent;
  border-color: var(--line);
}

.hero {
  min-height: 780px;
  display: flex;
  align-items: center;
  padding-top: 90px;
}

.hero-grid {
  display: grid;
  grid-template-columns: 1.02fr 0.98fr;
  align-items: center;
  gap: 72px;
}

.eyebrow,
.kicker {
  color: var(--primary-2);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.14em;
}

.eyebrow {
  width: fit-content;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 12px;
  border: 1px solid rgba(94, 234, 212, 0.18);
  border-radius: 999px;
  background: rgba(94, 234, 212, 0.06);
}

.pulse-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--primary-2);
  box-shadow: 0 0 0 0 rgba(94, 234, 212, 0.55);
  animation: pulse 2s infinite;
}

@keyframes pulse {
  70% { box-shadow: 0 0 0 9px rgba(94, 234, 212, 0); }
  100% { box-shadow: 0 0 0 0 rgba(94, 234, 212, 0); }
}

.hero h1 {
  max-width: 720px;
  margin: 25px 0 22px;
  font-size: clamp(48px, 6vw, 80px);
  line-height: 0.98;
  letter-spacing: -0.065em;
}

.hero-lead {
  max-width: 640px;
  margin: 0;
  color: var(--muted);
  font-size: 19px;
  line-height: 1.75;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 34px;
}

.trust-row {
  display: flex;
  gap: 34px;
  margin-top: 44px;
}

.trust-row div {
  display: grid;
  gap: 2px;
}

.trust-row strong {
  font-size: 20px;
}

.trust-row span {
  color: var(--muted-2);
  font-size: 12px;
}

.dashboard-window {
  position: relative;
  padding: 18px;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 25px;
  background: linear-gradient(160deg, rgba(21, 28, 49, 0.94), rgba(10, 14, 27, 0.93));
  box-shadow: var(--shadow);
  transform: perspective(1200px) rotateY(-3deg) rotateX(1deg);
}

.dashboard-window::before {
  content: "";
  position: absolute;
  inset: -1px;
  z-index: -1;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(139,92,246,0.6), transparent 35%, rgba(94,234,212,0.25));
  opacity: 0.45;
}

.window-top {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 2px 3px 16px;
}

.window-dots {
  display: flex;
  gap: 5px;
}

.window-dots span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(255,255,255,0.18);
}

.window-title {
  color: var(--muted-2);
  font-size: 11px;
  font-weight: 700;
}

.live-badge {
  margin-left: auto;
  padding: 4px 7px;
  border-radius: 6px;
  color: var(--success);
  background: rgba(74,222,128,0.08);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.1em;
}

.signal-card,
.mini-card {
  border: 1px solid var(--line);
  background: rgba(255,255,255,0.032);
}

.signal-card {
  padding: 24px;
  border-radius: 18px;
}

.signal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.signal-header h3 {
  margin: 5px 0 0;
  font-size: 20px;
}

.mini-label {
  color: var(--muted-2);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.score-ring {
  width: 82px;
  height: 82px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  align-content: center;
  border-radius: 50%;
  background:
    radial-gradient(circle at center, var(--surface-strong) 57%, transparent 58%),
    conic-gradient(var(--primary-2) 91%, rgba(255,255,255,0.08) 0);
  box-shadow: inset 0 0 25px rgba(94,234,212,0.08);
}

.score-ring span {
  font-size: 20px;
  font-weight: 850;
  line-height: 1;
}

.score-ring small {
  margin-top: 4px;
  color: var(--muted-2);
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.signal-bars {
  display: grid;
  gap: 14px;
  margin-top: 27px;
}

.signal-line {
  display: grid;
  grid-template-columns: 82px 1fr 25px;
  align-items: center;
  gap: 12px;
  font-size: 11px;
}

.signal-line span {
  color: var(--muted);
}

.signal-line b {
  text-align: right;
}

.bar {
  height: 5px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,0.07);
}

.bar i {
  display: block;
  width: var(--value);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--primary), var(--primary-2));
  transform-origin: left;
  animation: growBar 1.1s ease both;
}

@keyframes growBar {
  from { transform: scaleX(0); }
}

.mini-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-top: 10px;
}

.mini-card {
  display: grid;
  gap: 6px;
  min-height: 106px;
  padding: 15px;
  border-radius: 14px;
}

.mini-card strong {
  font-size: 12px;
}

.mini-card small {
  color: var(--muted-2);
  font-size: 9px;
}

.trend-up {
  color: var(--success);
  font-size: 10px;
  font-weight: 850;
}

.section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 42px;
  margin-bottom: 36px;
}

.section-heading h2 {
  margin: 7px 0 0;
  font-size: clamp(32px, 4.5vw, 52px);
  line-height: 1.08;
  letter-spacing: -0.045em;
}

.section-heading > p,
.updated-label {
  max-width: 480px;
  color: var(--muted);
  font-size: 14px;
}

.updated-label {
  padding: 7px 11px;
  border: 1px solid var(--line);
  border-radius: 999px;
  white-space: nowrap;
}

.opportunity-card {
  display: grid;
  grid-template-columns: 1.25fr 0.75fr;
  gap: 34px;
  padding: 32px;
  border: 1px solid rgba(139,92,246,0.22);
  border-radius: var(--radius);
  background:
    linear-gradient(135deg, rgba(139,92,246,0.09), transparent 38%),
    var(--surface);
  box-shadow: 0 18px 70px rgba(0,0,0,0.18);
}

.opportunity-main {
  display: flex;
  gap: 20px;
}

.opportunity-icon {
  width: 52px;
  height: 52px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 15px;
  color: var(--primary-2);
  background: rgba(94,234,212,0.08);
  border: 1px solid rgba(94,234,212,0.15);
}

.opportunity-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

.opportunity-title-row h3 {
  margin: 0;
  font-size: 23px;
  letter-spacing: -0.03em;
}

.opportunity-main p {
  max-width: 700px;
  margin: 12px 0 0;
  color: var(--muted);
}

.status-chip,
.tool-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 850;
}

.status-chip {
  color: var(--success);
  background: rgba(74,222,128,0.09);
  border: 1px solid rgba(74,222,128,0.15);
}

.idea-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 20px;
}

.idea-tags span {
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: var(--muted);
  background: rgba(255,255,255,0.025);
  font-size: 11px;
}

.opportunity-metrics {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}

.opportunity-metrics div {
  display: grid;
  align-content: center;
  gap: 5px;
  min-height: 92px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255,255,255,0.025);
}

.opportunity-metrics span {
  color: var(--muted-2);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.opportunity-metrics strong {
  font-size: 15px;
}

.filter-bar {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 28px;
}

.search-box {
  min-width: 280px;
  flex: 1;
  display: flex;
  align-items: center;
  gap: 9px;
  height: 48px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: rgba(255,255,255,0.035);
}

.search-box span {
  color: var(--muted-2);
  font-size: 23px;
  transform: rotate(-20deg);
}

.search-box input {
  width: 100%;
  border: 0;
  outline: 0;
  color: var(--text);
  background: transparent;
}

.search-box input::placeholder {
  color: var(--muted-2);
}

.filter-buttons {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  scrollbar-width: none;
}

.filter-buttons::-webkit-scrollbar {
  display: none;
}

.filter-button {
  min-height: 40px;
  padding: 0 13px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--muted);
  background: rgba(255,255,255,0.025);
  cursor: pointer;
  white-space: nowrap;
}

.filter-button.active,
.filter-button:hover {
  color: white;
  border-color: rgba(139,92,246,0.45);
  background: rgba(139,92,246,0.12);
}

.tools-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.tool-card {
  position: relative;
  overflow: hidden;
  min-height: 300px;
  padding: 21px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--surface);
  transition: transform 0.25s ease, border-color 0.25s ease, background 0.25s ease;
}

.tool-card:hover {
  transform: translateY(-6px);
  border-color: rgba(139,92,246,0.36);
  background: rgba(21, 28, 49, 0.9);
}

.tool-top {
  display: flex;
  align-items: center;
  gap: 12px;
}

.tool-logo {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  color: white;
  background: linear-gradient(135deg, var(--tool-a), var(--tool-b));
  font-weight: 900;
  letter-spacing: -0.04em;
}

.tool-name {
  display: grid;
  gap: 2px;
}

.tool-name strong {
  font-size: 16px;
}

.tool-name small {
  color: var(--muted-2);
  font-size: 11px;
}

.tool-badge {
  margin-left: auto;
  color: var(--primary-2);
  border: 1px solid rgba(94,234,212,0.15);
  background: rgba(94,234,212,0.07);
}

.tool-description {
  min-height: 70px;
  margin: 20px 0 18px;
  color: var(--muted);
  font-size: 13px;
}

.tool-score-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.tool-score-row span {
  color: var(--muted-2);
  font-size: 11px;
}

.tool-score {
  font-size: 22px;
  font-weight: 850;
  letter-spacing: -0.04em;
}

.tool-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 17px;
}

.tool-footer span {
  color: var(--muted-2);
  font-size: 10px;
}

.tool-action {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: rgba(255,255,255,0.03);
  cursor: pointer;
}

.tool-action:hover {
  border-color: rgba(139,92,246,0.45);
}

.empty-state {
  padding: 60px 20px;
  border: 1px dashed var(--line);
  border-radius: var(--radius);
  text-align: center;
  color: var(--muted);
}

.hidden {
  display: none !important;
}

.centre-action {
  display: flex;
  justify-content: center;
  margin-top: 28px;
}

.categories-section {
  background: rgba(255,255,255,0.018);
  border-block: 1px solid rgba(255,255,255,0.045);
}

.category-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.category-card {
  min-height: 190px;
  padding: 22px;
  display: grid;
  text-align: left;
  border: 1px solid var(--line);
  border-radius: 17px;
  color: var(--text);
  background: var(--surface);
  cursor: pointer;
  transition: transform 0.2s ease, border-color 0.2s ease;
}

.category-card:hover {
  transform: translateY(-4px);
  border-color: rgba(94,234,212,0.3);
}

.category-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: var(--primary-2);
  background: rgba(94,234,212,0.07);
  font-weight: 900;
}

.category-card strong {
  margin-top: 20px;
  font-size: 17px;
}

.category-card small {
  color: var(--muted);
}

.category-card i {
  margin-top: 15px;
  color: var(--primary-2);
  font-size: 11px;
  font-style: normal;
  font-weight: 750;
}

.method-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.method-card {
  min-height: 230px;
  padding: 26px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(160deg, rgba(255,255,255,0.038), rgba(255,255,255,0.018));
}

.method-card > span {
  color: var(--primary-2);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.12em;
}

.method-card h3 {
  margin: 55px 0 10px;
  font-size: 24px;
}

.method-card p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}

.newsletter-section {
  padding-top: 46px;
}

.newsletter-card {
  display: grid;
  grid-template-columns: 1fr 0.82fr;
  align-items: center;
  gap: 60px;
  padding: 48px;
  border: 1px solid rgba(139,92,246,0.22);
  border-radius: 26px;
  background:
    radial-gradient(circle at 85% 20%, rgba(94,234,212,0.12), transparent 28%),
    linear-gradient(135deg, rgba(139,92,246,0.12), rgba(255,255,255,0.025));
  box-shadow: var(--shadow);
}

.newsletter-card h2 {
  margin: 8px 0 12px;
  font-size: clamp(32px, 4vw, 50px);
  line-height: 1.08;
  letter-spacing: -0.045em;
}

.newsletter-card p {
  max-width: 600px;
  margin: 0;
  color: var(--muted);
}

.newsletter-form {
  display: grid;
  gap: 10px;
}

.newsletter-form input {
  min-height: 54px;
  width: 100%;
  padding: 0 16px;
  border: 1px solid var(--line);
  border-radius: 13px;
  outline: 0;
  color: var(--text);
  background: rgba(8,11,20,0.65);
}

.newsletter-form input:focus {
  border-color: rgba(139,92,246,0.6);
  box-shadow: 0 0 0 4px rgba(139,92,246,0.08);
}

.newsletter-form small {
  color: var(--muted-2);
  font-size: 10px;
  line-height: 1.5;
}

.disclosure {
  padding: 22px 0;
  border-top: 1px solid var(--line);
  color: var(--muted-2);
  background: rgba(255,255,255,0.018);
  font-size: 11px;
}

.disclosure p {
  margin: 0;
}

.site-footer {
  padding: 65px 0 24px;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1fr 0.8fr;
  gap: 60px;
}

.footer-brand p {
  max-width: 440px;
  color: var(--muted);
  font-size: 13px;
}

.footer-links {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 35px;
}

.footer-links div {
  display: grid;
  align-content: start;
  gap: 10px;
}

.footer-links strong {
  margin-bottom: 4px;
  font-size: 12px;
}

.footer-links a {
  color: var(--muted);
  font-size: 12px;
}

.footer-links a:hover {
  color: var(--text);
}

.footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 48px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
  color: var(--muted-2);
  font-size: 10px;
}

.toast {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 100;
  max-width: min(380px, calc(100% - 40px));
  padding: 13px 16px;
  border: 1px solid rgba(94,234,212,0.2);
  border-radius: 12px;
  color: var(--text);
  background: rgba(18,24,43,0.96);
  box-shadow: var(--shadow);
  transform: translateY(20px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease, transform 0.25s ease;
  font-size: 13px;
}

.toast.show {
  opacity: 1;
  transform: translateY(0);
}

.reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.legal-page {
  min-height: 72vh;
  padding: 80px 0 110px;
}

.legal-shell {
  max-width: 820px;
}

.legal-shell h1 {
  margin: 0 0 16px;
  font-size: clamp(42px, 6vw, 68px);
  letter-spacing: -0.055em;
}

.legal-shell h2 {
  margin-top: 40px;
  font-size: 22px;
}

.legal-shell p,
.legal-shell li {
  color: var(--muted);
}

.legal-shell a {
  color: var(--primary-2);
}

@media (max-width: 980px) {
  .desktop-cta {
    display: none;
  }

  .hero {
    min-height: auto;
  }

  .hero-grid,
  .opportunity-card,
  .newsletter-card {
    grid-template-columns: 1fr;
  }

  .hero-grid {
    gap: 54px;
  }

  .dashboard-window {
    max-width: 650px;
    transform: none;
  }

  .tools-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .filter-bar {
    align-items: stretch;
    flex-direction: column;
  }

  .opportunity-metrics {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (max-width: 760px) {
  .section {
    padding: 78px 0;
  }

  .site-header {
    position: sticky;
  }

  .menu-button {
    display: flex;
  }

  .main-nav {
    position: absolute;
    top: 68px;
    left: 18px;
    right: 18px;
    display: none;
    margin: 0;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: rgba(13,17,32,0.98);
    box-shadow: var(--shadow);
  }

  .main-nav.open {
    display: grid;
  }

  .main-nav a {
    padding: 11px 9px;
  }

  .hero {
    padding-top: 56px;
  }

  .hero h1 {
    font-size: clamp(44px, 14vw, 64px);
  }

  .hero-lead {
    font-size: 16px;
  }

  .trust-row {
    gap: 22px;
  }

  .section-heading {
    align-items: start;
    flex-direction: column;
    gap: 14px;
  }

  .updated-label {
    white-space: normal;
  }

  .opportunity-main {
    flex-direction: column;
  }

  .opportunity-metrics {
    grid-template-columns: repeat(2, 1fr);
  }

  .tools-grid,
  .category-grid,
  .method-grid {
    grid-template-columns: 1fr;
  }

  .newsletter-card {
    padding: 30px 22px;
    gap: 34px;
  }

  .footer-grid {
    grid-template-columns: 1fr;
  }

  .footer-bottom {
    align-items: start;
    flex-direction: column;
  }
}

@media (max-width: 480px) {
  .container {
    width: min(calc(100% - 24px), var(--container));
  }

  .nav-wrap {
    min-height: 68px;
  }

  .brand {
    font-size: 16px;
  }

  .hero-actions {
    display: grid;
  }

  .hero-actions .button {
    width: 100%;
  }

  .trust-row {
    justify-content: space-between;
    gap: 8px;
  }

  .trust-row strong {
    font-size: 17px;
  }

  .dashboard-window {
    padding: 12px;
  }

  .signal-card {
    padding: 18px;
  }

  .signal-header {
    align-items: start;
  }

  .score-ring {
    width: 68px;
    height: 68px;
  }

  .mini-grid {
    grid-template-columns: 1fr;
  }

  .mini-card {
    min-height: 80px;
  }

  .opportunity-card {
    padding: 22px;
  }

  .opportunity-metrics {
    grid-template-columns: 1fr;
  }

  .opportunity-metrics div {
    min-height: 76px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }
}

/* TrendPilot AI v0.2 */
.compact-hero{min-height:720px}.real-tools-grid .tool-card{min-height:360px}
.programme-preview{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin:4px 0 18px}.programme-preview div{display:grid;gap:4px;padding:11px;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.024)}.programme-preview span,.programme-facts span{color:var(--muted-2);font-size:9px;text-transform:uppercase;letter-spacing:.08em}.programme-preview strong{font-size:12px}.tool-action{display:inline-flex;align-items:center;justify-content:center;color:var(--text);font-size:11px}
.subpage-hero{padding-top:120px;padding-bottom:66px}.narrow-heading{max-width:900px}.narrow-heading h1,.tool-page-hero h1{margin:10px 0 18px;font-size:clamp(46px,7vw,78px);line-height:1;letter-spacing:-.06em}.narrow-heading p,.tool-page-lead{max-width:760px;color:var(--muted);font-size:18px}
.accuracy-note{margin-bottom:28px;padding:16px 18px;border:1px solid rgba(251,191,36,.22);border-radius:14px;color:var(--muted);background:rgba(251,191,36,.055);font-size:13px}.accuracy-note strong{color:var(--warning)}
.programme-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.programme-card{padding:23px;border:1px solid var(--line);border-radius:19px;background:var(--surface)}.programme-card-head{display:flex;align-items:center;gap:12px}.programme-card-head h3{margin:0;font-size:20px}.programme-card-head p{margin:2px 0 0;color:var(--muted-2);font-size:11px}.programme-card-head .tool-badge{margin-left:auto}.programme-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:20px 0}.programme-facts div{display:grid;gap:5px;padding:12px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.025)}.programme-facts strong{font-size:12px;line-height:1.35}.programme-card>p{min-height:45px;color:var(--muted);font-size:12px}.programme-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}
.tool-page-hero{padding-top:108px;padding-bottom:70px}.tool-page-grid{display:grid;grid-template-columns:1fr .52fr;gap:70px;align-items:center}.back-link{display:inline-block;margin-bottom:28px;color:var(--muted);font-size:12px}.tool-title-line{display:flex;align-items:center;gap:20px}.large-logo{width:74px;height:74px;border-radius:20px;font-size:22px}.tool-title-line h1{margin:5px 0 0}.link-status{max-width:590px;color:var(--muted-2);font-size:10px}
.affiliate-summary{display:grid;gap:10px;padding:24px;border:1px solid rgba(139,92,246,.24);border-radius:20px;background:linear-gradient(145deg,rgba(139,92,246,.10),rgba(255,255,255,.025))}.affiliate-summary>div{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:13px 0;border-bottom:1px solid var(--line)}.affiliate-summary>div:last-child{border-bottom:0}.affiliate-summary span{color:var(--muted);font-size:11px}.affiliate-summary strong{text-align:right;font-size:13px}
.detail-layout{display:grid;grid-template-columns:1fr 320px;gap:28px;align-items:start}.detail-main{display:grid;gap:16px}.content-panel,.sidebar-card{padding:28px;border:1px solid var(--line);border-radius:18px;background:var(--surface)}.content-panel h2{margin:7px 0 13px;font-size:28px;line-height:1.15;letter-spacing:-.035em}.content-panel p,.sidebar-card p,.sidebar-card li{color:var(--muted);font-size:13px}.feature-list{display:grid;gap:11px;padding-left:20px;color:var(--muted)}.content-angle-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.content-angle-grid article{min-height:125px;padding:16px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.025)}.content-angle-grid span{display:block;margin-bottom:20px;color:var(--muted-2);font-size:9px;text-transform:uppercase;letter-spacing:.08em}.content-angle-grid strong{font-size:13px}.detail-sidebar{position:sticky;top:96px;display:grid;gap:14px}.sidebar-card h3{margin-top:0}.sidebar-card ol{padding-left:19px}.sidebar-card code{padding:2px 5px;border:1px solid var(--line);border-radius:5px;color:var(--primary-2);background:rgba(255,255,255,.04);font-size:11px}.source-panel{border-color:rgba(94,234,212,.2)}
@media(max-width:900px){.programme-grid,.tool-page-grid,.detail-layout{grid-template-columns:1fr}.detail-sidebar{position:static}}@media(max-width:640px){.programme-grid{grid-template-columns:1fr}.programme-facts{grid-template-columns:1fr}.content-angle-grid{grid-template-columns:1fr}.tool-title-line{align-items:flex-start}.large-logo{width:60px;height:60px}}


/* TrendPilot AI v0.3 — trend-first interface */
.trend-hero { min-height: 720px; }
.trend-hero h1 { max-width: 760px; font-size: clamp(46px, 6vw, 76px); }
.radar-console { position: relative; padding: 18px; border: 1px solid rgba(255,255,255,.12); border-radius: 25px; background: linear-gradient(160deg, rgba(21,28,49,.96), rgba(10,14,27,.96)); box-shadow: var(--shadow); }
.radar-orbit { position: relative; width: min(100%, 410px); aspect-ratio: 1; margin: 18px auto; overflow: hidden; border-radius: 50%; background: radial-gradient(circle, rgba(94,234,212,.08), rgba(139,92,246,.03) 55%, rgba(255,255,255,.01)); border: 1px solid rgba(94,234,212,.18); }
.radar-ring { position: absolute; inset: 50%; border: 1px solid rgba(94,234,212,.12); border-radius: 50%; transform: translate(-50%,-50%); }
.ring-1 { width: 34%; height: 34%; }.ring-2 { width: 64%; height: 64%; }.ring-3 { width: 92%; height: 92%; }
.radar-orbit::before,.radar-orbit::after { content:""; position:absolute; background:rgba(94,234,212,.10); }.radar-orbit::before { width:1px; height:100%; left:50%; }.radar-orbit::after { height:1px; width:100%; top:50%; }
.radar-sweep { position:absolute; inset:0; border-radius:50%; background:conic-gradient(from 0deg, transparent 0 78%, rgba(94,234,212,.18) 92%, transparent 100%); animation:radarSpin 5s linear infinite; }
@keyframes radarSpin { to { transform:rotate(360deg); } }
.radar-centre { position:absolute; left:50%; top:50%; width:56px; height:56px; display:grid; place-items:center; transform:translate(-50%,-50%); border-radius:50%; background:#11182b; border:1px solid rgba(94,234,212,.32); color:var(--primary-2); font-weight:900; box-shadow:0 0 35px rgba(94,234,212,.16); }
.radar-point { position:absolute; width:10px; height:10px; border-radius:50%; background:var(--primary-2); box-shadow:0 0 0 7px rgba(94,234,212,.08),0 0 18px rgba(94,234,212,.7); }.p1{left:67%;top:23%}.p2{left:28%;top:39%}.p3{left:70%;top:66%}.p4{left:39%;top:75%}
.radar-readout { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }.radar-readout div { display:grid; gap:4px; padding:12px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.025); }.radar-readout span { color:var(--muted-2); font-size:9px; text-transform:uppercase; letter-spacing:.08em; }.radar-readout strong { font-size:12px; }
.opportunity-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.trend-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.full-trend-grid { grid-template-columns:repeat(3,1fr); }
.trend-card { min-height:390px; display:flex; flex-direction:column; padding:22px; border:1px solid var(--line); border-radius:19px; background:var(--surface); transition:transform .22s ease,border-color .22s ease; }.trend-card:hover { transform:translateY(-5px); border-color:rgba(94,234,212,.28); }
.trend-card-top { display:flex; align-items:center; gap:9px; }.trend-symbol { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; color:var(--primary-2); background:rgba(94,234,212,.07); border:1px solid rgba(94,234,212,.14); font-weight:900; }.trend-score { margin-left:auto; font-size:28px; font-weight:900; letter-spacing:-.05em; }
.trend-stage { padding:5px 8px; border-radius:999px; font-size:9px; font-weight:850; }.trend-stage.early { color:#5eead4; background:rgba(94,234,212,.08); }.trend-stage.rising { color:#93c5fd; background:rgba(96,165,250,.09); }.trend-stage.hot { color:#fbbf24; background:rgba(251,191,36,.09); }.trend-stage.emerging { color:#c4b5fd; background:rgba(139,92,246,.10); }
.trend-card .mini-label { margin-top:22px; }.trend-card h3 { margin:5px 0 10px; font-size:22px; line-height:1.15; letter-spacing:-.035em; }.trend-card > p { color:var(--muted); font-size:13px; }
.trend-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-top:auto; padding-top:18px; }.trend-metrics div { display:grid; gap:3px; padding:10px; border:1px solid var(--line); border-radius:10px; background:rgba(255,255,255,.022); }.trend-metrics span { color:var(--muted-2); font-size:8px; text-transform:uppercase; }.trend-metrics strong { font-size:12px; }
.trend-card-footer { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:16px; padding-top:14px; border-top:1px solid var(--line); }.trend-card-footer a { color:var(--primary-2); font-size:10px; font-weight:800; }.monetisation-dot { position:relative; padding-left:12px; color:var(--muted-2); font-size:9px; }.monetisation-dot::before { content:""; position:absolute; left:0; top:50%; width:6px; height:6px; border-radius:50%; transform:translateY(-50%); }.monetisation-dot.active::before { background:var(--success); }.monetisation-dot.planned::before { background:var(--warning); }
.source-strip { display:flex; align-items:center; gap:12px; margin-top:26px; padding:16px 18px; border:1px solid var(--line); border-radius:14px; color:var(--muted); background:rgba(255,255,255,.022); font-size:12px; }.source-strip strong { color:var(--text); }.source-strip a { margin-left:auto; color:var(--primary-2); }
.trend-detail-icon { width:74px; height:74px; display:grid; place-items:center; flex:0 0 auto; border-radius:20px; color:var(--primary-2); background:rgba(94,234,212,.07); border:1px solid rgba(94,234,212,.16); font-size:25px; font-weight:900; }
.score-breakdown { display:grid; gap:13px; }.score-row { display:grid; grid-template-columns:155px 1fr 32px; align-items:center; gap:12px; font-size:12px; }.score-row span { color:var(--muted); }.score-row strong { text-align:right; }
.matched-products { display:grid; gap:10px; }.matched-product { display:grid; grid-template-columns:48px 1fr auto; align-items:center; gap:13px; padding:14px; border:1px solid var(--line); border-radius:13px; background:rgba(255,255,255,.023); }.matched-product > div:nth-child(2) { display:grid; gap:3px; }.matched-product span { color:var(--muted); font-size:11px; }.matched-product small { color:var(--primary-2); font-size:9px; }.no-match { padding:18px; border:1px dashed var(--line); border-radius:13px; color:var(--muted); }.no-match p { margin-bottom:0; }
.network-chips { display:flex; flex-wrap:wrap; gap:7px; }.network-chips span { padding:7px 9px; border:1px solid var(--line); border-radius:9px; color:var(--muted); font-size:10px; }
.security-banner { display:flex; gap:10px; margin-bottom:25px; padding:17px 18px; border:1px solid rgba(74,222,128,.20); border-radius:14px; background:rgba(74,222,128,.055); color:var(--muted); font-size:12px; }.security-banner strong { color:var(--success); }
.connector-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }.connector-card { padding:24px; border:1px solid var(--line); border-radius:19px; background:var(--surface); }.connector-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }.connector-head h3 { margin:4px 0 0; font-size:23px; }.connector-card > p { color:var(--muted); font-size:13px; }.connector-status { padding:6px 9px; border-radius:999px; font-size:9px; font-weight:850; white-space:nowrap; }.connector-status.active { color:var(--success); background:rgba(74,222,128,.09); }.connector-status.pending { color:var(--warning); background:rgba(251,191,36,.09); }.connector-status.research { color:#93c5fd; background:rgba(96,165,250,.09); }
.connector-facts { display:grid; gap:8px; margin:18px 0; }.connector-facts div { display:grid; gap:3px; padding:11px; border:1px solid var(--line); border-radius:10px; background:rgba(255,255,255,.022); }.connector-facts span { color:var(--muted-2); font-size:8px; text-transform:uppercase; letter-spacing:.08em; }.connector-facts strong { font-size:11px; }
.automation-flow { display:flex; align-items:center; justify-content:space-between; gap:12px; }.automation-flow > div { flex:1; min-height:150px; display:grid; align-content:center; gap:6px; padding:18px; border:1px solid var(--line); border-radius:15px; background:var(--surface); }.automation-flow > div span { color:var(--primary-2); font-size:10px; font-weight:850; }.automation-flow > div strong { font-size:15px; }.automation-flow > div small { color:var(--muted); }.automation-flow > i { color:var(--muted-2); font-style:normal; }
.priority-list { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }.priority-list article { display:flex; gap:15px; padding:20px; border:1px solid var(--line); border-radius:15px; background:var(--surface); }.priority-list article > span { width:36px; height:36px; display:grid; place-items:center; flex:0 0 auto; border-radius:10px; color:var(--primary-2); background:rgba(94,234,212,.07); font-weight:900; }.priority-list strong { font-size:16px; }.priority-list p { margin:4px 0 0; color:var(--muted); font-size:12px; }

@media (max-width:980px) { .trend-grid,.full-trend-grid { grid-template-columns:repeat(2,1fr); }.connector-grid { grid-template-columns:1fr; }.automation-flow { display:grid; grid-template-columns:1fr; }.automation-flow > i { display:none; }.priority-list { grid-template-columns:1fr; } }
@media (max-width:760px) { .trend-hero h1 { font-size:clamp(38px,12vw,54px); line-height:1.02; }.main-nav { max-height:calc(100vh - 92px); overflow:auto; }.trend-grid,.full-trend-grid { grid-template-columns:1fr; }.radar-readout { grid-template-columns:1fr; }.source-strip { align-items:flex-start; flex-direction:column; }.source-strip a { margin-left:0; }.score-row { grid-template-columns:110px 1fr 28px; }.matched-product { grid-template-columns:48px 1fr; }.matched-product .button { grid-column:1/-1; width:100%; }.security-banner { flex-direction:column; } }
@media (max-width:480px) { .trend-hero { min-height:auto; padding-top:45px; }.trend-hero h1 { font-size:40px; }.hero-lead { font-size:15px; }.trust-row { display:grid; grid-template-columns:repeat(3,1fr); }.trust-row div { min-width:0; }.trust-row span { font-size:9px; }.radar-console { padding:12px; }.radar-orbit { max-width:300px; }.trend-card { min-height:365px; }.trend-metrics { grid-template-columns:1fr; }.trend-card-footer { align-items:flex-start; flex-direction:column; }.opportunity-actions .button { width:100%; }.trend-detail-icon { width:58px; height:58px; border-radius:16px; }.tool-title-line { gap:12px; }.tool-page-hero h1 { font-size:42px; }.newsletter-card > .button { width:100%; } }


/* TrendPilot AI v0.4 Product Matcher */
.feed-product {
  grid-template-columns: 74px 1fr auto;
}
.matched-product-image {
  width: 66px;
  height: 66px;
  object-fit: cover;
  border-radius: 13px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.04);
}
.matched-product-image.placeholder {
  display: grid;
  place-items: center;
  color: var(--primary-2);
  font-size: 22px;
}
.feed-product s {
  margin-left: 6px;
  color: var(--muted-2);
}
.matcher-stamp {
  margin: 4px 0 0;
  padding: 11px 13px;
  border: 1px solid rgba(94,234,212,.16);
  border-radius: 11px;
  color: var(--muted-2);
  background: rgba(94,234,212,.035);
  font-size: 10px;
}
@media (max-width: 640px) {
  .feed-product {
    grid-template-columns: 58px 1fr;
  }
  .feed-product .button {
    grid-column: 1 / -1;
    width: 100%;
  }
  .matched-product-image {
    width: 54px;
    height: 54px;
  }
}


/* TrendPilot AI — catalogue price clarity update */
.product-pricing-intro {
  margin: -2px 0 18px;
  max-width: 760px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.7;
}
.product-price-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 8px;
  color: var(--muted-2) !important;
  line-height: 1.45;
}
.catalogue-price {
  color: var(--primary-2);
  font-size: 11px;
  font-weight: 850;
}
.price-prefix {
  color: var(--muted);
  font-size: 9px;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.catalogue-estimate {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 3px 7px;
  border: 1px solid rgba(251,191,36,.18);
  border-radius: 999px;
  color: var(--warning);
  background: rgba(251,191,36,.055);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .025em;
}
.match-indicator {
  color: var(--muted-2);
  font-size: 8px;
}
.pricing-disclaimer {
  display: grid;
  gap: 5px;
  margin-top: 4px;
  padding: 13px 14px;
  border: 1px solid rgba(251,191,36,.18);
  border-radius: 12px;
  background: rgba(251,191,36,.045);
}
.pricing-disclaimer strong {
  color: var(--warning);
  font-size: 10px;
}
.pricing-disclaimer span,
.pricing-disclaimer small {
  color: var(--muted);
  font-size: 9px;
  line-height: 1.55;
}
.pricing-disclaimer small {
  color: var(--muted-2);
}
@media (max-width: 640px) {
  .product-pricing-intro {
    font-size: 11px;
  }
  .product-price-row {
    gap: 5px 7px;
  }
  .catalogue-price {
    font-size: 10px;
  }
}


/* ======================================================================
   TrendPilot AI v2.0.0 — bright, visual, product-first public interface
   ====================================================================== */
:root {
  --bg: #f7f8ff;
  --bg-soft: #eef4ff;
  --surface: rgba(255, 255, 255, 0.9);
  --surface-strong: #ffffff;
  --surface-light: #f5f7ff;
  --text: #17182f;
  --muted: #667085;
  --muted-2: #8b93a7;
  --line: rgba(30, 38, 73, 0.11);
  --primary: #6757f6;
  --primary-2: #15bfae;
  --primary-3: #3b8cff;
  --accent: #ff785a;
  --success: #16a878;
  --warning: #f4a340;
  --shadow: 0 24px 65px rgba(55, 65, 120, 0.14);
  --shadow-soft: 0 14px 38px rgba(55, 65, 120, 0.1);
}

body.bright-site,
body {
  color: var(--text);
  background:
    radial-gradient(circle at 7% 4%, rgba(103, 87, 246, 0.13), transparent 25%),
    radial-gradient(circle at 92% 8%, rgba(21, 191, 174, 0.13), transparent 23%),
    linear-gradient(180deg, #fbfcff 0%, #f5f8ff 55%, #ffffff 100%);
}

.site-header {
  background: rgba(255, 255, 255, 0.84);
  border-bottom: 1px solid rgba(30, 38, 73, 0.07);
  box-shadow: 0 6px 30px rgba(55, 65, 120, 0.04);
}
.site-header.scrolled { background: rgba(255, 255, 255, 0.96); border-color: var(--line); }
.main-nav a { color: #5c6478; }
.main-nav a:hover { color: var(--primary); }
.menu-button { background: #fff; border-color: var(--line); box-shadow: var(--shadow-soft); }
.menu-button span { background: var(--text); }
.brand strong { color: var(--primary-2); }

.button { min-height: 50px; border-radius: 16px; font-weight: 800; }
.button-primary {
  color: #fff;
  border: 0;
  background: linear-gradient(135deg, var(--primary), #7c4dff 55%, #8f5bff);
  box-shadow: 0 16px 35px rgba(103, 87, 246, 0.28);
}
.button-primary:hover { transform: translateY(-2px); box-shadow: 0 20px 42px rgba(103, 87, 246, 0.34); }
.button-outline { color: var(--text); background: #fff; border: 1px solid var(--line); box-shadow: 0 10px 26px rgba(55, 65, 120, 0.06); }
.button-soft { color: #4438ad; background: #eceaff; border: 1px solid #dedaff; }

.section { padding: 88px 0; }
.section-soft { background: linear-gradient(180deg, rgba(237, 243, 255, 0.72), rgba(247, 250, 255, 0.92)); border-block: 1px solid rgba(30, 38, 73, 0.06); }
.kicker { color: var(--primary); font-weight: 850; letter-spacing: .14em; }

.hero-v2 { padding-top: 72px; overflow: hidden; }
.hero-v2::before,
.hero-v2::after { content: ""; position: absolute; border-radius: 999px; filter: blur(2px); pointer-events: none; }
.hero-v2::before { width: 320px; height: 320px; right: -120px; top: 70px; background: rgba(255, 181, 132, .28); }
.hero-v2::after { width: 240px; height: 240px; left: -100px; bottom: 30px; background: rgba(78, 211, 196, .22); }
.hero-v2-grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(440px, 1.05fr); align-items: center; gap: 68px; }
.hero-copy-v2 { position: relative; z-index: 2; }
.hero-badge { display: inline-flex; align-items: center; gap: 10px; padding: 8px 13px; border-radius: 999px; color: #4b3bc4; background: #eeecff; border: 1px solid #dfdbff; font-size: 13px; font-weight: 800; }
.hero-badge span { width: 9px; height: 9px; border-radius: 50%; background: var(--primary-2); box-shadow: 0 0 0 6px rgba(21, 191, 174, .14); }
.hero-copy-v2 h1 { max-width: 760px; margin: 24px 0 20px; font-size: clamp(48px, 6vw, 78px); line-height: .98; letter-spacing: -.055em; }
.hero-copy-v2 > p { max-width: 680px; margin: 0; color: var(--muted); font-size: clamp(18px, 2.2vw, 22px); line-height: 1.75; }
.hero-copy-v2 .hero-actions { margin-top: 30px; }
.hero-proof { display: flex; flex-wrap: wrap; gap: 12px 20px; margin-top: 28px; color: #596175; font-size: 14px; font-weight: 700; }
.hero-proof span { display: inline-flex; align-items: center; gap: 7px; }
.hero-proof i { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: #fff; background: var(--success); font-style: normal; font-size: 12px; }

.hero-product-gallery { position: relative; min-height: 560px; z-index: 2; }
.hero-product-gallery::before { content: ""; position: absolute; inset: 8% 5% 7%; border-radius: 54px; background: linear-gradient(145deg, rgba(103, 87, 246, .16), rgba(21, 191, 174, .14), rgba(255, 120, 90, .14)); transform: rotate(-3deg); }
.gallery-card { position: absolute; display: grid; grid-template-columns: 120px 1fr; gap: 16px; align-items: center; width: min(430px, 82%); padding: 14px; border-radius: 25px; background: rgba(255,255,255,.95); border: 1px solid rgba(255,255,255,.8); box-shadow: 0 26px 70px rgba(57, 63, 111, .18); transition: transform .25s ease, box-shadow .25s ease; }
.gallery-card:hover { transform: translateY(-5px) rotate(0deg) !important; box-shadow: 0 32px 80px rgba(57, 63, 111, .23); }
.gallery-card-1 { top: 2%; left: 2%; transform: rotate(-3deg); animation: floatA 7s ease-in-out infinite; }
.gallery-card-2 { top: 33%; right: 0; transform: rotate(3deg); animation: floatB 8s ease-in-out infinite; }
.gallery-card-3 { bottom: 1%; left: 8%; transform: rotate(-1deg); animation: floatA 9s ease-in-out infinite reverse; }
.gallery-card > div:last-child { min-width: 0; }
.gallery-card span { color: var(--primary); font-size: 12px; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
.gallery-card strong { display: -webkit-box; margin: 5px 0 7px; overflow: hidden; color: var(--text); font-size: 17px; line-height: 1.3; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.gallery-card small { color: var(--muted); font-weight: 650; }
.gallery-loading { position: absolute; inset: 10%; display: grid; gap: 18px; }
.gallery-loading span { display: block; border-radius: 24px; background: linear-gradient(90deg, #f0f2fb, #fff, #f0f2fb); background-size: 220% 100%; animation: shimmer 1.8s infinite; }

.offer-media { position: relative; overflow: hidden; display: grid; place-items: center; background: linear-gradient(145deg, var(--media-a, #ebe8ff), var(--media-b, #dffaf5)); }
.offer-media img { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; object-fit: contain; padding: 10px; background: #fff; opacity: 0; transition: opacity .3s ease, transform .35s ease; }
.offer-media.image-ready img { opacity: 1; }
.offer-media-fallback { position: relative; z-index: 1; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 18px; color: #fff; background: linear-gradient(135deg, var(--media-a, #6757f6), var(--media-b, #15bfae)); font-size: 18px; font-weight: 900; box-shadow: 0 14px 26px rgba(70, 73, 120, .2); }
.offer-media-gallery { width: 120px; height: 112px; border-radius: 18px; }
.offer-media-trend { width: 100%; aspect-ratio: 16/10; }
.offer-media-product { width: 100%; aspect-ratio: 1/1; }
.offer-media-hero { width: 100%; height: 100%; min-height: 480px; border-radius: 34px; }

.stat-ribbon { position: relative; z-index: 3; display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 42px; padding: 20px 24px; border: 1px solid rgba(30, 38, 73, .08); border-radius: 24px; background: rgba(255,255,255,.9); box-shadow: var(--shadow-soft); }
.stat-ribbon div { display: flex; align-items: baseline; justify-content: center; gap: 8px; padding: 8px 18px; border-right: 1px solid var(--line); }
.stat-ribbon div:last-child { border-right: 0; }
.stat-ribbon strong { font-size: 27px; color: var(--primary); }
.stat-ribbon span { color: var(--muted); font-size: 13px; font-weight: 750; }

.section-heading-v2 { display: flex; justify-content: space-between; gap: 40px; align-items: end; margin-bottom: 32px; }
.section-heading-v2 h2 { margin: 8px 0 0; max-width: 760px; font-size: clamp(34px, 4.4vw, 54px); line-height: 1.06; letter-spacing: -.045em; }
.section-heading-v2 > p { max-width: 460px; margin: 0; color: var(--muted); }

.verified-trend-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.verified-trend-card { overflow: hidden; border: 1px solid rgba(30, 38, 73, .09); border-radius: 26px; background: #fff; box-shadow: var(--shadow-soft); transition: transform .25s ease, box-shadow .25s ease; }
.verified-trend-card:hover { transform: translateY(-7px); box-shadow: var(--shadow); }
.trend-card-media { position: relative; display: block; overflow: hidden; background: #f0f3ff; }
.trend-card-media:hover img { transform: scale(1.035); }
.trend-stage-v2,
.trend-score-v2 { position: absolute; z-index: 4; top: 14px; border-radius: 999px; backdrop-filter: blur(12px); font-weight: 850; }
.trend-stage-v2 { left: 14px; padding: 7px 11px; color: #315a53; background: rgba(224, 255, 247, .9); border: 1px solid rgba(21, 191, 174, .25); font-size: 12px; }
.trend-score-v2 { right: 14px; display: grid; place-items: center; width: 44px; height: 44px; color: #fff; background: linear-gradient(135deg, var(--primary), #9064ff); box-shadow: 0 10px 22px rgba(103, 87, 246, .28); }
.trend-card-body-v2 { padding: 22px; }
.trend-card-body-v2 h3 { margin: 7px 0 10px; font-size: 25px; line-height: 1.16; letter-spacing: -.03em; }
.trend-card-body-v2 p { min-height: 76px; margin: 0; color: var(--muted); font-size: 14px; }
.best-product-line { margin-top: 18px; padding: 13px 14px; border-radius: 15px; background: #f7f7ff; border: 1px solid #ecebfa; }
.best-product-line span { display: block; color: var(--muted-2); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.best-product-line strong { display: -webkit-box; margin-top: 3px; overflow: hidden; font-size: 13px; line-height: 1.4; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.trend-card-footer-v2 { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 13px; font-weight: 800; }
.trend-card-footer-v2 span { color: var(--success); }
.trend-card-footer-v2 a { color: var(--primary); }

.offer-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.offer-card { overflow: hidden; border: 1px solid rgba(30, 38, 73, .09); border-radius: 24px; background: #fff; box-shadow: var(--shadow-soft); transition: transform .25s ease, box-shadow .25s ease; }
.offer-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.offer-card-media-link { position: relative; display: block; }
.offer-card-media-link:hover img { transform: scale(1.04); }
.offer-rank { position: absolute; z-index: 4; top: 13px; left: 13px; display: grid; place-items: center; min-width: 38px; height: 38px; padding: 0 9px; color: #fff; border-radius: 13px; background: #17182f; font-weight: 900; }
.verified-corner { position: absolute; z-index: 4; right: 12px; bottom: 12px; padding: 7px 10px; border-radius: 999px; color: #10775b; background: rgba(229, 255, 247, .94); border: 1px solid rgba(22, 168, 120, .22); font-size: 10px; font-weight: 900; }
.offer-card-body { padding: 18px; }
.offer-source-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 11px; font-weight: 750; }
.discount-chip { padding: 4px 7px; border-radius: 8px; color: #c44a2f; background: #fff0ec; }
.offer-card h3 { display: -webkit-box; min-height: 66px; margin: 10px 0 16px; overflow: hidden; font-size: 16px; line-height: 1.38; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.offer-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.price-block strong { display: block; color: var(--primary); font-size: 17px; }
.price-block del { color: var(--muted-2); font-size: 11px; }
.round-action { display: grid; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; color: #fff; border-radius: 15px; background: linear-gradient(135deg, var(--primary), #8e5dfd); box-shadow: 0 10px 22px rgba(103, 87, 246, .25); font-size: 18px; }
.quality-line { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 10px; margin-top: 15px; color: var(--muted); font-size: 10px; font-weight: 800; }
.quality-line i { position: relative; height: 5px; overflow: hidden; border-radius: 999px; background: #eceffa; }
.quality-line i::after { content: ""; position: absolute; inset: 0; width: var(--quality); border-radius: inherit; background: linear-gradient(90deg, var(--primary-2), var(--primary)); }

.trust-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.trust-card { position: relative; padding: 28px; border: 1px solid rgba(30,38,73,.08); border-radius: 25px; background: #fff; box-shadow: var(--shadow-soft); }
.trust-card > span { position: absolute; right: 22px; top: 18px; color: #d9dcef; font-size: 34px; font-weight: 950; }
.trust-icon { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 18px; color: #fff; background: linear-gradient(135deg, var(--primary), var(--primary-2)); font-size: 24px; box-shadow: 0 14px 28px rgba(80, 91, 160, .18); }
.trust-card h3 { margin: 22px 0 8px; font-size: 22px; }
.trust-card p { margin: 0; color: var(--muted); }

.disclosure-v2 { color: #525a70; background: #f0f4ff; border-top: 1px solid var(--line); }
.site-footer-v2 { color: var(--text); background: #fff; border-top: 1px solid var(--line); }
.site-footer-v2 .footer-brand p,
.site-footer-v2 .footer-bottom,
.site-footer-v2 .footer-links a { color: var(--muted); }

.subpage-hero-v2 { padding: 76px 0 54px; }
.subpage-hero-grid { display: grid; grid-template-columns: 1fr auto; gap: 46px; align-items: center; padding: 42px; border: 1px solid rgba(30,38,73,.08); border-radius: 32px; background: linear-gradient(135deg, #fff, #f0f4ff 62%, #e9fbf7); box-shadow: var(--shadow-soft); }
.subpage-hero-grid h1 { max-width: 760px; margin: 8px 0 14px; font-size: clamp(42px, 6vw, 68px); line-height: 1; letter-spacing: -.05em; }
.subpage-hero-grid p { max-width: 730px; margin: 0; color: var(--muted); font-size: 18px; }
.verified-seal { display: grid; place-items: center; min-width: 180px; min-height: 180px; padding: 24px; text-align: center; border-radius: 50%; background: #fff; border: 10px solid rgba(103,87,246,.09); box-shadow: 0 20px 45px rgba(55,65,120,.12); }
.verified-seal strong { color: var(--primary); font-size: 44px; line-height: 1; }
.verified-seal span { margin-top: 6px; font-weight: 850; }
.verified-seal small { color: var(--muted); }
.filter-panel-v2 { position: sticky; top: 88px; z-index: 15; display: grid; gap: 14px; margin-bottom: 28px; padding: 16px; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.92); box-shadow: var(--shadow-soft); backdrop-filter: blur(16px); }
.search-box-v2 { display: flex; align-items: center; gap: 10px; padding: 0 15px; border: 1px solid var(--line); border-radius: 15px; background: #f7f8ff; }
.search-box-v2 input { width: 100%; min-height: 48px; color: var(--text); border: 0; outline: 0; background: transparent; }
.filter-buttons-v2 { display: flex; flex-wrap: wrap; gap: 8px; }
.filter-button-v2 { padding: 9px 13px; color: #596175; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-weight: 750; cursor: pointer; }
.filter-button-v2.active { color: #fff; border-color: transparent; background: linear-gradient(135deg, var(--primary), #8c5dff); }
.empty-state-v2 { padding: 70px 20px; text-align: center; border: 1px dashed var(--line); border-radius: 26px; background: #fff; }
.empty-state-v2 > div { font-size: 42px; }
.empty-state-v2 h2 { margin: 10px 0 5px; }
.empty-state-v2 p { margin: 0; color: var(--muted); }

.trend-detail-hero { padding: 70px 0 40px; }
.trend-detail-grid { display: grid; grid-template-columns: minmax(360px, .9fr) minmax(0, 1.1fr); gap: 52px; align-items: center; }
.trend-hero-media { position: relative; overflow: hidden; min-height: 540px; padding: 18px; border-radius: 40px; background: linear-gradient(145deg, #eae8ff, #dffbf6); box-shadow: var(--shadow); }
.trend-hero-media .offer-media { height: 100%; }
.hero-media-caption { position: absolute; z-index: 5; left: 36px; right: 36px; bottom: 36px; padding: 17px 19px; border-radius: 18px; background: rgba(255,255,255,.92); box-shadow: 0 14px 36px rgba(45,55,100,.16); backdrop-filter: blur(16px); }
.hero-media-caption span { display: block; color: var(--primary); font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; }
.hero-media-caption strong { display: -webkit-box; margin: 4px 0; overflow: hidden; font-size: 15px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.hero-media-caption small { color: var(--muted); }
.back-link-v2 { display: inline-flex; color: var(--muted); font-weight: 750; }
.trend-label-row { display: flex; align-items: center; gap: 12px; margin-top: 28px; }
.verified-pill { display: inline-flex; width: fit-content; padding: 7px 10px; color: #10775b; border: 1px solid rgba(22,168,120,.2); border-radius: 999px; background: #e9fff8; font-size: 11px; font-weight: 900; }
.trend-hero-info h1 { margin: 14px 0 18px; font-size: clamp(48px, 7vw, 82px); line-height: .97; letter-spacing: -.055em; }
.trend-hero-info > p { margin: 0; color: var(--muted); font-size: 20px; line-height: 1.75; }
.best-offer-summary { display: grid; grid-template-columns: 1.4fr .8fr .65fr; gap: 10px; margin-top: 26px; }
.best-offer-summary div { padding: 14px; border-radius: 15px; background: #fff; border: 1px solid var(--line); box-shadow: 0 8px 22px rgba(55,65,120,.06); }
.best-offer-summary span { display: block; color: var(--muted-2); font-size: 10px; font-weight: 850; text-transform: uppercase; }
.best-offer-summary strong { display: -webkit-box; margin-top: 4px; overflow: hidden; font-size: 13px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.offer-grid-detail { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.insight-layout { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 28px; align-items: start; }
.insight-main { display: grid; gap: 20px; }
.content-panel-v2,
.trend-summary-card { padding: 28px; border: 1px solid var(--line); border-radius: 25px; background: #fff; box-shadow: var(--shadow-soft); }
.content-panel-v2 h2 { margin: 8px 0 12px; font-size: 30px; }
.content-panel-v2 p { color: var(--muted); }
.trend-summary-card { position: sticky; top: 100px; display: grid; gap: 0; }
.trend-summary-card > div { display: flex; justify-content: space-between; gap: 14px; padding: 15px 0; border-bottom: 1px solid var(--line); }
.trend-summary-card > div:last-child { border-bottom: 0; }
.trend-summary-card span { color: var(--muted); }
.score-breakdown-v2 { display: grid; gap: 14px; }
.score-row-v2 { display: grid; grid-template-columns: 180px 1fr 38px; align-items: center; gap: 14px; }
.score-row-v2 > div { position: relative; height: 9px; overflow: hidden; border-radius: 999px; background: #edf0f8; }
.score-row-v2 i { position: absolute; inset: 0; width: var(--value); border-radius: inherit; background: linear-gradient(90deg, var(--primary-2), var(--primary)); }
.idea-tags-v2 { display: flex; flex-wrap: wrap; gap: 8px; }
.idea-tags-v2 span { padding: 8px 11px; color: #5144b7; border-radius: 10px; background: #f0efff; font-size: 12px; font-weight: 750; }
.content-angle-grid-v2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 18px; }
.content-angle-grid-v2 article { padding: 16px; border-radius: 15px; background: #f8f9ff; border: 1px solid #eceef7; }
.content-angle-grid-v2 span { display: block; color: var(--muted-2); font-size: 10px; font-weight: 850; text-transform: uppercase; }
.content-angle-grid-v2 strong { display: block; margin-top: 5px; font-size: 14px; }

/* Bright treatment for the existing secondary pages. */
.subpage-hero,
.tool-page-hero,
.legal-page { color: var(--text); background: transparent; }
.tool-card,
.programme-card,
.connector-card,
.content-panel,
.sidebar-card,
.affiliate-summary,
.legal-shell,
.accuracy-note,
.filter-bar { color: var(--text); background: #fff; border-color: var(--line); box-shadow: var(--shadow-soft); }
.tool-card p,
.programme-card p,
.connector-card p,
.sidebar-card p,
.legal-shell p,
.link-status { color: var(--muted); }
.search-box,
.filter-button { color: var(--text); background: #fff; border-color: var(--line); }
.filter-button.active { color: #fff; background: var(--primary); }

.safe-empty-card { position: absolute; inset: 15%; display: grid; place-content: center; gap: 8px; padding: 30px; text-align: center; border-radius: 30px; background: #fff; box-shadow: var(--shadow); }
.safe-empty-card span { color: var(--muted); }
.hidden { display: none !important; }

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .55s ease, transform .55s ease; }
.reveal.visible { opacity: 1; transform: none; }

@keyframes floatA { 0%,100% { translate: 0 0; } 50% { translate: 0 -9px; } }
@keyframes floatB { 0%,100% { translate: 0 0; } 50% { translate: 0 10px; } }
@keyframes shimmer { to { background-position: -220% 0; } }

@media (max-width: 1050px) {
  .hero-v2-grid { grid-template-columns: 1fr; gap: 30px; }
  .hero-product-gallery { min-height: 530px; }
  .verified-trend-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .offer-grid,
  .offer-grid-detail { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .trend-detail-grid { grid-template-columns: 1fr; }
  .trend-hero-media { min-height: 500px; }
}

@media (max-width: 760px) {
  .section { padding: 66px 0; }
  .hero-v2 { padding-top: 48px; }
  .hero-copy-v2 h1 { font-size: clamp(45px, 14vw, 62px); }
  .hero-copy-v2 > p { font-size: 17px; }
  .hero-product-gallery { min-height: 520px; margin-inline: -4px; }
  .gallery-card { grid-template-columns: 90px 1fr; width: 92%; padding: 11px; }
  .offer-media-gallery { width: 90px; height: 88px; }
  .gallery-card-1 { left: 0; }
  .gallery-card-2 { right: 0; }
  .gallery-card-3 { left: 3%; }
  .stat-ribbon { grid-template-columns: repeat(2, 1fr); padding: 12px; }
  .stat-ribbon div { border-right: 0; border-bottom: 1px solid var(--line); }
  .stat-ribbon div:nth-last-child(-n+2) { border-bottom: 0; }
  .section-heading-v2 { display: block; }
  .section-heading-v2 > p { margin-top: 14px; }
  .verified-trend-grid,
  .offer-grid,
  .offer-grid-detail,
  .trust-grid { grid-template-columns: 1fr; }
  .offer-card h3 { min-height: auto; }
  .offer-media-product { aspect-ratio: 16/10; }
  .subpage-hero-grid { grid-template-columns: 1fr; padding: 28px; }
  .verified-seal { min-width: 150px; min-height: 150px; justify-self: center; }
  .trend-detail-hero { padding-top: 44px; }
  .trend-hero-media { min-height: 410px; border-radius: 28px; }
  .offer-media-hero { min-height: 370px; }
  .hero-media-caption { left: 26px; right: 26px; bottom: 26px; }
  .trend-hero-info h1 { font-size: clamp(44px, 14vw, 64px); }
  .best-offer-summary { grid-template-columns: 1fr; }
  .insight-layout { grid-template-columns: 1fr; }
  .trend-summary-card { position: static; }
  .score-row-v2 { grid-template-columns: 120px 1fr 32px; font-size: 12px; }
  .content-angle-grid-v2 { grid-template-columns: 1fr; }
  .filter-panel-v2 { top: 76px; }
  .main-nav.open { color: var(--text); background: rgba(255,255,255,.98); border-color: var(--line); box-shadow: var(--shadow); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}


/* TrendPilot AI v2.3 — compact mobile filters and store browsing */
body.drawer-open { overflow: hidden; }

#publishedSources .section-heading-v2 h2 { font-size: clamp(32px, 4vw, 48px); }
.source-offer-carousel { scrollbar-width: thin; }

.filter-panel-v3 { position: sticky; top: 88px; z-index: 15; display: grid; grid-template-columns: minmax(260px, 430px) 1fr; gap: 14px; align-items: start; margin-bottom: 28px; padding: 16px; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.94); box-shadow: var(--shadow-soft); backdrop-filter: blur(16px); }
.filter-toggle-v3 { display: none; min-height: 50px; padding: 8px 14px; color: var(--text); border: 1px solid var(--line); border-radius: 15px; background: #fff; cursor: pointer; text-align: left; }
.filter-toggle-v3 span { display: block; color: var(--muted-2); font-size: 10px; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
.filter-toggle-v3 strong { display: block; overflow: hidden; margin-top: 2px; text-overflow: ellipsis; white-space: nowrap; }
.filter-drawer-v3 { min-width: 0; }
.filter-drawer-head, .filter-backdrop-v3 { display: none; }

.store-directory-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.store-card { display: flex; min-width: 0; flex-direction: column; padding: 22px; border: 1px solid rgba(30,38,73,.09); border-radius: 25px; background: #fff; box-shadow: var(--shadow-soft); transition: transform .25s ease, box-shadow .25s ease; }
.store-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.store-card-head { display: grid; grid-template-columns: 54px minmax(0,1fr) auto; gap: 13px; align-items: center; }
.store-avatar, .store-avatar-large { display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, var(--store-a,#6757f6), var(--store-b,#15bfae)); font-weight: 900; box-shadow: 0 14px 28px rgba(64,72,130,.2); }
.store-avatar { width: 54px; height: 54px; border-radius: 17px; }
.store-card h3 { overflow: hidden; margin: 2px 0 0; font-size: 22px; text-overflow: ellipsis; white-space: nowrap; }
.store-count { min-width: 42px; padding: 7px 9px; color: var(--primary); border-radius: 12px; background: #f1efff; text-align: center; }
.store-card > p { min-height: 66px; margin: 17px 0 14px; color: var(--muted); font-size: 14px; }
.store-category-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.store-category-chips span { padding: 6px 9px; color: #4f46a8; border-radius: 999px; background: #f2f0ff; font-size: 10px; font-weight: 800; }
.store-mini-products { display: grid; gap: 9px; min-height: 118px; margin: 18px 0; padding: 0; list-style: none; }
.store-mini-products li { display: grid; grid-template-columns: 18px minmax(0,1fr); gap: 7px; align-items: start; }
.store-mini-products span { color: var(--success); font-weight: 900; }
.store-mini-products strong { display: -webkit-box; overflow: hidden; font-size: 12px; line-height: 1.4; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.store-card-action { width: 100%; margin-top: auto; }
.store-directory-page { grid-template-columns: repeat(3, minmax(0,1fr)); }

.store-hero { padding: 72px 0 46px; background: linear-gradient(180deg, #f3f5ff, transparent); }
.store-hero-grid { display: grid; grid-template-columns: 190px minmax(0,1fr); gap: 42px; align-items: center; }
.store-avatar-large { width: 190px; height: 190px; border-radius: 48px; font-size: 52px; }
.store-hero-copy h1 { margin: 12px 0 14px; font-size: clamp(48px,7vw,78px); line-height: .98; letter-spacing: -.055em; }
.store-hero-copy > p { max-width: 760px; margin: 0; color: var(--muted); font-size: 19px; }
.store-hero-copy .kicker { display: block; margin-top: 22px; }
.store-hero-stats { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.store-hero-stats div { min-width: 150px; padding: 13px 16px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.9); box-shadow: var(--shadow-soft); }
.store-hero-stats strong { display: block; color: var(--primary); font-size: 24px; }
.store-hero-stats span { color: var(--muted); font-size: 11px; font-weight: 750; }
.store-browse-toolbar { position: sticky; top: 88px; z-index: 14; display: grid; grid-template-columns: minmax(240px,1fr) 210px; gap: 12px; margin-bottom: 16px; padding: 14px; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.95); box-shadow: var(--shadow-soft); backdrop-filter: blur(16px); }
.store-browse-toolbar .filter-drawer-v3 { grid-column: 1 / -1; }
.store-sort-label { display: grid; grid-template-columns: auto 1fr; gap: 8px; align-items: center; padding: 0 12px; border: 1px solid var(--line); border-radius: 15px; background: #fff; }
.store-sort-label span { color: var(--muted-2); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.store-sort-label select { min-width: 0; height: 48px; color: var(--text); border: 0; outline: 0; background: transparent; font-weight: 750; }
.browse-result-line { display: flex; justify-content: space-between; gap: 14px; margin: 0 2px 18px; color: var(--muted); }
.browse-result-line span { color: var(--text); font-weight: 850; }

@media (max-width: 1050px) {
  .store-directory-grid, .store-directory-page { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 760px) {
  #publishedSources .section-heading-v2 h2 { font-size: 36px; }
  .source-offer-carousel { display: flex; overflow-x: auto; gap: 14px; margin-inline: -18px; padding: 2px 18px 18px; scroll-snap-type: x mandatory; }
  .source-offer-carousel .offer-card { min-width: min(84vw, 340px); scroll-snap-align: start; }

  .filter-panel-v3 { top: 76px; grid-template-columns: minmax(0,1fr) 116px; gap: 9px; padding: 10px; border-radius: 18px; }
  .filter-panel-v3 .search-box-v2 { min-width: 0; }
  .filter-panel-v3 .search-box-v2 input { min-width: 0; font-size: 14px; }
  .filter-toggle-v3 { display: block; }
  .filter-drawer-v3 { position: fixed; z-index: 90; right: 0; bottom: 0; left: 0; max-height: min(76vh, 620px); overflow: auto; padding: 18px; border: 1px solid var(--line); border-radius: 28px 28px 0 0; background: #fff; box-shadow: 0 -24px 70px rgba(34,42,84,.24); transform: translateY(105%); visibility: hidden; transition: transform .25s ease, visibility .25s ease; }
  .filter-drawer-v3.open { transform: translateY(0); visibility: visible; }
  .filter-drawer-head { display: flex; justify-content: space-between; align-items: center; gap: 18px; margin-bottom: 16px; }
  .filter-drawer-head h2 { margin: 2px 0 0; font-size: 25px; }
  .filter-drawer-head button { display: grid; place-items: center; width: 42px; height: 42px; color: var(--text); border: 1px solid var(--line); border-radius: 50%; background: #f7f8ff; font-size: 26px; cursor: pointer; }
  .filter-backdrop-v3 { position: fixed; z-index: 89; inset: 0; display: block; background: rgba(15,22,45,.36); opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility .2s ease; }
  .filter-backdrop-v3.open { opacity: 1; visibility: visible; }
  .filter-drawer-v3 .filter-buttons-v2 { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .filter-drawer-v3 .filter-button-v2 { min-height: 48px; }

  .store-directory-grid, .store-directory-page { grid-template-columns: 1fr; }
  .store-card > p, .store-mini-products { min-height: auto; }
  .store-hero { padding-top: 44px; }
  .store-hero-grid { grid-template-columns: 1fr; gap: 24px; }
  .store-avatar-large { width: 118px; height: 118px; border-radius: 32px; font-size: 34px; }
  .store-hero-copy h1 { font-size: clamp(46px,14vw,64px); }
  .store-hero-stats { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .store-hero-stats div { min-width: 0; }
  .store-hero-stats div:last-child { grid-column: 1 / -1; }
  .store-browse-toolbar { top: 76px; grid-template-columns: minmax(0,1fr) 120px; padding: 10px; }
  .store-sort-label { grid-column: 1 / -1; }
  .store-browse-toolbar .filter-drawer-v3 { grid-column: auto; }
  .browse-result-line { align-items: flex-start; flex-direction: column; gap: 2px; }
}


/* TrendPilot AI v2.3.1 — professional store-directory polish */
.page-stores .subpage-hero-v2 {
  padding: 54px 0 34px;
}
.page-stores .subpage-hero-grid {
  gap: 32px;
  padding: 34px;
  border-radius: 28px;
}
.page-stores .subpage-hero-grid h1 {
  max-width: 680px;
  font-size: clamp(40px, 5vw, 60px);
  line-height: 1.02;
}
.page-stores .subpage-hero-grid p {
  max-width: 690px;
  font-size: 16px;
  line-height: 1.65;
}
.page-stores .verified-seal {
  min-width: 158px;
  min-height: 158px;
  border-width: 8px;
}
.page-stores .verified-seal strong {
  font-size: 39px;
}

.store-card {
  overflow: hidden;
}
.store-card-head {
  padding-bottom: 15px;
  border-bottom: 1px solid rgba(30,38,73,.07);
}
.store-card > p {
  line-height: 1.62;
}
.store-count::after {
  content: " live";
  font-size: 9px;
  font-weight: 850;
}
.store-mini-products strong {
  color: var(--text);
}
.store-card-action {
  min-height: 48px;
  border-radius: 15px;
}
.page-store .store-hero {
  padding-top: 48px;
}
.page-store .store-hero-copy > p {
  line-height: 1.65;
}
.page-store .store-hero-stats div {
  min-height: 76px;
}
.page-store .store-browse-toolbar {
  top: 82px;
}

@media (max-width: 760px) {
  .page-stores .subpage-hero-v2 {
    padding: 24px 0 20px;
  }
  .page-stores .subpage-hero-grid {
    gap: 18px;
    padding: 23px;
    border-radius: 23px;
  }
  .page-stores .subpage-hero-grid h1 {
    margin: 7px 0 12px;
    font-size: clamp(34px, 10.5vw, 43px);
    line-height: 1.04;
    letter-spacing: -.045em;
  }
  .page-stores .subpage-hero-grid p {
    font-size: 15px;
    line-height: 1.58;
  }
  .page-stores .verified-seal {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 12px;
    align-items: center;
    justify-items: start;
    width: 100%;
    min-width: 0;
    min-height: 0;
    padding: 15px 18px;
    border: 1px solid rgba(103,87,246,.12);
    border-radius: 18px;
  }
  .page-stores .verified-seal strong {
    grid-row: 1 / 3;
    font-size: 34px;
  }
  .page-stores .verified-seal span {
    margin: 0;
    font-size: 14px;
  }
  .page-stores .verified-seal small {
    font-size: 11px;
  }

  .store-directory-grid,
  .store-directory-page {
    gap: 15px;
  }
  .store-card {
    padding: 18px;
    border-radius: 21px;
    box-shadow: 0 12px 34px rgba(47,56,105,.09);
  }
  .store-card-head {
    grid-template-columns: 48px minmax(0,1fr) auto;
    gap: 11px;
    padding-bottom: 13px;
  }
  .store-avatar {
    width: 48px;
    height: 48px;
    border-radius: 15px;
  }
  .store-card h3 {
    font-size: 20px;
  }
  .store-count {
    min-width: 38px;
    padding: 6px 8px;
    font-size: 14px;
  }
  .store-card > p {
    margin: 14px 0 12px;
    font-size: 13px;
  }
  .store-category-chips {
    gap: 6px;
  }
  .store-category-chips span {
    padding: 5px 8px;
  }
  .store-mini-products {
    min-height: 0;
    margin: 14px 0 16px;
  }
  .store-mini-products li:nth-child(n+3) {
    display: none;
  }
  .store-mini-products strong {
    font-size: 12px;
  }

  .page-store .store-hero {
    padding: 28px 0 24px;
  }
  .page-store .store-hero-grid {
    grid-template-columns: 76px minmax(0,1fr);
    gap: 17px;
    align-items: start;
  }
  .page-store .store-avatar-large {
    width: 76px;
    height: 76px;
    border-radius: 23px;
    font-size: 24px;
  }
  .page-store .store-hero-copy h1 {
    margin: 6px 0 9px;
    font-size: clamp(37px, 11vw, 49px);
  }
  .page-store .store-hero-copy > p {
    grid-column: 1 / -1;
    font-size: 14px;
  }
  .page-store .store-hero-copy .kicker {
    margin-top: 10px;
  }
  .page-store .store-hero-stats {
    grid-column: 1 / -1;
    gap: 8px;
    margin-top: 17px;
  }
  .page-store .store-hero-stats div {
    min-height: 68px;
    padding: 11px 12px;
    border-radius: 14px;
  }
  .page-store .store-hero-stats strong {
    font-size: 21px;
  }
  .page-store .store-browse-toolbar {
    top: 74px;
  }
}

/* v2.4.0 — multi-source trend evidence */
.trend-source-evidence{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line,#dde3ef)}
.trend-source-title{font-size:.78rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--muted,#667085);margin-bottom:.65rem}
.trend-source-list{display:flex;flex-wrap:wrap;gap:.5rem}
.trend-source-list a,.trend-source-list span{display:inline-flex;align-items:center;max-width:100%;padding:.45rem .7rem;border:1px solid var(--line,#dde3ef);border-radius:999px;background:rgba(124,85,255,.06);color:inherit;text-decoration:none;font-size:.82rem;line-height:1.2}
.trend-source-list a:hover{border-color:#7c55ff;transform:translateY(-1px)}


/* ======================================================================
   TrendPilot AI v3.0 — research-led editorial decision pages
   ====================================================================== */
.main-nav a.active{color:var(--primary);font-weight:850}
.editorial-home-hero{padding-top:72px;overflow:hidden}
.editorial-home-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(410px,.85fr);gap:64px;align-items:center}
.editorial-home-grid h1{margin:24px 0 20px;font-size:clamp(48px,6.2vw,80px);line-height:.98;letter-spacing:-.055em}
.editorial-home-grid>div:first-child>p{max-width:720px;color:var(--muted);font-size:20px;line-height:1.75}
.decision-board{padding:22px;border:1px solid rgba(30,38,73,.09);border-radius:30px;background:rgba(255,255,255,.95);box-shadow:var(--shadow)}
.decision-board-head{padding:10px 10px 18px}.decision-board-head span{display:block;color:var(--primary);font-size:12px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.decision-board-head strong{font-size:23px}
.decision-board>a{display:grid;grid-template-columns:46px 1fr auto;gap:14px;align-items:center;padding:18px 12px;border-top:1px solid var(--line);transition:transform .2s ease,background .2s ease}
.decision-board>a:hover{transform:translateX(4px);background:#f8f8ff}.decision-board>a>b{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;color:#fff;background:linear-gradient(135deg,var(--primary),var(--primary-2))}.decision-board>a div strong{display:block;font-size:15px}.decision-board>a div span{display:block;margin-top:3px;color:var(--muted);font-size:12px}.decision-board>a>i{color:var(--primary);font-style:normal;font-size:22px}
.editorial-stats{margin-top:54px}
.editorial-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.editorial-card{display:flex;flex-direction:column;min-height:265px;padding:27px;border:1px solid rgba(30,38,73,.09);border-radius:25px;background:#fff;box-shadow:var(--shadow-soft);transition:transform .22s ease,box-shadow .22s ease}
.editorial-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}.editorial-card>span{color:var(--primary);font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.editorial-card h3{margin:13px 0 10px;font-size:27px;line-height:1.1;letter-spacing:-.035em}.editorial-card p{margin:0 0 24px;color:var(--muted)}.editorial-card b{margin-top:auto;color:var(--primary)}
.active-program-list{display:flex;flex-wrap:wrap;gap:12px}.active-program-list span{padding:12px 16px;border:1px solid var(--line);border-radius:999px;background:#fff;box-shadow:var(--shadow-soft);font-weight:850}
.article-hero{padding:72px 0 38px}.article-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:52px;align-items:end}.article-hero h1{max-width:920px;margin:12px 0 18px;font-size:clamp(45px,6.4vw,76px);line-height:.98;letter-spacing:-.055em}.article-hero p{max-width:820px;margin:0;color:var(--muted);font-size:19px;line-height:1.75}.article-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.article-meta span{padding:8px 11px;border-radius:999px;background:#edebff;color:#5042bf;font-size:11px;font-weight:850}.article-verdict{padding:24px;border:1px solid rgba(30,38,73,.09);border-radius:24px;background:linear-gradient(145deg,#fff,#eef9f7);box-shadow:var(--shadow-soft)}.article-verdict strong{font-size:18px}.article-verdict p{margin:8px 0 0;font-size:14px;line-height:1.6}
.article-layout-grid{display:grid;grid-template-columns:minmax(0,760px) 310px;gap:56px;align-items:start;justify-content:center}.article-content{font-size:17px;line-height:1.82}.article-content h2{margin:56px 0 16px;font-size:34px;line-height:1.12;letter-spacing:-.035em}.article-content h3{margin:28px 0 10px;font-size:22px}.article-content p{color:#4f586d}.article-content a:not(.button){color:var(--primary);text-decoration:underline;text-underline-offset:3px}.article-sidebar{position:sticky;top:98px;display:grid;gap:18px}.sidebar-card{padding:22px;border:1px solid var(--line);border-radius:21px;background:#fff;box-shadow:var(--shadow-soft)}.sidebar-card strong{font-size:17px}.sidebar-card p,.sidebar-card li{color:var(--muted);font-size:13px}.sidebar-card ul{padding-left:19px}.sidebar-card a{color:var(--primary);font-weight:800}
.article-lead{padding:22px 24px;border-left:5px solid var(--primary);border-radius:0 18px 18px 0;background:#f2f0ff}.article-lead p{margin:0;color:#363c50;font-size:18px}
.decision-table,.rating-panel{display:grid;gap:10px}.decision-table>div,.rating-panel>div{display:grid;grid-template-columns:150px 1fr;gap:20px;padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:#fff}.decision-table span,.rating-panel span{color:var(--muted)}
.comparison-table{overflow:hidden;border:1px solid var(--line);border-radius:20px;background:#fff}.comparison-row{display:grid;grid-template-columns:1.05fr 1fr 1fr;gap:16px;padding:17px 18px;border-top:1px solid var(--line);font-size:14px}.comparison-row:first-child{border-top:0}.comparison-row span{font-weight:850}.comparison-row strong{font-weight:650;color:#4f586d}.comparison-head{color:#fff;background:linear-gradient(135deg,var(--primary),#8265ff)}.comparison-head strong{color:#fff}
.checklist-grid,.choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.checklist-grid article,.choice-grid article{padding:21px;border:1px solid var(--line);border-radius:19px;background:#fff}.checklist-grid article h3{margin:0 0 8px}.checklist-grid article p{margin:0;font-size:14px}.choice-grid article>span{display:block;color:var(--primary);font-weight:900}.choice-grid ul{padding-left:19px;color:#4f586d}
.article-checklist,.warning-list{display:grid;gap:10px;padding-left:0;list-style:none}.article-checklist li,.warning-list li{padding:14px 17px 14px 45px;position:relative;border:1px solid var(--line);border-radius:15px;background:#fff;color:#4f586d}.article-checklist li:before{content:'✓';position:absolute;left:16px;top:13px;color:var(--success);font-weight:950}.warning-list li:before{content:'!';position:absolute;left:16px;top:13px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;color:#fff;background:#e85d48;font-weight:950}
.numbered-steps{counter-reset:steps;display:grid;gap:13px;padding:0;list-style:none}.numbered-steps li{position:relative;padding:17px 18px 17px 60px;border:1px solid var(--line);border-radius:17px;background:#fff;color:#4f586d}.numbered-steps li:before{counter-increment:steps;content:counter(steps);position:absolute;left:16px;top:14px;display:grid;place-items:center;width:31px;height:31px;border-radius:11px;color:#fff;background:var(--primary);font-weight:900}
.cta-panel,.dual-cta{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:28px 0;padding:22px;border:1px solid rgba(103,87,246,.17);border-radius:20px;background:#f4f2ff}.cta-panel span{display:block;color:var(--muted);font-size:13px}.dual-cta{justify-content:flex-start;flex-wrap:wrap}
.formula-box{padding:24px;border-radius:20px;color:#fff;background:linear-gradient(135deg,#17182f,#3c3f69)}.formula-box strong{display:block;font-size:20px}.formula-box span{display:block;margin-top:8px;color:#dfe3f7;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.ranked-list{display:grid;gap:16px}.ranked-list article{display:grid;grid-template-columns:54px 1fr;gap:18px;padding:22px;border:1px solid var(--line);border-radius:20px;background:#fff}.ranked-list article>b{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;color:#fff;background:linear-gradient(135deg,var(--primary),var(--primary-2));font-size:20px}.ranked-list span{color:var(--primary);font-size:11px;font-weight:900;text-transform:uppercase}.ranked-list h3{margin:4px 0}.ranked-list p{margin:0 0 8px;font-size:14px}.ranked-list a{font-weight:850}
.article-sources{margin-top:64px;padding-top:28px;border-top:1px solid var(--line)}.article-sources>p{font-size:13px}.article-sources ol{display:grid;gap:12px;padding-left:22px}.article-sources li a{display:block;font-weight:800}.article-sources li span{display:block;color:var(--muted);font-size:12px}
.editorial-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.editorial-product-card{overflow:hidden;border:1px solid var(--line);border-radius:21px;background:#fff;box-shadow:var(--shadow-soft)}.editorial-product-media{position:relative;display:grid;place-items:center;aspect-ratio:1/1;background:#f2f4fb}.editorial-product-media img{width:100%;height:100%;object-fit:contain;padding:12px;background:#fff}.editorial-product-media>span{font-size:30px;font-weight:950;color:var(--primary)}.editorial-product-media>b{position:absolute;left:12px;top:12px;padding:6px 9px;border-radius:10px;color:#fff;background:#17182f}.editorial-product-body{padding:16px}.editorial-product-source{display:flex;justify-content:space-between;gap:8px;color:var(--muted);font-size:10px;font-weight:800}.editorial-product-source em{color:var(--success);font-style:normal}.editorial-product-body h3{display:-webkit-box;min-height:66px;margin:10px 0;overflow:hidden;font-size:15px;line-height:1.45;-webkit-line-clamp:3;-webkit-box-orient:vertical}.editorial-product-meta{display:flex;justify-content:space-between;gap:10px;margin-bottom:14px;font-size:12px}.editorial-product-meta strong{color:var(--primary)}.editorial-product-meta span{color:var(--muted)}.editorial-product-body .button{width:100%;min-height:42px;padding:9px 12px;font-size:12px}.editorial-empty{grid-column:1/-1;display:grid;gap:5px;padding:28px;border:1px dashed var(--line);border-radius:20px;background:#fff;text-align:center}.editorial-empty span{color:var(--muted)}
.simple-page-hero{padding:70px 0 32px}.simple-page-hero h1{max-width:900px;margin:8px 0 12px;font-size:clamp(46px,6vw,72px);line-height:1;letter-spacing:-.05em}.simple-page-hero p{max-width:760px;color:var(--muted);font-size:19px}.simple-page-content{max-width:820px}.simple-page-content h2{margin:44px 0 12px;font-size:31px}.simple-page-content p,.simple-page-content li{color:#4f586d;font-size:17px;line-height:1.8}.contact-form{display:grid;gap:18px;max-width:760px;padding:28px;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:var(--shadow-soft)}.contact-form label{display:grid;gap:7px;font-weight:800}.contact-form input,.contact-form textarea{width:100%;padding:14px 15px;border:1px solid var(--line);border-radius:13px;background:#f9faff;color:var(--text);font:inherit}.contact-form textarea{resize:vertical}.not-found{text-align:center}.not-found span{display:block;color:#dedaff;font-size:clamp(90px,20vw,220px);font-weight:950;line-height:.8}.not-found h1{font-size:clamp(40px,6vw,68px)}.not-found p{color:var(--muted)}.not-found .hero-actions{justify-content:center}
@media(max-width:980px){.editorial-home-grid,.article-hero-grid,.article-layout-grid{grid-template-columns:1fr}.article-verdict{max-width:680px}.article-sidebar{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}.editorial-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.editorial-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.editorial-home-grid h1{font-size:44px}.decision-board{padding:14px}.decision-board>a{grid-template-columns:40px 1fr}.decision-board>a>i{display:none}.editorial-card-grid,.editorial-product-grid,.checklist-grid,.choice-grid,.article-sidebar{grid-template-columns:1fr}.article-layout-grid{gap:28px}.article-content{font-size:16px}.article-content h2{font-size:29px}.comparison-table{overflow-x:auto}.comparison-row{min-width:680px}.decision-table>div,.rating-panel>div{grid-template-columns:1fr;gap:4px}.article-hero{padding-top:44px}.article-hero h1{font-size:43px}.cta-panel{align-items:flex-start;flex-direction:column}.editorial-stats{grid-template-columns:repeat(2,1fr)}.editorial-stats div:nth-child(2){border-right:0}}

/* === TrendPilot mobile fit patch v3.0.1 — START === */
html {
  max-width: 100%;
  overflow-x: hidden;
  overflow-x: clip;
}

body,
main,
header,
footer,
section,
article,
.container,
.nav-wrap,
.article-hero-grid,
.article-layout-grid,
.article-content,
.article-sidebar,
.comparison-table,
.editorial-product-grid,
.editorial-product-card {
  min-width: 0;
  max-width: 100%;
}

img,
video,
svg,
canvas,
iframe {
  display: block;
  max-width: 100%;
}

.article-content,
.article-content p,
.article-content li,
.article-content h1,
.article-content h2,
.article-content h3,
.editorial-product-body,
.editorial-product-body h3 {
  overflow-wrap: anywhere;
  word-break: normal;
}

.article-layout-grid > *,
.article-hero-grid > *,
.editorial-product-card > *,
.comparison-row > * {
  min-width: 0;
}

@media (max-width: 760px) {
  .container {
    width: min(calc(100% - 28px), var(--container));
  }

  .site-header {
    left: 0;
    right: 0;
    width: 100%;
  }

  .nav-wrap {
    width: 100%;
    gap: 14px;
  }

  .brand {
    min-width: 0;
  }

  .article-hero {
    padding: 34px 0 24px;
  }

  .article-hero h1 {
    max-width: 100%;
    margin: 10px 0 16px;
    font-size: clamp(34px, 10.8vw, 46px);
    line-height: 1.03;
    letter-spacing: -0.045em;
  }

  .article-hero p {
    max-width: 100%;
    font-size: 16px;
    line-height: 1.62;
  }

  .article-meta {
    gap: 7px;
    margin-top: 18px;
  }

  .article-meta span {
    padding: 7px 9px;
    font-size: 10px;
  }

  .article-verdict {
    padding: 19px;
    border-radius: 20px;
  }

  .article-layout.section {
    padding-top: 18px;
    padding-bottom: 60px;
  }

  .article-layout-grid {
    width: 100%;
    gap: 28px;
  }

  .article-content {
    width: 100%;
    font-size: 16px;
    line-height: 1.72;
  }

  .article-content h2 {
    margin: 38px 0 14px;
    font-size: 28px;
    line-height: 1.13;
  }

  .article-content h3 {
    font-size: 20px;
    line-height: 1.24;
  }

  .article-lead {
    padding: 18px;
    border-left-width: 4px;
    border-radius: 0 16px 16px 0;
  }

  .article-lead p {
    font-size: 16px;
    line-height: 1.66;
  }

  /* Turn wide comparison tables into a phone-friendly two-column layout. */
  .comparison-table {
    width: 100%;
    overflow: visible;
    border-radius: 17px;
  }

  .comparison-row {
    min-width: 0 !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 0;
    padding: 0;
  }

  .comparison-row > * {
    padding: 12px 11px;
    line-height: 1.45;
  }

  .comparison-row > span {
    grid-column: 1 / -1;
    border-bottom: 1px solid var(--line);
    color: #4f586d;
    background: #f3f5fb;
    font-size: 12px;
  }

  .comparison-row > strong {
    font-size: 12px;
  }

  .comparison-row > strong + strong {
    border-left: 1px solid var(--line);
  }

  .comparison-head > span {
    color: rgba(255,255,255,.84);
    background: transparent;
  }

  .comparison-head > strong {
    color: #fff;
    font-size: 13px;
  }

  /* Compact product cards: thumbnail left, decision information right. */
  .editorial-product-grid {
    grid-template-columns: 1fr !important;
    gap: 14px;
    width: 100%;
  }

  .editorial-product-card {
    display: grid;
    grid-template-columns: 122px minmax(0, 1fr);
    align-items: stretch;
    width: 100%;
    overflow: hidden;
    border-radius: 18px;
  }

  .editorial-product-media {
    width: 100%;
    height: 100%;
    min-height: 158px;
    aspect-ratio: auto;
    border-right: 1px solid var(--line);
    background: #f7f8fc;
  }

  .editorial-product-media img {
    width: 100%;
    height: 100%;
    padding: 8px;
    object-fit: contain;
    background: #fff;
  }

  .editorial-product-media > b {
    top: 8px;
    left: 8px;
    padding: 4px 7px;
    border-radius: 8px;
    font-size: 9px;
  }

  .editorial-product-body {
    display: flex;
    min-width: 0;
    flex-direction: column;
    padding: 12px 12px 12px 13px;
  }

  .editorial-product-source {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    font-size: 9px;
  }

  .editorial-product-source span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .editorial-product-source em {
    white-space: nowrap;
  }

  .editorial-product-body h3 {
    min-height: 0;
    margin: 8px 0 10px;
    font-size: 13px;
    line-height: 1.38;
    -webkit-line-clamp: 3;
  }

  .editorial-product-meta {
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 5px 8px;
    margin-top: auto;
    margin-bottom: 10px;
    font-size: 10px;
  }

  .editorial-product-meta strong {
    max-width: 100%;
  }

  .editorial-product-body .button {
    width: 100%;
    min-height: 38px;
    padding: 8px 9px;
    border-radius: 11px;
    font-size: 10px;
    line-height: 1.2;
  }

  .checklist-grid article,
  .choice-grid article,
  .decision-table > div,
  .rating-panel > div {
    padding: 17px;
  }

  .article-sidebar {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 380px) {
  .container {
    width: min(calc(100% - 20px), var(--container));
  }

  .article-hero h1 {
    font-size: 33px;
  }

  .editorial-product-card {
    grid-template-columns: 108px minmax(0, 1fr);
  }

  .editorial-product-media {
    min-height: 150px;
  }

  .editorial-product-source em {
    display: none;
  }

  .comparison-row > * {
    padding: 10px 9px;
  }
}
/* === TrendPilot mobile fit patch v3.0.1 — END === */