/* Simplified homepage (adf-home.php). Uses the site tokens from aidiveforge-2026.css.
 * Desktop: hero + "Popular right now" side by side in the first screen, then tested
 * tools, comparisons | categories, maker strip, newsletter (~3 screens).
 * Phone: one column in the same order (~6 screens). */

.adf-h {
  --h-gap: clamp(16px, 2.4vw, 28px);
  --h-radius: 12px;
  --h-line: var(--adf-hairline, rgba(162, 189, 216, 0.16));
  --h-raised: var(--adf-surface-raised, rgba(255, 255, 255, 0.03));
  --h-muted: var(--adf-ink-muted, #9aa7b8);
  --h-fg: var(--adf-page-fg, #e8eef5);
  --h-link: var(--adf-link, #00d9ff);
  max-width: 1180px;
  margin: 0 auto;
  padding: clamp(20px, 4vw, 48px) max(16px, env(safe-area-inset-right, 0px)) 56px max(16px, env(safe-area-inset-left, 0px));
  display: grid;
  gap: calc(var(--h-gap) * 1.6);
  color: var(--h-fg);
}
.adf-h * { box-sizing: border-box; }
/* body.home .entry-content h2 (adf-theme-80s.css) is 0,2,2 — stay above it */
body .adf-h.adf-h h1, body .adf-h.adf-h h2 { margin: 0; text-wrap: balance; color: var(--h-fg); }
body .adf-h.adf-h h2 { font-size: 1.15rem; line-height: 1.3; font-weight: 700; letter-spacing: -0.005em; }
.adf-h p { margin: 0; }
.adf-h ul { list-style: none; margin: 0; padding: 0; }
.adf-h a { text-decoration: none; }
.adf-h a:focus-visible { outline: 2px solid var(--h-link); outline-offset: 2px; border-radius: 6px; }

/* ---- hero ---------------------------------------------------------------- */
.adf-h-hero { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: calc(var(--h-gap) * 1.5); align-items: start; }
.adf-h-hero__main { display: grid; gap: 14px; padding-top: 8px; min-width: 0; }
.adf-h-eyebrow { font-size: 0.78rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--h-link); }
body .adf-h.adf-h .adf-h-hero h1 { font-size: clamp(2rem, 1.4rem + 2.6vw, 3.25rem); line-height: 1.06; font-weight: 800; letter-spacing: -0.02em; }
.adf-h-lead { color: var(--h-muted); font-size: clamp(1rem, 0.95rem + 0.3vw, 1.15rem); line-height: 1.5; max-width: 46ch; }
.adf-h .adf-home-search { margin: 6px 0 0; max-width: 560px; }
.adf-h-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.adf-h-chips a {
  font-size: 0.85rem; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--h-line);
  color: var(--h-fg); background: var(--h-raised); min-height: 34px; display: inline-flex; align-items: center;
}
.adf-h-chips a:hover { border-color: var(--h-link); color: var(--h-link); }

.adf-h-hero__side { border: 1px solid var(--h-line); border-radius: var(--h-radius); background: var(--h-raised); padding: 16px; display: grid; gap: 10px; min-width: 0; }
.adf-h-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.adf-h-head > a { font-size: 0.9rem; color: var(--h-link); white-space: nowrap; }
.adf-h-head p { color: var(--h-muted); font-size: 0.92rem; margin-top: 4px; max-width: 60ch; }
.adf-h-sponsor:empty { display: none; }
.adf-h-sponsor .adf-ad-unit { margin: 4px 0 0; }

/* ---- tool rows ----------------------------------------------------------- */
.adf-h-list { display: grid; gap: 2px; }
.adf-h-tool {
  display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 12px; align-items: center;
  padding: 9px 8px; border-radius: 8px; color: var(--h-fg); min-height: 56px;
}
.adf-h-tool:hover { background: rgba(0, 217, 255, 0.06); }
.adf-h-tool__logo { width: 40px; height: 40px; border-radius: 9px; object-fit: contain; background: rgba(255, 255, 255, 0.04); }
.adf-h-tool__logo--init { display: grid; place-items: center; font-weight: 700; color: var(--h-link); border: 1px solid var(--h-line); }
.adf-h-tool__text { display: grid; gap: 1px; min-width: 0; }
.adf-h-tool__name { font-weight: 650; font-size: 0.98rem; }
.adf-h-tool__desc { color: var(--h-muted); font-size: 0.84rem; line-height: 1.35; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.adf-h-tool__price { font-size: 0.74rem; color: var(--h-muted); border: 1px solid var(--h-line); border-radius: 999px; padding: 2px 8px; white-space: nowrap; }
.adf-h-tag { font-size: 0.68rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--adf-accent-emerald, #10b981); margin-left: 4px; }

/* ---- bands --------------------------------------------------------------- */
.adf-h-band { display: grid; gap: 14px; min-width: 0; }
.adf-h-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px 14px; }
.adf-h-grid .adf-h-tool { border: 1px solid var(--h-line); background: var(--h-raised); }
.adf-h-grid .adf-h-tool__desc { -webkit-line-clamp: 2; }

.adf-h-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: calc(var(--h-gap) * 1.5); align-items: start; }
.adf-h-cmp { display: grid; gap: 6px; }
.adf-h-cmp a {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 12px; min-height: 44px;
  border: 1px solid var(--h-line); border-radius: 8px; color: var(--h-fg); font-weight: 600; font-size: 0.95rem;
}
.adf-h-cmp a:hover { border-color: var(--h-link); }
.adf-h-cmp em { font-style: normal; font-weight: 500; font-size: 0.78rem; color: var(--h-muted); text-transform: uppercase; letter-spacing: 0.06em; }
.adf-h-cats { display: flex; flex-wrap: wrap; gap: 8px; }
.adf-h-cats a {
  display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; min-height: 40px; border-radius: 8px;
  border: 1px solid var(--h-line); color: var(--h-fg); font-size: 0.92rem;
}
.adf-h-cats a span { color: var(--h-muted); font-size: 0.8rem; font-variant-numeric: tabular-nums; }
.adf-h-cats a:hover { border-color: var(--h-link); }

.adf-h-maker {
  display: flex; align-items: center; justify-content: space-between; gap: 16px 28px; flex-wrap: wrap;
  padding: 22px; border-radius: var(--h-radius); border: 1px solid rgba(0, 217, 255, 0.28);
  background: linear-gradient(120deg, rgba(0, 217, 255, 0.08), rgba(192, 132, 252, 0.06));
}
.adf-h-maker p { color: var(--h-muted); margin-top: 4px; max-width: 58ch; }
.adf-h-maker__actions { display: flex; gap: 10px; flex-wrap: wrap; }

.adf-h-news { display: grid; gap: 12px; justify-items: start; padding-top: 4px; max-width: 640px; }
.adf-h-news > :last-child, .adf-h-news > :last-child * { text-align: left; }
.adf-h-news p { color: var(--h-muted); margin-top: 4px; }
.adf-h-news form { margin: 0; }

/* ---- phone / narrow ------------------------------------------------------ */
@media (max-width: 900px) {
  .adf-h-hero, .adf-h-split { grid-template-columns: minmax(0, 1fr); }
  .adf-h-hero__side { padding: 12px; }
}
@media (max-width: 560px) {
  .adf-h { gap: 32px; padding-left: 0; padding-right: 0; }  /* the post-content wrapper already carries the side gutter */
  .adf-h-hero { gap: 20px; }
  .adf-h-lead { display: none; }                 /* the H1 + search say it; save a screen */
  .adf-h-chips { flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px; padding: 0 16px 4px; scrollbar-width: none; }
  .adf-h-chips::-webkit-scrollbar { display: none; }
  .adf-h-chips a { flex: none; }
  .adf-h-hero__side { border: 0; background: none; padding: 0; }
  .adf-h-tool { padding: 8px 4px; }
  .adf-h-grid { grid-template-columns: minmax(0, 1fr); }
  .adf-h-grid .adf-h-tool { border: 0; background: none; border-bottom: 1px solid var(--h-line); border-radius: 0; }
  .adf-h-grid .adf-h-tool__desc { -webkit-line-clamp: 1; }
  .adf-h-maker { padding: 18px; }
  .adf-h-maker__actions, .adf-h-maker__actions .adf-btn { width: 100%; }
  .adf-h-maker__actions .adf-btn { justify-content: center; text-align: center; }
}
@media (prefers-reduced-motion: reduce) { .adf-h * { transition: none !important; } }
